You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the button is disabled. |
737
-
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether the button is "soft-disabled" (disabled but still focusable). |
738
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the button is "soft-disabled" (disabled but still focusable).<br>Use this when a button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
738
739
|`href`|`href`|`string`|`''`| The URL that the link button points to. |
739
740
|`target`|`target`|`string`|`''`| Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab. |
740
741
|`trailingIcon`|`trailing-icon`|`boolean`|`false`| Whether to render the icon at the inline end of the label rather than the inline start.<br>_Note:_ Link buttons cannot have trailing icons. |
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the button is disabled. |
759
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the button is "soft-disabled" (disabled but still focusable).<br>Use this when a button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
758
760
|`href`|`href`|`string`|`''`| The URL that the link button points to. |
759
761
|`target`|`target`|`string`|`''`| Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab. |
760
762
|`trailingIcon`|`trailing-icon`|`boolean`|`false`| Whether to render the icon at the inline end of the label rather than the inline start.<br>_Note:_ Link buttons cannot have trailing icons. |
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the button is disabled. |
780
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the button is "soft-disabled" (disabled but still focusable).<br>Use this when a button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
778
781
|`href`|`href`|`string`|`''`| The URL that the link button points to. |
779
782
|`target`|`target`|`string`|`''`| Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab. |
780
783
|`trailingIcon`|`trailing-icon`|`boolean`|`false`| Whether to render the icon at the inline end of the label rather than the inline start.<br>_Note:_ Link buttons cannot have trailing icons. |
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the button is disabled. |
801
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the button is "soft-disabled" (disabled but still focusable).<br>Use this when a button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
798
802
|`href`|`href`|`string`|`''`| The URL that the link button points to. |
799
803
|`target`|`target`|`string`|`''`| Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab. |
800
804
|`trailingIcon`|`trailing-icon`|`boolean`|`false`| Whether to render the icon at the inline end of the label rather than the inline start.<br>_Note:_ Link buttons cannot have trailing icons. |
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the button is disabled. |
822
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the button is "soft-disabled" (disabled but still focusable).<br>Use this when a button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
818
823
|`href`|`href`|`string`|`''`| The URL that the link button points to. |
819
824
|`target`|`target`|`string`|`''`| Where to display the linked `href` URL for a link button. Common options include `_blank` to open in a new tab. |
820
825
|`trailingIcon`|`trailing-icon`|`boolean`|`false`| Whether to render the icon at the inline end of the label rather than the inline start.<br>_Note:_ Link buttons cannot have trailing icons. |
Copy file name to clipboardExpand all lines: docs/components/chip.md
+4Lines changed: 4 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -510,6 +510,7 @@ Token | Default value
510
510
|`href`|`href`|`string`|`''`||
511
511
|`target`|`target`|`string`|`''`||
512
512
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the chip is disabled.<br>Disabled chips are not focusable, unless `always-focusable` is set. |
513
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the chip is "soft-disabled" (disabled but still focusable).<br>Use this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
513
514
|`alwaysFocusable`|`always-focusable`|`boolean`|`false`| When true, allow disabled chips to be focused with arrow keys.<br>Add this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
514
515
|`label`|`label`|`string`|`''`| The label of the chip. |
515
516
|`hasIcon`|`has-icon`|`boolean`|`false`| Only needed for SSR.<br>Add this attribute when a chip has a `slot="icon"` to avoid a Flash Of Unstyled Content. |
@@ -539,6 +540,7 @@ Token | Default value
539
540
|`selected`|`selected`|`boolean`|`false`||
540
541
|`hasSelectedIcon`|`has-selected-icon`|`boolean`|`false`| Only needed for SSR.<br>Add this attribute when a filter chip has a `slot="selected-icon"` to avoid a Flash Of Unstyled Content. |
541
542
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the chip is disabled.<br>Disabled chips are not focusable, unless `always-focusable` is set. |
543
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the chip is "soft-disabled" (disabled but still focusable).<br>Use this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
542
544
|`alwaysFocusable`|`always-focusable`|`boolean`|`false`| When true, allow disabled chips to be focused with arrow keys.<br>Add this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
543
545
|`label`|`label`|`string`|`''`| The label of the chip. |
544
546
|`hasIcon`|`has-icon`|`boolean`|`false`| Only needed for SSR.<br>Add this attribute when a chip has a `slot="icon"` to avoid a Flash Of Unstyled Content. |
@@ -572,6 +574,7 @@ Token | Default value
572
574
|`removeOnly`|`remove-only`|`boolean`|`false`||
573
575
|`selected`|`selected`|`boolean`|`false`||
574
576
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the chip is disabled.<br>Disabled chips are not focusable, unless `always-focusable` is set. |
577
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the chip is "soft-disabled" (disabled but still focusable).<br>Use this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
575
578
|`alwaysFocusable`|`always-focusable`|`boolean`|`false`| When true, allow disabled chips to be focused with arrow keys.<br>Add this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
576
579
|`label`|`label`|`string`|`''`| The label of the chip. |
577
580
|`hasIcon`|`has-icon`|`boolean`|`false`| Only needed for SSR.<br>Add this attribute when a chip has a `slot="icon"` to avoid a Flash Of Unstyled Content. |
@@ -603,6 +606,7 @@ Token | Default value
603
606
|`href`|`href`|`string`|`''`||
604
607
|`target`|`target`|`string`|`''`||
605
608
|`disabled`|`disabled`|`boolean`|`false`| Whether or not the chip is disabled.<br>Disabled chips are not focusable, unless `always-focusable` is set. |
609
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| Whether or not the chip is "soft-disabled" (disabled but still focusable).<br>Use this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
606
610
|`alwaysFocusable`|`always-focusable`|`boolean`|`false`| When true, allow disabled chips to be focused with arrow keys.<br>Add this when a chip needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
607
611
|`label`|`label`|`string`|`''`| The label of the chip. |
608
612
|`hasIcon`|`has-icon`|`boolean`|`false`| Only needed for SSR.<br>Add this attribute when a chip has a `slot="icon"` to avoid a Flash Of Unstyled Content. |
|`disabled`|`disabled`|`boolean`|`false`| Disables the icon button and makes it non-interactive. |
469
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| "Soft-disables" the icon button (disabled but still focusable).<br>Use this when an icon button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
468
470
|`flipIconInRtl`|`flip-icon-in-rtl`|`boolean`|`false`| Flips the icon if it is in an RTL context at startup. |
469
471
|`href`|`href`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `href` resource attribute. |
470
472
|`target`|`target`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `target` attribute. |
|`disabled`|`disabled`|`boolean`|`false`| Disables the icon button and makes it non-interactive. |
502
-
|`softDisabled`|`soft-disabled`|`boolean`|`false`| "Soft-disables" the icon button (disabled but still focusable). |
504
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| "Soft-disables" the icon button (disabled but still focusable).<br>Use this when an icon button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed.|
503
505
|`flipIconInRtl`|`flip-icon-in-rtl`|`boolean`|`false`| Flips the icon if it is in an RTL context at startup. |
504
506
|`href`|`href`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `href` resource attribute. |
505
507
|`target`|`target`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `target` attribute. |
|`disabled`|`disabled`|`boolean`|`false`| Disables the icon button and makes it non-interactive. |
539
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| "Soft-disables" the icon button (disabled but still focusable).<br>Use this when an icon button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
537
540
|`flipIconInRtl`|`flip-icon-in-rtl`|`boolean`|`false`| Flips the icon if it is in an RTL context at startup. |
538
541
|`href`|`href`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `href` resource attribute. |
539
542
|`target`|`target`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `target` attribute. |
|`disabled`|`disabled`|`boolean`|`false`| Disables the icon button and makes it non-interactive. |
574
+
|`softDisabled`|`soft-disabled`|`boolean`|`false`| "Soft-disables" the icon button (disabled but still focusable).<br>Use this when an icon button needs increased visibility when disabled. See https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_disabled_controls for more guidance on when this is needed. |
571
575
|`flipIconInRtl`|`flip-icon-in-rtl`|`boolean`|`false`| Flips the icon if it is in an RTL context at startup. |
572
576
|`href`|`href`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `href` resource attribute. |
573
577
|`target`|`target`|`string`|`''`| Sets the underlying `HTMLAnchorElement`'s `target` attribute. |
Copy file name to clipboardExpand all lines: docs/components/menu.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -524,11 +524,11 @@ a sharp 0px border radius.](images/menu/theming.webp)
524
524
|`open`|`open`|`boolean`|`false`| Opens the menu and makes it visible. Alternative to the `.show()` and `.close()` methods |
525
525
|`xOffset`|`x-offset`|`number`|`0`| Offsets the menu's inline alignment from the anchor by the given number in pixels. This value is direction aware and will follow the LTR / RTL direction.<br>e.g. LTR: positive -> right, negative -> left RTL: positive -> left, negative -> right |
526
526
|`yOffset`|`y-offset`|`number`|`0`| Offsets the menu's block alignment from the anchor by the given number in pixels.<br>e.g. positive -> down, negative -> up |
527
-
|`typeaheadDelay`|`typeahead-delay`|`number`|`200`| The max time between the keystrokes of the typeahead menu behavior before it clears the typeahead buffer. |
528
-
|`anchorCorner`|`anchor-corner`|`string`|`Corner.END_START`| The corner of the anchor which to align the menu in the standard logical property style of <block>-<inline> e.g. `'end-start'`.<br>NOTE: This value may not be respected by the menu positioning algorithm if the menu would render outisde the viewport. |
529
-
|`menuCorner`|`menu-corner`|`string`|`Corner.START_START`| The corner of the menu which to align the anchor in the standard logical property style of <block>-<inline> e.g. `'start-start'`.<br>NOTE: This value may not be respected by the menu positioning algorithm if the menu would render outisde the viewport. |
530
527
|`noHorizontalFlip`|`no-horizontal-flip`|`boolean`|`false`| Disable the `flip` behavior that usually happens on the horizontal axis when the surface would render outside the viewport. |
531
528
|`noVerticalFlip`|`no-vertical-flip`|`boolean`|`false`| Disable the `flip` behavior that usually happens on the vertical axis when the surface would render outside the viewport. |
529
+
|`typeaheadDelay`|`typeahead-delay`|`number`|`200`| The max time between the keystrokes of the typeahead menu behavior before it clears the typeahead buffer. |
530
+
|`anchorCorner`|`anchor-corner`|`string`|`Corner.END_START`| The corner of the anchor which to align the menu in the standard logical property style of <block>-<inline> e.g. `'end-start'`.<br>NOTE: This value may not be respected by the menu positioning algorithm if the menu would render outisde the viewport. Use `no-horizontal-flip` or `no-vertical-flip` to force the usage of the value |
531
+
|`menuCorner`|`menu-corner`|`string`|`Corner.START_START`| The corner of the menu which to align the anchor in the standard logical property style of <block>-<inline> e.g. `'start-start'`.<br>NOTE: This value may not be respected by the menu positioning algorithm if the menu would render outisde the viewport. Use `no-horizontal-flip` or `no-vertical-flip` to force the usage of the value |
532
532
|`stayOpenOnOutsideClick`|`stay-open-on-outside-click`|`boolean`|`false`| Keeps the user clicks outside the menu.<br>NOTE: clicking outside may still cause focusout to close the menu so see `stayOpenOnFocusout`. |
533
533
|`stayOpenOnFocusout`|`stay-open-on-focusout`|`boolean`|`false`| Keeps the menu open when focus leaves the menu's composed subtree.<br>NOTE: Focusout behavior will stop propagation of the focusout event. Set this property to true to opt-out of menu's focusout handling altogether. |
534
534
|`skipRestoreFocus`|`skip-restore-focus`|`boolean`|`false`| After closing, does not restore focus to the last focused element before the menu was opened. |
0 commit comments