ranbuch / accessibility

add accessibility to your website
MIT License
291 stars 39 forks source link

headless mode #71

Open frasza opened 5 months ago

frasza commented 5 months ago

Hey,

Thank you for the library!

It would be really cool to have option to exclude button and all the elements when initing Accessibility, so we could create our own UI and just call functions. I know we can call functions but it is a bit "annoying" how default UI can not simply be ommited.

ranbuch commented 5 months ago

Glad you like it @frasza.

Could you explain the use case? Let's say you are creating a new instance of Accessibility and override the accessibility icon's CSS to be display: none, would that do the trick?

We can add an option for not injecting the elements to the DOM and make sure the API doesn't assume access to those elements but I really want to understand the purpose. Do you want to change the look or behavior or just use the API for something else other than accessibility menu?

frasza commented 5 months ago

Hey @ranbuch,

Idea is all about creating the instance of Accessibility but without any icons/menu/css injection. Pure functionaliy.

It is true that we could simply add display: none to the icon, but its more of a 'hack' than a solution. And there are other things along icon as well.

That is why I see 'headless' more as great option, as it would only expose functions that could be called on custom UI elements.

brianteeman commented 4 months ago

This is exactly the same thing I am looking for. The options you have added to customise the icons and css etc are much more complex than simply having a headless version that we can customise and style as we want.

ranbuch commented 4 months ago

@brianteeman @frasza version 5.1.0 now supports suppressDomInjection option:

new Accessibility({ suppressDomInjection: true });

Keep me posted.