@procore/core-react 12.47.1 → 12.48.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 (223) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/AnchorNavigation/AnchorNavigation.styles.js +4 -4
  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.styles.js +9 -9
  12. package/dist/Card/Card.styles.js +1 -1
  13. package/dist/Checkbox/Checkbox.styles.js +6 -6
  14. package/dist/CheckboxGroup/CheckboxGroup.js +9 -3
  15. package/dist/CheckboxGroup/CheckboxGroup.js.map +1 -1
  16. package/dist/CheckboxGroup/checkboxGroupTileNavigation.d.ts +12 -0
  17. package/dist/CheckboxGroup/checkboxGroupTileNavigation.js +224 -0
  18. package/dist/CheckboxGroup/checkboxGroupTileNavigation.js.map +1 -0
  19. package/dist/ContactItem/ContactItem.styles.js +5 -5
  20. package/dist/Content/Content.styles.js +2 -2
  21. package/dist/DateInput/DateInput.styles.js +6 -6
  22. package/dist/DateSelect/DateSelect.js +5 -4
  23. package/dist/DateSelect/DateSelect.js.map +1 -1
  24. package/dist/DateSelect/DateSelect.types.d.ts +1 -1
  25. package/dist/DateSelect/DateSelect.types.js.map +1 -1
  26. package/dist/DetailPage/DetailPage.styles.js +7 -7
  27. package/dist/Dropdown/Dropdown.styles.js +3 -3
  28. package/dist/DropdownFlyout/DropdownFlyout.styles.js +4 -4
  29. package/dist/Dropzone/Dropzone.js +1 -1
  30. package/dist/Dropzone/Dropzone.styles.js +9 -9
  31. package/dist/EmptyState/EmptyState.styles.js +6 -6
  32. package/dist/Field/Field.styles.js +3 -3
  33. package/dist/FileList/FileList.styles.js +3 -3
  34. package/dist/FileSelect/FileExplorer/FileExplorer.styles.js +9 -9
  35. package/dist/FileSelect/FileExplorer/FileExplorerSidebar.styles.js +3 -3
  36. package/dist/FileSelect/FileSelect.styles.js +2 -2
  37. package/dist/FileSelect/FileSelectDropzone/FileSelectDropzone.styles.js +3 -3
  38. package/dist/FileSelect/FileTokenList/FileTokenList.styles.js +2 -2
  39. package/dist/FileSelect/GridSource/GridSource.styles.js +6 -6
  40. package/dist/FileSelect/LocalSource/LocalSource.styles.js +4 -4
  41. package/dist/FileSelect/SourceItem/SourceItem.styles.js +3 -3
  42. package/dist/FileSelect/ThumbnailList/ThumbnailList.styles.js +6 -6
  43. package/dist/FileSelect/TreeSource/TreeSource.styles.js +1 -1
  44. package/dist/FileToken/FileToken.styles.js +6 -6
  45. package/dist/FilterToken/FilterToken.styles.js +5 -5
  46. package/dist/FlexList/FlexList.styles.js +1 -1
  47. package/dist/Form/Form.styles.js +13 -13
  48. package/dist/Form/StyledFormikForm.styles.js +2 -2
  49. package/dist/GhostPlaceholder/GhostPlaceholder.styles.js +2 -2
  50. package/dist/Grid/Grid.styles.js +2 -2
  51. package/dist/GroupSelect/GroupSelect.styles.js +1 -1
  52. package/dist/Input/Input.styles.js +1 -1
  53. package/dist/Link/Link.styles.js +1 -1
  54. package/dist/ListPage/ListPage.styles.js +8 -8
  55. package/dist/Loader/Loader.styles.js +2 -2
  56. package/dist/MenuImperative/MenuImperative.styles.js +11 -11
  57. package/dist/Modal/Modal.styles.js +13 -13
  58. package/dist/MultiSelect/MultiSelect.styles.js +8 -8
  59. package/dist/NextMenu/NextMenu.styles.js +3 -3
  60. package/dist/NextTile/NextTile.d.ts +24 -0
  61. package/dist/NextTile/NextTile.js +275 -90
  62. package/dist/NextTile/NextTile.js.map +1 -1
  63. package/dist/NextTile/NextTile.styles.d.ts +16 -0
  64. package/dist/NextTile/NextTile.styles.js +136 -0
  65. package/dist/NextTile/NextTile.styles.js.map +1 -0
  66. package/dist/NextTile/NextTile.types.d.ts +14 -2
  67. package/dist/NextTile/NextTile.types.js.map +1 -1
  68. package/dist/Notation/Notation.js +1 -1
  69. package/dist/NumberInput/NumberInput.styles.js +7 -7
  70. package/dist/Overlay/OverlayArrow.styles.js +1 -1
  71. package/dist/PageLayout/PageLayout.styles.js +16 -16
  72. package/dist/PageTemplate/PageFooterTemplate/PageFooterTemplate.styles.js +1 -1
  73. package/dist/PageTemplate/PageHeaderTemplate/PageHeaderTemplate.styles.js +3 -3
  74. package/dist/PageTemplate/PagePaneTemplate/PagePaneTemplate.styles.js +2 -2
  75. package/dist/PageTemplate/PageTemplate/PageTemplate.styles.js +3 -3
  76. package/dist/Pagination/Pagination.styles.js +5 -5
  77. package/dist/Panel/Panel.styles.js +11 -11
  78. package/dist/Pill/Pill.styles.js +3 -3
  79. package/dist/PillSelect/PillSelect.styles.js +4 -4
  80. package/dist/Popover/Popover.styles.js +2 -2
  81. package/dist/Portal/Portal.styles.js +1 -1
  82. package/dist/ProgressBar/ProgressBar.styles.js +2 -2
  83. package/dist/RadioButton/RadioButton.styles.js +3 -3
  84. package/dist/Required/Required.styles.js +3 -3
  85. package/dist/Search/Search.styles.js +5 -5
  86. package/dist/Section/Section.styles.js +7 -7
  87. package/dist/SegmentedController/SegmentedController.styles.js +4 -4
  88. package/dist/Select/Select.styles.js +8 -8
  89. package/dist/Semantic/Semantic.styles.js +9 -9
  90. package/dist/Slider/Slider.styles.js +5 -5
  91. package/dist/Spinner/Spinner.styles.js +7 -7
  92. package/dist/SplitViewCard/SplitViewCard.styles.js +8 -8
  93. package/dist/SuperSelect/SuperSelect.presets.styles.js +1 -1
  94. package/dist/SuperSelect/SuperSelect.styles.js +40 -40
  95. package/dist/Switch/Switch.styles.js +4 -4
  96. package/dist/Table/Table.styles.js +29 -29
  97. package/dist/TableShelf/TableShelf.styles.js +5 -5
  98. package/dist/Tabs/Tabs.styles.js +16 -16
  99. package/dist/Tearsheet/Tearsheet.styles.js +5 -5
  100. package/dist/TextArea/TextArea.styles.js +1 -1
  101. package/dist/TextEditorOutput/TextEditorOutput.styles.js +1 -1
  102. package/dist/Thumbnail/Thumbnail.hooks.d.ts +13 -7
  103. package/dist/Thumbnail/Thumbnail.hooks.js +15 -5
  104. package/dist/Thumbnail/Thumbnail.hooks.js.map +1 -1
  105. package/dist/Thumbnail/Thumbnail.js +8 -4
  106. package/dist/Thumbnail/Thumbnail.js.map +1 -1
  107. package/dist/Thumbnail/Thumbnail.styles.d.ts +13 -5
  108. package/dist/Thumbnail/Thumbnail.styles.js +42 -24
  109. package/dist/Thumbnail/Thumbnail.styles.js.map +1 -1
  110. package/dist/Thumbnail/Thumbnail.types.d.ts +12 -10
  111. package/dist/Thumbnail/Thumbnail.types.js.map +1 -1
  112. package/dist/Thumbnail/Thumbnail.utils.d.ts +1 -0
  113. package/dist/Thumbnail/Thumbnail.utils.js +7 -0
  114. package/dist/Thumbnail/Thumbnail.utils.js.map +1 -1
  115. package/dist/Thumbnail/ThumbnailCaption.js +85 -40
  116. package/dist/Thumbnail/ThumbnailCaption.js.map +1 -1
  117. package/dist/ThumbnailGrid/ThumbnailGrid.styles.js +7 -7
  118. package/dist/TieredSelect/TieredSelect.styles.js +9 -9
  119. package/dist/Tile/Tile.styles.js +10 -10
  120. package/dist/Tile/Tile.styles.js.map +1 -1
  121. package/dist/Title/Title.styles.js +7 -7
  122. package/dist/Toast/Toast.styles.js +3 -3
  123. package/dist/ToggleButton/ToggleButton.styles.js +1 -1
  124. package/dist/Token/Token.styles.js +5 -5
  125. package/dist/ToolHeader/ToolHeader.styles.js +6 -6
  126. package/dist/ToolLandingPage/ToolLandingPage.styles.js +3 -3
  127. package/dist/Tooltip/Tooltip.styles.js +3 -3
  128. package/dist/Tree/Tree.js +1 -1
  129. package/dist/Tree/Tree.styles.js +10 -10
  130. package/dist/Typeahead/Typeahead.styles.js +3 -3
  131. package/dist/Typography/Typography.styles.js +1 -1
  132. package/dist/Typography/Typography.table.story.js +2 -2
  133. package/dist/_hooks/ClickOutside.js +8 -3
  134. package/dist/_hooks/ClickOutside.js.map +1 -1
  135. package/dist/_hooks/I18n.d.ts +2 -0
  136. package/dist/_locales/en.json +1 -0
  137. package/dist/_locales/pseudo.json +1 -0
  138. package/dist/_storyHelpers_/components/Deprecation.styles.js +1 -1
  139. package/dist/_storyHelpers_/components/StoryGrid.js +3 -3
  140. package/dist/_typedoc/AnchorNavigation/AnchorNavigation.types.json +4 -4
  141. package/dist/_typedoc/Avatar/Avatar.types.json +20 -20
  142. package/dist/_typedoc/AvatarStack/AvatarStack.types.json +25 -25
  143. package/dist/_typedoc/Badge/Badge.types.json +6 -6
  144. package/dist/_typedoc/Banner/Banner.types.json +15 -15
  145. package/dist/_typedoc/Box/Box.types.json +68 -68
  146. package/dist/_typedoc/Breadcrumbs/Breadcrumbs.types.json +10 -10
  147. package/dist/_typedoc/Button/Button.types.json +14 -14
  148. package/dist/_typedoc/Calendar/Calendar.types.json +80 -80
  149. package/dist/_typedoc/Card/Card.types.json +6 -6
  150. package/dist/_typedoc/Checkbox/Checkbox.types.json +8 -8
  151. package/dist/_typedoc/ContactItem/ContactItem.types.json +9 -9
  152. package/dist/_typedoc/DateInput/DateInput.types.json +35 -35
  153. package/dist/_typedoc/DateSelect/DateSelect.types.json +23 -13
  154. package/dist/_typedoc/DetailPage/DetailPage.types.json +5 -5
  155. package/dist/_typedoc/Dropdown/Dropdown.types.json +38 -38
  156. package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +31 -31
  157. package/dist/_typedoc/Dropzone/Dropzone.types.json +44 -44
  158. package/dist/_typedoc/EmptyState/EmptyState.types.json +18 -18
  159. package/dist/_typedoc/FileList/FileList.types.json +9 -9
  160. package/dist/_typedoc/FileSelect/FileSelect.types.json +27 -27
  161. package/dist/_typedoc/FileSelect/GridSource/GridSource.types.json +20 -20
  162. package/dist/_typedoc/FileSelect/LocalSource/LocalSource.types.json +14 -14
  163. package/dist/_typedoc/FileSelect/TreeSource/TreeSource.types.json +9 -9
  164. package/dist/_typedoc/Flex/Flex.types.json +27 -27
  165. package/dist/_typedoc/FlexList/FlexList.types.json +30 -30
  166. package/dist/_typedoc/Form/Form.types.json +780 -760
  167. package/dist/_typedoc/GhostPlaceholder/GhostPlaceholder.types.json +12 -12
  168. package/dist/_typedoc/Grid/Grid.types.json +8 -8
  169. package/dist/_typedoc/GroupSelect/GroupSelect.types.json +54 -54
  170. package/dist/_typedoc/Input/Input.types.json +2 -2
  171. package/dist/_typedoc/Link/Link.types.json +1 -1
  172. package/dist/_typedoc/ListPage/ListPage.types.json +13 -13
  173. package/dist/_typedoc/Menu/Menu.types.json +62 -62
  174. package/dist/_typedoc/MenuImperative/MenuImperative.types.json +84 -84
  175. package/dist/_typedoc/Modal/Modal.types.json +48 -48
  176. package/dist/_typedoc/MultiSelect/MultiSelect.types.json +33 -33
  177. package/dist/_typedoc/NextTile/NextTile.types.json +42 -32
  178. package/dist/_typedoc/Notation/Notation.types.json +4 -4
  179. package/dist/_typedoc/NumberInput/NumberInput.types.json +48 -48
  180. package/dist/_typedoc/OverlayTrigger/OverlayTrigger.types.json +33 -33
  181. package/dist/_typedoc/PageLayout/PageLayout.types.json +28 -28
  182. package/dist/_typedoc/Pagination/Pagination.types.json +7 -7
  183. package/dist/_typedoc/Panel/Panel.types.json +28 -28
  184. package/dist/_typedoc/Pill/Pill.types.json +2 -2
  185. package/dist/_typedoc/PillSelect/PillSelect.types.json +49 -49
  186. package/dist/_typedoc/Popover/Popover.types.json +15 -15
  187. package/dist/_typedoc/ProgressBar/ProgressBar.types.json +7 -7
  188. package/dist/_typedoc/RadioButton/RadioButton.types.json +6 -6
  189. package/dist/_typedoc/Required/Required.types.json +5 -5
  190. package/dist/_typedoc/Search/Search.types.json +18 -18
  191. package/dist/_typedoc/Section/Section.types.json +15 -15
  192. package/dist/_typedoc/SegmentedController/SegmentedController.types.json +21 -21
  193. package/dist/_typedoc/Select/Select.types.json +67 -67
  194. package/dist/_typedoc/SettingsPage/SettingsPage.types.json +10 -10
  195. package/dist/_typedoc/Slider/Slider.types.json +6 -6
  196. package/dist/_typedoc/Spinner/Spinner.types.json +9 -9
  197. package/dist/_typedoc/SplitViewCard/SplitViewCard.types.json +14 -14
  198. package/dist/_typedoc/Table/Table.types.json +114 -104
  199. package/dist/_typedoc/Tabs/Tabs.types.json +21 -21
  200. package/dist/_typedoc/Tearsheet/Tearsheet.types.json +17 -17
  201. package/dist/_typedoc/TextArea/TextArea.types.json +3 -3
  202. package/dist/_typedoc/TextEditor/TextEditor.types.json +11 -11
  203. package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +4 -4
  204. package/dist/_typedoc/Thumbnail/Thumbnail.types.json +23 -23
  205. package/dist/_typedoc/TieredDropdown/TieredDropdown.types.json +43 -43
  206. package/dist/_typedoc/TieredSelect/TieredSelect.types.json +29 -29
  207. package/dist/_typedoc/Tile/Tile.types.json +8 -8
  208. package/dist/_typedoc/Title/Title.types.json +1 -1
  209. package/dist/_typedoc/Toast/Toast.types.json +4 -4
  210. package/dist/_typedoc/ToggleButton/ToggleButton.types.json +4 -4
  211. package/dist/_typedoc/Token/Token.types.json +7 -7
  212. package/dist/_typedoc/ToolHeader/ToolHeader.types.json +10 -10
  213. package/dist/_typedoc/ToolLandingPage/ToolLandingPage.types.json +8 -8
  214. package/dist/_typedoc/Tooltip/Tooltip.types.json +15 -15
  215. package/dist/_typedoc/Tree/Tree.types.json +88 -88
  216. package/dist/_typedoc/Typeahead/Typeahead.types.json +2 -2
  217. package/dist/_typedoc/Typography/Typography.types.json +9 -9
  218. package/dist/_typedoc/_utils/types.json +3 -3
  219. package/dist/_typedoc/a11y-tips.json +1 -1
  220. package/dist/index.d.ts +1 -0
  221. package/dist/index.js +1 -0
  222. package/dist/index.js.map +1 -1
  223. package/package.json +16 -16
@@ -1 +1 @@
1
- {"version":3,"file":"Thumbnail.types.js","names":[],"sources":["../../src/Thumbnail/Thumbnail.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { ReactNode } from 'react'\nimport type { Polymorphic } from '../_utils/polymorphic'\nimport type { AriaLabelled, Props } from '../_utils/types'\nimport type { ThumbnailDocumentIconVariant } from './ThumbnailDocumentIcon'\n\nexport type SizeVariant = 'sm' | 'lg'\n\nexport type LayoutVariant = 'row' | 'column'\n\nexport interface QaTags {\n /**\n * @since 10.19.0\n */\n caption?: string\n}\n\n/**\n * @since 11.6.0\n */\nexport type ThumbnailRoleType = 'checkbox' | 'figure'\n\nexport type ThumbnailRoles = ThumbnailRoleType | undefined\n\nexport interface ThumbnailPolyMap\n extends Record<ThumbnailRoleType, React.ElementType> {\n figure: 'figure'\n checkbox: 'input'\n}\n\n/**\n * @since 11.6.0\n */\nexport type ThumbnailRef<Role extends ThumbnailRoles = undefined> =\n Role extends ThumbnailRoleType\n ? Polymorphic.Ref<ThumbnailPolyMap, Role>\n : React.ComponentPropsWithRef<'div'>['ref']\n\nexport interface BaseThumbnailProps extends Props {\n /**\n * Alt text for the Thumbnail image\n * @since 11.6.0\n */\n alt?: string\n\n /**\n * An image URL or a `File` to generate a preview for\n * @since 10.19.0\n */\n src?: File | string | null\n\n /**\n * Thumbnail size\n * @default 'lg'\n * @since 10.19.0\n */\n size?: SizeVariant\n\n /**\n * Use \"focused\" view\n * @default false\n * @since 10.19.0\n */\n focused?: boolean\n\n /**\n * Use \"selected\" view\n * @default false\n * @since 10.19.0\n */\n selected?: boolean\n\n /**\n * Use \"disabled\" view\n * @default false\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 10.19.0\n */\n clickable?: boolean\n\n /**\n * Thumbnail caption\n * @default ''\n * @since 10.19.0\n */\n caption?: string\n\n /**\n * Show placeholder for caption if it is empty\n * @default false\n * @since 10.19.0\n */\n hasCaptionPlaceholder?: boolean\n\n /**\n * Unless variant is provided, filename is used\n * to choose a placeholder icon based on extension.\n * E.g. for 'filename=\"panda.png\"', image variant will be used\n * @since 11.7.0\n * */\n filename?: string\n\n /**\n * @since 11.7.0\n */\n variant?: ThumbnailDocumentIconVariant\n\n /**\n * Thumbnail label\n * @default ''\n * @since 10.19.0\n */\n label?: string\n\n /**\n * @since 11.6.0\n */\n tabIndex?: number\n\n /**\n * @since 10.19.0\n */\n qa?: QaTags\n\n /**\n * @since 11.6.0\n */\n onClick?: (e: React.MouseEvent) => void\n}\n\ntype DecorativeThumbnailProps<Role extends ThumbnailRoles = undefined> = {\n role?: Role\n} & BaseThumbnailProps\n\nexport type ThumbnailProps<Role extends ThumbnailRoles = undefined> =\n Role extends 'figure'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'figure',\n never,\n BaseThumbnailProps\n >\n : Role extends 'checkbox'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'checkbox',\n never,\n BaseThumbnailProps & {\n /** onChange from React Aria is fired before onClick */\n onChange?: (isSelected: boolean) => void\n }\n >\n : DecorativeThumbnailProps & { ref?: ThumbnailRef<undefined> }\n\nexport interface FilePreviewProps {\n /**\n * @since 10.19.0\n */\n file: File\n}\nexport interface BasePlaceholderProps extends Omit<BaseThumbnailProps, 'src'> {}\n\ntype DecorativePlaceholderProps<Role extends ThumbnailRoles = undefined> = {\n role?: Role\n} & BasePlaceholderProps\n\nexport type PlaceholderProps<Role extends ThumbnailRoles = undefined> =\n Role extends 'figure'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'figure',\n never,\n AriaLabelled<BasePlaceholderProps>\n >\n : Role extends 'checkbox'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'checkbox',\n never,\n AriaLabelled<BasePlaceholderProps> & {\n /** onChange from React Aria is fired before onClick */\n onChange?: (isSelected: boolean) => void\n }\n >\n : DecorativePlaceholderProps & { ref?: ThumbnailRef<undefined> }\n\nexport interface MultilineCaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n disabled: boolean\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n error: boolean\n /**\n * @since 10.19.0\n */\n layout: 'row' | 'column'\n /**\n * @since 10.19.0\n */\n qa: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n}\n\nexport interface SinglelineCaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n disabled: boolean\n /**\n * @since 10.19.0\n */\n error: boolean\n /**\n * @since 10.19.0\n */\n layout: 'row' | 'column'\n /**\n * @since 10.19.0\n */\n qa: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n}\n\nexport interface CaptionTooltipProps {\n /**\n * @since 10.19.0\n */\n overlay: string\n /**\n * @since 10.19.0\n */\n isVisible: boolean\n /**\n * @since 10.19.0\n */\n children: ReactNode\n}\n\nexport interface CaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n layout: LayoutVariant\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean\n /**\n * @since 10.19.0\n */\n hasCaptionPlaceholder: boolean\n /**\n * @since 10.19.0\n */\n multiline: boolean\n /**\n * @since 10.19.0\n */\n qa?: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n}\n\nexport interface LabelProps {\n /**\n * @since 11.6.0\n */\n id?: string\n /**\n * @since 10.19.0\n */\n label: string\n /**\n * @since 10.19.0\n */\n disabled: boolean\n}\n\nexport interface TickIconProps {\n /**\n * @since 10.19.0\n */\n size: SizeVariant\n /**\n * @since 10.19.0\n */\n selected: boolean\n}\n"],"mappings":""}
1
+ {"version":3,"file":"Thumbnail.types.js","names":[],"sources":["../../src/Thumbnail/Thumbnail.types.ts"],"sourcesContent":["import type React from 'react'\nimport type { ReactNode } from 'react'\nimport type { Polymorphic } from '../_utils/polymorphic'\nimport type { AriaLabelled, Props } from '../_utils/types'\nimport type { ThumbnailDocumentIconVariant } from './ThumbnailDocumentIcon'\n\nexport type SizeVariant = 'sm' | 'lg'\n\nexport type LayoutVariant = 'row' | 'column'\n\nexport interface QaTags {\n /**\n * @since 10.19.0\n */\n caption?: string\n}\n\n/**\n * @since 11.6.0\n */\nexport type ThumbnailRoleType = 'checkbox' | 'figure'\n\nexport type ThumbnailRoles = ThumbnailRoleType | undefined\n\nexport interface ThumbnailPolyMap\n extends Record<ThumbnailRoleType, React.ElementType> {\n figure: 'figure'\n checkbox: 'input'\n}\n\n/**\n * @since 11.6.0\n */\nexport type ThumbnailRef<Role extends ThumbnailRoles = undefined> =\n Role extends ThumbnailRoleType\n ? Polymorphic.Ref<ThumbnailPolyMap, Role>\n : React.ComponentPropsWithRef<'div'>['ref']\n\nexport interface BaseThumbnailProps extends Props {\n /**\n * Alt text for the Thumbnail image\n * @since 11.6.0\n */\n alt?: string\n\n /**\n * An image URL or a `File` to generate a preview for\n * @since 10.19.0\n */\n src?: File | string | null\n\n /**\n * Thumbnail size\n * @default 'lg'\n * @since 10.19.0\n */\n size?: SizeVariant\n\n /**\n * Use \"focused\" view\n * @default false\n * @since 10.19.0\n */\n focused?: boolean\n\n /**\n * Use \"selected\" view\n * @default false\n * @since 10.19.0\n */\n selected?: boolean\n\n /**\n * Use \"disabled\" view\n * @default false\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * When true, Thumbnail shows the default error label.\n * When a string is provided, it is shown as custom error text.\n * @since 10.19.0\n */\n error?: boolean | string\n /**\n * @since 10.19.0\n */\n clickable?: boolean\n\n /**\n * Thumbnail caption\n * @default ''\n * @since 10.19.0\n */\n caption?: string\n\n /**\n * Show placeholder for caption if it is empty\n * @default false\n * @since 10.19.0\n */\n hasCaptionPlaceholder?: boolean\n\n /**\n * Unless variant is provided, filename is used\n * to choose a placeholder icon based on extension.\n * E.g. for 'filename=\"panda.png\"', image variant will be used\n * @since 11.7.0\n * */\n filename?: string\n\n /**\n * @since 11.7.0\n */\n variant?: ThumbnailDocumentIconVariant\n\n /**\n * Thumbnail label\n * @default ''\n * @since 10.19.0\n */\n label?: string\n\n /**\n * @since 11.6.0\n */\n tabIndex?: number\n\n /**\n * @since 10.19.0\n */\n qa?: QaTags\n\n /**\n * @since 11.6.0\n */\n onClick?: (e: React.MouseEvent) => void\n}\n\ntype DecorativeThumbnailProps<Role extends ThumbnailRoles = undefined> = {\n role?: Role\n} & BaseThumbnailProps\n\nexport type ThumbnailProps<Role extends ThumbnailRoles = undefined> =\n Role extends 'figure'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'figure',\n never,\n BaseThumbnailProps\n >\n : Role extends 'checkbox'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'checkbox',\n never,\n BaseThumbnailProps & {\n /** onChange from React Aria is fired before onClick */\n onChange?: (isSelected: boolean) => void\n }\n >\n : DecorativeThumbnailProps & { ref?: ThumbnailRef<undefined> }\n\nexport interface FilePreviewProps {\n /**\n * @since 10.19.0\n */\n file: File\n}\nexport interface BasePlaceholderProps extends Omit<BaseThumbnailProps, 'src'> {}\n\ntype DecorativePlaceholderProps<Role extends ThumbnailRoles = undefined> = {\n role?: Role\n} & BasePlaceholderProps\n\nexport type PlaceholderProps<Role extends ThumbnailRoles = undefined> =\n Role extends 'figure'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'figure',\n never,\n AriaLabelled<BasePlaceholderProps>\n >\n : Role extends 'checkbox'\n ? Polymorphic.ComponentPropsWithRef<\n ThumbnailPolyMap,\n 'checkbox',\n never,\n AriaLabelled<BasePlaceholderProps> & {\n /** onChange from React Aria is fired before onClick */\n onChange?: (isSelected: boolean) => void\n }\n >\n : DecorativePlaceholderProps & { ref?: ThumbnailRef<undefined> }\n\nexport interface MultilineCaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n disabled: boolean\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n layout: 'row' | 'column'\n /**\n * @since 10.19.0\n */\n qa: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n /**\n * When true, the caption is shown in the error stack (with the error row) and omits standalone caption margins.\n */\n error?: boolean\n}\n\nexport interface SinglelineCaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n disabled: boolean\n /**\n * @since 10.19.0\n */\n layout: 'row' | 'column'\n /**\n * @since 10.19.0\n */\n qa: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n /**\n * When true, the caption is shown in the error stack (with the error row) and omits standalone caption margins.\n */\n error?: boolean\n}\n\nexport interface CaptionTooltipProps {\n /**\n * @since 10.19.0\n */\n overlay: string\n /**\n * @since 10.19.0\n */\n isVisible: boolean\n /**\n * @since 10.19.0\n */\n children: ReactNode\n}\n\nexport interface CaptionProps {\n /**\n * When true, hides this caption subtree from assistive technology (e.g. checkbox Thumbnail).\n */\n ariaHidden?: boolean\n /**\n * @since 10.19.0\n */\n layout: LayoutVariant\n /**\n * @since 10.19.0\n */\n caption: string\n /**\n * @since 10.19.0\n */\n disabled?: boolean\n /**\n * @since 10.19.0\n */\n error?: boolean | string\n /**\n * @since 10.19.0\n */\n hasCaptionPlaceholder: boolean\n /**\n * @since 10.19.0\n */\n multiline: boolean\n /**\n * @since 10.19.0\n */\n qa?: string\n /**\n * Called when the caption overflow state changes (e.g. when it becomes truncated).\n */\n onCaptionOverflowChange?: (isOverflowing: boolean) => void\n}\n\nexport interface LabelProps {\n /**\n * @since 11.6.0\n */\n id?: string\n /**\n * @since 10.19.0\n */\n label: string\n /**\n * @since 10.19.0\n */\n disabled: boolean\n}\n\nexport interface TickIconProps {\n /**\n * @since 10.19.0\n */\n size: SizeVariant\n /**\n * @since 10.19.0\n */\n selected: boolean\n}\n"],"mappings":""}
@@ -2,4 +2,5 @@ import type { I18njs } from '@procore/core-i18n-js';
2
2
  import type { ThumbnailDocumentIconVariant } from './ThumbnailDocumentIcon';
3
3
  export declare function getIsFilePreviewableAsImage(src: File | string | null | undefined): boolean;
4
4
  export declare function getThumbnailVariantForFilename(filename: string): ThumbnailDocumentIconVariant;
5
+ export declare function resolveThumbnailErrorLabel(i18n: I18njs, error?: boolean | string): string;
5
6
  export declare function getThumbnailAriaLabel(i18n: I18njs, label?: string, caption?: string): string | undefined;
@@ -49,6 +49,13 @@ export function getThumbnailVariantForFilename(filename) {
49
49
  return defaultUnknownName;
50
50
  }
51
51
  }
52
+ export function resolveThumbnailErrorLabel(i18n, error) {
53
+ var trimmed = typeof error === 'string' ? error.trim() : undefined;
54
+ if (trimmed) {
55
+ return trimmed;
56
+ }
57
+ return i18n.t('core.thumbnail.error');
58
+ }
52
59
  export function getThumbnailAriaLabel(i18n, label, caption) {
53
60
  var parts = [];
54
61
  if (label) parts.push("".concat(i18n.t('core.thumbnail.aria-label.label'), ": ").concat(label));
@@ -1 +1 @@
1
- {"version":3,"file":"Thumbnail.utils.js","names":["getFileExtension","getIsFilePreviewableAsImage","src","File","type","startsWith","extensions","_defineProperty","image","drawing","email","gantt","zip","xml","word","ini","mov","pdf","powerpoint","excel","extensionsByVariant","Object","entries","variantByExtension","reduce","acc","_ref","_ref2","_slicedToArray","exts","forEach","ext","getThumbnailVariantForFilename","filename","defaultUnknownName","_unused","getThumbnailAriaLabel","i18n","label","caption","parts","push","concat","t","length","join","undefined"],"sources":["../../src/Thumbnail/Thumbnail.utils.ts"],"sourcesContent":["import type { I18njs } from '@procore/core-i18n-js'\nimport { getFileExtension } from '../_utils/filename'\nimport type { ThumbnailDocumentIconVariant } from './ThumbnailDocumentIcon'\n\nexport function getIsFilePreviewableAsImage(\n src: File | string | null | undefined\n) {\n return (\n src instanceof File &&\n src.type.startsWith('image/') &&\n // not allow previewing vendor image mime types, such as \"image/vnd.adobe.photoshop\"\n !src.type.startsWith('image/vnd.') &&\n // not allow previewing .tiff images, as a not browser-compatible format\n src.type !== 'image/tiff'\n )\n}\n\nconst extensions: { [k in ThumbnailDocumentIconVariant]?: string[] } = {\n image: ['png', 'jpg', 'jpeg', 'gif', 'psd', 'tiff', 'tif', 'bmp'],\n drawing: ['cad', 'dwg', 'dwf', 'dwfx'],\n email: ['msg', 'eml'],\n gantt: ['mpp', 'p6', 'xer'],\n zip: ['zip', 'rar', '7zip'],\n xml: ['rtf', 'txt'],\n word: ['doc', 'docx'],\n ini: ['ini', 'xml', 'exe'],\n mov: ['mov', 'avi'],\n pdf: ['pdf'],\n powerpoint: ['ppt', 'pptx'],\n excel: ['csv', 'xls', 'xlsx'],\n ['3d']: [\n 'stl',\n 'obj',\n 'ma',\n 'fbx',\n 'dae',\n '3ds',\n 'iges',\n 'step',\n 'wrl',\n 'rvt',\n 'ifc',\n 'nwc',\n 'nwd',\n 'nwf',\n ],\n unknown: [],\n}\n\nconst extensionsByVariant = Object.entries(extensions) as [\n ThumbnailDocumentIconVariant,\n string[]\n][]\n\nconst variantByExtension = extensionsByVariant.reduce((acc, [type, exts]) => {\n exts.forEach((ext) => {\n acc[ext] = type\n })\n return acc\n}, {} as Record<string, ThumbnailDocumentIconVariant>)\n\nexport function getThumbnailVariantForFilename(\n filename: string\n): ThumbnailDocumentIconVariant {\n const defaultUnknownName = 'unknown'\n\n try {\n const ext = getFileExtension(filename)\n return ext\n ? variantByExtension[ext] || defaultUnknownName\n : defaultUnknownName\n } catch {\n return defaultUnknownName\n }\n}\n\nexport function getThumbnailAriaLabel(\n i18n: I18njs,\n label?: string,\n caption?: string\n): string | undefined {\n const parts: string[] = []\n if (label)\n parts.push(`${i18n.t('core.thumbnail.aria-label.label')}: ${label}`)\n if (caption)\n parts.push(`${i18n.t('core.thumbnail.aria-label.caption')}: ${caption}`)\n return parts.length > 0 ? parts.join('. ') : undefined\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"Thumbnail.utils.js","names":["getFileExtension","getIsFilePreviewableAsImage","src","File","type","startsWith","extensions","_defineProperty","image","drawing","email","gantt","zip","xml","word","ini","mov","pdf","powerpoint","excel","extensionsByVariant","Object","entries","variantByExtension","reduce","acc","_ref","_ref2","_slicedToArray","exts","forEach","ext","getThumbnailVariantForFilename","filename","defaultUnknownName","_unused","resolveThumbnailErrorLabel","i18n","error","trimmed","trim","undefined","t","getThumbnailAriaLabel","label","caption","parts","push","concat","length","join"],"sources":["../../src/Thumbnail/Thumbnail.utils.ts"],"sourcesContent":["import type { I18njs } from '@procore/core-i18n-js'\nimport { getFileExtension } from '../_utils/filename'\nimport type { ThumbnailDocumentIconVariant } from './ThumbnailDocumentIcon'\n\nexport function getIsFilePreviewableAsImage(\n src: File | string | null | undefined\n) {\n return (\n src instanceof File &&\n src.type.startsWith('image/') &&\n // not allow previewing vendor image mime types, such as \"image/vnd.adobe.photoshop\"\n !src.type.startsWith('image/vnd.') &&\n // not allow previewing .tiff images, as a not browser-compatible format\n src.type !== 'image/tiff'\n )\n}\n\nconst extensions: { [k in ThumbnailDocumentIconVariant]?: string[] } = {\n image: ['png', 'jpg', 'jpeg', 'gif', 'psd', 'tiff', 'tif', 'bmp'],\n drawing: ['cad', 'dwg', 'dwf', 'dwfx'],\n email: ['msg', 'eml'],\n gantt: ['mpp', 'p6', 'xer'],\n zip: ['zip', 'rar', '7zip'],\n xml: ['rtf', 'txt'],\n word: ['doc', 'docx'],\n ini: ['ini', 'xml', 'exe'],\n mov: ['mov', 'avi'],\n pdf: ['pdf'],\n powerpoint: ['ppt', 'pptx'],\n excel: ['csv', 'xls', 'xlsx'],\n ['3d']: [\n 'stl',\n 'obj',\n 'ma',\n 'fbx',\n 'dae',\n '3ds',\n 'iges',\n 'step',\n 'wrl',\n 'rvt',\n 'ifc',\n 'nwc',\n 'nwd',\n 'nwf',\n ],\n unknown: [],\n}\n\nconst extensionsByVariant = Object.entries(extensions) as [\n ThumbnailDocumentIconVariant,\n string[]\n][]\n\nconst variantByExtension = extensionsByVariant.reduce((acc, [type, exts]) => {\n exts.forEach((ext) => {\n acc[ext] = type\n })\n return acc\n}, {} as Record<string, ThumbnailDocumentIconVariant>)\n\nexport function getThumbnailVariantForFilename(\n filename: string\n): ThumbnailDocumentIconVariant {\n const defaultUnknownName = 'unknown'\n\n try {\n const ext = getFileExtension(filename)\n return ext\n ? variantByExtension[ext] || defaultUnknownName\n : defaultUnknownName\n } catch {\n return defaultUnknownName\n }\n}\n\nexport function resolveThumbnailErrorLabel(\n i18n: I18njs,\n error?: boolean | string\n): string {\n const trimmed = typeof error === 'string' ? error.trim() : undefined\n if (trimmed) {\n return trimmed\n }\n return i18n.t('core.thumbnail.error')\n}\n\nexport function getThumbnailAriaLabel(\n i18n: I18njs,\n label?: string,\n caption?: string\n): string | undefined {\n const parts: string[] = []\n if (label)\n parts.push(`${i18n.t('core.thumbnail.aria-label.label')}: ${label}`)\n if (caption)\n parts.push(`${i18n.t('core.thumbnail.aria-label.caption')}: ${caption}`)\n return parts.length > 0 ? parts.join('. ') : undefined\n}\n"],"mappings":"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"}
@@ -1,22 +1,37 @@
1
- var _excluded = ["ariaHidden", "disabled", "caption", "error", "layout", "qa", "onCaptionOverflowChange"],
2
- _excluded2 = ["ariaHidden", "caption", "error", "disabled", "layout", "qa", "onCaptionOverflowChange"],
1
+ var _excluded = ["ariaHidden", "disabled", "caption", "layout", "qa", "onCaptionOverflowChange", "error"],
2
+ _excluded2 = ["ariaHidden", "caption", "disabled", "layout", "qa", "onCaptionOverflowChange", "error"],
3
3
  _excluded3 = ["ariaHidden", "layout", "disabled", "error", "caption", "hasCaptionPlaceholder", "multiline", "qa"];
4
4
  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); }
5
5
  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; }
6
6
  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; }
7
+ import { Error as ErrorIcon } from '@procore/core-icons';
7
8
  import React, { useEffect } from 'react';
9
+ import { useI18nContext } from '../_hooks/I18n';
8
10
  import { useOverflowObserver } from '../_hooks/OverflowObserver';
11
+ import { colors } from '../_styles/colors';
9
12
  import { parseFilename } from '../_utils/filename';
10
- import { StyledCaptionText, StyledMultilineCaption, StyledPlaceholderCaption, StyledSingleLineCaption, StyledSinglelineCaptionBody, StyledSinglelineCaptionEnding } from './Thumbnail.styles';
11
- function MultilineCaption(_ref) {
12
- var ariaHidden = _ref.ariaHidden,
13
- disabled = _ref.disabled,
14
- caption = _ref.caption,
15
- error = _ref.error,
16
- layout = _ref.layout,
17
- qa = _ref.qa,
18
- onCaptionOverflowChange = _ref.onCaptionOverflowChange,
19
- props = _objectWithoutProperties(_ref, _excluded);
13
+ import { StyledCaptionText, StyledMultilineCaption, StyledPlaceholderCaption, StyledSingleLineCaption, StyledSinglelineCaptionBody, StyledSinglelineCaptionEnding, StyledThumbnailCaptionStack, StyledThumbnailErrorIcon, StyledThumbnailErrorRow, StyledThumbnailErrorText } from './Thumbnail.styles';
14
+ import { resolveThumbnailErrorLabel } from './Thumbnail.utils';
15
+ function ThumbnailErrorRow(_ref) {
16
+ var label = _ref.label;
17
+ return /*#__PURE__*/React.createElement(StyledThumbnailErrorRow, null, /*#__PURE__*/React.createElement(StyledThumbnailErrorIcon, {
18
+ "aria-hidden": true
19
+ }, /*#__PURE__*/React.createElement(ErrorIcon, {
20
+ size: "sm",
21
+ style: {
22
+ color: colors.red50
23
+ }
24
+ })), /*#__PURE__*/React.createElement(StyledThumbnailErrorText, null, label));
25
+ }
26
+ function MultilineCaption(_ref2) {
27
+ var ariaHidden = _ref2.ariaHidden,
28
+ disabled = _ref2.disabled,
29
+ caption = _ref2.caption,
30
+ layout = _ref2.layout,
31
+ qa = _ref2.qa,
32
+ onCaptionOverflowChange = _ref2.onCaptionOverflowChange,
33
+ error = _ref2.error,
34
+ props = _objectWithoutProperties(_ref2, _excluded);
20
35
  var _useOverflowObserver = useOverflowObserver(),
21
36
  ref = _useOverflowObserver.ref,
22
37
  isOverflowing = _useOverflowObserver.isOverflowing;
@@ -29,19 +44,19 @@ function MultilineCaption(_ref) {
29
44
  }, /*#__PURE__*/React.createElement(StyledMultilineCaption, _extends({
30
45
  ref: ref,
31
46
  $disabled: disabled,
32
- $error: error,
33
- $layout: layout
47
+ $layout: layout,
48
+ $error: Boolean(error)
34
49
  }, props), /*#__PURE__*/React.createElement(StyledCaptionText, null, caption)));
35
50
  }
36
- function SinglelineCaption(_ref2) {
37
- var ariaHidden = _ref2.ariaHidden,
38
- caption = _ref2.caption,
39
- error = _ref2.error,
40
- disabled = _ref2.disabled,
41
- layout = _ref2.layout,
42
- qa = _ref2.qa,
43
- onCaptionOverflowChange = _ref2.onCaptionOverflowChange,
44
- props = _objectWithoutProperties(_ref2, _excluded2);
51
+ function SinglelineCaption(_ref3) {
52
+ var ariaHidden = _ref3.ariaHidden,
53
+ caption = _ref3.caption,
54
+ disabled = _ref3.disabled,
55
+ layout = _ref3.layout,
56
+ qa = _ref3.qa,
57
+ onCaptionOverflowChange = _ref3.onCaptionOverflowChange,
58
+ error = _ref3.error,
59
+ props = _objectWithoutProperties(_ref3, _excluded2);
45
60
  var _useOverflowObserver2 = useOverflowObserver(),
46
61
  ref = _useOverflowObserver2.ref,
47
62
  isOverflowing = _useOverflowObserver2.isOverflowing;
@@ -54,34 +69,66 @@ function SinglelineCaption(_ref2) {
54
69
  }, [isOverflowing, onCaptionOverflowChange]);
55
70
  return /*#__PURE__*/React.createElement(StyledSingleLineCaption, _extends({
56
71
  "aria-hidden": ariaHidden ? true : undefined,
57
- $error: error,
58
72
  $disabled: disabled,
59
73
  $layout: layout,
74
+ $error: Boolean(error),
60
75
  "data-qa": qa
61
76
  }, props), /*#__PURE__*/React.createElement(StyledSinglelineCaptionBody, {
62
77
  ref: ref
63
78
  }, isFilename ? "".concat(filename, ".") : caption), isFilename && /*#__PURE__*/React.createElement(StyledSinglelineCaptionEnding, null, extension));
64
79
  }
65
- export function ThumbnailCaption(_ref3) {
66
- var ariaHidden = _ref3.ariaHidden,
67
- layout = _ref3.layout,
68
- _ref3$disabled = _ref3.disabled,
69
- disabled = _ref3$disabled === void 0 ? false : _ref3$disabled,
70
- _ref3$error = _ref3.error,
71
- error = _ref3$error === void 0 ? false : _ref3$error,
72
- caption = _ref3.caption,
73
- hasCaptionPlaceholder = _ref3.hasCaptionPlaceholder,
74
- multiline = _ref3.multiline,
75
- _ref3$qa = _ref3.qa,
76
- qa = _ref3$qa === void 0 ? '' : _ref3$qa,
77
- props = _objectWithoutProperties(_ref3, _excluded3);
80
+ export function ThumbnailCaption(_ref4) {
81
+ var ariaHidden = _ref4.ariaHidden,
82
+ layout = _ref4.layout,
83
+ _ref4$disabled = _ref4.disabled,
84
+ disabled = _ref4$disabled === void 0 ? false : _ref4$disabled,
85
+ _ref4$error = _ref4.error,
86
+ error = _ref4$error === void 0 ? false : _ref4$error,
87
+ caption = _ref4.caption,
88
+ hasCaptionPlaceholder = _ref4.hasCaptionPlaceholder,
89
+ multiline = _ref4.multiline,
90
+ _ref4$qa = _ref4.qa,
91
+ qa = _ref4$qa === void 0 ? '' : _ref4$qa,
92
+ props = _objectWithoutProperties(_ref4, _excluded3);
93
+ var i18n = useI18nContext();
94
+ if (error) {
95
+ var resolvedErrorLabel = resolveThumbnailErrorLabel(i18n, error);
96
+ var errorRow = /*#__PURE__*/React.createElement(ThumbnailErrorRow, {
97
+ label: resolvedErrorLabel
98
+ });
99
+ if (!caption) {
100
+ return /*#__PURE__*/React.createElement(StyledThumbnailCaptionStack, {
101
+ $layout: layout,
102
+ "data-qa": qa
103
+ }, errorRow);
104
+ }
105
+ return /*#__PURE__*/React.createElement(StyledThumbnailCaptionStack, {
106
+ $layout: layout,
107
+ "data-qa": qa
108
+ }, multiline ? /*#__PURE__*/React.createElement(MultilineCaption, _extends({
109
+ ariaHidden: ariaHidden,
110
+ disabled: disabled,
111
+ caption: caption,
112
+ layout: layout,
113
+ qa: qa,
114
+ error: true,
115
+ onCaptionOverflowChange: props.onCaptionOverflowChange
116
+ }, props)) : /*#__PURE__*/React.createElement(SinglelineCaption, _extends({
117
+ ariaHidden: ariaHidden,
118
+ caption: caption,
119
+ disabled: disabled,
120
+ layout: layout,
121
+ qa: qa,
122
+ error: true,
123
+ onCaptionOverflowChange: props.onCaptionOverflowChange
124
+ }, props)), errorRow);
125
+ }
78
126
  if (!caption) {
79
127
  var captionPlaceholder = hasCaptionPlaceholder && '- -';
80
128
  if (captionPlaceholder) {
81
129
  return /*#__PURE__*/React.createElement(StyledPlaceholderCaption, {
82
130
  "aria-hidden": ariaHidden ? true : undefined,
83
131
  $disabled: disabled,
84
- $error: error,
85
132
  $layout: layout,
86
133
  "data-qa": qa
87
134
  }, /*#__PURE__*/React.createElement(StyledCaptionText, null, captionPlaceholder));
@@ -93,7 +140,6 @@ export function ThumbnailCaption(_ref3) {
93
140
  ariaHidden: ariaHidden,
94
141
  disabled: disabled,
95
142
  caption: caption,
96
- error: error,
97
143
  layout: layout,
98
144
  qa: qa,
99
145
  onCaptionOverflowChange: props.onCaptionOverflowChange
@@ -103,7 +149,6 @@ export function ThumbnailCaption(_ref3) {
103
149
  ariaHidden: ariaHidden,
104
150
  caption: caption,
105
151
  disabled: disabled,
106
- error: error,
107
152
  layout: layout,
108
153
  qa: qa,
109
154
  onCaptionOverflowChange: props.onCaptionOverflowChange
@@ -1 +1 @@
1
- {"version":3,"file":"ThumbnailCaption.js","names":["React","useEffect","useOverflowObserver","parseFilename","StyledCaptionText","StyledMultilineCaption","StyledPlaceholderCaption","StyledSingleLineCaption","StyledSinglelineCaptionBody","StyledSinglelineCaptionEnding","MultilineCaption","_ref","ariaHidden","disabled","caption","error","layout","qa","onCaptionOverflowChange","props","_objectWithoutProperties","_excluded","_useOverflowObserver","ref","isOverflowing","createElement","undefined","_extends","$disabled","$error","$layout","SinglelineCaption","_ref2","_excluded2","_useOverflowObserver2","_parseFilename","filename","extension","isFilename","concat","ThumbnailCaption","_ref3","_ref3$disabled","_ref3$error","hasCaptionPlaceholder","multiline","_ref3$qa","_excluded3","captionPlaceholder"],"sources":["../../src/Thumbnail/ThumbnailCaption.tsx"],"sourcesContent":["import React, { useEffect } from 'react'\nimport { useOverflowObserver } from '../_hooks/OverflowObserver'\nimport { parseFilename } from '../_utils/filename'\nimport type { Props } from '../_utils/types'\nimport {\n StyledCaptionText,\n StyledMultilineCaption,\n StyledPlaceholderCaption,\n StyledSingleLineCaption,\n StyledSinglelineCaptionBody,\n StyledSinglelineCaptionEnding,\n} from './Thumbnail.styles'\nimport type {\n CaptionProps,\n MultilineCaptionProps,\n SinglelineCaptionProps,\n} from './Thumbnail.types'\n\nfunction MultilineCaption({\n ariaHidden,\n disabled,\n caption,\n error,\n layout,\n qa,\n onCaptionOverflowChange,\n ...props\n}: MultilineCaptionProps & Props) {\n const { ref, isOverflowing } = useOverflowObserver()\n\n useEffect(() => {\n onCaptionOverflowChange?.(isOverflowing)\n }, [isOverflowing, onCaptionOverflowChange])\n\n return (\n <span data-qa={qa} aria-hidden={ariaHidden ? true : undefined}>\n <StyledMultilineCaption\n ref={ref}\n $disabled={disabled}\n $error={error}\n $layout={layout}\n {...props}\n >\n <StyledCaptionText>{caption}</StyledCaptionText>\n </StyledMultilineCaption>\n </span>\n )\n}\n\nfunction SinglelineCaption({\n ariaHidden,\n caption,\n error,\n disabled,\n layout,\n qa,\n onCaptionOverflowChange,\n ...props\n}: SinglelineCaptionProps & Props) {\n const { ref, isOverflowing } = useOverflowObserver()\n const { filename, extension, isFilename } = parseFilename(caption)\n\n useEffect(() => {\n onCaptionOverflowChange?.(isOverflowing)\n }, [isOverflowing, onCaptionOverflowChange])\n\n return (\n <StyledSingleLineCaption\n aria-hidden={ariaHidden ? true : undefined}\n $error={error}\n $disabled={disabled}\n $layout={layout}\n data-qa={qa}\n {...props}\n >\n <StyledSinglelineCaptionBody ref={ref}>\n {isFilename ? `${filename}.` : caption}\n </StyledSinglelineCaptionBody>\n {isFilename && (\n <StyledSinglelineCaptionEnding>\n {extension}\n </StyledSinglelineCaptionEnding>\n )}\n </StyledSingleLineCaption>\n )\n}\n\nexport function ThumbnailCaption({\n ariaHidden,\n layout,\n disabled = false,\n error = false,\n caption,\n hasCaptionPlaceholder,\n multiline,\n qa = '',\n ...props\n}: CaptionProps) {\n if (!caption) {\n const captionPlaceholder = hasCaptionPlaceholder && '- -'\n\n if (captionPlaceholder) {\n return (\n <StyledPlaceholderCaption\n aria-hidden={ariaHidden ? true : undefined}\n $disabled={disabled}\n $error={error}\n $layout={layout}\n data-qa={qa}\n >\n <StyledCaptionText>{captionPlaceholder}</StyledCaptionText>\n </StyledPlaceholderCaption>\n )\n }\n\n return null\n }\n\n if (multiline) {\n return (\n <MultilineCaption\n ariaHidden={ariaHidden}\n disabled={disabled}\n caption={caption}\n error={error}\n layout={layout}\n qa={qa}\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n )\n }\n\n return (\n <SinglelineCaption\n ariaHidden={ariaHidden}\n caption={caption}\n disabled={disabled}\n error={error}\n layout={layout}\n qa={qa}\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n )\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"ThumbnailCaption.js","names":["Error","ErrorIcon","React","useEffect","useI18nContext","useOverflowObserver","colors","parseFilename","StyledCaptionText","StyledMultilineCaption","StyledPlaceholderCaption","StyledSingleLineCaption","StyledSinglelineCaptionBody","StyledSinglelineCaptionEnding","StyledThumbnailCaptionStack","StyledThumbnailErrorIcon","StyledThumbnailErrorRow","StyledThumbnailErrorText","resolveThumbnailErrorLabel","ThumbnailErrorRow","_ref","label","createElement","size","style","color","red50","MultilineCaption","_ref2","ariaHidden","disabled","caption","layout","qa","onCaptionOverflowChange","error","props","_objectWithoutProperties","_excluded","_useOverflowObserver","ref","isOverflowing","undefined","_extends","$disabled","$layout","$error","Boolean","SinglelineCaption","_ref3","_excluded2","_useOverflowObserver2","_parseFilename","filename","extension","isFilename","concat","ThumbnailCaption","_ref4","_ref4$disabled","_ref4$error","hasCaptionPlaceholder","multiline","_ref4$qa","_excluded3","i18n","resolvedErrorLabel","errorRow","captionPlaceholder"],"sources":["../../src/Thumbnail/ThumbnailCaption.tsx"],"sourcesContent":["import { Error as ErrorIcon } from '@procore/core-icons'\nimport React, { useEffect } from 'react'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useOverflowObserver } from '../_hooks/OverflowObserver'\nimport { colors } from '../_styles/colors'\nimport { parseFilename } from '../_utils/filename'\nimport type { Props } from '../_utils/types'\nimport {\n StyledCaptionText,\n StyledMultilineCaption,\n StyledPlaceholderCaption,\n StyledSingleLineCaption,\n StyledSinglelineCaptionBody,\n StyledSinglelineCaptionEnding,\n StyledThumbnailCaptionStack,\n StyledThumbnailErrorIcon,\n StyledThumbnailErrorRow,\n StyledThumbnailErrorText,\n} from './Thumbnail.styles'\nimport type {\n CaptionProps,\n MultilineCaptionProps,\n SinglelineCaptionProps,\n} from './Thumbnail.types'\nimport { resolveThumbnailErrorLabel } from './Thumbnail.utils'\n\nfunction ThumbnailErrorRow({ label }: { label: string }) {\n return (\n <StyledThumbnailErrorRow>\n <StyledThumbnailErrorIcon aria-hidden>\n <ErrorIcon size=\"sm\" style={{ color: colors.red50 }} />\n </StyledThumbnailErrorIcon>\n <StyledThumbnailErrorText>{label}</StyledThumbnailErrorText>\n </StyledThumbnailErrorRow>\n )\n}\n\nfunction MultilineCaption({\n ariaHidden,\n disabled,\n caption,\n layout,\n qa,\n onCaptionOverflowChange,\n error,\n ...props\n}: MultilineCaptionProps & Props) {\n const { ref, isOverflowing } = useOverflowObserver()\n\n useEffect(() => {\n onCaptionOverflowChange?.(isOverflowing)\n }, [isOverflowing, onCaptionOverflowChange])\n\n return (\n <span data-qa={qa} aria-hidden={ariaHidden ? true : undefined}>\n <StyledMultilineCaption\n ref={ref}\n $disabled={disabled}\n $layout={layout}\n $error={Boolean(error)}\n {...props}\n >\n <StyledCaptionText>{caption}</StyledCaptionText>\n </StyledMultilineCaption>\n </span>\n )\n}\n\nfunction SinglelineCaption({\n ariaHidden,\n caption,\n disabled,\n layout,\n qa,\n onCaptionOverflowChange,\n error,\n ...props\n}: SinglelineCaptionProps & Props) {\n const { ref, isOverflowing } = useOverflowObserver()\n const { filename, extension, isFilename } = parseFilename(caption)\n\n useEffect(() => {\n onCaptionOverflowChange?.(isOverflowing)\n }, [isOverflowing, onCaptionOverflowChange])\n\n return (\n <StyledSingleLineCaption\n aria-hidden={ariaHidden ? true : undefined}\n $disabled={disabled}\n $layout={layout}\n $error={Boolean(error)}\n data-qa={qa}\n {...props}\n >\n <StyledSinglelineCaptionBody ref={ref}>\n {isFilename ? `${filename}.` : caption}\n </StyledSinglelineCaptionBody>\n {isFilename && (\n <StyledSinglelineCaptionEnding>\n {extension}\n </StyledSinglelineCaptionEnding>\n )}\n </StyledSingleLineCaption>\n )\n}\n\nexport function ThumbnailCaption({\n ariaHidden,\n layout,\n disabled = false,\n error = false,\n caption,\n hasCaptionPlaceholder,\n multiline,\n qa = '',\n ...props\n}: CaptionProps) {\n const i18n = useI18nContext()\n\n if (error) {\n const resolvedErrorLabel = resolveThumbnailErrorLabel(i18n, error)\n const errorRow = <ThumbnailErrorRow label={resolvedErrorLabel} />\n\n if (!caption) {\n return (\n <StyledThumbnailCaptionStack $layout={layout} data-qa={qa}>\n {errorRow}\n </StyledThumbnailCaptionStack>\n )\n }\n\n return (\n <StyledThumbnailCaptionStack $layout={layout} data-qa={qa}>\n {multiline ? (\n <MultilineCaption\n ariaHidden={ariaHidden}\n disabled={disabled}\n caption={caption}\n layout={layout}\n qa={qa}\n error\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n ) : (\n <SinglelineCaption\n ariaHidden={ariaHidden}\n caption={caption}\n disabled={disabled}\n layout={layout}\n qa={qa}\n error\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n )}\n {errorRow}\n </StyledThumbnailCaptionStack>\n )\n }\n\n if (!caption) {\n const captionPlaceholder = hasCaptionPlaceholder && '- -'\n\n if (captionPlaceholder) {\n return (\n <StyledPlaceholderCaption\n aria-hidden={ariaHidden ? true : undefined}\n $disabled={disabled}\n $layout={layout}\n data-qa={qa}\n >\n <StyledCaptionText>{captionPlaceholder}</StyledCaptionText>\n </StyledPlaceholderCaption>\n )\n }\n\n return null\n }\n\n if (multiline) {\n return (\n <MultilineCaption\n ariaHidden={ariaHidden}\n disabled={disabled}\n caption={caption}\n layout={layout}\n qa={qa}\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n )\n }\n\n return (\n <SinglelineCaption\n ariaHidden={ariaHidden}\n caption={caption}\n disabled={disabled}\n layout={layout}\n qa={qa}\n onCaptionOverflowChange={props.onCaptionOverflowChange}\n {...props}\n />\n )\n}\n"],"mappings":";;;;;;AAAA,SAASA,KAAK,IAAIC,SAAS,QAAQ,qBAAqB;AACxD,OAAOC,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,SAASC,cAAc,QAAQ,gBAAgB;AAC/C,SAASC,mBAAmB,QAAQ,4BAA4B;AAChE,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,aAAa,QAAQ,oBAAoB;AAElD,SACEC,iBAAiB,EACjBC,sBAAsB,EACtBC,wBAAwB,EACxBC,uBAAuB,EACvBC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,2BAA2B,EAC3BC,wBAAwB,EACxBC,uBAAuB,EACvBC,wBAAwB,QACnB,oBAAoB;AAM3B,SAASC,0BAA0B,QAAQ,mBAAmB;AAE9D,SAASC,iBAAiBA,CAAAC,IAAA,EAA+B;EAAA,IAA5BC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAChC,oBACEnB,KAAA,CAAAoB,aAAA,CAACN,uBAAuB,qBACtBd,KAAA,CAAAoB,aAAA,CAACP,wBAAwB;IAAC;EAAW,gBACnCb,KAAA,CAAAoB,aAAA,CAACrB,SAAS;IAACsB,IAAI,EAAC,IAAI;IAACC,KAAK,EAAE;MAAEC,KAAK,EAAEnB,MAAM,CAACoB;IAAM;EAAE,CAAE,CAC9B,CAAC,eAC3BxB,KAAA,CAAAoB,aAAA,CAACL,wBAAwB,QAAEI,KAAgC,CACpC,CAAC;AAE9B;AAEA,SAASM,gBAAgBA,CAAAC,KAAA,EASS;EAAA,IARhCC,UAAU,GAAAD,KAAA,CAAVC,UAAU;IACVC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IACRC,OAAO,GAAAH,KAAA,CAAPG,OAAO;IACPC,MAAM,GAAAJ,KAAA,CAANI,MAAM;IACNC,EAAE,GAAAL,KAAA,CAAFK,EAAE;IACFC,uBAAuB,GAAAN,KAAA,CAAvBM,uBAAuB;IACvBC,KAAK,GAAAP,KAAA,CAALO,KAAK;IACFC,KAAK,GAAAC,wBAAA,CAAAT,KAAA,EAAAU,SAAA;EAER,IAAAC,oBAAA,GAA+BlC,mBAAmB,CAAC,CAAC;IAA5CmC,GAAG,GAAAD,oBAAA,CAAHC,GAAG;IAAEC,aAAa,GAAAF,oBAAA,CAAbE,aAAa;EAE1BtC,SAAS,CAAC,YAAM;IACd+B,uBAAuB,aAAvBA,uBAAuB,uBAAvBA,uBAAuB,CAAGO,aAAa,CAAC;EAC1C,CAAC,EAAE,CAACA,aAAa,EAAEP,uBAAuB,CAAC,CAAC;EAE5C,oBACEhC,KAAA,CAAAoB,aAAA;IAAM,WAASW,EAAG;IAAC,eAAaJ,UAAU,GAAG,IAAI,GAAGa;EAAU,gBAC5DxC,KAAA,CAAAoB,aAAA,CAACb,sBAAsB,EAAAkC,QAAA;IACrBH,GAAG,EAAEA,GAAI;IACTI,SAAS,EAAEd,QAAS;IACpBe,OAAO,EAAEb,MAAO;IAChBc,MAAM,EAAEC,OAAO,CAACZ,KAAK;EAAE,GACnBC,KAAK,gBAETlC,KAAA,CAAAoB,aAAA,CAACd,iBAAiB,QAAEuB,OAA2B,CACzB,CACpB,CAAC;AAEX;AAEA,SAASiB,iBAAiBA,CAAAC,KAAA,EASS;EAAA,IARjCpB,UAAU,GAAAoB,KAAA,CAAVpB,UAAU;IACVE,OAAO,GAAAkB,KAAA,CAAPlB,OAAO;IACPD,QAAQ,GAAAmB,KAAA,CAARnB,QAAQ;IACRE,MAAM,GAAAiB,KAAA,CAANjB,MAAM;IACNC,EAAE,GAAAgB,KAAA,CAAFhB,EAAE;IACFC,uBAAuB,GAAAe,KAAA,CAAvBf,uBAAuB;IACvBC,KAAK,GAAAc,KAAA,CAALd,KAAK;IACFC,KAAK,GAAAC,wBAAA,CAAAY,KAAA,EAAAC,UAAA;EAER,IAAAC,qBAAA,GAA+B9C,mBAAmB,CAAC,CAAC;IAA5CmC,GAAG,GAAAW,qBAAA,CAAHX,GAAG;IAAEC,aAAa,GAAAU,qBAAA,CAAbV,aAAa;EAC1B,IAAAW,cAAA,GAA4C7C,aAAa,CAACwB,OAAO,CAAC;IAA1DsB,QAAQ,GAAAD,cAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,cAAA,CAATE,SAAS;IAAEC,UAAU,GAAAH,cAAA,CAAVG,UAAU;EAEvCpD,SAAS,CAAC,YAAM;IACd+B,uBAAuB,aAAvBA,uBAAuB,uBAAvBA,uBAAuB,CAAGO,aAAa,CAAC;EAC1C,CAAC,EAAE,CAACA,aAAa,EAAEP,uBAAuB,CAAC,CAAC;EAE5C,oBACEhC,KAAA,CAAAoB,aAAA,CAACX,uBAAuB,EAAAgC,QAAA;IACtB,eAAad,UAAU,GAAG,IAAI,GAAGa,SAAU;IAC3CE,SAAS,EAAEd,QAAS;IACpBe,OAAO,EAAEb,MAAO;IAChBc,MAAM,EAAEC,OAAO,CAACZ,KAAK,CAAE;IACvB,WAASF;EAAG,GACRG,KAAK,gBAETlC,KAAA,CAAAoB,aAAA,CAACV,2BAA2B;IAAC4B,GAAG,EAAEA;EAAI,GACnCe,UAAU,MAAAC,MAAA,CAAMH,QAAQ,SAAMtB,OACJ,CAAC,EAC7BwB,UAAU,iBACTrD,KAAA,CAAAoB,aAAA,CAACT,6BAA6B,QAC3ByC,SAC4B,CAEV,CAAC;AAE9B;AAEA,OAAO,SAASG,gBAAgBA,CAAAC,KAAA,EAUf;EAAA,IATf7B,UAAU,GAAA6B,KAAA,CAAV7B,UAAU;IACVG,MAAM,GAAA0B,KAAA,CAAN1B,MAAM;IAAA2B,cAAA,GAAAD,KAAA,CACN5B,QAAQ;IAARA,QAAQ,GAAA6B,cAAA,cAAG,KAAK,GAAAA,cAAA;IAAAC,WAAA,GAAAF,KAAA,CAChBvB,KAAK;IAALA,KAAK,GAAAyB,WAAA,cAAG,KAAK,GAAAA,WAAA;IACb7B,OAAO,GAAA2B,KAAA,CAAP3B,OAAO;IACP8B,qBAAqB,GAAAH,KAAA,CAArBG,qBAAqB;IACrBC,SAAS,GAAAJ,KAAA,CAATI,SAAS;IAAAC,QAAA,GAAAL,KAAA,CACTzB,EAAE;IAAFA,EAAE,GAAA8B,QAAA,cAAG,EAAE,GAAAA,QAAA;IACJ3B,KAAK,GAAAC,wBAAA,CAAAqB,KAAA,EAAAM,UAAA;EAER,IAAMC,IAAI,GAAG7D,cAAc,CAAC,CAAC;EAE7B,IAAI+B,KAAK,EAAE;IACT,IAAM+B,kBAAkB,GAAGhD,0BAA0B,CAAC+C,IAAI,EAAE9B,KAAK,CAAC;IAClE,IAAMgC,QAAQ,gBAAGjE,KAAA,CAAAoB,aAAA,CAACH,iBAAiB;MAACE,KAAK,EAAE6C;IAAmB,CAAE,CAAC;IAEjE,IAAI,CAACnC,OAAO,EAAE;MACZ,oBACE7B,KAAA,CAAAoB,aAAA,CAACR,2BAA2B;QAAC+B,OAAO,EAAEb,MAAO;QAAC,WAASC;MAAG,GACvDkC,QAC0B,CAAC;IAElC;IAEA,oBACEjE,KAAA,CAAAoB,aAAA,CAACR,2BAA2B;MAAC+B,OAAO,EAAEb,MAAO;MAAC,WAASC;IAAG,GACvD6B,SAAS,gBACR5D,KAAA,CAAAoB,aAAA,CAACK,gBAAgB,EAAAgB,QAAA;MACfd,UAAU,EAAEA,UAAW;MACvBC,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA,OAAQ;MACjBC,MAAM,EAAEA,MAAO;MACfC,EAAE,EAAEA,EAAG;MACPE,KAAK;MACLD,uBAAuB,EAAEE,KAAK,CAACF;IAAwB,GACnDE,KAAK,CACV,CAAC,gBAEFlC,KAAA,CAAAoB,aAAA,CAAC0B,iBAAiB,EAAAL,QAAA;MAChBd,UAAU,EAAEA,UAAW;MACvBE,OAAO,EAAEA,OAAQ;MACjBD,QAAQ,EAAEA,QAAS;MACnBE,MAAM,EAAEA,MAAO;MACfC,EAAE,EAAEA,EAAG;MACPE,KAAK;MACLD,uBAAuB,EAAEE,KAAK,CAACF;IAAwB,GACnDE,KAAK,CACV,CACF,EACA+B,QAC0B,CAAC;EAElC;EAEA,IAAI,CAACpC,OAAO,EAAE;IACZ,IAAMqC,kBAAkB,GAAGP,qBAAqB,IAAI,KAAK;IAEzD,IAAIO,kBAAkB,EAAE;MACtB,oBACElE,KAAA,CAAAoB,aAAA,CAACZ,wBAAwB;QACvB,eAAamB,UAAU,GAAG,IAAI,GAAGa,SAAU;QAC3CE,SAAS,EAAEd,QAAS;QACpBe,OAAO,EAAEb,MAAO;QAChB,WAASC;MAAG,gBAEZ/B,KAAA,CAAAoB,aAAA,CAACd,iBAAiB,QAAE4D,kBAAsC,CAClC,CAAC;IAE/B;IAEA,OAAO,IAAI;EACb;EAEA,IAAIN,SAAS,EAAE;IACb,oBACE5D,KAAA,CAAAoB,aAAA,CAACK,gBAAgB,EAAAgB,QAAA;MACfd,UAAU,EAAEA,UAAW;MACvBC,QAAQ,EAAEA,QAAS;MACnBC,OAAO,EAAEA,OAAQ;MACjBC,MAAM,EAAEA,MAAO;MACfC,EAAE,EAAEA,EAAG;MACPC,uBAAuB,EAAEE,KAAK,CAACF;IAAwB,GACnDE,KAAK,CACV,CAAC;EAEN;EAEA,oBACElC,KAAA,CAAAoB,aAAA,CAAC0B,iBAAiB,EAAAL,QAAA;IAChBd,UAAU,EAAEA,UAAW;IACvBE,OAAO,EAAEA,OAAQ;IACjBD,QAAQ,EAAEA,QAAS;IACnBE,MAAM,EAAEA,MAAO;IACfC,EAAE,EAAEA,EAAG;IACPC,uBAAuB,EAAEE,KAAK,CAACF;EAAwB,GACnDE,KAAK,CACV,CAAC;AAEN"}
@@ -7,31 +7,31 @@ import { getEllipsis } from '../_styles/mixins';
7
7
  import { spacing } from '../_styles/spacing';
8
8
  export var StyledCheckbox = /*#__PURE__*/styled(Checkbox).withConfig({
9
9
  displayName: "StyledCheckbox",
10
- componentId: "core-12_47_1__sc-1inrbm9-0"
10
+ componentId: "core-12_48_0__sc-1inrbm9-0"
11
11
  })(["input{z-index:2;}"]);
12
12
  export var StyledGroupCell = /*#__PURE__*/styled.div.withConfig({
13
13
  displayName: "StyledGroupCell",
14
- componentId: "core-12_47_1__sc-1inrbm9-1"
14
+ componentId: "core-12_48_0__sc-1inrbm9-1"
15
15
  })(["display:flex;align-items:flex-end;padding-bottom:", "px;"], spacing.md);
16
16
  export var StyledThumbnail = /*#__PURE__*/styled(Thumbnail).withConfig({
17
17
  displayName: "StyledThumbnail",
18
- componentId: "core-12_47_1__sc-1inrbm9-2"
18
+ componentId: "core-12_48_0__sc-1inrbm9-2"
19
19
  })(["display:inline-flex;&:focus{outline:none;}"]);
20
20
  // VariableSizeGrid has provided width and height as inline style, so to make it flexible and support responsive !important was added
21
21
  export var StyledVariableSizeGrid = /*#__PURE__*/styled(VariableSizeGrid).withConfig({
22
22
  displayName: "StyledVariableSizeGrid",
23
- componentId: "core-12_47_1__sc-1inrbm9-3"
23
+ componentId: "core-12_48_0__sc-1inrbm9-3"
24
24
  })(["height:100% !important;& > div{width:100% !important;}"]);
25
25
  export var StyledGroupTitle = /*#__PURE__*/styled(Typography).withConfig({
26
26
  displayName: "StyledGroupTitle",
27
- componentId: "core-12_47_1__sc-1inrbm9-4"
27
+ componentId: "core-12_48_0__sc-1inrbm9-4"
28
28
  })(["", ""], getEllipsis);
29
29
  export var StyledSpinnerWrapper = /*#__PURE__*/styled.div.withConfig({
30
30
  displayName: "StyledSpinnerWrapper",
31
- componentId: "core-12_47_1__sc-1inrbm9-5"
31
+ componentId: "core-12_48_0__sc-1inrbm9-5"
32
32
  })(["display:flex;justify-content:center;align-items:center;width:100%;height:100%;"]);
33
33
  export var StyledThumbnailGrid = /*#__PURE__*/styled.div.withConfig({
34
34
  displayName: "StyledThumbnailGrid",
35
- componentId: "core-12_47_1__sc-1inrbm9-6"
35
+ componentId: "core-12_48_0__sc-1inrbm9-6"
36
36
  })(["display:flex;flex-wrap:wrap;outline:none;"]);
37
37
  //# sourceMappingURL=ThumbnailGrid.styles.js.map
@@ -9,19 +9,19 @@ import { colors } from '../_styles/colors';
9
9
  import { spacing } from '../_styles/spacing';
10
10
  export var StyledTieredSelect = /*#__PURE__*/styled(MenuImperative).withConfig({
11
11
  displayName: "StyledTieredSelect",
12
- componentId: "core-12_47_1__sc-e1ql06-0"
12
+ componentId: "core-12_48_0__sc-e1ql06-0"
13
13
  })(["align-items:stretch;max-height:40vh;"]);
14
14
  export var StyledTieredSelectIcon = /*#__PURE__*/styled(Flex).withConfig({
15
15
  displayName: "StyledTieredSelectIcon",
16
- componentId: "core-12_47_1__sc-e1ql06-1"
16
+ componentId: "core-12_48_0__sc-e1ql06-1"
17
17
  })(["height:24px;width:24px;"]);
18
18
  export var StyledTieredSelectArrowButton = /*#__PURE__*/styled(Button).withConfig({
19
19
  displayName: "StyledTieredSelectArrowButton",
20
- componentId: "core-12_47_1__sc-e1ql06-2"
20
+ componentId: "core-12_48_0__sc-e1ql06-2"
21
21
  })(["border:1px solid transparent;"]);
22
22
  export var StyledTieredSelectBreadcrumbs = /*#__PURE__*/styled(Breadcrumbs).withConfig({
23
23
  displayName: "StyledTieredSelectBreadcrumbs",
24
- componentId: "core-12_47_1__sc-e1ql06-3"
24
+ componentId: "core-12_48_0__sc-e1ql06-3"
25
25
  })(["background-color:", ";flex-wrap:wrap;margin-top:", "px;max-height:68px;overflow-y:auto;padding:", "px ", "px;", ""], colors.gray96, spacing.sm, spacing.xs, spacing.md, function (_ref) {
26
26
  var $nonInteractive = _ref.$nonInteractive;
27
27
  if ($nonInteractive) {
@@ -30,22 +30,22 @@ export var StyledTieredSelectBreadcrumbs = /*#__PURE__*/styled(Breadcrumbs).with
30
30
  });
31
31
  export var StyledTieredSelectHome = /*#__PURE__*/styled(Flex).withConfig({
32
32
  displayName: "StyledTieredSelectHome",
33
- componentId: "core-12_47_1__sc-e1ql06-4"
33
+ componentId: "core-12_48_0__sc-e1ql06-4"
34
34
  })(["height:20px;"]);
35
35
  export var StyledTieredSelectOption = /*#__PURE__*/styled(MenuImperative.Item).withConfig({
36
36
  displayName: "StyledTieredSelectOption",
37
- componentId: "core-12_47_1__sc-e1ql06-5"
37
+ componentId: "core-12_48_0__sc-e1ql06-5"
38
38
  })(["align-items:center;display:flex;justify-content:space-between;padding:2px ", "px;"], spacing.lg);
39
39
  export var StyledTieredSelectLoadingMore = /*#__PURE__*/styled(Flex).withConfig({
40
40
  displayName: "StyledTieredSelectLoadingMore",
41
- componentId: "core-12_47_1__sc-e1ql06-6"
41
+ componentId: "core-12_48_0__sc-e1ql06-6"
42
42
  })(["align-items:center;justify-content:center;padding:", "px ", "px 0px ", "px;"], spacing.xs, spacing.lg, spacing.lg);
43
43
  export var StyledTieredSelectOverlay = /*#__PURE__*/styled(Card).withConfig({
44
44
  displayName: "StyledTieredSelectOverlay",
45
- componentId: "core-12_47_1__sc-e1ql06-7"
45
+ componentId: "core-12_48_0__sc-e1ql06-7"
46
46
  })(["max-width:248px;min-width:inherit;"]);
47
47
  export var StyledTieredSelectSpinnerOverlay = /*#__PURE__*/styled(Spinner).withConfig({
48
48
  displayName: "StyledTieredSelectSpinnerOverlay",
49
- componentId: "core-12_47_1__sc-e1ql06-8"
49
+ componentId: "core-12_48_0__sc-e1ql06-8"
50
50
  })(["min-height:auto;"]);
51
51
  //# sourceMappingURL=TieredSelect.styles.js.map
@@ -44,7 +44,7 @@ var getTileStyles = function getTileStyles(_ref) {
44
44
  };
45
45
  export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
46
46
  displayName: "StyledLinkTile",
47
- componentId: "core-12_47_1__sc-8q9p0n-0"
47
+ componentId: "core-12_48_0__sc-8q9p0n-0"
48
48
  })(["", " text-decoration:none;color:inherit;"], function (_ref2) {
49
49
  var $orientation = _ref2.$orientation;
50
50
  return getTileStyles({
@@ -54,7 +54,7 @@ export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
54
54
  });
55
55
  export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
56
56
  displayName: "StyledSelectableTile",
57
- componentId: "core-12_47_1__sc-8q9p0n-1"
57
+ componentId: "core-12_48_0__sc-8q9p0n-1"
58
58
  })(["", ""], function (_ref3) {
59
59
  var $orientation = _ref3.$orientation,
60
60
  $selected = _ref3.$selected,
@@ -72,7 +72,7 @@ export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
72
72
  });
73
73
  export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
74
74
  displayName: "StyledInteractableTile",
75
- componentId: "core-12_47_1__sc-8q9p0n-2"
75
+ componentId: "core-12_48_0__sc-8q9p0n-2"
76
76
  })(["", ""], function (_ref4) {
77
77
  var $orientation = _ref4.$orientation;
78
78
  return getTileStyles({
@@ -81,28 +81,28 @@ export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
81
81
  });
82
82
  export var StyledFooter = /*#__PURE__*/styled.div.withConfig({
83
83
  displayName: "StyledFooter",
84
- componentId: "core-12_47_1__sc-8q9p0n-3"
84
+ componentId: "core-12_48_0__sc-8q9p0n-3"
85
85
  })(["grid-area:footer;padding:", "px;> ", "{flex-wrap:wrap-reverse;}"], spacing.lg, StyledActions);
86
86
  export var StyledTileContent = /*#__PURE__*/styled(StyledContent).withConfig({
87
87
  displayName: "StyledTileContent",
88
- componentId: "core-12_47_1__sc-8q9p0n-4"
88
+ componentId: "core-12_48_0__sc-8q9p0n-4"
89
89
  })(["grid-column-start:hero-start;grid-column-end:body-end;padding:", "px;+ ", "{padding-top:0;}> ", ",> ", " > ", ",> ", "{grid-column-gap:", "px;}"], spacing.lg, StyledFooter, SFormRow, SForm, SFormRow, SFormRow, spacing.md);
90
90
  export var StyledHeroMedia = /*#__PURE__*/styled.figure.withConfig({
91
91
  displayName: "StyledHeroMedia",
92
- componentId: "core-12_47_1__sc-8q9p0n-5"
92
+ componentId: "core-12_48_0__sc-8q9p0n-5"
93
93
  })(["grid-area:hero;margin:0;position:relative;overflow:hidden;font-size:0;> *{font-size:initial;}+ ", "{grid-area:body;}> video{background-color:", ";}> img,> picture > img{object-fit:cover;}", ""], StyledTileContent, colors.black, function (_ref5) {
94
94
  var $orientation = _ref5.$orientation;
95
- return $orientation === 'landscape' && !isIE11() ? css(["border-top-left-radius:inherit;border-bottom-left-radius:inherit;> *,> picture > img{height:100%;width:100%;position:absolute;}@media ", "{> picture > img,> img{width:auto;left:50%;transform:translate(-50%,0);}}"], mediaIE11Hack) : css(["min-height:156px;max-height:567px;border-top-left-radius:inherit;border-top-right-radius:inherit;> *,> picture > img{min-height:inherit;max-height:inherit;height:auto;width:100%;}"]);
95
+ return $orientation === 'landscape' && !isIE11() ? css(["border-top-left-radius:calc(", "px - 1px);border-bottom-left-radius:calc(", "px - 1px);> *,> picture > img{border-bottom-left-radius:calc(", "px - 1px);border-top-left-radius:calc(", "px - 1px);height:100%;width:100%;position:absolute;}@media ", "{> picture > img,> img{width:auto;left:50%;transform:translate(-50%,0);}}"], borderRadius.md, borderRadius.md, borderRadius.md, borderRadius.md, mediaIE11Hack) : css(["min-height:156px;max-height:567px;border-top-left-radius:calc(", "px - 1px);border-top-right-radius:calc(", "px - 1px);> *,> picture > img{border-top-left-radius:calc(", "px - 1px);border-top-right-radius:calc(", "px - 1px);min-height:inherit;max-height:inherit;height:auto;width:100%;}"], borderRadius.md, borderRadius.md, borderRadius.md, borderRadius.md);
96
96
  });
97
97
  export var StyledHeroOverlay = /*#__PURE__*/styled.div.withConfig({
98
98
  displayName: "StyledHeroOverlay",
99
- componentId: "core-12_47_1__sc-8q9p0n-6"
99
+ componentId: "core-12_48_0__sc-8q9p0n-6"
100
100
  })(["position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;"]);
101
101
  export var StyledHeroText = /*#__PURE__*/styled.div.withConfig({
102
102
  displayName: "StyledHeroText",
103
- componentId: "core-12_47_1__sc-8q9p0n-7"
103
+ componentId: "core-12_48_0__sc-8q9p0n-7"
104
104
  })(["grid-area:hero;+ ", "{grid-area:body;}padding:", "px;border-radius:inherit;", ""], StyledTileContent, spacing.lg, function (_ref6) {
105
105
  var $orientation = _ref6.$orientation;
106
- return $orientation === 'landscape' ? css(["display:flex;flex-direction:column;justify-content:center;padding-right:0;"]) : css(["padding-bottom:0;"]);
106
+ return $orientation === 'landscape' ? css(["display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding-right:0;"]) : css(["padding-bottom:0;"]);
107
107
  });
108
108
  //# sourceMappingURL=Tile.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tile.styles.js","names":["styled","css","StyledActions","StyledContent","StyledForm","SForm","StyledFormRow","SFormRow","borderRadius","colors","mediaIE11Hack","getFocus","getShadow","spacing","isIE11","getHover","$selected","arguments","length","undefined","blue94","gray96","getSelected","blue98","getDisabled","oneThirdTwoThirds","getLandscapeTemplate","getPortraitTemplate","getLayoutCSS","orientation","getTileStyles","_ref","$orientation","_ref$$selected","_ref$$hoverable","$hoverable","_ref$$disabled","$disabled","_ref$$focused","$focused","_ref$$layoutless","$layoutless","white","md","StyledLinkTile","a","withConfig","displayName","componentId","_ref2","StyledSelectableTile","div","_ref3","StyledInteractableTile","_ref4","StyledFooter","lg","StyledTileContent","StyledHeroMedia","figure","black","_ref5","StyledHeroOverlay","StyledHeroText","_ref6"],"sources":["../../src/Tile/Tile.styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { StyledActions, StyledContent } from '../Content/Content.styles'\nimport {\n StyledForm as SForm,\n StyledFormRow as SFormRow,\n} from '../Form/Form.styles'\nimport { borderRadius } from '../_styles/borderRadius'\nimport { colors } from '../_styles/colors'\nimport { mediaIE11Hack } from '../_styles/media'\nimport { getFocus } from '../_styles/mixins'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\nimport { isIE11 } from '../_utils/isIE11'\nimport type { TileCommonProps } from './Tile.types'\n\ninterface StyledTile {\n $orientation: TileCommonProps['orientation']\n}\n\nconst getHover = ($selected = false) => css`\n cursor: pointer;\n &:hover,\n &.hover {\n background-color: ${$selected ? colors.blue94 : colors.gray96};\n }\n`\n\nconst getSelected = () => css`\n background-color: ${colors.blue98};\n`\n\nconst getDisabled = () => css`\n cursor: not-allowed;\n`\n\ninterface GetTileStylesProps {\n $orientation: TileCommonProps['orientation']\n $selected?: boolean\n $hoverable?: boolean\n $disabled?: boolean\n $focused?: boolean\n $layoutless?: boolean\n}\n\nconst oneThirdTwoThirds = 'minmax(0, 1fr) minmax(0, 2fr)'\n\nconst getLandscapeTemplate = () => {\n return css`\n --core-tile-grid-template-columns: ${oneThirdTwoThirds};\n grid-template-areas:\n 'hero body'\n 'hero footer';\n grid-template-columns: var(\n --core-tile-grid-template-columns,\n ${oneThirdTwoThirds}\n );\n `\n}\n\nconst getPortraitTemplate = () => {\n return css`\n grid-template-areas:\n 'hero'\n 'body'\n 'footer';\n grid-template-columns: 1fr;\n `\n}\n\nconst getLayoutCSS = (orientation: TileCommonProps['orientation']) => css`\n display: grid;\n ${orientation === 'landscape'\n ? getLandscapeTemplate()\n : getPortraitTemplate()};\n`\n\nconst getTileStyles = ({\n $orientation,\n $selected = false,\n $hoverable = false,\n $disabled = false,\n $focused = false,\n $layoutless = false,\n}: GetTileStylesProps) => {\n return css`\n ${!$layoutless && getLayoutCSS($orientation)}\n\n background-color: ${colors.white};\n border-radius: ${borderRadius.md}px;\n width: 100%;\n ${getShadow(1, 'bottom')}\n\n &:focus, &.focus {\n ${getFocus()}\n }\n ${$focused ? getFocus() : ''}\n\n ${$disabled ? getDisabled() : ''}\n ${$selected ? getSelected() : ''}\n ${$hoverable && !$disabled ? getHover($selected) : ''}\n `\n}\n\nexport const StyledLinkTile = styled.a<StyledTile>`\n ${({ $orientation }) => getTileStyles({ $orientation, $hoverable: true })}\n text-decoration: none;\n color: inherit;\n`\n\nexport const StyledSelectableTile = styled.div<\n StyledTile & {\n $selected: boolean\n $disabled?: boolean\n $focused?: boolean\n $layoutless?: boolean\n }\n>`\n ${({ $orientation, $selected, $disabled, $focused, $layoutless }) =>\n getTileStyles({\n $orientation,\n $selected,\n $disabled,\n $focused,\n $hoverable: true,\n $layoutless,\n })}\n`\n\nexport const StyledInteractableTile = styled.div<StyledTile>`\n ${({ $orientation }) => getTileStyles({ $orientation })}\n`\n\nexport const StyledFooter = styled.div`\n grid-area: footer;\n padding: ${spacing.lg}px;\n\n > ${StyledActions} {\n flex-wrap: wrap-reverse;\n }\n`\n\nexport const StyledTileContent = styled(StyledContent)`\n grid-column-start: hero-start;\n grid-column-end: body-end;\n padding: ${spacing.lg}px;\n\n + ${StyledFooter} {\n padding-top: 0;\n }\n\n > ${SFormRow}, > ${SForm} > ${SFormRow}, > ${SFormRow} {\n grid-column-gap: ${spacing.md}px;\n }\n`\n\nexport const StyledHeroMedia = styled.figure<{\n $orientation: TileCommonProps['orientation']\n}>`\n grid-area: hero;\n margin: 0;\n position: relative;\n overflow: hidden;\n\n font-size: 0;\n > * {\n font-size: initial;\n }\n\n + ${StyledTileContent} {\n grid-area: body;\n }\n\n > video {\n background-color: ${colors.black};\n }\n > img,\n > picture > img {\n object-fit: cover;\n }\n ${({ $orientation }) =>\n $orientation === 'landscape' && !isIE11()\n ? css`\n border-top-left-radius: inherit;\n border-bottom-left-radius: inherit;\n > *,\n > picture > img {\n height: 100%;\n width: 100%;\n position: absolute;\n }\n\n @media ${mediaIE11Hack} {\n > picture > img,\n > img {\n width: auto;\n left: 50%;\n transform: translate(-50%, 0);\n }\n }\n `\n : css`\n min-height: 156px;\n max-height: 567px;\n border-top-left-radius: inherit;\n border-top-right-radius: inherit;\n > *,\n > picture > img {\n min-height: inherit;\n max-height: inherit;\n height: auto;\n width: 100%;\n }\n `}\n`\n\nexport const StyledHeroOverlay = styled.div`\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 1;\n`\n\nexport const StyledHeroText = styled.div<{\n $orientation: TileCommonProps['orientation']\n}>`\n grid-area: hero;\n\n + ${StyledTileContent} {\n grid-area: body;\n }\n\n padding: ${spacing.lg}px;\n border-radius: inherit;\n ${({ $orientation }) =>\n $orientation === 'landscape'\n ? css`\n display: flex;\n flex-direction: column;\n justify-content: center;\n padding-right: 0;\n `\n : css`\n padding-bottom: 0;\n `}\n`\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tile.styles.js","names":["styled","css","StyledActions","StyledContent","StyledForm","SForm","StyledFormRow","SFormRow","borderRadius","colors","mediaIE11Hack","getFocus","getShadow","spacing","isIE11","getHover","$selected","arguments","length","undefined","blue94","gray96","getSelected","blue98","getDisabled","oneThirdTwoThirds","getLandscapeTemplate","getPortraitTemplate","getLayoutCSS","orientation","getTileStyles","_ref","$orientation","_ref$$selected","_ref$$hoverable","$hoverable","_ref$$disabled","$disabled","_ref$$focused","$focused","_ref$$layoutless","$layoutless","white","md","StyledLinkTile","a","withConfig","displayName","componentId","_ref2","StyledSelectableTile","div","_ref3","StyledInteractableTile","_ref4","StyledFooter","lg","StyledTileContent","StyledHeroMedia","figure","black","_ref5","StyledHeroOverlay","StyledHeroText","_ref6"],"sources":["../../src/Tile/Tile.styles.tsx"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { StyledActions, StyledContent } from '../Content/Content.styles'\nimport {\n StyledForm as SForm,\n StyledFormRow as SFormRow,\n} from '../Form/Form.styles'\nimport { borderRadius } from '../_styles/borderRadius'\nimport { colors } from '../_styles/colors'\nimport { mediaIE11Hack } from '../_styles/media'\nimport { getFocus } from '../_styles/mixins'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\nimport { isIE11 } from '../_utils/isIE11'\nimport type { TileCommonProps } from './Tile.types'\n\ninterface StyledTile {\n $orientation: TileCommonProps['orientation']\n}\n\nconst getHover = ($selected = false) => css`\n cursor: pointer;\n &:hover,\n &.hover {\n background-color: ${$selected ? colors.blue94 : colors.gray96};\n }\n`\n\nconst getSelected = () => css`\n background-color: ${colors.blue98};\n`\n\nconst getDisabled = () => css`\n cursor: not-allowed;\n`\n\ninterface GetTileStylesProps {\n $orientation: TileCommonProps['orientation']\n $selected?: boolean\n $hoverable?: boolean\n $disabled?: boolean\n $focused?: boolean\n $layoutless?: boolean\n}\n\nconst oneThirdTwoThirds = 'minmax(0, 1fr) minmax(0, 2fr)'\n\nconst getLandscapeTemplate = () => {\n return css`\n --core-tile-grid-template-columns: ${oneThirdTwoThirds};\n grid-template-areas:\n 'hero body'\n 'hero footer';\n grid-template-columns: var(\n --core-tile-grid-template-columns,\n ${oneThirdTwoThirds}\n );\n `\n}\n\nconst getPortraitTemplate = () => {\n return css`\n grid-template-areas:\n 'hero'\n 'body'\n 'footer';\n grid-template-columns: 1fr;\n `\n}\n\nconst getLayoutCSS = (orientation: TileCommonProps['orientation']) => css`\n display: grid;\n ${orientation === 'landscape'\n ? getLandscapeTemplate()\n : getPortraitTemplate()};\n`\n\nconst getTileStyles = ({\n $orientation,\n $selected = false,\n $hoverable = false,\n $disabled = false,\n $focused = false,\n $layoutless = false,\n}: GetTileStylesProps) => {\n return css`\n ${!$layoutless && getLayoutCSS($orientation)}\n\n background-color: ${colors.white};\n border-radius: ${borderRadius.md}px;\n width: 100%;\n ${getShadow(1, 'bottom')}\n\n &:focus, &.focus {\n ${getFocus()}\n }\n ${$focused ? getFocus() : ''}\n\n ${$disabled ? getDisabled() : ''}\n ${$selected ? getSelected() : ''}\n ${$hoverable && !$disabled ? getHover($selected) : ''}\n `\n}\n\nexport const StyledLinkTile = styled.a<StyledTile>`\n ${({ $orientation }) => getTileStyles({ $orientation, $hoverable: true })}\n text-decoration: none;\n color: inherit;\n`\n\nexport const StyledSelectableTile = styled.div<\n StyledTile & {\n $selected: boolean\n $disabled?: boolean\n $focused?: boolean\n $layoutless?: boolean\n }\n>`\n ${({ $orientation, $selected, $disabled, $focused, $layoutless }) =>\n getTileStyles({\n $orientation,\n $selected,\n $disabled,\n $focused,\n $hoverable: true,\n $layoutless,\n })}\n`\n\nexport const StyledInteractableTile = styled.div<StyledTile>`\n ${({ $orientation }) => getTileStyles({ $orientation })}\n`\n\nexport const StyledFooter = styled.div`\n grid-area: footer;\n padding: ${spacing.lg}px;\n\n > ${StyledActions} {\n flex-wrap: wrap-reverse;\n }\n`\n\nexport const StyledTileContent = styled(StyledContent)`\n grid-column-start: hero-start;\n grid-column-end: body-end;\n padding: ${spacing.lg}px;\n\n + ${StyledFooter} {\n padding-top: 0;\n }\n\n > ${SFormRow}, > ${SForm} > ${SFormRow}, > ${SFormRow} {\n grid-column-gap: ${spacing.md}px;\n }\n`\n\nexport const StyledHeroMedia = styled.figure<{\n $orientation: TileCommonProps['orientation']\n}>`\n grid-area: hero;\n margin: 0;\n position: relative;\n overflow: hidden;\n\n font-size: 0;\n > * {\n font-size: initial;\n }\n\n + ${StyledTileContent} {\n grid-area: body;\n }\n\n > video {\n background-color: ${colors.black};\n }\n > img,\n > picture > img {\n object-fit: cover;\n }\n ${({ $orientation }) =>\n $orientation === 'landscape' && !isIE11()\n ? css`\n border-top-left-radius: calc(${borderRadius.md}px - 1px);\n border-bottom-left-radius: calc(${borderRadius.md}px - 1px);\n > *,\n > picture > img {\n border-bottom-left-radius: calc(${borderRadius.md}px - 1px);\n border-top-left-radius: calc(${borderRadius.md}px - 1px);\n height: 100%;\n width: 100%;\n position: absolute;\n }\n\n @media ${mediaIE11Hack} {\n > picture > img,\n > img {\n width: auto;\n left: 50%;\n transform: translate(-50%, 0);\n }\n }\n `\n : css`\n min-height: 156px;\n max-height: 567px;\n border-top-left-radius: calc(${borderRadius.md}px - 1px);\n border-top-right-radius: calc(${borderRadius.md}px - 1px);\n > *,\n > picture > img {\n border-top-left-radius: calc(${borderRadius.md}px - 1px);\n border-top-right-radius: calc(${borderRadius.md}px - 1px);\n min-height: inherit;\n max-height: inherit;\n height: auto;\n width: 100%;\n }\n `}\n`\n\nexport const StyledHeroOverlay = styled.div`\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: 1;\n`\n\nexport const StyledHeroText = styled.div<{\n $orientation: TileCommonProps['orientation']\n}>`\n grid-area: hero;\n\n + ${StyledTileContent} {\n grid-area: body;\n }\n\n padding: ${spacing.lg}px;\n border-radius: inherit;\n ${({ $orientation }) =>\n $orientation === 'landscape'\n ? css`\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n justify-content: center;\n padding-right: 0;\n `\n : css`\n padding-bottom: 0;\n `}\n`\n"],"mappings":"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"}
@@ -5,36 +5,36 @@ import { Typography } from '../Typography/Typography';
5
5
  import { spacing } from '../_styles/spacing';
6
6
  export var StyledTitle = /*#__PURE__*/styled.div.withConfig({
7
7
  displayName: "StyledTitle",
8
- componentId: "core-12_47_1__sc-1t2ye1d-0"
8
+ componentId: "core-12_48_0__sc-1t2ye1d-0"
9
9
  })(["display:flex;align-items:flex-start;"]);
10
10
  export var StyledAssets = /*#__PURE__*/styled.div.withConfig({
11
11
  displayName: "StyledAssets",
12
- componentId: "core-12_47_1__sc-1t2ye1d-1"
12
+ componentId: "core-12_48_0__sc-1t2ye1d-1"
13
13
  })(["margin-right:", "px;", ""], spacing.md, function (_ref) {
14
14
  var alignment = _ref.alignment;
15
15
  return css(["align-self:", ";"], alignment);
16
16
  });
17
17
  export var StyledTitleContent = /*#__PURE__*/styled.div.withConfig({
18
18
  displayName: "StyledTitleContent",
19
- componentId: "core-12_47_1__sc-1t2ye1d-2"
19
+ componentId: "core-12_48_0__sc-1t2ye1d-2"
20
20
  })(["align-self:center;", ""], function (_ref2) {
21
21
  var $hasActions = _ref2.$hasActions;
22
22
  return $hasActions && css(["margin-right:", "px;"], spacing.lg);
23
23
  });
24
24
  export var StyledText = /*#__PURE__*/styled.span.withConfig({
25
25
  displayName: "StyledText",
26
- componentId: "core-12_47_1__sc-1t2ye1d-3"
26
+ componentId: "core-12_48_0__sc-1t2ye1d-3"
27
27
  })(["> h1,> h2,> h3{display:inline;}"]);
28
28
  export var StyledTitlePill = /*#__PURE__*/styled.span.withConfig({
29
29
  displayName: "StyledTitlePill",
30
- componentId: "core-12_47_1__sc-1t2ye1d-4"
30
+ componentId: "core-12_48_0__sc-1t2ye1d-4"
31
31
  })(["margin-left:", "px;", "{vertical-align:text-top;}"], spacing.sm, StyledPill);
32
32
  export var StyledTitleActions = /*#__PURE__*/styled(StyledActions).withConfig({
33
33
  displayName: "StyledTitleActions",
34
- componentId: "core-12_47_1__sc-1t2ye1d-5"
34
+ componentId: "core-12_48_0__sc-1t2ye1d-5"
35
35
  })(["margin-left:auto;"]);
36
36
  export var StyledSubtext = /*#__PURE__*/styled(Typography).withConfig({
37
37
  displayName: "StyledSubtext",
38
- componentId: "core-12_47_1__sc-1t2ye1d-6"
38
+ componentId: "core-12_48_0__sc-1t2ye1d-6"
39
39
  })(["display:block;margin-top:", "px;"], spacing.xs);
40
40
  //# sourceMappingURL=Title.styles.js.map
@@ -7,7 +7,7 @@ import { getShadow } from '../_styles/shadows';
7
7
  import { spacing } from '../_styles/spacing';
8
8
  export var StyledToast = /*#__PURE__*/styled.div.withConfig({
9
9
  displayName: "StyledToast",
10
- componentId: "core-12_47_1__sc-1l6lk2n-0"
10
+ componentId: "core-12_48_0__sc-1l6lk2n-0"
11
11
  })(["", " align-items:center;background-color:", ";border-radius:", "px;color:", ";display:flex;min-height:48px;padding:", "px ", "px;width:550px;"], getShadow(4, 'bottom'), function (_ref) {
12
12
  var $variant = _ref.$variant;
13
13
  return $variant === 'success' ? colors.green30 : colors.red50;
@@ -16,13 +16,13 @@ export var StyledToast = /*#__PURE__*/styled.div.withConfig({
16
16
  // $legacy is direct string inside Toast. Next is with subcomponents
17
17
  export var StyledToastText = /*#__PURE__*/styled.span.withConfig({
18
18
  displayName: "StyledToastText",
19
- componentId: "core-12_47_1__sc-1l6lk2n-1"
19
+ componentId: "core-12_48_0__sc-1l6lk2n-1"
20
20
  })(["", " font-weight:", ";overflow:hidden;", ""], getTypographyIntent('body'), typographyWeights.semibold, function (_ref2) {
21
21
  var $legacy = _ref2.$legacy;
22
22
  return $legacy ? "margin-left: ".concat(spacing.lg, "px;") : "padding: 0 ".concat(spacing.lg, "px;");
23
23
  });
24
24
  export var StyledToastButton = /*#__PURE__*/styled(Button).withConfig({
25
25
  displayName: "StyledToastButton",
26
- componentId: "core-12_47_1__sc-1l6lk2n-2"
26
+ componentId: "core-12_48_0__sc-1l6lk2n-2"
27
27
  })(["line-height:0;color:", ";padding:0;margin-left:auto;"], colors.white);
28
28
  //# sourceMappingURL=Toast.styles.js.map