@primer/components 32.0.2-rc.859381a1 → 32.1.1-rc.b4502a34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (155) hide show
  1. package/CHANGELOG.md +13 -1
  2. package/dist/browser.esm.js +9 -2
  3. package/dist/browser.esm.js.map +1 -1
  4. package/dist/browser.umd.js +9 -2
  5. package/dist/browser.umd.js.map +1 -1
  6. package/docs/content/ActionList2.mdx +23 -3
  7. package/docs/content/Avatar.mdx +21 -1
  8. package/docs/content/AvatarStack.mdx +23 -3
  9. package/docs/content/BranchName.md +24 -4
  10. package/docs/content/Breadcrumbs.md +22 -1
  11. package/docs/content/Buttons.md +2 -1
  12. package/docs/content/Checkbox.md +118 -0
  13. package/docs/content/CircleBadge.md +1 -0
  14. package/docs/content/CircleOcticon.md +2 -1
  15. package/docs/content/CounterLabel.md +1 -1
  16. package/docs/content/Details.md +2 -1
  17. package/docs/content/Dialog.md +1 -0
  18. package/docs/content/Dialog2.mdx +1 -0
  19. package/docs/content/Dropdown.md +1 -0
  20. package/docs/content/DropdownMenu.mdx +1 -0
  21. package/docs/content/FilterList.md +1 -0
  22. package/docs/content/FilteredSearch.md +1 -0
  23. package/docs/content/Flash.md +1 -0
  24. package/docs/content/FormGroup.md +1 -0
  25. package/docs/content/Header.md +1 -0
  26. package/docs/content/Heading.md +8 -4
  27. package/docs/content/Label.md +1 -0
  28. package/docs/content/LabelGroup.md +1 -0
  29. package/docs/content/Link.md +1 -0
  30. package/docs/content/Overlay.mdx +1 -0
  31. package/docs/content/Pagehead.md +1 -0
  32. package/docs/content/Pagination.md +1 -0
  33. package/docs/content/PointerBox.md +1 -0
  34. package/docs/content/Popover.md +1 -0
  35. package/docs/content/Portal.mdx +1 -0
  36. package/docs/content/Position.md +2 -9
  37. package/docs/content/ProgressBar.mdx +1 -0
  38. package/docs/content/SelectMenu.md +1 -0
  39. package/docs/content/SideNav.md +1 -0
  40. package/docs/content/StateLabel.md +1 -0
  41. package/docs/content/StyledOcticon.md +1 -1
  42. package/docs/content/SubNav.md +1 -0
  43. package/docs/content/TabNav.md +1 -0
  44. package/docs/content/Text.md +10 -3
  45. package/docs/content/TextInput.md +9 -1
  46. package/docs/content/Timeline.md +1 -0
  47. package/docs/content/Tooltip.md +1 -0
  48. package/docs/content/Truncate.md +1 -0
  49. package/docs/content/UnderlineNav.md +1 -0
  50. package/docs/content/status.mdx +10 -0
  51. package/docs/src/@primer/gatsby-theme-doctocat/mdx-components.js +9 -0
  52. package/docs/src/@primer/gatsby-theme-doctocat/nav.yml +4 -0
  53. package/docs/src/component-statuses.js +74 -0
  54. package/lib/ActionList/Item.js +3 -3
  55. package/lib/ActionList2/Item.js +3 -1
  56. package/lib/ActionList2/List.js +1 -2
  57. package/lib/ActionList2/Selection.js +3 -1
  58. package/lib/Autocomplete/Autocomplete.d.ts +1 -0
  59. package/lib/Autocomplete/AutocompleteInput.d.ts +1 -0
  60. package/lib/Button/Button.d.ts +1 -0
  61. package/lib/Button/ButtonClose.d.ts +2 -1
  62. package/lib/Button/ButtonDanger.d.ts +1 -0
  63. package/lib/Button/ButtonInvisible.d.ts +1 -0
  64. package/lib/Button/ButtonOutline.d.ts +1 -0
  65. package/lib/Button/ButtonPrimary.d.ts +1 -0
  66. package/lib/Checkbox.d.ts +29 -0
  67. package/lib/Checkbox.js +64 -0
  68. package/lib/CircleOcticon.d.ts +1 -0
  69. package/lib/Dialog.d.ts +3 -2
  70. package/lib/Dropdown.d.ts +4 -0
  71. package/lib/DropdownMenu/DropdownButton.d.ts +2 -1
  72. package/lib/FilterList.d.ts +1 -0
  73. package/lib/Position.d.ts +4 -4
  74. package/lib/SelectMenu/SelectMenu.d.ts +10 -4
  75. package/lib/SelectMenu/SelectMenuItem.d.ts +1 -1
  76. package/lib/SelectMenu/SelectMenuModal.d.ts +1 -1
  77. package/lib/TextInputWithTokens.d.ts +1 -0
  78. package/lib/Token/AvatarToken.d.ts +1 -1
  79. package/lib/Token/IssueLabelToken.d.ts +1 -1
  80. package/lib/Token/Token.d.ts +1 -1
  81. package/lib/__tests__/ActionList2.test.d.ts +1 -0
  82. package/lib/__tests__/ActionList2.test.js +117 -0
  83. package/lib/__tests__/Checkbox.test.d.ts +2 -0
  84. package/lib/__tests__/Checkbox.test.js +189 -0
  85. package/lib/__tests__/themePreval.test.d.ts +1 -0
  86. package/lib/__tests__/themePreval.test.js +14 -0
  87. package/lib/index.d.ts +2 -0
  88. package/lib/index.js +8 -0
  89. package/lib/stories/ActionList2.stories.js +20 -6
  90. package/lib/stories/Checkbox.stories.js +227 -0
  91. package/lib/utils/testing.d.ts +1 -0
  92. package/lib/utils/testing.js +29 -0
  93. package/lib-esm/ActionList/Item.js +3 -3
  94. package/lib-esm/ActionList2/Item.js +3 -1
  95. package/lib-esm/ActionList2/List.js +1 -2
  96. package/lib-esm/ActionList2/Selection.js +3 -1
  97. package/lib-esm/Autocomplete/Autocomplete.d.ts +1 -0
  98. package/lib-esm/Autocomplete/AutocompleteInput.d.ts +1 -0
  99. package/lib-esm/Button/Button.d.ts +1 -0
  100. package/lib-esm/Button/ButtonClose.d.ts +2 -1
  101. package/lib-esm/Button/ButtonDanger.d.ts +1 -0
  102. package/lib-esm/Button/ButtonInvisible.d.ts +1 -0
  103. package/lib-esm/Button/ButtonOutline.d.ts +1 -0
  104. package/lib-esm/Button/ButtonPrimary.d.ts +1 -0
  105. package/lib-esm/Checkbox.d.ts +29 -0
  106. package/lib-esm/Checkbox.js +44 -0
  107. package/lib-esm/CircleOcticon.d.ts +1 -0
  108. package/lib-esm/Dialog.d.ts +3 -2
  109. package/lib-esm/Dropdown.d.ts +4 -0
  110. package/lib-esm/DropdownMenu/DropdownButton.d.ts +2 -1
  111. package/lib-esm/FilterList.d.ts +1 -0
  112. package/lib-esm/Position.d.ts +4 -4
  113. package/lib-esm/SelectMenu/SelectMenu.d.ts +10 -4
  114. package/lib-esm/SelectMenu/SelectMenuItem.d.ts +1 -1
  115. package/lib-esm/SelectMenu/SelectMenuModal.d.ts +1 -1
  116. package/lib-esm/TextInputWithTokens.d.ts +1 -0
  117. package/lib-esm/Token/AvatarToken.d.ts +1 -1
  118. package/lib-esm/Token/IssueLabelToken.d.ts +1 -1
  119. package/lib-esm/Token/Token.d.ts +1 -1
  120. package/lib-esm/__tests__/ActionList2.test.d.ts +1 -0
  121. package/lib-esm/__tests__/ActionList2.test.js +105 -2
  122. package/lib-esm/__tests__/Checkbox.test.d.ts +2 -0
  123. package/lib-esm/__tests__/Checkbox.test.js +169 -0
  124. package/lib-esm/__tests__/themePreval.test.d.ts +1 -0
  125. package/lib-esm/__tests__/themePreval.test.js +7 -0
  126. package/lib-esm/index.d.ts +2 -0
  127. package/lib-esm/index.js +1 -0
  128. package/lib-esm/stories/ActionList2.stories.js +20 -6
  129. package/lib-esm/stories/Checkbox.stories.js +197 -0
  130. package/lib-esm/utils/testing.d.ts +1 -0
  131. package/lib-esm/utils/testing.js +24 -0
  132. package/package-lock.json +179 -20
  133. package/package.json +2 -2
  134. package/src/ActionList/Item.tsx +2 -1
  135. package/src/ActionList2/Item.tsx +3 -2
  136. package/src/ActionList2/List.tsx +1 -6
  137. package/src/ActionList2/Selection.tsx +2 -1
  138. package/src/Checkbox.tsx +75 -0
  139. package/src/__tests__/ActionList2.test.tsx +111 -2
  140. package/src/__tests__/Checkbox.test.tsx +155 -0
  141. package/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap +13 -0
  142. package/src/__tests__/__snapshots__/Checkbox.test.tsx.snap +16 -0
  143. package/src/__tests__/__snapshots__/themePreval.test.ts.snap +3176 -0
  144. package/src/__tests__/themePreval.test.ts +8 -0
  145. package/src/index.ts +3 -0
  146. package/src/stories/ActionList2.stories.tsx +22 -8
  147. package/src/stories/Checkbox.stories.tsx +164 -0
  148. package/src/utils/testing.tsx +22 -0
  149. package/stats.html +1 -1
  150. package/docs/content/TextInputTokens.mdx +0 -89
  151. package/lib/ActionList2/Header.d.ts +0 -26
  152. package/lib/ActionList2/Header.js +0 -55
  153. package/lib-esm/ActionList2/Header.d.ts +0 -26
  154. package/lib-esm/ActionList2/Header.js +0 -44
  155. package/src/ActionList2/Header.tsx +0 -58
@@ -314,6 +314,7 @@ declare const TextInputWithTokens: React.ForwardRefExoticComponent<Pick<{
314
314
  onAnimationIterationCapture?: React.AnimationEventHandler<HTMLSpanElement> | undefined;
315
315
  onTransitionEnd?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
316
316
  onTransitionEndCapture?: React.TransitionEventHandler<HTMLSpanElement> | undefined;
317
+ css?: import("@emotion/core").InterpolationWithTheme<any>;
317
318
  disabled?: boolean | undefined;
318
319
  hasIcon?: boolean | undefined;
319
320
  contrast?: boolean | undefined;
@@ -3,5 +3,5 @@ import { TokenBaseProps } from './TokenBase';
3
3
  export interface AvatarTokenProps extends TokenBaseProps {
4
4
  avatarSrc: string;
5
5
  }
6
- declare const AvatarToken: React.ForwardRefExoticComponent<Pick<AvatarTokenProps, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "onRemove" | "isSelected" | "avatarSrc"> & React.RefAttributes<HTMLElement>>;
6
+ declare const AvatarToken: React.ForwardRefExoticComponent<Pick<AvatarTokenProps, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "onRemove" | "isSelected" | "avatarSrc"> & React.RefAttributes<HTMLElement>>;
7
7
  export default AvatarToken;
@@ -10,5 +10,5 @@ export interface IssueLabelTokenProps extends TokenBaseProps {
10
10
  */
11
11
  hideRemoveButton?: boolean;
12
12
  }
13
- declare const IssueLabelToken: React.ForwardRefExoticComponent<Pick<IssueLabelTokenProps, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "onRemove" | "isSelected" | "hideRemoveButton" | "fillColor"> & React.RefAttributes<HTMLElement>>;
13
+ declare const IssueLabelToken: React.ForwardRefExoticComponent<Pick<IssueLabelTokenProps, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "onRemove" | "isSelected" | "hideRemoveButton" | "fillColor"> & React.RefAttributes<HTMLElement>>;
14
14
  export default IssueLabelToken;
@@ -11,5 +11,5 @@ export interface TokenProps extends TokenBaseProps {
11
11
  */
12
12
  hideRemoveButton?: boolean;
13
13
  }
14
- declare const Token: React.ForwardRefExoticComponent<Pick<TokenProps & SxProp, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "sx" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "leadingVisual" | "onRemove" | "isSelected" | "hideRemoveButton"> & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
14
+ declare const Token: React.ForwardRefExoticComponent<Pick<TokenProps & SxProp, "default" | "muted" | "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "start" | "size" | "wrap" | "open" | "list" | "multiple" | "role" | "sx" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "css" | "as" | "step" | "disabled" | "selected" | "download" | "href" | "hrefLang" | "media" | "rel" | "target" | "max" | "method" | "min" | "crossOrigin" | "classID" | "useMap" | "wmode" | "integrity" | "charSet" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "async" | "defer" | "nonce" | "scoped" | "cellPadding" | "cellSpacing" | "colSpan" | "headers" | "rowSpan" | "scope" | "cols" | "rows" | "kind" | "srcLang" | "poster" | "leadingVisual" | "onRemove" | "isSelected" | "hideRemoveButton"> & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
15
15
  export default Token;
@@ -1 +1,2 @@
1
1
  import 'babel-polyfill';
2
+ import '@testing-library/jest-dom';
@@ -1,11 +1,12 @@
1
- import { cleanup, render as HTMLRender } from '@testing-library/react';
1
+ import { cleanup, render as HTMLRender, waitFor, fireEvent } from '@testing-library/react';
2
2
  import 'babel-polyfill';
3
3
  import { axe, toHaveNoViolations } from 'jest-axe';
4
4
  import React from 'react';
5
5
  import theme from '../theme';
6
6
  import { ActionList } from '../ActionList2';
7
- import { behavesAsComponent, checkExports } from '../utils/testing';
7
+ import { behavesAsComponent, checkExports, checkStoriesForAxeViolations } from '../utils/testing';
8
8
  import { BaseStyles, ThemeProvider, SSRProvider } from '..';
9
+ import '@testing-library/jest-dom';
9
10
  expect.extend(toHaveNoViolations);
10
11
 
11
12
  function SimpleActionList() {
@@ -17,6 +18,35 @@ function SimpleActionList() {
17
18
  }
18
19
 
19
20
  SimpleActionList.displayName = "SimpleActionList";
21
+ const projects = [{
22
+ name: 'Primer Backlog',
23
+ scope: 'GitHub'
24
+ }, {
25
+ name: 'Primer React',
26
+ scope: 'github/primer'
27
+ }, {
28
+ name: 'Disabled Project',
29
+ scope: 'github/primer',
30
+ disabled: true
31
+ }];
32
+
33
+ function SingleSelectListStory() {
34
+ const [selectedIndex, setSelectedIndex] = React.useState(0);
35
+ return /*#__PURE__*/React.createElement(ActionList, {
36
+ selectionVariant: "single",
37
+ showDividers: true,
38
+ role: "listbox",
39
+ "aria-label": "Select a project"
40
+ }, projects.map((project, index) => /*#__PURE__*/React.createElement(ActionList.Item, {
41
+ key: index,
42
+ role: "option",
43
+ selected: index === selectedIndex,
44
+ onSelect: () => setSelectedIndex(index),
45
+ disabled: project.disabled
46
+ }, project.name)));
47
+ }
48
+
49
+ SingleSelectListStory.displayName = "SingleSelectListStory";
20
50
  describe('ActionList', () => {
21
51
  behavesAsComponent({
22
52
  Component: ActionList,
@@ -38,4 +68,77 @@ describe('ActionList', () => {
38
68
  expect(results).toHaveNoViolations();
39
69
  cleanup();
40
70
  });
71
+ it('should fire onSelect on click and keypress', async () => {
72
+ const component = HTMLRender( /*#__PURE__*/React.createElement(SingleSelectListStory, null));
73
+ const options = await waitFor(() => component.getAllByRole('option'));
74
+ expect(options[0]).toHaveAttribute('aria-selected', 'true');
75
+ expect(options[1]).toHaveAttribute('aria-selected', 'false');
76
+ fireEvent.click(options[1]);
77
+ expect(options[0]).toHaveAttribute('aria-selected', 'false');
78
+ expect(options[1]).toHaveAttribute('aria-selected', 'true'); // We pass keycode here to navigate a implementation detail in react-testing-library
79
+ // https://github.com/testing-library/react-testing-library/issues/269#issuecomment-455854112
80
+
81
+ fireEvent.keyPress(options[0], {
82
+ key: 'Enter',
83
+ charCode: 13
84
+ });
85
+ expect(options[0]).toHaveAttribute('aria-selected', 'true');
86
+ expect(options[1]).toHaveAttribute('aria-selected', 'false');
87
+ fireEvent.keyPress(options[1], {
88
+ key: ' ',
89
+ charCode: 32
90
+ });
91
+ expect(options[0]).toHaveAttribute('aria-selected', 'false');
92
+ expect(options[1]).toHaveAttribute('aria-selected', 'true');
93
+ cleanup();
94
+ });
95
+ it('should skip onSelect on disabled items', async () => {
96
+ const component = HTMLRender( /*#__PURE__*/React.createElement(SingleSelectListStory, null));
97
+ const options = await waitFor(() => component.getAllByRole('option'));
98
+ expect(options[0]).toHaveAttribute('aria-selected', 'true');
99
+ expect(options[2]).toHaveAttribute('aria-selected', 'false');
100
+ fireEvent.click(options[2]);
101
+ expect(options[0]).toHaveAttribute('aria-selected', 'true');
102
+ expect(options[2]).toHaveAttribute('aria-selected', 'false');
103
+ fireEvent.keyPress(options[2], {
104
+ key: 'Enter',
105
+ charCode: 13
106
+ });
107
+ expect(options[0]).toHaveAttribute('aria-selected', 'true');
108
+ expect(options[2]).toHaveAttribute('aria-selected', 'false');
109
+ cleanup();
110
+ });
111
+ it('should throw when selected is provided without a selectionVariant on parent', async () => {
112
+ // we expect console.error to be called, so we suppress that in the test
113
+ const mockError = jest.spyOn(console, 'error').mockImplementation(() => jest.fn());
114
+ expect(() => {
115
+ HTMLRender( /*#__PURE__*/React.createElement(ActionList, {
116
+ showDividers: true,
117
+ role: "listbox",
118
+ "aria-label": "Select a project"
119
+ }, /*#__PURE__*/React.createElement(ActionList.Item, {
120
+ role: "option",
121
+ selected: true
122
+ }, "Primer React")));
123
+ }).toThrow('For Item to be selected, ActionList or ActionList.Group needs to have a selectionVariant defined');
124
+ cleanup();
125
+ mockError.mockRestore();
126
+ });
127
+ it('should not crash when clicking an item without an onSelect', async () => {
128
+ const component = HTMLRender( /*#__PURE__*/React.createElement(ActionList, {
129
+ role: "listbox"
130
+ }, /*#__PURE__*/React.createElement(ActionList.Item, {
131
+ role: "option"
132
+ }, "Primer React")));
133
+ const option = await waitFor(() => component.getByRole('option'));
134
+ expect(option).toBeInTheDocument();
135
+ fireEvent.click(option);
136
+ fireEvent.keyPress(option, {
137
+ key: 'Enter',
138
+ charCode: 13
139
+ });
140
+ expect(option).toBeInTheDocument();
141
+ cleanup();
142
+ });
143
+ checkStoriesForAxeViolations('ActionList2');
41
144
  });
@@ -0,0 +1,2 @@
1
+ import 'babel-polyfill';
2
+ import '@testing-library/jest-dom';
@@ -0,0 +1,169 @@
1
+ import React from 'react';
2
+ import { Checkbox } from '..';
3
+ import { behavesAsComponent, checkExports } from '../utils/testing';
4
+ import { render, cleanup } from '@testing-library/react';
5
+ import { toHaveNoViolations } from 'jest-axe';
6
+ import 'babel-polyfill';
7
+ import '@testing-library/jest-dom';
8
+ import userEvent from '@testing-library/user-event';
9
+ expect.extend(toHaveNoViolations);
10
+ describe('Checkbox', () => {
11
+ beforeEach(() => {
12
+ jest.resetAllMocks();
13
+ cleanup();
14
+ });
15
+ behavesAsComponent({
16
+ Component: Checkbox
17
+ });
18
+ checkExports('Checkbox', {
19
+ default: Checkbox
20
+ });
21
+ it('renders a valid checkbox input', () => {
22
+ const {
23
+ getByRole
24
+ } = render( /*#__PURE__*/React.createElement(Checkbox, null));
25
+ const checkbox = getByRole('checkbox');
26
+ expect(checkbox).toBeDefined();
27
+ });
28
+ it('renders an unchecked checkbox by default', () => {
29
+ const {
30
+ getByRole
31
+ } = render( /*#__PURE__*/React.createElement(Checkbox, null));
32
+ const checkbox = getByRole('checkbox');
33
+ expect(checkbox.checked).toEqual(false);
34
+ });
35
+ it('renders an active checkbox when checked attribute is passed', () => {
36
+ const handleChange = jest.fn();
37
+ const {
38
+ getByRole
39
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
40
+ checked: true,
41
+ onChange: handleChange
42
+ }));
43
+ const checkbox = getByRole('checkbox');
44
+ expect(checkbox.checked).toEqual(true);
45
+ });
46
+ it('accepts a change handler that can alter the checkbox state', () => {
47
+ const handleChange = jest.fn();
48
+ const {
49
+ getByRole
50
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
51
+ onChange: handleChange
52
+ }));
53
+ const checkbox = getByRole('checkbox');
54
+ expect(checkbox.checked).toEqual(false);
55
+ userEvent.click(checkbox);
56
+ expect(handleChange).toHaveBeenCalled();
57
+ expect(checkbox.checked).toEqual(true);
58
+ userEvent.click(checkbox);
59
+ expect(handleChange).toHaveBeenCalled();
60
+ expect(checkbox.checked).toEqual(false);
61
+ });
62
+ it('renders an indeterminate prop correctly', () => {
63
+ const handleChange = jest.fn();
64
+ const {
65
+ getByRole
66
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
67
+ indeterminate: true,
68
+ checked: true,
69
+ onChange: handleChange
70
+ }));
71
+ const checkbox = getByRole('checkbox');
72
+ expect(checkbox.indeterminate).toEqual(true);
73
+ expect(checkbox.checked).toEqual(false);
74
+ });
75
+ it('renders an inactive checkbox state correctly', () => {
76
+ const handleChange = jest.fn();
77
+ const {
78
+ getByRole,
79
+ rerender
80
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
81
+ disabled: true,
82
+ onChange: handleChange
83
+ }));
84
+ const checkbox = getByRole('checkbox');
85
+ expect(checkbox.disabled).toEqual(true);
86
+ expect(checkbox.checked).toEqual(false);
87
+ expect(checkbox).toHaveAttribute('aria-disabled', 'true');
88
+ userEvent.click(checkbox);
89
+ expect(checkbox.disabled).toEqual(true);
90
+ expect(checkbox.checked).toEqual(false);
91
+ expect(checkbox).toHaveAttribute('aria-disabled', 'true'); // remove disabled attribute and retest
92
+
93
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
94
+ onChange: handleChange
95
+ }));
96
+ expect(checkbox).toHaveAttribute('aria-disabled', 'false');
97
+ });
98
+ it('renders an uncontrolled component correctly', () => {
99
+ const {
100
+ getByRole
101
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
102
+ defaultChecked: true
103
+ }));
104
+ const checkbox = getByRole('checkbox');
105
+ expect(checkbox.checked).toEqual(true);
106
+ userEvent.click(checkbox);
107
+ expect(checkbox.checked).toEqual(false);
108
+ });
109
+ it('renders an aria-checked attribute correctly', () => {
110
+ const handleChange = jest.fn();
111
+ const {
112
+ getByRole,
113
+ rerender
114
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
115
+ checked: false,
116
+ onChange: handleChange
117
+ }));
118
+ const checkbox = getByRole('checkbox');
119
+ expect(checkbox).toHaveAttribute('aria-checked', 'false');
120
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
121
+ checked: true,
122
+ onChange: handleChange
123
+ }));
124
+ expect(checkbox).toHaveAttribute('aria-checked', 'true');
125
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
126
+ indeterminate: true,
127
+ checked: true,
128
+ onChange: handleChange
129
+ }));
130
+ expect(checkbox).toHaveAttribute('aria-checked', 'mixed');
131
+ });
132
+ it('renders an invalid aria state when validation prop indicates an error', () => {
133
+ const handleChange = jest.fn();
134
+ const {
135
+ getByRole,
136
+ rerender
137
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
138
+ onChange: handleChange
139
+ }));
140
+ const checkbox = getByRole('checkbox');
141
+ expect(checkbox).toHaveAttribute('aria-invalid', 'false');
142
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
143
+ onChange: handleChange,
144
+ validationStatus: "success"
145
+ }));
146
+ expect(checkbox).toHaveAttribute('aria-invalid', 'false');
147
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
148
+ onChange: handleChange,
149
+ validationStatus: "error"
150
+ }));
151
+ expect(checkbox).toHaveAttribute('aria-invalid', 'true');
152
+ });
153
+ it('renders an aria state indicating the field is required', () => {
154
+ const handleChange = jest.fn();
155
+ const {
156
+ getByRole,
157
+ rerender
158
+ } = render( /*#__PURE__*/React.createElement(Checkbox, {
159
+ onChange: handleChange
160
+ }));
161
+ const checkbox = getByRole('checkbox');
162
+ expect(checkbox).toHaveAttribute('aria-required', 'false');
163
+ rerender( /*#__PURE__*/React.createElement(Checkbox, {
164
+ onChange: handleChange,
165
+ required: true
166
+ }));
167
+ expect(checkbox).toHaveAttribute('aria-required', 'true');
168
+ });
169
+ });
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,7 @@
1
+ import fs from 'fs';
2
+ import path from 'path';
3
+ test('snapshot theme-preval.js', () => {
4
+ // Snapshot test the build output of theme-preval.js to catch any unexpected changes
5
+ const themePrevalFile = fs.readFileSync(path.resolve(__dirname, '../../lib/theme-preval.js'), 'utf8');
6
+ expect(themePrevalFile).toMatchSnapshot();
7
+ });
@@ -115,4 +115,6 @@ export { default as Truncate } from './Truncate';
115
115
  export type { TruncateProps } from './Truncate';
116
116
  export { default as UnderlineNav } from './UnderlineNav';
117
117
  export type { UnderlineNavProps, UnderlineNavLinkProps } from './UnderlineNav';
118
+ export { default as Checkbox } from './Checkbox';
119
+ export type { CheckboxProps } from './Checkbox';
118
120
  export { SSRProvider, useSSRSafeId } from './utils/ssr';
package/lib-esm/index.js CHANGED
@@ -70,4 +70,5 @@ export { default as Token, IssueLabelToken, AvatarToken } from './Token';
70
70
  export { default as Tooltip } from './Tooltip';
71
71
  export { default as Truncate } from './Truncate';
72
72
  export { default as UnderlineNav } from './UnderlineNav';
73
+ export { default as Checkbox } from './Checkbox';
73
74
  export { SSRProvider, useSSRSafeId } from './utils/ssr';
@@ -422,11 +422,17 @@ export function AllCombinations() {
422
422
  variant: "inline"
423
423
  }, "inline description"), /*#__PURE__*/React.createElement(ActionList.Description, {
424
424
  variant: "block"
425
- }, "Block description")), /*#__PURE__*/React.createElement(ActionList.Item, null, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null)), "L + I + T", /*#__PURE__*/React.createElement(ActionList.Description, {
425
+ }, "Block description")), /*#__PURE__*/React.createElement(ActionList.Item, {
426
+ disabled: true
427
+ }, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null)), "L + I + T", /*#__PURE__*/React.createElement(ActionList.Description, {
426
428
  variant: "inline"
427
- }, "inline description"), /*#__PURE__*/React.createElement(ActionList.TrailingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null))), /*#__PURE__*/React.createElement(ActionList.Item, null, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null)), "L + B + T", /*#__PURE__*/React.createElement(ActionList.Description, {
429
+ }, "inline description"), /*#__PURE__*/React.createElement(ActionList.TrailingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null))), /*#__PURE__*/React.createElement(ActionList.Item, {
430
+ disabled: true
431
+ }, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null)), "L + B + T", /*#__PURE__*/React.createElement(ActionList.Description, {
428
432
  variant: "block"
429
- }, "Block description"), /*#__PURE__*/React.createElement(ActionList.TrailingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null))), /*#__PURE__*/React.createElement(ActionList.Item, null, "I + B + T", /*#__PURE__*/React.createElement(ActionList.Description, {
433
+ }, "Block description"), /*#__PURE__*/React.createElement(ActionList.TrailingVisual, null, /*#__PURE__*/React.createElement(StarIcon, null))), /*#__PURE__*/React.createElement(ActionList.Item, {
434
+ disabled: true
435
+ }, "I + B + T", /*#__PURE__*/React.createElement(ActionList.Description, {
430
436
  variant: "inline"
431
437
  }, "inline description"), /*#__PURE__*/React.createElement(ActionList.Description, {
432
438
  variant: "block"
@@ -603,11 +609,13 @@ export function MemexGroupBy() {
603
609
  }];
604
610
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h1", null, "Memex GroupBy List"), /*#__PURE__*/React.createElement(ErsatzOverlay, null, /*#__PURE__*/React.createElement(ActionList, null, /*#__PURE__*/React.createElement(ActionList.Group, {
605
611
  title: "Group by",
606
- selectionVariant: "single"
612
+ selectionVariant: "single",
613
+ role: "listbox"
607
614
  }, options.map((option, index) => /*#__PURE__*/React.createElement(ActionList.Item, {
608
615
  key: index,
609
616
  selected: index === selectedIndex,
610
- onSelect: () => setSelectedIndex(index)
617
+ onSelect: () => setSelectedIndex(index),
618
+ role: "option"
611
619
  }, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, option.icon), option.text))), typeof selectedIndex === 'number' && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ActionList.Divider, null), /*#__PURE__*/React.createElement(ActionList.Item, {
612
620
  onSelect: () => setSelectedIndex(null)
613
621
  }, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, /*#__PURE__*/React.createElement(XIcon, null)), "Clear Group by")))));
@@ -670,19 +678,23 @@ export function MemexSortable() {
670
678
  }, /*#__PURE__*/React.createElement(ActionList, {
671
679
  selectionVariant: "multiple"
672
680
  }, /*#__PURE__*/React.createElement(ActionList.Group, {
673
- title: "Visible fields (can be reordered)"
681
+ title: "Visible fields (can be reordered)",
682
+ role: "listbox"
674
683
  }, visibleOptions.map(option => /*#__PURE__*/React.createElement(SortableItem, {
675
684
  key: option.text,
685
+ role: "option",
676
686
  option: option,
677
687
  onSelect: () => toggle(option.text),
678
688
  reorder: reorder
679
689
  }))), /*#__PURE__*/React.createElement(ActionList.Group, {
690
+ role: "listbox",
680
691
  title: "Hidden fields",
681
692
  selectionVariant:
682
693
  /** selectionVariant override on Group: disable selection if there are no options */
683
694
  hiddenOptions.length ? 'multiple' : false
684
695
  }, hiddenOptions.map((option, index) => /*#__PURE__*/React.createElement(ActionList.Item, {
685
696
  key: index,
697
+ role: "option",
686
698
  selected: option.selected,
687
699
  onSelect: () => toggle(option.text)
688
700
  }, /*#__PURE__*/React.createElement(ActionList.LeadingVisual, null, option.icon), option.text)), hiddenOptions.length === 0 && /*#__PURE__*/React.createElement(ActionList.Item, {
@@ -693,6 +705,7 @@ MemexSortable.storyName = 'Memex Sortable List';
693
705
 
694
706
  const SortableItem = ({
695
707
  option,
708
+ role,
696
709
  onSelect,
697
710
  reorder
698
711
  }) => {
@@ -724,6 +737,7 @@ const SortableItem = ({
724
737
  }
725
738
  }));
726
739
  return /*#__PURE__*/React.createElement(ActionList.Item, {
740
+ role: role,
727
741
  ref: element => dragRef(element) && dropRef(element) // merge refs
728
742
  ,
729
743
  selected: option.selected,