@procore/core-react 12.34.1 → 12.35.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 (255) hide show
  1. package/CHANGELOG.md +26 -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.styles.js +10 -10
  8. package/dist/Box/Box.styles.js +1 -1
  9. package/dist/Breadcrumbs/Breadcrumbs.styles.js +4 -4
  10. package/dist/Button/Button.styles.js +5 -5
  11. package/dist/Calendar/Calendar.d.ts +2 -2
  12. package/dist/Calendar/Calendar.js.map +1 -1
  13. package/dist/Calendar/Calendar.styles.d.ts +6 -3
  14. package/dist/Calendar/Calendar.styles.js +15 -9
  15. package/dist/Calendar/Calendar.styles.js.map +1 -1
  16. package/dist/Calendar/Calendar.types.d.ts +1 -31
  17. package/dist/Calendar/Calendar.types.js.map +1 -1
  18. package/dist/Card/Card.styles.js +1 -1
  19. package/dist/Checkbox/Checkbox.styles.js +6 -6
  20. package/dist/Checkbox/CheckboxTooltip.js +1 -1
  21. package/dist/ContactItem/ContactItem.styles.js +5 -5
  22. package/dist/ContactItem/ContactItem.types.d.ts +2 -0
  23. package/dist/ContactItem/ContactItem.types.js.map +1 -1
  24. package/dist/Content/Content.styles.js +2 -2
  25. package/dist/DateInput/DateInput.js +58 -53
  26. package/dist/DateInput/DateInput.js.map +1 -1
  27. package/dist/DateInput/DateInput.styles.js +6 -6
  28. package/dist/DetailPage/DetailPage.styles.js +7 -7
  29. package/dist/Dropdown/Dropdown.styles.js +3 -3
  30. package/dist/DropdownFlyout/DropdownFlyout.styles.js +4 -4
  31. package/dist/Dropzone/Dropzone.js +1 -1
  32. package/dist/Dropzone/Dropzone.styles.js +9 -9
  33. package/dist/EmptyState/EmptyState.styles.js +6 -6
  34. package/dist/Field/Field.styles.js +3 -3
  35. package/dist/FileList/FileList.styles.js +4 -4
  36. package/dist/FileSelect/FileExplorer/FileExplorer.styles.js +9 -9
  37. package/dist/FileSelect/FileExplorer/FileExplorerSidebar.styles.js +3 -3
  38. package/dist/FileSelect/FileSelect.styles.js +2 -2
  39. package/dist/FileSelect/FileSelectDropzone/FileSelectDropzone.styles.js +3 -3
  40. package/dist/FileSelect/FileTokenList/FileTokenList.styles.js +2 -2
  41. package/dist/FileSelect/GridSource/GridSource.styles.js +6 -6
  42. package/dist/FileSelect/LocalSource/LocalSource.styles.js +4 -4
  43. package/dist/FileSelect/SourceItem/SourceItem.styles.js +3 -3
  44. package/dist/FileSelect/ThumbnailList/ThumbnailList.styles.js +6 -6
  45. package/dist/FileSelect/TreeSource/TreeSource.styles.js +1 -1
  46. package/dist/FileToken/FileToken.styles.js +4 -4
  47. package/dist/FilterToken/FilterToken.styles.js +5 -5
  48. package/dist/FlexList/FlexList.styles.js +1 -1
  49. package/dist/Form/Form.styles.js +14 -14
  50. package/dist/Form/StyledFormikForm.styles.js +2 -2
  51. package/dist/GhostPlaceholder/GhostPlaceholder.styles.js +2 -2
  52. package/dist/Grid/Grid.styles.js +2 -2
  53. package/dist/GroupSelect/GroupSelect.styles.js +1 -1
  54. package/dist/Input/Input.styles.js +1 -1
  55. package/dist/Link/Link.styles.js +1 -1
  56. package/dist/ListPage/ListPage.styles.js +8 -8
  57. package/dist/Loader/Loader.styles.js +2 -2
  58. package/dist/MenuImperative/MenuImperative.styles.js +10 -10
  59. package/dist/Modal/Modal.styles.js +13 -13
  60. package/dist/MultiSelect/MultiSelect.styles.js +6 -6
  61. package/dist/NextMenu/NextMenu.styles.js +3 -3
  62. package/dist/Notation/Notation.js +1 -1
  63. package/dist/NumberInput/NumberInput.styles.js +7 -7
  64. package/dist/Overlay/OverlayArrow.styles.js +1 -1
  65. package/dist/PageLayout/PageLayout.styles.js +16 -16
  66. package/dist/PageTemplate/PageFooterTemplate/PageFooterTemplate.styles.js +1 -1
  67. package/dist/PageTemplate/PageHeaderTemplate/PageHeaderTemplate.styles.js +3 -3
  68. package/dist/PageTemplate/PagePaneTemplate/PagePaneTemplate.styles.js +2 -2
  69. package/dist/PageTemplate/PageTemplate/PageTemplate.styles.js +3 -3
  70. package/dist/Pagination/Pagination.styles.js +5 -5
  71. package/dist/Panel/Panel.js +6 -2
  72. package/dist/Panel/Panel.js.map +1 -1
  73. package/dist/Panel/Panel.styles.js +11 -11
  74. package/dist/Pill/Pill.styles.js +3 -3
  75. package/dist/PillSelect/PillSelect.styles.js +4 -4
  76. package/dist/Popover/Popover.styles.js +2 -2
  77. package/dist/Portal/Portal.js +4 -1
  78. package/dist/Portal/Portal.js.map +1 -1
  79. package/dist/Portal/Portal.styles.js +1 -1
  80. package/dist/Portal/Portal.types.d.ts +1 -1
  81. package/dist/Portal/Portal.types.js.map +1 -1
  82. package/dist/Portal/PortalProvider.d.ts +5 -0
  83. package/dist/Portal/PortalProvider.js +14 -0
  84. package/dist/Portal/PortalProvider.js.map +1 -0
  85. package/dist/Portal/PortalProvider.types.d.ts +4 -0
  86. package/dist/Portal/PortalProvider.types.js +2 -0
  87. package/dist/Portal/PortalProvider.types.js.map +1 -0
  88. package/dist/Portal/index.d.ts +2 -0
  89. package/dist/Portal/index.js +1 -0
  90. package/dist/Portal/index.js.map +1 -1
  91. package/dist/ProgressBar/ProgressBar.styles.js +2 -2
  92. package/dist/RadioButton/RadioButton.styles.js +3 -3
  93. package/dist/Required/Required.styles.js +3 -3
  94. package/dist/Search/Search.styles.js +5 -5
  95. package/dist/Section/Section.styles.js +7 -7
  96. package/dist/SegmentedController/SegmentedController.styles.js +4 -4
  97. package/dist/Select/Select.styles.js +7 -7
  98. package/dist/Semantic/Semantic.styles.js +9 -9
  99. package/dist/Slider/Slider.styles.js +5 -5
  100. package/dist/Spinner/Spinner.styles.js +7 -7
  101. package/dist/SplitViewCard/SplitViewCard.context.js +10 -2
  102. package/dist/SplitViewCard/SplitViewCard.context.js.map +1 -1
  103. package/dist/SplitViewCard/SplitViewCard.js +4 -2
  104. package/dist/SplitViewCard/SplitViewCard.js.map +1 -1
  105. package/dist/SplitViewCard/SplitViewCard.styles.js +8 -8
  106. package/dist/SplitViewCard/SplitViewCard.types.js.map +1 -1
  107. package/dist/SuperSelect/SuperSelect.presets.styles.js +1 -1
  108. package/dist/SuperSelect/SuperSelect.styles.js +38 -38
  109. package/dist/Switch/Switch.styles.js +4 -4
  110. package/dist/Table/Table.d.ts +2 -2
  111. package/dist/Table/Table.js +58 -18
  112. package/dist/Table/Table.js.map +1 -1
  113. package/dist/Table/Table.styles.d.ts +3 -1
  114. package/dist/Table/Table.styles.js +32 -31
  115. package/dist/Table/Table.styles.js.map +1 -1
  116. package/dist/Table/Table.types.d.ts +5 -0
  117. package/dist/Table/Table.types.js.map +1 -1
  118. package/dist/TableShelf/TableShelf.styles.js +5 -5
  119. package/dist/Tabs/Tabs.styles.js +15 -15
  120. package/dist/Tearsheet/Tearsheet.styles.js +5 -5
  121. package/dist/TextArea/TextArea.js +1 -0
  122. package/dist/TextArea/TextArea.js.map +1 -1
  123. package/dist/TextArea/TextArea.styles.js +1 -1
  124. package/dist/TextEditor/TextEditor.d.ts +1 -1
  125. package/dist/TextEditor/TextEditor.js +67 -12
  126. package/dist/TextEditor/TextEditor.js.map +1 -1
  127. package/dist/TextEditor/TextEditor.types.d.ts +17 -0
  128. package/dist/TextEditor/TextEditor.types.js.map +1 -1
  129. package/dist/TextEditorOutput/TextEditorOutput.styles.js +1 -1
  130. package/dist/Thumbnail/Thumbnail.styles.js +17 -17
  131. package/dist/Thumbnail/ThumbnailDocumentIcon.d.ts +3 -1
  132. package/dist/Thumbnail/ThumbnailDocumentIcon.js +61 -21
  133. package/dist/Thumbnail/ThumbnailDocumentIcon.js.map +1 -1
  134. package/dist/ThumbnailGrid/ThumbnailGrid.styles.js +7 -7
  135. package/dist/TieredSelect/TieredSelect.styles.js +9 -9
  136. package/dist/Tile/Tile.styles.js +8 -8
  137. package/dist/Title/Title.styles.js +7 -7
  138. package/dist/Toast/Toast.js +1 -1
  139. package/dist/Toast/Toast.js.map +1 -1
  140. package/dist/Toast/Toast.styles.js +3 -3
  141. package/dist/ToggleButton/ToggleButton.styles.js +1 -1
  142. package/dist/Token/Token.styles.js +3 -3
  143. package/dist/ToolHeader/ToolHeader.styles.js +6 -6
  144. package/dist/ToolLandingPage/ToolLandingPage.styles.js +3 -3
  145. package/dist/Tooltip/Tooltip.styles.js +2 -2
  146. package/dist/Tree/Tree.styles.js +9 -9
  147. package/dist/Typeahead/Typeahead.styles.js +3 -3
  148. package/dist/Typography/Typography.styles.js +1 -1
  149. package/dist/Typography/Typography.table.story.js +2 -2
  150. package/dist/_hooks/I18n.d.ts +162 -11
  151. package/dist/_locales/de-DE.json +9 -3
  152. package/dist/_locales/en-AU.json +8 -2
  153. package/dist/_locales/en-CA.json +8 -2
  154. package/dist/_locales/en-GB.json +8 -2
  155. package/dist/_locales/en.json +4 -0
  156. package/dist/_locales/es-ES.json +10 -4
  157. package/dist/_locales/es.json +13 -7
  158. package/dist/_locales/fr-CA.json +9 -3
  159. package/dist/_locales/fr-FR.json +10 -4
  160. package/dist/_locales/is-IS.json +9 -3
  161. package/dist/_locales/it-IT.json +54 -48
  162. package/dist/_locales/ja-JP.json +10 -4
  163. package/dist/_locales/pl-PL.json +8 -2
  164. package/dist/_locales/pseudo.json +4 -0
  165. package/dist/_locales/pt-BR.json +9 -3
  166. package/dist/_locales/pt-PT.json +188 -182
  167. package/dist/_locales/th-TH.json +11 -5
  168. package/dist/_locales/zh-SG.json +8 -2
  169. package/dist/_locales/zh-TW.json +13 -7
  170. package/dist/_storyHelpers_/components/Deprecation.styles.js +1 -1
  171. package/dist/_storyHelpers_/components/StoryGrid.js +3 -3
  172. package/dist/_typedoc/AnchorNavigation/AnchorNavigation.types.json +3 -3
  173. package/dist/_typedoc/Avatar/Avatar.types.json +20 -20
  174. package/dist/_typedoc/AvatarStack/AvatarStack.types.json +24 -24
  175. package/dist/_typedoc/Badge/Badge.types.json +6 -6
  176. package/dist/_typedoc/Banner/Banner.types.json +13 -13
  177. package/dist/_typedoc/Box/Box.types.json +68 -68
  178. package/dist/_typedoc/Breadcrumbs/Breadcrumbs.types.json +10 -10
  179. package/dist/_typedoc/Button/Button.types.json +13 -13
  180. package/dist/_typedoc/Calendar/Calendar.types.json +89 -89
  181. package/dist/_typedoc/Card/Card.types.json +6 -6
  182. package/dist/_typedoc/Checkbox/Checkbox.types.json +8 -8
  183. package/dist/_typedoc/ContactItem/ContactItem.types.json +12 -10
  184. package/dist/_typedoc/DateInput/DateInput.types.json +35 -35
  185. package/dist/_typedoc/DateSelect/DateSelect.types.json +13 -13
  186. package/dist/_typedoc/DetailPage/DetailPage.types.json +5 -5
  187. package/dist/_typedoc/Dropdown/Dropdown.types.json +37 -37
  188. package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +30 -30
  189. package/dist/_typedoc/Dropzone/Dropzone.types.json +44 -44
  190. package/dist/_typedoc/EmptyState/EmptyState.types.json +16 -16
  191. package/dist/_typedoc/FileList/FileList.types.json +9 -9
  192. package/dist/_typedoc/FileSelect/FileSelect.types.json +27 -27
  193. package/dist/_typedoc/FileSelect/GridSource/GridSource.types.json +20 -20
  194. package/dist/_typedoc/FileSelect/LocalSource/LocalSource.types.json +14 -14
  195. package/dist/_typedoc/FileSelect/TreeSource/TreeSource.types.json +9 -9
  196. package/dist/_typedoc/Flex/Flex.types.json +27 -27
  197. package/dist/_typedoc/FlexList/FlexList.types.json +30 -30
  198. package/dist/_typedoc/Form/Form.types.json +794 -754
  199. package/dist/_typedoc/GhostPlaceholder/GhostPlaceholder.types.json +12 -12
  200. package/dist/_typedoc/Grid/Grid.types.json +8 -8
  201. package/dist/_typedoc/GroupSelect/GroupSelect.types.json +52 -52
  202. package/dist/_typedoc/Input/Input.types.json +2 -2
  203. package/dist/_typedoc/Link/Link.types.json +1 -1
  204. package/dist/_typedoc/ListPage/ListPage.types.json +13 -13
  205. package/dist/_typedoc/Menu/Menu.types.json +62 -62
  206. package/dist/_typedoc/MenuImperative/MenuImperative.types.json +77 -77
  207. package/dist/_typedoc/Modal/Modal.types.json +46 -46
  208. package/dist/_typedoc/MultiSelect/MultiSelect.types.json +31 -31
  209. package/dist/_typedoc/NextTile/NextTile.types.json +32 -32
  210. package/dist/_typedoc/Notation/Notation.types.json +4 -4
  211. package/dist/_typedoc/NumberInput/NumberInput.types.json +48 -48
  212. package/dist/_typedoc/OverlayTrigger/OverlayTrigger.types.json +34 -34
  213. package/dist/_typedoc/PageLayout/PageLayout.types.json +26 -26
  214. package/dist/_typedoc/Pagination/Pagination.types.json +7 -7
  215. package/dist/_typedoc/Panel/Panel.types.json +30 -30
  216. package/dist/_typedoc/Pill/Pill.types.json +2 -2
  217. package/dist/_typedoc/PillSelect/PillSelect.types.json +51 -51
  218. package/dist/_typedoc/Popover/Popover.types.json +15 -15
  219. package/dist/_typedoc/ProgressBar/ProgressBar.types.json +7 -7
  220. package/dist/_typedoc/RadioButton/RadioButton.types.json +6 -6
  221. package/dist/_typedoc/Required/Required.types.json +5 -5
  222. package/dist/_typedoc/Search/Search.types.json +18 -18
  223. package/dist/_typedoc/Section/Section.types.json +15 -15
  224. package/dist/_typedoc/SegmentedController/SegmentedController.types.json +21 -21
  225. package/dist/_typedoc/Select/Select.types.json +64 -64
  226. package/dist/_typedoc/SettingsPage/SettingsPage.types.json +10 -10
  227. package/dist/_typedoc/Slider/Slider.types.json +6 -6
  228. package/dist/_typedoc/Spinner/Spinner.types.json +9 -9
  229. package/dist/_typedoc/SplitViewCard/SplitViewCard.types.json +14 -14
  230. package/dist/_typedoc/Table/Table.types.json +113 -103
  231. package/dist/_typedoc/Tabs/Tabs.types.json +20 -20
  232. package/dist/_typedoc/Tearsheet/Tearsheet.types.json +17 -17
  233. package/dist/_typedoc/TextArea/TextArea.types.json +3 -3
  234. package/dist/_typedoc/TextEditor/TextEditor.types.json +29 -9
  235. package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +4 -4
  236. package/dist/_typedoc/Thumbnail/Thumbnail.types.json +19 -19
  237. package/dist/_typedoc/TieredDropdown/TieredDropdown.types.json +43 -43
  238. package/dist/_typedoc/TieredSelect/TieredSelect.types.json +29 -29
  239. package/dist/_typedoc/Tile/Tile.types.json +8 -8
  240. package/dist/_typedoc/Title/Title.types.json +1 -1
  241. package/dist/_typedoc/Toast/Toast.types.json +4 -4
  242. package/dist/_typedoc/ToggleButton/ToggleButton.types.json +4 -4
  243. package/dist/_typedoc/Token/Token.types.json +7 -7
  244. package/dist/_typedoc/ToolHeader/ToolHeader.types.json +10 -10
  245. package/dist/_typedoc/ToolLandingPage/ToolLandingPage.types.json +8 -8
  246. package/dist/_typedoc/Tooltip/Tooltip.types.json +13 -13
  247. package/dist/_typedoc/Tree/Tree.types.json +86 -86
  248. package/dist/_typedoc/Typeahead/Typeahead.types.json +2 -2
  249. package/dist/_typedoc/Typography/Typography.types.json +9 -9
  250. package/dist/_typedoc/_utils/types.json +3 -3
  251. package/dist/_typedoc/deprecations.json +1 -1
  252. package/dist/_utils/a11y.d.ts +1 -0
  253. package/dist/_utils/a11y.js +8 -0
  254. package/dist/_utils/a11y.js.map +1 -0
  255. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Table.types.js","names":[],"sources":["../../src/Table/Table.types.ts"],"sourcesContent":["import type { CurrencyOptions } from '@procore/globalization-toolkit'\nimport type React from 'react'\nimport type { DateSelectProps } from '../DateSelect'\nimport type { InputProps } from '../Input'\nimport type { SelectProps } from '../Select'\nimport type { Props, Size } from '../_utils/types'\n\nexport type InputCellSize = Extract<\n Size,\n 'block' | 'lg' | 'md' | 'sm' | 'xl' | 'xs'\n>\n\nexport type TableVariant = '' | 'fixed'\n\nexport type TableColumnSortOrder = 'asc' | 'desc' | ''\n\nexport type TableCellVariant = '' | 'asc' | 'desc' | 'snugfit'\n\nexport interface BodyCellProps extends Props {\n /**\n * Shrink the cell around the contents\n * @since 10.19.0\n */\n snugfit?: boolean\n\n /**\n * The table body cell variant\n * @since 10.19.0\n * @deprecated Please use `sortOrder` prop instead of `esc/desc` variants, and `snugfit` prop instead of `snugfit` variant\n * @deprecatedSince 11.15.1\n */\n variant?: TableCellVariant\n}\n\nexport interface BodyProps extends Props {}\n\nexport interface BodyRowProps extends Props {\n /**\n * Sets row text color to red to signify overdue items\n * @since 10.19.0\n */\n overdue?: boolean\n}\n\nexport interface CaratProps {\n /**\n * Whether or not the carat is rotated\n * @since 10.19.0\n */\n expanded?: boolean\n\n /**\n * Callback to fire when clicked\n * @since 10.19.0\n */\n onClick?: React.EventHandler<any>\n}\n\nexport interface ContainerProps {\n /**\n * @since 10.19.0\n */\n children?: React.ReactNode\n\n /**\n * Adjust the container to support a table shelf\n * @default false\n * @since 10.19.0\n * */\n shelf?: boolean\n}\n\nexport interface CurrencyCellProps extends Omit<Props, 'children'> {\n /**\n * @deprecated Please use `value` prop instead\n * @deprecatedSince 11.28.0\n */\n children?: React.ReactNode\n\n /**\n * Optional formatting configs\n * @since 11.28.0\n */\n currencyOptions?: CurrencyOptions\n\n /**\n * Unformatted value to be displayed\n * @since 11.28.0\n */\n value?: number\n}\n\nexport interface GroupProps extends Props {\n /**\n * Number of columns in table\n * @since 10.19.0\n */\n colSpan?: number\n\n /**\n * Determines indentation of the group and content\n * @since 10.19.0\n */\n depth?: number\n}\n\nexport interface GroupTitleProps extends Props {}\n\nexport interface TableHeaderCellProps extends BodyCellProps {\n /**\n * Is this the column sortable\n * @since 10.19.0\n * @deprecated Please use `sortOrder` prop instead\n * @deprecatedSince 11.15.1\n */\n sortable?: boolean\n\n /**\n * Column sorting order\n * @since 11.15.1\n */\n sortOrder?: TableColumnSortOrder\n\n /**\n * Column sorting order change callback.\n * Loops over from \"asc\" to \"desc\" to \"\", set should be assigned to `sortOrder` prop.\n * @since 11.15.1\n */\n onSortOrderChange?: (nextSortOrder: TableColumnSortOrder) => void\n}\n\nexport interface HeaderProps extends Props {}\n\nexport interface HeaderRowProps extends Props {}\n\nexport interface IconCellProps extends Props {}\n\nexport interface InputCellProps extends Omit<InputProps, 'size'> {\n /**\n * Message to be displayed below the input during an error\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner for processing inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n\n /**\n * The size of the input cell and corresponding error message\n * @default 'block'\n * @since 10.19.0\n */\n size?: InputCellSize\n}\n\nexport interface LinkCellProps extends Props {\n /**\n * Destination url\n * @default ''\n * @since 10.19.0\n * */\n href: string\n}\n\nexport interface PercentCellProps extends Props {}\n\nexport interface TableSelectCellProps extends SelectProps {\n /**\n * Message to be displayed below the select during an error\n * @default ''\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner that covers inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n}\n\nexport interface DateSelectCellProps extends DateSelectProps {\n /**\n * @since 10.19.0\n */\n className?: string\n\n /**\n * Message to be displayed below the date select during an error\n * @default ''\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner that covers inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n}\n\nexport interface TableProps extends Props {\n /**\n * @since 10.19.0\n */\n inline?: boolean\n\n /**\n * The table variant\n * @since 10.19.0\n */\n variant?: TableVariant\n}\n\nexport interface TextAreaCellProps extends Props {\n /**\n * Message to be displayed below the textarea during an error\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner for processing inline editable content\n * @since 10.19.0\n */\n processing?: boolean\n\n /**\n * Sets whether it is resizable\n * @since 10.19.0\n */\n resizable?: boolean\n}\n\nexport interface TableTextCellProps extends Props {}\n"],"mappings":""}
1
+ {"version":3,"file":"Table.types.js","names":[],"sources":["../../src/Table/Table.types.ts"],"sourcesContent":["import type { CurrencyOptions } from '@procore/globalization-toolkit'\nimport type React from 'react'\nimport type { DateSelectProps } from '../DateSelect'\nimport type { InputProps } from '../Input'\nimport type { SelectProps } from '../Select'\nimport type { Props, Size } from '../_utils/types'\n\nexport type InputCellSize = Extract<\n Size,\n 'block' | 'lg' | 'md' | 'sm' | 'xl' | 'xs'\n>\n\nexport type TableVariant = '' | 'fixed'\n\nexport type TableColumnSortOrder = 'asc' | 'desc' | ''\n\nexport type TableCellVariant = '' | 'asc' | 'desc' | 'snugfit'\n\nexport interface BodyCellProps extends Props {\n /**\n * Shrink the cell around the contents\n * @since 10.19.0\n */\n snugfit?: boolean\n\n /**\n * The table body cell variant\n * @since 10.19.0\n * @deprecated Please use `sortOrder` prop instead of `esc/desc` variants, and `snugfit` prop instead of `snugfit` variant\n * @deprecatedSince 11.15.1\n */\n variant?: TableCellVariant\n}\n\nexport interface BodyProps extends Props {}\n\nexport interface BodyRowProps extends Props {\n /**\n * Sets row text color to red to signify overdue items\n * @since 10.19.0\n */\n overdue?: boolean\n}\n\nexport interface CaratProps {\n /**\n * Whether or not the carat is rotated\n * @since 10.19.0\n */\n expanded?: boolean\n\n /**\n * Callback to fire when clicked\n * @since 10.19.0\n */\n onClick?: React.EventHandler<any>\n\n /**\n * Custom aria-label for the carat button. If not provided, defaults to internationalized \"Expand\" or \"Collapse\" based on expanded state.\n * @since 12.34.0\n */\n 'aria-label'?: string\n}\n\nexport interface ContainerProps {\n /**\n * @since 10.19.0\n */\n children?: React.ReactNode\n\n /**\n * Adjust the container to support a table shelf\n * @default false\n * @since 10.19.0\n * */\n shelf?: boolean\n}\n\nexport interface CurrencyCellProps extends Omit<Props, 'children'> {\n /**\n * @deprecated Please use `value` prop instead\n * @deprecatedSince 11.28.0\n */\n children?: React.ReactNode\n\n /**\n * Optional formatting configs\n * @since 11.28.0\n */\n currencyOptions?: CurrencyOptions\n\n /**\n * Unformatted value to be displayed\n * @since 11.28.0\n */\n value?: number\n}\n\nexport interface GroupProps extends Props {\n /**\n * Number of columns in table\n * @since 10.19.0\n */\n colSpan?: number\n\n /**\n * Determines indentation of the group and content\n * @since 10.19.0\n */\n depth?: number\n}\n\nexport interface GroupTitleProps extends Props {}\n\nexport interface TableHeaderCellProps extends BodyCellProps {\n /**\n * Is this the column sortable\n * @since 10.19.0\n * @deprecated Please use `sortOrder` prop instead\n * @deprecatedSince 11.15.1\n */\n sortable?: boolean\n\n /**\n * Column sorting order\n * @since 11.15.1\n */\n sortOrder?: TableColumnSortOrder\n\n /**\n * Column sorting order change callback.\n * Loops over from \"asc\" to \"desc\" to \"\", set should be assigned to `sortOrder` prop.\n * @since 11.15.1\n */\n onSortOrderChange?: (nextSortOrder: TableColumnSortOrder) => void\n}\n\nexport interface HeaderProps extends Props {}\n\nexport interface HeaderRowProps extends Props {}\n\nexport interface IconCellProps extends Props {}\n\nexport interface InputCellProps extends Omit<InputProps, 'size'> {\n /**\n * Message to be displayed below the input during an error\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner for processing inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n\n /**\n * The size of the input cell and corresponding error message\n * @default 'block'\n * @since 10.19.0\n */\n size?: InputCellSize\n}\n\nexport interface LinkCellProps extends Props {\n /**\n * Destination url\n * @default ''\n * @since 10.19.0\n * */\n href: string\n}\n\nexport interface PercentCellProps extends Props {}\n\nexport interface TableSelectCellProps extends SelectProps {\n /**\n * Message to be displayed below the select during an error\n * @default ''\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner that covers inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n}\n\nexport interface DateSelectCellProps extends DateSelectProps {\n /**\n * @since 10.19.0\n */\n className?: string\n\n /**\n * Message to be displayed below the date select during an error\n * @default ''\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner that covers inline editable content\n * @default false\n * @since 10.19.0\n */\n processing?: boolean\n}\n\nexport interface TableProps extends Props {\n /**\n * @since 10.19.0\n */\n inline?: boolean\n\n /**\n * The table variant\n * @since 10.19.0\n */\n variant?: TableVariant\n}\n\nexport interface TextAreaCellProps extends Props {\n /**\n * Message to be displayed below the textarea during an error\n * @since 10.19.0\n */\n errorMessage?: string\n\n /**\n * Triggers the spinner for processing inline editable content\n * @since 10.19.0\n */\n processing?: boolean\n\n /**\n * Sets whether it is resizable\n * @since 10.19.0\n */\n resizable?: boolean\n}\n\nexport interface TableTextCellProps extends Props {}\n"],"mappings":""}
@@ -4,22 +4,22 @@ import { spacing } from '../_styles/spacing';
4
4
  var tableShelfShadow = '-4px 0px 5px 0px rgba(112, 112, 112, 0.1)';
5
5
  export var StyledShelf = /*#__PURE__*/styled.div.withConfig({
6
6
  displayName: "StyledShelf",
7
- componentId: "core-12_34_1__sc-a6498a-0"
7
+ componentId: "core-12_35_0__sc-a6498a-0"
8
8
  })(["position:absolute;right:0;top:0;bottom:0;box-shadow:", ";background-color:", ";"], tableShelfShadow, colors.white);
9
9
  export var StyledHead = /*#__PURE__*/styled.div.withConfig({
10
10
  displayName: "StyledHead",
11
- componentId: "core-12_34_1__sc-a6498a-1"
11
+ componentId: "core-12_35_0__sc-a6498a-1"
12
12
  })(["background-color:", ";transition:background-color 0.2s ease-in-out;"], colors.gray96);
13
13
  export var StyledBodyRow = /*#__PURE__*/styled.div.withConfig({
14
14
  displayName: "StyledBodyRow",
15
- componentId: "core-12_34_1__sc-a6498a-2"
15
+ componentId: "core-12_35_0__sc-a6498a-2"
16
16
  })(["border-top:1px solid ", ";transition:background-color 0.2s ease-in-out;"], colors.gray85);
17
17
  export var StyledHeadCell = /*#__PURE__*/styled.div.withConfig({
18
18
  displayName: "StyledHeadCell",
19
- componentId: "core-12_34_1__sc-a6498a-3"
19
+ componentId: "core-12_35_0__sc-a6498a-3"
20
20
  })(["text-align:left;padding:", "px;line-height:13px;"], spacing.lg);
21
21
  export var StyledBodyCell = /*#__PURE__*/styled.div.withConfig({
22
22
  displayName: "StyledBodyCell",
23
- componentId: "core-12_34_1__sc-a6498a-4"
23
+ componentId: "core-12_35_0__sc-a6498a-4"
24
24
  })(["padding:", "px;line-height:13px;"], spacing.lg);
25
25
  //# sourceMappingURL=TableShelf.styles.js.map
@@ -17,17 +17,17 @@ var borderRadius = /*#__PURE__*/css(["border-radius:", "px ", "px 0 0;"], spacin
17
17
  */
18
18
  var StyledTabBase = /*#__PURE__*/styled.div.withConfig({
19
19
  displayName: "StyledTabBase",
20
- componentId: "core-12_34_1__sc-17s58xs-0"
20
+ componentId: "core-12_35_0__sc-17s58xs-0"
21
21
  })(["align-items:center;box-sizing:border-box;cursor:pointer;display:inline-flex;flex:0 0 auto;justify-content:center;position:relative;white-space:nowrap;text-decoration:none;background-color:transparent;border:none;font-family:inherit;padding:0;"]);
22
22
  var StyledTabInnerBase = /*#__PURE__*/styled.div.withConfig({
23
23
  displayName: "StyledTabInnerBase",
24
- componentId: "core-12_34_1__sc-17s58xs-1"
24
+ componentId: "core-12_35_0__sc-17s58xs-1"
25
25
  })(["align-self:baseline;box-sizing:border-box;&,> a{display:flex;text-decoration:none;width:100%;}"]);
26
26
 
27
27
  // This so that it can be visible/hidden via CSS down below
28
28
  var StyledDropdownTabBase = /*#__PURE__*/styled(StyledTabBase).withConfig({
29
29
  displayName: "StyledDropdownTabBase",
30
- componentId: "core-12_34_1__sc-17s58xs-2"
30
+ componentId: "core-12_35_0__sc-17s58xs-2"
31
31
  })(["", ""], hiddenTab);
32
32
 
33
33
  //// END BASE LAYOUT COMPONENTS FOR TABS ////
@@ -50,11 +50,11 @@ function getTabStyle() {
50
50
  }
51
51
  var StyledTab = /*#__PURE__*/styled(StyledTabBase).withConfig({
52
52
  displayName: "StyledTab",
53
- componentId: "core-12_34_1__sc-17s58xs-3"
53
+ componentId: "core-12_35_0__sc-17s58xs-3"
54
54
  })(["", ""], getTabStyle);
55
55
  var StyledTabInner = /*#__PURE__*/styled(StyledTabInnerBase).withConfig({
56
56
  displayName: "StyledTabInner",
57
- componentId: "core-12_34_1__sc-17s58xs-4"
57
+ componentId: "core-12_35_0__sc-17s58xs-4"
58
58
  })(["", " padding:0 ", "px;font-weight:", ";&,> a{", ";color:", ";height:23px;}", ""], getTypographyIntent('body'), spacing.xs, function (_ref3) {
59
59
  var $selected = _ref3.$selected;
60
60
  return $selected ? 600 : 400;
@@ -67,15 +67,15 @@ var StyledTabInner = /*#__PURE__*/styled(StyledTabInnerBase).withConfig({
67
67
  });
68
68
  var StyledDropdownTab = /*#__PURE__*/styled(StyledDropdownTabBase).withConfig({
69
69
  displayName: "StyledDropdownTab",
70
- componentId: "core-12_34_1__sc-17s58xs-5"
70
+ componentId: "core-12_35_0__sc-17s58xs-5"
71
71
  })(["", ""], getTabStyle);
72
72
  var StyledDropdownTabInner = /*#__PURE__*/styled(StyledTabInner).withConfig({
73
73
  displayName: "StyledDropdownTabInner",
74
- componentId: "core-12_34_1__sc-17s58xs-6"
74
+ componentId: "core-12_35_0__sc-17s58xs-6"
75
75
  })(["align-items:center;cursor:pointer;display:inline-flex;"]);
76
76
  var StyledLink = /*#__PURE__*/styled.span.withConfig({
77
77
  displayName: "StyledLink",
78
- componentId: "core-12_34_1__sc-17s58xs-7"
78
+ componentId: "core-12_35_0__sc-17s58xs-7"
79
79
  })(["align-items:center;display:flex;height:23px;", ";box-sizing:border-box;"], borderRadius);
80
80
 
81
81
  //// END TRADITIONAL DESIGN SYSTEM TAB STYLES ////
@@ -92,34 +92,34 @@ function getHelixHeaderTabStyles() {
92
92
  }
93
93
  var StyledGlobalNavigationTab = /*#__PURE__*/styled(StyledTabBase).withConfig({
94
94
  displayName: "StyledGlobalNavigationTab",
95
- componentId: "core-12_34_1__sc-17s58xs-8"
95
+ componentId: "core-12_35_0__sc-17s58xs-8"
96
96
  })(["", ""], getHelixHeaderTabStyles);
97
97
  var StyledGlobalNavigationDropdownTab = /*#__PURE__*/styled(StyledDropdownTabBase).withConfig({
98
98
  displayName: "StyledGlobalNavigationDropdownTab",
99
- componentId: "core-12_34_1__sc-17s58xs-9"
99
+ componentId: "core-12_35_0__sc-17s58xs-9"
100
100
  })(["", ""], getHelixHeaderTabStyles);
101
101
  var StyledGlobalNavigationDropdownTabInner = /*#__PURE__*/styled(StyledTabInnerBase).withConfig({
102
102
  displayName: "StyledGlobalNavigationDropdownTabInner",
103
- componentId: "core-12_34_1__sc-17s58xs-10"
103
+ componentId: "core-12_35_0__sc-17s58xs-10"
104
104
  })(["align-items:center;cursor:pointer;display:inline-flex;"]);
105
105
  var StyledGlobalNavigationLink = /*#__PURE__*/styled.span.withConfig({
106
106
  displayName: "StyledGlobalNavigationLink",
107
- componentId: "core-12_34_1__sc-17s58xs-11"
107
+ componentId: "core-12_35_0__sc-17s58xs-11"
108
108
  })(["padding-left:6px;padding-right:6px;"]);
109
109
 
110
110
  //// END HELIX GLOBAL NAVIGATION TAB STYLES ////
111
111
 
112
112
  export var StyledOverlay = /*#__PURE__*/styled(Card).withConfig({
113
113
  displayName: "StyledOverlay",
114
- componentId: "core-12_34_1__sc-17s58xs-12"
114
+ componentId: "core-12_35_0__sc-17s58xs-12"
115
115
  })(["max-height:40vh;", "{padding:0;display:flex;justify-content:center;a{margin:unset;padding:unset;}}", "{padding:0;display:flex;}", "{padding:2px 16px 4px 16px;}", ",", "{color:", ";border-radius:0;display:flex;width:100%;background:inherit;font-weight:inherit;font-size:inherit;padding:0;}[data-selected='true']{", ",", "{border-bottom-color:transparent;color:", ";}}"], StyledItem, StyledLink, StyledTabInnerBase, StyledLink, StyledTabBase, colors.gray15, StyledLink, StyledTabBase, colors.blue50);
116
116
  export var StyledTabList = /*#__PURE__*/styled.div.withConfig({
117
117
  displayName: "StyledTabList",
118
- componentId: "core-12_34_1__sc-17s58xs-13"
118
+ componentId: "core-12_35_0__sc-17s58xs-13"
119
119
  })(["display:flex;width:100%;"]);
120
120
  export var StyledTabs = /*#__PURE__*/styled.nav.withConfig({
121
121
  displayName: "StyledTabs",
122
- componentId: "core-12_34_1__sc-17s58xs-14"
122
+ componentId: "core-12_35_0__sc-17s58xs-14"
123
123
  })(["background-color:", ";display:flex;overflow:hidden;width:100%;", "{&:nth-child(1n + ", "){&:not(", "){", "}}}", ""], function (_ref6) {
124
124
  var $dark = _ref6.$dark;
125
125
  return $dark && colors.gray15;
@@ -48,7 +48,7 @@ var getSlideOutAnimation = function getSlideOutAnimation($placement) {
48
48
  };
49
49
  export var StyledTearsheetContent = /*#__PURE__*/styled.div.withConfig({
50
50
  displayName: "StyledTearsheetContent",
51
- componentId: "core-12_34_1__sc-ljrxoq-0"
51
+ componentId: "core-12_35_0__sc-ljrxoq-0"
52
52
  })(["display:flex;z-index:2;width:100%;", " ", " ", " ", ""], function (_ref) {
53
53
  var $open = _ref.$open,
54
54
  $placement = _ref.$placement;
@@ -68,7 +68,7 @@ export var StyledTearsheetContent = /*#__PURE__*/styled.div.withConfig({
68
68
  export var minScrimSize = spacing.xxl * 3;
69
69
  export var StyledTearsheetBody = /*#__PURE__*/styled.div.withConfig({
70
70
  displayName: "StyledTearsheetBody",
71
- componentId: "core-12_34_1__sc-ljrxoq-1"
71
+ componentId: "core-12_35_0__sc-ljrxoq-1"
72
72
  })(["display:flex;overflow-y:auto;flex-direction:column;background-color:", ";&:focus-visible{", "}", " ", "}"], colors.white, getFocusInset(), function (_ref5) {
73
73
  var $block = _ref5.$block,
74
74
  $placement = _ref5.$placement,
@@ -89,7 +89,7 @@ var zoomIn = /*#__PURE__*/keyframes(["from{transform:scale(0);}to{transform:scal
89
89
  var zoomOut = /*#__PURE__*/keyframes(["from{transform:scale(1);}to{transform:scale(0);}"]);
90
90
  export var StyledScrimContainer = /*#__PURE__*/styled.div.withConfig({
91
91
  displayName: "StyledScrimContainer",
92
- componentId: "core-12_34_1__sc-ljrxoq-2"
92
+ componentId: "core-12_35_0__sc-ljrxoq-2"
93
93
  })(["", ""], function (_ref7) {
94
94
  var $placement = _ref7.$placement;
95
95
  var minSizeProp = ['top', 'bottom'].includes($placement) ? 'min-height' : 'min-width';
@@ -97,7 +97,7 @@ export var StyledScrimContainer = /*#__PURE__*/styled.div.withConfig({
97
97
  });
98
98
  export var StyledButtonContainer = /*#__PURE__*/styled.div.withConfig({
99
99
  displayName: "StyledButtonContainer",
100
- componentId: "core-12_34_1__sc-ljrxoq-3"
100
+ componentId: "core-12_35_0__sc-ljrxoq-3"
101
101
  })(["", ""], function (_ref8) {
102
102
  var $placement = _ref8.$placement;
103
103
  switch ($placement) {
@@ -112,7 +112,7 @@ export var StyledButtonContainer = /*#__PURE__*/styled.div.withConfig({
112
112
  });
113
113
  export var StyledButtonCard = /*#__PURE__*/styled(Card).withConfig({
114
114
  displayName: "StyledButtonCard",
115
- componentId: "core-12_34_1__sc-ljrxoq-4"
115
+ componentId: "core-12_35_0__sc-ljrxoq-4"
116
116
  })(["display:inline-flex;margin:", "px;", " ", " ", ""], spacing.xl, function (_ref9) {
117
117
  var $open = _ref9.$open;
118
118
  return $open ? css(["transform:scale(1);"]) : css(["transform:scale(0);"]);
@@ -29,6 +29,7 @@ export var TextArea = /*#__PURE__*/React.forwardRef(function TextArea(_ref, ref)
29
29
  $error: error,
30
30
  $variant: variant
31
31
  }, props, {
32
+ "aria-invalid": error || variant === 'error' ? 'true' : 'false',
32
33
  ref: ref
33
34
  }));
34
35
  });
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.js","names":["React","StyledTextArea","TextArea","forwardRef","_ref","ref","_ref$resize","resize","error","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","$resize","$error","$variant","displayName"],"sources":["../../src/TextArea/TextArea.tsx"],"sourcesContent":["import React from 'react'\nimport { StyledTextArea } from './TextArea.styles'\nimport type { TextAreaProps } from './TextArea.types'\n\n/**\n\n Text areas give our users space to input unformatted text. All text areas are\n manually expandable by dragging the bottom right corner to the desired size.\n\n If users need to add formatted text, see Text Editor.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-textarea--demo)\n\n @see [Design Guidelines](https://design.procore.com/text-area)\n\n */\nexport const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea({ resize = 'both', error, variant, ...props }, ref) {\n return (\n <StyledTextArea\n $resize={resize}\n $error={error}\n $variant={variant}\n {...props}\n ref={ref}\n />\n )\n }\n)\n\nTextArea.displayName = 'TextArea'\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,mBAAmB;AAGlD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,gBAAGF,KAAK,CAACG,UAAU,CACtC,SAASD,QAAQA,CAAAE,IAAA,EAAgDC,GAAG,EAAE;EAAA,IAAAC,WAAA,GAAAF,IAAA,CAAlDG,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,MAAM,GAAAA,WAAA;IAAEE,KAAK,GAAAJ,IAAA,CAALI,KAAK;IAAEC,OAAO,GAAAL,IAAA,CAAPK,OAAO;IAAKC,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAC3D,oBACEZ,KAAA,CAAAa,aAAA,CAACZ,cAAc,EAAAa,QAAA;IACbC,OAAO,EAAER,MAAO;IAChBS,MAAM,EAAER,KAAM;IACdS,QAAQ,EAAER;EAAQ,GACdC,KAAK;IACTL,GAAG,EAAEA;EAAI,EACV,CAAC;AAEN,CACF,CAAC;AAEDH,QAAQ,CAACgB,WAAW,GAAG,UAAU"}
1
+ {"version":3,"file":"TextArea.js","names":["React","StyledTextArea","TextArea","forwardRef","_ref","ref","_ref$resize","resize","error","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","$resize","$error","$variant","displayName"],"sources":["../../src/TextArea/TextArea.tsx"],"sourcesContent":["import React from 'react'\nimport { StyledTextArea } from './TextArea.styles'\nimport type { TextAreaProps } from './TextArea.types'\n\n/**\n\n Text areas give our users space to input unformatted text. All text areas are\n manually expandable by dragging the bottom right corner to the desired size.\n\n If users need to add formatted text, see Text Editor.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-textarea--demo)\n\n @see [Design Guidelines](https://design.procore.com/text-area)\n\n */\nexport const TextArea = React.forwardRef<HTMLTextAreaElement, TextAreaProps>(\n function TextArea({ resize = 'both', error, variant, ...props }, ref) {\n return (\n <StyledTextArea\n $resize={resize}\n $error={error}\n $variant={variant}\n {...props}\n aria-invalid={error || variant === 'error' ? 'true' : 'false'}\n ref={ref}\n />\n )\n }\n)\n\nTextArea.displayName = 'TextArea'\n"],"mappings":";;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,mBAAmB;AAGlD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,IAAMC,QAAQ,gBAAGF,KAAK,CAACG,UAAU,CACtC,SAASD,QAAQA,CAAAE,IAAA,EAAgDC,GAAG,EAAE;EAAA,IAAAC,WAAA,GAAAF,IAAA,CAAlDG,MAAM;IAANA,MAAM,GAAAD,WAAA,cAAG,MAAM,GAAAA,WAAA;IAAEE,KAAK,GAAAJ,IAAA,CAALI,KAAK;IAAEC,OAAO,GAAAL,IAAA,CAAPK,OAAO;IAAKC,KAAK,GAAAC,wBAAA,CAAAP,IAAA,EAAAQ,SAAA;EAC3D,oBACEZ,KAAA,CAAAa,aAAA,CAACZ,cAAc,EAAAa,QAAA;IACbC,OAAO,EAAER,MAAO;IAChBS,MAAM,EAAER,KAAM;IACdS,QAAQ,EAAER;EAAQ,GACdC,KAAK;IACT,gBAAcF,KAAK,IAAIC,OAAO,KAAK,OAAO,GAAG,MAAM,GAAG,OAAQ;IAC9DJ,GAAG,EAAEA;EAAI,EACV,CAAC;AAEN,CACF,CAAC;AAEDH,QAAQ,CAACgB,WAAW,GAAG,UAAU"}
@@ -3,7 +3,7 @@ import { getInputStyles } from '../Input/Input.styles';
3
3
  import { spacing } from '../_styles/spacing';
4
4
  export var StyledTextArea = /*#__PURE__*/styled.textarea.withConfig({
5
5
  displayName: "StyledTextArea",
6
- componentId: "core-12_34_1__sc-u5mow1-0"
6
+ componentId: "core-12_35_0__sc-u5mow1-0"
7
7
  })(["", ";height:auto;min-height:64px;padding:", "px ", "px;resize:", ";"], getInputStyles, spacing.sm, spacing.md, function (_ref) {
8
8
  var _ref$$resize = _ref.$resize,
9
9
  $resize = _ref$$resize === void 0 ? 'both' : _ref$$resize;
@@ -14,7 +14,7 @@ export declare function TextEditorProvider({ children, features, }: TextEditorPr
14
14
  @see [Design Guidelines](https://design.procore.com/text-editor)
15
15
 
16
16
  */
17
- export declare function TextEditor({ error, init: initOverrides, locale, onChange, onInit: _onInit, plugins, ...props }: TextEditorProps): React.JSX.Element;
17
+ export declare function TextEditor(allProps: TextEditorProps): React.JSX.Element;
18
18
  export declare namespace TextEditor {
19
19
  var displayName: string;
20
20
  }
@@ -98,17 +98,19 @@ function useFocusScopePatch(plugins) {
98
98
  @see [Design Guidelines](https://design.procore.com/text-editor)
99
99
 
100
100
  */
101
- export function TextEditor(_ref2) {
101
+ export function TextEditor(allProps) {
102
102
  var _props$initialValue, _props$value;
103
- var error = _ref2.error,
104
- initOverrides = _ref2.init,
105
- locale = _ref2.locale,
106
- _ref2$onChange = _ref2.onChange,
107
- onChange = _ref2$onChange === void 0 ? noop : _ref2$onChange,
108
- _onInit = _ref2.onInit,
109
- _ref2$plugins = _ref2.plugins,
110
- plugins = _ref2$plugins === void 0 ? defaultPlugins : _ref2$plugins,
111
- props = _objectWithoutProperties(_ref2, _excluded);
103
+ var error = allProps.error,
104
+ initOverrides = allProps.init,
105
+ locale = allProps.locale,
106
+ _allProps$onChange = allProps.onChange,
107
+ onChange = _allProps$onChange === void 0 ? noop : _allProps$onChange,
108
+ _onInit = allProps.onInit,
109
+ _allProps$plugins = allProps.plugins,
110
+ plugins = _allProps$plugins === void 0 ? defaultPlugins : _allProps$plugins,
111
+ props = _objectWithoutProperties(allProps, _excluded);
112
+ var ariaLabel = allProps['aria-label'];
113
+ var ariaDescription = allProps['aria-description'];
112
114
  var _useI18nContext = useI18nContext(),
113
115
  contextLocale = _useI18nContext.locale;
114
116
  var _useZIndexContext = useZIndexContext(),
@@ -131,6 +133,11 @@ export function TextEditor(_ref2) {
131
133
  onChange(editor.getContent(), editor.isDirty());
132
134
  };
133
135
  var ref = React.useRef();
136
+ var editorRef = React.useRef(null);
137
+ var _React$useState = React.useState(false),
138
+ _React$useState2 = _slicedToArray(_React$useState, 2),
139
+ isEditorReady = _React$useState2[0],
140
+ setIsEditorReady = _React$useState2[1];
134
141
  var updateError = function updateError() {
135
142
  if (ref.current) {
136
143
  if (error) {
@@ -138,31 +145,79 @@ export function TextEditor(_ref2) {
138
145
  } else {
139
146
  ref.current.style.borderColor = '';
140
147
  }
148
+ ref.current.setAttribute('aria-invalid', error ? 'true' : 'false');
141
149
  }
142
150
  };
143
151
  React.useEffect(function () {
144
152
  updateError();
145
153
  }, [error]);
154
+
155
+ // Update aria-label when prop changes
156
+ React.useEffect(function () {
157
+ if (!isEditorReady || !editorRef.current) {
158
+ return;
159
+ }
160
+ var body = editorRef.current.getBody();
161
+ if (body) {
162
+ if (ariaLabel) {
163
+ body.setAttribute('aria-label', ariaLabel);
164
+ } else {
165
+ body.removeAttribute('aria-label');
166
+ }
167
+ }
168
+ }, [ariaLabel, isEditorReady]);
169
+
170
+ // Update aria-description when prop changes
171
+ React.useEffect(function () {
172
+ if (!isEditorReady || !editorRef.current) {
173
+ return;
174
+ }
175
+ var body = editorRef.current.getBody();
176
+ if (body) {
177
+ if (ariaDescription) {
178
+ body.setAttribute('aria-description', ariaDescription);
179
+ } else {
180
+ body.removeAttribute('aria-description');
181
+ }
182
+ }
183
+ }, [ariaDescription, isEditorReady]);
146
184
  useFocusScopePatch(plugins);
147
185
  var onInit = function onInit(event, editor) {
148
186
  ref.current = editor.editorContainer;
187
+ editorRef.current = editor;
188
+ setIsEditorReady(true);
149
189
  updateError();
190
+
191
+ // Set accessible label and description on the editable body element if provided
192
+ // This provides the accessible name/description for screen readers
193
+ var body = editor.getBody();
194
+ if (body) {
195
+ if (ariaLabel) {
196
+ body.setAttribute('aria-label', ariaLabel);
197
+ }
198
+ if (ariaDescription) {
199
+ body.setAttribute('aria-description', ariaDescription);
200
+ }
201
+ }
150
202
  _onInit && _onInit(event, editor);
151
203
  };
152
204
  var _useState = useState((_props$initialValue = props.initialValue) !== null && _props$initialValue !== void 0 ? _props$initialValue : props.value),
153
205
  _useState2 = _slicedToArray(_useState, 1),
154
206
  derivedInitial = _useState2[0];
207
+ var accessibilityConfig = ariaLabel ? {
208
+ iframe_aria_text: ariaLabel
209
+ } : {};
155
210
 
156
211
  // zIndex + 1 because on first render zIndex of Portal(Modal) is higher
157
212
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(GlobalStyle, {
158
213
  $zIndex: zIndex + 1
159
214
  }), /*#__PURE__*/React.createElement(Editor, _extends({
160
- init: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, tinyMCEConfig), {}, {
215
+ init: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, tinyMCEConfig), {}, {
161
216
  external_plugins: generateExternalPlugins(plugins),
162
217
  language_url: generateLanguageUrl(locale || contextLocale),
163
218
  language: getValidLookupLocale(locale || contextLocale),
164
219
  content_style: "p { margin: 0; }"
165
- }, stickyToolbar), tabControls), initOverrides),
220
+ }, stickyToolbar), tabControls), accessibilityConfig), initOverrides),
166
221
  tinymceScriptSrc: "".concat(tinyMCESource, "/").concat(tinyMCEVersion, "/tinymce.min.js"),
167
222
  onInit: onInit,
168
223
  onEditorChange: onEditorChange
@@ -1 +1 @@
1
- {"version":3,"file":"TextEditor.js","names":["Editor","React","useState","useOverridableFocusScope","useI18nContext","useZIndexContext","defaultPlugins","generateExternalPlugins","generateLanguageUrl","getValidLookupLocale","tinyMCEConfig","tinyMCESource","tinyMCETabMarkup","tinyMCEVersion","GlobalStyle","errorRed","noop","TextEditorContext","createContext","features","tabAsNavigation","stickyToolbar","undefined","TextEditorProvider","_ref","children","createElement","Provider","value","_objectSpread","setupDefaultShortcuts","editor","shortcuts","add","setupShortcuts","on","checkTabPress","event","altKey","key","execCommand","preventDefault","stopPropagation","useFocusScopePatch","plugins","focusScope","useEffect","concat","_toConsumableArray","some","plugin","setProps","contain","TextEditor","_ref2","_props$initialValue","_props$value","error","initOverrides","init","locale","_ref2$onChange","onChange","_onInit","onInit","_ref2$plugins","props","_objectWithoutProperties","_excluded","_useI18nContext","contextLocale","_useZIndexContext","zIndex","_React$useContext","useContext","toolbar_sticky","tabControls","external_plugins","filter","p","nonbreaking_force_tab","setup","onEditorChange","_","getContent","isDirty","ref","useRef","updateError","current","style","borderColor","editorContainer","_useState","initialValue","_useState2","_slicedToArray","derivedInitial","Fragment","$zIndex","_extends","language_url","language","content_style","tinymceScriptSrc","displayName"],"sources":["../../src/TextEditor/TextEditor.tsx"],"sourcesContent":["import { Editor } from '@tinymce/tinymce-react'\nimport React, { useState } from 'react'\nimport { useOverridableFocusScope } from '../_hooks/FocusScopeOverride'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useZIndexContext } from '../_hooks/ZIndex'\nimport {\n defaultPlugins,\n generateExternalPlugins,\n generateLanguageUrl,\n getValidLookupLocale,\n tinyMCEConfig,\n tinyMCESource,\n tinyMCETabMarkup,\n tinyMCEVersion,\n} from '../_utils/TinyMCE'\nimport { GlobalStyle } from './TextEditor.styles'\nimport type {\n TextEditorProps,\n TextEditorProviderProps,\n} from './TextEditor.types'\n\nconst errorRed = '#E61920'\n\nfunction noop() {}\n\nconst TextEditorContext = React.createContext<\n Omit<TextEditorProviderProps, 'children'>\n>({\n features: {\n tabAsNavigation: true,\n stickyToolbar: undefined,\n },\n})\n\nexport function TextEditorProvider({\n children,\n features,\n}: TextEditorProviderProps) {\n return (\n <TextEditorContext.Provider\n value={{\n features: {\n tabAsNavigation: true,\n ...features,\n },\n }}\n >\n {children}\n </TextEditorContext.Provider>\n )\n}\n\nfunction setupDefaultShortcuts(editor: any) {\n editor.shortcuts.add('meta+shift+s', 'Strikethrough', 'Strikethrough')\n}\n\n/**\n * editor.addShortcut does not notify on Tab key presses\n */\nfunction setupShortcuts(editor: any) {\n setupDefaultShortcuts(editor)\n editor.on('keydown', function checkTabPress(event: React.KeyboardEvent) {\n if (event.altKey && event.key === 'Tab') {\n editor.execCommand('mceInsertContent', false, tinyMCETabMarkup)\n event.preventDefault()\n event.stopPropagation()\n return false\n }\n })\n}\n\n/**\n * The following plugins open a TinyMCE modal.\n * When used with React Aria contained FocusScope,\n * focus does not move into the TinyMCE modal.\n * This patch gets critical functionality back at\n * the cost of possibly failing accessbility.\n */\nfunction useFocusScopePatch(plugins: string[]) {\n const focusScope = useOverridableFocusScope()\n React.useEffect(() => {\n if (\n [...defaultPlugins, ...plugins].some(\n // Add plugins that open a tinymce modal here\n (plugin) =>\n plugin === 'link' || plugin === 'table' || plugin === 'image'\n )\n ) {\n focusScope.setProps({ contain: false })\n }\n }, [focusScope, plugins])\n}\n\n/**\n\n We use text editors to allow users to enter multiple lines of formatted text.\n\n If users need to add unformatted text, see Text Area.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-texteditor--demo)\n\n @see [Design Guidelines](https://design.procore.com/text-editor)\n\n */\nexport function TextEditor({\n error,\n init: initOverrides,\n locale,\n onChange = noop,\n onInit: _onInit,\n plugins = defaultPlugins,\n ...props\n}: TextEditorProps) {\n const { locale: contextLocale } = useI18nContext()\n const { value: zIndex } = useZIndexContext()\n\n const { features } = React.useContext(TextEditorContext)\n const stickyToolbar = features?.stickyToolbar ? { toolbar_sticky: true } : {}\n const tabControls = features?.tabAsNavigation\n ? {\n external_plugins: generateExternalPlugins(\n plugins,\n defaultPlugins.filter((p) => p !== 'nonbreaking')\n ),\n nonbreaking_force_tab: false,\n setup: setupShortcuts,\n }\n : {\n setup: setupDefaultShortcuts,\n }\n\n const onEditorChange: React.ComponentProps<\n typeof Editor\n >['onEditorChange'] = (_: any, editor: any) => {\n onChange(editor.getContent(), editor.isDirty())\n }\n\n const ref = React.useRef<HTMLElement>()\n\n const updateError = () => {\n if (ref.current) {\n if (error) {\n ref.current.style.borderColor = errorRed\n } else {\n ref.current.style.borderColor = ''\n }\n }\n }\n\n React.useEffect(() => {\n updateError()\n }, [error])\n\n useFocusScopePatch(plugins)\n\n const onInit: React.ComponentProps<typeof Editor>['onInit'] = (\n event,\n editor\n ) => {\n ref.current = editor.editorContainer\n updateError()\n _onInit && _onInit(event, editor)\n }\n\n const [derivedInitial] = useState(props.initialValue ?? props.value)\n\n // zIndex + 1 because on first render zIndex of Portal(Modal) is higher\n return (\n <>\n <GlobalStyle $zIndex={zIndex + 1} />\n <Editor\n init={{\n ...tinyMCEConfig,\n external_plugins: generateExternalPlugins(plugins),\n language_url: generateLanguageUrl(locale || contextLocale),\n language: getValidLookupLocale(locale || contextLocale),\n content_style: `p { margin: 0; }`,\n ...stickyToolbar,\n ...tabControls,\n ...initOverrides,\n }}\n tinymceScriptSrc={`${tinyMCESource}/${tinyMCEVersion}/tinymce.min.js`}\n onInit={onInit}\n onEditorChange={onEditorChange}\n {...props}\n value={props.value ?? props.initialValue}\n initialValue={derivedInitial}\n />\n </>\n )\n}\n\nTextEditor.displayName = 'TextEditor'\n"],"mappings":"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"}
1
+ {"version":3,"file":"TextEditor.js","names":["Editor","React","useState","useOverridableFocusScope","useI18nContext","useZIndexContext","defaultPlugins","generateExternalPlugins","generateLanguageUrl","getValidLookupLocale","tinyMCEConfig","tinyMCESource","tinyMCETabMarkup","tinyMCEVersion","GlobalStyle","errorRed","noop","TextEditorContext","createContext","features","tabAsNavigation","stickyToolbar","undefined","TextEditorProvider","_ref","children","createElement","Provider","value","_objectSpread","setupDefaultShortcuts","editor","shortcuts","add","setupShortcuts","on","checkTabPress","event","altKey","key","execCommand","preventDefault","stopPropagation","useFocusScopePatch","plugins","focusScope","useEffect","concat","_toConsumableArray","some","plugin","setProps","contain","TextEditor","allProps","_props$initialValue","_props$value","error","initOverrides","init","locale","_allProps$onChange","onChange","_onInit","onInit","_allProps$plugins","props","_objectWithoutProperties","_excluded","ariaLabel","ariaDescription","_useI18nContext","contextLocale","_useZIndexContext","zIndex","_React$useContext","useContext","toolbar_sticky","tabControls","external_plugins","filter","p","nonbreaking_force_tab","setup","onEditorChange","_","getContent","isDirty","ref","useRef","editorRef","_React$useState","_React$useState2","_slicedToArray","isEditorReady","setIsEditorReady","updateError","current","style","borderColor","setAttribute","body","getBody","removeAttribute","editorContainer","_useState","initialValue","_useState2","derivedInitial","accessibilityConfig","iframe_aria_text","Fragment","$zIndex","_extends","language_url","language","content_style","tinymceScriptSrc","displayName"],"sources":["../../src/TextEditor/TextEditor.tsx"],"sourcesContent":["import { Editor } from '@tinymce/tinymce-react'\nimport React, { useState } from 'react'\nimport { useOverridableFocusScope } from '../_hooks/FocusScopeOverride'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useZIndexContext } from '../_hooks/ZIndex'\nimport {\n defaultPlugins,\n generateExternalPlugins,\n generateLanguageUrl,\n getValidLookupLocale,\n tinyMCEConfig,\n tinyMCESource,\n tinyMCETabMarkup,\n tinyMCEVersion,\n} from '../_utils/TinyMCE'\nimport { GlobalStyle } from './TextEditor.styles'\nimport type {\n TextEditorProps,\n TextEditorProviderProps,\n} from './TextEditor.types'\n\nconst errorRed = '#E61920'\n\nfunction noop() {}\n\nconst TextEditorContext = React.createContext<\n Omit<TextEditorProviderProps, 'children'>\n>({\n features: {\n tabAsNavigation: true,\n stickyToolbar: undefined,\n },\n})\n\nexport function TextEditorProvider({\n children,\n features,\n}: TextEditorProviderProps) {\n return (\n <TextEditorContext.Provider\n value={{\n features: {\n tabAsNavigation: true,\n ...features,\n },\n }}\n >\n {children}\n </TextEditorContext.Provider>\n )\n}\n\nfunction setupDefaultShortcuts(editor: any) {\n editor.shortcuts.add('meta+shift+s', 'Strikethrough', 'Strikethrough')\n}\n\n/**\n * editor.addShortcut does not notify on Tab key presses\n */\nfunction setupShortcuts(editor: any) {\n setupDefaultShortcuts(editor)\n editor.on('keydown', function checkTabPress(event: React.KeyboardEvent) {\n if (event.altKey && event.key === 'Tab') {\n editor.execCommand('mceInsertContent', false, tinyMCETabMarkup)\n event.preventDefault()\n event.stopPropagation()\n return false\n }\n })\n}\n\n/**\n * The following plugins open a TinyMCE modal.\n * When used with React Aria contained FocusScope,\n * focus does not move into the TinyMCE modal.\n * This patch gets critical functionality back at\n * the cost of possibly failing accessbility.\n */\nfunction useFocusScopePatch(plugins: string[]) {\n const focusScope = useOverridableFocusScope()\n React.useEffect(() => {\n if (\n [...defaultPlugins, ...plugins].some(\n // Add plugins that open a tinymce modal here\n (plugin) =>\n plugin === 'link' || plugin === 'table' || plugin === 'image'\n )\n ) {\n focusScope.setProps({ contain: false })\n }\n }, [focusScope, plugins])\n}\n\n/**\n\n We use text editors to allow users to enter multiple lines of formatted text.\n\n If users need to add unformatted text, see Text Area.\n\n @since 10.19.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/core-react_demos-texteditor--demo)\n\n @see [Design Guidelines](https://design.procore.com/text-editor)\n\n */\nexport function TextEditor(allProps: TextEditorProps) {\n const {\n error,\n init: initOverrides,\n locale,\n onChange = noop,\n onInit: _onInit,\n plugins = defaultPlugins,\n ...props\n } = allProps\n const ariaLabel = allProps['aria-label']\n const ariaDescription = allProps['aria-description']\n const { locale: contextLocale } = useI18nContext()\n const { value: zIndex } = useZIndexContext()\n\n const { features } = React.useContext(TextEditorContext)\n const stickyToolbar = features?.stickyToolbar ? { toolbar_sticky: true } : {}\n const tabControls = features?.tabAsNavigation\n ? {\n external_plugins: generateExternalPlugins(\n plugins,\n defaultPlugins.filter((p) => p !== 'nonbreaking')\n ),\n nonbreaking_force_tab: false,\n setup: setupShortcuts,\n }\n : {\n setup: setupDefaultShortcuts,\n }\n\n const onEditorChange: React.ComponentProps<\n typeof Editor\n >['onEditorChange'] = (_: any, editor: any) => {\n onChange(editor.getContent(), editor.isDirty())\n }\n\n const ref = React.useRef<HTMLElement>()\n const editorRef = React.useRef<any>(null)\n const [isEditorReady, setIsEditorReady] = React.useState(false)\n\n const updateError = () => {\n if (ref.current) {\n if (error) {\n ref.current.style.borderColor = errorRed\n } else {\n ref.current.style.borderColor = ''\n }\n ref.current.setAttribute('aria-invalid', error ? 'true' : 'false')\n }\n }\n\n React.useEffect(() => {\n updateError()\n }, [error])\n\n // Update aria-label when prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorRef.current) {\n return\n }\n const body = editorRef.current.getBody()\n if (body) {\n if (ariaLabel) {\n body.setAttribute('aria-label', ariaLabel)\n } else {\n body.removeAttribute('aria-label')\n }\n }\n }, [ariaLabel, isEditorReady])\n\n // Update aria-description when prop changes\n React.useEffect(() => {\n if (!isEditorReady || !editorRef.current) {\n return\n }\n const body = editorRef.current.getBody()\n if (body) {\n if (ariaDescription) {\n body.setAttribute('aria-description', ariaDescription)\n } else {\n body.removeAttribute('aria-description')\n }\n }\n }, [ariaDescription, isEditorReady])\n\n useFocusScopePatch(plugins)\n\n const onInit: React.ComponentProps<typeof Editor>['onInit'] = (\n event,\n editor\n ) => {\n ref.current = editor.editorContainer\n editorRef.current = editor\n setIsEditorReady(true)\n updateError()\n\n // Set accessible label and description on the editable body element if provided\n // This provides the accessible name/description for screen readers\n const body = editor.getBody()\n if (body) {\n if (ariaLabel) {\n body.setAttribute('aria-label', ariaLabel)\n }\n if (ariaDescription) {\n body.setAttribute('aria-description', ariaDescription)\n }\n }\n\n _onInit && _onInit(event, editor)\n }\n\n const [derivedInitial] = useState(props.initialValue ?? props.value)\n\n const accessibilityConfig = ariaLabel ? { iframe_aria_text: ariaLabel } : {}\n\n // zIndex + 1 because on first render zIndex of Portal(Modal) is higher\n return (\n <>\n <GlobalStyle $zIndex={zIndex + 1} />\n <Editor\n init={{\n ...tinyMCEConfig,\n external_plugins: generateExternalPlugins(plugins),\n language_url: generateLanguageUrl(locale || contextLocale),\n language: getValidLookupLocale(locale || contextLocale),\n content_style: `p { margin: 0; }`,\n ...stickyToolbar,\n ...tabControls,\n ...accessibilityConfig,\n ...initOverrides,\n }}\n tinymceScriptSrc={`${tinyMCESource}/${tinyMCEVersion}/tinymce.min.js`}\n onInit={onInit}\n onEditorChange={onEditorChange}\n {...props}\n value={props.value ?? props.initialValue}\n initialValue={derivedInitial}\n />\n </>\n )\n}\n\nTextEditor.displayName = 'TextEditor'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA,SAASA,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,wBAAwB,QAAQ,8BAA8B;AACvE,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,gBAAgB,QAAQ,kBAAkB;AACnD,SACEC,cAAc,EACdC,uBAAuB,EACvBC,mBAAmB,EACnBC,oBAAoB,EACpBC,aAAa,EACbC,aAAa,EACbC,gBAAgB,EAChBC,cAAc,QACT,mBAAmB;AAC1B,SAASC,WAAW,QAAQ,qBAAqB;AAMjD,IAAMC,QAAQ,GAAG,SAAS;AAE1B,SAASC,IAAIA,CAAA,EAAG,CAAC;AAEjB,IAAMC,iBAAiB,gBAAGhB,KAAK,CAACiB,aAAa,CAE3C;EACAC,QAAQ,EAAE;IACRC,eAAe,EAAE,IAAI;IACrBC,aAAa,EAAEC;EACjB;AACF,CAAC,CAAC;AAEF,OAAO,SAASC,kBAAkBA,CAAAC,IAAA,EAGN;EAAA,IAF1BC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IACRN,QAAQ,GAAAK,IAAA,CAARL,QAAQ;EAER,oBACElB,KAAA,CAAAyB,aAAA,CAACT,iBAAiB,CAACU,QAAQ;IACzBC,KAAK,EAAE;MACLT,QAAQ,EAAAU,aAAA;QACNT,eAAe,EAAE;MAAI,GAClBD,QAAQ;IAEf;EAAE,GAEDM,QACyB,CAAC;AAEjC;AAEA,SAASK,qBAAqBA,CAACC,MAAW,EAAE;EAC1CA,MAAM,CAACC,SAAS,CAACC,GAAG,CAAC,cAAc,EAAE,eAAe,EAAE,eAAe,CAAC;AACxE;;AAEA;AACA;AACA;AACA,SAASC,cAAcA,CAACH,MAAW,EAAE;EACnCD,qBAAqB,CAACC,MAAM,CAAC;EAC7BA,MAAM,CAACI,EAAE,CAAC,SAAS,EAAE,SAASC,aAAaA,CAACC,KAA0B,EAAE;IACtE,IAAIA,KAAK,CAACC,MAAM,IAAID,KAAK,CAACE,GAAG,KAAK,KAAK,EAAE;MACvCR,MAAM,CAACS,WAAW,CAAC,kBAAkB,EAAE,KAAK,EAAE5B,gBAAgB,CAAC;MAC/DyB,KAAK,CAACI,cAAc,CAAC,CAAC;MACtBJ,KAAK,CAACK,eAAe,CAAC,CAAC;MACvB,OAAO,KAAK;IACd;EACF,CAAC,CAAC;AACJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,kBAAkBA,CAACC,OAAiB,EAAE;EAC7C,IAAMC,UAAU,GAAG1C,wBAAwB,CAAC,CAAC;EAC7CF,KAAK,CAAC6C,SAAS,CAAC,YAAM;IACpB,IACE,GAAAC,MAAA,CAAAC,kBAAA,CAAI1C,cAAc,GAAA0C,kBAAA,CAAKJ,OAAO,GAAEK,IAAI;IAClC;IACA,UAACC,MAAM;MAAA,OACLA,MAAM,KAAK,MAAM,IAAIA,MAAM,KAAK,OAAO,IAAIA,MAAM,KAAK,OAAO;IAAA,CACjE,CAAC,EACD;MACAL,UAAU,CAACM,QAAQ,CAAC;QAAEC,OAAO,EAAE;MAAM,CAAC,CAAC;IACzC;EACF,CAAC,EAAE,CAACP,UAAU,EAAED,OAAO,CAAC,CAAC;AAC3B;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASS,UAAUA,CAACC,QAAyB,EAAE;EAAA,IAAAC,mBAAA,EAAAC,YAAA;EACpD,IACEC,KAAK,GAOHH,QAAQ,CAPVG,KAAK;IACCC,aAAa,GAMjBJ,QAAQ,CANVK,IAAI;IACJC,MAAM,GAKJN,QAAQ,CALVM,MAAM;IAAAC,kBAAA,GAKJP,QAAQ,CAJVQ,QAAQ;IAARA,QAAQ,GAAAD,kBAAA,cAAG7C,IAAI,GAAA6C,kBAAA;IACPE,OAAO,GAGbT,QAAQ,CAHVU,MAAM;IAAAC,iBAAA,GAGJX,QAAQ,CAFVV,OAAO;IAAPA,OAAO,GAAAqB,iBAAA,cAAG3D,cAAc,GAAA2D,iBAAA;IACrBC,KAAK,GAAAC,wBAAA,CACNb,QAAQ,EAAAc,SAAA;EACZ,IAAMC,SAAS,GAAGf,QAAQ,CAAC,YAAY,CAAC;EACxC,IAAMgB,eAAe,GAAGhB,QAAQ,CAAC,kBAAkB,CAAC;EACpD,IAAAiB,eAAA,GAAkCnE,cAAc,CAAC,CAAC;IAAlCoE,aAAa,GAAAD,eAAA,CAArBX,MAAM;EACd,IAAAa,iBAAA,GAA0BpE,gBAAgB,CAAC,CAAC;IAA7BqE,MAAM,GAAAD,iBAAA,CAAb7C,KAAK;EAEb,IAAA+C,iBAAA,GAAqB1E,KAAK,CAAC2E,UAAU,CAAC3D,iBAAiB,CAAC;IAAhDE,QAAQ,GAAAwD,iBAAA,CAARxD,QAAQ;EAChB,IAAME,aAAa,GAAGF,QAAQ,aAARA,QAAQ,eAARA,QAAQ,CAAEE,aAAa,GAAG;IAAEwD,cAAc,EAAE;EAAK,CAAC,GAAG,CAAC,CAAC;EAC7E,IAAMC,WAAW,GAAG3D,QAAQ,aAARA,QAAQ,eAARA,QAAQ,CAAEC,eAAe,GACzC;IACE2D,gBAAgB,EAAExE,uBAAuB,CACvCqC,OAAO,EACPtC,cAAc,CAAC0E,MAAM,CAAC,UAACC,CAAC;MAAA,OAAKA,CAAC,KAAK,aAAa;IAAA,EAClD,CAAC;IACDC,qBAAqB,EAAE,KAAK;IAC5BC,KAAK,EAAEjD;EACT,CAAC,GACD;IACEiD,KAAK,EAAErD;EACT,CAAC;EAEL,IAAMsD,cAEa,GAAG,SAFhBA,cAEaA,CAAIC,CAAM,EAAEtD,MAAW,EAAK;IAC7C+B,QAAQ,CAAC/B,MAAM,CAACuD,UAAU,CAAC,CAAC,EAAEvD,MAAM,CAACwD,OAAO,CAAC,CAAC,CAAC;EACjD,CAAC;EAED,IAAMC,GAAG,GAAGvF,KAAK,CAACwF,MAAM,CAAc,CAAC;EACvC,IAAMC,SAAS,GAAGzF,KAAK,CAACwF,MAAM,CAAM,IAAI,CAAC;EACzC,IAAAE,eAAA,GAA0C1F,KAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;IAAA0F,gBAAA,GAAAC,cAAA,CAAAF,eAAA;IAAxDG,aAAa,GAAAF,gBAAA;IAAEG,gBAAgB,GAAAH,gBAAA;EAEtC,IAAMI,WAAW,GAAG,SAAdA,WAAWA,CAAA,EAAS;IACxB,IAAIR,GAAG,CAACS,OAAO,EAAE;MACf,IAAIxC,KAAK,EAAE;QACT+B,GAAG,CAACS,OAAO,CAACC,KAAK,CAACC,WAAW,GAAGpF,QAAQ;MAC1C,CAAC,MAAM;QACLyE,GAAG,CAACS,OAAO,CAACC,KAAK,CAACC,WAAW,GAAG,EAAE;MACpC;MACAX,GAAG,CAACS,OAAO,CAACG,YAAY,CAAC,cAAc,EAAE3C,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;IACpE;EACF,CAAC;EAEDxD,KAAK,CAAC6C,SAAS,CAAC,YAAM;IACpBkD,WAAW,CAAC,CAAC;EACf,CAAC,EAAE,CAACvC,KAAK,CAAC,CAAC;;EAEX;EACAxD,KAAK,CAAC6C,SAAS,CAAC,YAAM;IACpB,IAAI,CAACgD,aAAa,IAAI,CAACJ,SAAS,CAACO,OAAO,EAAE;MACxC;IACF;IACA,IAAMI,IAAI,GAAGX,SAAS,CAACO,OAAO,CAACK,OAAO,CAAC,CAAC;IACxC,IAAID,IAAI,EAAE;MACR,IAAIhC,SAAS,EAAE;QACbgC,IAAI,CAACD,YAAY,CAAC,YAAY,EAAE/B,SAAS,CAAC;MAC5C,CAAC,MAAM;QACLgC,IAAI,CAACE,eAAe,CAAC,YAAY,CAAC;MACpC;IACF;EACF,CAAC,EAAE,CAAClC,SAAS,EAAEyB,aAAa,CAAC,CAAC;;EAE9B;EACA7F,KAAK,CAAC6C,SAAS,CAAC,YAAM;IACpB,IAAI,CAACgD,aAAa,IAAI,CAACJ,SAAS,CAACO,OAAO,EAAE;MACxC;IACF;IACA,IAAMI,IAAI,GAAGX,SAAS,CAACO,OAAO,CAACK,OAAO,CAAC,CAAC;IACxC,IAAID,IAAI,EAAE;MACR,IAAI/B,eAAe,EAAE;QACnB+B,IAAI,CAACD,YAAY,CAAC,kBAAkB,EAAE9B,eAAe,CAAC;MACxD,CAAC,MAAM;QACL+B,IAAI,CAACE,eAAe,CAAC,kBAAkB,CAAC;MAC1C;IACF;EACF,CAAC,EAAE,CAACjC,eAAe,EAAEwB,aAAa,CAAC,CAAC;EAEpCnD,kBAAkB,CAACC,OAAO,CAAC;EAE3B,IAAMoB,MAAqD,GAAG,SAAxDA,MAAqDA,CACzD3B,KAAK,EACLN,MAAM,EACH;IACHyD,GAAG,CAACS,OAAO,GAAGlE,MAAM,CAACyE,eAAe;IACpCd,SAAS,CAACO,OAAO,GAAGlE,MAAM;IAC1BgE,gBAAgB,CAAC,IAAI,CAAC;IACtBC,WAAW,CAAC,CAAC;;IAEb;IACA;IACA,IAAMK,IAAI,GAAGtE,MAAM,CAACuE,OAAO,CAAC,CAAC;IAC7B,IAAID,IAAI,EAAE;MACR,IAAIhC,SAAS,EAAE;QACbgC,IAAI,CAACD,YAAY,CAAC,YAAY,EAAE/B,SAAS,CAAC;MAC5C;MACA,IAAIC,eAAe,EAAE;QACnB+B,IAAI,CAACD,YAAY,CAAC,kBAAkB,EAAE9B,eAAe,CAAC;MACxD;IACF;IAEAP,OAAO,IAAIA,OAAO,CAAC1B,KAAK,EAAEN,MAAM,CAAC;EACnC,CAAC;EAED,IAAA0E,SAAA,GAAyBvG,QAAQ,EAAAqD,mBAAA,GAACW,KAAK,CAACwC,YAAY,cAAAnD,mBAAA,cAAAA,mBAAA,GAAIW,KAAK,CAACtC,KAAK,CAAC;IAAA+E,UAAA,GAAAd,cAAA,CAAAY,SAAA;IAA7DG,cAAc,GAAAD,UAAA;EAErB,IAAME,mBAAmB,GAAGxC,SAAS,GAAG;IAAEyC,gBAAgB,EAAEzC;EAAU,CAAC,GAAG,CAAC,CAAC;;EAE5E;EACA,oBACEpE,KAAA,CAAAyB,aAAA,CAAAzB,KAAA,CAAA8G,QAAA,qBACE9G,KAAA,CAAAyB,aAAA,CAACZ,WAAW;IAACkG,OAAO,EAAEtC,MAAM,GAAG;EAAE,CAAE,CAAC,eACpCzE,KAAA,CAAAyB,aAAA,CAAC1B,MAAM,EAAAiH,QAAA;IACLtD,IAAI,EAAA9B,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,KACCnB,aAAa;MAChBqE,gBAAgB,EAAExE,uBAAuB,CAACqC,OAAO,CAAC;MAClDsE,YAAY,EAAE1G,mBAAmB,CAACoD,MAAM,IAAIY,aAAa,CAAC;MAC1D2C,QAAQ,EAAE1G,oBAAoB,CAACmD,MAAM,IAAIY,aAAa,CAAC;MACvD4C,aAAa;IAAoB,GAC9B/F,aAAa,GACbyD,WAAW,GACX+B,mBAAmB,GACnBnD,aAAa,CAChB;IACF2D,gBAAgB,KAAAtE,MAAA,CAAKpC,aAAa,OAAAoC,MAAA,CAAIlC,cAAc,oBAAkB;IACtEmD,MAAM,EAAEA,MAAO;IACfoB,cAAc,EAAEA;EAAe,GAC3BlB,KAAK;IACTtC,KAAK,GAAA4B,YAAA,GAAEU,KAAK,CAACtC,KAAK,cAAA4B,YAAA,cAAAA,YAAA,GAAIU,KAAK,CAACwC,YAAa;IACzCA,YAAY,EAAEE;EAAe,EAC9B,CACD,CAAC;AAEP;AAEAvD,UAAU,CAACiE,WAAW,GAAG,YAAY"}
@@ -28,6 +28,23 @@ export interface TextEditorProps extends Omit<React.ComponentProps<typeof Editor
28
28
  * @since 10.19.0
29
29
  */
30
30
  error?: boolean;
31
+ /**
32
+ * Accessible label for the editor's editable area. This text will be
33
+ * announced by screen readers when the user focuses the editor. It should
34
+ * match or include the visible label associated with this editor field.
35
+ * If not provided, screen readers will announce a generic "Rich Text Area" message.
36
+ *
37
+ * @since 12.35.0
38
+ */
39
+ 'aria-label'?: string;
40
+ /**
41
+ * Accessible description for the editor's editable area.
42
+ * This text provides additional context to screen reader users. It will be
43
+ * announced after the label when the user focuses the editor.
44
+ *
45
+ * @since 12.35.0
46
+ */
47
+ 'aria-description'?: string;
31
48
  /**
32
49
  * Config for when the editor is initialized. **Changes after the editor has initialized are ignored.**
33
50
  * @link [TinyMCE React Init](https://www.tiny.cloud/docs/integrations/react/#init)
@@ -1 +1 @@
1
- {"version":3,"file":"TextEditor.types.js","names":[],"sources":["../../src/TextEditor/TextEditor.types.ts"],"sourcesContent":["import type { Editor, IAllProps } from '@tinymce/tinymce-react'\nimport type React from 'react'\nimport type { Locale } from '../_hooks/I18n'\n\ntype TextEditorFeatureToggle = {\n stickyToolbar?: boolean\n tabAsNavigation?: boolean\n}\n\n/**\n * Expect context to change the `init` config of the below `TextEditor`s.\n * **Changes after the editor has initialized are ignored.**\n * @link [TinyMCE React Init](https://www.tiny.cloud/docs/integrations/react/#init)\n * @link [TinyMCE React configure editor](https://www.tiny.cloud/docs/integrations/react/#configuringeditorsettings)\n */\nexport interface TextEditorProviderProps {\n children: React.ReactNode\n /**\n * - `stickyToolbar` - Have the editor toolbar stick to the top when content is longer than the page length.\n * - `tabAsNavigation` - Have `Tab` key exit the editor. Support `Alt`/`Opt` + `Tab` as triple space indent.\n */\n features?: TextEditorFeatureToggle\n}\n\nexport interface TextEditorProps\n extends Omit<React.ComponentProps<typeof Editor>, 'onChange' | 'onKeyUp'> {\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n /**\n * Config for when the editor is initialized. **Changes after the editor has initialized are ignored.**\n * @link [TinyMCE React Init](https://www.tiny.cloud/docs/integrations/react/#init)\n * @unsupported Use at your own risk. DST makes no guarantees about this API,\n * and is subject to removal at any point without warning or deprecation.\n * @since 10.19.0\n */\n init?: IAllProps['init']\n /**\n * @deprecated\n * `initialValue` has been deprecated and will be removed in a future version.\n * Please use the `value` prop instead\n *\n * The first value passed into `value` prop will be the `TextEditor` initial\n * value. Changing the value will update the text of the `TextEditor`.\n * The editor should be controlled via the combination of `value`\n * and `onChange` props.\n *\n * **Before**\n *\n * `<TextEditor initialValue=\"Hello World\" />`\n *\n * **After**\n *\n * `<TextEditor value=\"Hello World\" />`\n *\n * @deprecatedSince 10.20.0\n * @since 10.19.0\n */\n initialValue?: string\n\n /**\n * Locale which will be used used for localization. Can be passed directly or\n * set by wrapping components in I18n provider. Icelandic (is-IS) is not\n * actually supported by TinyMCE, so it is defaulted to english.\n * @since 10.19.0\n */\n locale?: Locale\n\n /**\n * onChange event handler for text editor area\n *\n * ```\n * (content: string) => void\n * ```\n * @since 10.19.0\n */\n onChange?: (content: string, isDirty?: boolean) => void\n\n /**\n *\n * Array of plugins to use with the editor in addition to the defaults.\n * Can be any of:\n *\n * ```\n * [{plugins.map((plugin) => `'${plugin}'`).join(', ')}]\n * ```\n * @since 10.19.0\n */\n plugins?: Array<string>\n}\n"],"mappings":""}
1
+ {"version":3,"file":"TextEditor.types.js","names":[],"sources":["../../src/TextEditor/TextEditor.types.ts"],"sourcesContent":["import type { Editor, IAllProps } from '@tinymce/tinymce-react'\nimport type React from 'react'\nimport type { Locale } from '../_hooks/I18n'\n\ntype TextEditorFeatureToggle = {\n stickyToolbar?: boolean\n tabAsNavigation?: boolean\n}\n\n/**\n * Expect context to change the `init` config of the below `TextEditor`s.\n * **Changes after the editor has initialized are ignored.**\n * @link [TinyMCE React Init](https://www.tiny.cloud/docs/integrations/react/#init)\n * @link [TinyMCE React configure editor](https://www.tiny.cloud/docs/integrations/react/#configuringeditorsettings)\n */\nexport interface TextEditorProviderProps {\n children: React.ReactNode\n /**\n * - `stickyToolbar` - Have the editor toolbar stick to the top when content is longer than the page length.\n * - `tabAsNavigation` - Have `Tab` key exit the editor. Support `Alt`/`Opt` + `Tab` as triple space indent.\n */\n features?: TextEditorFeatureToggle\n}\n\nexport interface TextEditorProps\n extends Omit<React.ComponentProps<typeof Editor>, 'onChange' | 'onKeyUp'> {\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n\n /**\n * Accessible label for the editor's editable area. This text will be\n * announced by screen readers when the user focuses the editor. It should\n * match or include the visible label associated with this editor field.\n * If not provided, screen readers will announce a generic \"Rich Text Area\" message.\n *\n * @since 12.35.0\n */\n 'aria-label'?: string\n\n /**\n * Accessible description for the editor's editable area.\n * This text provides additional context to screen reader users. It will be\n * announced after the label when the user focuses the editor.\n *\n * @since 12.35.0\n */\n 'aria-description'?: string\n\n /**\n * Config for when the editor is initialized. **Changes after the editor has initialized are ignored.**\n * @link [TinyMCE React Init](https://www.tiny.cloud/docs/integrations/react/#init)\n * @unsupported Use at your own risk. DST makes no guarantees about this API,\n * and is subject to removal at any point without warning or deprecation.\n * @since 10.19.0\n */\n init?: IAllProps['init']\n /**\n * @deprecated\n * `initialValue` has been deprecated and will be removed in a future version.\n * Please use the `value` prop instead\n *\n * The first value passed into `value` prop will be the `TextEditor` initial\n * value. Changing the value will update the text of the `TextEditor`.\n * The editor should be controlled via the combination of `value`\n * and `onChange` props.\n *\n * **Before**\n *\n * `<TextEditor initialValue=\"Hello World\" />`\n *\n * **After**\n *\n * `<TextEditor value=\"Hello World\" />`\n *\n * @deprecatedSince 10.20.0\n * @since 10.19.0\n */\n initialValue?: string\n\n /**\n * Locale which will be used used for localization. Can be passed directly or\n * set by wrapping components in I18n provider. Icelandic (is-IS) is not\n * actually supported by TinyMCE, so it is defaulted to english.\n * @since 10.19.0\n */\n locale?: Locale\n\n /**\n * onChange event handler for text editor area\n *\n * ```\n * (content: string) => void\n * ```\n * @since 10.19.0\n */\n onChange?: (content: string, isDirty?: boolean) => void\n\n /**\n *\n * Array of plugins to use with the editor in addition to the defaults.\n * Can be any of:\n *\n * ```\n * [{plugins.map((plugin) => `'${plugin}'`).join(', ')}]\n * ```\n * @since 10.19.0\n */\n plugins?: Array<string>\n}\n"],"mappings":""}
@@ -1,6 +1,6 @@
1
1
  import styled from 'styled-components';
2
2
  export var StyledEditor = /*#__PURE__*/styled.div.withConfig({
3
3
  displayName: "StyledEditor",
4
- componentId: "core-12_34_1__sc-1lje1b0-0"
4
+ componentId: "core-12_35_0__sc-1lje1b0-0"
5
5
  })(["> .tox-tinymce{border:none;}"]);
6
6
  //# sourceMappingURL=TextEditorOutput.styles.js.map
@@ -27,35 +27,35 @@ var captionBase = /*#__PURE__*/css(["color:", ";font-size:12px;line-height:16px;
27
27
  });
28
28
  export var StyledMultilineCaption = /*#__PURE__*/styled.div.withConfig({
29
29
  displayName: "StyledMultilineCaption",
30
- componentId: "core-12_34_1__sc-195f70c-0"
30
+ componentId: "core-12_35_0__sc-195f70c-0"
31
31
  })(["", ";display:flex;word-wrap:break-word;overflow-wrap:break-word;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:", "px;"], captionBase, multilineCaptionMaxHeight);
32
32
  export var StyledCaptionText = /*#__PURE__*/styled.span.withConfig({
33
33
  displayName: "StyledCaptionText",
34
- componentId: "core-12_34_1__sc-195f70c-1"
34
+ componentId: "core-12_35_0__sc-195f70c-1"
35
35
  })(["width:100%;"]);
36
36
  export var StyledPlaceholderCaption = /*#__PURE__*/styled.div.withConfig({
37
37
  displayName: "StyledPlaceholderCaption",
38
- componentId: "core-12_34_1__sc-195f70c-2"
38
+ componentId: "core-12_35_0__sc-195f70c-2"
39
39
  })(["", ""], captionBase);
40
40
  export var StyledSingleLineCaption = /*#__PURE__*/styled.div.withConfig({
41
41
  displayName: "StyledSingleLineCaption",
42
- componentId: "core-12_34_1__sc-195f70c-3"
42
+ componentId: "core-12_35_0__sc-195f70c-3"
43
43
  })(["display:flex;", ""], captionBase);
44
44
  export var StyledSinglelineCaptionBody = /*#__PURE__*/styled.span.withConfig({
45
45
  displayName: "StyledSinglelineCaptionBody",
46
- componentId: "core-12_34_1__sc-195f70c-4"
46
+ componentId: "core-12_35_0__sc-195f70c-4"
47
47
  })(["", ""], getEllipsis);
48
48
  export var StyledSinglelineCaptionEnding = /*#__PURE__*/styled.span.withConfig({
49
49
  displayName: "StyledSinglelineCaptionEnding",
50
- componentId: "core-12_34_1__sc-195f70c-5"
50
+ componentId: "core-12_35_0__sc-195f70c-5"
51
51
  })(["max-width:50%;white-space:nowrap;flex-shrink:0;"]);
52
52
  export var StyledLabelText = /*#__PURE__*/styled(Typography).withConfig({
53
53
  displayName: "StyledLabelText",
54
- componentId: "core-12_34_1__sc-195f70c-6"
54
+ componentId: "core-12_35_0__sc-195f70c-6"
55
55
  })(["", ""], getEllipsis());
56
56
  export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig({
57
57
  displayName: "StyledThumbnailFigCaption",
58
- componentId: "core-12_34_1__sc-195f70c-7"
58
+ componentId: "core-12_35_0__sc-195f70c-7"
59
59
  })(["", " ", " color:", ";font-weight:", ";text-align:center;width:100%;position:absolute;bottom:0;right:0;left:0;opacity:0.85;height:", "px;padding:", "px ", "px;background-color:", ";"], getTypographyIntent('small'), getEllipsis(), function (_ref5) {
60
60
  var _ref5$$color = _ref5.$color,
61
61
  $color = _ref5$$color === void 0 ? 'gray15' : _ref5$$color;
@@ -63,7 +63,7 @@ export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig
63
63
  }, typographyWeights.bold, labelHeight, spacing.sm / 2, spacing.sm, colors.white);
64
64
  export var StyledLabel = /*#__PURE__*/styled.div.withConfig({
65
65
  displayName: "StyledLabel",
66
- componentId: "core-12_34_1__sc-195f70c-8"
66
+ componentId: "core-12_35_0__sc-195f70c-8"
67
67
  })(["display:flex;justify-content:center;position:absolute;bottom:0;right:0;left:0;opacity:0.85;height:", "px;padding:", "px ", "px;font-size:", "px;background-color:", ";"], labelHeight, spacing.sm / 2, spacing.sm, labelFontSize, colors.white);
68
68
  var thumbnailBase = /*#__PURE__*/css(["display:flex;justify-content:center;align-items:center;position:relative;overflow:hidden;border:1px solid ", ";border-radius:", "px;margin:0;", " ", " &:focus{", ";}", " ", " ", ""], colors.gray85, borderRadius.md, function (_ref6) {
69
69
  var $clickable = _ref6.$clickable;
@@ -85,7 +85,7 @@ var thumbnailBase = /*#__PURE__*/css(["display:flex;justify-content:center;align
85
85
  });
86
86
  export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
87
87
  displayName: "StyledTickIcon",
88
- componentId: "core-12_34_1__sc-195f70c-9"
88
+ componentId: "core-12_35_0__sc-195f70c-9"
89
89
  })(["position:absolute;top:", "px;right:", "px;width:", "px;height:", "px;opacity:0;transform:scale(0.75);transition:transform 250ms ease-out,opacity 100ms ease-out;", " ", ""], spacing.sm, spacing.sm, tickSize, tickSize, function (_ref1) {
90
90
  var $selected = _ref1.$selected;
91
91
  return $selected && css(["opacity:1;transform:scale(1);"]);
@@ -95,28 +95,28 @@ export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
95
95
  });
96
96
  export var StyledFileIcon = /*#__PURE__*/styled(DocumentIcon).withConfig({
97
97
  displayName: "StyledFileIcon",
98
- componentId: "core-12_34_1__sc-195f70c-10"
98
+ componentId: "core-12_35_0__sc-195f70c-10"
99
99
  })(["width:36.5%;height:auto;"]);
100
100
  export var StyledImageThumbnailPreview = /*#__PURE__*/styled.div.withConfig({
101
101
  displayName: "StyledImageThumbnailPreview",
102
- componentId: "core-12_34_1__sc-195f70c-11"
102
+ componentId: "core-12_35_0__sc-195f70c-11"
103
103
  })(["width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center;", ""], function (_ref11) {
104
104
  var $bgImage = _ref11.$bgImage;
105
105
  return css(["background-image:url(", ");"], $bgImage);
106
106
  });
107
107
  export var StyledImageThumbnailOverlay = /*#__PURE__*/styled.div.withConfig({
108
108
  displayName: "StyledImageThumbnailOverlay",
109
- componentId: "core-12_34_1__sc-195f70c-12"
109
+ componentId: "core-12_35_0__sc-195f70c-12"
110
110
  })(["display:none;position:absolute;top:0;bottom:0;left:0;right:0;"]);
111
111
  var blackOverlay = "\n background-color: ".concat(colors.black, ";\n opacity: 0.2;\n");
112
112
  var whiteOverlay = "\n background-color: ".concat(colors.white, ";\n opacity: 0.5;\n");
113
113
  export var StyledImageThumbnailImage = /*#__PURE__*/styled.img.withConfig({
114
114
  displayName: "StyledImageThumbnailImage",
115
- componentId: "core-12_34_1__sc-195f70c-13"
115
+ componentId: "core-12_35_0__sc-195f70c-13"
116
116
  })([""]);
117
117
  export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
118
118
  displayName: "StyledImageThumbnail",
119
- componentId: "core-12_34_1__sc-195f70c-14"
119
+ componentId: "core-12_35_0__sc-195f70c-14"
120
120
  })(["", ";flex-direction:column;", " ", " ", " ", " ", " ", ""], thumbnailBase, function (_ref12) {
121
121
  var $disabled = _ref12.$disabled;
122
122
  return $disabled && css(["&,&:hover{", "{display:block;", "}}", ",", ",", "{filter:saturate(0);}", "{filter:saturate(0);z-index:-1;}"], StyledImageThumbnailOverlay, whiteOverlay, StyledImageThumbnailPreview, StyledTickIcon, StyledImageThumbnailImage, StyledFileIcon);
@@ -145,7 +145,7 @@ export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
145
145
  });
146
146
  export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
147
147
  displayName: "StyledThumbnailWrapper",
148
- componentId: "core-12_34_1__sc-195f70c-15"
148
+ componentId: "core-12_35_0__sc-195f70c-15"
149
149
  })(["display:flex;", " ", ""], function (_ref18) {
150
150
  var $size = _ref18.$size;
151
151
  return $size === 'lg' ? "\n width: ".concat(thumbnailSizeLg, "px;\n ") : '';
@@ -156,7 +156,7 @@ export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
156
156
  });
157
157
  export var StyledPlaceholderThumbnail = /*#__PURE__*/styled.div.withConfig({
158
158
  displayName: "StyledPlaceholderThumbnail",
159
- componentId: "core-12_34_1__sc-195f70c-16"
159
+ componentId: "core-12_35_0__sc-195f70c-16"
160
160
  })(["", " ", " ", " ", " ", ""], thumbnailBase, function (_ref20) {
161
161
  var $clickable = _ref20.$clickable;
162
162
  return $clickable && css(["&:hover{background-color:", ";}"], colors.gray96);
@@ -2,9 +2,11 @@ import React from 'react';
2
2
  export declare type ThumbnailDocumentIconVariant = 'image' | 'unknown' | 'zip' | 'drawing' | 'email' | 'excel' | 'gantt' | 'ini' | 'mov' | 'pdf' | 'powerpoint' | 'word' | 'xml' | '3d' | 'folder' | 'folderPeople' | 'folderLock' | 'file';
3
3
  export interface DocumentIconProps {
4
4
  variant: ThumbnailDocumentIconVariant;
5
+ role?: 'img';
5
6
  className?: string;
6
7
  width?: string | number;
7
8
  height?: string | number;
8
9
  focusable?: boolean;
10
+ 'aria-label'?: string;
9
11
  }
10
- export declare function DocumentIcon({ className, focusable, height, variant, width, }: DocumentIconProps): React.JSX.Element;
12
+ export declare function DocumentIcon({ className, focusable, height, variant, width, 'aria-label': ariaLabelOverride, }: DocumentIconProps): React.JSX.Element;