@primer/components 31.0.2-rc.95622264 → 31.2.0-rc.0b631515

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 (121) hide show
  1. package/.storybook/main.js +7 -9
  2. package/.storybook/preview.js +5 -1
  3. package/CHANGELOG.md +17 -1
  4. package/dist/browser.esm.js +178 -178
  5. package/dist/browser.esm.js.map +1 -1
  6. package/dist/browser.umd.js +179 -179
  7. package/dist/browser.umd.js.map +1 -1
  8. package/docs/content/FilterList.md +2 -2
  9. package/docs/content/theming.md +23 -0
  10. package/docs/src/@primer/gatsby-theme-doctocat/components/hero.js +1 -3
  11. package/docs/src/@primer/gatsby-theme-doctocat/components/live-preview-wrapper.js +1 -1
  12. package/lib/ActionList/Header.js +1 -1
  13. package/lib/Autocomplete/Autocomplete.d.ts +4 -4
  14. package/lib/Autocomplete/AutocompleteInput.d.ts +4 -4
  15. package/lib/Button/Button.d.ts +5 -5
  16. package/lib/Button/ButtonBase.d.ts +1 -1
  17. package/lib/Button/ButtonClose.d.ts +3 -3
  18. package/lib/Button/ButtonDanger.d.ts +5 -5
  19. package/lib/Button/ButtonInvisible.d.ts +5 -5
  20. package/lib/Button/ButtonOutline.d.ts +5 -5
  21. package/lib/Button/ButtonPrimary.d.ts +5 -5
  22. package/lib/CircleBadge.d.ts +2 -2
  23. package/lib/CircleOcticon.d.ts +4 -4
  24. package/lib/Dialog.d.ts +4 -4
  25. package/lib/Dropdown.d.ts +16 -16
  26. package/lib/DropdownMenu/DropdownButton.d.ts +6 -6
  27. package/lib/FilterList.d.ts +3 -3
  28. package/lib/Flash.d.ts +1 -1
  29. package/lib/Label.d.ts +1 -1
  30. package/lib/Overlay.js +3 -1
  31. package/lib/Portal/Portal.js +3 -2
  32. package/lib/Position.d.ts +4 -4
  33. package/lib/ProgressBar.d.ts +1 -1
  34. package/lib/SelectMenu/SelectMenu.d.ts +24 -24
  35. package/lib/SelectMenu/SelectMenuItem.d.ts +1 -1
  36. package/lib/TextInputWithTokens.d.ts +4 -4
  37. package/lib/Timeline.d.ts +4 -4
  38. package/lib/Token/AvatarToken.d.ts +1 -1
  39. package/lib/Token/IssueLabelToken.d.ts +1 -1
  40. package/lib/Token/Token.d.ts +1 -1
  41. package/lib/_TextInputWrapper.d.ts +1 -1
  42. package/lib/__tests__/KeyPaths.types.test.d.ts +11 -0
  43. package/lib/__tests__/KeyPaths.types.test.js +10 -0
  44. package/lib/__tests__/TextInputWithTokens.test.js +1 -10
  45. package/lib/hooks/useAnchoredPosition.js +3 -2
  46. package/lib/hooks/useCombinedRefs.d.ts +2 -2
  47. package/lib/hooks/useCombinedRefs.js +4 -6
  48. package/lib/hooks/useResizeObserver.js +2 -2
  49. package/lib/stories/Token.stories.js +19 -2
  50. package/lib/sx.d.ts +8 -2
  51. package/lib/theme.d.ts +78 -0
  52. package/lib/theme.js +3 -1
  53. package/lib/utils/types/KeyPaths.d.ts +3 -0
  54. package/lib/utils/types/KeyPaths.js +1 -0
  55. package/lib/utils/useIsomorphicLayoutEffect.d.ts +3 -0
  56. package/lib/utils/useIsomorphicLayoutEffect.js +12 -0
  57. package/lib-esm/ActionList/Header.js +1 -1
  58. package/lib-esm/Autocomplete/Autocomplete.d.ts +4 -4
  59. package/lib-esm/Autocomplete/AutocompleteInput.d.ts +4 -4
  60. package/lib-esm/Button/Button.d.ts +5 -5
  61. package/lib-esm/Button/ButtonBase.d.ts +1 -1
  62. package/lib-esm/Button/ButtonClose.d.ts +3 -3
  63. package/lib-esm/Button/ButtonDanger.d.ts +5 -5
  64. package/lib-esm/Button/ButtonInvisible.d.ts +5 -5
  65. package/lib-esm/Button/ButtonOutline.d.ts +5 -5
  66. package/lib-esm/Button/ButtonPrimary.d.ts +5 -5
  67. package/lib-esm/CircleBadge.d.ts +2 -2
  68. package/lib-esm/CircleOcticon.d.ts +4 -4
  69. package/lib-esm/Dialog.d.ts +4 -4
  70. package/lib-esm/Dropdown.d.ts +16 -16
  71. package/lib-esm/DropdownMenu/DropdownButton.d.ts +6 -6
  72. package/lib-esm/FilterList.d.ts +3 -3
  73. package/lib-esm/Flash.d.ts +1 -1
  74. package/lib-esm/Label.d.ts +1 -1
  75. package/lib-esm/Overlay.js +2 -1
  76. package/lib-esm/Portal/Portal.js +2 -1
  77. package/lib-esm/Position.d.ts +4 -4
  78. package/lib-esm/ProgressBar.d.ts +1 -1
  79. package/lib-esm/SelectMenu/SelectMenu.d.ts +24 -24
  80. package/lib-esm/SelectMenu/SelectMenuItem.d.ts +1 -1
  81. package/lib-esm/TextInputWithTokens.d.ts +4 -4
  82. package/lib-esm/Timeline.d.ts +4 -4
  83. package/lib-esm/Token/AvatarToken.d.ts +1 -1
  84. package/lib-esm/Token/IssueLabelToken.d.ts +1 -1
  85. package/lib-esm/Token/Token.d.ts +1 -1
  86. package/lib-esm/_TextInputWrapper.d.ts +1 -1
  87. package/lib-esm/__tests__/KeyPaths.types.test.d.ts +11 -0
  88. package/lib-esm/__tests__/KeyPaths.types.test.js +3 -0
  89. package/lib-esm/__tests__/TextInputWithTokens.test.js +1 -10
  90. package/lib-esm/hooks/useAnchoredPosition.js +2 -1
  91. package/lib-esm/hooks/useCombinedRefs.d.ts +2 -2
  92. package/lib-esm/hooks/useCombinedRefs.js +3 -2
  93. package/lib-esm/hooks/useResizeObserver.js +2 -2
  94. package/lib-esm/stories/Token.stories.js +14 -1
  95. package/lib-esm/sx.d.ts +8 -2
  96. package/lib-esm/theme.d.ts +78 -0
  97. package/lib-esm/theme.js +2 -1
  98. package/lib-esm/utils/types/KeyPaths.d.ts +3 -0
  99. package/lib-esm/utils/types/KeyPaths.js +1 -0
  100. package/lib-esm/utils/useIsomorphicLayoutEffect.d.ts +3 -0
  101. package/lib-esm/utils/useIsomorphicLayoutEffect.js +3 -0
  102. package/migrating.md +1 -1
  103. package/package-lock.json +37956 -42
  104. package/package.json +4 -2
  105. package/script/build +2 -0
  106. package/src/ActionList/Header.tsx +1 -1
  107. package/src/Overlay.tsx +2 -1
  108. package/src/Portal/Portal.tsx +2 -1
  109. package/src/__tests__/KeyPaths.types.test.ts +14 -0
  110. package/src/__tests__/TextInputWithTokens.test.tsx +0 -10
  111. package/src/hooks/useAnchoredPosition.ts +2 -1
  112. package/src/hooks/useCombinedRefs.ts +3 -3
  113. package/src/hooks/useResizeObserver.ts +2 -2
  114. package/src/stories/Button.stories.tsx +1 -1
  115. package/src/stories/Token.stories.tsx +12 -1
  116. package/src/sx.ts +14 -2
  117. package/src/theme.ts +86 -0
  118. package/src/utils/types/KeyPaths.ts +10 -0
  119. package/src/utils/useIsomorphicLayoutEffect.ts +10 -0
  120. package/stats.html +1 -1
  121. package/.changeset/tiny-ghosts-repeat.md +0 -5
@@ -23,6 +23,7 @@ declare const _default: string & import("styled-components").StyledComponentBase
23
23
  Badge: {
24
24
  (props: {
25
25
  lineHeight?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
26
+ border?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
26
27
  alignContent?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignContent, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
27
28
  alignItems?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignItems, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
28
29
  alignSelf?: import("styled-system").ResponsiveValue<import("csstype").Property.AlignSelf, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -98,7 +99,6 @@ declare const _default: string & import("styled-components").StyledComponentBase
98
99
  zIndex?: import("styled-system").ResponsiveValue<import("csstype").Property.ZIndex, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
99
100
  background?: import("styled-system").ResponsiveValue<import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
100
101
  backgroundPosition?: import("styled-system").ResponsiveValue<import("csstype").Property.BackgroundPosition<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
101
- border?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
102
102
  borderBottom?: import("styled-system").ResponsiveValue<import("csstype").Property.BorderBottom<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
103
103
  borderColor?: import("styled-system").ResponsiveValue<string | number | symbol, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
104
104
  borderLeft?: import("styled-system").ResponsiveValue<import("csstype").Property.BorderLeft<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
@@ -161,7 +161,7 @@ declare const _default: string & import("styled-components").StyledComponentBase
161
161
  results?: number | undefined;
162
162
  security?: string | undefined;
163
163
  unselectable?: "on" | "off" | undefined;
164
- inputMode?: "none" | "text" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
164
+ inputMode?: "search" | "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
165
165
  is?: string | undefined;
166
166
  'aria-activedescendant'?: string | undefined;
167
167
  'aria-atomic'?: boolean | "true" | "false" | undefined;
@@ -176,7 +176,7 @@ declare const _default: string & import("styled-components").StyledComponentBase
176
176
  'aria-describedby'?: string | undefined;
177
177
  'aria-details'?: string | undefined;
178
178
  'aria-disabled'?: boolean | "true" | "false" | undefined;
179
- 'aria-dropeffect'?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
179
+ 'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
180
180
  'aria-errormessage'?: string | undefined;
181
181
  'aria-expanded'?: boolean | "true" | "false" | undefined;
182
182
  'aria-flowto'?: string | undefined;
@@ -395,7 +395,7 @@ declare const _default: string & import("styled-components").StyledComponentBase
395
395
  size?: import("styled-system").ResponsiveValue<import("csstype").Property.Height<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
396
396
  borderX?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
397
397
  borderY?: import("styled-system").ResponsiveValue<import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>, Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> | undefined;
398
- sx?: import("@styled-system/css").SystemStyleObject | undefined;
398
+ sx?: import("./sx").BetterSystemStyleObject | undefined;
399
399
  } & {
400
400
  theme?: any;
401
401
  }): JSX.Element;
@@ -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, "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "list" | "default" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "download" | "hrefLang" | "rel" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "as" | "integrity" | "charSet" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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" | "list" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "as" | "hrefLang" | "integrity" | "rel" | "charSet" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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, "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "list" | "default" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "download" | "hrefLang" | "rel" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "as" | "integrity" | "charSet" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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" | "list" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "as" | "hrefLang" | "integrity" | "rel" | "charSet" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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, "sizes" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "children" | "value" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "text" | "list" | "default" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "sx" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "download" | "hrefLang" | "rel" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "muted" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "as" | "integrity" | "charSet" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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" | "list" | "type" | "name" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "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" | "start" | "step" | "size" | "wrap" | "open" | "sx" | "max" | "media" | "method" | "min" | "target" | "crossOrigin" | "href" | "classID" | "useMap" | "wmode" | "as" | "hrefLang" | "integrity" | "rel" | "charSet" | "download" | "alt" | "coords" | "shape" | "autoPlay" | "controls" | "loop" | "mediaGroup" | "playsInline" | "preload" | "src" | "autoFocus" | "disabled" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "dateTime" | "acceptCharset" | "action" | "autoComplete" | "encType" | "noValidate" | "manifest" | "allowFullScreen" | "allowTransparency" | "frameBorder" | "marginHeight" | "marginWidth" | "sandbox" | "scrolling" | "seamless" | "srcDoc" | "srcSet" | "async" | "accept" | "capture" | "checked" | "maxLength" | "minLength" | "multiple" | "readOnly" | "required" | "challenge" | "keyType" | "keyParams" | "htmlFor" | "httpEquiv" | "high" | "low" | "optimum" | "reversed" | "selected" | "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;
@@ -5,6 +5,6 @@ declare const TextInputWrapper: import("styled-components").StyledComponent<"spa
5
5
  hasIcon?: boolean | undefined;
6
6
  block?: boolean | undefined;
7
7
  contrast?: boolean | undefined;
8
- variant?: "large" | "small" | undefined;
8
+ variant?: "small" | "large" | undefined;
9
9
  } & WidthProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Width<import("styled-system").TLengthStyledSystem>> & MinWidthProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.MinWidth<import("styled-system").TLengthStyledSystem>> & MaxWidthProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.MaxWidth<import("styled-system").TLengthStyledSystem>> & SxProp, never>;
10
10
  export default TextInputWrapper;
@@ -0,0 +1,11 @@
1
+ import { Union } from 'ts-toolbelt';
2
+ import { KeyPaths } from '../utils/types/KeyPaths';
3
+ declare type NestedObject = {
4
+ a: string;
5
+ b: {
6
+ b1: string;
7
+ b2: string;
8
+ };
9
+ };
10
+ export declare function generatesKeyPathsFromObject(x: Union.Diff<KeyPaths<NestedObject>, 'a' | 'b.b1' | 'b.b2'>): never;
11
+ export {};
@@ -0,0 +1,3 @@
1
+ export function generatesKeyPathsFromObject(x) {
2
+ return x;
3
+ }
@@ -46,16 +46,7 @@ const LabelledTextInputWithTokens = ({
46
46
  tokens: tokens,
47
47
  onTokenRemove: onTokenRemove,
48
48
  id: "tokenInput"
49
- }, rest))); // describe('axe test', () => {
50
- // it('should have no axe violations', async () => {
51
- // const onRemoveMock = jest.fn()
52
- // const {container} = HTMLRender(<LabelledTextInputWithTokens tokens={mockTokens} onTokenRemove={onRemoveMock} />)
53
- // const results = await axe(container)
54
- // expect(results).toHaveNoViolations()
55
- // cleanup()
56
- // })
57
- // })
58
-
49
+ }, rest)));
59
50
 
60
51
  jest.useFakeTimers();
61
52
  describe('TextInputWithTokens', () => {
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import { getAnchoredPosition } from '../behaviors/anchoredPosition';
3
3
  import { useProvidedRefOrCreate } from './useProvidedRefOrCreate';
4
4
  import { useResizeObserver } from './useResizeObserver';
5
+ import useLayoutEffect from '../utils/useIsomorphicLayoutEffect';
5
6
 
6
7
  /**
7
8
  * Calculates the top and left values for an absolutely-positioned floating element
@@ -24,7 +25,7 @@ export function useAnchoredPosition(settings, dependencies = []) {
24
25
  }
25
26
  }, // eslint-disable-next-line react-hooks/exhaustive-deps
26
27
  [floatingElementRef, anchorElementRef, ...dependencies]);
27
- React.useLayoutEffect(updatePosition, [updatePosition]);
28
+ useLayoutEffect(updatePosition, [updatePosition]);
28
29
  useResizeObserver(updatePosition);
29
30
  return {
30
31
  floatingElementRef,
@@ -1,4 +1,4 @@
1
- import React, { ForwardedRef } from 'react';
1
+ import { ForwardedRef } from 'react';
2
2
  /**
3
3
  * Creates a ref by combining multiple constituent refs. The ref returned by this hook
4
4
  * should be passed as the ref for the element that needs to be shared. This is
@@ -7,4 +7,4 @@ import React, { ForwardedRef } from 'react';
7
7
  * though, as it breaks encapsulation.
8
8
  * @param refs
9
9
  */
10
- export declare function useCombinedRefs<T>(...refs: (ForwardedRef<T> | null | undefined)[]): React.MutableRefObject<T | null>;
10
+ export declare function useCombinedRefs<T>(...refs: (ForwardedRef<T> | null | undefined)[]): import("react").MutableRefObject<T | null>;
@@ -1,4 +1,5 @@
1
- import React, { useRef } from 'react';
1
+ import { useRef } from 'react';
2
+ import useLayoutEffect from '../utils/useIsomorphicLayoutEffect';
2
3
  /**
3
4
  * Creates a ref by combining multiple constituent refs. The ref returned by this hook
4
5
  * should be passed as the ref for the element that needs to be shared. This is
@@ -10,7 +11,7 @@ import React, { useRef } from 'react';
10
11
 
11
12
  export function useCombinedRefs(...refs) {
12
13
  const combinedRef = useRef(null);
13
- React.useLayoutEffect(() => {
14
+ useLayoutEffect(() => {
14
15
  function setRefs(current = null) {
15
16
  for (const ref of refs) {
16
17
  if (!ref) {
@@ -1,6 +1,6 @@
1
- import React from 'react';
1
+ import useLayoutEffect from '../utils/useIsomorphicLayoutEffect';
2
2
  export function useResizeObserver(callback) {
3
- React.useLayoutEffect(() => {
3
+ useLayoutEffect(() => {
4
4
  const observer = new window.ResizeObserver(() => callback());
5
5
  observer.observe(document.documentElement);
6
6
  return () => {
@@ -7,6 +7,7 @@ import { BaseStyles, ThemeProvider } from '..';
7
7
  import Box from '../Box';
8
8
  import Token from '../Token/Token';
9
9
  import Text from '../Text';
10
+ import { GitBranchIcon } from '@primer/octicons-react';
10
11
  export default {
11
12
  title: 'Tokens/Default',
12
13
  component: Token,
@@ -19,7 +20,7 @@ export default {
19
20
  return /*#__PURE__*/React.createElement(ThemeProvider, null, /*#__PURE__*/React.createElement(BaseStyles, null, /*#__PURE__*/React.createElement(Story, null)));
20
21
  }]
21
22
  };
22
- const excludedControlKeys = ['id', 'as', 'tabIndex', 'onRemove'];
23
+ const excludedControlKeys = ['id', 'as', 'tabIndex', 'onRemove', 'leadingVisual'];
23
24
 
24
25
  const SingleExampleContainer = ({
25
26
  children,
@@ -91,6 +92,18 @@ Interactive.parameters = {
91
92
  exclude: [...excludedControlKeys, 'hideRemoveButton', 'text']
92
93
  }
93
94
  };
95
+ export const WithLeadingVisual = args => {
96
+ return /*#__PURE__*/React.createElement(ExampleCollectionContainer, null, /*#__PURE__*/React.createElement(Token, _extends({}, args, {
97
+ leadingVisual: () => /*#__PURE__*/React.createElement(GitBranchIcon, null)
98
+ })));
99
+ };
100
+ WithLeadingVisual.displayName = "WithLeadingVisual";
101
+ WithLeadingVisual.storyName = 'with leadingVisual';
102
+ WithLeadingVisual.parameters = {
103
+ controls: {
104
+ exclude: [...excludedControlKeys, 'hideRemoveButton']
105
+ }
106
+ };
94
107
  export const WithOnRemoveFn = args => {
95
108
  return /*#__PURE__*/React.createElement(ExampleCollectionContainer, null, /*#__PURE__*/React.createElement(SingleExampleContainer, {
96
109
  label: "w/ onRemove passed"
package/lib-esm/sx.d.ts CHANGED
@@ -1,6 +1,12 @@
1
- import { SystemStyleObject } from '@styled-system/css';
1
+ import { SystemCssProperties, SystemStyleObject } from '@styled-system/css';
2
+ import { ThemeColorPaths, ThemeShadowPaths } from './theme';
3
+ import { ColorProps, ShadowProps } from 'styled-system';
4
+ export declare type BetterCssProperties = {
5
+ [K in keyof SystemCssProperties]: K extends keyof ColorProps ? ThemeColorPaths | SystemCssProperties[K] : K extends keyof ShadowProps ? ThemeShadowPaths | SystemCssProperties[K] : SystemCssProperties[K];
6
+ };
7
+ export declare type BetterSystemStyleObject = BetterCssProperties | SystemStyleObject;
2
8
  export interface SxProp {
3
- sx?: SystemStyleObject;
9
+ sx?: BetterSystemStyleObject;
4
10
  }
5
11
  declare const sx: (props: SxProp) => import("@styled-system/css").CssFunctionReturnType;
6
12
  export default sx;
@@ -1,2 +1,80 @@
1
1
  import { theme } from './theme-preval';
2
+ import { KeyPaths } from './utils/types/KeyPaths';
2
3
  export default theme;
4
+ declare type ThemeColors = {
5
+ fg: {
6
+ default: string;
7
+ muted: string;
8
+ subtle: string;
9
+ onEmphasis: string;
10
+ };
11
+ canvas: {
12
+ default: string;
13
+ overlay: string;
14
+ inset: string;
15
+ subtle: string;
16
+ };
17
+ border: {
18
+ default: string;
19
+ muted: string;
20
+ subtle: string;
21
+ };
22
+ neutral: {
23
+ emphasisPlus: string;
24
+ emphasis: string;
25
+ muted: string;
26
+ subtle: string;
27
+ };
28
+ accent: {
29
+ fg: string;
30
+ emphasis: string;
31
+ muted: string;
32
+ subtle: string;
33
+ };
34
+ success: {
35
+ fg: string;
36
+ emphasis: string;
37
+ muted: string;
38
+ subtle: string;
39
+ };
40
+ attention: {
41
+ fg: string;
42
+ emphasis: string;
43
+ muted: string;
44
+ subtle: string;
45
+ };
46
+ severe: {
47
+ fg: string;
48
+ emphasis: string;
49
+ muted: string;
50
+ subtle: string;
51
+ };
52
+ danger: {
53
+ fg: string;
54
+ emphasis: string;
55
+ muted: string;
56
+ subtle: string;
57
+ };
58
+ done: {
59
+ fg: string;
60
+ emphasis: string;
61
+ muted: string;
62
+ subtle: string;
63
+ };
64
+ sponsors: {
65
+ fg: string;
66
+ emphasis: string;
67
+ muted: string;
68
+ subtle: string;
69
+ };
70
+ };
71
+ declare type ThemeShadows = {
72
+ shadow: {
73
+ small: string;
74
+ medium: string;
75
+ large: string;
76
+ extraLarge: string;
77
+ };
78
+ };
79
+ export declare type ThemeColorPaths = KeyPaths<ThemeColors>;
80
+ export declare type ThemeShadowPaths = KeyPaths<ThemeShadows>;
package/lib-esm/theme.js CHANGED
@@ -1,2 +1,3 @@
1
1
  import { theme } from './theme-preval';
2
- export default theme;
2
+ export default theme; // NOTE: for now, ThemeColors and ThemeShadows are handcrafted types. It would be nice if these
3
+ // were exports from primitives (or a different shape but derived from those exports).
@@ -0,0 +1,3 @@
1
+ export declare type KeyPaths<O extends Record<string, unknown>> = {
2
+ [K in keyof O]: K extends string ? O[K] extends string ? `${K}` : `${K}.${KeyPaths<O[K]>}` : never;
3
+ }[keyof O];
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,3 @@
1
+ import { useEffect } from 'react';
2
+ declare const useIsomorphicLayoutEffect: typeof useEffect;
3
+ export default useIsomorphicLayoutEffect;
@@ -0,0 +1,3 @@
1
+ import { useEffect, useLayoutEffect } from 'react';
2
+ const useIsomorphicLayoutEffect = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined' ? useLayoutEffect : useEffect;
3
+ export default useIsomorphicLayoutEffect;
package/migrating.md CHANGED
@@ -110,7 +110,7 @@ There are two ways to change the theme of @primer/components components:
110
110
 
111
111
  export default () => (
112
112
  <ThemeProvider theme={theme}>
113
- <Block color="bodytext" p={4}>
113
+ <Block sx={{color: 'bodytext', p: 4}}>
114
114
  <Text fontSize={4}>Hello, world!</Text>
115
115
  </Block>
116
116
  </ThemeProvider>