@procore/core-react 12.8.1 → 12.10.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.
- package/dist/AnchorNavigation/AnchorNavigation.styles.js +3 -3
- package/dist/Avatar/Avatar.styles.js +5 -5
- package/dist/AvatarStack/AvatarStack.styles.js +7 -7
- 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.js +8 -1
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/Button.styles.js +15 -6
- package/dist/Button/Button.styles.js.map +1 -1
- package/dist/Button/Button.types.d.ts +1 -1
- package/dist/Button/Button.types.js.map +1 -1
- 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.js +7 -0
- package/dist/DateInput/DateInput.js.map +1 -1
- package/dist/DateInput/DateInput.styles.js +6 -6
- package/dist/DetailPage/DetailPage.styles.js +8 -8
- package/dist/DetailPage/DetailPage.styles.js.map +1 -1
- 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/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/ListPage/ListPage.d.ts +7 -0
- package/dist/ListPage/ListPage.js +8 -0
- package/dist/ListPage/ListPage.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/PageLayout/PageLayout.styles.d.ts +3 -1
- package/dist/PageLayout/PageLayout.styles.js +29 -23
- package/dist/PageLayout/PageLayout.styles.js.map +1 -1
- package/dist/Pagination/Pagination.js +1 -1
- package/dist/Pagination/Pagination.js.map +1 -1
- package/dist/Pagination/Pagination.styles.js +5 -5
- package/dist/Panel/Panel.js +7 -2
- package/dist/Panel/Panel.js.map +1 -1
- 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.styles.js +2 -2
- 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.js +4 -3
- package/dist/Section/Section.js.map +1 -1
- package/dist/Section/Section.styles.d.ts +1 -0
- package/dist/Section/Section.styles.js +10 -6
- package/dist/Section/Section.styles.js.map +1 -1
- package/dist/Section/Section.types.d.ts +4 -0
- package/dist/Section/Section.types.js.map +1 -1
- 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.context.d.ts +3 -4
- package/dist/SplitViewCard/SplitViewCard.context.js +27 -9
- package/dist/SplitViewCard/SplitViewCard.context.js.map +1 -1
- package/dist/SplitViewCard/SplitViewCard.d.ts +23 -22
- package/dist/SplitViewCard/SplitViewCard.js +106 -39
- package/dist/SplitViewCard/SplitViewCard.js.map +1 -1
- package/dist/SplitViewCard/SplitViewCard.styles.d.ts +9 -3
- package/dist/SplitViewCard/SplitViewCard.styles.js +30 -18
- package/dist/SplitViewCard/SplitViewCard.styles.js.map +1 -1
- package/dist/SplitViewCard/SplitViewCard.types.d.ts +29 -6
- package/dist/SplitViewCard/SplitViewCard.types.js.map +1 -1
- package/dist/SplitViewCard/index.d.ts +0 -2
- package/dist/SplitViewCard/index.js +0 -2
- package/dist/SplitViewCard/index.js.map +1 -1
- 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.styles.js +5 -5
- package/dist/TextArea/TextArea.styles.js +1 -1
- package/dist/TextEditorOutput/TextEditorOutput.styles.js +1 -1
- package/dist/Thumbnail/Thumbnail.hooks.d.ts +4 -2
- 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.d.ts +9 -0
- package/dist/ToolHeader/ToolHeader.js +10 -0
- package/dist/ToolHeader/ToolHeader.js.map +1 -1
- package/dist/ToolHeader/ToolHeader.styles.js +6 -6
- package/dist/ToolLandingPage/ToolLandingPage.d.ts +25 -0
- package/dist/ToolLandingPage/ToolLandingPage.js +78 -0
- package/dist/ToolLandingPage/ToolLandingPage.js.map +1 -0
- package/dist/ToolLandingPage/ToolLandingPage.styles.d.ts +4 -0
- package/dist/ToolLandingPage/ToolLandingPage.styles.js +16 -0
- package/dist/ToolLandingPage/ToolLandingPage.styles.js.map +1 -0
- package/dist/ToolLandingPage/ToolLandingPage.types.d.ts +11 -0
- package/dist/ToolLandingPage/ToolLandingPage.types.js +2 -0
- package/dist/ToolLandingPage/ToolLandingPage.types.js.map +1 -0
- package/dist/ToolLandingPage/index.d.ts +2 -0
- package/dist/ToolLandingPage/index.js +2 -0
- package/dist/ToolLandingPage/index.js.map +1 -0
- 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 +79 -1
- package/dist/_hooks/I18n.js +10 -1
- package/dist/_hooks/I18n.js.map +1 -1
- package/dist/_hooks/getI18nProviderLocale.d.ts +6 -0
- package/dist/_hooks/getI18nProviderLocale.js +12 -2
- package/dist/_hooks/getI18nProviderLocale.js.map +1 -1
- package/dist/_locales/de-DE.json +9 -4
- package/dist/_locales/en-AU.json +6 -1
- package/dist/_locales/en-CA.json +6 -1
- package/dist/_locales/en-GB.json +6 -1
- package/dist/_locales/en.json +1 -1
- package/dist/_locales/es-ES.json +6 -1
- package/dist/_locales/es.json +11 -6
- package/dist/_locales/fr-CA.json +11 -6
- package/dist/_locales/fr-FR.json +14 -9
- package/dist/_locales/is-IS.json +6 -1
- package/dist/_locales/ja-JP.json +46 -41
- package/dist/_locales/pl-PL.json +3 -0
- package/dist/_locales/pseudo.json +6 -1
- package/dist/_locales/pt-BR.json +9 -4
- package/dist/_locales/th-TH.json +6 -1
- package/dist/_locales/zh-SG.json +6 -1
- package/dist/_typedoc/Avatar/Avatar.types.json +20 -20
- package/dist/_typedoc/AvatarStack/AvatarStack.types.json +23 -23
- 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 +14 -14
- 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 +39 -39
- package/dist/_typedoc/DropdownFlyout/DropdownFlyout.types.json +30 -30
- 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 +726 -726
- 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 +4 -4
- package/dist/_typedoc/ListPage/ListPage.json +9 -0
- 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 +28 -28
- package/dist/_typedoc/Pagination/Pagination.types.json +7 -7
- package/dist/_typedoc/Panel/Panel.types.json +38 -28
- package/dist/_typedoc/Pill/Pill.types.json +2 -2
- package/dist/_typedoc/PillSelect/PillSelect.types.json +47 -47
- package/dist/_typedoc/Popover/Popover.types.json +14 -14
- 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 +18 -18
- package/dist/_typedoc/Section/Section.types.json +24 -14
- package/dist/_typedoc/SegmentedController/SegmentedController.types.json +20 -20
- package/dist/_typedoc/Select/Select.types.json +58 -58
- 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 +134 -0
- package/dist/_typedoc/Switch/Switch.types.json +3 -3
- package/dist/_typedoc/Table/Table.types.json +99 -99
- package/dist/_typedoc/Tabs/Tabs.types.json +19 -19
- package/dist/_typedoc/Tearsheet/Tearsheet.types.json +16 -16
- 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 +44 -44
- 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 +3 -3
- package/dist/_typedoc/Token/Token.types.json +4 -4
- package/dist/_typedoc/ToolHeader/ToolHeader.json +9 -0
- package/dist/_typedoc/ToolHeader/ToolHeader.types.json +10 -10
- package/dist/_typedoc/ToolLandingPage/ToolLandingPage.types.json +84 -0
- 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/dist/_utils/CalendarHelpers.js +3 -2
- package/dist/_utils/CalendarHelpers.js.map +1 -1
- package/dist/_utils/TinyMCE.js +2 -1
- package/dist/_utils/TinyMCE.js.map +1 -1
- package/dist/_utils/propsTypedoc.d.ts +4 -0
- package/dist/_utils/propsTypedoc.js +4 -1
- package/dist/_utils/propsTypedoc.js.map +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/dist/NextListPage/NextListPage.d.ts +0 -24
- package/dist/NextListPage/NextListPage.js +0 -44
- package/dist/NextListPage/NextListPage.js.map +0 -1
- package/dist/NextListPage/NextListPage.types.d.ts +0 -3
- package/dist/NextListPage/NextListPage.types.js +0 -2
- package/dist/NextListPage/NextListPage.types.js.map +0 -1
- package/dist/NextListPage/index.d.ts +0 -2
- package/dist/NextListPage/index.js +0 -2
- package/dist/NextListPage/index.js.map +0 -1
- package/dist/SplitViewCard/useSplitViewCard.d.ts +0 -5
- package/dist/SplitViewCard/useSplitViewCard.js +0 -14
- package/dist/SplitViewCard/useSplitViewCard.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SplitViewCard.js","names":["Clear","React","Button","Section","useI18nContext","addSubcomponents","StyledSplitViewCardAside","StyledSplitViewCardBody","StyledSplitViewCardContainer","StyledSplitViewCardFooter","StyledSplitViewCardHeader","StyledSplitViewCardHeading","StyledSplitViewCardMain","StyledSplitViewCardTitle","useSplitViewCard","SplitViewCard_","forwardRef","_ref","ref","children","props","_objectWithoutProperties","_excluded","createElement","_extends","Main","_ref2","_excluded2","Aside","_ref3","_excluded3","_useSplitViewCard","open","$open","Heading","_ref4","_excluded4","Title","_ref5","onClose","_excluded5","I18n","t","icon","variant","onClick","Header","_ref6","_excluded6","Body","_ref7","_excluded7","Footer","_ref8","_excluded8","displayName","SplitViewCard"],"sources":["../../src/SplitViewCard/SplitViewCard.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons'\nimport React from 'react'\nimport { Button } from '../Button'\nimport { Section } from '../Section'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport type { Props } from '../_utils/types'\nimport {\n StyledSplitViewCardAside,\n StyledSplitViewCardBody,\n StyledSplitViewCardContainer,\n StyledSplitViewCardFooter,\n StyledSplitViewCardHeader,\n StyledSplitViewCardHeading,\n StyledSplitViewCardMain,\n StyledSplitViewCardTitle,\n} from './SplitViewCard.styles'\nimport type { SplitViewCardProps } from './SplitViewCard.types'\nimport { useSplitViewCard } from './useSplitViewCard'\n\nconst SplitViewCard_ = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardContainer ref={ref} {...props}>\n {children}\n </StyledSplitViewCardContainer>\n )\n)\n\nexport const Main = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardMain ref={ref} {...props}>\n {children}\n </StyledSplitViewCardMain>\n )\n)\n\nexport const Aside = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const { open } = useSplitViewCard()\n\n return (\n <StyledSplitViewCardAside $open={open} ref={ref} {...props}>\n {children}\n </StyledSplitViewCardAside>\n )\n }\n)\n\nexport const Heading = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardHeading ref={ref} {...props}>\n {children}\n </StyledSplitViewCardHeading>\n )\n)\n\nexport const Title = React.forwardRef<HTMLDivElement, SplitViewCardProps>(\n ({ children, onClose, ...props }, ref) => {\n const I18n = useI18nContext()\n\n return (\n <StyledSplitViewCardTitle ref={ref} {...props}>\n {children}\n <Button\n aria-label={I18n.t('core.splitViewCard.a11y.close')}\n icon={<Clear />}\n variant=\"tertiary\"\n onClick={onClose}\n />\n </StyledSplitViewCardTitle>\n )\n }\n)\n\nexport const Header = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardHeader ref={ref} {...props}>\n {children}\n </StyledSplitViewCardHeader>\n )\n)\n\nexport const Body = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardBody ref={ref} {...props}>\n {children}\n </StyledSplitViewCardBody>\n )\n)\n\nexport const Footer = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardFooter ref={ref} {...props}>\n {children}\n </StyledSplitViewCardFooter>\n )\n)\n\nSplitViewCard_.displayName = 'SplitViewCard'\nMain.displayName = 'SplitViewCard.Main'\nAside.displayName = 'SplitViewCard.Aside'\nHeading.displayName = 'SplitViewCard.Heading'\nTitle.displayName = 'SplitViewCard.Title'\nHeader.displayName = 'SplitViewCard.Header'\nBody.displayName = 'SplitViewCard.Body'\nFooter.displayName = 'SplitViewCard.Footer'\n\n/**\n\n A split view card component is used to support a split view page layout.\n\n - SplitViewCard\n - SplitViewCard.Main\n - SplitViewCard.Section\n - Table or some other main content\n - SplitViewCard.Aside\n - SplitViewCard.Header\n - SplitViewCard.Title\n - SplitViewCard.Heading\n - Title\n - Tabs\n - SplitViewCard.Body\n - Content\n - SplitViewCard.Footer\n\n @since 12.4.2\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/demos-splitviewcard--demo)\n\n */\n\nexport const SplitViewCard = addSubcomponents(\n {\n Main,\n Section,\n Aside,\n Heading,\n Title,\n Header,\n Body,\n Footer,\n },\n SplitViewCard_\n)\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SplitViewCard.js","names":["Clear","React","Button","StyledActions","Section","useI18nContext","useResizeObserver","addSubcomponents","mergeRefs","SplitViewCardContextProvider","useSplitViewCard","StyledSplitViewCardAside","StyledSplitViewCardBody","StyledSplitViewCardContainer","StyledSplitViewCardFooter","StyledSplitViewCardHeader","StyledSplitViewCardHeading","StyledSplitViewCardMain","StyledSplitViewCardTitle","SplitViewCard_","forwardRef","_ref","ref","children","_ref$isClosable","isClosable","isInitiallyOpen","onClose","props","_objectWithoutProperties","_excluded","createElement","_extends","Main","_ref2","_excluded2","_useSplitViewCard","open","$open","Panel","_ref3","_excluded3","_useSplitViewCard2","_React$useState","useState","_React$useState2","_slicedToArray","hasShadow","setHasShadow","mainRef","useRef","handleResize","useCallback","entries","element","target","clientWidth","setResize","useEffect","current","$hasShadow","PanelHeading","_ref4","_excluded4","PanelTitle","_ref5","_excluded5","I18n","_useSplitViewCard3","t","icon","variant","onClick","PanelHeader","_ref6","_excluded6","PanelBody","_ref7","_excluded7","_useSplitViewCard4","setIsScrolling","timer","handleScroll","clearTimeout","setTimeout","onScroll","tabIndex","PanelFooter","_ref8","_excluded8","_useSplitViewCard5","isScrolling","Actions","_ref9","_excluded9","displayName","SplitViewCard"],"sources":["../../src/SplitViewCard/SplitViewCard.tsx"],"sourcesContent":["import { Clear } from '@procore/core-icons'\nimport React from 'react'\nimport { Button } from '../Button'\nimport { StyledActions } from '../Content/Content.styles'\nimport { Section } from '../Section'\nimport { useI18nContext } from '../_hooks/I18n'\nimport { useResizeObserver } from '../_hooks/ResizeObserver'\nimport { addSubcomponents } from '../_utils/addSubcomponents'\nimport { mergeRefs } from '../_utils/mergeRefs'\nimport type { Props } from '../_utils/types'\nimport {\n SplitViewCardContextProvider,\n useSplitViewCard,\n} from './SplitViewCard.context'\nimport {\n StyledSplitViewCardAside,\n StyledSplitViewCardBody,\n StyledSplitViewCardContainer,\n StyledSplitViewCardFooter,\n StyledSplitViewCardHeader,\n StyledSplitViewCardHeading,\n StyledSplitViewCardMain,\n StyledSplitViewCardTitle,\n} from './SplitViewCard.styles'\nimport type { SplitViewCardProps } from './SplitViewCard.types'\n\nconst SplitViewCard_ = React.forwardRef<HTMLDivElement, SplitViewCardProps>(\n (\n { children, isClosable = true, isInitiallyOpen, onClose, ...props },\n ref\n ) => (\n <SplitViewCardContextProvider\n isInitiallyOpen={isInitiallyOpen}\n onClose={onClose}\n isClosable={isClosable}\n >\n <StyledSplitViewCardContainer ref={ref} {...props}>\n {children}\n </StyledSplitViewCardContainer>\n </SplitViewCardContextProvider>\n )\n)\n\nexport const Main = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const { open } = useSplitViewCard()\n\n return (\n <StyledSplitViewCardMain $open={open} ref={ref} {...props}>\n {children}\n </StyledSplitViewCardMain>\n )\n }\n)\n\nexport const Panel = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const { open } = useSplitViewCard()\n const [hasShadow, setHasShadow] = React.useState(false)\n\n const mainRef = React.useRef<HTMLDivElement>(null)\n\n const handleResize = React.useCallback((entries: ResizeObserverEntry[]) => {\n const element = entries[0]\n\n if (element && element.target.clientWidth <= 400) {\n setHasShadow(true)\n return\n }\n\n setHasShadow(false)\n }, [])\n\n const setResize = useResizeObserver(handleResize)\n\n React.useEffect(() => {\n setResize(mainRef.current)\n }, [setResize])\n\n return (\n <StyledSplitViewCardAside\n $open={open}\n $hasShadow={hasShadow}\n ref={mergeRefs(ref, mainRef)}\n {...props}\n >\n {children}\n </StyledSplitViewCardAside>\n )\n }\n)\n\nexport const PanelHeading = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardHeading ref={ref} {...props}>\n {children}\n </StyledSplitViewCardHeading>\n )\n)\n\nexport const PanelTitle = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const I18n = useI18nContext()\n const { isClosable, onClose } = useSplitViewCard()\n\n return (\n <StyledSplitViewCardTitle ref={ref} {...props}>\n <StyledSplitViewCardHeading>{children}</StyledSplitViewCardHeading>\n {isClosable && (\n <Button\n aria-label={I18n.t('core.splitViewCard.a11y.close')}\n icon={<Clear />}\n variant=\"tertiary\"\n onClick={onClose}\n />\n )}\n </StyledSplitViewCardTitle>\n )\n }\n)\n\nexport const PanelHeader = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => (\n <StyledSplitViewCardHeader ref={ref} {...props}>\n {children}\n </StyledSplitViewCardHeader>\n )\n)\n\nexport const PanelBody = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const { setIsScrolling } = useSplitViewCard()\n const timer = React.useRef<NodeJS.Timer | null>(null)\n\n const handleScroll = React.useCallback(() => {\n setIsScrolling(true)\n\n if (timer.current) {\n clearTimeout(timer.current)\n }\n\n timer.current = setTimeout(() => {\n setIsScrolling(false)\n }, 100)\n }, [setIsScrolling])\n\n return (\n <StyledSplitViewCardBody\n ref={ref}\n {...props}\n onScroll={handleScroll}\n tabIndex={0}\n >\n {children}\n </StyledSplitViewCardBody>\n )\n }\n)\n\nexport const PanelFooter = React.forwardRef<HTMLDivElement, Props>(\n ({ children, ...props }, ref) => {\n const { isScrolling } = useSplitViewCard()\n\n return (\n <StyledSplitViewCardFooter $hasShadow={isScrolling} ref={ref} {...props}>\n {children}\n </StyledSplitViewCardFooter>\n )\n }\n)\n\nconst Actions = React.forwardRef<HTMLDivElement, Props>(function Actions(\n { children, ...props },\n ref\n) {\n return (\n <StyledActions ref={ref} {...props}>\n {children}\n </StyledActions>\n )\n})\n\nSplitViewCard_.displayName = 'SplitViewCard'\nMain.displayName = 'SplitViewCard.Main'\nPanel.displayName = 'SplitViewCard.Panel'\nPanelTitle.displayName = 'SplitViewCard.PanelTitle'\nPanelHeader.displayName = 'SplitViewCard.PanelHeader'\nPanelBody.displayName = 'SplitViewCard.PanelBody'\nPanelFooter.displayName = 'SplitViewCard.PanelFooter'\nActions.displayName = 'SplitViewCard.Actions'\n\n/**\n\n A SplitViewCard component is used to display additional details\n of an item from a collection inside a panel of a card.\n\n - SplitViewCard\n - SplitViewCard.Main\n - SplitViewCard.Section\n - Table or some other main content\n - SplitViewCard.Panel\n - SplitViewCard.PanelHeader\n - SplitViewCard.PanelTitle\n - text\n - Tabs\n - SplitViewCard.PanelBody\n - Content\n - SplitViewCard.PanelFooter\n - SplitViewCard.Actions\n\n @since 12.9.0\n\n @see [Storybook](https://stories.core.procore.com/?path=/story/demos-splitviewcard--demo)\n\n */\n\nexport const SplitViewCard = addSubcomponents(\n {\n Actions,\n Main,\n Section,\n Panel,\n PanelTitle,\n PanelHeader,\n PanelBody,\n PanelFooter,\n },\n SplitViewCard_\n)\n"],"mappings":"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"}
|
|
@@ -1,10 +1,16 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
export declare const StyledSplitViewCardContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
2
|
-
export declare const StyledSplitViewCardMain: import("styled-components").StyledComponent<"div", any, {
|
|
3
|
+
export declare const StyledSplitViewCardMain: import("styled-components").StyledComponent<"div", any, {
|
|
4
|
+
$open: boolean;
|
|
5
|
+
}, never>;
|
|
3
6
|
export declare const StyledSplitViewCardAside: import("styled-components").StyledComponent<"div", any, {
|
|
4
7
|
$open: boolean;
|
|
8
|
+
$hasShadow: boolean;
|
|
5
9
|
}, never>;
|
|
6
|
-
export declare const StyledSplitViewCardHeading: import("styled-components").StyledComponent<"
|
|
10
|
+
export declare const StyledSplitViewCardHeading: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../Semantic/Semantic.types").HeadingProps & import("react").RefAttributes<HTMLHeadingElement>>, any, {}, never>;
|
|
7
11
|
export declare const StyledSplitViewCardTitle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
12
|
export declare const StyledSplitViewCardHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
9
13
|
export declare const StyledSplitViewCardBody: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
10
|
-
export declare const StyledSplitViewCardFooter: import("styled-components").StyledComponent<"div", any, {
|
|
14
|
+
export declare const StyledSplitViewCardFooter: import("styled-components").StyledComponent<"div", any, {
|
|
15
|
+
$hasShadow?: boolean | undefined;
|
|
16
|
+
}, never>;
|
|
@@ -1,39 +1,51 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
|
+
import { breakpointMinWidthValues, breakpointRawMinWidthValues } from '../Grid/Grid.constants';
|
|
3
|
+
import { H2 } from '../Semantic';
|
|
2
4
|
import { colors } from '../_styles/colors';
|
|
3
5
|
import { spacing } from '../_styles/spacing';
|
|
6
|
+
var MIN_CARD_HEIGHT = 364;
|
|
4
7
|
export var StyledSplitViewCardContainer = /*#__PURE__*/styled.div.withConfig({
|
|
5
8
|
displayName: "StyledSplitViewCardContainer",
|
|
6
|
-
componentId: "core-
|
|
7
|
-
})(["display:grid;grid-template-columns:1fr auto;border:
|
|
9
|
+
componentId: "core-12_10_0__sc-9hrkda-0"
|
|
10
|
+
})(["display:grid;grid-template-columns:1fr auto;border-radius:", "px;box-shadow:0 0 4px 0 rgba(0,0,0,0.25);min-height:", "px;position:relative;width:100%;@media (max-width:", "){box-shadow:none;display:flex;flex-direction:column;width:100%;}"], spacing.sm, MIN_CARD_HEIGHT, breakpointMinWidthValues.tabletMd);
|
|
8
11
|
export var StyledSplitViewCardMain = /*#__PURE__*/styled.div.withConfig({
|
|
9
12
|
displayName: "StyledSplitViewCardMain",
|
|
10
|
-
componentId: "core-
|
|
11
|
-
})(["background-color:", ";position:relative;width:100%;"], colors.white)
|
|
13
|
+
componentId: "core-12_10_0__sc-9hrkda-1"
|
|
14
|
+
})(["background-color:", ";border-top-left-radius:", "px;border-bottom-left-radius:", "px;position:relative;width:60%;transition:all ease 500ms;@media (max-width:", "){box-shadow:0 0 4px 0 rgba(0,0,0,0.25);border-radius:", "px;margin-bottom:", "px;width:100%;}", ""], colors.white, spacing.sm, spacing.sm, breakpointMinWidthValues.tabletMd, spacing.sm, spacing.sm, function (_ref) {
|
|
15
|
+
var $open = _ref.$open;
|
|
16
|
+
return !$open && css(["border-radius:", "px;width:100%;"], spacing.sm);
|
|
17
|
+
});
|
|
12
18
|
export var StyledSplitViewCardAside = /*#__PURE__*/styled.div.withConfig({
|
|
13
19
|
displayName: "StyledSplitViewCardAside",
|
|
14
|
-
componentId: "core-
|
|
15
|
-
})(["background-color:", ";border-left:1px solid ", ";display:flex;flex-direction:column;min-width:400px;transition:all ease 500ms;", ""], colors.white, colors.gray85, function (
|
|
16
|
-
var $open =
|
|
17
|
-
return !$open && css(["border:none;overflow:hidden !important
|
|
20
|
+
componentId: "core-12_10_0__sc-9hrkda-2"
|
|
21
|
+
})(["background-color:", ";border-left:1px solid ", ";border-top-right-radius:", "px;border-bottom-right-radius:", "px;display:flex;flex-direction:column;height:100%;width:40%;min-height:", "px;min-width:400px;transition:all ease 500ms;z-index:2;position:absolute;top:0;right:0;@media screen and (max-width:", "px){min-width:unset;}@media (max-width:", "){box-shadow:0 0 4px 0 rgba(0,0,0,0.25);border:none;border-radius:", "px;position:relative;width:100%;}", " ", ""], colors.white, colors.gray85, spacing.sm, spacing.sm, MIN_CARD_HEIGHT, breakpointRawMinWidthValues.tabletSm, breakpointMinWidthValues.tabletMd, spacing.sm, function (_ref2) {
|
|
22
|
+
var $open = _ref2.$open;
|
|
23
|
+
return !$open && css(["border:none;border-radius:", "px;overflow:hidden !important;@media (min-width:", "){min-width:0;width:0 !important;}@media (max-width:", "){display:none;}"], spacing.sm, breakpointMinWidthValues.tabletMd, breakpointMinWidthValues.tabletMd);
|
|
24
|
+
}, function (_ref3) {
|
|
25
|
+
var $hasShadow = _ref3.$hasShadow;
|
|
26
|
+
return $hasShadow && css(["box-shadow:-2px 0 6px 0 rgba(0,0,0,0.1);"]);
|
|
18
27
|
});
|
|
19
|
-
export var StyledSplitViewCardHeading = /*#__PURE__*/styled.
|
|
28
|
+
export var StyledSplitViewCardHeading = /*#__PURE__*/styled(H2).withConfig({
|
|
20
29
|
displayName: "StyledSplitViewCardHeading",
|
|
21
|
-
componentId: "core-
|
|
22
|
-
})(["overflow:hidden;white-space:nowrap;width:100%;"]);
|
|
30
|
+
componentId: "core-12_10_0__sc-9hrkda-3"
|
|
31
|
+
})(["overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:100%;"]);
|
|
23
32
|
export var StyledSplitViewCardTitle = /*#__PURE__*/styled.div.withConfig({
|
|
24
33
|
displayName: "StyledSplitViewCardTitle",
|
|
25
|
-
componentId: "core-
|
|
26
|
-
})(["display:flex;align-items:center;justify-content:space-between;margin-bottom:", "px;"], spacing.sm);
|
|
34
|
+
componentId: "core-12_10_0__sc-9hrkda-4"
|
|
35
|
+
})(["display:flex;align-items:center;justify-content:space-between;margin-bottom:", "px;min-height:36px;"], spacing.sm);
|
|
27
36
|
export var StyledSplitViewCardHeader = /*#__PURE__*/styled.div.withConfig({
|
|
28
37
|
displayName: "StyledSplitViewCardHeader",
|
|
29
|
-
componentId: "core-
|
|
38
|
+
componentId: "core-12_10_0__sc-9hrkda-5"
|
|
30
39
|
})(["border-bottom:1px solid ", ";display:flex;flex-direction:column;padding:", "px ", "px 0;"], colors.gray85, spacing.lg, spacing.lg);
|
|
31
40
|
export var StyledSplitViewCardBody = /*#__PURE__*/styled.div.withConfig({
|
|
32
41
|
displayName: "StyledSplitViewCardBody",
|
|
33
|
-
componentId: "core-
|
|
34
|
-
})(["
|
|
42
|
+
componentId: "core-12_10_0__sc-9hrkda-6"
|
|
43
|
+
})(["display:flex;flex-direction:column;flex:1;padding:", "px ", "px 0;overflow-y:auto;"], spacing.lg, spacing.lg);
|
|
35
44
|
export var StyledSplitViewCardFooter = /*#__PURE__*/styled.div.withConfig({
|
|
36
45
|
displayName: "StyledSplitViewCardFooter",
|
|
37
|
-
componentId: "core-
|
|
38
|
-
})(["display:flex;align-items:center;justify-content:flex-end;padding:
|
|
46
|
+
componentId: "core-12_10_0__sc-9hrkda-7"
|
|
47
|
+
})(["display:flex;align-items:center;justify-content:flex-end;padding:", "px;", ""], spacing.lg, function (_ref4) {
|
|
48
|
+
var $hasShadow = _ref4.$hasShadow;
|
|
49
|
+
return $hasShadow && css(["box-shadow:0 -4px 6px 0 #0000001a;"]);
|
|
50
|
+
});
|
|
39
51
|
//# sourceMappingURL=SplitViewCard.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SplitViewCard.styles.js","names":["styled","css","colors","spacing","StyledSplitViewCardContainer","div","withConfig","displayName","componentId","
|
|
1
|
+
{"version":3,"file":"SplitViewCard.styles.js","names":["styled","css","breakpointMinWidthValues","breakpointRawMinWidthValues","H2","colors","spacing","MIN_CARD_HEIGHT","StyledSplitViewCardContainer","div","withConfig","displayName","componentId","sm","tabletMd","StyledSplitViewCardMain","white","_ref","$open","StyledSplitViewCardAside","gray85","tabletSm","_ref2","_ref3","$hasShadow","StyledSplitViewCardHeading","StyledSplitViewCardTitle","StyledSplitViewCardHeader","lg","StyledSplitViewCardBody","StyledSplitViewCardFooter","_ref4"],"sources":["../../src/SplitViewCard/SplitViewCard.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport {\n breakpointMinWidthValues,\n breakpointRawMinWidthValues,\n} from '../Grid/Grid.constants'\nimport { H2 } from '../Semantic'\nimport { colors } from '../_styles/colors'\nimport { spacing } from '../_styles/spacing'\n\nconst MIN_CARD_HEIGHT = 364\n\nexport const StyledSplitViewCardContainer = styled.div`\n display: grid;\n grid-template-columns: 1fr auto;\n border-radius: ${spacing.sm}px;\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);\n min-height: ${MIN_CARD_HEIGHT}px;\n position: relative;\n width: 100%;\n\n @media (max-width: ${breakpointMinWidthValues.tabletMd}) {\n box-shadow: none;\n display: flex;\n flex-direction: column;\n width: 100%;\n }\n`\n\nexport const StyledSplitViewCardMain = styled.div<{ $open: boolean }>`\n background-color: ${colors.white};\n border-top-left-radius: ${spacing.sm}px;\n border-bottom-left-radius: ${spacing.sm}px;\n position: relative;\n width: 60%;\n transition: all ease 500ms;\n\n @media (max-width: ${breakpointMinWidthValues.tabletMd}) {\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);\n border-radius: ${spacing.sm}px;\n margin-bottom: ${spacing.sm}px;\n width: 100%;\n }\n\n ${({ $open }) =>\n !$open &&\n css`\n border-radius: ${spacing.sm}px;\n width: 100%;\n `}\n`\n\nexport const StyledSplitViewCardAside = styled.div<{\n $open: boolean\n $hasShadow: boolean\n}>`\n background-color: ${colors.white};\n border-left: 1px solid ${colors.gray85};\n border-top-right-radius: ${spacing.sm}px;\n border-bottom-right-radius: ${spacing.sm}px;\n display: flex;\n flex-direction: column;\n height: 100%;\n width: 40%;\n min-height: ${MIN_CARD_HEIGHT}px;\n min-width: 400px;\n transition: all ease 500ms;\n z-index: 2;\n position: absolute;\n top: 0;\n right: 0;\n\n @media screen and (max-width: ${breakpointRawMinWidthValues.tabletSm}px) {\n min-width: unset;\n }\n\n @media (max-width: ${breakpointMinWidthValues.tabletMd}) {\n box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);\n border: none;\n border-radius: ${spacing.sm}px;\n position: relative;\n width: 100%;\n }\n\n ${({ $open }) =>\n !$open &&\n css`\n border: none;\n border-radius: ${spacing.sm}px;\n overflow: hidden !important;\n\n @media (min-width: ${breakpointMinWidthValues.tabletMd}) {\n min-width: 0;\n width: 0 !important;\n }\n\n @media (max-width: ${breakpointMinWidthValues.tabletMd}) {\n display: none;\n }\n `}\n\n ${({ $hasShadow }) =>\n $hasShadow &&\n css`\n box-shadow: -2px 0 6px 0 rgba(0, 0, 0, 0.1);\n `}\n`\n\nexport const StyledSplitViewCardHeading = styled(H2)`\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n width: 100%;\n`\n\nexport const StyledSplitViewCardTitle = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-bottom: ${spacing.sm}px;\n min-height: 36px;\n`\n\nexport const StyledSplitViewCardHeader = styled.div`\n border-bottom: 1px solid ${colors.gray85};\n display: flex;\n flex-direction: column;\n padding: ${spacing.lg}px ${spacing.lg}px 0;\n`\n\nexport const StyledSplitViewCardBody = styled.div`\n display: flex;\n flex-direction: column;\n flex: 1;\n padding: ${spacing.lg}px ${spacing.lg}px 0;\n overflow-y: auto;\n`\n\nexport const StyledSplitViewCardFooter = styled.div<{ $hasShadow?: boolean }>`\n display: flex;\n align-items: center;\n justify-content: flex-end;\n padding: ${spacing.lg}px;\n\n ${({ $hasShadow }) =>\n $hasShadow &&\n css`\n box-shadow: 0 -4px 6px 0 #0000001a;\n `}\n`\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SACEC,wBAAwB,EACxBC,2BAA2B,QACtB,wBAAwB;AAC/B,SAASC,EAAE,QAAQ,aAAa;AAChC,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,IAAMC,eAAe,GAAG,GAAG;AAE3B,OAAO,IAAMC,4BAA4B,gBAAGR,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,sPAGnCN,OAAO,CAACO,EAAE,EAEbN,eAAe,EAIRL,wBAAwB,CAACY,QAAQ,CAMvD;AAED,OAAO,IAAMC,uBAAuB,gBAAGf,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4QAC3BP,MAAM,CAACW,KAAK,EACNV,OAAO,CAACO,EAAE,EACPP,OAAO,CAACO,EAAE,EAKlBX,wBAAwB,CAACY,QAAQ,EAEnCR,OAAO,CAACO,EAAE,EACVP,OAAO,CAACO,EAAE,EAI3B,UAAAI,IAAA;EAAA,IAAGC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAAA,OACR,CAACA,KAAK,IACNjB,GAAG,uCACgBK,OAAO,CAACO,EAAE,CAE5B;AAAA,EACJ;AAED,OAAO,IAAMM,wBAAwB,gBAAGnB,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,sdAI5BP,MAAM,CAACW,KAAK,EACPX,MAAM,CAACe,MAAM,EACXd,OAAO,CAACO,EAAE,EACPP,OAAO,CAACO,EAAE,EAK1BN,eAAe,EAQGJ,2BAA2B,CAACkB,QAAQ,EAI/CnB,wBAAwB,CAACY,QAAQ,EAGnCR,OAAO,CAACO,EAAE,EAK3B,UAAAS,KAAA;EAAA,IAAGJ,KAAK,GAAAI,KAAA,CAALJ,KAAK;EAAA,OACR,CAACA,KAAK,IACNjB,GAAG,iKAEgBK,OAAO,CAACO,EAAE,EAGNX,wBAAwB,CAACY,QAAQ,EAKjCZ,wBAAwB,CAACY,QAAQ,CAGvD;AAAA,GAED,UAAAS,KAAA;EAAA,IAAGC,UAAU,GAAAD,KAAA,CAAVC,UAAU;EAAA,OACbA,UAAU,IACVvB,GAAG,8CAEF;AAAA,EACJ;AAED,OAAO,IAAMwB,0BAA0B,gBAAGzB,MAAM,CAACI,EAAE,CAAC,CAAAM,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,6EAKnD;AAED,OAAO,IAAMc,wBAAwB,gBAAG1B,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4GAI/BN,OAAO,CAACO,EAAE,CAE5B;AAED,OAAO,IAAMc,yBAAyB,gBAAG3B,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,iGACtBP,MAAM,CAACe,MAAM,EAG7Bd,OAAO,CAACsB,EAAE,EAAMtB,OAAO,CAACsB,EAAE,CACtC;AAED,OAAO,IAAMC,uBAAuB,gBAAG7B,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,2FAIpCN,OAAO,CAACsB,EAAE,EAAMtB,OAAO,CAACsB,EAAE,CAEtC;AAED,OAAO,IAAME,yBAAyB,gBAAG9B,MAAM,CAACS,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qFAItCN,OAAO,CAACsB,EAAE,EAEnB,UAAAG,KAAA;EAAA,IAAGP,UAAU,GAAAO,KAAA,CAAVP,UAAU;EAAA,OACbA,UAAU,IACVvB,GAAG,wCAEF;AAAA,EACJ"}
|
|
@@ -2,24 +2,47 @@ import type { Props } from '../_utils/types';
|
|
|
2
2
|
export interface SplitViewCardContextAPI {
|
|
3
3
|
/**
|
|
4
4
|
* If aside card is opened or not
|
|
5
|
-
* @since 12.
|
|
5
|
+
* @since 12.9.0
|
|
6
6
|
*/
|
|
7
7
|
open: boolean;
|
|
8
8
|
/**
|
|
9
9
|
* Open aside card
|
|
10
|
-
* @since 12.
|
|
10
|
+
* @since 12.9.0
|
|
11
11
|
*/
|
|
12
12
|
onOpen: () => void;
|
|
13
13
|
/**
|
|
14
14
|
* Close aside card
|
|
15
|
-
* @since 12.
|
|
15
|
+
* @since 12.9.0
|
|
16
16
|
*/
|
|
17
17
|
onClose: () => void;
|
|
18
|
+
/**
|
|
19
|
+
* Indicates whether the SplitViewCard can be closed
|
|
20
|
+
* */
|
|
21
|
+
isClosable?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Indicates whether the user is actively scrolling within the SplitViewCard.Body
|
|
24
|
+
* @since 12.9.0
|
|
25
|
+
*/
|
|
26
|
+
isScrolling: boolean;
|
|
27
|
+
/**
|
|
28
|
+
* Callback to update the isScrolling flag
|
|
29
|
+
* @since 12.9.0
|
|
30
|
+
*/
|
|
31
|
+
setIsScrolling: (isScrolling: boolean) => void;
|
|
18
32
|
}
|
|
19
33
|
export interface SplitViewCardProps extends Props {
|
|
20
34
|
/**
|
|
21
|
-
*
|
|
22
|
-
*
|
|
35
|
+
* Indicates whether the SplitViewCard can be closed
|
|
36
|
+
* */
|
|
37
|
+
isClosable?: boolean;
|
|
38
|
+
/**
|
|
39
|
+
* If aside card is initially opened or not
|
|
40
|
+
* @since 12.9.0
|
|
23
41
|
*/
|
|
24
|
-
|
|
42
|
+
isInitiallyOpen?: boolean;
|
|
43
|
+
/**
|
|
44
|
+
* Callback for custom close event
|
|
45
|
+
* @since 12.9.0
|
|
46
|
+
*/
|
|
47
|
+
onClose?: () => void;
|
|
25
48
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SplitViewCard.types.js","names":[],"sources":["../../src/SplitViewCard/SplitViewCard.types.ts"],"sourcesContent":["import type { Props } from '../_utils/types'\n\nexport interface SplitViewCardContextAPI {\n /**\n * If aside card is opened or not\n * @since 12.
|
|
1
|
+
{"version":3,"file":"SplitViewCard.types.js","names":[],"sources":["../../src/SplitViewCard/SplitViewCard.types.ts"],"sourcesContent":["import type { Props } from '../_utils/types'\n\nexport interface SplitViewCardContextAPI {\n /**\n * If aside card is opened or not\n * @since 12.9.0\n */\n open: boolean\n /**\n * Open aside card\n * @since 12.9.0\n */\n onOpen: () => void\n /**\n * Close aside card\n * @since 12.9.0\n */\n onClose: () => void\n /**\n * Indicates whether the SplitViewCard can be closed\n * */\n isClosable?: boolean\n /**\n * Indicates whether the user is actively scrolling within the SplitViewCard.Body\n * @since 12.9.0\n */\n isScrolling: boolean\n\n /**\n * Callback to update the isScrolling flag\n * @since 12.9.0\n */\n setIsScrolling: (isScrolling: boolean) => void\n}\n\nexport interface SplitViewCardProps extends Props {\n /**\n * Indicates whether the SplitViewCard can be closed\n * */\n isClosable?: boolean\n /**\n * If aside card is initially opened or not\n * @since 12.9.0\n */\n isInitiallyOpen?: boolean\n /**\n * Callback for custom close event\n * @since 12.9.0\n */\n onClose?: () => void\n}\n"],"mappings":""}
|
|
@@ -1,4 +1,2 @@
|
|
|
1
1
|
export { SplitViewCard } from './SplitViewCard';
|
|
2
|
-
export { SplitViewCardContext, SplitViewCardContextProvider, } from './SplitViewCard.context';
|
|
3
2
|
export type { SplitViewCardContextAPI, SplitViewCardProps, } from './SplitViewCard.types';
|
|
4
|
-
export { useSplitViewCard } from './useSplitViewCard';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["SplitViewCard"
|
|
1
|
+
{"version":3,"file":"index.js","names":["SplitViewCard"],"sources":["../../src/SplitViewCard/index.ts"],"sourcesContent":["export { SplitViewCard } from './SplitViewCard'\nexport type {\n SplitViewCardContextAPI,\n SplitViewCardProps,\n} from './SplitViewCard.types'\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,iBAAiB"}
|
|
@@ -3,6 +3,6 @@ import { Popover } from '../Popover';
|
|
|
3
3
|
import { spacing } from '../_styles/spacing';
|
|
4
4
|
export var StyledFilterPresetPopoverContent = /*#__PURE__*/styled(Popover.Content).withConfig({
|
|
5
5
|
displayName: "StyledFilterPresetPopoverContent",
|
|
6
|
-
componentId: "core-
|
|
6
|
+
componentId: "core-12_10_0__sc-y5qv7b-0"
|
|
7
7
|
})(["padding:", "px ", "px;"], spacing.sm, spacing.lg);
|
|
8
8
|
//# sourceMappingURL=SuperSelect.presets.styles.js.map
|
|
@@ -22,40 +22,40 @@ var styledSelectButtonDefaultWidth = 248;
|
|
|
22
22
|
export var extendedSelectMenuWidth = 360;
|
|
23
23
|
export var PillSelectOptionWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
24
24
|
displayName: "PillSelectOptionWrapper",
|
|
25
|
-
componentId: "core-
|
|
25
|
+
componentId: "core-12_10_0__sc-1uf5708-0"
|
|
26
26
|
})(["display:flex;align-items:center;justify-content:space-between;padding:", "px ", "px;"], spacing.xs, spacing.lg);
|
|
27
27
|
export var PillSelectLabel = /*#__PURE__*/styled(Pill).withConfig({
|
|
28
28
|
displayName: "PillSelectLabel",
|
|
29
|
-
componentId: "core-
|
|
29
|
+
componentId: "core-12_10_0__sc-1uf5708-1"
|
|
30
30
|
})(["", ""], getEllipsis);
|
|
31
31
|
export var PillSelectLabelWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
32
32
|
displayName: "PillSelectLabelWrapper",
|
|
33
|
-
componentId: "core-
|
|
33
|
+
componentId: "core-12_10_0__sc-1uf5708-2"
|
|
34
34
|
})(["display:flex;max-width:100%;pointer-events:auto;", ""], function (_ref) {
|
|
35
35
|
var disabled = _ref.disabled;
|
|
36
36
|
return disabled && css(["pointer-events:none;"]);
|
|
37
37
|
});
|
|
38
38
|
export var StyledCheckboxContainer = /*#__PURE__*/styled.div.withConfig({
|
|
39
39
|
displayName: "StyledCheckboxContainer",
|
|
40
|
-
componentId: "core-
|
|
40
|
+
componentId: "core-12_10_0__sc-1uf5708-3"
|
|
41
41
|
})(["padding-left:", "px;"], spacing.lg);
|
|
42
42
|
export var StyledCheckmarkContainer = /*#__PURE__*/styled.div.withConfig({
|
|
43
43
|
displayName: "StyledCheckmarkContainer",
|
|
44
|
-
componentId: "core-
|
|
44
|
+
componentId: "core-12_10_0__sc-1uf5708-4"
|
|
45
45
|
})(["align-items:center;color:", ";display:inline-flex;flex-shrink:0;padding:0 ", "px 0 ", "px;"], colors.blue50, spacing.lg, spacing.sm);
|
|
46
46
|
|
|
47
47
|
// Do not merge with StyledMenu, needed for max-height working in IE
|
|
48
48
|
export var StyledWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
49
49
|
displayName: "StyledWrapper",
|
|
50
|
-
componentId: "core-
|
|
50
|
+
componentId: "core-12_10_0__sc-1uf5708-5"
|
|
51
51
|
})(["display:flex;max-height:inherit;min-width:inherit;outline:none;width:inherit;"]);
|
|
52
52
|
export var StyledMenu = /*#__PURE__*/styled.div.withConfig({
|
|
53
53
|
displayName: "StyledMenu",
|
|
54
|
-
componentId: "core-
|
|
54
|
+
componentId: "core-12_10_0__sc-1uf5708-6"
|
|
55
55
|
})(["display:flex;flex-direction:column;outline:0;width:100%;"]);
|
|
56
56
|
export var StyledOptions = /*#__PURE__*/styled.div.withConfig({
|
|
57
57
|
displayName: "StyledOptions",
|
|
58
|
-
componentId: "core-
|
|
58
|
+
componentId: "core-12_10_0__sc-1uf5708-7"
|
|
59
59
|
})(["flex-basis:auto;flex-grow:1;flex-shrink:1;min-height:", "px;", ";padding:", "px 0;position:relative;overflow:hidden;&:focus{", " margin:-1px;}"], optionMinHeight, function (_ref2) {
|
|
60
60
|
var _ref2$$scrollable = _ref2.$scrollable,
|
|
61
61
|
$scrollable = _ref2$$scrollable === void 0 ? true : _ref2$$scrollable;
|
|
@@ -63,53 +63,53 @@ export var StyledOptions = /*#__PURE__*/styled.div.withConfig({
|
|
|
63
63
|
}, spacing.sm, getFocus());
|
|
64
64
|
export var StyledItemContent = /*#__PURE__*/styled.div.withConfig({
|
|
65
65
|
displayName: "StyledItemContent",
|
|
66
|
-
componentId: "core-
|
|
66
|
+
componentId: "core-12_10_0__sc-1uf5708-8"
|
|
67
67
|
})(["display:flex;flex-direction:row;align-items:center;"]);
|
|
68
68
|
export var StyledOptionGroupLabel = /*#__PURE__*/styled.div.withConfig({
|
|
69
69
|
displayName: "StyledOptionGroupLabel",
|
|
70
|
-
componentId: "core-
|
|
70
|
+
componentId: "core-12_10_0__sc-1uf5708-9"
|
|
71
71
|
})(["padding:", "px 0 ", "px ", "px;"], spacing.md, spacing.xs, spacing.lg);
|
|
72
72
|
export var StyledItemLabel = /*#__PURE__*/styled.div.withConfig({
|
|
73
73
|
displayName: "StyledItemLabel",
|
|
74
|
-
componentId: "core-
|
|
74
|
+
componentId: "core-12_10_0__sc-1uf5708-10"
|
|
75
75
|
})(["", ""], function (_ref3) {
|
|
76
76
|
var $draggable = _ref3.$draggable;
|
|
77
77
|
return css(["padding:", "px ", "px;overflow-wrap:anywhere;"], spacing.xs, $draggable ? 0 : spacing.lg);
|
|
78
78
|
});
|
|
79
79
|
export var StyledDraggableWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
80
80
|
displayName: "StyledDraggableWrapper",
|
|
81
|
-
componentId: "core-
|
|
81
|
+
componentId: "core-12_10_0__sc-1uf5708-11"
|
|
82
82
|
})(["display:flex;width:100%;align-items:center;"]);
|
|
83
83
|
export var StyledGrip = /*#__PURE__*/styled.div.withConfig({
|
|
84
84
|
displayName: "StyledGrip",
|
|
85
|
-
componentId: "core-
|
|
85
|
+
componentId: "core-12_10_0__sc-1uf5708-12"
|
|
86
86
|
})(["padding:0 2px;height:24px;visibility:hidden;"]);
|
|
87
87
|
export var StyledFooter = /*#__PURE__*/styled(Box).withConfig({
|
|
88
88
|
displayName: "StyledFooter",
|
|
89
|
-
componentId: "core-
|
|
89
|
+
componentId: "core-12_10_0__sc-1uf5708-13"
|
|
90
90
|
})(["border-top:1px solid ", ";"], colors.gray85);
|
|
91
91
|
export var StyledHeader = /*#__PURE__*/styled.div.withConfig({
|
|
92
92
|
displayName: "StyledHeader",
|
|
93
|
-
componentId: "core-
|
|
93
|
+
componentId: "core-12_10_0__sc-1uf5708-14"
|
|
94
94
|
})([""]);
|
|
95
95
|
export var StyledEmptyMessage = /*#__PURE__*/styled.div.withConfig({
|
|
96
96
|
displayName: "StyledEmptyMessage",
|
|
97
|
-
componentId: "core-
|
|
97
|
+
componentId: "core-12_10_0__sc-1uf5708-15"
|
|
98
98
|
})(["", ";padding:", "px ", "px;color:", ";"], getTypographyIntent('body'), spacing.md, spacing.lg, colors.gray45);
|
|
99
99
|
export var StyledSearchContainer = /*#__PURE__*/styled.div.withConfig({
|
|
100
100
|
displayName: "StyledSearchContainer",
|
|
101
|
-
componentId: "core-
|
|
101
|
+
componentId: "core-12_10_0__sc-1uf5708-16"
|
|
102
102
|
})(["padding:", "px ", "px ", "px;", " > *{pointer-events:none;}"], spacing.lg, spacing.lg, spacing.sm, StyledButton);
|
|
103
103
|
export var StyledGroup = /*#__PURE__*/styled.div.withConfig({
|
|
104
104
|
displayName: "StyledGroup",
|
|
105
|
-
componentId: "core-
|
|
105
|
+
componentId: "core-12_10_0__sc-1uf5708-17"
|
|
106
106
|
})(["", " color:", ";cursor:", ";font-weight:", ";padding:", "px ", "px;&:not(:first-child){padding-top:", "px;}&&{padding:0;}", "{padding:", "px ", " px;}&:not(:first-child){", "{padding-top:", " px;}}"], getTypographyIntent('body'), colors.gray15, function (_ref4) {
|
|
107
107
|
var $clickable = _ref4.$clickable;
|
|
108
108
|
return $clickable ? 'pointer' : 'default';
|
|
109
109
|
}, typographyWeights.semibold, spacing.xs, spacing.lg, spacing.md + spacing.xs, StyledOptionGroupLabel, spacing.xs, spacing.lg, StyledOptionGroupLabel, spacing.md + spacing.xs);
|
|
110
110
|
export var StyledItem = /*#__PURE__*/styled.div.withConfig({
|
|
111
111
|
displayName: "StyledItem",
|
|
112
|
-
componentId: "core-
|
|
112
|
+
componentId: "core-12_10_0__sc-1uf5708-18"
|
|
113
113
|
})(["", ";align-items:center;cursor:pointer;list-style-type:none;display:flex;padding:0;", " ", " ", " a{color:", ";display:block;margin:-", "px -", "px;padding:", "px ", "px;text-decoration:none;&:hover{color:", ";text-decoration:none;}}&[data-highlighted='true']{background-color:", ";}", " &:hover,&:active{", "{visibility:visible;}}", "{color:inherit;cursor:pointer;}", " ", " ", ""], getTypographyIntent('body'), function (_ref5) {
|
|
114
114
|
var $emptyMinHeight = _ref5.$emptyMinHeight;
|
|
115
115
|
return css(["&:empty{min-height:", "px;}"], $emptyMinHeight);
|
|
@@ -147,50 +147,50 @@ export var StyledItem = /*#__PURE__*/styled.div.withConfig({
|
|
|
147
147
|
});
|
|
148
148
|
export var StyledDroppable = /*#__PURE__*/styled.div.withConfig({
|
|
149
149
|
displayName: "StyledDroppable",
|
|
150
|
-
componentId: "core-
|
|
150
|
+
componentId: "core-12_10_0__sc-1uf5708-19"
|
|
151
151
|
})(["", ",", "{padding-left:28px;}"], StyledGroup, StyledItem);
|
|
152
152
|
export var StyledSelectMenu = /*#__PURE__*/styled(Card).withConfig({
|
|
153
153
|
displayName: "StyledSelectMenu",
|
|
154
|
-
componentId: "core-
|
|
154
|
+
componentId: "core-12_10_0__sc-1uf5708-20"
|
|
155
155
|
})(["display:flex;max-height:40vh;max-width:", "px;min-width:inherit;"], styledSelectButtonDefaultWidth);
|
|
156
156
|
export var StyledLabel = /*#__PURE__*/styled.div.withConfig({
|
|
157
157
|
displayName: "StyledLabel",
|
|
158
|
-
componentId: "core-
|
|
158
|
+
componentId: "core-12_10_0__sc-1uf5708-21"
|
|
159
159
|
})(["", " flex-grow:1;margin-right:", "px;outline:none;pointer-events:", ";user-select:none;"], getEllipsis(), spacing.sm, function (_ref12) {
|
|
160
160
|
var $hoverable = _ref12.$hoverable;
|
|
161
161
|
return $hoverable ? 'initial' : 'none';
|
|
162
162
|
});
|
|
163
163
|
export var StyledIndicators = /*#__PURE__*/styled.div.withConfig({
|
|
164
164
|
displayName: "StyledIndicators",
|
|
165
|
-
componentId: "core-
|
|
165
|
+
componentId: "core-12_10_0__sc-1uf5708-22"
|
|
166
166
|
})(["align-items:center;align-self:flex-start;display:flex;height:34px;justify-content:flex-end;margin-left:", "px;min-width:40px;width:40px;"], spacing.xs);
|
|
167
167
|
export var StyledClearIcon = /*#__PURE__*/styled(Button).withConfig({
|
|
168
168
|
displayName: "StyledClearIcon",
|
|
169
|
-
componentId: "core-
|
|
169
|
+
componentId: "core-12_10_0__sc-1uf5708-23"
|
|
170
170
|
})([""]);
|
|
171
171
|
export var StyledSpinner = /*#__PURE__*/styled.div.withConfig({
|
|
172
172
|
displayName: "StyledSpinner",
|
|
173
|
-
componentId: "core-
|
|
173
|
+
componentId: "core-12_10_0__sc-1uf5708-24"
|
|
174
174
|
})(["align-items:center;display:flex;flex:0 0 auto;justify-content:center;line-height:0;"]);
|
|
175
175
|
export var StyledArrowContainer = /*#__PURE__*/styled.div.withConfig({
|
|
176
176
|
displayName: "StyledArrowContainer",
|
|
177
|
-
componentId: "core-
|
|
177
|
+
componentId: "core-12_10_0__sc-1uf5708-25"
|
|
178
178
|
})(["align-items:center;display:inline-flex;height:16px;justify-content:flex-end;margin-left:", "px;width:8px;"], spacing.sm);
|
|
179
179
|
export var StyledArrow = /*#__PURE__*/styled.span.withConfig({
|
|
180
180
|
displayName: "StyledArrow",
|
|
181
|
-
componentId: "core-
|
|
181
|
+
componentId: "core-12_10_0__sc-1uf5708-26"
|
|
182
182
|
})(["display:inline-flex;svg{fill:", ";}"], colors.gray45);
|
|
183
183
|
export var StyledArrowOutline = /*#__PURE__*/styled.polygon.withConfig({
|
|
184
184
|
displayName: "StyledArrowOutline",
|
|
185
|
-
componentId: "core-
|
|
185
|
+
componentId: "core-12_10_0__sc-1uf5708-27"
|
|
186
186
|
})([""]);
|
|
187
187
|
export var StyledArrowFill = /*#__PURE__*/styled.polygon.withConfig({
|
|
188
188
|
displayName: "StyledArrowFill",
|
|
189
|
-
componentId: "core-
|
|
189
|
+
componentId: "core-12_10_0__sc-1uf5708-28"
|
|
190
190
|
})([""]);
|
|
191
191
|
export var StyledTrigger = /*#__PURE__*/styled.div.withConfig({
|
|
192
192
|
displayName: "StyledTrigger",
|
|
193
|
-
componentId: "core-
|
|
193
|
+
componentId: "core-12_10_0__sc-1uf5708-29"
|
|
194
194
|
})(["", " align-items:center;background-color:", ";border-color:", ";border-radius:", "px;border-style:solid;border-width:1px;color:", ";cursor:pointer;display:inline-flex;height:36px;min-height:36px;outline:none;padding:0 ", "px;position:relative;white-space:nowrap;width:", ";&::placeholder{border-color:", ";}&:hover,&:active,&[data-qa=", "]{background-color:", ";border-color:", ";color:", ";}&:focus,&[data-qa=", "]{", " ", "{stroke:", ";}}", " ", " ", " ", " ", " ", " ", "}"], getTypographyIntent('body'), colors.white, colors.gray70, borderRadius.md, colors.gray15, spacing.md, function (_ref13) {
|
|
195
195
|
var $block = _ref13.$block;
|
|
196
196
|
return $block ? '100%' : "".concat(styledSelectButtonDefaultWidth, "px");
|
|
@@ -225,31 +225,31 @@ export var StyledTrigger = /*#__PURE__*/styled.div.withConfig({
|
|
|
225
225
|
});
|
|
226
226
|
export var StyledOverlay = /*#__PURE__*/styled(Card).withConfig({
|
|
227
227
|
displayName: "StyledOverlay",
|
|
228
|
-
componentId: "core-
|
|
228
|
+
componentId: "core-12_10_0__sc-1uf5708-30"
|
|
229
229
|
})(["display:flex;flex-direction:column;"]);
|
|
230
230
|
export var StyledVirtuoso = /*#__PURE__*/styled(Virtuoso).withConfig({
|
|
231
231
|
displayName: "StyledVirtuoso",
|
|
232
|
-
componentId: "core-
|
|
232
|
+
componentId: "core-12_10_0__sc-1uf5708-31"
|
|
233
233
|
})(["flex:1 1 auto;"]);
|
|
234
234
|
export var StyledEllipses = /*#__PURE__*/styled.div.withConfig({
|
|
235
235
|
displayName: "StyledEllipses",
|
|
236
|
-
componentId: "core-
|
|
236
|
+
componentId: "core-12_10_0__sc-1uf5708-32"
|
|
237
237
|
})(["", " display:inline-flex;> div{display:inline-flex;width:100%;}"], getEllipsis());
|
|
238
238
|
export var StyledMultiValueContainer = /*#__PURE__*/styled.div.withConfig({
|
|
239
239
|
displayName: "StyledMultiValueContainer",
|
|
240
|
-
componentId: "core-
|
|
240
|
+
componentId: "core-12_10_0__sc-1uf5708-33"
|
|
241
241
|
})(["display:flex;flex-wrap:wrap;margin-bottom:2px;margin-right:", "px;margin-top:2px;min-width:0;width:100%;"], spacing.xs);
|
|
242
242
|
export var StyledMultiValue = /*#__PURE__*/styled.div.withConfig({
|
|
243
243
|
displayName: "StyledMultiValue",
|
|
244
|
-
componentId: "core-
|
|
244
|
+
componentId: "core-12_10_0__sc-1uf5708-34"
|
|
245
245
|
})(["margin-bottom:2px;margin-right:", "px;margin-top:2px;flex:0 1 auto;> div{max-width:178px;width:100%;}"], spacing.xs);
|
|
246
246
|
export var StyledMultiInputContainer = /*#__PURE__*/styled.div.withConfig({
|
|
247
247
|
displayName: "StyledMultiInputContainer",
|
|
248
|
-
componentId: "core-
|
|
248
|
+
componentId: "core-12_10_0__sc-1uf5708-35"
|
|
249
249
|
})(["margin-bottom:2px;margin-right:", "px;margin-top:2px;flex:1;max-width:100%;min-width:24px;"], spacing.xs);
|
|
250
250
|
export var StyledMultiInput = /*#__PURE__*/styled.input.withConfig({
|
|
251
251
|
displayName: "StyledMultiInput",
|
|
252
|
-
componentId: "core-
|
|
252
|
+
componentId: "core-12_10_0__sc-1uf5708-36"
|
|
253
253
|
})(["background-color:transparent;border-width:0;font-family:inherit;padding:0;height:24px;width:100%;", " ", " &::-ms-clear{display:none;}&:focus{box-shadow:none;outline:none;}&::placeholder{color:", ";}"], getTypographyIntent('body'), function (_ref21) {
|
|
254
254
|
var $isNavigatingTokens = _ref21.$isNavigatingTokens;
|
|
255
255
|
return $isNavigatingTokens && css(["color:transparent;"]);
|
|
@@ -8,19 +8,19 @@ var trackWidth = 36;
|
|
|
8
8
|
var toggleSize = 16;
|
|
9
9
|
export var StyledTrack = /*#__PURE__*/styled.div.withConfig({
|
|
10
10
|
displayName: "StyledTrack",
|
|
11
|
-
componentId: "core-
|
|
11
|
+
componentId: "core-12_10_0__sc-mwn4kg-0"
|
|
12
12
|
})(["background-color:", ";border-radius:", "px;height:", "px;width:", "px;position:relative;transition:0.2s;"], colors.gray70, trackHeight, trackHeight, trackWidth);
|
|
13
13
|
export var StyledToggle = /*#__PURE__*/styled.span.withConfig({
|
|
14
14
|
displayName: "StyledToggle",
|
|
15
|
-
componentId: "core-
|
|
15
|
+
componentId: "core-12_10_0__sc-mwn4kg-1"
|
|
16
16
|
})(["background-color:", ";border-radius:50%;bottom:2px;height:", "px;left:2px;position:absolute;transition:all 0.2s;width:", "px;"], colors.white, toggleSize, toggleSize);
|
|
17
17
|
export var StyledSwitchLabel = /*#__PURE__*/styled.span.withConfig({
|
|
18
18
|
displayName: "StyledSwitchLabel",
|
|
19
|
-
componentId: "core-
|
|
19
|
+
componentId: "core-12_10_0__sc-mwn4kg-2"
|
|
20
20
|
})(["", " padding-left:", "px;user-select:none;"], getTypographyIntent('body'), spacing.md);
|
|
21
21
|
export var StyledSwitchContainer = /*#__PURE__*/styled.label.withConfig({
|
|
22
22
|
displayName: "StyledSwitchContainer",
|
|
23
|
-
componentId: "core-
|
|
23
|
+
componentId: "core-12_10_0__sc-mwn4kg-3"
|
|
24
24
|
})(["cursor:pointer;display:grid;grid-template-columns:", "px 1fr;position:relative;& + &{margin-top:", "px;}", " ", " ", ""], trackWidth, spacing.md, function (_ref) {
|
|
25
25
|
var $checked = _ref.$checked;
|
|
26
26
|
return $checked && css(["", "{background-color:", ";", "{transform:translateX(", "px);}}"], StyledTrack, colors.blue50, StyledToggle, spacing.lg);
|