@elliemae/ds-mobile 3.12.0-rc.2 → 3.12.0-rc.21
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/cjs/Accordion/DSMobileAccordion.js +2 -9
- package/dist/cjs/Accordion/DSMobileAccordion.js.map +1 -1
- package/dist/cjs/CategoryBox/CategoryBox.js +11 -18
- package/dist/cjs/CategoryBox/CategoryBox.js.map +2 -2
- package/dist/cjs/CollectionBox/CollectionBox.js +8 -30
- package/dist/cjs/CollectionBox/CollectionBox.js.map +1 -1
- package/dist/cjs/FullPageContainer/FullPageContainer.js +1 -6
- package/dist/cjs/FullPageContainer/FullPageContainer.js.map +1 -1
- package/dist/cjs/FullPageContainer/FullPageContainerScroll.js +1 -6
- package/dist/cjs/FullPageContainer/FullPageContainerScroll.js.map +1 -1
- package/dist/cjs/GlobalHeader/MobileGlobalHeader.js +42 -61
- package/dist/cjs/GlobalHeader/MobileGlobalHeader.js.map +1 -1
- package/dist/cjs/GroupBox/GroupBox.js +10 -17
- package/dist/cjs/GroupBox/GroupBox.js.map +1 -1
- package/dist/cjs/Icons/EM_logo.js +35 -34
- package/dist/cjs/Icons/EM_logo.js.map +1 -1
- package/dist/cjs/InfiniteLoader/Infiniteloader.js +7 -18
- package/dist/cjs/InfiniteLoader/Infiniteloader.js.map +1 -1
- package/dist/cjs/InfiniteLoader/Loader.js +1 -7
- package/dist/cjs/InfiniteLoader/Loader.js.map +1 -1
- package/dist/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js +25 -19
- package/dist/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js.map +1 -1
- package/dist/cjs/LoadingPage/Page.js +6 -16
- package/dist/cjs/LoadingPage/Page.js.map +1 -1
- package/dist/cjs/MobileActionToolbar/MobileActionToolbar.js +1 -6
- package/dist/cjs/MobileActionToolbar/MobileActionToolbar.js.map +1 -1
- package/dist/cjs/MobileActionToolbar/MobileActionToolbarItem.js +1 -6
- package/dist/cjs/MobileActionToolbar/MobileActionToolbarItem.js.map +1 -1
- package/dist/cjs/MobileBanner/DSMobileBannerDefinitions.js +32 -0
- package/dist/cjs/MobileBanner/DSMobileBannerDefinitions.js.map +7 -0
- package/dist/cjs/MobileBanner/MobileBanner.js +30 -51
- package/dist/cjs/MobileBanner/MobileBanner.js.map +2 -2
- package/dist/cjs/MobileBanner/config/useMobileBanner.js +2 -1
- package/dist/cjs/MobileBanner/config/useMobileBanner.js.map +2 -2
- package/dist/cjs/MobileBanner/utils/icons.js +4 -20
- package/dist/cjs/MobileBanner/utils/icons.js.map +1 -1
- package/dist/cjs/MobileCard/ActionAddon.js +1 -7
- package/dist/cjs/MobileCard/ActionAddon.js.map +1 -1
- package/dist/cjs/MobileCard/Card.js +66 -98
- package/dist/cjs/MobileCard/Card.js.map +1 -1
- package/dist/cjs/MobileCard/CardIcons.js +1 -9
- package/dist/cjs/MobileCard/CardIcons.js.map +1 -1
- package/dist/cjs/MobileCard/ExpandChevron.js +1 -9
- package/dist/cjs/MobileCard/ExpandChevron.js.map +1 -1
- package/dist/cjs/MobileCard/ExpandableRegion.js +10 -10
- package/dist/cjs/MobileCard/ExpandableRegion.js.map +1 -1
- package/dist/cjs/MobileCard/Group.js +15 -31
- package/dist/cjs/MobileCard/Group.js.map +1 -1
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js +38 -70
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js.map +1 -1
- package/dist/cjs/MobileContextMenu/MobileContextMenuGroup.js +21 -29
- package/dist/cjs/MobileContextMenu/MobileContextMenuGroup.js.map +1 -1
- package/dist/cjs/MobileContextMenu/MobileContextMenuItem.js +41 -73
- package/dist/cjs/MobileContextMenu/MobileContextMenuItem.js.map +1 -1
- package/dist/cjs/MobileDatePicker/Input.js +1 -4
- package/dist/cjs/MobileDatePicker/Input.js.map +1 -1
- package/dist/cjs/MobileDatePicker/MobileDatePicker.js +42 -33
- package/dist/cjs/MobileDatePicker/MobileDatePicker.js.map +1 -1
- package/dist/cjs/MobileDropdownMenu/MobileDropdownInput.js +5 -19
- package/dist/cjs/MobileDropdownMenu/MobileDropdownInput.js.map +1 -1
- package/dist/cjs/MobileDropdownMenu/MobileDropdownMenu.js +29 -21
- package/dist/cjs/MobileDropdownMenu/MobileDropdownMenu.js.map +1 -1
- package/dist/cjs/MobileEmtpyState/MobileEmptyState.js +4 -11
- package/dist/cjs/MobileEmtpyState/MobileEmptyState.js.map +1 -1
- package/dist/cjs/MobileFilterbar/Filterbar.js +4 -15
- package/dist/cjs/MobileFilterbar/Filterbar.js.map +1 -1
- package/dist/cjs/MobileFilterbar/FilterbarItem.js +1 -9
- package/dist/cjs/MobileFilterbar/FilterbarItem.js.map +1 -1
- package/dist/cjs/MobileFilterbar/FilterbarSort.js +4 -17
- package/dist/cjs/MobileFilterbar/FilterbarSort.js.map +1 -1
- package/dist/cjs/MobileFooter/Action.js +15 -22
- package/dist/cjs/MobileFooter/Action.js.map +1 -1
- package/dist/cjs/MobileFooter/Footer.js +6 -7
- package/dist/cjs/MobileFooter/Footer.js.map +1 -1
- package/dist/cjs/MobileFooter/Text.js +1 -3
- package/dist/cjs/MobileFooter/Text.js.map +1 -1
- package/dist/cjs/MobileListItem/MobileListItem.js +17 -26
- package/dist/cjs/MobileListItem/MobileListItem.js.map +1 -1
- package/dist/cjs/MobileListItem/MobileListMultipleItem.js +14 -17
- package/dist/cjs/MobileListItem/MobileListMultipleItem.js.map +1 -1
- package/dist/cjs/MobileListItem/MobileListSeparator.js +4 -23
- package/dist/cjs/MobileListItem/MobileListSeparator.js.map +1 -1
- package/dist/cjs/MobileListItem/MobileListSingleItem.js +16 -23
- package/dist/cjs/MobileListItem/MobileListSingleItem.js.map +1 -1
- package/dist/cjs/MobilePageHeader/MobilePageHeader.js +82 -130
- package/dist/cjs/MobilePageHeader/MobilePageHeader.js.map +1 -1
- package/dist/cjs/MobileSelectList/MobileSelectList.js +45 -64
- package/dist/cjs/MobileSelectList/MobileSelectList.js.map +1 -1
- package/dist/cjs/MobileSelectList/styled.js +3 -13
- package/dist/cjs/MobileSelectList/styled.js.map +1 -1
- package/dist/cjs/MobileSeparator/Separator.js +1 -3
- package/dist/cjs/MobileSeparator/Separator.js.map +1 -1
- package/dist/cjs/MobileTimePicker/Input.js +1 -4
- package/dist/cjs/MobileTimePicker/Input.js.map +1 -1
- package/dist/cjs/MobileTimePicker/MobileTimePicker.js +41 -32
- package/dist/cjs/MobileTimePicker/MobileTimePicker.js.map +1 -1
- package/dist/cjs/MobileTouchable/MobileTouchable.js +12 -9
- package/dist/cjs/MobileTouchable/MobileTouchable.js.map +1 -1
- package/dist/cjs/Modal/Modal.js +70 -72
- package/dist/cjs/Modal/Modal.js.map +1 -1
- package/dist/cjs/PageFilter/PageFilter.js +12 -38
- package/dist/cjs/PageFilter/PageFilter.js.map +1 -1
- package/dist/cjs/PageForm/PageForm.js +5 -19
- package/dist/cjs/PageForm/PageForm.js.map +1 -1
- package/dist/cjs/PageList/PageList.js +7 -20
- package/dist/cjs/PageList/PageList.js.map +1 -1
- package/dist/cjs/PageSearch/PageSearch.js +5 -25
- package/dist/cjs/PageSearch/PageSearch.js.map +1 -1
- package/dist/cjs/PageSummary/PageSummary.js +8 -26
- package/dist/cjs/PageSummary/PageSummary.js.map +1 -1
- package/dist/cjs/SideNav/SideNav.js +27 -84
- package/dist/cjs/SideNav/SideNav.js.map +1 -1
- package/dist/cjs/SwipeToRefresh/ProgressIndicator.js +17 -33
- package/dist/cjs/SwipeToRefresh/ProgressIndicator.js.map +1 -1
- package/dist/cjs/SwipeToRefresh/ProgressLoader.js +87 -156
- package/dist/cjs/SwipeToRefresh/ProgressLoader.js.map +1 -1
- package/dist/cjs/SwipeToRefresh/SwipeToRefresh.js +24 -22
- package/dist/cjs/SwipeToRefresh/SwipeToRefresh.js.map +1 -1
- package/dist/cjs/Tabs/index.js +2 -9
- package/dist/cjs/Tabs/index.js.map +1 -1
- package/dist/esm/Accordion/DSMobileAccordion.js +2 -9
- package/dist/esm/Accordion/DSMobileAccordion.js.map +1 -1
- package/dist/esm/CategoryBox/CategoryBox.js +11 -18
- package/dist/esm/CategoryBox/CategoryBox.js.map +2 -2
- package/dist/esm/CollectionBox/CollectionBox.js +8 -30
- package/dist/esm/CollectionBox/CollectionBox.js.map +1 -1
- package/dist/esm/FullPageContainer/FullPageContainer.js +1 -6
- package/dist/esm/FullPageContainer/FullPageContainer.js.map +1 -1
- package/dist/esm/FullPageContainer/FullPageContainerScroll.js +1 -6
- package/dist/esm/FullPageContainer/FullPageContainerScroll.js.map +1 -1
- package/dist/esm/GlobalHeader/MobileGlobalHeader.js +42 -61
- package/dist/esm/GlobalHeader/MobileGlobalHeader.js.map +1 -1
- package/dist/esm/GroupBox/GroupBox.js +10 -17
- package/dist/esm/GroupBox/GroupBox.js.map +1 -1
- package/dist/esm/Icons/EM_logo.js +35 -34
- package/dist/esm/Icons/EM_logo.js.map +1 -1
- package/dist/esm/InfiniteLoader/Infiniteloader.js +7 -18
- package/dist/esm/InfiniteLoader/Infiniteloader.js.map +1 -1
- package/dist/esm/InfiniteLoader/Loader.js +1 -7
- package/dist/esm/InfiniteLoader/Loader.js.map +1 -1
- package/dist/esm/InfiniteLoader/VirtualizedInfiniteLoader.js +25 -19
- package/dist/esm/InfiniteLoader/VirtualizedInfiniteLoader.js.map +1 -1
- package/dist/esm/LoadingPage/Page.js +6 -16
- package/dist/esm/LoadingPage/Page.js.map +1 -1
- package/dist/esm/MobileActionToolbar/MobileActionToolbar.js +1 -6
- package/dist/esm/MobileActionToolbar/MobileActionToolbar.js.map +1 -1
- package/dist/esm/MobileActionToolbar/MobileActionToolbarItem.js +1 -6
- package/dist/esm/MobileActionToolbar/MobileActionToolbarItem.js.map +1 -1
- package/dist/esm/MobileBanner/DSMobileBannerDefinitions.js +6 -0
- package/dist/esm/MobileBanner/DSMobileBannerDefinitions.js.map +7 -0
- package/dist/esm/MobileBanner/MobileBanner.js +30 -51
- package/dist/esm/MobileBanner/MobileBanner.js.map +2 -2
- package/dist/esm/MobileBanner/config/useMobileBanner.js +2 -1
- package/dist/esm/MobileBanner/config/useMobileBanner.js.map +2 -2
- package/dist/esm/MobileBanner/utils/icons.js +4 -20
- package/dist/esm/MobileBanner/utils/icons.js.map +1 -1
- package/dist/esm/MobileCard/ActionAddon.js +1 -7
- package/dist/esm/MobileCard/ActionAddon.js.map +1 -1
- package/dist/esm/MobileCard/Card.js +66 -98
- package/dist/esm/MobileCard/Card.js.map +1 -1
- package/dist/esm/MobileCard/CardIcons.js +1 -9
- package/dist/esm/MobileCard/CardIcons.js.map +1 -1
- package/dist/esm/MobileCard/ExpandChevron.js +1 -9
- package/dist/esm/MobileCard/ExpandChevron.js.map +1 -1
- package/dist/esm/MobileCard/ExpandableRegion.js +10 -10
- package/dist/esm/MobileCard/ExpandableRegion.js.map +1 -1
- package/dist/esm/MobileCard/Group.js +15 -31
- package/dist/esm/MobileCard/Group.js.map +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenu.js +38 -70
- package/dist/esm/MobileContextMenu/MobileContextMenu.js.map +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenuGroup.js +21 -29
- package/dist/esm/MobileContextMenu/MobileContextMenuGroup.js.map +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenuItem.js +41 -73
- package/dist/esm/MobileContextMenu/MobileContextMenuItem.js.map +1 -1
- package/dist/esm/MobileDatePicker/Input.js +1 -4
- package/dist/esm/MobileDatePicker/Input.js.map +1 -1
- package/dist/esm/MobileDatePicker/MobileDatePicker.js +42 -33
- package/dist/esm/MobileDatePicker/MobileDatePicker.js.map +1 -1
- package/dist/esm/MobileDropdownMenu/MobileDropdownInput.js +5 -19
- package/dist/esm/MobileDropdownMenu/MobileDropdownInput.js.map +1 -1
- package/dist/esm/MobileDropdownMenu/MobileDropdownMenu.js +29 -21
- package/dist/esm/MobileDropdownMenu/MobileDropdownMenu.js.map +1 -1
- package/dist/esm/MobileEmtpyState/MobileEmptyState.js +4 -11
- package/dist/esm/MobileEmtpyState/MobileEmptyState.js.map +1 -1
- package/dist/esm/MobileFilterbar/Filterbar.js +4 -15
- package/dist/esm/MobileFilterbar/Filterbar.js.map +1 -1
- package/dist/esm/MobileFilterbar/FilterbarItem.js +1 -9
- package/dist/esm/MobileFilterbar/FilterbarItem.js.map +1 -1
- package/dist/esm/MobileFilterbar/FilterbarSort.js +4 -17
- package/dist/esm/MobileFilterbar/FilterbarSort.js.map +1 -1
- package/dist/esm/MobileFooter/Action.js +15 -22
- package/dist/esm/MobileFooter/Action.js.map +1 -1
- package/dist/esm/MobileFooter/Footer.js +6 -7
- package/dist/esm/MobileFooter/Footer.js.map +1 -1
- package/dist/esm/MobileFooter/Text.js +1 -3
- package/dist/esm/MobileFooter/Text.js.map +1 -1
- package/dist/esm/MobileListItem/MobileListItem.js +17 -26
- package/dist/esm/MobileListItem/MobileListItem.js.map +1 -1
- package/dist/esm/MobileListItem/MobileListMultipleItem.js +14 -17
- package/dist/esm/MobileListItem/MobileListMultipleItem.js.map +1 -1
- package/dist/esm/MobileListItem/MobileListSeparator.js +4 -23
- package/dist/esm/MobileListItem/MobileListSeparator.js.map +1 -1
- package/dist/esm/MobileListItem/MobileListSingleItem.js +16 -23
- package/dist/esm/MobileListItem/MobileListSingleItem.js.map +1 -1
- package/dist/esm/MobilePageHeader/MobilePageHeader.js +82 -130
- package/dist/esm/MobilePageHeader/MobilePageHeader.js.map +1 -1
- package/dist/esm/MobileSelectList/MobileSelectList.js +45 -64
- package/dist/esm/MobileSelectList/MobileSelectList.js.map +1 -1
- package/dist/esm/MobileSelectList/styled.js +3 -13
- package/dist/esm/MobileSelectList/styled.js.map +1 -1
- package/dist/esm/MobileSeparator/Separator.js +1 -3
- package/dist/esm/MobileSeparator/Separator.js.map +1 -1
- package/dist/esm/MobileTimePicker/Input.js +1 -4
- package/dist/esm/MobileTimePicker/Input.js.map +1 -1
- package/dist/esm/MobileTimePicker/MobileTimePicker.js +41 -32
- package/dist/esm/MobileTimePicker/MobileTimePicker.js.map +1 -1
- package/dist/esm/MobileTouchable/MobileTouchable.js +12 -9
- package/dist/esm/MobileTouchable/MobileTouchable.js.map +1 -1
- package/dist/esm/Modal/Modal.js +70 -72
- package/dist/esm/Modal/Modal.js.map +1 -1
- package/dist/esm/PageFilter/PageFilter.js +12 -38
- package/dist/esm/PageFilter/PageFilter.js.map +1 -1
- package/dist/esm/PageForm/PageForm.js +5 -19
- package/dist/esm/PageForm/PageForm.js.map +1 -1
- package/dist/esm/PageList/PageList.js +7 -20
- package/dist/esm/PageList/PageList.js.map +1 -1
- package/dist/esm/PageSearch/PageSearch.js +5 -25
- package/dist/esm/PageSearch/PageSearch.js.map +1 -1
- package/dist/esm/PageSummary/PageSummary.js +8 -26
- package/dist/esm/PageSummary/PageSummary.js.map +1 -1
- package/dist/esm/SideNav/SideNav.js +27 -84
- package/dist/esm/SideNav/SideNav.js.map +1 -1
- package/dist/esm/SwipeToRefresh/ProgressIndicator.js +17 -33
- package/dist/esm/SwipeToRefresh/ProgressIndicator.js.map +1 -1
- package/dist/esm/SwipeToRefresh/ProgressLoader.js +87 -156
- package/dist/esm/SwipeToRefresh/ProgressLoader.js.map +1 -1
- package/dist/esm/SwipeToRefresh/SwipeToRefresh.js +24 -22
- package/dist/esm/SwipeToRefresh/SwipeToRefresh.js.map +1 -1
- package/dist/esm/Tabs/index.js +2 -9
- package/dist/esm/Tabs/index.js.map +1 -1
- package/package.json +17 -17
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/MobileBanner.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-utilities';\nimport { icons } from './utils/icons';\nimport { DSMobileBannerT, propTypes } from './propTypes';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles';\nimport { useDSMobileBanner } from './config/useMobileBanner';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen} ref={innerContainerRef} isAnimating={isAnimating}>\n <StyledIconContainer data-testid=\"ds-mobile-banner-icon\">{icons[type]}</StyledIconContainer>\n <StyledContent showCloseButton={showCloseButton}>\n <StyledTitle>{label}</StyledTitle>\n <StyledSubTitle>\n <StyledSubTitleText>{body}</StyledSubTitleText>\n {actionLinkLabel && (\n <StyledActionLink href={actionLinkHref} data-testid=\"ds-mobile-banner-link\" onClick={actionLinkOnClick}>\n {actionLinkLabel}\n </StyledActionLink>\n )}\n </StyledSubTitle>\n </StyledContent>\n {showCloseButton && (\n <StyledCloseButtonContainer>\n <StyledCloseButton\n data-testid=\"ds-mobile-banner-close-button\"\n buttonType=\"icon\"\n onClick={closeButtonOnClick}\n aria-label=\"Close Banner\"\n innerRef={closeRef}\n size=\"s\"\n >\n <CloseX width=\"12px\" height=\"12px\" />\n </StyledCloseButton>\n </StyledCloseButtonContainer>\n )}\n </StyledInnerContainer>\n </StyledBannerContainer>\n );\n};\n\nDSMobileBanner.propTypes = propTypes;\nDSMobileBanner.displayName =
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-utilities';\nimport { icons } from './utils/icons';\nimport { DSMobileBannerT, propTypes } from './propTypes';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles';\nimport { useDSMobileBanner } from './config/useMobileBanner';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen} ref={innerContainerRef} isAnimating={isAnimating}>\n <StyledIconContainer data-testid=\"ds-mobile-banner-icon\">{icons[type]}</StyledIconContainer>\n <StyledContent showCloseButton={showCloseButton}>\n <StyledTitle>{label}</StyledTitle>\n <StyledSubTitle>\n <StyledSubTitleText>{body}</StyledSubTitleText>\n {actionLinkLabel && (\n <StyledActionLink href={actionLinkHref} data-testid=\"ds-mobile-banner-link\" onClick={actionLinkOnClick}>\n {actionLinkLabel}\n </StyledActionLink>\n )}\n </StyledSubTitle>\n </StyledContent>\n {showCloseButton && (\n <StyledCloseButtonContainer>\n <StyledCloseButton\n data-testid=\"ds-mobile-banner-close-button\"\n buttonType=\"icon\"\n onClick={closeButtonOnClick}\n aria-label=\"Close Banner\"\n innerRef={closeRef}\n size=\"s\"\n >\n <CloseX width=\"12px\" height=\"12px\" />\n </StyledCloseButton>\n </StyledCloseButtonContainer>\n )}\n </StyledInnerContainer>\n </StyledBannerContainer>\n );\n};\n\nDSMobileBanner.propTypes = propTypes;\nDSMobileBanner.displayName = DSMobileBannerName;\nconst DSMobileBannerWithSchema = describe(DSMobileBanner);\nDSMobileBannerWithSchema.propTypes = propTypes;\n\nexport { DSMobileBanner, DSMobileBannerWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC2Ef,cAGE,YAHF;AA3ER,SAAgB,iBAAiB,WAAW,QAAQ,gBAAgB;AACpE,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,aAAa;AACtB,SAA0B,iBAAiB;AAC3C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAClC,SAAS,0BAA0B;AAEnC,MAAM,iBAAiB,CAAC,UAAiC;AACvD,QAAM,EAAE,kBAAkB,cAAc,iBAAiB,IAAI,kBAAkB,KAAK;AACpF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,oBAAoB,OAA8B,IAAI;AAC5D,QAAM,WAAW,OAA8B,IAAI;AACnD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,MAAM;AACtD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAkB,KAAK;AAC7D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,CAAC;AAE9C,YAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ,YAAY;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,YAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS,QAAQ;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,kBAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe,IAAI;AAAA;AAChD,qBAAe,KAAK;AAAA,EAC3B,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,MAAM,WAAW,MAAM;AAAA,MACvC;AAAA,MACC,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,+BAAC,wBAAqB,MAAY,QAAgB,KAAK,mBAAmB,aACxE;AAAA,4BAAC,uBAAoB,eAAY,yBAAyB,gBAAM,OAAM;AAAA,QACtE,qBAAC,iBAAc,iBACb;AAAA,8BAAC,eAAa,iBAAM;AAAA,UACpB,qBAAC,kBACC;AAAA,gCAAC,sBAAoB,gBAAK;AAAA,YACzB,mBACC,oBAAC,oBAAiB,MAAM,gBAAgB,eAAY,yBAAwB,SAAS,mBAClF,2BACH;AAAA,aAEJ;AAAA,WACF;AAAA,QACC,mBACC,oBAAC,8BACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,YAAW;AAAA,YACX,SAAS;AAAA,YACT,cAAW;AAAA,YACX,UAAU;AAAA,YACV,MAAK;AAAA,YAEL,8BAAC,UAAO,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,QACrC,GACF;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc;AACxD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -7,8 +7,9 @@ import {
|
|
|
7
7
|
useValidateTypescriptPropTypes
|
|
8
8
|
} from "@elliemae/ds-utilities";
|
|
9
9
|
import { propTypes, defaultProps } from "../propTypes";
|
|
10
|
+
import { DSMobileBannerName } from "../DSMobileBannerDefinitions";
|
|
10
11
|
const useDSMobileBanner = (props) => {
|
|
11
|
-
useValidateTypescriptPropTypes(props, propTypes);
|
|
12
|
+
useValidateTypescriptPropTypes(props, propTypes, DSMobileBannerName);
|
|
12
13
|
const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
|
|
13
14
|
const globalAttributes = useGetGlobalAttributes(propsWithDefault);
|
|
14
15
|
const xstyledProps = useGetXstyledProps(propsWithDefault);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/MobileBanner/config/useMobileBanner.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n GlobalAttributesT,\n XstyledProps,\n} from '@elliemae/ds-utilities';\n\nimport { propTypes, defaultProps, type DSMobileBannerT } from '../propTypes';\n\ninterface UseMobileBannerT {\n propsWithDefault: DSMobileBannerT.InternalProps;\n globalAttributes: GlobalAttributesT;\n xstyledProps: XstyledProps;\n}\n\nexport const useDSMobileBanner = (props: DSMobileBannerT.Props): UseMobileBannerT => {\n useValidateTypescriptPropTypes(props, propTypes);\n const propsWithDefault = useMemoMergePropsWithDefault<MobileBannerPropsT>(props, defaultProps);\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n return React.useMemo(\n () => ({ globalAttributes, xstyledProps, propsWithDefault }),\n [globalAttributes, xstyledProps, propsWithDefault],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAEP,SAAS,WAAW,oBAA0C;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {\n useGetGlobalAttributes,\n useGetXstyledProps,\n useMemoMergePropsWithDefault,\n useValidateTypescriptPropTypes,\n GlobalAttributesT,\n XstyledProps,\n} from '@elliemae/ds-utilities';\n\nimport { propTypes, defaultProps, type DSMobileBannerT } from '../propTypes';\nimport { DSMobileBannerName } from '../DSMobileBannerDefinitions';\n\ninterface UseMobileBannerT {\n propsWithDefault: DSMobileBannerT.InternalProps;\n globalAttributes: GlobalAttributesT;\n xstyledProps: XstyledProps;\n}\n\nexport const useDSMobileBanner = (props: DSMobileBannerT.Props): UseMobileBannerT => {\n useValidateTypescriptPropTypes(props, propTypes, DSMobileBannerName);\n const propsWithDefault = useMemoMergePropsWithDefault<MobileBannerPropsT>(props, defaultProps);\n const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n return React.useMemo(\n () => ({ globalAttributes, xstyledProps, propsWithDefault }),\n [globalAttributes, xstyledProps, propsWithDefault],\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAGK;AAEP,SAAS,WAAW,oBAA0C;AAC9D,SAAS,0BAA0B;AAQ5B,MAAM,oBAAoB,CAAC,UAAmD;AACnF,iCAA+B,OAAO,WAAW,kBAAkB;AACnE,QAAM,mBAAmB,6BAAiD,OAAO,YAAY;AAC7F,QAAM,mBAAmB,uBAAuB,gBAAgB;AAEhE,QAAM,eAAe,mBAAmB,gBAAgB;AACxD,SAAOA,OAAM;AAAA,IACX,OAAO,EAAE,kBAAkB,cAAc,iBAAiB;AAAA,IAC1D,CAAC,kBAAkB,cAAc,gBAAgB;AAAA,EACnD;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,26 +2,10 @@ import * as React from "react";
|
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import { AlertsDetailFill, SuccessFill, InfoFill, WarningSquare } from "@elliemae/ds-icons";
|
|
4
4
|
const icons = {
|
|
5
|
-
success: /* @__PURE__ */ jsx(SuccessFill, {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
}),
|
|
10
|
-
info: /* @__PURE__ */ jsx(InfoFill, {
|
|
11
|
-
color: ["brand-primary", 600],
|
|
12
|
-
width: "24px",
|
|
13
|
-
height: "24px"
|
|
14
|
-
}),
|
|
15
|
-
error: /* @__PURE__ */ jsx(AlertsDetailFill, {
|
|
16
|
-
color: ["danger", 900],
|
|
17
|
-
width: "24px",
|
|
18
|
-
height: "24px"
|
|
19
|
-
}),
|
|
20
|
-
warning: /* @__PURE__ */ jsx(WarningSquare, {
|
|
21
|
-
color: ["warning", 900],
|
|
22
|
-
width: "24px",
|
|
23
|
-
height: "24px"
|
|
24
|
-
})
|
|
5
|
+
success: /* @__PURE__ */ jsx(SuccessFill, { color: ["success", 900], width: "24px", height: "24px" }),
|
|
6
|
+
info: /* @__PURE__ */ jsx(InfoFill, { color: ["brand-primary", 600], width: "24px", height: "24px" }),
|
|
7
|
+
error: /* @__PURE__ */ jsx(AlertsDetailFill, { color: ["danger", 900], width: "24px", height: "24px" }),
|
|
8
|
+
warning: /* @__PURE__ */ jsx(WarningSquare, { color: ["warning", 900], width: "24px", height: "24px" })
|
|
25
9
|
};
|
|
26
10
|
export {
|
|
27
11
|
icons
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/MobileBanner/utils/icons.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { AlertsDetailFill, SuccessFill, InfoFill, WarningSquare } from '@elliemae/ds-icons';\n\nexport const icons = {\n success: <SuccessFill color={['success', 900]} width=\"24px\" height=\"24px\" />,\n info: <InfoFill color={['brand-primary', 600]} width=\"24px\" height=\"24px\" />,\n error: <AlertsDetailFill color={['danger', 900]} width=\"24px\" height=\"24px\" />,\n warning: <WarningSquare color={['warning', 900]} width=\"24px\" height=\"24px\" />,\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACIZ;AAHX,SAAS,kBAAkB,aAAa,UAAU,qBAAqB;AAEhE,MAAM,QAAQ;AAAA,EACnB,SAAS,oBAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACIZ;AAHX,SAAS,kBAAkB,aAAa,UAAU,qBAAqB;AAEhE,MAAM,QAAQ;AAAA,EACnB,SAAS,oBAAC,eAAY,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,MAAM,oBAAC,YAAS,OAAO,CAAC,iBAAiB,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,OAAO,oBAAC,oBAAiB,OAAO,CAAC,UAAU,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC5E,SAAS,oBAAC,iBAAc,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAC9E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -20,13 +20,7 @@ const Addon = styled(Button)`
|
|
|
20
20
|
border: none !important; /* needed */
|
|
21
21
|
}
|
|
22
22
|
`;
|
|
23
|
-
const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ jsx(Addon, {
|
|
24
|
-
onClick,
|
|
25
|
-
labelText: label,
|
|
26
|
-
icon: icon || /* @__PURE__ */ jsx(ChevronSmallDown, {
|
|
27
|
-
color: ["brand-primary", 700]
|
|
28
|
-
})
|
|
29
|
-
});
|
|
23
|
+
const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ jsx(Addon, { onClick, labelText: label, icon: icon || /* @__PURE__ */ jsx(ChevronSmallDown, { color: ["brand-primary", 700] }) });
|
|
30
24
|
ActionAddon.propTypes = {
|
|
31
25
|
label: PropTypes.string,
|
|
32
26
|
onClick: PropTypes.func,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/ActionAddon.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport Button from '@elliemae/ds-button';\n\nconst Addon = styled(Button)`\n background-color: transparent;\n padding-right: 4px;\n height: 100%;\n border: none;\n font-size: 12px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.brand['700']};\n cursor: pointer;\n &:focus,\n &::after {\n background-color: transparent;\n box-shadow: none !important; /* needed */\n border: none !important; /* needed */\n }\n`;\n\nexport const ActionAddon = ({ label, onClick, icon }) => (\n <Addon onClick={onClick} labelText={label} icon={icon || <ChevronSmallDown color={['brand-primary', 700]} />} />\n);\n\nActionAddon.propTypes = {\n /**\n * Addon label\n */\n label: PropTypes.string,\n /**\n * On click callback\n */\n onClick: PropTypes.func,\n /**\n * Icon to display after the label\n */\n icon: PropTypes.element,\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACwBoC;AAvB3D,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,wBAAwB;AACjC,OAAO,YAAY;AAEnB,MAAM,QAAQ,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUxC,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MACjD,oBAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACwBoC;AAvB3D,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,wBAAwB;AACjC,OAAO,YAAY;AAEnB,MAAM,QAAQ,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUxC,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MACjD,oBAAC,SAAM,SAAkB,WAAW,OAAO,MAAM,QAAQ,oBAAC,oBAAiB,OAAO,CAAC,iBAAiB,GAAG,GAAG,GAAI;AAGhH,YAAY,YAAY;AAAA,EAItB,OAAO,UAAU;AAAA,EAIjB,SAAS,UAAU;AAAA,EAInB,MAAM,UAAU;AAClB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -92,107 +92,75 @@ const MobileCard = ({
|
|
|
92
92
|
const subTextHeight = useHeight(subTextRef);
|
|
93
93
|
const isJustChildren = !(subText || subIcons || details);
|
|
94
94
|
const halfM = op("/", __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);
|
|
95
|
-
return /* @__PURE__ */ jsx(
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
e.stopPropagation();
|
|
107
|
-
onChange({ target: { value } });
|
|
108
|
-
},
|
|
109
|
-
align: subText || subIcons ? "top" : "center"
|
|
110
|
-
}),
|
|
111
|
-
/* @__PURE__ */ jsxs(Grid, {
|
|
112
|
-
pb: (subText || subIcons) && subTextHeight,
|
|
113
|
-
cols: ["auto", "auto"],
|
|
114
|
-
alignItems: "center",
|
|
95
|
+
return /* @__PURE__ */ jsx(
|
|
96
|
+
GroupItem,
|
|
97
|
+
{
|
|
98
|
+
render: (context = {}) => {
|
|
99
|
+
const { activeValue, onChange } = context;
|
|
100
|
+
const selected = activeValue !== void 0 && (activeValue === value || activeValue?.length && activeValue?.includes(value));
|
|
101
|
+
return /* @__PURE__ */ jsxs(
|
|
102
|
+
Card,
|
|
103
|
+
{
|
|
104
|
+
"data-testid": "card-wrapper",
|
|
105
|
+
minHeight: height === "m" ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl),
|
|
115
106
|
children: [
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
107
|
+
expandable && /* @__PURE__ */ jsx(
|
|
108
|
+
ExpandChevron,
|
|
109
|
+
{
|
|
110
|
+
isExpanded: selected,
|
|
111
|
+
onClick: (e) => {
|
|
112
|
+
e.stopPropagation();
|
|
113
|
+
onChange({ target: { value } });
|
|
114
|
+
},
|
|
115
|
+
align: subText || subIcons ? "top" : "center"
|
|
116
|
+
}
|
|
117
|
+
),
|
|
118
|
+
/* @__PURE__ */ jsxs(Grid, { pb: (subText || subIcons) && subTextHeight, cols: ["auto", "auto"], alignItems: "center", children: [
|
|
119
|
+
leftProp && /* @__PURE__ */ jsx(Grid, { ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s), children: leftProp }),
|
|
120
|
+
leftAddOn && /* @__PURE__ */ jsx(LeftIcon, { ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s), halfM, children: leftAddOn })
|
|
121
|
+
] }),
|
|
122
|
+
/* @__PURE__ */ jsxs(
|
|
123
|
+
Grid,
|
|
124
|
+
{
|
|
125
|
+
pl: !leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs),
|
|
126
|
+
pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
|
|
127
|
+
width: "100%",
|
|
128
|
+
children: [
|
|
129
|
+
/* @__PURE__ */ jsxs(CenterWrap, { children: [
|
|
130
|
+
/* @__PURE__ */ jsxs(Title, { pt: !isJustChildren && halfM, "data-testid": "card-title", children: [
|
|
131
|
+
/* @__PURE__ */ jsx(TitleEllipsis, { children }),
|
|
132
|
+
details && /* @__PURE__ */ jsx(
|
|
133
|
+
Grid,
|
|
134
|
+
{
|
|
135
|
+
"data-testid": "card-details",
|
|
136
|
+
cols: details.map(() => "min-content"),
|
|
137
|
+
mb: !(subText || subIcons) && halfM || 0,
|
|
138
|
+
pt: op("/", __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2),
|
|
139
|
+
children: details.map((d, i) => /* @__PURE__ */ jsxs(Detail, { children: [
|
|
140
|
+
d,
|
|
141
|
+
i < details.length - 1 && /* @__PURE__ */ jsx(Detail, { px: __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), children: "\u2022" })
|
|
142
|
+
] }, i))
|
|
143
|
+
}
|
|
144
|
+
)
|
|
145
|
+
] }),
|
|
146
|
+
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ jsx(Grid, { ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s), children: prop }, i))
|
|
147
|
+
] }),
|
|
148
|
+
subIcons && /* @__PURE__ */ jsxs(SubTextWrap, { ref: subTextRef, children: [
|
|
149
|
+
/* @__PURE__ */ jsx(SubText, { children: subIcons }),
|
|
150
|
+
subText && subText[1] && /* @__PURE__ */ jsx(SubText, { "data-testid": "card-subText", children: subText[1] })
|
|
151
|
+
] }),
|
|
152
|
+
subText && !subIcons && /* @__PURE__ */ jsx(SubTextWrap, { ref: subTextRef, children: subText.map((s, i) => /* @__PURE__ */ jsx(SubText, { "data-testid": "card-subText", children: s }, i)) }),
|
|
153
|
+
/* @__PURE__ */ jsx(ExpandableRegion, { show: selected, content: expandedContent }),
|
|
154
|
+
cardContent && /* @__PURE__ */ jsx(Grid, { children: cardContent })
|
|
155
|
+
]
|
|
156
|
+
}
|
|
157
|
+
)
|
|
125
158
|
]
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
|
|
130
|
-
width: "100%",
|
|
131
|
-
children: [
|
|
132
|
-
/* @__PURE__ */ jsxs(CenterWrap, {
|
|
133
|
-
children: [
|
|
134
|
-
/* @__PURE__ */ jsxs(Title, {
|
|
135
|
-
pt: !isJustChildren && halfM,
|
|
136
|
-
"data-testid": "card-title",
|
|
137
|
-
children: [
|
|
138
|
-
/* @__PURE__ */ jsx(TitleEllipsis, {
|
|
139
|
-
children
|
|
140
|
-
}),
|
|
141
|
-
details && /* @__PURE__ */ jsx(Grid, {
|
|
142
|
-
"data-testid": "card-details",
|
|
143
|
-
cols: details.map(() => "min-content"),
|
|
144
|
-
mb: !(subText || subIcons) && halfM || 0,
|
|
145
|
-
pt: op("/", __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2),
|
|
146
|
-
children: details.map((d, i) => /* @__PURE__ */ jsxs(Detail, {
|
|
147
|
-
children: [
|
|
148
|
-
d,
|
|
149
|
-
i < details.length - 1 && /* @__PURE__ */ jsx(Detail, {
|
|
150
|
-
px: __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs),
|
|
151
|
-
children: "\u2022"
|
|
152
|
-
})
|
|
153
|
-
]
|
|
154
|
-
}, i))
|
|
155
|
-
})
|
|
156
|
-
]
|
|
157
|
-
}),
|
|
158
|
-
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ jsx(Grid, {
|
|
159
|
-
ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
|
|
160
|
-
children: prop
|
|
161
|
-
}, i))
|
|
162
|
-
]
|
|
163
|
-
}),
|
|
164
|
-
subIcons && /* @__PURE__ */ jsxs(SubTextWrap, {
|
|
165
|
-
ref: subTextRef,
|
|
166
|
-
children: [
|
|
167
|
-
/* @__PURE__ */ jsx(SubText, {
|
|
168
|
-
children: subIcons
|
|
169
|
-
}),
|
|
170
|
-
subText && subText[1] && /* @__PURE__ */ jsx(SubText, {
|
|
171
|
-
"data-testid": "card-subText",
|
|
172
|
-
children: subText[1]
|
|
173
|
-
})
|
|
174
|
-
]
|
|
175
|
-
}),
|
|
176
|
-
subText && !subIcons && /* @__PURE__ */ jsx(SubTextWrap, {
|
|
177
|
-
ref: subTextRef,
|
|
178
|
-
children: subText.map((s, i) => /* @__PURE__ */ jsx(SubText, {
|
|
179
|
-
"data-testid": "card-subText",
|
|
180
|
-
children: s
|
|
181
|
-
}, i))
|
|
182
|
-
}),
|
|
183
|
-
/* @__PURE__ */ jsx(ExpandableRegion, {
|
|
184
|
-
show: selected,
|
|
185
|
-
content: expandedContent
|
|
186
|
-
}),
|
|
187
|
-
cardContent && /* @__PURE__ */ jsx(Grid, {
|
|
188
|
-
children: cardContent
|
|
189
|
-
})
|
|
190
|
-
]
|
|
191
|
-
})
|
|
192
|
-
]
|
|
193
|
-
});
|
|
159
|
+
}
|
|
160
|
+
);
|
|
161
|
+
}
|
|
194
162
|
}
|
|
195
|
-
|
|
163
|
+
);
|
|
196
164
|
};
|
|
197
165
|
MobileCard.propTypes = cardPropsTypes;
|
|
198
166
|
MobileCard.displayName = "MobileCard";
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/Card.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n styled,\n space,\n color,\n border,\n op,\n truncate,\n withTheme,\n __UNSAFE_SPACE_TO_DIMSUM,\n toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n ${truncate()}\n`;\n\nconst Title = styled.div`\n ${space}\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n width: 100%;\n ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n ${space}\n ${truncate()}\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n ${truncate()}\n &:nth-child(2) {\n padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n }\n`;\nconst SubTextWrap = styled.div`\n ${truncate()}\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n margin-top: 6px;\n margin-bottom: 2px;\n padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n ${color('neutral', 500)}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n display: flex;\n justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n & > span {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n`;\nconst CenterWrap = styled.div`\n display: flex;\n align-items: center;\n ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n children,\n height = 'm',\n leftAddOn,\n leftProp,\n rightProp,\n subText,\n subIcons,\n details,\n theme,\n expandable = false,\n expandedContent,\n value,\n cardContent,\n}) => {\n const subTextRef = useRef(null);\n const subTextHeight = useHeight(subTextRef);\n const isJustChildren = !(subText || subIcons || details);\n const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n return (\n <GroupItem\n render={(context = {}) => {\n const { activeValue, onChange } = context;\n const selected =\n activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n return (\n <Card\n data-testid=\"card-wrapper\"\n minHeight={\n height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n }\n >\n {expandable && (\n <ExpandChevron\n isExpanded={selected}\n onClick={(e) => {\n e.stopPropagation();\n onChange({ target: { value } });\n }}\n align={subText || subIcons ? 'top' : 'center'}\n />\n )}\n <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n {leftAddOn && (\n <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n {leftAddOn}\n </LeftIcon>\n )}\n </Grid>\n <Grid\n pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n width=\"100%\"\n >\n <CenterWrap>\n <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n <TitleEllipsis>{children}</TitleEllipsis>\n {details && (\n <Grid\n data-testid=\"card-details\"\n cols={details.map(() => 'min-content')}\n mb={(!(subText || subIcons) && halfM) || 0}\n pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n >\n {details.map((d, i) => (\n <Detail key={i}>\n {d}\n {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n </Detail>\n ))}\n </Grid>\n )}\n </Title>\n {rightProp &&\n rightProp.map((prop, i) => (\n <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} key={i}>\n {prop}\n </Grid>\n ))}\n </CenterWrap>\n {subIcons && (\n <SubTextWrap ref={subTextRef}>\n <SubText>{subIcons}</SubText>\n {subText && subText[1] && <SubText data-testid=\"card-subText\">{subText[1]}</SubText>}\n </SubTextWrap>\n )}\n {subText && !subIcons && (\n <SubTextWrap ref={subTextRef}>\n {subText.map((s, i) => (\n <SubText data-testid=\"card-subText\" key={i}>\n {s}\n </SubText>\n ))}\n </SubTextWrap>\n )}\n <ExpandableRegion show={selected} content={expandedContent} />\n {cardContent && <Grid>{cardContent}</Grid>}\n </Grid>\n </Card>\n );\n }}\n />\n );\n};\n\nMobileCard.propTypes = cardPropsTypes;\nMobileCard.displayName = 'MobileCard';\nconst DSMobileCardWithSchema = describe(MobileCard);\n\nDSMobileCardWithSchema.propTypes = cardPropsTypes;\n\nexport { DSMobileCardWithSchema };\n\nexport default withTheme(MobileCard);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACkHT,cASF,YATE;AA/Gd,SAAgB,cAAc;AAC9B,SAAS,gBAAgB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,iBAAiB;AAC1B,SAAS,YAAY;AACrB,SAAS,cAAc,YAAY;AACnC,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB;AACjC,SAAS,sBAAuC;AAEhD,MAAM,gBAAgB,OAAO;AAAA,IACzB,SAAS;AAAA;AAGb,MAAM,QAAQ,OAAO;AAAA,IACjB;AAAA,IACA,SAAS;AAAA,iBACI,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,eACrC,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA;AAAA,IAE/D,MAAM,WAAW,GAAG;AAAA;AAExB,MAAM,SAAS,OAAO;AAAA,IAClB;AAAA,IACA,SAAS;AAAA,eACE,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,IAAI;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAEpD,MAAM,UAAU,OAAO;AAAA,gBACP,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA,IACpE,SAAS;AAAA;AAAA,oBAEO,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAG3E,MAAM,cAAc,OAAO;AAAA,IACvB,SAAS;AAAA,gBACG,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAAA,oBAG/C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,GAAG;AAAA,eAC9D,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,SAAS,IAAI;AAAA,IAClE,MAAM,WAAW,GAAG;AAAA,iBACP,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA;AAAA;AAIpD,MAAM,WAAW,OAAO,IAAI;AAAA;AAAA,cAEd,CAAC,UAAU,MAAM;AAAA,aAClB,CAAC,UAAU,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,cAKhB,CAAC,UAAU,MAAM;AAAA,aAClB,CAAC,UAAU,MAAM;AAAA;AAAA;AAG9B,MAAM,aAAa,OAAO;AAAA;AAAA;AAAA,IAGtB,SAAS;AAAA;AAGb,MAAM,aAAmD,CAAC;AAAA,EACxD;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,aAAa,OAAO,IAAI;AAC9B,QAAM,gBAAgB,UAAU,UAAU;AAC1C,QAAM,iBAAiB,EAAE,WAAW,YAAY;AAChD,QAAM,QAAQ,GAAG,KAAK,yBAAyB,MAAM,MAAM,CAAC,GAAG,CAAC;AAEhE,SACE,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -59,15 +59,7 @@ const CardIconsWrapper = styled(Grid)`
|
|
|
59
59
|
fill: ${(props) => props.theme.colors.brand[600]};
|
|
60
60
|
}
|
|
61
61
|
`;
|
|
62
|
-
const SubIcons = ({ icons = [], colors = [] }) => /* @__PURE__ */ jsx(CardIconsWrapper, {
|
|
63
|
-
cols: icons.map(() => "12px"),
|
|
64
|
-
gutter: "6px",
|
|
65
|
-
height: "14px",
|
|
66
|
-
"data-testid": "card-subIcons",
|
|
67
|
-
children: icons.map((Icon, i) => /* @__PURE__ */ jsx(Icon, {
|
|
68
|
-
className: `icon-color-${colors[i] || "muted"}`
|
|
69
|
-
}, i))
|
|
70
|
-
});
|
|
62
|
+
const SubIcons = ({ icons = [], colors = [] }) => /* @__PURE__ */ jsx(CardIconsWrapper, { cols: icons.map(() => "12px"), gutter: "6px", height: "14px", "data-testid": "card-subIcons", children: icons.map((Icon, i) => /* @__PURE__ */ jsx(Icon, { className: `icon-color-${colors[i] || "muted"}` }, i)) });
|
|
71
63
|
SubIcons.propTypes = {
|
|
72
64
|
icons: PropTypes.arrayOf(PropTypes.func),
|
|
73
65
|
colors: PropTypes.arrayOf(PropTypes.oneOf(["muted", "warn", "error", "success", "primary"]))
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/CardIcons.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardIconsWrapper = styled(Grid)`\n align-items: center;\n span,\n svg {\n width: 12px !important;\n height: 12px !important;\n }\n span.icon-color-muted svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.neutral['600']};\n height: 12px !important;\n width: 12px !important;\n\n & * {\n fill: ${(props) => props.theme.colors.neutral['600']};\n }\n }\n span.icon-color-warn svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.warning['600']};\n height: 12px !important;\n width: 12px !important;\n\n & * {\n fill: ${(props) => props.theme.colors.warning['600']};\n }\n }\n span.icon-color-error svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.danger['900']};\n height: 12px !important;\n width: 12px !important;\n\n & * {\n fill: ${(props) => props.theme.colors.danger['900']};\n }\n }\n span.icon-color-success svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.success['900']};\n height: 12px !important;\n width: 12px !important;\n\n & * {\n fill: ${(props) => props.theme.colors.success['900']};\n }\n }\n span.icon-color-primary svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.brand[600]};\n }\n span.icon-color-primary svg,\n svg:not([fill]) {\n fill: ${(props) => props.theme.colors.brand[600]};\n }\n`;\n\nexport const SubIcons = ({ icons = [], colors = [] }) => (\n <CardIconsWrapper cols={icons.map(() => '12px')} gutter=\"6px\" height=\"14px\" data-testid=\"card-subIcons\">\n {icons.map((Icon, i) => (\n // eslint-disable-next-line react/no-array-index-key\n <Icon key={i} className={`icon-color-${colors[i] || 'muted'}`} />\n ))}\n </CardIconsWrapper>\n);\n\nSubIcons.propTypes = {\n /**\n * Array of Icons\n */\n icons: PropTypes.arrayOf(PropTypes.func),\n /**\n * Color Types: muted, warn, error, success\n */\n colors: PropTypes.arrayOf(PropTypes.oneOf(['muted', 'warn', 'error', 'success', 'primary'])),\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACmEjB;AAjEN,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YASxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,cAKnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,YAKvC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA,YAIpC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAIzC,MAAM,WAAW,CAAC,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAC,EAAE,MACjD,oBAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACmEjB;AAjEN,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YASxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,cAKnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,YAKvC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA,YAIpC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAIzC,MAAM,WAAW,CAAC,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAC,EAAE,MACjD,oBAAC,oBAAiB,MAAM,MAAM,IAAI,MAAM,MAAM,GAAG,QAAO,OAAM,QAAO,QAAO,eAAY,iBACrF,gBAAM,IAAI,CAAC,MAAM,MAEhB,oBAAC,QAAa,WAAW,cAAc,OAAO,MAAM,aAAzC,CAAoD,CAChE,GACH;AAGF,SAAS,YAAY;AAAA,EAInB,OAAO,UAAU,QAAQ,UAAU,IAAI;AAAA,EAIvC,QAAQ,UAAU,QAAQ,UAAU,MAAM,CAAC,SAAS,QAAQ,SAAS,WAAW,SAAS,CAAC,CAAC;AAC7F;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -10,15 +10,7 @@ const ChevronWrap = styled.div`
|
|
|
10
10
|
`;
|
|
11
11
|
const ExpandChevron = ({ isExpanded, onClick, align }) => {
|
|
12
12
|
const Chevron = isExpanded ? ChevronDown : ChevronRight;
|
|
13
|
-
return /* @__PURE__ */ jsx(ChevronWrap, {
|
|
14
|
-
"data-testid": "ds-card-expand-chevron",
|
|
15
|
-
align,
|
|
16
|
-
children: /* @__PURE__ */ jsx(Chevron, {
|
|
17
|
-
size: "s",
|
|
18
|
-
color: ["brand-primary", 800],
|
|
19
|
-
onClick
|
|
20
|
-
})
|
|
21
|
-
});
|
|
13
|
+
return /* @__PURE__ */ jsx(ChevronWrap, { "data-testid": "ds-card-expand-chevron", align, children: /* @__PURE__ */ jsx(Chevron, { size: "s", color: ["brand-primary", 800], onClick }) });
|
|
22
14
|
};
|
|
23
15
|
ExpandChevron.propTypes = {
|
|
24
16
|
isExpanded: PropTypes.bool,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/ExpandChevron.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { ChevronDown, ChevronRight } from '@elliemae/ds-icons';\n\nconst ChevronWrap = styled.div`\n margin-top: ${(props) => (props.align === 'top' ? '18px' : '0')};\n align-self: ${(props) => (props.align === 'top' ? 'flex-start' : 'center')};\n margin-left: ${(props) => props.theme.space.xs};\n`;\n\nexport const ExpandChevron = ({ isExpanded, onClick, align }) => {\n const Chevron = isExpanded ? ChevronDown : ChevronRight;\n return (\n <ChevronWrap data-testid=\"ds-card-expand-chevron\" align={align}>\n <Chevron size=\"s\" color={['brand-primary', 800]} onClick={onClick} />\n </ChevronWrap>\n );\n};\n\nExpandChevron.propTypes = {\n /**\n * Whether if the chevron is expanded or not\n */\n isExpanded: PropTypes.bool,\n /**\n * click callback\n */\n onClick: PropTypes.func.isRequired,\n /**\n * top or center\n */\n align: PropTypes.string.isRequired,\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACejB;AAdN,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,aAAa,oBAAoB;AAE1C,MAAM,cAAc,OAAO;AAAA,gBACX,CAAC,UAAW,MAAM,UAAU,QAAQ,SAAS;AAAA,gBAC7C,CAAC,UAAW,MAAM,UAAU,QAAQ,eAAe;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAGvC,MAAM,gBAAgB,CAAC,EAAE,YAAY,SAAS,MAAM,MAAM;AAC/D,QAAM,UAAU,aAAa,cAAc;AAC3C,SACE,oBAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACejB;AAdN,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,aAAa,oBAAoB;AAE1C,MAAM,cAAc,OAAO;AAAA,gBACX,CAAC,UAAW,MAAM,UAAU,QAAQ,SAAS;AAAA,gBAC7C,CAAC,UAAW,MAAM,UAAU,QAAQ,eAAe;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA;AAGvC,MAAM,gBAAgB,CAAC,EAAE,YAAY,SAAS,MAAM,MAAM;AAC/D,QAAM,UAAU,aAAa,cAAc;AAC3C,SACE,oBAAC,eAAY,eAAY,0BAAyB,OAChD,8BAAC,WAAQ,MAAK,KAAI,OAAO,CAAC,iBAAiB,GAAG,GAAG,SAAkB,GACrE;AAEJ;AAEA,cAAc,YAAY;AAAA,EAIxB,YAAY,UAAU;AAAA,EAItB,SAAS,UAAU,KAAK;AAAA,EAIxB,OAAO,UAAU,OAAO;AAC1B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,16 +34,16 @@ const ExpandableRegion = ({ show, content }) => {
|
|
|
34
34
|
if (!show)
|
|
35
35
|
setHide(true);
|
|
36
36
|
};
|
|
37
|
-
return /* @__PURE__ */ jsx(
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
children: content
|
|
45
|
-
}
|
|
46
|
-
|
|
37
|
+
return /* @__PURE__ */ jsx(
|
|
38
|
+
Region,
|
|
39
|
+
{
|
|
40
|
+
hide,
|
|
41
|
+
refHeight: ref?.current?.scrollHeight || 9999,
|
|
42
|
+
onTransitionEnd: hideOnAnimationEnd,
|
|
43
|
+
animate,
|
|
44
|
+
children: /* @__PURE__ */ jsx(RegionWrapper, { ref, children: content })
|
|
45
|
+
}
|
|
46
|
+
);
|
|
47
47
|
};
|
|
48
48
|
ExpandableRegion.propTypes = {
|
|
49
49
|
show: PropTypes.bool,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/ExpandableRegion.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useEffect, useState, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { border, truncate } from '@elliemae/ds-system';\n\nconst RegionWrapper = styled.div`\n width: 100%;\n height: 100%;\n`;\n\nconst Region = styled.div<{ hide: boolean; animate: boolean; refHeight: number }>`\n display: flex;\n ${(props) => (props.hide ? 'visibility: hidden;' : '')}\n transition: max-height ${(props) => (props.animate ? '0.25s' : '0.20s')} linear;\n max-height: 0;\n ${(props) =>\n props.animate\n ? `\n max-height: ${props.refHeight}px;\n `\n : ''}\n align-items: center;\n ${truncate()};\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\n\nexport const ExpandableRegion = ({ show, content }: { show: boolean; content: JSX.Element | JSX.Element[] }) => {\n const ref = useRef<HTMLDivElement>(null);\n // triggers transition\n const [animate, setAnimate] = useState(show);\n // needed to properly handle the transition. Hide after transition ends\n const [hide, setHide] = useState(!show);\n useEffect(() => {\n setAnimate(show);\n if (show) setHide(false);\n }, [show]);\n\n const hideOnAnimationEnd = () => {\n if (!show) setHide(true);\n };\n\n return (\n <Region\n hide={hide}\n // needed to handle transition, `auto` max-height isn't supported\n refHeight={ref?.current?.scrollHeight || 9999}\n onTransitionEnd={hideOnAnimationEnd}\n animate={animate}\n >\n <RegionWrapper ref={ref}>{content}</RegionWrapper>\n </Region>\n );\n};\n\nExpandableRegion.propTypes = {\n show: PropTypes.bool,\n content: PropTypes.element,\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACkDjB;AAlDN,SAAgB,WAAW,UAAU,cAAc;AACnD,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,QAAQ,gBAAgB;AAEjC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,OAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,IAEJ,SAAS;AAAA,gBACG,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,MAAM,OAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC,IAAI;AACtC,YAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACkDjB;AAlDN,SAAgB,WAAW,UAAU,cAAc;AACnD,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,QAAQ,gBAAgB;AAEjC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,OAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,IAEJ,SAAS;AAAA,gBACG,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,MAAM,OAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC,IAAI;AACtC,YAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MAEA,WAAW,KAAK,SAAS,gBAAgB;AAAA,MACzC,iBAAiB;AAAA,MACjB;AAAA,MAEA,8BAAC,iBAAc,KAAW,mBAAQ;AAAA;AAAA,EACpC;AAEJ;AAEA,iBAAiB,YAAY;AAAA,EAC3B,MAAM,UAAU;AAAA,EAChB,SAAS,UAAU;AACrB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -42,37 +42,21 @@ const MobileCardGroup = ({
|
|
|
42
42
|
onChange = () => null
|
|
43
43
|
}) => {
|
|
44
44
|
const rows = !title ? ["auto"] : [__UNSAFE_SPACE_TO_DIMSUM(theme.space.m), "auto"];
|
|
45
|
-
return /* @__PURE__ */ jsx(Group, {
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
]
|
|
61
|
-
}),
|
|
62
|
-
/* @__PURE__ */ jsx(Grid, {
|
|
63
|
-
children: React2.Children.map(
|
|
64
|
-
children,
|
|
65
|
-
(child, idx) => React2.cloneElement(child, {
|
|
66
|
-
key: idx,
|
|
67
|
-
value: idx,
|
|
68
|
-
idx
|
|
69
|
-
}),
|
|
70
|
-
null
|
|
71
|
-
)
|
|
72
|
-
})
|
|
73
|
-
]
|
|
74
|
-
})
|
|
75
|
-
});
|
|
45
|
+
return /* @__PURE__ */ jsx(Group, { activeValue, multiple: allowMultipleOpen, onChange, children: /* @__PURE__ */ jsxs(GroupGrid, { withTopBorder: !title, rows, children: [
|
|
46
|
+
!!title && /* @__PURE__ */ jsxs(GroupTitleGrid, { pl: "xxs", children: [
|
|
47
|
+
/* @__PURE__ */ jsx(GroupTitle, { children: title }),
|
|
48
|
+
action
|
|
49
|
+
] }),
|
|
50
|
+
/* @__PURE__ */ jsx(Grid, { children: React2.Children.map(
|
|
51
|
+
children,
|
|
52
|
+
(child, idx) => React2.cloneElement(child, {
|
|
53
|
+
key: idx,
|
|
54
|
+
value: idx,
|
|
55
|
+
idx
|
|
56
|
+
}),
|
|
57
|
+
null
|
|
58
|
+
) })
|
|
59
|
+
] }) });
|
|
76
60
|
};
|
|
77
61
|
const props = {
|
|
78
62
|
theme: PropTypes.object.isRequired.description(""),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/Group.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\nimport React from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { Group } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { color, border, withTheme, truncate, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { StyledCard as Card } from './StyledCard';\n\nconst GroupGrid = styled(Grid)`\n ${Card} {\n border-top: none;\n }\n\n ${({ theme, withTopBorder }) => (withTopBorder ? `border-top: ${border(theme.colors.neutral['100'])}` : '')}\n`;\n\nconst GroupTitle = styled.span`\n ${truncate()}\n`;\n\nconst GroupTitleGrid = styled.div`\n display: flex;\n justify-content: space-between;\n padding: 0 ${(props) => props.theme.space.xs};\n font-size: ${(props) => `calc(${__UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)} / 2)`};\n ${color('neutral', '700')}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n background-color: ${(props) => props.theme.colors.brand['200']};\n border-top: ${(props) => border(props.theme.colors.brand['300'])};\n line-height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n @media (min-width: 1024px) {\n background-color: ${(props) => props.theme.colors.neutral['080']};\n border-top: ${(props) => border(props.theme.colors.neutral['080'])};\n }\n`;\n\nconst MobileCardGroup = ({\n children,\n theme,\n title,\n action,\n activeValue,\n allowMultipleOpen = false,\n onChange = () => null,\n}) => {\n const rows = !title ? ['auto'] : [__UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 'auto'];\n\n return (\n <Group activeValue={activeValue} multiple={allowMultipleOpen} onChange={onChange}>\n <GroupGrid withTopBorder={!title} rows={rows}>\n {!!title && (\n <GroupTitleGrid pl=\"xxs\">\n <GroupTitle>{title}</GroupTitle>\n {action}\n </GroupTitleGrid>\n )}\n <Grid>\n {React.Children.map(\n children,\n (child, idx) =>\n React.cloneElement(child, {\n key: idx,\n value: idx,\n idx,\n }),\n null,\n )}\n </Grid>\n </GroupGrid>\n </Group>\n );\n};\n\nconst props = {\n theme: PropTypes.object.isRequired.description(''),\n /**\n * Defines group title\n */\n title: PropTypes.string.description(''),\n /**\n * Pass one or more Mobile Cards to render as a group\n */\n children: PropTypes.oneOfType([PropTypes.element, PropTypes.arrayOf(PropTypes.element)]).isRequired.description(''),\n /**\n * Group header addon\n */\n action: PropTypes.element.description(''),\n /** */\n activeValue: PropTypes.oneOfType([PropTypes.number, PropTypes.arrayOf(PropTypes.number)]).description(''),\n /** */\n allowMultipleOpen: PropTypes.bool.description(''),\n /** */\n onChange: PropTypes.func.description(''),\n};\n\nMobileCardGroup.propTypes = props;\nMobileCardGroup.displayName = 'MobileCardGroup';\nconst DSMobileCardGroupWithSchema = describe(MobileCardGroup);\n\nDSMobileCardGroupWithSchema.propTypes = props;\n\nexport { DSMobileCardGroupWithSchema };\n\nexport default withTheme(MobileCardGroup);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACoDb,SACE,KADF;AAnDV,OAAOA,YAAW;AAClB,SAAS,UAAU,iBAAiB;AACpC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,OAAO,QAAQ,WAAW,UAAU,gCAAgC;AAC7E,SAAS,cAAc,YAAY;AAEnC,MAAM,YAAY,OAAO,IAAI;AAAA,IACzB;AAAA;AAAA;AAAA;AAAA,IAIA,CAAC,EAAE,OAAO,cAAc,MAAO,gBAAgB,eAAe,OAAO,MAAM,OAAO,QAAQ,MAAM,MAAM;AAAA;AAG1G,MAAM,aAAa,OAAO;AAAA,IACtB,SAAS;AAAA;AAGb,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,eAGf,CAACC,WAAUA,OAAM,MAAM,MAAM;AAAA,eAC7B,CAACA,WAAU,QAAQ,yBAAyBA,OAAM,MAAM,MAAM,CAAC;AAAA,IAC1E,MAAM,WAAW,KAAK;AAAA,iBACT,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA,sBAC9B,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,gBAC1C,CAACA,WAAU,OAAOA,OAAM,MAAM,OAAO,MAAM,MAAM;AAAA,iBAChD,CAACA,WAAU,yBAAyBA,OAAM,MAAM,MAAM,CAAC;AAAA;AAAA,wBAEhD,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,kBAC5C,CAACA,WAAU,OAAOA,OAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAIrE,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,WAAW,MAAM;AACnB,MAAM;AACJ,QAAM,OAAO,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,yBAAyB,MAAM,MAAM,CAAC,GAAG,MAAM;AAEjF,SACE,oBAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACoDb,SACE,KADF;AAnDV,OAAOA,YAAW;AAClB,SAAS,UAAU,iBAAiB;AACpC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,YAAY;AACrB,SAAS,OAAO,QAAQ,WAAW,UAAU,gCAAgC;AAC7E,SAAS,cAAc,YAAY;AAEnC,MAAM,YAAY,OAAO,IAAI;AAAA,IACzB;AAAA;AAAA;AAAA;AAAA,IAIA,CAAC,EAAE,OAAO,cAAc,MAAO,gBAAgB,eAAe,OAAO,MAAM,OAAO,QAAQ,MAAM,MAAM;AAAA;AAG1G,MAAM,aAAa,OAAO;AAAA,IACtB,SAAS;AAAA;AAGb,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,eAGf,CAACC,WAAUA,OAAM,MAAM,MAAM;AAAA,eAC7B,CAACA,WAAU,QAAQ,yBAAyBA,OAAM,MAAM,MAAM,CAAC;AAAA,IAC1E,MAAM,WAAW,KAAK;AAAA,iBACT,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA,sBAC9B,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,gBAC1C,CAACA,WAAU,OAAOA,OAAM,MAAM,OAAO,MAAM,MAAM;AAAA,iBAChD,CAACA,WAAU,yBAAyBA,OAAM,MAAM,MAAM,CAAC;AAAA;AAAA,wBAEhD,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,kBAC5C,CAACA,WAAU,OAAOA,OAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAAA;AAIrE,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,oBAAoB;AAAA,EACpB,WAAW,MAAM;AACnB,MAAM;AACJ,QAAM,OAAO,CAAC,QAAQ,CAAC,MAAM,IAAI,CAAC,yBAAyB,MAAM,MAAM,CAAC,GAAG,MAAM;AAEjF,SACE,oBAAC,SAAM,aAA0B,UAAU,mBAAmB,UAC5D,+BAAC,aAAU,eAAe,CAAC,OAAO,MAC/B;AAAA,KAAC,CAAC,SACD,qBAAC,kBAAe,IAAG,OACjB;AAAA,0BAAC,cAAY,iBAAM;AAAA,MAClB;AAAA,OACH;AAAA,IAEF,oBAAC,QACE,UAAAD,OAAM,SAAS;AAAA,MACd;AAAA,MACA,CAAC,OAAO,QACNA,OAAM,aAAa,OAAO;AAAA,QACxB,KAAK;AAAA,QACL,OAAO;AAAA,QACP;AAAA,MACF,CAAC;AAAA,MACH;AAAA,IACF,GACF;AAAA,KACF,GACF;AAEJ;AAEA,MAAM,QAAQ;AAAA,EACZ,OAAO,UAAU,OAAO,WAAW,YAAY,EAAE;AAAA,EAIjD,OAAO,UAAU,OAAO,YAAY,EAAE;AAAA,EAItC,UAAU,UAAU,UAAU,CAAC,UAAU,SAAS,UAAU,QAAQ,UAAU,OAAO,CAAC,CAAC,EAAE,WAAW,YAAY,EAAE;AAAA,EAIlH,QAAQ,UAAU,QAAQ,YAAY,EAAE;AAAA,EAExC,aAAa,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE;AAAA,EAExG,mBAAmB,UAAU,KAAK,YAAY,EAAE;AAAA,EAEhD,UAAU,UAAU,KAAK,YAAY,EAAE;AACzC;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,8BAA8B,SAAS,eAAe;AAE5D,4BAA4B,YAAY;AAIxC,IAAO,gBAAQ,UAAU,eAAe;",
|
|
6
6
|
"names": ["React", "props"]
|
|
7
7
|
}
|