@procore/core-react 12.37.0 → 12.38.0

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 (224) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/dist/AnchorNavigation/AnchorNavigation.styles.js +3 -3
  3. package/dist/Avatar/Avatar.styles.js +5 -5
  4. package/dist/AvatarStack/AvatarStack.styles.js +7 -7
  5. package/dist/Badge/Badge.styles.js +2 -2
  6. package/dist/BadgePill/BadgePill.styles.js +4 -4
  7. package/dist/Banner/Banner.d.ts +2 -1
  8. package/dist/Banner/Banner.js +53 -34
  9. package/dist/Banner/Banner.js.map +1 -1
  10. package/dist/Banner/Banner.styles.js +10 -10
  11. package/dist/Banner/Banner.types.d.ts +6 -0
  12. package/dist/Banner/Banner.types.js.map +1 -1
  13. package/dist/Banner/index.d.ts +1 -1
  14. package/dist/Banner/index.js.map +1 -1
  15. package/dist/Box/Box.styles.js +1 -1
  16. package/dist/Breadcrumbs/Breadcrumbs.styles.js +4 -4
  17. package/dist/Button/Button.styles.js +5 -5
  18. package/dist/Calendar/Calendar.styles.js +9 -9
  19. package/dist/Card/Card.styles.js +1 -1
  20. package/dist/Checkbox/Checkbox.styles.js +6 -6
  21. package/dist/Checkbox/CheckboxTooltip.js +1 -1
  22. package/dist/ContactItem/ContactItem.styles.js +5 -5
  23. package/dist/Content/Content.styles.js +2 -2
  24. package/dist/DateInput/DateInput.styles.js +6 -6
  25. package/dist/DetailPage/DetailPage.styles.js +7 -7
  26. package/dist/Dropdown/Dropdown.styles.js +3 -3
  27. package/dist/DropdownFlyout/DropdownFlyout.styles.js +4 -4
  28. package/dist/Dropzone/Dropzone.js +1 -1
  29. package/dist/Dropzone/Dropzone.styles.js +9 -9
  30. package/dist/EmptyState/EmptyState.styles.js +6 -6
  31. package/dist/Field/Field.styles.js +3 -3
  32. package/dist/FileList/FileList.styles.js +4 -4
  33. package/dist/FileSelect/FileExplorer/FileExplorer.styles.js +9 -9
  34. package/dist/FileSelect/FileExplorer/FileExplorerSidebar.js +3 -1
  35. package/dist/FileSelect/FileExplorer/FileExplorerSidebar.js.map +1 -1
  36. package/dist/FileSelect/FileExplorer/FileExplorerSidebar.styles.js +3 -3
  37. package/dist/FileSelect/FileSelect.styles.js +2 -2
  38. package/dist/FileSelect/FileSelectDropzone/FileSelectDropzone.styles.js +3 -3
  39. package/dist/FileSelect/FileTokenList/FileTokenList.styles.js +2 -2
  40. package/dist/FileSelect/GridSource/GridSource.styles.js +6 -6
  41. package/dist/FileSelect/LocalSource/LocalSource.styles.js +4 -4
  42. package/dist/FileSelect/SourceItem/SourceItem.js +10 -5
  43. package/dist/FileSelect/SourceItem/SourceItem.js.map +1 -1
  44. package/dist/FileSelect/SourceItem/SourceItem.styles.js +3 -3
  45. package/dist/FileSelect/ThumbnailList/ThumbnailList.styles.js +6 -6
  46. package/dist/FileSelect/TreeSource/TreeSource.styles.js +1 -1
  47. package/dist/FileToken/FileToken.styles.js +4 -4
  48. package/dist/FilterToken/FilterToken.styles.js +5 -5
  49. package/dist/FlexList/FlexList.styles.js +1 -1
  50. package/dist/Form/Form.styles.js +14 -14
  51. package/dist/Form/StyledFormikForm.styles.js +2 -2
  52. package/dist/Form/stories/util.js +1 -12
  53. package/dist/Form/stories/util.js.map +1 -1
  54. package/dist/GhostPlaceholder/GhostPlaceholder.styles.js +2 -2
  55. package/dist/Grid/Grid.styles.js +2 -2
  56. package/dist/GroupSelect/GroupSelect.styles.js +1 -1
  57. package/dist/Input/Input.styles.js +1 -1
  58. package/dist/Link/Link.styles.js +1 -1
  59. package/dist/ListPage/ListPage.styles.js +8 -8
  60. package/dist/Loader/Loader.styles.js +2 -2
  61. package/dist/MenuImperative/MenuImperative.styles.js +10 -10
  62. package/dist/Modal/Modal.styles.js +13 -13
  63. package/dist/MultiSelect/MultiSelect.styles.js +7 -7
  64. package/dist/NextMenu/NextMenu.styles.js +3 -3
  65. package/dist/Notation/Notation.js +1 -1
  66. package/dist/NumberInput/NumberInput.styles.js +7 -7
  67. package/dist/Overlay/OverlayArrow.styles.js +1 -1
  68. package/dist/OverlayTrigger/OverlayTrigger.js +4 -2
  69. package/dist/OverlayTrigger/OverlayTrigger.js.map +1 -1
  70. package/dist/OverlayTrigger/OverlayTrigger.types.d.ts +8 -0
  71. package/dist/OverlayTrigger/OverlayTrigger.types.js.map +1 -1
  72. package/dist/PageLayout/PageLayout.styles.d.ts +1 -0
  73. package/dist/PageLayout/PageLayout.styles.js +17 -17
  74. package/dist/PageLayout/PageLayout.styles.js.map +1 -1
  75. package/dist/PageTemplate/PageFooterTemplate/PageFooterTemplate.styles.js +1 -1
  76. package/dist/PageTemplate/PageHeaderTemplate/PageHeaderTemplate.styles.js +3 -3
  77. package/dist/PageTemplate/PagePaneTemplate/PagePaneTemplate.styles.js +2 -2
  78. package/dist/PageTemplate/PageTemplate/PageTemplate.styles.js +3 -3
  79. package/dist/Pagination/Pagination.styles.js +5 -5
  80. package/dist/Panel/Panel.styles.js +11 -11
  81. package/dist/Pill/Pill.styles.js +3 -3
  82. package/dist/PillSelect/PillSelect.styles.js +4 -4
  83. package/dist/Popover/Popover.js +2 -1
  84. package/dist/Popover/Popover.js.map +1 -1
  85. package/dist/Popover/Popover.styles.js +2 -2
  86. package/dist/Portal/Portal.styles.js +1 -1
  87. package/dist/ProgressBar/ProgressBar.styles.js +2 -2
  88. package/dist/RadioButton/RadioButton.styles.js +3 -3
  89. package/dist/Required/Required.styles.js +3 -3
  90. package/dist/Search/Search.styles.js +5 -5
  91. package/dist/Section/Section.styles.js +7 -7
  92. package/dist/SegmentedController/SegmentedController.styles.js +4 -4
  93. package/dist/Select/Select.js +35 -13
  94. package/dist/Select/Select.js.map +1 -1
  95. package/dist/Select/Select.styles.js +8 -8
  96. package/dist/Select/Select.types.d.ts +13 -0
  97. package/dist/Select/Select.types.js.map +1 -1
  98. package/dist/Semantic/Semantic.styles.js +9 -9
  99. package/dist/Slider/Slider.styles.js +5 -5
  100. package/dist/Spinner/Spinner.js +21 -6
  101. package/dist/Spinner/Spinner.js.map +1 -1
  102. package/dist/Spinner/Spinner.styles.js +7 -7
  103. package/dist/SplitViewCard/SplitViewCard.styles.js +8 -8
  104. package/dist/SuperSelect/SuperSelect.components.js +6 -15
  105. package/dist/SuperSelect/SuperSelect.components.js.map +1 -1
  106. package/dist/SuperSelect/SuperSelect.js +1 -1
  107. package/dist/SuperSelect/SuperSelect.js.map +1 -1
  108. package/dist/SuperSelect/SuperSelect.presets.styles.js +1 -1
  109. package/dist/SuperSelect/SuperSelect.styles.js +38 -38
  110. package/dist/SuperSelect/SuperSelect.types.d.ts +0 -3
  111. package/dist/SuperSelect/SuperSelect.types.js.map +1 -1
  112. package/dist/SuperSelect/useSuperSelect.d.ts +1 -1
  113. package/dist/SuperSelect/useSuperSelect.js +19 -52
  114. package/dist/SuperSelect/useSuperSelect.js.map +1 -1
  115. package/dist/Switch/Switch.styles.js +4 -4
  116. package/dist/Table/Table.styles.js +28 -28
  117. package/dist/TableShelf/TableShelf.styles.js +5 -5
  118. package/dist/Tabs/Tabs.styles.js +15 -15
  119. package/dist/Tearsheet/Tearsheet.styles.js +5 -5
  120. package/dist/Tearsheet/storybook/PageLayoutDemo.js +4 -1
  121. package/dist/Tearsheet/storybook/PageLayoutDemo.js.map +1 -1
  122. package/dist/TextArea/TextArea.styles.js +1 -1
  123. package/dist/TextEditorOutput/TextEditorOutput.styles.js +1 -1
  124. package/dist/Thumbnail/Thumbnail.styles.js +17 -17
  125. package/dist/ThumbnailGrid/ThumbnailGrid.styles.js +7 -7
  126. package/dist/TieredSelect/TieredSelect.styles.js +9 -9
  127. package/dist/Tile/Tile.styles.js +8 -8
  128. package/dist/Title/Title.styles.js +7 -7
  129. package/dist/Toast/Toast.styles.js +3 -3
  130. package/dist/ToggleButton/ToggleButton.styles.js +1 -1
  131. package/dist/Token/Token.styles.js +3 -3
  132. package/dist/ToolHeader/ToolHeader.styles.js +6 -6
  133. package/dist/ToolLandingPage/ToolLandingPage.styles.js +3 -3
  134. package/dist/Tooltip/Tooltip.styles.js +2 -2
  135. package/dist/Tree/Tree.js +1 -1
  136. package/dist/Tree/Tree.styles.js +10 -10
  137. package/dist/Typeahead/Typeahead.styles.js +3 -3
  138. package/dist/Typography/Typography.styles.js +1 -1
  139. package/dist/Typography/Typography.table.story.js +2 -2
  140. package/dist/_hooks/I18n.d.ts +4 -19
  141. package/dist/_locales/en.json +3 -1
  142. package/dist/_locales/pseudo.json +3 -1
  143. package/dist/_storyHelpers_/components/Deprecation.styles.js +1 -1
  144. package/dist/_storyHelpers_/components/StoryGrid.js +3 -3
  145. package/dist/_typedoc/AnchorNavigation/AnchorNavigation.types.json +3 -3
  146. package/dist/_typedoc/Avatar/Avatar.types.json +20 -20
  147. package/dist/_typedoc/AvatarStack/AvatarStack.types.json +24 -24
  148. package/dist/_typedoc/Badge/Badge.types.json +6 -6
  149. package/dist/_typedoc/Banner/Banner.types.json +39 -13
  150. package/dist/_typedoc/Box/Box.types.json +68 -68
  151. package/dist/_typedoc/Breadcrumbs/Breadcrumbs.types.json +10 -10
  152. package/dist/_typedoc/Button/Button.types.json +13 -13
  153. package/dist/_typedoc/Calendar/Calendar.types.json +80 -80
  154. package/dist/_typedoc/Card/Card.types.json +6 -6
  155. package/dist/_typedoc/Checkbox/Checkbox.types.json +8 -8
  156. package/dist/_typedoc/ContactItem/ContactItem.types.json +9 -9
  157. package/dist/_typedoc/DateInput/DateInput.types.json +35 -35
  158. package/dist/_typedoc/DateSelect/DateSelect.types.json +13 -13
  159. package/dist/_typedoc/DetailPage/DetailPage.types.json +5 -5
  160. package/dist/_typedoc/Dropdown/Dropdown.types.json +37 -37
  161. package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +31 -31
  162. package/dist/_typedoc/Dropzone/Dropzone.types.json +44 -44
  163. package/dist/_typedoc/EmptyState/EmptyState.types.json +16 -16
  164. package/dist/_typedoc/FileList/FileList.types.json +9 -9
  165. package/dist/_typedoc/FileSelect/FileSelect.types.json +27 -27
  166. package/dist/_typedoc/FileSelect/GridSource/GridSource.types.json +20 -20
  167. package/dist/_typedoc/FileSelect/LocalSource/LocalSource.types.json +14 -14
  168. package/dist/_typedoc/FileSelect/TreeSource/TreeSource.types.json +9 -9
  169. package/dist/_typedoc/Flex/Flex.types.json +27 -27
  170. package/dist/_typedoc/FlexList/FlexList.types.json +30 -30
  171. package/dist/_typedoc/Form/Form.types.json +750 -750
  172. package/dist/_typedoc/GhostPlaceholder/GhostPlaceholder.types.json +12 -12
  173. package/dist/_typedoc/Grid/Grid.types.json +8 -8
  174. package/dist/_typedoc/GroupSelect/GroupSelect.types.json +52 -52
  175. package/dist/_typedoc/Input/Input.types.json +2 -2
  176. package/dist/_typedoc/Link/Link.types.json +1 -1
  177. package/dist/_typedoc/ListPage/ListPage.types.json +13 -13
  178. package/dist/_typedoc/Menu/Menu.types.json +62 -62
  179. package/dist/_typedoc/MenuImperative/MenuImperative.types.json +77 -77
  180. package/dist/_typedoc/Modal/Modal.types.json +46 -46
  181. package/dist/_typedoc/MultiSelect/MultiSelect.types.json +31 -31
  182. package/dist/_typedoc/NextTile/NextTile.types.json +32 -32
  183. package/dist/_typedoc/Notation/Notation.types.json +4 -4
  184. package/dist/_typedoc/NumberInput/NumberInput.types.json +48 -48
  185. package/dist/_typedoc/OverlayTrigger/OverlayTrigger.types.json +42 -32
  186. package/dist/_typedoc/PageLayout/PageLayout.types.json +26 -26
  187. package/dist/_typedoc/Pagination/Pagination.types.json +7 -7
  188. package/dist/_typedoc/Panel/Panel.types.json +30 -30
  189. package/dist/_typedoc/Pill/Pill.types.json +2 -2
  190. package/dist/_typedoc/PillSelect/PillSelect.types.json +49 -49
  191. package/dist/_typedoc/Popover/Popover.types.json +15 -15
  192. package/dist/_typedoc/ProgressBar/ProgressBar.types.json +7 -7
  193. package/dist/_typedoc/RadioButton/RadioButton.types.json +6 -6
  194. package/dist/_typedoc/Required/Required.types.json +5 -5
  195. package/dist/_typedoc/Search/Search.types.json +18 -18
  196. package/dist/_typedoc/Section/Section.types.json +15 -15
  197. package/dist/_typedoc/SegmentedController/SegmentedController.types.json +21 -21
  198. package/dist/_typedoc/Select/Select.types.json +95 -60
  199. package/dist/_typedoc/SettingsPage/SettingsPage.types.json +10 -10
  200. package/dist/_typedoc/Slider/Slider.types.json +6 -6
  201. package/dist/_typedoc/Spinner/Spinner.types.json +9 -9
  202. package/dist/_typedoc/SplitViewCard/SplitViewCard.types.json +14 -14
  203. package/dist/_typedoc/Table/Table.types.json +102 -102
  204. package/dist/_typedoc/Tabs/Tabs.types.json +20 -20
  205. package/dist/_typedoc/Tearsheet/Tearsheet.types.json +17 -17
  206. package/dist/_typedoc/TextArea/TextArea.types.json +3 -3
  207. package/dist/_typedoc/TextEditor/TextEditor.types.json +11 -11
  208. package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +4 -4
  209. package/dist/_typedoc/Thumbnail/Thumbnail.types.json +19 -19
  210. package/dist/_typedoc/TieredDropdown/TieredDropdown.types.json +43 -43
  211. package/dist/_typedoc/TieredSelect/TieredSelect.types.json +29 -29
  212. package/dist/_typedoc/Tile/Tile.types.json +8 -8
  213. package/dist/_typedoc/Title/Title.types.json +1 -1
  214. package/dist/_typedoc/Toast/Toast.types.json +4 -4
  215. package/dist/_typedoc/ToggleButton/ToggleButton.types.json +4 -4
  216. package/dist/_typedoc/Token/Token.types.json +7 -7
  217. package/dist/_typedoc/ToolHeader/ToolHeader.types.json +10 -10
  218. package/dist/_typedoc/ToolLandingPage/ToolLandingPage.types.json +8 -8
  219. package/dist/_typedoc/Tooltip/Tooltip.types.json +14 -14
  220. package/dist/_typedoc/Tree/Tree.types.json +88 -88
  221. package/dist/_typedoc/Typeahead/Typeahead.types.json +2 -2
  222. package/dist/_typedoc/Typography/Typography.types.json +9 -9
  223. package/dist/_typedoc/_utils/types.json +3 -3
  224. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"Select.types.js","names":[],"sources":["../../src/Select/Select.types.ts"],"sourcesContent":["import type { ButtonProps } from '../Button/Button.types'\nimport type { DropdownPlacement } from '../Dropdown/Dropdown.types'\nimport type { MenuProps, MenuRef } from '../MenuImperative/MenuImperative.types'\nimport type { OverlayTriggerProps } from '../OverlayTrigger'\nimport type { PortalProps } from '../Portal/Portal.types'\n\nexport type SelectPlacement = DropdownPlacement\n\ntype DivProps = React.ComponentPropsWithoutRef<'div'>\n\nexport interface SelectMenuProps\n extends Omit<DivProps, 'onSelect' | 'onDragEnd'>,\n Pick<PortalProps, 'container'> {\n /**\n * @since 10.19.0\n */\n emptyMessage?: string\n /**\n * @since 12.15.0\n */\n header?: React.ReactNode\n /**\n * @since 10.19.0\n */\n footer?: React.ReactNode\n /**\n * @since 10.19.0\n */\n i18nScope?: string\n /**\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n /**\n * @since 10.19.0\n */\n onScrollBottom?: MenuProps['onScrollBottom']\n /**\n * @since 10.19.0\n */\n onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void\n /**\n * @since 10.19.0\n */\n onSelect?: MenuProps['onSelect']\n /**\n * @since 10.19.0\n */\n optionsRef?: React.RefObject<HTMLDivElement>\n /**\n * @since 10.19.0\n */\n menuRef: React.RefObject<MenuRef>\n}\n\nexport interface SelectOptionProps extends DivProps {\n /**\n * @since 10.19.0\n */\n index?: number\n /**\n * @since 10.19.0\n */\n value: any\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n\n /**\n * Represents the currently selected value. This option will be styled\n * differently as well as receive UX to scroll into view and start list\n * navigation from this element.\n * @since 10.19.0\n */\n selected?: boolean\n\n /**\n * If nothing is selected, suggest this option. Suggested options mimic the\n * UX of a selected option, scroll into view and start list navigation from\n * this element.\n * @since 10.19.0\n */\n suggested?: boolean\n}\n\ninterface QaTags {\n /**\n * @since 10.19.0\n */\n label: string\n /**\n * @since 10.19.0\n */\n clear: string\n}\n\nexport interface SelectProps\n extends Omit<DivProps, 'onSelect'>,\n Pick<PortalProps, 'container'> {\n /**\n * @since 10.19.0\n */\n afterHide?: OverlayTriggerProps['afterHide']\n /**\n * @since 10.19.0\n */\n afterShow?: OverlayTriggerProps['afterShow']\n /**\n * @since 10.19.0\n */\n beforeHide?: OverlayTriggerProps['beforeHide']\n /**\n * @since 10.19.0\n */\n beforeShow?: OverlayTriggerProps['beforeShow']\n\n /**\n * Make the Select button 100% width\n * @since 10.19.0\n */\n block?: boolean\n\n /**\n * @default false\n * @since 10.19.0\n */\n disabled?: boolean\n\n /**\n * When there are no children this will render\n * @since 10.19.0\n */\n emptyMessage?: string\n\n /**\n * @default false\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 12.15.0\n */\n header?: React.ReactNode\n /**\n * @since 10.19.0\n */\n footer?: React.ReactNode\n /**\n * @since 10.19.0\n */\n hideDelay?: number\n /**\n * The i18n key to use for the select's configurable strings.\n * Defaults to using the core library's default strings.\n * @since 10.19.0\n */\n i18nScope?: string\n /**\n * @since 10.19.0\n */\n label?: React.ReactNode\n\n /**\n * If the select is loading\n * @default false\n * @since 10.19.0\n */\n loading?: boolean\n\n /**\n * It is possible for this component to have an empty value\n * (render placeholder). Enables the x icon.\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n /**\n * Optional `function` that automatically executes when\n * scrolling reaches the last item.\n * @since 10.19.0\n */\n onScrollBottom?: MenuProps['onScrollBottom']\n\n /**\n * Adds a search bar to the select.\n * @since 10.19.0\n */\n onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void\n /**\n * @since 10.19.0\n */\n onSelect?: MenuProps['onSelect']\n /**\n * @since 10.19.0\n */\n optionsRef?: React.RefObject<HTMLDivElement>\n\n /**\n * Renders when the label is blank\n * @since 10.19.0\n */\n placeholder?: string\n\n /**\n * The placement of the overlay\n * @default 'bottom-left'\n * @since 10.19.0\n */\n placement?: SelectPlacement\n /**\n * @since 10.19.0\n */\n qa?: Partial<QaTags>\n\n /**\n * Restore focus to the target after the overlay is hidden.\n * 'core-react' will use internal logic to restore focus,\n * 'react-aria-focus-scope' will use 'FocusScope' component from '@react-aria',\n * true will use both.\n * @default 'core-react'\n * @since 12.11.0\n */\n restoreFocusOnHide?: OverlayTriggerProps['restoreFocusOnHide']\n\n /**\n * @since 10.19.0\n */\n showDelay?: number\n\n /**\n * Configurable tabIndex for the select button\n * @default 0\n * @since 10.19.0\n */\n tabIndex?: number\n}\n\nexport interface SelectButtonProps extends DivProps {\n /**\n * @since 10.19.0\n */\n block?: ButtonProps['block']\n /**\n * @since 10.19.0\n */\n clearRef?: React.RefObject<HTMLButtonElement>\n /**\n * @since 10.19.0\n */\n disabled?: ButtonProps['disabled']\n /**\n * @since 10.19.0\n */\n dropdown?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 11.9.0\n * If the component should apply a focus appeareance. This is\n * not DOM focus management, and purely visual.\n */\n focus?: boolean | ((obj: { open: boolean }) => boolean)\n /**\n * @since 10.19.0\n */\n icon?: ButtonProps['icon']\n /**\n * @since 10.19.0\n */\n label?: React.ReactNode\n /**\n * @since 10.19.0\n */\n loading?: ButtonProps['loading']\n /**\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n /**\n * @since 10.19.0\n */\n open?: boolean\n /**\n * @since 10.19.0\n */\n placeholder?: string\n /**\n * @since 10.19.0\n */\n qa?: Partial<QaTags>\n /**\n * @since 10.19.0\n */\n size?: ButtonProps['size']\n /**\n * @since 10.19.0\n */\n tabIndex?: number\n /**\n * @since 10.19.0\n */\n type?: ButtonProps['type']\n /**\n * @since 10.19.0\n */\n variant?: ButtonProps['variant']\n /**\n * @since 10.19.0\n */\n isMenuOpened?: boolean\n}\n"],"mappings":""}
1
+ {"version":3,"file":"Select.types.js","names":[],"sources":["../../src/Select/Select.types.ts"],"sourcesContent":["import type { ButtonProps } from '../Button/Button.types'\nimport type { DropdownPlacement } from '../Dropdown/Dropdown.types'\nimport type { MenuProps, MenuRef } from '../MenuImperative/MenuImperative.types'\nimport type { OverlayTriggerProps } from '../OverlayTrigger'\nimport type { PortalProps } from '../Portal/Portal.types'\n\nexport type SelectPlacement = DropdownPlacement\n\ntype DivProps = React.ComponentPropsWithoutRef<'div'>\n\nexport type TriggerRole = 'combobox' | 'button'\n\nexport interface SelectMenuProps\n extends Omit<DivProps, 'onSelect' | 'onDragEnd'>,\n Pick<PortalProps, 'container'> {\n /**\n * @since 10.19.0\n */\n emptyMessage?: string\n /**\n * @since 12.15.0\n */\n header?: React.ReactNode\n /**\n * @since 10.19.0\n */\n footer?: React.ReactNode\n /**\n * @since 10.19.0\n */\n i18nScope?: string\n /**\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n /**\n * @since 10.19.0\n */\n onScrollBottom?: MenuProps['onScrollBottom']\n /**\n * @since 10.19.0\n */\n onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void\n /**\n * @since 10.19.0\n */\n onSelect?: MenuProps['onSelect']\n /**\n * @since 10.19.0\n */\n optionsRef?: React.RefObject<HTMLDivElement>\n /**\n * @since 10.19.0\n */\n menuRef: React.RefObject<MenuRef>\n /**\n * @since 12.35.1\n */\n menuId: string\n}\n\nexport interface SelectOptionProps extends DivProps {\n /**\n * @since 10.19.0\n */\n index?: number\n /**\n * @since 10.19.0\n */\n value: any\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n\n /**\n * Represents the currently selected value. This option will be styled\n * differently as well as receive UX to scroll into view and start list\n * navigation from this element.\n * @since 10.19.0\n */\n selected?: boolean\n\n /**\n * If nothing is selected, suggest this option. Suggested options mimic the\n * UX of a selected option, scroll into view and start list navigation from\n * this element.\n * @since 10.19.0\n */\n suggested?: boolean\n}\n\ninterface QaTags {\n /**\n * @since 10.19.0\n */\n label: string\n /**\n * @since 10.19.0\n */\n clear: string\n}\n\nexport interface SelectProps\n extends Omit<DivProps, 'onSelect'>,\n Pick<PortalProps, 'container'> {\n /**\n * @since 10.19.0\n */\n afterHide?: OverlayTriggerProps['afterHide']\n /**\n * @since 10.19.0\n */\n afterShow?: OverlayTriggerProps['afterShow']\n /**\n * @since 10.19.0\n */\n beforeHide?: OverlayTriggerProps['beforeHide']\n /**\n * @since 10.19.0\n */\n beforeShow?: OverlayTriggerProps['beforeShow']\n\n /**\n * Make the Select button 100% width\n * @since 10.19.0\n */\n block?: boolean\n\n /**\n * @default false\n * @since 10.19.0\n */\n disabled?: boolean\n\n /**\n * When there are no children this will render\n * @since 10.19.0\n */\n emptyMessage?: string\n\n /**\n * @default false\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 12.15.0\n */\n header?: React.ReactNode\n /**\n * @since 10.19.0\n */\n footer?: React.ReactNode\n /**\n * @since 10.19.0\n */\n hideDelay?: number\n /**\n * The i18n key to use for the select's configurable strings.\n * Defaults to using the core library's default strings.\n * @since 10.19.0\n */\n i18nScope?: string\n /**\n * @since 10.19.0\n */\n label?: React.ReactNode\n\n /**\n * If the select is loading\n * @default false\n * @since 10.19.0\n */\n loading?: boolean\n\n /**\n * It is possible for this component to have an empty value\n * (render placeholder). Enables the x icon.\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n\n /**\n * Optional `function` that automatically executes when\n * scrolling reaches the last item.\n * @since 10.19.0\n */\n onScrollBottom?: MenuProps['onScrollBottom']\n\n /**\n * Adds a search bar to the select.\n * @since 10.19.0\n */\n onSearch?: (event: React.ChangeEvent<HTMLInputElement>) => void\n /**\n * @since 10.19.0\n */\n onSelect?: MenuProps['onSelect']\n /**\n * @since 10.19.0\n */\n optionsRef?: React.RefObject<HTMLDivElement>\n\n /**\n * Renders when the label is blank\n * @since 10.19.0\n */\n placeholder?: string\n\n /**\n * The placement of the overlay\n * @default 'bottom-left'\n * @since 10.19.0\n */\n placement?: SelectPlacement\n /**\n * @since 10.19.0\n */\n qa?: Partial<QaTags>\n\n /**\n * Restore focus to the target after the overlay is hidden.\n * 'core-react' will use internal logic to restore focus,\n * 'react-aria-focus-scope' will use 'FocusScope' component from '@react-aria',\n * true will use both.\n * @default 'core-react'\n * @since 12.11.0\n */\n restoreFocusOnHide?: OverlayTriggerProps['restoreFocusOnHide']\n\n /**\n * @since 10.19.0\n */\n showDelay?: number\n\n /**\n * Configurable tabIndex for the select button\n * @default 0\n * @since 10.19.0\n */\n tabIndex?: number\n}\n\nexport interface SelectButtonProps extends DivProps {\n /**\n * @since 10.19.0\n */\n block?: ButtonProps['block']\n /**\n * @since 10.19.0\n */\n clearRef?: React.RefObject<HTMLButtonElement>\n /**\n * @since 10.19.0\n */\n disabled?: ButtonProps['disabled']\n /**\n * @since 10.19.0\n */\n dropdown?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 11.9.0\n * If the component should apply a focus appeareance. This is\n * not DOM focus management, and purely visual.\n */\n focus?: boolean | ((obj: { open: boolean }) => boolean)\n /**\n * @since 10.19.0\n */\n icon?: ButtonProps['icon']\n /**\n * @since 10.19.0\n */\n label?: React.ReactNode\n /**\n * @since 10.19.0\n */\n loading?: ButtonProps['loading']\n /**\n * @since 10.19.0\n */\n onClear?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void\n /**\n * @since 10.19.0\n */\n open?: boolean\n /**\n * @since 10.19.0\n */\n placeholder?: string\n /**\n * @since 10.19.0\n */\n qa?: Partial<QaTags>\n /**\n * @since 10.19.0\n */\n size?: ButtonProps['size']\n /**\n * @since 10.19.0\n */\n tabIndex?: number\n /**\n * @since 10.19.0\n */\n type?: ButtonProps['type']\n /**\n * @since 10.19.0\n */\n variant?: ButtonProps['variant']\n /**\n * @since 10.19.0\n */\n isMenuOpened?: boolean\n /**\n * @since 12.35.1\n */\n isListboxOnly?: boolean\n /**\n * @since 12.35.1\n */\n menuId?: string\n}\n"],"mappings":""}
@@ -5,15 +5,15 @@ import { colors } from '../_styles/colors';
5
5
  import { spacing } from '../_styles/spacing';
6
6
  export var StyledH1 = /*#__PURE__*/styled.h1.withConfig({
7
7
  displayName: "StyledH1",
8
- componentId: "core-12_37_0__sc-172j5qh-0"
8
+ componentId: "core-12_38_0__sc-172j5qh-0"
9
9
  })(["color:", ";", " margin:0;"], colors.gray15, getTypographyIntent('h1'));
10
10
  export var StyledH2 = /*#__PURE__*/styled.h2.withConfig({
11
11
  displayName: "StyledH2",
12
- componentId: "core-12_37_0__sc-172j5qh-1"
12
+ componentId: "core-12_38_0__sc-172j5qh-1"
13
13
  })(["color:", ";", " margin:0;"], colors.gray15, getTypographyIntent('h2'));
14
14
  export var StyledH3 = /*#__PURE__*/styled.h3.withConfig({
15
15
  displayName: "StyledH3",
16
- componentId: "core-12_37_0__sc-172j5qh-2"
16
+ componentId: "core-12_38_0__sc-172j5qh-2"
17
17
  })(["color:", ";", " margin:0;"], colors.gray15, getTypographyIntent('h3'));
18
18
  var topMarginRules = function topMarginRules() {
19
19
  return css(["& + &,p + &,ol + &,ul + &{margin-top:", "px;}"], spacing.lg);
@@ -28,11 +28,11 @@ export function getSmallIconBodyTextRules() {
28
28
  }
29
29
  export var StyledP = /*#__PURE__*/styled.p.withConfig({
30
30
  displayName: "StyledP",
31
- componentId: "core-12_37_0__sc-172j5qh-3"
31
+ componentId: "core-12_38_0__sc-172j5qh-3"
32
32
  })(["color:", ";", " ", " ", ""], colors.gray15, getTypographyIntent('body'), topMarginRules, semiboldRules);
33
33
  export var StyledUL = /*#__PURE__*/styled.ul.withConfig({
34
34
  displayName: "StyledUL",
35
- componentId: "core-12_37_0__sc-172j5qh-4"
35
+ componentId: "core-12_38_0__sc-172j5qh-4"
36
36
  })(["color:", ";margin:0;padding:0;", " ", " padding-left:", "px;list-style-type:", ";"], colors.gray15, getTypographyIntent('body'), topMarginRules, spacing.lg, function (props) {
37
37
  return props.$listStyleType || 'disc';
38
38
  });
@@ -40,7 +40,7 @@ export var StyledOL = /*#__PURE__*/styled(StyledUL).attrs({
40
40
  as: 'ol'
41
41
  }).withConfig({
42
42
  displayName: "StyledOL",
43
- componentId: "core-12_37_0__sc-172j5qh-5"
43
+ componentId: "core-12_38_0__sc-172j5qh-5"
44
44
  })(["list-style-type:", ";"], function (props) {
45
45
  return props.$listStyleType || 'decimal';
46
46
  });
@@ -51,7 +51,7 @@ export var StyledLabel = /*#__PURE__*/styled(StyledTypography).attrs(function (p
51
51
  };
52
52
  }).withConfig({
53
53
  displayName: "StyledLabel",
54
- componentId: "core-12_37_0__sc-172j5qh-6"
54
+ componentId: "core-12_38_0__sc-172j5qh-6"
55
55
  })(["", " ", " > ", "{margin-left:", "px;vertical-align:top;}"], function (_ref) {
56
56
  var _ref$$block = _ref.$block,
57
57
  $block = _ref$$block === void 0 ? false : _ref$$block;
@@ -69,7 +69,7 @@ export function getUnstyledButton() {
69
69
  */
70
70
  export var StyledUnstyledButton = /*#__PURE__*/styled.button.withConfig({
71
71
  displayName: "StyledUnstyledButton",
72
- componentId: "core-12_37_0__sc-172j5qh-7"
72
+ componentId: "core-12_38_0__sc-172j5qh-7"
73
73
  })(["", ""], getUnstyledButton);
74
74
 
75
75
  /**
@@ -77,6 +77,6 @@ export var StyledUnstyledButton = /*#__PURE__*/styled.button.withConfig({
77
77
  */
78
78
  export var StyledAnchor = /*#__PURE__*/styled.a.withConfig({
79
79
  displayName: "StyledAnchor",
80
- componentId: "core-12_37_0__sc-172j5qh-8"
80
+ componentId: "core-12_38_0__sc-172j5qh-8"
81
81
  })([""]);
82
82
  //# sourceMappingURL=Semantic.styles.js.map
@@ -21,13 +21,13 @@ var getTrackBackgroundDisabled = function getTrackBackgroundDisabled(percent) {
21
21
  var getThumbDisabledStyles = /*#__PURE__*/css(["cursor:not-allowed;border:2px solid ", ";"], colors.blue85);
22
22
  export var StyledContainer = /*#__PURE__*/styled.div.withConfig({
23
23
  displayName: "StyledContainer",
24
- componentId: "core-12_37_0__sc-12icguw-0"
24
+ componentId: "core-12_38_0__sc-12icguw-0"
25
25
  })(["position:relative;", ";"], function (props) {
26
26
  return props.$showLabel && 'padding-bottom: 10px';
27
27
  });
28
28
  export var StyledSlider = /*#__PURE__*/styled.input.withConfig({
29
29
  displayName: "StyledSlider",
30
- componentId: "core-12_37_0__sc-12icguw-1"
30
+ componentId: "core-12_38_0__sc-12icguw-1"
31
31
  })(["-webkit-appearance:none;margin:0;padding-top:5px;padding-bottom:5px;width:100%;border:1px solid transparent;background-color:transparent;font-size:12px;&:focus{outline:none;", ";padding-top:5px;padding-bottom:5px;border-radius:2px;}&::-webkit-slider-runnable-track{", " ", "}&:disabled::-webkit-slider-runnable-track{cursor:not-allowed;", "}&::-webkit-slider-thumb{", " -webkit-appearance:none;margin-top:-5px;}&:disabled::-webkit-slider-thumb{", "}&::-moz-range-track{", " ", "}&:disabled::-moz-range-track{cursor:not-allowed;", "}&::-moz-range-thumb{", " height:12px;width:12px;}&:disabled::-moz-range-thumb{", "}&::-ms-track{", " height:", "px;color:transparent;", "}&:disabled::-ms-track{cursor:not-allowed;", "}&::-ms-fill-lower{background:", ";border:0px solid ", ";border-radius:2px;box-shadow:1px 1px 1px ", ";}&::-ms-fill-upper{background:", ";border:0px solid ", ";border-radius:2px;box-shadow:1px 1px 1px ", ";}&::-ms-thumb{", "}&:disabled::-ms-thumb{", "}&:focus::-ms-fill-lower{background:", ";}&:focus::-ms-fill-upper{background:", ";}"], function (props) {
32
32
  return props.$isDragging ? "border: 1px solid transparent" : "border: 1px solid ".concat(colors.blue40);
33
33
  }, getTrackStyles, function (props) {
@@ -45,14 +45,14 @@ export var StyledSlider = /*#__PURE__*/styled.input.withConfig({
45
45
  }, colors.blue50, colors.black, colors.black, colors.gray70, colors.black, colors.black, getThumbStyles, getThumbDisabledStyles, colors.blue50, colors.gray70);
46
46
  export var StyledIncrementOverlay = /*#__PURE__*/styled.div.withConfig({
47
47
  displayName: "StyledIncrementOverlay",
48
- componentId: "core-12_37_0__sc-12icguw-2"
48
+ componentId: "core-12_38_0__sc-12icguw-2"
49
49
  })(["position:relative;width:0;&::before{content:'';height:", "px;width:2px;background-color:white;display:block;}z-index:2;"], TRACK_HEIGHT);
50
50
  export var StyledIncrementContainer = /*#__PURE__*/styled.div.withConfig({
51
51
  displayName: "StyledIncrementContainer",
52
- componentId: "core-12_37_0__sc-12icguw-3"
52
+ componentId: "core-12_38_0__sc-12icguw-3"
53
53
  })(["position:absolute;display:flex;justify-content:space-between;top:6px;", " left:5px;right:5px;> :first-child{visibility:hidden;}> :last-child{visibility:hidden;}"], applyStylesOnlyToFF("\n top: 12px;\n "));
54
54
  export var StyledLabel = /*#__PURE__*/styled(Typography).withConfig({
55
55
  displayName: "StyledLabel",
56
- componentId: "core-12_37_0__sc-12icguw-4"
56
+ componentId: "core-12_38_0__sc-12icguw-4"
57
57
  })(["visibility:visible;position:absolute;left:50%;transform:translateX(-50%);margin-top:8px;"]);
58
58
  //# sourceMappingURL=Slider.styles.js.map
@@ -2,6 +2,7 @@ var _excluded = ["children", "className", "color", "label", "loading", "size", "
2
2
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
3
  function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
4
4
  function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
5
+ import { useId } from '@react-aria/utils';
5
6
  import React from 'react';
6
7
  import { useI18nContext } from '../_hooks/I18n';
7
8
  import { StyledCircle, StyledSpinnerContainer, StyledSpinnerContainerWithLabel, StyledSpinnerOverlay, StyledSpinnerOverlayContainer, StyledSpinnerOverlayLabel, StyledSpinnerSVG } from './Spinner.styles';
@@ -24,21 +25,28 @@ var Circle = /*#__PURE__*/React.forwardRef(function Circle(_ref, ref) {
24
25
  size = _ref$size === void 0 ? defaultSpinnerSize : _ref$size,
25
26
  _ref$variant = _ref.variant,
26
27
  variant = _ref$variant === void 0 ? 'default' : _ref$variant,
27
- label = _ref.label;
28
+ label = _ref.label,
29
+ labelId = _ref.labelId,
30
+ _ref$ariaHidden = _ref.ariaHidden,
31
+ ariaHidden = _ref$ariaHidden === void 0 ? false : _ref$ariaHidden;
28
32
  var i18n = useI18nContext();
29
33
  return /*#__PURE__*/React.createElement(StyledSpinnerContainer, {
34
+ "aria-labelledby": labelId,
30
35
  className: className,
31
36
  $color: color,
32
37
  $size: size,
33
38
  $variant: variant,
34
- ref: ref
39
+ ref: ref,
40
+ role: "progressbar"
35
41
  }, /*#__PURE__*/React.createElement(StyledSpinnerSVG, {
36
- viewBox: "0 0 48 48",
37
- xmlns: "http://www.w3.org/2000/svg",
38
- role: "img",
42
+ "aria-hidden": ariaHidden || undefined,
39
43
  "aria-label": label || i18n.t('core.spinner.loading', {
40
44
  defaultValue: 'Loading'
41
45
  }),
46
+ id: ariaHidden ? undefined : labelId,
47
+ role: "img",
48
+ viewBox: "0 0 48 48",
49
+ xmlns: "http://www.w3.org/2000/svg",
42
50
  $animate: loading,
43
51
  $mountTime: mountTime
44
52
  }, /*#__PURE__*/React.createElement(StyledCircle, {
@@ -77,11 +85,14 @@ export var Spinner = /*#__PURE__*/React.forwardRef(function Spinner(props, ref)
77
85
  _props$centered = props.centered,
78
86
  centered = _props$centered === void 0 ? false : _props$centered,
79
87
  rest = _objectWithoutProperties(props, _excluded);
88
+ var labelId = useId();
80
89
  var mountTime = React.useRef(Date.now());
90
+ var hasVisibleLabel = Boolean(children && label && !smallSizes.includes(size));
81
91
  if (!children) {
82
92
  // We are preserving the current behavior of the Spinner component,
83
93
  // where the loading prop does not apply when no children are passed.
84
94
  return /*#__PURE__*/React.createElement(Circle, _extends({}, props, {
95
+ labelId: labelId,
85
96
  loading: true,
86
97
  mountTime: mountTime.current,
87
98
  ref: ref
@@ -92,10 +103,14 @@ export var Spinner = /*#__PURE__*/React.forwardRef(function Spinner(props, ref)
92
103
  className: className,
93
104
  $centered: centered
94
105
  }, rest), /*#__PURE__*/React.createElement(StyledSpinnerOverlay, null), /*#__PURE__*/React.createElement(StyledSpinnerContainerWithLabel, null, /*#__PURE__*/React.createElement(Circle, _extends({}, props, {
106
+ ariaHidden: hasVisibleLabel,
95
107
  className: "",
108
+ labelId: labelId,
96
109
  mountTime: mountTime.current,
97
110
  ref: ref
98
- })), !smallSizes.includes(size) && /*#__PURE__*/React.createElement(StyledSpinnerOverlayLabel, null, label)), children);
111
+ })), !smallSizes.includes(size) && /*#__PURE__*/React.createElement(StyledSpinnerOverlayLabel, {
112
+ id: hasVisibleLabel ? labelId : undefined
113
+ }, label)), children);
99
114
  });
100
115
  Spinner.displayName = 'Spinner';
101
116
  //# sourceMappingURL=Spinner.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Spinner.js","names":["React","useI18nContext","StyledCircle","StyledSpinnerContainer","StyledSpinnerContainerWithLabel","StyledSpinnerOverlay","StyledSpinnerOverlayContainer","StyledSpinnerOverlayLabel","StyledSpinnerSVG","radiusMap","xs","sm","md","lg","smallSizes","defaultSpinnerSize","Circle","forwardRef","_ref","ref","_ref$className","className","color","_ref$loading","loading","mountTime","_ref$size","size","_ref$variant","variant","label","i18n","createElement","$color","$size","$variant","viewBox","xmlns","role","t","defaultValue","$animate","$mountTime","cx","cy","r","Spinner","props","children","_props$className","_props$loading","_props$size","_props$variant","_props$centered","centered","rest","_objectWithoutProperties","_excluded","useRef","Date","now","_extends","current","$loading","$centered","includes","displayName"],"sources":["../../src/Spinner/Spinner.tsx"],"sourcesContent":["import React from 'react'\nimport { useI18nContext } from '../_hooks/I18n'\nimport {\n StyledCircle,\n StyledSpinnerContainer,\n StyledSpinnerContainerWithLabel,\n StyledSpinnerOverlay,\n StyledSpinnerOverlayContainer,\n StyledSpinnerOverlayLabel,\n StyledSpinnerSVG,\n} from './Spinner.styles'\nimport type { SpinnerProps, SpinnerSize } from './Spinner.types'\n\nconst radiusMap: Record<SpinnerSize, number> = {\n xs: 18.5,\n sm: 18,\n md: 20,\n lg: 20.5,\n}\n\nconst smallSizes: SpinnerSize[] = ['xs', 'sm']\n\nexport const defaultSpinnerSize: SpinnerSize = 'lg'\n\nconst Circle = React.forwardRef<\n HTMLDivElement,\n SpinnerProps & {\n mountTime: number\n }\n>(function Circle(\n {\n className = '',\n color,\n loading = false,\n mountTime,\n size = defaultSpinnerSize,\n variant = 'default',\n label,\n },\n ref\n) {\n const i18n = useI18nContext()\n return (\n <StyledSpinnerContainer\n className={className}\n $color={color}\n $size={size}\n $variant={variant}\n ref={ref}\n >\n <StyledSpinnerSVG\n viewBox=\"0 0 48 48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n role=\"img\"\n aria-label={\n label ||\n i18n.t('core.spinner.loading', {\n defaultValue: 'Loading',\n })\n }\n $animate={loading}\n $mountTime={mountTime}\n >\n <StyledCircle\n cx=\"24\"\n cy=\"24\"\n r={radiusMap[size]}\n $animate={loading}\n $mountTime={mountTime}\n />\n </StyledSpinnerSVG>\n </StyledSpinnerContainer>\n )\n})\n\n/**\n\n Spinners indicate a loading state on either a full page or smaller component,\n like a menu, select or button.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-spinner--demo)\n\n @see [Design Guidelines](https://design.procore.com/spinner)\n\n */\nexport const Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(props, ref) {\n const {\n children,\n className = '',\n color,\n label,\n loading = false,\n size = defaultSpinnerSize,\n variant = 'default',\n centered = false,\n ...rest\n } = props\n const mountTime = React.useRef(Date.now())\n\n if (!children) {\n // We are preserving the current behavior of the Spinner component,\n // where the loading prop does not apply when no children are passed.\n return (\n <Circle {...props} loading mountTime={mountTime.current} ref={ref} />\n )\n }\n\n return (\n <StyledSpinnerOverlayContainer\n $loading={loading}\n className={className}\n $centered={centered}\n {...rest}\n >\n <StyledSpinnerOverlay />\n <StyledSpinnerContainerWithLabel>\n <Circle\n {...props}\n className=\"\"\n mountTime={mountTime.current}\n ref={ref}\n />\n {!smallSizes.includes(size) && (\n <StyledSpinnerOverlayLabel>{label}</StyledSpinnerOverlayLabel>\n )}\n </StyledSpinnerContainerWithLabel>\n {children}\n </StyledSpinnerOverlayContainer>\n )\n }\n)\n\nSpinner.displayName = 'Spinner'\n"],"mappings":"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"}
1
+ {"version":3,"file":"Spinner.js","names":["useId","React","useI18nContext","StyledCircle","StyledSpinnerContainer","StyledSpinnerContainerWithLabel","StyledSpinnerOverlay","StyledSpinnerOverlayContainer","StyledSpinnerOverlayLabel","StyledSpinnerSVG","radiusMap","xs","sm","md","lg","smallSizes","defaultSpinnerSize","Circle","forwardRef","_ref","ref","_ref$className","className","color","_ref$loading","loading","mountTime","_ref$size","size","_ref$variant","variant","label","labelId","_ref$ariaHidden","ariaHidden","i18n","createElement","$color","$size","$variant","role","undefined","t","defaultValue","id","viewBox","xmlns","$animate","$mountTime","cx","cy","r","Spinner","props","children","_props$className","_props$loading","_props$size","_props$variant","_props$centered","centered","rest","_objectWithoutProperties","_excluded","useRef","Date","now","hasVisibleLabel","Boolean","includes","_extends","current","$loading","$centered","displayName"],"sources":["../../src/Spinner/Spinner.tsx"],"sourcesContent":["import { useId } from '@react-aria/utils'\nimport React from 'react'\nimport { useI18nContext } from '../_hooks/I18n'\nimport {\n StyledCircle,\n StyledSpinnerContainer,\n StyledSpinnerContainerWithLabel,\n StyledSpinnerOverlay,\n StyledSpinnerOverlayContainer,\n StyledSpinnerOverlayLabel,\n StyledSpinnerSVG,\n} from './Spinner.styles'\nimport type { SpinnerProps, SpinnerSize } from './Spinner.types'\n\nconst radiusMap: Record<SpinnerSize, number> = {\n xs: 18.5,\n sm: 18,\n md: 20,\n lg: 20.5,\n}\n\nconst smallSizes: SpinnerSize[] = ['xs', 'sm']\n\nexport const defaultSpinnerSize: SpinnerSize = 'lg'\n\nconst Circle = React.forwardRef<\n HTMLDivElement,\n SpinnerProps & {\n mountTime: number\n labelId: string\n ariaHidden?: boolean\n }\n>(function Circle(\n {\n className = '',\n color,\n loading = false,\n mountTime,\n size = defaultSpinnerSize,\n variant = 'default',\n label,\n labelId,\n ariaHidden = false,\n },\n ref\n) {\n const i18n = useI18nContext()\n return (\n <StyledSpinnerContainer\n aria-labelledby={labelId}\n className={className}\n $color={color}\n $size={size}\n $variant={variant}\n ref={ref}\n role=\"progressbar\"\n >\n <StyledSpinnerSVG\n aria-hidden={ariaHidden || undefined}\n aria-label={\n label ||\n i18n.t('core.spinner.loading', {\n defaultValue: 'Loading',\n })\n }\n id={ariaHidden ? undefined : labelId}\n role=\"img\"\n viewBox=\"0 0 48 48\"\n xmlns=\"http://www.w3.org/2000/svg\"\n $animate={loading}\n $mountTime={mountTime}\n >\n <StyledCircle\n cx=\"24\"\n cy=\"24\"\n r={radiusMap[size]}\n $animate={loading}\n $mountTime={mountTime}\n />\n </StyledSpinnerSVG>\n </StyledSpinnerContainer>\n )\n})\n\n/**\n\n Spinners indicate a loading state on either a full page or smaller component,\n like a menu, select or button.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-spinner--demo)\n\n @see [Design Guidelines](https://design.procore.com/spinner)\n\n */\nexport const Spinner = React.forwardRef<HTMLDivElement, SpinnerProps>(\n function Spinner(props, ref) {\n const {\n children,\n className = '',\n color,\n label,\n loading = false,\n size = defaultSpinnerSize,\n variant = 'default',\n centered = false,\n ...rest\n } = props\n const labelId = useId()\n const mountTime = React.useRef(Date.now())\n const hasVisibleLabel = Boolean(\n children && label && !smallSizes.includes(size)\n )\n\n if (!children) {\n // We are preserving the current behavior of the Spinner component,\n // where the loading prop does not apply when no children are passed.\n return (\n <Circle\n {...props}\n labelId={labelId}\n loading\n mountTime={mountTime.current}\n ref={ref}\n />\n )\n }\n\n return (\n <StyledSpinnerOverlayContainer\n $loading={loading}\n className={className}\n $centered={centered}\n {...rest}\n >\n <StyledSpinnerOverlay />\n <StyledSpinnerContainerWithLabel>\n <Circle\n {...props}\n ariaHidden={hasVisibleLabel}\n className=\"\"\n labelId={labelId}\n mountTime={mountTime.current}\n ref={ref}\n />\n {!smallSizes.includes(size) && (\n <StyledSpinnerOverlayLabel\n id={hasVisibleLabel ? labelId : undefined}\n >\n {label}\n </StyledSpinnerOverlayLabel>\n )}\n </StyledSpinnerContainerWithLabel>\n {children}\n </StyledSpinnerOverlayContainer>\n )\n }\n)\n\nSpinner.displayName = 'Spinner'\n"],"mappings":"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"}
@@ -10,7 +10,7 @@ var zOverlay = 2;
10
10
  var dash = /*#__PURE__*/keyframes(["0%{stroke-dasharray:1,150;stroke-dashoffset:0;}50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}"]);
11
11
  export var StyledCircle = /*#__PURE__*/styled.circle.withConfig({
12
12
  displayName: "StyledCircle",
13
- componentId: "core-12_37_0__sc-1igww3-0"
13
+ componentId: "core-12_38_0__sc-1igww3-0"
14
14
  })(["", " stroke-linecap:round;"], function (p) {
15
15
  if (p.$animate) {
16
16
  var animationDelay = -(p.$mountTime % duration);
@@ -51,16 +51,16 @@ function getStrokeColor(_ref2) {
51
51
  }
52
52
  export var StyledSpinnerContainer = /*#__PURE__*/styled.div.withConfig({
53
53
  displayName: "StyledSpinnerContainer",
54
- componentId: "core-12_37_0__sc-1igww3-1"
54
+ componentId: "core-12_38_0__sc-1igww3-1"
55
55
  })(["border-radius:100%;box-sizing:border-box;display:block;flex-shrink:0;position:relative;", " ", "{", "}"], getHeightWidthStroke, StyledCircle, getStrokeColor);
56
56
  export var StyledSpinnerOverlayLabel = /*#__PURE__*/styled.span.withConfig({
57
57
  displayName: "StyledSpinnerOverlayLabel",
58
- componentId: "core-12_37_0__sc-1igww3-2"
58
+ componentId: "core-12_38_0__sc-1igww3-2"
59
59
  })(["", " color:", ";display:block;min-height:20px;padding-top:", "px;text-align:center;transition:opacity ", ";"], getTypographyIntent('body'), colors.gray15, spacing.md, transition);
60
60
  var rotate = /*#__PURE__*/keyframes(["to{transform:rotate(360deg);}"]);
61
61
  export var StyledSpinnerSVG = /*#__PURE__*/styled.svg.withConfig({
62
62
  displayName: "StyledSpinnerSVG",
63
- componentId: "core-12_37_0__sc-1igww3-3"
63
+ componentId: "core-12_38_0__sc-1igww3-3"
64
64
  })(["", " fill:none;height:100%;left:0;margin:auto;position:absolute;right:0;top:0;width:100%;z-index:2;"], function (p) {
65
65
  if (p.$animate) {
66
66
  var animationDelay = -(p.$mountTime % (duration - durationOffset));
@@ -70,15 +70,15 @@ export var StyledSpinnerSVG = /*#__PURE__*/styled.svg.withConfig({
70
70
  var startsWithNoInteraction = /*#__PURE__*/css(["opacity:0;pointer-events:none;transition:opacity ", ";"], transition);
71
71
  export var StyledSpinnerOverlay = /*#__PURE__*/styled.div.withConfig({
72
72
  displayName: "StyledSpinnerOverlay",
73
- componentId: "core-12_37_0__sc-1igww3-4"
73
+ componentId: "core-12_38_0__sc-1igww3-4"
74
74
  })(["", ";background-color:", ";bottom:0;left:0;position:absolute;right:0;top:0;z-index:", ";"], startsWithNoInteraction, colors.white, zOverlay);
75
75
  export var StyledSpinnerContainerWithLabel = /*#__PURE__*/styled.div.withConfig({
76
76
  displayName: "StyledSpinnerContainerWithLabel",
77
- componentId: "core-12_37_0__sc-1igww3-5"
77
+ componentId: "core-12_38_0__sc-1igww3-5"
78
78
  })(["", ";align-items:center;display:flex;flex-direction:column;height:100%;max-height:400px;justify-content:center;position:absolute;top:0;width:100%;z-index:", ";"], startsWithNoInteraction, zContainer);
79
79
  export var StyledSpinnerOverlayContainer = /*#__PURE__*/styled.div.withConfig({
80
80
  displayName: "StyledSpinnerOverlayContainer",
81
- componentId: "core-12_37_0__sc-1igww3-6"
81
+ componentId: "core-12_38_0__sc-1igww3-6"
82
82
  })(["min-height:150px;position:relative;", " ", ""], function (_ref3) {
83
83
  var $loading = _ref3.$loading;
84
84
  if ($loading) {
@@ -7,18 +7,18 @@ import { spacing } from '../_styles/spacing';
7
7
  var MIN_CARD_HEIGHT = 364;
8
8
  export var StyledSplitViewCardContainer = /*#__PURE__*/styled.div.withConfig({
9
9
  displayName: "StyledSplitViewCardContainer",
10
- componentId: "core-12_37_0__sc-9hrkda-0"
10
+ componentId: "core-12_38_0__sc-9hrkda-0"
11
11
  })(["display:grid;grid-template-columns:1fr auto;border-radius:", "px;box-shadow:0 0 4px 0 rgba(0,0,0,0.25);min-height:", "px;position:relative;width:100%;@media (max-width:", "){box-shadow:none;display:flex;flex-direction:column;width:100%;}"], spacing.sm, MIN_CARD_HEIGHT, breakpointMinWidthValues.tabletMd);
12
12
  export var StyledSplitViewCardMain = /*#__PURE__*/styled.div.withConfig({
13
13
  displayName: "StyledSplitViewCardMain",
14
- componentId: "core-12_37_0__sc-9hrkda-1"
14
+ componentId: "core-12_38_0__sc-9hrkda-1"
15
15
  })(["background-color:", ";border-top-left-radius:", "px;border-bottom-left-radius:", "px;position:relative;width:60%;transition:all ease 500ms;@media (max-width:", "){box-shadow:0 0 4px 0 rgba(0,0,0,0.25);border-radius:", "px;margin-bottom:", "px;width:100%;}", ""], colors.white, spacing.sm, spacing.sm, breakpointMinWidthValues.tabletMd, spacing.sm, spacing.sm, function (_ref) {
16
16
  var $open = _ref.$open;
17
17
  return !$open && css(["border-radius:", "px;width:100%;"], spacing.sm);
18
18
  });
19
19
  export var StyledSplitViewCardAside = /*#__PURE__*/styled.div.withConfig({
20
20
  displayName: "StyledSplitViewCardAside",
21
- componentId: "core-12_37_0__sc-9hrkda-2"
21
+ componentId: "core-12_38_0__sc-9hrkda-2"
22
22
  })(["background-color:", ";border-left:1px solid ", ";border-top-right-radius:", "px;border-bottom-right-radius:", "px;display:flex;flex-direction:column;height:100%;width:40%;min-height:", "px;min-width:400px;transition:all ease 500ms;z-index:2;position:absolute;top:0;right:0;@media screen and (max-width:", "px){min-width:unset;}@media (max-width:", "){box-shadow:0 0 4px 0 rgba(0,0,0,0.25);border:none;border-radius:", "px;position:relative;width:100%;}", " ", ""], colors.white, colors.gray85, spacing.sm, spacing.sm, MIN_CARD_HEIGHT, breakpointRawMinWidthValues.tabletSm, breakpointMinWidthValues.tabletMd, spacing.sm, function (_ref2) {
23
23
  var $open = _ref2.$open;
24
24
  return !$open && css(["border:none;border-radius:", "px;overflow:hidden !important;@media (min-width:", "){min-width:0;width:0 !important;}@media (max-width:", "){display:none;}"], spacing.sm, breakpointMinWidthValues.tabletMd, breakpointMinWidthValues.tabletMd);
@@ -28,23 +28,23 @@ export var StyledSplitViewCardAside = /*#__PURE__*/styled.div.withConfig({
28
28
  });
29
29
  export var StyledSplitViewCardHeading = /*#__PURE__*/styled(H2).withConfig({
30
30
  displayName: "StyledSplitViewCardHeading",
31
- componentId: "core-12_37_0__sc-9hrkda-3"
31
+ componentId: "core-12_38_0__sc-9hrkda-3"
32
32
  })(["overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;"]);
33
33
  export var StyledSplitViewCardTitle = /*#__PURE__*/styled.div.withConfig({
34
34
  displayName: "StyledSplitViewCardTitle",
35
- componentId: "core-12_37_0__sc-9hrkda-4"
35
+ componentId: "core-12_38_0__sc-9hrkda-4"
36
36
  })(["display:flex;align-items:center;justify-content:space-between;margin-bottom:", "px;min-height:36px;"], spacing.sm);
37
37
  export var StyledSplitViewCardHeader = /*#__PURE__*/styled.div.withConfig({
38
38
  displayName: "StyledSplitViewCardHeader",
39
- componentId: "core-12_37_0__sc-9hrkda-5"
39
+ componentId: "core-12_38_0__sc-9hrkda-5"
40
40
  })(["border-bottom:1px solid ", ";display:flex;flex-direction:column;padding:", "px ", "px 0;"], colors.gray85, spacing.lg, spacing.lg);
41
41
  export var StyledSplitViewCardBody = /*#__PURE__*/styled.div.withConfig({
42
42
  displayName: "StyledSplitViewCardBody",
43
- componentId: "core-12_37_0__sc-9hrkda-6"
43
+ componentId: "core-12_38_0__sc-9hrkda-6"
44
44
  })(["display:flex;flex-direction:column;flex:1;padding:", "px ", "px 0;overflow-y:auto;&:focus-visible{", "}"], spacing.lg, spacing.lg, getFocusInset());
45
45
  export var StyledSplitViewCardFooter = /*#__PURE__*/styled.div.withConfig({
46
46
  displayName: "StyledSplitViewCardFooter",
47
- componentId: "core-12_37_0__sc-9hrkda-7"
47
+ componentId: "core-12_38_0__sc-9hrkda-7"
48
48
  })(["display:flex;align-items:center;justify-content:flex-end;padding:", "px;", ""], spacing.lg, function (_ref4) {
49
49
  var $hasShadow = _ref4.$hasShadow;
50
50
  return $hasShadow && css(["box-shadow:0 -4px 6px 0 #0000001a;"]);
@@ -50,10 +50,7 @@ export var MultiTrigger = function MultiTrigger(props) {
50
50
  var ctx = useSuperSelectContext();
51
51
  if (ctx.config.multiple && Array.isArray(ctx.state.value)) {
52
52
  var _ctx$state$value;
53
- return /*#__PURE__*/React.createElement("div", {
54
- role: "group",
55
- "aria-labelledby": ctx.state.labelId
56
- }, /*#__PURE__*/React.createElement(ctx.components.MultiValueContainer, props, (_ctx$state$value = ctx.state.value) === null || _ctx$state$value === void 0 ? void 0 : _ctx$state$value.map(function (val, j) {
53
+ return /*#__PURE__*/React.createElement(ctx.components.MultiValueContainer, props, (_ctx$state$value = ctx.state.value) === null || _ctx$state$value === void 0 ? void 0 : _ctx$state$value.map(function (val, j) {
57
54
  var option = ctx.state.sourceOptions.find(function (o) {
58
55
  return ctx.option.value(o) === val;
59
56
  });
@@ -62,7 +59,7 @@ export var MultiTrigger = function MultiTrigger(props) {
62
59
  index: j,
63
60
  option: option
64
61
  });
65
- }), /*#__PURE__*/React.createElement(ctx.components.MultiInputContainer, null, /*#__PURE__*/React.createElement(ctx.components.MultiInput, ctx.props.multiInput()))));
62
+ }), /*#__PURE__*/React.createElement(ctx.components.MultiInputContainer, null, /*#__PURE__*/React.createElement(ctx.components.MultiInput, ctx.props.multiInput())));
66
63
  }
67
64
  return null;
68
65
  };
@@ -92,14 +89,10 @@ export var Label = /*#__PURE__*/React.forwardRef(function (_ref2, ref) {
92
89
  var hoverable = _ref2.hoverable,
93
90
  props = _objectWithoutProperties(_ref2, _excluded);
94
91
  var ctx = useSuperSelectContext();
95
- return /*#__PURE__*/React.createElement(StyledLabel, _extends({
96
- id: ctx.state.labelId
97
- }, props, ctx.props.label(), {
92
+ return /*#__PURE__*/React.createElement(StyledLabel, _extends({}, props, ctx.props.label(), {
98
93
  ref: ref,
99
94
  $hoverable: hoverable
100
- }), /*#__PURE__*/React.createElement("span", {
101
- id: ctx.state.valueId
102
- }, ctx.state.selectedLabel || ctx.config.placeholder));
95
+ }), ctx.state.selectedLabel || ctx.config.placeholder);
103
96
  });
104
97
  export var Loading = function Loading() {
105
98
  return /*#__PURE__*/React.createElement(Spinner, {
@@ -260,8 +253,7 @@ export var Item = /*#__PURE__*/React.forwardRef(function (_ref4, ref) {
260
253
  $isDraggingOver: isDraggingOver,
261
254
  $selected: isSelected,
262
255
  "aria-posinset": withSelectAllIndex,
263
- "aria-disabled": isDisabled || undefined,
264
- "aria-selected": isSelected,
256
+ "aria-selected": ctx.state.activeMenuIndex === withSelectAllIndex,
265
257
  "aria-setsize": ctx.state.options.length || 0,
266
258
  id: "item-".concat(value),
267
259
  ref: setNode,
@@ -346,8 +338,7 @@ export var SelectAll = /*#__PURE__*/React.forwardRef(function (_ref5, ref) {
346
338
  $highlighted: ctx.state.activeMenuIndex === index,
347
339
  $selected: isSelected,
348
340
  "aria-posinset": index,
349
- "aria-disabled": isDisabled || undefined,
350
- "aria-selected": isSelected,
341
+ "aria-selected": ctx.state.activeMenuIndex === index,
351
342
  "aria-setsize": ctx.state.options.length || 0,
352
343
  id: "item-".concat(ctx.state.selectAllOption.id),
353
344
  ref: setNode,