@procore/core-react 12.17.2 → 12.17.4
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.
- package/dist/AnchorNavigation/AnchorNavigation.styles.js +3 -3
- package/dist/Avatar/Avatar.styles.js +5 -5
- package/dist/Avatar/Avatar.types.d.ts +1 -1
- package/dist/Avatar/Avatar.types.js.map +1 -1
- package/dist/AvatarStack/AvatarStack.js +7 -7
- package/dist/AvatarStack/AvatarStack.js.map +1 -1
- package/dist/AvatarStack/AvatarStack.styles.d.ts +4 -4
- package/dist/AvatarStack/AvatarStack.styles.js +10 -10
- package/dist/AvatarStack/AvatarStack.styles.js.map +1 -1
- package/dist/AvatarStack/AvatarStack.types.d.ts +2 -0
- package/dist/AvatarStack/AvatarStack.types.js.map +1 -1
- package/dist/Badge/Badge.styles.js +2 -2
- package/dist/Banner/Banner.styles.js +10 -10
- package/dist/Box/Box.styles.js +1 -1
- package/dist/Breadcrumbs/Breadcrumbs.styles.js +4 -4
- package/dist/Button/Button.styles.js +5 -5
- package/dist/Calendar/Calendar.styles.js +8 -8
- package/dist/Card/Card.styles.js +1 -1
- package/dist/Checkbox/Checkbox.styles.js +6 -6
- package/dist/Checkbox/CheckboxTooltip.js +1 -1
- package/dist/ContactItem/ContactItem.styles.js +5 -5
- package/dist/Content/Content.styles.js +2 -2
- package/dist/DateInput/DateInput.styles.js +6 -6
- package/dist/DetailPage/DetailPage.styles.js +7 -7
- package/dist/Dropdown/Dropdown.styles.js +3 -3
- package/dist/DropdownFlyout/DropdownFlyout.styles.js +4 -4
- package/dist/Dropzone/Dropzone.js +1 -1
- package/dist/Dropzone/Dropzone.styles.js +9 -9
- package/dist/EmptyState/EmptyState.styles.js +6 -6
- package/dist/Field/Field.styles.js +3 -3
- package/dist/FileList/FileList.styles.js +4 -4
- package/dist/FileSelect/FileExplorer/FileExplorer.styles.js +9 -9
- package/dist/FileSelect/FileExplorer/FileExplorerSidebar.styles.js +3 -3
- package/dist/FileSelect/FileSelect.styles.js +2 -2
- package/dist/FileSelect/FileSelectDropzone/FileSelectDropzone.styles.js +3 -3
- package/dist/FileSelect/FileTokenList/FileTokenList.styles.js +2 -2
- package/dist/FileSelect/GridSource/GridSource.styles.js +6 -6
- package/dist/FileSelect/LocalSource/LocalSource.styles.js +4 -4
- package/dist/FileSelect/SourceItem/SourceItem.styles.js +3 -3
- package/dist/FileSelect/ThumbnailList/ThumbnailList.styles.js +6 -6
- package/dist/FileSelect/TreeSource/TreeSource.styles.js +1 -1
- package/dist/FileToken/FileToken.styles.js +4 -4
- package/dist/FilterToken/FilterToken.styles.js +2 -2
- package/dist/FlexList/FlexList.styles.js +1 -1
- package/dist/Form/Form.styles.js +14 -14
- package/dist/Form/StyledFormikForm.styles.js +2 -2
- package/dist/GhostPlaceholder/GhostPlaceholder.styles.js +2 -2
- package/dist/Grid/Grid.styles.js +2 -2
- package/dist/GroupSelect/GroupSelect.styles.js +1 -1
- package/dist/Input/Input.styles.js +1 -1
- package/dist/Link/Link.styles.js +1 -1
- package/dist/Link/Link.types.d.ts +3 -0
- package/dist/Link/Link.types.js.map +1 -1
- package/dist/ListPage/ListPage.styles.js +8 -8
- package/dist/Loader/Loader.styles.js +2 -2
- package/dist/MenuImperative/MenuImperative.styles.js +10 -10
- package/dist/Modal/Modal.styles.js +13 -13
- package/dist/MultiSelect/MultiSelect.styles.js +6 -6
- package/dist/NextMenu/NextMenu.styles.js +3 -3
- package/dist/Notation/Notation.js +1 -1
- package/dist/NumberInput/NumberInput.styles.js +7 -7
- package/dist/Overlay/OverlayArrow.styles.js +1 -1
- package/dist/PageFooterTemplate/PageFooterTemplate.styles.js +1 -1
- package/dist/PageHeaderTemplate/PageHeaderTemplate.styles.js +3 -3
- package/dist/PageLayout/PageLayout.styles.js +16 -16
- package/dist/PagePaneTemplate/PagePaneTemplate.styles.js +2 -2
- package/dist/PageTemplate/PageTemplate.styles.js +3 -3
- package/dist/Pagination/Pagination.styles.js +5 -5
- package/dist/Panel/Panel.styles.js +11 -11
- package/dist/Pill/Pill.styles.js +2 -2
- package/dist/PillSelect/PillSelect.styles.js +4 -4
- package/dist/Popover/Popover.js +4 -1
- package/dist/Popover/Popover.js.map +1 -1
- package/dist/Popover/Popover.styles.d.ts +2 -1
- package/dist/Popover/Popover.styles.js +5 -4
- package/dist/Popover/Popover.styles.js.map +1 -1
- package/dist/Popover/Popover.types.d.ts +6 -0
- package/dist/Popover/Popover.types.js.map +1 -1
- package/dist/Portal/Portal.styles.js +1 -1
- package/dist/ProgressBar/ProgressBar.styles.js +2 -2
- package/dist/RadioButton/RadioButton.styles.js +3 -3
- package/dist/Required/Required.styles.js +3 -3
- package/dist/Search/Search.styles.js +5 -5
- package/dist/Section/Section.styles.js +7 -7
- package/dist/SegmentedController/SegmentedController.styles.js +4 -4
- package/dist/Select/Select.styles.js +7 -7
- package/dist/Semantic/Semantic.styles.js +9 -9
- package/dist/Slider/Slider.styles.js +5 -5
- package/dist/Spinner/Spinner.styles.js +7 -7
- package/dist/SplitViewCard/SplitViewCard.styles.js +8 -8
- package/dist/SuperSelect/SuperSelect.presets.styles.js +1 -1
- package/dist/SuperSelect/SuperSelect.styles.js +37 -37
- package/dist/Switch/Switch.styles.js +4 -4
- package/dist/Table/Table.styles.js +28 -28
- package/dist/TableShelf/TableShelf.styles.js +5 -5
- package/dist/Tabs/Tabs.styles.js +15 -15
- package/dist/Tearsheet/Tearsheet.js +4 -1
- package/dist/Tearsheet/Tearsheet.js.map +1 -1
- package/dist/Tearsheet/Tearsheet.styles.d.ts +1 -0
- package/dist/Tearsheet/Tearsheet.styles.js +8 -7
- package/dist/Tearsheet/Tearsheet.styles.js.map +1 -1
- package/dist/Tearsheet/Tearsheet.types.d.ts +9 -0
- package/dist/Tearsheet/Tearsheet.types.js.map +1 -1
- package/dist/TextArea/TextArea.styles.js +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.styles.js +1 -1
- package/dist/Thumbnail/Thumbnail.styles.js +17 -17
- package/dist/ThumbnailGrid/ThumbnailGrid.styles.js +7 -7
- package/dist/TieredSelect/TieredSelect.styles.js +9 -9
- package/dist/Tile/Tile.styles.js +8 -8
- package/dist/Title/Title.styles.js +7 -7
- package/dist/Toast/Toast.styles.js +3 -3
- package/dist/ToggleButton/ToggleButton.styles.js +1 -1
- package/dist/Token/Token.styles.js +3 -3
- package/dist/ToolHeader/ToolHeader.styles.js +6 -6
- package/dist/ToolLandingPage/ToolLandingPage.styles.js +3 -3
- package/dist/Tooltip/Tooltip.styles.js +2 -2
- package/dist/Tree/Tree.styles.js +9 -9
- package/dist/Typeahead/Typeahead.styles.js +3 -3
- package/dist/Typography/Typography.styles.js +1 -1
- package/dist/Typography/Typography.table.story.js +2 -2
- package/dist/_hooks/I18n.d.ts +70 -0
- package/dist/_locales/de-DE.json +5 -0
- package/dist/_locales/en-AU.json +5 -0
- package/dist/_locales/en-CA.json +7 -2
- package/dist/_locales/en-GB.json +7 -2
- package/dist/_locales/es-ES.json +5 -0
- package/dist/_locales/es.json +5 -0
- package/dist/_locales/fr-CA.json +5 -0
- package/dist/_locales/fr-FR.json +5 -0
- package/dist/_locales/is-IS.json +5 -0
- package/dist/_locales/ja-JP.json +5 -0
- package/dist/_locales/pl-PL.json +5 -0
- package/dist/_locales/pt-BR.json +5 -0
- package/dist/_locales/th-TH.json +5 -0
- package/dist/_locales/zh-SG.json +5 -0
- package/dist/_typedoc/Avatar/Avatar.types.json +22 -22
- package/dist/_typedoc/AvatarStack/AvatarStack.types.json +27 -25
- package/dist/_typedoc/Badge/Badge.types.json +6 -6
- package/dist/_typedoc/Banner/Banner.types.json +13 -13
- package/dist/_typedoc/Box/Box.types.json +68 -68
- package/dist/_typedoc/Breadcrumbs/Breadcrumbs.types.json +10 -10
- package/dist/_typedoc/Button/Button.types.json +12 -12
- package/dist/_typedoc/Calendar/Calendar.types.json +80 -80
- package/dist/_typedoc/Card/Card.types.json +6 -6
- package/dist/_typedoc/Checkbox/Checkbox.types.json +9 -9
- package/dist/_typedoc/ContactItem/ContactItem.types.json +9 -9
- package/dist/_typedoc/DateInput/DateInput.types.json +35 -35
- package/dist/_typedoc/DateSelect/DateSelect.types.json +13 -13
- package/dist/_typedoc/DetailPage/DetailPage.types.json +5 -5
- package/dist/_typedoc/Dropdown/Dropdown.types.json +37 -37
- package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +29 -29
- package/dist/_typedoc/Dropzone/Dropzone.types.json +41 -41
- package/dist/_typedoc/EmptyState/EmptyState.types.json +14 -14
- package/dist/_typedoc/FileList/FileList.types.json +9 -9
- package/dist/_typedoc/FileSelect/FileSelect.types.json +26 -26
- package/dist/_typedoc/FileSelect/GridSource/GridSource.types.json +20 -20
- package/dist/_typedoc/FileSelect/LocalSource/LocalSource.types.json +14 -14
- package/dist/_typedoc/FileSelect/TreeSource/TreeSource.types.json +9 -9
- package/dist/_typedoc/Flex/Flex.types.json +27 -27
- package/dist/_typedoc/FlexList/FlexList.types.json +30 -30
- package/dist/_typedoc/Form/Form.types.json +741 -741
- package/dist/_typedoc/GhostPlaceholder/GhostPlaceholder.types.json +12 -12
- package/dist/_typedoc/Grid/Grid.types.json +8 -8
- package/dist/_typedoc/GroupSelect/GroupSelect.types.json +52 -52
- package/dist/_typedoc/Input/Input.types.json +2 -2
- package/dist/_typedoc/Link/Link.types.json +7 -5
- package/dist/_typedoc/ListPage/ListPage.types.json +13 -13
- package/dist/_typedoc/Menu/Menu.types.json +62 -62
- package/dist/_typedoc/MenuImperative/MenuImperative.types.json +74 -74
- package/dist/_typedoc/Modal/Modal.types.json +46 -46
- package/dist/_typedoc/MultiSelect/MultiSelect.types.json +31 -31
- package/dist/_typedoc/Notation/Notation.types.json +4 -4
- package/dist/_typedoc/NumberInput/NumberInput.types.json +37 -37
- package/dist/_typedoc/OverlayTrigger/OverlayTrigger.types.json +31 -31
- package/dist/_typedoc/PageLayout/PageLayout.types.json +29 -29
- package/dist/_typedoc/Pagination/Pagination.types.json +7 -7
- package/dist/_typedoc/Panel/Panel.types.json +28 -28
- package/dist/_typedoc/Pill/Pill.types.json +2 -2
- package/dist/_typedoc/PillSelect/PillSelect.types.json +49 -49
- package/dist/_typedoc/Popover/Popover.types.json +27 -15
- package/dist/_typedoc/ProgressBar/ProgressBar.types.json +6 -6
- package/dist/_typedoc/RadioButton/RadioButton.types.json +6 -6
- package/dist/_typedoc/Required/Required.types.json +5 -5
- package/dist/_typedoc/Search/Search.types.json +19 -19
- package/dist/_typedoc/Section/Section.types.json +15 -15
- package/dist/_typedoc/SegmentedController/SegmentedController.types.json +20 -20
- package/dist/_typedoc/Select/Select.types.json +60 -60
- package/dist/_typedoc/SettingsPage/SettingsPage.types.json +10 -10
- package/dist/_typedoc/Slider/Slider.types.json +6 -6
- package/dist/_typedoc/Spinner/Spinner.types.json +9 -9
- package/dist/_typedoc/SplitViewCard/SplitViewCard.types.json +12 -12
- package/dist/_typedoc/Switch/Switch.types.json +3 -3
- package/dist/_typedoc/Table/Table.types.json +101 -101
- package/dist/_typedoc/Tabs/Tabs.types.json +19 -19
- package/dist/_typedoc/Tearsheet/Tearsheet.types.json +32 -18
- package/dist/_typedoc/TextArea/TextArea.types.json +3 -3
- package/dist/_typedoc/TextEditor/TextEditor.types.json +9 -9
- package/dist/_typedoc/TextEditorOutput/TextEditorOutput.types.json +4 -4
- package/dist/_typedoc/Thumbnail/Thumbnail.types.json +19 -19
- package/dist/_typedoc/TieredDropdown/TieredDropdown.types.json +42 -42
- package/dist/_typedoc/TieredSelect/TieredSelect.types.json +28 -28
- package/dist/_typedoc/Tile/Tile.types.json +30 -30
- package/dist/_typedoc/Title/Title.types.json +1 -1
- package/dist/_typedoc/Toast/Toast.types.json +4 -4
- package/dist/_typedoc/ToggleButton/ToggleButton.types.json +4 -4
- package/dist/_typedoc/Token/Token.types.json +4 -4
- package/dist/_typedoc/ToolHeader/ToolHeader.types.json +10 -10
- package/dist/_typedoc/ToolLandingPage/ToolLandingPage.types.json +7 -7
- package/dist/_typedoc/Tooltip/Tooltip.types.json +13 -13
- package/dist/_typedoc/Tree/Tree.types.json +86 -86
- package/dist/_typedoc/Typeahead/Typeahead.types.json +2 -2
- package/dist/_typedoc/Typography/Typography.types.json +9 -9
- package/dist/_typedoc/_utils/types.json +3 -3
- package/dist/_typedoc/deprecations.json +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tearsheet.styles.js","names":["styled","css","keyframes","Card","StyledPageContainer","colors","getShadow","spacing","isIE11","animationSpeed","disabled","tearsheet","scrim","closeButton","slideDistance","positioningProps","right","open","closed","concat","placement","shadow","top","bottom","left","getSlideInAnimation","$placement","getSlideOutAnimation","StyledTearsheetContent","div","withConfig","displayName","componentId","_ref","$open","_ref2","_ref3","$opening","_ref4","$closing","minScrimSize","xxl","StyledTearsheetBody","white","_ref5","$stretch","size","includes","_ref6","zoomIn","zoomOut","StyledScrimContainer","_ref7","minSizeProp","StyledButtonContainer","_ref8","StyledButtonCard","xl","_ref9","_ref10","_ref11"],"sources":["../../src/Tearsheet/Tearsheet.styles.ts"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components'\nimport styled, { css, keyframes } from 'styled-components'\nimport { Card } from '../Card/Card'\nimport { StyledPageContainer } from '../PageLayout/PageLayout.styles'\nimport { colors } from '../_styles/colors'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\nimport { isIE11 } from '../_utils/isIE11'\nimport type { Placement } from './Tearsheet.types'\n\nexport const animationSpeed = {\n disabled: 0,\n tearsheet: 800,\n scrim: 300,\n closeButton: 150,\n}\n\nconst slideDistance = '100%'\n\nconst positioningProps: Record<\n Placement,\n Record<\n 'open' | 'closed' | 'placement' | 'shadow',\n string | FlattenSimpleInterpolation\n >\n> = {\n right: {\n open: `translateX(0);`,\n closed: `translateX(${slideDistance});`,\n placement: css`\n flex-direction: row;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'left'),\n },\n // @ts-ignore\n top: {\n open: `translateY(0);`,\n closed: `translateY(-${slideDistance});`,\n placement: css`\n flex-direction: column-reverse;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'bottom'),\n },\n bottom: {\n open: `translateY(0);`,\n closed: `translateY(${slideDistance});`,\n placement: css`\n flex-direction: column;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'top'),\n },\n left: {\n open: `translateX(0);`,\n closed: `translateX(-${slideDistance});`,\n placement: css`\n flex-direction: row-reverse;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'right'),\n },\n}\n\nconst getSlideInAnimation = ($placement: Placement) => keyframes`\n from {\n transform: ${positioningProps[$placement].closed};\n }\n to {\n transform: ${positioningProps[$placement].open};\n }\n`\n\nconst getSlideOutAnimation = ($placement: Placement) => keyframes`\n from {\n transform: ${positioningProps[$placement].open};\n }\n to {\n transform: ${positioningProps[$placement].closed};\n }\n`\n\nexport const StyledTearsheetContent = styled.div<{\n $placement: Placement\n $open: boolean\n $opening?: boolean\n $closing?: boolean\n}>`\n display: flex;\n z-index: 2;\n width: 100%;\n\n ${({ $open, $placement }) =>\n $open\n ? css`\n transform: ${positioningProps[$placement].open};\n `\n : css`\n transform: ${positioningProps[$placement].closed};\n `}\n\n ${({ $placement }) => positioningProps[$placement].placement}\n\n ${({ $opening, $placement }) =>\n $opening &&\n css`\n animation: ${getSlideInAnimation($placement)}\n ${animationSpeed.tearsheet}ms ease-out;\n transform: ${positioningProps[$placement].open};\n pointer-events: none;\n `}\n\n ${({ $closing, $placement }) =>\n $closing &&\n css`\n animation: ${getSlideOutAnimation($placement)}\n ${animationSpeed.tearsheet}ms ease-out;\n transform: ${positioningProps[$placement].closed};\n pointer-events: none;\n `}\n`\n\nexport const minScrimSize = spacing.xxl * 3\n\nexport const StyledTearsheetBody = styled.div<{\n $placement: Placement\n $stretch: boolean\n}>`\n display: flex;\n overflow-y: auto;\n flex-direction: column;\n background-color: ${colors.white};\n\n ${({ $placement, $stretch }) => {\n const size = ['top', 'bottom'].includes($placement) ? '100vh' : '100vw'\n\n return (\n $stretch &&\n css`\n flex: 0 0 calc(${size} - ${minScrimSize}px);\n `\n )\n }}\n\n ${({ $placement }) => {\n if (!isIE11()) {\n return ''\n }\n\n if (['top', 'bottom'].includes($placement)) {\n return css`\n ${StyledPageContainer} {\n width: 100vw;\n }\n `\n }\n\n return css`\n ${StyledPageContainer} {\n width: 95vw;\n }\n `\n }}}\n`\n\nconst zoomIn = keyframes`\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n`\n\nconst zoomOut = keyframes`\n from {\n transform: scale(1);\n }\n to {\n transform: scale(0);\n }\n`\n\nexport const StyledScrimContainer = styled.div<{ $placement: Placement }>`\n ${({ $placement }) => {\n const minSizeProp = ['top', 'bottom'].includes($placement)\n ? 'min-height'\n : 'min-width'\n\n return css`\n ${minSizeProp}: ${minScrimSize}px;\n flex-grow: 1;\n `\n }}\n`\n\nexport const StyledButtonContainer = styled.div<{ $placement: Placement }>`\n ${({ $placement }) => {\n switch ($placement) {\n case 'bottom':\n return css`\n display: flex;\n justify-content: flex-end;\n flex-direction: column;\n height: 100%;\n `\n case 'right':\n return css`\n display: flex;\n justify-content: flex-end;\n `\n case 'left':\n default:\n return\n }\n }}\n`\n\nexport const StyledButtonCard = styled(Card)<{\n $open: boolean\n $opening?: boolean\n $closing?: boolean\n}>`\n display: inline-flex;\n margin: ${spacing.xl}px;\n\n ${({ $open }) =>\n $open\n ? css`\n transform: scale(1);\n `\n : css`\n transform: scale(0);\n `}\n\n ${({ $opening }) =>\n $opening &&\n css`\n animation: ${zoomIn} ${animationSpeed.closeButton}ms;\n transform: scale(1);\n `}\n\n ${({ $closing }) =>\n $closing &&\n css`\n animation: ${zoomOut} ${animationSpeed.closeButton}ms;\n transform: scale(0);\n `}\n`\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Tearsheet.styles.js","names":["styled","css","keyframes","Card","StyledPageContainer","colors","getShadow","spacing","isIE11","animationSpeed","disabled","tearsheet","scrim","closeButton","slideDistance","positioningProps","right","open","closed","concat","placement","shadow","top","bottom","left","getSlideInAnimation","$placement","getSlideOutAnimation","StyledTearsheetContent","div","withConfig","displayName","componentId","_ref","$open","_ref2","_ref3","$opening","_ref4","$closing","minScrimSize","xxl","StyledTearsheetBody","white","_ref5","$block","$stretch","size","includes","_ref6","zoomIn","zoomOut","StyledScrimContainer","_ref7","minSizeProp","StyledButtonContainer","_ref8","StyledButtonCard","xl","_ref9","_ref10","_ref11"],"sources":["../../src/Tearsheet/Tearsheet.styles.ts"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components'\nimport styled, { css, keyframes } from 'styled-components'\nimport { Card } from '../Card/Card'\nimport { StyledPageContainer } from '../PageLayout/PageLayout.styles'\nimport { colors } from '../_styles/colors'\nimport { getShadow } from '../_styles/shadows'\nimport { spacing } from '../_styles/spacing'\nimport { isIE11 } from '../_utils/isIE11'\nimport type { Placement } from './Tearsheet.types'\n\nexport const animationSpeed = {\n disabled: 0,\n tearsheet: 800,\n scrim: 300,\n closeButton: 150,\n}\n\nconst slideDistance = '100%'\n\nconst positioningProps: Record<\n Placement,\n Record<\n 'open' | 'closed' | 'placement' | 'shadow',\n string | FlattenSimpleInterpolation\n >\n> = {\n right: {\n open: `translateX(0);`,\n closed: `translateX(${slideDistance});`,\n placement: css`\n flex-direction: row;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'left'),\n },\n // @ts-ignore\n top: {\n open: `translateY(0);`,\n closed: `translateY(-${slideDistance});`,\n placement: css`\n flex-direction: column-reverse;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'bottom'),\n },\n bottom: {\n open: `translateY(0);`,\n closed: `translateY(${slideDistance});`,\n placement: css`\n flex-direction: column;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'top'),\n },\n left: {\n open: `translateX(0);`,\n closed: `translateX(-${slideDistance});`,\n placement: css`\n flex-direction: row-reverse;\n justify-content: flex-end;\n `,\n shadow: getShadow(4, 'right'),\n },\n}\n\nconst getSlideInAnimation = ($placement: Placement) => keyframes`\n from {\n transform: ${positioningProps[$placement].closed};\n }\n to {\n transform: ${positioningProps[$placement].open};\n }\n`\n\nconst getSlideOutAnimation = ($placement: Placement) => keyframes`\n from {\n transform: ${positioningProps[$placement].open};\n }\n to {\n transform: ${positioningProps[$placement].closed};\n }\n`\n\nexport const StyledTearsheetContent = styled.div<{\n $placement: Placement\n $open: boolean\n $opening?: boolean\n $closing?: boolean\n}>`\n display: flex;\n z-index: 2;\n width: 100%;\n\n ${({ $open, $placement }) =>\n $open\n ? css`\n transform: ${positioningProps[$placement].open};\n `\n : css`\n transform: ${positioningProps[$placement].closed};\n `}\n\n ${({ $placement }) => positioningProps[$placement].placement}\n\n ${({ $opening, $placement }) =>\n $opening &&\n css`\n animation: ${getSlideInAnimation($placement)}\n ${animationSpeed.tearsheet}ms ease-out;\n transform: ${positioningProps[$placement].open};\n pointer-events: none;\n `}\n\n ${({ $closing, $placement }) =>\n $closing &&\n css`\n animation: ${getSlideOutAnimation($placement)}\n ${animationSpeed.tearsheet}ms ease-out;\n transform: ${positioningProps[$placement].closed};\n pointer-events: none;\n `}\n`\n\nexport const minScrimSize = spacing.xxl * 3\n\nexport const StyledTearsheetBody = styled.div<{\n $block: boolean\n $placement: Placement\n $stretch: boolean\n}>`\n display: flex;\n overflow-y: auto;\n flex-direction: column;\n background-color: ${colors.white};\n\n ${({ $block, $placement, $stretch }) => {\n const size = ['top', 'bottom'].includes($placement) ? '100vh' : '100vw'\n\n return (\n ($stretch || $block) &&\n css`\n flex: 0 0 calc(${size} - ${minScrimSize}px);\n `\n )\n }}\n\n ${({ $placement }) => {\n if (!isIE11()) {\n return ''\n }\n\n if (['top', 'bottom'].includes($placement)) {\n return css`\n ${StyledPageContainer} {\n width: 100vw;\n }\n `\n }\n\n return css`\n ${StyledPageContainer} {\n width: 95vw;\n }\n `\n }}}\n`\n\nconst zoomIn = keyframes`\n from {\n transform: scale(0);\n }\n to {\n transform: scale(1);\n }\n`\n\nconst zoomOut = keyframes`\n from {\n transform: scale(1);\n }\n to {\n transform: scale(0);\n }\n`\n\nexport const StyledScrimContainer = styled.div<{ $placement: Placement }>`\n ${({ $placement }) => {\n const minSizeProp = ['top', 'bottom'].includes($placement)\n ? 'min-height'\n : 'min-width'\n\n return css`\n ${minSizeProp}: ${minScrimSize}px;\n flex-grow: 1;\n `\n }}\n`\n\nexport const StyledButtonContainer = styled.div<{ $placement: Placement }>`\n ${({ $placement }) => {\n switch ($placement) {\n case 'bottom':\n return css`\n display: flex;\n justify-content: flex-end;\n flex-direction: column;\n height: 100%;\n `\n case 'right':\n return css`\n display: flex;\n justify-content: flex-end;\n `\n case 'left':\n default:\n return\n }\n }}\n`\n\nexport const StyledButtonCard = styled(Card)<{\n $open: boolean\n $opening?: boolean\n $closing?: boolean\n}>`\n display: inline-flex;\n margin: ${spacing.xl}px;\n\n ${({ $open }) =>\n $open\n ? css`\n transform: scale(1);\n `\n : css`\n transform: scale(0);\n `}\n\n ${({ $opening }) =>\n $opening &&\n css`\n animation: ${zoomIn} ${animationSpeed.closeButton}ms;\n transform: scale(1);\n `}\n\n ${({ $closing }) =>\n $closing &&\n css`\n animation: ${zoomOut} ${animationSpeed.closeButton}ms;\n transform: scale(0);\n `}\n`\n"],"mappings":"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"}
|
|
@@ -47,14 +47,23 @@ export interface TearsheetProps {
|
|
|
47
47
|
* @since 10.25.0
|
|
48
48
|
*/
|
|
49
49
|
afterHide?: () => void;
|
|
50
|
+
/**
|
|
51
|
+
* Force Tearsheet to fill all the available width/height of the screen, depending on placement
|
|
52
|
+
* @since 12.18.0
|
|
53
|
+
* */
|
|
54
|
+
block?: boolean;
|
|
50
55
|
/**
|
|
51
56
|
* Tearsheet placement
|
|
52
57
|
* @since 10.25.0
|
|
58
|
+
* @deprecated There will be only `right` placement, so the property will be removed
|
|
59
|
+
* @deprecatedSince 12.18.0
|
|
53
60
|
*/
|
|
54
61
|
placement?: Placement;
|
|
55
62
|
/**
|
|
56
63
|
* Stretch tearsheet body to the full width or height of the screen, depending on placement
|
|
57
64
|
* @since 11.1.0
|
|
65
|
+
* @deprecated Use `block` as a drop-in replacement
|
|
66
|
+
* @deprecatedSince 12.18.0
|
|
58
67
|
*/
|
|
59
68
|
stretch?: boolean;
|
|
60
69
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tearsheet.types.js","names":[],"sources":["../../src/Tearsheet/Tearsheet.types.ts"],"sourcesContent":["import type React from 'react'\n\nexport type AnimationStatus = 'opening' | 'closing' | 'open' | 'closed'\n\nexport type AnimationPhase = 'tearsheet' | 'closeButton' | 'scrim' | 'disabled'\n\ninterface QaTags {\n closeButton?: string\n scrim?: string\n}\n\nexport interface TearsheetProps {\n /**\n * @since 11.11.0\n */\n ['aria-describedby']?: string\n /**\n * @since 11.11.0\n */\n ['aria-details']?: string\n /**\n * @since 11.11.0\n */\n ['aria-label']?: string\n /**\n * @since 11.11.0\n */\n ['aria-labelledby']?: string\n children?: React.ReactNode\n /**\n * @since 11.11.0\n */\n id?: string\n /**\n * A controlled prop defining open/close state of the tearsheet.\n * @since 10.25.0\n */\n open: boolean\n\n /**\n * A required callback to be called when \"close\" button is clicked. Should set \"open\" flag to \"false\".\n * @since 10.25.0\n */\n onClose: () => void\n\n /**\n * A callback to be called when \"open\" animation is finished.\n * @since 10.25.0\n */\n afterShow?: () => void\n\n /**\n * A callback to be called when \"close\" animation is finished.\n * @since 10.25.0\n */\n afterHide?: () => void\n\n /**\n * Tearsheet placement\n * @since 10.25.0\n */\n placement?: Placement\n
|
|
1
|
+
{"version":3,"file":"Tearsheet.types.js","names":[],"sources":["../../src/Tearsheet/Tearsheet.types.ts"],"sourcesContent":["import type React from 'react'\n\nexport type AnimationStatus = 'opening' | 'closing' | 'open' | 'closed'\n\nexport type AnimationPhase = 'tearsheet' | 'closeButton' | 'scrim' | 'disabled'\n\ninterface QaTags {\n closeButton?: string\n scrim?: string\n}\n\nexport interface TearsheetProps {\n /**\n * @since 11.11.0\n */\n ['aria-describedby']?: string\n /**\n * @since 11.11.0\n */\n ['aria-details']?: string\n /**\n * @since 11.11.0\n */\n ['aria-label']?: string\n /**\n * @since 11.11.0\n */\n ['aria-labelledby']?: string\n children?: React.ReactNode\n /**\n * @since 11.11.0\n */\n id?: string\n /**\n * A controlled prop defining open/close state of the tearsheet.\n * @since 10.25.0\n */\n open: boolean\n\n /**\n * A required callback to be called when \"close\" button is clicked. Should set \"open\" flag to \"false\".\n * @since 10.25.0\n */\n onClose: () => void\n\n /**\n * A callback to be called when \"open\" animation is finished.\n * @since 10.25.0\n */\n afterShow?: () => void\n\n /**\n * A callback to be called when \"close\" animation is finished.\n * @since 10.25.0\n */\n afterHide?: () => void\n /**\n * Force Tearsheet to fill all the available width/height of the screen, depending on placement\n * @since 12.18.0\n * */\n block?: boolean\n /**\n * Tearsheet placement\n * @since 10.25.0\n * @deprecated There will be only `right` placement, so the property will be removed\n * @deprecatedSince 12.18.0\n */\n placement?: Placement\n /**\n * Stretch tearsheet body to the full width or height of the screen, depending on placement\n * @since 11.1.0\n * @deprecated Use `block` as a drop-in replacement\n * @deprecatedSince 12.18.0\n */\n stretch?: boolean\n /**\n * @since 11.11.0\n */\n role?: 'dialog'\n /**\n * QA tags\n * @since 10.25.0\n */\n qa?: QaTags\n}\n\nexport interface TearsheetContextProps {\n placement: Placement | null\n addListener: (e: string, cb: Function) => () => void\n}\n\nexport type Placement = 'right' | 'left' | 'bottom'\n"],"mappings":""}
|
|
@@ -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-
|
|
6
|
+
componentId: "core-12_17_4__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;
|
|
@@ -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-
|
|
4
|
+
componentId: "core-12_17_4__sc-1lje1b0-0"
|
|
5
5
|
})(["> .tox-tinymce{border:none;}"]);
|
|
6
6
|
//# sourceMappingURL=TextEditorOutput.styles.js.map
|
|
@@ -28,35 +28,35 @@ var captionBase = /*#__PURE__*/css(["color:", ";font-size:12px;line-height:16px;
|
|
|
28
28
|
});
|
|
29
29
|
export var StyledMultilineCaption = /*#__PURE__*/styled.div.withConfig({
|
|
30
30
|
displayName: "StyledMultilineCaption",
|
|
31
|
-
componentId: "core-
|
|
31
|
+
componentId: "core-12_17_4__sc-195f70c-0"
|
|
32
32
|
})(["", " 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);
|
|
33
33
|
export var StyledCaptionText = /*#__PURE__*/styled.span.withConfig({
|
|
34
34
|
displayName: "StyledCaptionText",
|
|
35
|
-
componentId: "core-
|
|
35
|
+
componentId: "core-12_17_4__sc-195f70c-1"
|
|
36
36
|
})(["width:100%;"]);
|
|
37
37
|
export var StyledPlaceholderCaption = /*#__PURE__*/styled.div.withConfig({
|
|
38
38
|
displayName: "StyledPlaceholderCaption",
|
|
39
|
-
componentId: "core-
|
|
39
|
+
componentId: "core-12_17_4__sc-195f70c-2"
|
|
40
40
|
})(["", ""], captionBase);
|
|
41
41
|
export var StyledSingleLineCaption = /*#__PURE__*/styled.div.withConfig({
|
|
42
42
|
displayName: "StyledSingleLineCaption",
|
|
43
|
-
componentId: "core-
|
|
43
|
+
componentId: "core-12_17_4__sc-195f70c-3"
|
|
44
44
|
})(["display:flex;", ""], captionBase);
|
|
45
45
|
export var StyledSinglelineCaptionBody = /*#__PURE__*/styled.span.withConfig({
|
|
46
46
|
displayName: "StyledSinglelineCaptionBody",
|
|
47
|
-
componentId: "core-
|
|
47
|
+
componentId: "core-12_17_4__sc-195f70c-4"
|
|
48
48
|
})(["", ""], getEllipsis);
|
|
49
49
|
export var StyledSinglelineCaptionEnding = /*#__PURE__*/styled.span.withConfig({
|
|
50
50
|
displayName: "StyledSinglelineCaptionEnding",
|
|
51
|
-
componentId: "core-
|
|
51
|
+
componentId: "core-12_17_4__sc-195f70c-5"
|
|
52
52
|
})(["max-width:50%;white-space:nowrap;flex-shrink:0;"]);
|
|
53
53
|
export var StyledLabelText = /*#__PURE__*/styled(Typography).withConfig({
|
|
54
54
|
displayName: "StyledLabelText",
|
|
55
|
-
componentId: "core-
|
|
55
|
+
componentId: "core-12_17_4__sc-195f70c-6"
|
|
56
56
|
})(["", ""], getEllipsis());
|
|
57
57
|
export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig({
|
|
58
58
|
displayName: "StyledThumbnailFigCaption",
|
|
59
|
-
componentId: "core-
|
|
59
|
+
componentId: "core-12_17_4__sc-195f70c-7"
|
|
60
60
|
})(["", " ", " 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) {
|
|
61
61
|
var _ref5$$color = _ref5.$color,
|
|
62
62
|
$color = _ref5$$color === void 0 ? 'gray15' : _ref5$$color;
|
|
@@ -64,7 +64,7 @@ export var StyledThumbnailFigCaption = /*#__PURE__*/styled.figcaption.withConfig
|
|
|
64
64
|
}, typographyWeights.bold, labelHeight, spacing.sm / 2, spacing.sm, colors.white);
|
|
65
65
|
export var StyledLabel = /*#__PURE__*/styled.div.withConfig({
|
|
66
66
|
displayName: "StyledLabel",
|
|
67
|
-
componentId: "core-
|
|
67
|
+
componentId: "core-12_17_4__sc-195f70c-8"
|
|
68
68
|
})(["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);
|
|
69
69
|
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) {
|
|
70
70
|
var clickable = _ref6.clickable;
|
|
@@ -86,7 +86,7 @@ var thumbnailBase = /*#__PURE__*/css(["display:flex;justify-content:center;align
|
|
|
86
86
|
});
|
|
87
87
|
export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
|
|
88
88
|
displayName: "StyledTickIcon",
|
|
89
|
-
componentId: "core-
|
|
89
|
+
componentId: "core-12_17_4__sc-195f70c-9"
|
|
90
90
|
})(["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 (_ref11) {
|
|
91
91
|
var selected = _ref11.selected;
|
|
92
92
|
return selected ? "\n opacity: 1;\n transform: scale(1);\n " : '';
|
|
@@ -96,28 +96,28 @@ export var StyledTickIcon = /*#__PURE__*/styled.svg.withConfig({
|
|
|
96
96
|
});
|
|
97
97
|
export var StyledFileIcon = /*#__PURE__*/styled(DocumentIcon).withConfig({
|
|
98
98
|
displayName: "StyledFileIcon",
|
|
99
|
-
componentId: "core-
|
|
99
|
+
componentId: "core-12_17_4__sc-195f70c-10"
|
|
100
100
|
})(["width:36.5%;height:auto;"]);
|
|
101
101
|
export var StyledImageThumbnailPreview = /*#__PURE__*/styled.div.withConfig({
|
|
102
102
|
displayName: "StyledImageThumbnailPreview",
|
|
103
|
-
componentId: "core-
|
|
103
|
+
componentId: "core-12_17_4__sc-195f70c-11"
|
|
104
104
|
})(["width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center;", ""], function (_ref13) {
|
|
105
105
|
var $bgImage = _ref13.$bgImage;
|
|
106
106
|
return css(["background-image:url(", ");"], $bgImage);
|
|
107
107
|
});
|
|
108
108
|
export var StyledImageThumbnailOverlay = /*#__PURE__*/styled.div.withConfig({
|
|
109
109
|
displayName: "StyledImageThumbnailOverlay",
|
|
110
|
-
componentId: "core-
|
|
110
|
+
componentId: "core-12_17_4__sc-195f70c-12"
|
|
111
111
|
})(["display:none;position:absolute;top:0;bottom:0;left:0;right:0;"]);
|
|
112
112
|
var blackOverlay = "\n background-color: ".concat(colors.black, ";\n opacity: 0.2;\n");
|
|
113
113
|
var whiteOverlay = "\n background-color: ".concat(colors.white, ";\n opacity: 0.5;\n");
|
|
114
114
|
export var StyledImageThumbnailImage = /*#__PURE__*/styled.img.withConfig({
|
|
115
115
|
displayName: "StyledImageThumbnailImage",
|
|
116
|
-
componentId: "core-
|
|
116
|
+
componentId: "core-12_17_4__sc-195f70c-13"
|
|
117
117
|
})([""]);
|
|
118
118
|
export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
|
|
119
119
|
displayName: "StyledImageThumbnail",
|
|
120
|
-
componentId: "core-
|
|
120
|
+
componentId: "core-12_17_4__sc-195f70c-14"
|
|
121
121
|
})(["", " flex-direction:column;", " ", " ", " ", " ", " ", ""], thumbnailBase, function (_ref14) {
|
|
122
122
|
var disabled = _ref14.disabled;
|
|
123
123
|
return disabled ? "\n &,\n &:hover {\n ".concat(StyledImageThumbnailOverlay, " {\n display: block;\n ").concat(whiteOverlay, "\n }\n }\n ").concat(StyledImageThumbnailPreview, ",\n ").concat(StyledTickIcon, ",\n ").concat(StyledImageThumbnailImage, " {\n filter: saturate(0);\n }\n ").concat(StyledFileIcon, " {\n filter: saturate(0);\n z-index: -1;\n }\n ") : '';
|
|
@@ -146,7 +146,7 @@ export var StyledImageThumbnail = /*#__PURE__*/styled.div.withConfig({
|
|
|
146
146
|
});
|
|
147
147
|
export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
148
148
|
displayName: "StyledThumbnailWrapper",
|
|
149
|
-
componentId: "core-
|
|
149
|
+
componentId: "core-12_17_4__sc-195f70c-15"
|
|
150
150
|
})(["display:flex;", " ", ""], function (_ref20) {
|
|
151
151
|
var size = _ref20.size;
|
|
152
152
|
return size === 'lg' ? "\n width: ".concat(thumbnailSizeLg, "px;\n ") : '';
|
|
@@ -157,7 +157,7 @@ export var StyledThumbnailWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
|
157
157
|
});
|
|
158
158
|
export var StyledPlaceholderThumbnail = /*#__PURE__*/styled.div.withConfig({
|
|
159
159
|
displayName: "StyledPlaceholderThumbnail",
|
|
160
|
-
componentId: "core-
|
|
160
|
+
componentId: "core-12_17_4__sc-195f70c-16"
|
|
161
161
|
})(["", " ", " ", " ", " ", ""], thumbnailBase, function (_ref22) {
|
|
162
162
|
var clickable = _ref22.clickable;
|
|
163
163
|
return clickable ? "\n &:hover {\n background-color: ".concat(colors.gray96, ";\n }\n\n ") : '';
|
|
@@ -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-
|
|
10
|
+
componentId: "core-12_17_4__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-
|
|
14
|
+
componentId: "core-12_17_4__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-
|
|
18
|
+
componentId: "core-12_17_4__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-
|
|
23
|
+
componentId: "core-12_17_4__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-
|
|
27
|
+
componentId: "core-12_17_4__sc-1inrbm9-4"
|
|
28
28
|
})(["", ""], getEllipsis);
|
|
29
29
|
export var StyledSpinnerWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
30
30
|
displayName: "StyledSpinnerWrapper",
|
|
31
|
-
componentId: "core-
|
|
31
|
+
componentId: "core-12_17_4__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-
|
|
35
|
+
componentId: "core-12_17_4__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
|
+
componentId: "core-12_17_4__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-
|
|
16
|
+
componentId: "core-12_17_4__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-
|
|
20
|
+
componentId: "core-12_17_4__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-
|
|
24
|
+
componentId: "core-12_17_4__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-
|
|
33
|
+
componentId: "core-12_17_4__sc-e1ql06-4"
|
|
34
34
|
})(["height:20px;"]);
|
|
35
35
|
export var StyledTieredSelectOption = /*#__PURE__*/styled(MenuImperative.Item).withConfig({
|
|
36
36
|
displayName: "StyledTieredSelectOption",
|
|
37
|
-
componentId: "core-
|
|
37
|
+
componentId: "core-12_17_4__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-
|
|
41
|
+
componentId: "core-12_17_4__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-
|
|
45
|
+
componentId: "core-12_17_4__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-
|
|
49
|
+
componentId: "core-12_17_4__sc-e1ql06-8"
|
|
50
50
|
})(["min-height:auto;"]);
|
|
51
51
|
//# sourceMappingURL=TieredSelect.styles.js.map
|
package/dist/Tile/Tile.styles.js
CHANGED
|
@@ -39,7 +39,7 @@ var getTileStyles = function getTileStyles(_ref) {
|
|
|
39
39
|
};
|
|
40
40
|
export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
|
|
41
41
|
displayName: "StyledLinkTile",
|
|
42
|
-
componentId: "core-
|
|
42
|
+
componentId: "core-12_17_4__sc-8q9p0n-0"
|
|
43
43
|
})(["", " text-decoration:none;color:inherit;"], function (_ref2) {
|
|
44
44
|
var $orientation = _ref2.$orientation;
|
|
45
45
|
return getTileStyles({
|
|
@@ -49,7 +49,7 @@ export var StyledLinkTile = /*#__PURE__*/styled.a.withConfig({
|
|
|
49
49
|
});
|
|
50
50
|
export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
|
|
51
51
|
displayName: "StyledSelectableTile",
|
|
52
|
-
componentId: "core-
|
|
52
|
+
componentId: "core-12_17_4__sc-8q9p0n-1"
|
|
53
53
|
})(["", ""], function (_ref3) {
|
|
54
54
|
var $orientation = _ref3.$orientation,
|
|
55
55
|
$selected = _ref3.$selected,
|
|
@@ -65,7 +65,7 @@ export var StyledSelectableTile = /*#__PURE__*/styled.div.withConfig({
|
|
|
65
65
|
});
|
|
66
66
|
export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
|
|
67
67
|
displayName: "StyledInteractableTile",
|
|
68
|
-
componentId: "core-
|
|
68
|
+
componentId: "core-12_17_4__sc-8q9p0n-2"
|
|
69
69
|
})(["", ""], function (_ref4) {
|
|
70
70
|
var $orientation = _ref4.$orientation;
|
|
71
71
|
return getTileStyles({
|
|
@@ -74,26 +74,26 @@ export var StyledInteractableTile = /*#__PURE__*/styled.div.withConfig({
|
|
|
74
74
|
});
|
|
75
75
|
export var StyledFooter = /*#__PURE__*/styled.div.withConfig({
|
|
76
76
|
displayName: "StyledFooter",
|
|
77
|
-
componentId: "core-
|
|
77
|
+
componentId: "core-12_17_4__sc-8q9p0n-3"
|
|
78
78
|
})(["grid-area:footer;padding:", "px;> ", "{flex-wrap:wrap-reverse;}"], spacing.lg, StyledActions);
|
|
79
79
|
export var StyledTileContent = /*#__PURE__*/styled(StyledContent).withConfig({
|
|
80
80
|
displayName: "StyledTileContent",
|
|
81
|
-
componentId: "core-
|
|
81
|
+
componentId: "core-12_17_4__sc-8q9p0n-4"
|
|
82
82
|
})(["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);
|
|
83
83
|
export var StyledHeroMedia = /*#__PURE__*/styled.figure.withConfig({
|
|
84
84
|
displayName: "StyledHeroMedia",
|
|
85
|
-
componentId: "core-
|
|
85
|
+
componentId: "core-12_17_4__sc-8q9p0n-5"
|
|
86
86
|
})(["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) {
|
|
87
87
|
var $orientation = _ref5.$orientation;
|
|
88
88
|
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%;}"]);
|
|
89
89
|
});
|
|
90
90
|
export var StyledHeroOverlay = /*#__PURE__*/styled.div.withConfig({
|
|
91
91
|
displayName: "StyledHeroOverlay",
|
|
92
|
-
componentId: "core-
|
|
92
|
+
componentId: "core-12_17_4__sc-8q9p0n-6"
|
|
93
93
|
})(["position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;"]);
|
|
94
94
|
export var StyledHeroText = /*#__PURE__*/styled.div.withConfig({
|
|
95
95
|
displayName: "StyledHeroText",
|
|
96
|
-
componentId: "core-
|
|
96
|
+
componentId: "core-12_17_4__sc-8q9p0n-7"
|
|
97
97
|
})(["grid-area:hero;+ ", "{grid-area:body;}padding:", "px;border-radius:inherit;", ""], StyledTileContent, spacing.lg, function (_ref6) {
|
|
98
98
|
var $orientation = _ref6.$orientation;
|
|
99
99
|
return $orientation === 'landscape' ? css(["display:flex;flex-direction:column;justify-content:center;padding-right:0;"]) : css(["padding-bottom:0;"]);
|
|
@@ -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-
|
|
8
|
+
componentId: "core-12_17_4__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
|
+
componentId: "core-12_17_4__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-
|
|
19
|
+
componentId: "core-12_17_4__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-
|
|
26
|
+
componentId: "core-12_17_4__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-
|
|
30
|
+
componentId: "core-12_17_4__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-
|
|
34
|
+
componentId: "core-12_17_4__sc-1t2ye1d-5"
|
|
35
35
|
})(["margin-left:auto;"]);
|
|
36
36
|
export var StyledSubtext = /*#__PURE__*/styled(Typography).withConfig({
|
|
37
37
|
displayName: "StyledSubtext",
|
|
38
|
-
componentId: "core-
|
|
38
|
+
componentId: "core-12_17_4__sc-1t2ye1d-6"
|
|
39
39
|
})(["display:block;"]);
|
|
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-
|
|
10
|
+
componentId: "core-12_17_4__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-
|
|
19
|
+
componentId: "core-12_17_4__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-
|
|
26
|
+
componentId: "core-12_17_4__sc-1l6lk2n-2"
|
|
27
27
|
})(["line-height:0;color:", ";padding:0;margin-left:auto;"], colors.white);
|
|
28
28
|
//# sourceMappingURL=Toast.styles.js.map
|
|
@@ -3,7 +3,7 @@ import { Button } from '../Button/Button';
|
|
|
3
3
|
import { colors } from '../_styles/colors';
|
|
4
4
|
export var StyledToggleButton = /*#__PURE__*/styled(Button).withConfig({
|
|
5
5
|
displayName: "StyledToggleButton",
|
|
6
|
-
componentId: "core-
|
|
6
|
+
componentId: "core-12_17_4__sc-1x59fxi-0"
|
|
7
7
|
})(["", ""], function (_ref) {
|
|
8
8
|
var $selected = _ref.$selected;
|
|
9
9
|
return $selected && css(["background-color:", ";color:", ";[data-icon-prop='true']{color:", ";}&:hover{background-color:", ";color:", ";}&:focus{background-color:", ";color:", ";}&:disabled{background-color:", ";color:", ";[data-icon-prop='true']{color:", ";}circle{stroke:", ";}}"], colors.blue96, colors.blue45, colors.blue50, colors.blue90, colors.blue45, colors.blue96, colors.blue45, colors.blue96, colors.blue70, colors.blue70, colors.blue50);
|
|
@@ -6,15 +6,15 @@ import { getEllipsis, getFocus } from '../_styles/mixins';
|
|
|
6
6
|
import { spacing } from '../_styles/spacing';
|
|
7
7
|
export var StyledLabel = /*#__PURE__*/styled.span.withConfig({
|
|
8
8
|
displayName: "StyledLabel",
|
|
9
|
-
componentId: "core-
|
|
9
|
+
componentId: "core-12_17_4__sc-zqi94b-0"
|
|
10
10
|
})(["", " ", " flex:0 1 auto;"], getTypographyIntent('body'), getEllipsis);
|
|
11
11
|
export var StyledRemove = /*#__PURE__*/styled(Clear).withConfig({
|
|
12
12
|
displayName: "StyledRemove",
|
|
13
|
-
componentId: "core-
|
|
13
|
+
componentId: "core-12_17_4__sc-zqi94b-1"
|
|
14
14
|
})(["border-radius:100%;cursor:pointer;flex:0 0 auto;height:16px;margin:0 -", "px 0 ", "px;width:16px;&:hover{background:", ";color:", ";}"], spacing.sm, spacing.sm, colors.white, colors.blue40);
|
|
15
15
|
export var StyledToken = /*#__PURE__*/styled.div.withConfig({
|
|
16
16
|
displayName: "StyledToken",
|
|
17
|
-
componentId: "core-
|
|
17
|
+
componentId: "core-12_17_4__sc-zqi94b-2"
|
|
18
18
|
})(["align-items:center;background-color:", ";border-radius:200px;border:1px solid transparent;color:", ";cursor:default;display:inline-flex;height:24px;line-height:1;max-width:360px;min-width:48px;padding:", "px ", "px;&:hover,&.hover{background-color:", ";}", " ", " ", ""], colors.blue50, colors.white, spacing.xs, spacing.md, colors.blue45, function (_ref) {
|
|
19
19
|
var _ref$$focused = _ref.$focused,
|
|
20
20
|
$focused = _ref$$focused === void 0 ? false : _ref$$focused,
|
|
@@ -5,7 +5,7 @@ import { colors } from '../_styles/colors';
|
|
|
5
5
|
import { spacing } from '../_styles/spacing';
|
|
6
6
|
export var StyledHeaderBadge = /*#__PURE__*/styled.div.withConfig({
|
|
7
7
|
displayName: "StyledHeaderBadge",
|
|
8
|
-
componentId: "core-
|
|
8
|
+
componentId: "core-12_17_4__sc-1jpjx47-0"
|
|
9
9
|
})(["", " border-radius:10px;border-style:solid;border-width:1px;display:inline-block;margin-bottom:", "px;padding:1px ", "px;", ""], getTypographyIntent('small'), spacing.sm, spacing.sm, function (_ref) {
|
|
10
10
|
var $variant = _ref.$variant;
|
|
11
11
|
if ($variant) {
|
|
@@ -18,22 +18,22 @@ export var StyledHeaderBadge = /*#__PURE__*/styled.div.withConfig({
|
|
|
18
18
|
// TODO in v12 remove cursor: pointer;
|
|
19
19
|
export var StyledToolHeaderIconContainer = /*#__PURE__*/styled.div.withConfig({
|
|
20
20
|
displayName: "StyledToolHeaderIconContainer",
|
|
21
|
-
componentId: "core-
|
|
21
|
+
componentId: "core-12_17_4__sc-1jpjx47-1"
|
|
22
22
|
})(["color:", ";cursor:pointer;display:inline-flex;flex:0 0 auto;"], colors.orange50);
|
|
23
23
|
export var StyledHeaderTabs = /*#__PURE__*/styled.div.withConfig({
|
|
24
24
|
displayName: "StyledHeaderTabs",
|
|
25
|
-
componentId: "core-
|
|
25
|
+
componentId: "core-12_17_4__sc-1jpjx47-2"
|
|
26
26
|
})(["align-self:flex-end;flex:1 1 auto;min-width:100px;overflow:hidden;"]);
|
|
27
27
|
export var StyledHeaderActions = /*#__PURE__*/styled.div.withConfig({
|
|
28
28
|
displayName: "StyledHeaderActions",
|
|
29
|
-
componentId: "core-
|
|
29
|
+
componentId: "core-12_17_4__sc-1jpjx47-3"
|
|
30
30
|
})(["flex:0 0 auto;margin-left:auto;padding-left:", "px;"], spacing.lg);
|
|
31
31
|
export var StyledToolHeaderTitle = /*#__PURE__*/styled(H1).withConfig({
|
|
32
32
|
displayName: "StyledToolHeaderTitle",
|
|
33
|
-
componentId: "core-
|
|
33
|
+
componentId: "core-12_17_4__sc-1jpjx47-4"
|
|
34
34
|
})(["margin-right:", "px;white-space:nowrap;"], spacing.xl);
|
|
35
35
|
export var StyledToolHeader = /*#__PURE__*/styled.div.withConfig({
|
|
36
36
|
displayName: "StyledToolHeader",
|
|
37
|
-
componentId: "core-
|
|
37
|
+
componentId: "core-12_17_4__sc-1jpjx47-5"
|
|
38
38
|
})(["align-items:center;display:flex;min-height:36px;width:100%;", " + ", ",a + ", ",button + ", "{margin-left:", "px;}"], StyledToolHeaderIconContainer, StyledToolHeaderTitle, StyledToolHeaderTitle, StyledToolHeaderTitle, spacing.lg);
|
|
39
39
|
//# sourceMappingURL=ToolHeader.styles.js.map
|
|
@@ -3,14 +3,14 @@ import { Page } from '../PageLayout';
|
|
|
3
3
|
import { spacing } from '../_styles/spacing';
|
|
4
4
|
export var StyledTitleOuter = /*#__PURE__*/styled(Page.Title).withConfig({
|
|
5
5
|
displayName: "StyledTitleOuter",
|
|
6
|
-
componentId: "core-
|
|
6
|
+
componentId: "core-12_17_4__sc-wa8j06-0"
|
|
7
7
|
})(["align-items:center;display:flex;gap:", "px;"], spacing.md);
|
|
8
8
|
export var StyledTitleInner = /*#__PURE__*/styled.div.withConfig({
|
|
9
9
|
displayName: "StyledTitleInner",
|
|
10
|
-
componentId: "core-
|
|
10
|
+
componentId: "core-12_17_4__sc-wa8j06-1"
|
|
11
11
|
})(["width:100%;"]);
|
|
12
12
|
export var StyledToolLandingPageBodyContent = /*#__PURE__*/styled.div.withConfig({
|
|
13
13
|
displayName: "StyledToolLandingPageBodyContent",
|
|
14
|
-
componentId: "core-
|
|
14
|
+
componentId: "core-12_17_4__sc-wa8j06-2"
|
|
15
15
|
})(["> * + *{margin-top:", "px;}"], spacing.sm);
|
|
16
16
|
//# sourceMappingURL=ToolLandingPage.styles.js.map
|
|
@@ -6,10 +6,10 @@ import { getShadow } from '../_styles/shadows';
|
|
|
6
6
|
import { spacing } from '../_styles/spacing';
|
|
7
7
|
export var StyledTooltip = /*#__PURE__*/styled.span.withConfig({
|
|
8
8
|
displayName: "StyledTooltip",
|
|
9
|
-
componentId: "core-
|
|
9
|
+
componentId: "core-12_17_4__sc-1fawsi4-0"
|
|
10
10
|
})(["", " color:", ";max-width:200px;padding:", "px ", "px;position:relative;word-wrap:break-word;overflow-wrap:break-word;white-space:normal;"], getTypographyIntent('small'), colors.white, spacing.sm, spacing.md);
|
|
11
11
|
export var StyledContainer = /*#__PURE__*/styled.span.withConfig({
|
|
12
12
|
displayName: "StyledContainer",
|
|
13
|
-
componentId: "core-
|
|
13
|
+
componentId: "core-12_17_4__sc-1fawsi4-1"
|
|
14
14
|
})(["display:inline-flex;background-color:", ";border-radius:", "px;", " & + [data-overlay-arrow]{background:", ";}"], colors.gray15, borderRadius.md, getShadow(3, 'bottom'), colors.gray15);
|
|
15
15
|
//# sourceMappingURL=Tooltip.styles.js.map
|
package/dist/Tree/Tree.styles.js
CHANGED
|
@@ -5,11 +5,11 @@ import { Typography } from '../Typography/Typography';
|
|
|
5
5
|
import { colors } from '../_styles/colors';
|
|
6
6
|
export var StyledFilenameCaption = /*#__PURE__*/styled(Typography).withConfig({
|
|
7
7
|
displayName: "StyledFilenameCaption",
|
|
8
|
-
componentId: "core-
|
|
8
|
+
componentId: "core-12_17_4__sc-2d45b5-0"
|
|
9
9
|
})(["display:flex;width:100%;"]);
|
|
10
10
|
export var StyledTree = /*#__PURE__*/styled.div.withConfig({
|
|
11
11
|
displayName: "StyledTree",
|
|
12
|
-
componentId: "core-
|
|
12
|
+
componentId: "core-12_17_4__sc-2d45b5-1"
|
|
13
13
|
})(["width:100%;height:100%;min-height:36px;outline:none;overflow:auto;"]);
|
|
14
14
|
export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
|
|
15
15
|
shouldForwardProp: function shouldForwardProp(prop) {
|
|
@@ -17,7 +17,7 @@ export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
|
|
|
17
17
|
}
|
|
18
18
|
}).withConfig({
|
|
19
19
|
displayName: "StyledTreeRowContainer",
|
|
20
|
-
componentId: "core-
|
|
20
|
+
componentId: "core-12_17_4__sc-2d45b5-2"
|
|
21
21
|
})(["display:flex;align-items:center;height:36px;background:transparent;box-shadow:inset 4px 0px 0px transparent;cursor:default;outline:none;", " &:hover{background:", ";}", " ", ""], function (_ref) {
|
|
22
22
|
var isSelectable = _ref.isSelectable,
|
|
23
23
|
$isSelectable = _ref.$isSelectable;
|
|
@@ -35,30 +35,30 @@ export var StyledTreeRowContainer = /*#__PURE__*/styled(Typography).withConfig({
|
|
|
35
35
|
});
|
|
36
36
|
export var StyledTreeRowContent = /*#__PURE__*/styled.div.withConfig({
|
|
37
37
|
displayName: "StyledTreeRowContent",
|
|
38
|
-
componentId: "core-
|
|
38
|
+
componentId: "core-12_17_4__sc-2d45b5-3"
|
|
39
39
|
})(["display:flex;align-items:center;"]);
|
|
40
40
|
export var StyledTreeRowWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
41
41
|
displayName: "StyledTreeRowWrapper",
|
|
42
|
-
componentId: "core-
|
|
42
|
+
componentId: "core-12_17_4__sc-2d45b5-4"
|
|
43
43
|
})(["outline:none;"]);
|
|
44
44
|
var StyledIconBase = /*#__PURE__*/styled(Box).withConfig({
|
|
45
45
|
displayName: "StyledIconBase",
|
|
46
|
-
componentId: "core-
|
|
46
|
+
componentId: "core-12_17_4__sc-2d45b5-5"
|
|
47
47
|
})(["display:flex;justify-content:center;align-items:center;width:24px;height:24px;min-width:24px;min-height:24px;"]);
|
|
48
48
|
export var StyledChevronContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
|
|
49
49
|
displayName: "StyledChevronContainer",
|
|
50
|
-
componentId: "core-
|
|
50
|
+
componentId: "core-12_17_4__sc-2d45b5-6"
|
|
51
51
|
})([""]);
|
|
52
52
|
export var StyledIconContainer = /*#__PURE__*/styled(StyledIconBase).withConfig({
|
|
53
53
|
displayName: "StyledIconContainer",
|
|
54
|
-
componentId: "core-
|
|
54
|
+
componentId: "core-12_17_4__sc-2d45b5-7"
|
|
55
55
|
})(["color:", ";"], function (_ref4) {
|
|
56
56
|
var $isSelected = _ref4.$isSelected;
|
|
57
57
|
return $isSelected ? colors.blue45 : colors.gray40;
|
|
58
58
|
});
|
|
59
59
|
export var StyledChevron = /*#__PURE__*/styled(ChevronRight).withConfig({
|
|
60
60
|
displayName: "StyledChevron",
|
|
61
|
-
componentId: "core-
|
|
61
|
+
componentId: "core-12_17_4__sc-2d45b5-8"
|
|
62
62
|
})(["transform:rotate(", "deg);transition:transform 150ms ease-out;"], function (_ref5) {
|
|
63
63
|
var $isExpanded = _ref5.$isExpanded;
|
|
64
64
|
return $isExpanded ? 90 : 0;
|