Handler that is called when the value changes, as the user drags. RTL #Ĭolor wheels should not be mirrored in right-to-left languages. Value visually, you can use the color.formatChannelValue method. The aria-valuetext of the element is formatted according to the user's locale automatically. You can use the color.getChannelName method. To get a localized channel name to use as a visual label, Is provided, it should be localized accordingly. import īy default, a localized string for the "hue" channel name is used as the aria-label for the ColorWheel. Grow in size when it is keyboard focused (try tabbing to it). The thumb also uses the useFocusRing hook to The element inside the thumb is used to represent the color wheel to assistive technology, and is hidden from view The track background and positioning of the thumb are provided by useColorWheel in the returned style prop for each element. This example shows how to build a simple color wheel with a draggable thumb to adjust the hue value of a color. ![]() With a more specific label, an aria-label or aria-labelledby prop may be passed instead to identify the element Hook from The state object should be passed as an option to useColorWheelīy default, useColorWheel provides an aria-label for the localized string "Hue". State is managed by the useColorWheelState Props for the visually hidden range input element. UseColorWheel returns three sets of props that you should spread onto the appropriate elements: Name
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |