@elliemae/ds-mobile 2.2.0-alpha.4 → 3.0.0-next.2
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/cjs/Accordion/Accordion.js +55 -51
- package/cjs/Accordion/index.js +12 -28
- package/cjs/Accordion/propTypes.js +22 -53
- package/cjs/CategoryBox/CategoryBox.js +73 -74
- package/cjs/CategoryBox/index.js +10 -36
- package/cjs/CollectionBox/CollectionBox.js +84 -96
- package/cjs/CollectionBox/index.js +10 -36
- package/cjs/FullPageContainer/FullPageContainer.js +42 -48
- package/cjs/FullPageContainer/FullPageContainerScroll.js +43 -45
- package/cjs/FullPageContainer/index.js +11 -37
- package/cjs/FullPageContainer/useMobileHeight.js +18 -40
- package/cjs/GlobalHeader/MobileGlobalHeader.js +132 -105
- package/cjs/GlobalHeader/index.js +10 -36
- package/cjs/GlobalHeader/styles.js +39 -114
- package/cjs/GroupBox/GroupBox.js +79 -77
- package/cjs/GroupBox/index.js +10 -36
- package/cjs/Icons/EM_logo.js +18 -41
- package/cjs/InfiniteLoader/Infiniteloader.js +77 -64
- package/cjs/InfiniteLoader/Loader.js +27 -46
- package/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js +82 -77
- package/cjs/InfiniteLoader/index.js +13 -39
- package/cjs/InfiniteLoader/styled.js +15 -50
- package/cjs/LoadingPage/Page.js +78 -79
- package/cjs/LoadingPage/index.js +10 -37
- package/cjs/MobileActionToolbar/MobileActionToolbar.js +47 -59
- package/cjs/MobileActionToolbar/MobileActionToolbarItem.js +48 -48
- package/cjs/MobileActionToolbar/index.js +13 -38
- package/cjs/MobileBanner/MobileBanner.js +99 -105
- package/cjs/MobileBanner/defaultProps.js +11 -38
- package/cjs/MobileBanner/index.d.js +2 -27
- package/cjs/MobileBanner/index.js +12 -38
- package/cjs/MobileBanner/propTypes.js +19 -46
- package/cjs/MobileBanner/styles.js +173 -127
- package/cjs/MobileBanner/utils/bannerTypes.js +10 -38
- package/cjs/MobileBanner/utils/icons.js +18 -40
- package/cjs/MobileBanner/utils/styleHelpers.js +41 -90
- package/cjs/MobileCard/ActionAddon.js +34 -66
- package/cjs/MobileCard/Card.js +124 -163
- package/cjs/MobileCard/CardIcons.js +33 -102
- package/cjs/MobileCard/ExpandChevron.js +31 -55
- package/cjs/MobileCard/ExpandableRegion.js +50 -75
- package/cjs/MobileCard/Group.js +84 -91
- package/cjs/MobileCard/StyledCard.js +16 -44
- package/cjs/MobileCard/index.js +18 -45
- package/cjs/MobileCard/props.js +60 -48
- package/cjs/MobileCard/useHeight.js +18 -43
- package/cjs/MobileContextMenu/MobileContextMenu.js +187 -191
- package/cjs/MobileContextMenu/MobileContextMenuGroup.js +87 -75
- package/cjs/MobileContextMenu/MobileContextMenuItem.js +147 -146
- package/cjs/MobileContextMenu/index.js +16 -30
- package/cjs/MobileDatePicker/Input.js +38 -74
- package/cjs/MobileDatePicker/MobileDatePicker.js +87 -70
- package/cjs/MobileDatePicker/index.js +10 -28
- package/cjs/MobileDropdownMenu/MobileDropdownInput.js +58 -93
- package/cjs/MobileDropdownMenu/MobileDropdownMenu.js +83 -88
- package/cjs/MobileDropdownMenu/index.js +12 -36
- package/cjs/MobileEmtpyState/MobileEmptyState.js +37 -58
- package/cjs/MobileEmtpyState/index.js +11 -37
- package/cjs/MobileFilterbar/Filterbar.js +40 -67
- package/cjs/MobileFilterbar/FilterbarItem.js +33 -49
- package/cjs/MobileFilterbar/FilterbarSort.js +42 -56
- package/cjs/MobileFilterbar/index.js +16 -42
- package/cjs/MobileFooter/Action.js +58 -68
- package/cjs/MobileFooter/Footer.js +57 -62
- package/cjs/MobileFooter/Text.js +30 -48
- package/cjs/MobileFooter/index.js +16 -42
- package/cjs/MobileListItem/MobileListItem.js +55 -80
- package/cjs/MobileListItem/index.js +10 -28
- package/cjs/MobilePageHeader/MobilePageHeader.js +121 -149
- package/cjs/MobilePageHeader/index.js +10 -28
- package/cjs/MobileSelectList/MobileSelectList.js +132 -144
- package/cjs/MobileSelectList/index.js +9 -28
- package/cjs/MobileSelectList/styled.js +52 -78
- package/cjs/MobileSeparator/Separator.js +61 -56
- package/cjs/MobileSeparator/index.js +10 -37
- package/cjs/MobileTimePicker/Input.js +38 -74
- package/cjs/MobileTimePicker/MobileTimePicker.js +90 -74
- package/cjs/MobileTimePicker/MobileTimePicker.stories.js +35 -0
- package/cjs/MobileTimePicker/index.js +10 -28
- package/cjs/MobileTouchable/MobileTouchable.js +57 -69
- package/cjs/MobileTouchable/index.js +9 -28
- package/cjs/Modal/Modal.js +129 -135
- package/cjs/Modal/index.js +10 -36
- package/cjs/Modal/styled.js +42 -94
- package/cjs/PageFilter/PageFilter.js +76 -115
- package/cjs/PageForm/PageForm.js +50 -63
- package/cjs/PageList/PageList.js +38 -60
- package/cjs/PageList/index.js +10 -28
- package/cjs/PageSearch/PageSearch.js +42 -72
- package/cjs/PageSummary/PageSummary.js +55 -66
- package/cjs/PageSummary/Tags.js +36 -65
- package/cjs/SideNav/SideNav.js +110 -83
- package/cjs/SideNav/index.js +10 -36
- package/cjs/SideNav/styles.js +42 -128
- package/cjs/SwipeToRefresh/ProgressIndicator.js +28 -51
- package/cjs/SwipeToRefresh/ProgressLoader.js +54 -75
- package/cjs/SwipeToRefresh/SwipeToRefresh.js +64 -67
- package/cjs/SwipeToRefresh/styled.js +28 -57
- package/cjs/SwipeToRefresh/useSwipe.js +44 -54
- package/cjs/Tabs/index.js +55 -51
- package/cjs/Tabs/propTypes.js +24 -49
- package/cjs/index.js +132 -94
- package/esm/Accordion/Accordion.js +41 -20
- package/esm/Accordion/index.js +1 -3
- package/esm/Accordion/propTypes.js +17 -24
- package/esm/CategoryBox/CategoryBox.js +62 -44
- package/esm/CategoryBox/index.js +1 -7
- package/esm/CollectionBox/CollectionBox.js +73 -66
- package/esm/CollectionBox/index.js +1 -7
- package/esm/FullPageContainer/FullPageContainer.js +32 -18
- package/esm/FullPageContainer/FullPageContainerScroll.js +34 -16
- package/esm/FullPageContainer/index.js +2 -8
- package/esm/FullPageContainer/useMobileHeight.js +12 -9
- package/esm/GlobalHeader/MobileGlobalHeader.js +113 -68
- package/esm/GlobalHeader/index.js +1 -7
- package/esm/GlobalHeader/styles.js +25 -85
- package/esm/GroupBox/GroupBox.js +69 -48
- package/esm/GroupBox/index.js +1 -7
- package/esm/Icons/EM_logo.js +12 -12
- package/esm/InfiniteLoader/Infiniteloader.js +64 -31
- package/esm/InfiniteLoader/Loader.js +18 -17
- package/esm/InfiniteLoader/VirtualizedInfiniteLoader.js +70 -46
- package/esm/InfiniteLoader/index.js +2 -13
- package/esm/InfiniteLoader/styled.js +7 -21
- package/esm/LoadingPage/Page.js +63 -47
- package/esm/LoadingPage/index.js +2 -8
- package/esm/MobileActionToolbar/MobileActionToolbar.js +34 -28
- package/esm/MobileActionToolbar/MobileActionToolbarItem.js +35 -18
- package/esm/MobileActionToolbar/index.js +2 -9
- package/esm/MobileBanner/MobileBanner.js +78 -75
- package/esm/MobileBanner/defaultProps.js +6 -8
- package/esm/MobileBanner/index.d.js +1 -2
- package/esm/MobileBanner/index.js +2 -9
- package/esm/MobileBanner/propTypes.js +14 -16
- package/esm/MobileBanner/styles.js +156 -99
- package/esm/MobileBanner/utils/bannerTypes.js +6 -9
- package/esm/MobileBanner/utils/icons.js +10 -11
- package/esm/MobileBanner/utils/styleHelpers.js +24 -57
- package/esm/MobileCard/ActionAddon.js +24 -37
- package/esm/MobileCard/Card.js +104 -125
- package/esm/MobileCard/CardIcons.js +27 -76
- package/esm/MobileCard/ExpandChevron.js +21 -25
- package/esm/MobileCard/ExpandableRegion.js +39 -44
- package/esm/MobileCard/Group.js +72 -62
- package/esm/MobileCard/StyledCard.js +8 -15
- package/esm/MobileCard/index.js +9 -14
- package/esm/MobileCard/props.js +56 -19
- package/esm/MobileCard/useHeight.js +9 -9
- package/esm/MobileContextMenu/MobileContextMenu.js +171 -159
- package/esm/MobileContextMenu/MobileContextMenuGroup.js +74 -45
- package/esm/MobileContextMenu/MobileContextMenuItem.js +135 -117
- package/esm/MobileContextMenu/index.js +3 -5
- package/esm/MobileDatePicker/Input.js +27 -44
- package/esm/MobileDatePicker/MobileDatePicker.js +73 -37
- package/esm/MobileDatePicker/index.js +1 -3
- package/esm/MobileDropdownMenu/MobileDropdownInput.js +45 -64
- package/esm/MobileDropdownMenu/MobileDropdownMenu.js +70 -59
- package/esm/MobileDropdownMenu/index.js +2 -7
- package/esm/MobileEmtpyState/MobileEmptyState.js +27 -29
- package/esm/MobileEmtpyState/index.js +2 -8
- package/esm/MobileFilterbar/Filterbar.js +30 -38
- package/esm/MobileFilterbar/FilterbarItem.js +24 -20
- package/esm/MobileFilterbar/FilterbarSort.js +32 -27
- package/esm/MobileFilterbar/index.js +3 -19
- package/esm/MobileFooter/Action.js +48 -40
- package/esm/MobileFooter/Footer.js +43 -31
- package/esm/MobileFooter/Text.js +20 -19
- package/esm/MobileFooter/index.js +3 -13
- package/esm/MobileListItem/MobileListItem.js +41 -47
- package/esm/MobileListItem/index.js +1 -3
- package/esm/MobilePageHeader/MobilePageHeader.js +103 -114
- package/esm/MobilePageHeader/index.js +1 -3
- package/esm/MobileSelectList/MobileSelectList.js +119 -112
- package/esm/MobileSelectList/index.js +1 -3
- package/esm/MobileSelectList/styled.js +35 -47
- package/esm/MobileSeparator/Separator.js +51 -27
- package/esm/MobileSeparator/index.js +2 -8
- package/esm/MobileTimePicker/Input.js +27 -44
- package/esm/MobileTimePicker/MobileTimePicker.js +76 -41
- package/esm/MobileTimePicker/MobileTimePicker.stories.js +26 -0
- package/esm/MobileTimePicker/index.js +1 -3
- package/esm/MobileTouchable/MobileTouchable.js +43 -36
- package/esm/MobileTouchable/index.js +1 -3
- package/esm/Modal/Modal.js +110 -98
- package/esm/Modal/index.js +1 -7
- package/esm/Modal/styled.js +27 -65
- package/esm/PageFilter/PageFilter.js +64 -83
- package/esm/PageForm/PageForm.js +40 -34
- package/esm/PageList/PageList.js +28 -31
- package/esm/PageList/index.js +1 -3
- package/esm/PageSearch/PageSearch.js +32 -43
- package/esm/PageSummary/PageSummary.js +47 -38
- package/esm/PageSummary/Tags.js +26 -37
- package/esm/SideNav/SideNav.js +95 -48
- package/esm/SideNav/index.js +1 -7
- package/esm/SideNav/styles.js +27 -99
- package/esm/SwipeToRefresh/ProgressIndicator.js +19 -21
- package/esm/SwipeToRefresh/ProgressLoader.js +46 -46
- package/esm/SwipeToRefresh/SwipeToRefresh.js +53 -36
- package/esm/SwipeToRefresh/styled.js +17 -28
- package/esm/SwipeToRefresh/useSwipe.js +34 -19
- package/esm/Tabs/index.js +41 -20
- package/esm/Tabs/propTypes.js +19 -20
- package/esm/index.js +44 -75
- package/package.json +19 -22
- package/cjs/Accordion/Accordion.js.map +0 -7
- package/cjs/Accordion/index.js.map +0 -7
- package/cjs/Accordion/propTypes.js.map +0 -7
- package/cjs/CategoryBox/CategoryBox.js.map +0 -7
- package/cjs/CategoryBox/index.js.map +0 -7
- package/cjs/CollectionBox/CollectionBox.js.map +0 -7
- package/cjs/CollectionBox/index.js.map +0 -7
- package/cjs/FullPageContainer/FullPageContainer.js.map +0 -7
- package/cjs/FullPageContainer/FullPageContainerScroll.js.map +0 -7
- package/cjs/FullPageContainer/index.js.map +0 -7
- package/cjs/FullPageContainer/useMobileHeight.js.map +0 -7
- package/cjs/GlobalHeader/MobileGlobalHeader.js.map +0 -7
- package/cjs/GlobalHeader/index.js.map +0 -7
- package/cjs/GlobalHeader/styles.js.map +0 -7
- package/cjs/GroupBox/GroupBox.js.map +0 -7
- package/cjs/GroupBox/index.js.map +0 -7
- package/cjs/Icons/EM_logo.js.map +0 -7
- package/cjs/InfiniteLoader/Infiniteloader.js.map +0 -7
- package/cjs/InfiniteLoader/Loader.js.map +0 -7
- package/cjs/InfiniteLoader/VirtualizedInfiniteLoader.js.map +0 -7
- package/cjs/InfiniteLoader/index.js.map +0 -7
- package/cjs/InfiniteLoader/styled.js.map +0 -7
- package/cjs/LoadingPage/Page.js.map +0 -7
- package/cjs/LoadingPage/index.js.map +0 -7
- package/cjs/MobileActionToolbar/MobileActionToolbar.js.map +0 -7
- package/cjs/MobileActionToolbar/MobileActionToolbarItem.js.map +0 -7
- package/cjs/MobileActionToolbar/index.js.map +0 -7
- package/cjs/MobileBanner/MobileBanner.js.map +0 -7
- package/cjs/MobileBanner/defaultProps.js.map +0 -7
- package/cjs/MobileBanner/index.d.js.map +0 -7
- package/cjs/MobileBanner/index.js.map +0 -7
- package/cjs/MobileBanner/propTypes.js.map +0 -7
- package/cjs/MobileBanner/styles.js.map +0 -7
- package/cjs/MobileBanner/utils/bannerTypes.js.map +0 -7
- package/cjs/MobileBanner/utils/icons.js.map +0 -7
- package/cjs/MobileBanner/utils/styleHelpers.js.map +0 -7
- package/cjs/MobileCard/ActionAddon.js.map +0 -7
- package/cjs/MobileCard/Card.js.map +0 -7
- package/cjs/MobileCard/CardIcons.js.map +0 -7
- package/cjs/MobileCard/ExpandChevron.js.map +0 -7
- package/cjs/MobileCard/ExpandableRegion.js.map +0 -7
- package/cjs/MobileCard/Group.js.map +0 -7
- package/cjs/MobileCard/StyledCard.js.map +0 -7
- package/cjs/MobileCard/index.js.map +0 -7
- package/cjs/MobileCard/props.js.map +0 -7
- package/cjs/MobileCard/useHeight.js.map +0 -7
- package/cjs/MobileContextMenu/MobileContextMenu.js.map +0 -7
- package/cjs/MobileContextMenu/MobileContextMenuGroup.js.map +0 -7
- package/cjs/MobileContextMenu/MobileContextMenuItem.js.map +0 -7
- package/cjs/MobileContextMenu/index.js.map +0 -7
- package/cjs/MobileDatePicker/Input.js.map +0 -7
- package/cjs/MobileDatePicker/MobileDatePicker.js.map +0 -7
- package/cjs/MobileDatePicker/index.js.map +0 -7
- package/cjs/MobileDropdownMenu/MobileDropdownInput.js.map +0 -7
- package/cjs/MobileDropdownMenu/MobileDropdownMenu.js.map +0 -7
- package/cjs/MobileDropdownMenu/index.js.map +0 -7
- package/cjs/MobileEmtpyState/MobileEmptyState.js.map +0 -7
- package/cjs/MobileEmtpyState/index.js.map +0 -7
- package/cjs/MobileFilterbar/Filterbar.js.map +0 -7
- package/cjs/MobileFilterbar/FilterbarItem.js.map +0 -7
- package/cjs/MobileFilterbar/FilterbarSort.js.map +0 -7
- package/cjs/MobileFilterbar/index.js.map +0 -7
- package/cjs/MobileFooter/Action.js.map +0 -7
- package/cjs/MobileFooter/Footer.js.map +0 -7
- package/cjs/MobileFooter/Text.js.map +0 -7
- package/cjs/MobileFooter/index.js.map +0 -7
- package/cjs/MobileListItem/MobileListItem.js.map +0 -7
- package/cjs/MobileListItem/index.js.map +0 -7
- package/cjs/MobilePageHeader/MobilePageHeader.js.map +0 -7
- package/cjs/MobilePageHeader/index.js.map +0 -7
- package/cjs/MobileSelectList/MobileSelectList.js.map +0 -7
- package/cjs/MobileSelectList/index.js.map +0 -7
- package/cjs/MobileSelectList/styled.js.map +0 -7
- package/cjs/MobileSeparator/Separator.js.map +0 -7
- package/cjs/MobileSeparator/index.js.map +0 -7
- package/cjs/MobileTimePicker/Input.js.map +0 -7
- package/cjs/MobileTimePicker/MobileTimePicker.js.map +0 -7
- package/cjs/MobileTimePicker/index.js.map +0 -7
- package/cjs/MobileTouchable/MobileTouchable.js.map +0 -7
- package/cjs/MobileTouchable/index.js.map +0 -7
- package/cjs/Modal/Modal.js.map +0 -7
- package/cjs/Modal/index.js.map +0 -7
- package/cjs/Modal/styled.js.map +0 -7
- package/cjs/PageFilter/PageFilter.js.map +0 -7
- package/cjs/PageForm/PageForm.js.map +0 -7
- package/cjs/PageList/PageList.js.map +0 -7
- package/cjs/PageList/index.js.map +0 -7
- package/cjs/PageSearch/PageSearch.js.map +0 -7
- package/cjs/PageSummary/PageSummary.js.map +0 -7
- package/cjs/PageSummary/Tags.js.map +0 -7
- package/cjs/SideNav/SideNav.js.map +0 -7
- package/cjs/SideNav/index.js.map +0 -7
- package/cjs/SideNav/styles.js.map +0 -7
- package/cjs/SwipeToRefresh/ProgressIndicator.js.map +0 -7
- package/cjs/SwipeToRefresh/ProgressLoader.js.map +0 -7
- package/cjs/SwipeToRefresh/SwipeToRefresh.js.map +0 -7
- package/cjs/SwipeToRefresh/styled.js.map +0 -7
- package/cjs/SwipeToRefresh/useSwipe.js.map +0 -7
- package/cjs/Tabs/index.js.map +0 -7
- package/cjs/Tabs/propTypes.js.map +0 -7
- package/cjs/index.js.map +0 -7
- package/esm/Accordion/Accordion.js.map +0 -7
- package/esm/Accordion/index.js.map +0 -7
- package/esm/Accordion/propTypes.js.map +0 -7
- package/esm/CategoryBox/CategoryBox.js.map +0 -7
- package/esm/CategoryBox/index.js.map +0 -7
- package/esm/CollectionBox/CollectionBox.js.map +0 -7
- package/esm/CollectionBox/index.js.map +0 -7
- package/esm/FullPageContainer/FullPageContainer.js.map +0 -7
- package/esm/FullPageContainer/FullPageContainerScroll.js.map +0 -7
- package/esm/FullPageContainer/index.js.map +0 -7
- package/esm/FullPageContainer/useMobileHeight.js.map +0 -7
- package/esm/GlobalHeader/MobileGlobalHeader.js.map +0 -7
- package/esm/GlobalHeader/index.js.map +0 -7
- package/esm/GlobalHeader/styles.js.map +0 -7
- package/esm/GroupBox/GroupBox.js.map +0 -7
- package/esm/GroupBox/index.js.map +0 -7
- package/esm/Icons/EM_logo.js.map +0 -7
- package/esm/InfiniteLoader/Infiniteloader.js.map +0 -7
- package/esm/InfiniteLoader/Loader.js.map +0 -7
- package/esm/InfiniteLoader/VirtualizedInfiniteLoader.js.map +0 -7
- package/esm/InfiniteLoader/index.js.map +0 -7
- package/esm/InfiniteLoader/styled.js.map +0 -7
- package/esm/LoadingPage/Page.js.map +0 -7
- package/esm/LoadingPage/index.js.map +0 -7
- package/esm/MobileActionToolbar/MobileActionToolbar.js.map +0 -7
- package/esm/MobileActionToolbar/MobileActionToolbarItem.js.map +0 -7
- package/esm/MobileActionToolbar/index.js.map +0 -7
- package/esm/MobileBanner/MobileBanner.js.map +0 -7
- package/esm/MobileBanner/defaultProps.js.map +0 -7
- package/esm/MobileBanner/index.d.js.map +0 -7
- package/esm/MobileBanner/index.js.map +0 -7
- package/esm/MobileBanner/propTypes.js.map +0 -7
- package/esm/MobileBanner/styles.js.map +0 -7
- package/esm/MobileBanner/utils/bannerTypes.js.map +0 -7
- package/esm/MobileBanner/utils/icons.js.map +0 -7
- package/esm/MobileBanner/utils/styleHelpers.js.map +0 -7
- package/esm/MobileCard/ActionAddon.js.map +0 -7
- package/esm/MobileCard/Card.js.map +0 -7
- package/esm/MobileCard/CardIcons.js.map +0 -7
- package/esm/MobileCard/ExpandChevron.js.map +0 -7
- package/esm/MobileCard/ExpandableRegion.js.map +0 -7
- package/esm/MobileCard/Group.js.map +0 -7
- package/esm/MobileCard/StyledCard.js.map +0 -7
- package/esm/MobileCard/index.js.map +0 -7
- package/esm/MobileCard/props.js.map +0 -7
- package/esm/MobileCard/useHeight.js.map +0 -7
- package/esm/MobileContextMenu/MobileContextMenu.js.map +0 -7
- package/esm/MobileContextMenu/MobileContextMenuGroup.js.map +0 -7
- package/esm/MobileContextMenu/MobileContextMenuItem.js.map +0 -7
- package/esm/MobileContextMenu/index.js.map +0 -7
- package/esm/MobileDatePicker/Input.js.map +0 -7
- package/esm/MobileDatePicker/MobileDatePicker.js.map +0 -7
- package/esm/MobileDatePicker/index.js.map +0 -7
- package/esm/MobileDropdownMenu/MobileDropdownInput.js.map +0 -7
- package/esm/MobileDropdownMenu/MobileDropdownMenu.js.map +0 -7
- package/esm/MobileDropdownMenu/index.js.map +0 -7
- package/esm/MobileEmtpyState/MobileEmptyState.js.map +0 -7
- package/esm/MobileEmtpyState/index.js.map +0 -7
- package/esm/MobileFilterbar/Filterbar.js.map +0 -7
- package/esm/MobileFilterbar/FilterbarItem.js.map +0 -7
- package/esm/MobileFilterbar/FilterbarSort.js.map +0 -7
- package/esm/MobileFilterbar/index.js.map +0 -7
- package/esm/MobileFooter/Action.js.map +0 -7
- package/esm/MobileFooter/Footer.js.map +0 -7
- package/esm/MobileFooter/Text.js.map +0 -7
- package/esm/MobileFooter/index.js.map +0 -7
- package/esm/MobileListItem/MobileListItem.js.map +0 -7
- package/esm/MobileListItem/index.js.map +0 -7
- package/esm/MobilePageHeader/MobilePageHeader.js.map +0 -7
- package/esm/MobilePageHeader/index.js.map +0 -7
- package/esm/MobileSelectList/MobileSelectList.js.map +0 -7
- package/esm/MobileSelectList/index.js.map +0 -7
- package/esm/MobileSelectList/styled.js.map +0 -7
- package/esm/MobileSeparator/Separator.js.map +0 -7
- package/esm/MobileSeparator/index.js.map +0 -7
- package/esm/MobileTimePicker/Input.js.map +0 -7
- package/esm/MobileTimePicker/MobileTimePicker.js.map +0 -7
- package/esm/MobileTimePicker/index.js.map +0 -7
- package/esm/MobileTouchable/MobileTouchable.js.map +0 -7
- package/esm/MobileTouchable/index.js.map +0 -7
- package/esm/Modal/Modal.js.map +0 -7
- package/esm/Modal/index.js.map +0 -7
- package/esm/Modal/styled.js.map +0 -7
- package/esm/PageFilter/PageFilter.js.map +0 -7
- package/esm/PageForm/PageForm.js.map +0 -7
- package/esm/PageList/PageList.js.map +0 -7
- package/esm/PageList/index.js.map +0 -7
- package/esm/PageSearch/PageSearch.js.map +0 -7
- package/esm/PageSummary/PageSummary.js.map +0 -7
- package/esm/PageSummary/Tags.js.map +0 -7
- package/esm/SideNav/SideNav.js.map +0 -7
- package/esm/SideNav/index.js.map +0 -7
- package/esm/SideNav/styles.js.map +0 -7
- package/esm/SwipeToRefresh/ProgressIndicator.js.map +0 -7
- package/esm/SwipeToRefresh/ProgressLoader.js.map +0 -7
- package/esm/SwipeToRefresh/SwipeToRefresh.js.map +0 -7
- package/esm/SwipeToRefresh/styled.js.map +0 -7
- package/esm/SwipeToRefresh/useSwipe.js.map +0 -7
- package/esm/Tabs/index.js.map +0 -7
- package/esm/Tabs/propTypes.js.map +0 -7
- package/esm/index.js.map +0 -7
package/esm/MobileCard/Card.js
CHANGED
|
@@ -1,152 +1,131 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import {
|
|
9
|
-
import
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
const Title = styled.div`
|
|
18
|
-
${space}
|
|
19
|
-
${truncate()}
|
|
20
|
-
font-weight: ${(props) => props.theme.fontWeights.semibold};
|
|
21
|
-
font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};
|
|
22
|
-
width: 100%;
|
|
23
|
-
${color("neutral", 800)}
|
|
24
|
-
`;
|
|
25
|
-
const Detail = styled.span`
|
|
26
|
-
${space}
|
|
27
|
-
${truncate()}
|
|
28
|
-
font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};
|
|
29
|
-
font-weight: ${(props) => props.theme.fontWeights.regular};
|
|
30
|
-
`;
|
|
31
|
-
const SubText = styled.span`
|
|
32
|
-
margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};
|
|
33
|
-
${truncate()}
|
|
34
|
-
&:nth-child(2) {
|
|
35
|
-
padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};
|
|
36
|
-
}
|
|
37
|
-
`;
|
|
38
|
-
const SubTextWrap = styled.div`
|
|
39
|
-
${truncate()}
|
|
40
|
-
border-top: ${(props) => border(props.theme.colors.neutral["300"])};
|
|
41
|
-
margin-top: 6px;
|
|
42
|
-
margin-bottom: 2px;
|
|
43
|
-
padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};
|
|
44
|
-
font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};
|
|
45
|
-
${color("neutral", 500)}
|
|
46
|
-
font-weight: ${(props) => props.theme.fontWeights.regular};
|
|
47
|
-
display: flex;
|
|
48
|
-
justify-content: space-between;
|
|
49
|
-
`;
|
|
50
|
-
const LeftIcon = styled(Grid)`
|
|
51
|
-
& > span {
|
|
52
|
-
height: ${(props) => props.halfM};
|
|
53
|
-
width: ${(props) => props.halfM};
|
|
54
|
-
}
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/esnext.async-iterator.map.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.map.js';
|
|
4
|
+
import { useRef } from 'react';
|
|
5
|
+
import { describe } from 'react-desc';
|
|
6
|
+
import styled from 'styled-components';
|
|
7
|
+
import { space } from '@xstyled/styled-components';
|
|
8
|
+
import { truncate, toMobile, color, __UNSAFE_SPACE_TO_DIMSUM, border, withTheme, op } from '@elliemae/ds-system';
|
|
9
|
+
import GroupItem from '@elliemae/ds-shared/GroupContext/GroupItem';
|
|
10
|
+
import { Grid } from '@elliemae/ds-grid';
|
|
11
|
+
import { StyledCard } from './StyledCard.js';
|
|
12
|
+
import { ExpandChevron } from './ExpandChevron.js';
|
|
13
|
+
import { useHeight } from './useHeight.js';
|
|
14
|
+
import { ExpandableRegion } from './ExpandableRegion.js';
|
|
15
|
+
import { cardPropsTypes } from './props.js';
|
|
16
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
55
17
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
const
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
18
|
+
const TitleEllipsis = /*#__PURE__*/styled.div.withConfig({
|
|
19
|
+
componentId: "sc-10tpzm8-0"
|
|
20
|
+
})(["", ""], truncate());
|
|
21
|
+
const Title = /*#__PURE__*/styled.div.withConfig({
|
|
22
|
+
componentId: "sc-10tpzm8-1"
|
|
23
|
+
})(["", " ", " font-weight:", ";font-size:", ";width:100%;", ""], space, truncate(), props => props.theme.fontWeights.semibold, props => toMobile(props.theme.fontSizes.title[600]), color('neutral', 800));
|
|
24
|
+
const Detail = /*#__PURE__*/styled.span.withConfig({
|
|
25
|
+
componentId: "sc-10tpzm8-2"
|
|
26
|
+
})(["", " ", " font-size:", ";font-weight:", ";"], space, truncate(), props => toMobile(props.theme.fontSizes.title[500]), props => props.theme.fontWeights.regular);
|
|
27
|
+
const SubText = /*#__PURE__*/styled.span.withConfig({
|
|
28
|
+
componentId: "sc-10tpzm8-3"
|
|
29
|
+
})(["margin-top:", ";", " &:nth-child(2){padding-left:", ";}"], props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs), truncate(), props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s));
|
|
30
|
+
const SubTextWrap = /*#__PURE__*/styled.div.withConfig({
|
|
31
|
+
componentId: "sc-10tpzm8-4"
|
|
32
|
+
})(["", " border-top:", ";margin-top:6px;margin-bottom:2px;padding-bottom:", ";font-size:", ";", " font-weight:", ";display:flex;justify-content:space-between;"], truncate(), props => border(props.theme.colors.neutral['300']), props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs), props => toMobile(props.theme.fontSizes.subTitle[400]), color('neutral', 500), props => props.theme.fontWeights.regular);
|
|
33
|
+
const LeftIcon = /*#__PURE__*/styled(Grid).withConfig({
|
|
34
|
+
componentId: "sc-10tpzm8-5"
|
|
35
|
+
})(["& > span{height:", ";width:", ";}& > span > svg,svg:not([fill]){height:", ";width:", ";}"], props => props.halfM, props => props.halfM, props => props.halfM, props => props.halfM);
|
|
36
|
+
const CenterWrap = /*#__PURE__*/styled.div.withConfig({
|
|
37
|
+
componentId: "sc-10tpzm8-6"
|
|
38
|
+
})(["display:flex;align-items:center;", ""], truncate());
|
|
39
|
+
|
|
40
|
+
const MobileCard = _ref => {
|
|
41
|
+
var _TitleEllipsis, _SubText, _Grid;
|
|
42
|
+
|
|
43
|
+
let {
|
|
44
|
+
children,
|
|
45
|
+
height = 'm',
|
|
46
|
+
leftAddOn,
|
|
47
|
+
leftProp,
|
|
48
|
+
rightProp,
|
|
49
|
+
subText,
|
|
50
|
+
subIcons,
|
|
51
|
+
details,
|
|
52
|
+
theme,
|
|
53
|
+
expandable = false,
|
|
54
|
+
expandedContent,
|
|
55
|
+
value,
|
|
56
|
+
cardContent
|
|
57
|
+
} = _ref;
|
|
82
58
|
const subTextRef = useRef(null);
|
|
83
59
|
const subTextHeight = useHeight(subTextRef);
|
|
84
60
|
const isJustChildren = !(subText || subIcons || details);
|
|
85
|
-
const halfM = op(
|
|
86
|
-
return
|
|
87
|
-
render: (
|
|
88
|
-
|
|
89
|
-
const
|
|
90
|
-
|
|
61
|
+
const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);
|
|
62
|
+
return /*#__PURE__*/_jsx(GroupItem, {
|
|
63
|
+
render: function () {
|
|
64
|
+
let context = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
65
|
+
const {
|
|
66
|
+
activeValue,
|
|
67
|
+
onChange
|
|
68
|
+
} = context;
|
|
69
|
+
const selected = activeValue !== undefined && (activeValue === value || (activeValue === null || activeValue === void 0 ? void 0 : activeValue.length) && (activeValue === null || activeValue === void 0 ? void 0 : activeValue.includes(value)));
|
|
70
|
+
return /*#__PURE__*/_jsx(StyledCard, {
|
|
91
71
|
"data-testid": "card-wrapper",
|
|
92
|
-
minHeight: height ===
|
|
93
|
-
}, expandable &&
|
|
72
|
+
minHeight: height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)
|
|
73
|
+
}, void 0, expandable && /*#__PURE__*/_jsx(ExpandChevron, {
|
|
94
74
|
isExpanded: selected,
|
|
95
|
-
onClick:
|
|
75
|
+
onClick: e => {
|
|
96
76
|
e.stopPropagation();
|
|
97
|
-
onChange({
|
|
77
|
+
onChange({
|
|
78
|
+
target: {
|
|
79
|
+
value
|
|
80
|
+
}
|
|
81
|
+
});
|
|
98
82
|
},
|
|
99
|
-
align: subText || subIcons ?
|
|
100
|
-
}),
|
|
83
|
+
align: subText || subIcons ? 'top' : 'center'
|
|
84
|
+
}), /*#__PURE__*/_jsx(Grid, {
|
|
101
85
|
pb: (subText || subIcons) && subTextHeight,
|
|
102
|
-
cols: [
|
|
86
|
+
cols: ['auto', 'auto'],
|
|
103
87
|
alignItems: "center"
|
|
104
|
-
}, leftProp &&
|
|
88
|
+
}, void 0, leftProp && /*#__PURE__*/_jsx(Grid, {
|
|
105
89
|
ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
|
|
106
|
-
}, leftProp), leftAddOn &&
|
|
90
|
+
}, void 0, leftProp), leftAddOn && /*#__PURE__*/_jsx(LeftIcon, {
|
|
107
91
|
ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
|
|
108
|
-
halfM
|
|
109
|
-
}, leftAddOn)),
|
|
92
|
+
halfM: halfM
|
|
93
|
+
}, void 0, leftAddOn)), /*#__PURE__*/_jsx(Grid, {
|
|
110
94
|
pl: !leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs),
|
|
111
95
|
pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
|
|
112
96
|
width: "100%"
|
|
113
|
-
},
|
|
97
|
+
}, void 0, /*#__PURE__*/_jsx(CenterWrap, {}, void 0, /*#__PURE__*/_jsx(Title, {
|
|
114
98
|
pt: !isJustChildren && halfM,
|
|
115
99
|
"data-testid": "card-title"
|
|
116
|
-
},
|
|
100
|
+
}, void 0, _TitleEllipsis || (_TitleEllipsis = /*#__PURE__*/_jsx(TitleEllipsis, {}, void 0, children)), details && /*#__PURE__*/_jsx(Grid, {
|
|
117
101
|
"data-testid": "card-details",
|
|
118
|
-
cols: details.map(() =>
|
|
102
|
+
cols: details.map(() => 'min-content'),
|
|
119
103
|
mb: !(subText || subIcons) && halfM || 0,
|
|
120
|
-
pt: op(
|
|
121
|
-
}, details.map((d, i) =>
|
|
122
|
-
key: i
|
|
123
|
-
}, d, i < details.length - 1 && /* @__PURE__ */ React2.createElement(Detail, {
|
|
104
|
+
pt: op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)
|
|
105
|
+
}, void 0, details.map((d, i) => /*#__PURE__*/_jsx(Detail, {}, i, d, i < details.length - 1 && /*#__PURE__*/_jsx(Detail, {
|
|
124
106
|
px: __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)
|
|
125
|
-
}, "\u2022"))))), rightProp && rightProp.map((prop, i) =>
|
|
126
|
-
ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
}
|
|
133
|
-
ref: subTextRef
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
}
|
|
107
|
+
}, void 0, "\u2022"))))), rightProp && rightProp.map((prop, i) => /*#__PURE__*/_jsx(Grid, {
|
|
108
|
+
ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
|
|
109
|
+
}, i, prop))), subIcons && /*#__PURE__*/jsxs(SubTextWrap, {
|
|
110
|
+
ref: subTextRef,
|
|
111
|
+
children: [_SubText || (_SubText = /*#__PURE__*/_jsx(SubText, {}, void 0, subIcons)), subText && subText[1] && /*#__PURE__*/_jsx(SubText, {
|
|
112
|
+
"data-testid": "card-subText"
|
|
113
|
+
}, void 0, subText[1])]
|
|
114
|
+
}), subText && !subIcons && /*#__PURE__*/jsx(SubTextWrap, {
|
|
115
|
+
ref: subTextRef,
|
|
116
|
+
children: subText.map((s, i) => /*#__PURE__*/_jsx(SubText, {
|
|
117
|
+
"data-testid": "card-subText"
|
|
118
|
+
}, i, s))
|
|
119
|
+
}), /*#__PURE__*/_jsx(ExpandableRegion, {
|
|
138
120
|
show: selected,
|
|
139
121
|
content: expandedContent
|
|
140
|
-
}), cardContent &&
|
|
122
|
+
}), cardContent && (_Grid || (_Grid = /*#__PURE__*/_jsx(Grid, {}, void 0, cardContent)))));
|
|
141
123
|
}
|
|
142
124
|
});
|
|
143
125
|
};
|
|
144
|
-
|
|
126
|
+
|
|
145
127
|
const DSMobileCardWithSchema = describe(MobileCard);
|
|
146
128
|
DSMobileCardWithSchema.propTypes = cardPropsTypes;
|
|
147
|
-
var
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
Card_default as default
|
|
151
|
-
};
|
|
152
|
-
//# sourceMappingURL=Card.js.map
|
|
129
|
+
var MobileCard$1 = withTheme(MobileCard);
|
|
130
|
+
|
|
131
|
+
export { DSMobileCardWithSchema, MobileCard$1 as default };
|
|
@@ -1,78 +1,29 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
|
|
7
|
-
align-items: center;
|
|
8
|
-
span,
|
|
9
|
-
svg {
|
|
10
|
-
width: 12px !important;
|
|
11
|
-
height: 12px !important;
|
|
12
|
-
}
|
|
13
|
-
span.icon-color-muted svg,
|
|
14
|
-
svg:not([fill]) {
|
|
15
|
-
fill: ${(props) => props.theme.colors.neutral["600"]};
|
|
16
|
-
height: 12px !important;
|
|
17
|
-
width: 12px !important;
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/esnext.async-iterator.map.js';
|
|
3
|
+
import 'core-js/modules/esnext.iterator.map.js';
|
|
4
|
+
import 'react';
|
|
5
|
+
import styled from 'styled-components';
|
|
6
|
+
import { Grid } from '@elliemae/ds-grid';
|
|
18
7
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
& * {
|
|
40
|
-
fill: ${(props) => props.theme.colors.danger["900"]};
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
span.icon-color-success svg,
|
|
44
|
-
svg:not([fill]) {
|
|
45
|
-
fill: ${(props) => props.theme.colors.success["900"]};
|
|
46
|
-
height: 12px !important;
|
|
47
|
-
width: 12px !important;
|
|
48
|
-
|
|
49
|
-
& * {
|
|
50
|
-
fill: ${(props) => props.theme.colors.success["900"]};
|
|
51
|
-
}
|
|
52
|
-
}
|
|
53
|
-
span.icon-color-primary svg,
|
|
54
|
-
svg:not([fill]) {
|
|
55
|
-
fill: ${(props) => props.theme.colors.brand[600]};
|
|
56
|
-
}
|
|
57
|
-
span.icon-color-primary svg,
|
|
58
|
-
svg:not([fill]) {
|
|
59
|
-
fill: ${(props) => props.theme.colors.brand[600]};
|
|
60
|
-
}
|
|
61
|
-
`;
|
|
62
|
-
const SubIcons = ({ icons = [], colors = [] }) => /* @__PURE__ */ React2.createElement(CardIconsWrapper, {
|
|
63
|
-
cols: icons.map(() => "12px"),
|
|
64
|
-
gutter: "6px",
|
|
65
|
-
height: "14px",
|
|
66
|
-
"data-testid": "card-subIcons"
|
|
67
|
-
}, icons.map((Icon, i) => /* @__PURE__ */ React2.createElement(Icon, {
|
|
68
|
-
key: i,
|
|
69
|
-
className: `icon-color-${colors[i] || "muted"}`
|
|
70
|
-
})));
|
|
71
|
-
SubIcons.propTypes = {
|
|
72
|
-
icons: PropTypes.arrayOf(PropTypes.func),
|
|
73
|
-
colors: PropTypes.arrayOf(PropTypes.oneOf(["muted", "warn", "error", "success", "primary"]))
|
|
8
|
+
const CardIconsWrapper = /*#__PURE__*/styled(Grid).withConfig({
|
|
9
|
+
componentId: "sc-1vqygz1-0"
|
|
10
|
+
})(["align-items:center;span,svg{width:12px !important;height:12px !important;}span.icon-color-muted svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-warn svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-error svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-success svg,svg:not([fill]){fill:", ";height:12px !important;width:12px !important;& *{fill:", ";}}span.icon-color-primary svg,svg:not([fill]){fill:", ";}span.icon-color-primary svg,svg:not([fill]){fill:", ";}"], props => props.theme.colors.neutral['600'], props => props.theme.colors.neutral['600'], props => props.theme.colors.warning['600'], props => props.theme.colors.warning['600'], props => props.theme.colors.danger['900'], props => props.theme.colors.danger['900'], props => props.theme.colors.success['900'], props => props.theme.colors.success['900'], props => props.theme.colors.brand[600], props => props.theme.colors.brand[600]);
|
|
11
|
+
const SubIcons = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
icons = [],
|
|
14
|
+
colors = []
|
|
15
|
+
} = _ref;
|
|
16
|
+
return /*#__PURE__*/_jsx(CardIconsWrapper, {
|
|
17
|
+
cols: icons.map(() => '12px'),
|
|
18
|
+
gutter: "6px",
|
|
19
|
+
height: "14px",
|
|
20
|
+
"data-testid": "card-subIcons"
|
|
21
|
+
}, void 0, icons.map((Icon, i) =>
|
|
22
|
+
/*#__PURE__*/
|
|
23
|
+
// eslint-disable-next-line react/no-array-index-key
|
|
24
|
+
_jsx(Icon, {
|
|
25
|
+
className: "icon-color-".concat(colors[i] || 'muted')
|
|
26
|
+
}, i)));
|
|
74
27
|
};
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
};
|
|
78
|
-
//# sourceMappingURL=CardIcons.js.map
|
|
28
|
+
|
|
29
|
+
export { SubIcons };
|
|
@@ -1,30 +1,26 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
const ChevronWrap = styled.div
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'react';
|
|
3
|
+
import styled from 'styled-components';
|
|
4
|
+
import { ChevronDown, ChevronRight } from '@elliemae/ds-icons';
|
|
5
|
+
|
|
6
|
+
const ChevronWrap = /*#__PURE__*/styled.div.withConfig({
|
|
7
|
+
componentId: "sc-1l0ask2-0"
|
|
8
|
+
})(["margin-top:", ";align-self:", ";margin-left:", ";"], props => props.align === 'top' ? '18px' : '0', props => props.align === 'top' ? 'flex-start' : 'center', props => props.theme.space.xs);
|
|
9
|
+
const ExpandChevron = _ref => {
|
|
10
|
+
let {
|
|
11
|
+
isExpanded,
|
|
12
|
+
onClick,
|
|
13
|
+
align
|
|
14
|
+
} = _ref;
|
|
12
15
|
const Chevron = isExpanded ? ChevronDown : ChevronRight;
|
|
13
|
-
return
|
|
16
|
+
return /*#__PURE__*/_jsx(ChevronWrap, {
|
|
14
17
|
"data-testid": "ds-card-expand-chevron",
|
|
15
|
-
align
|
|
16
|
-
},
|
|
18
|
+
align: align
|
|
19
|
+
}, void 0, /*#__PURE__*/_jsx(Chevron, {
|
|
17
20
|
size: "s",
|
|
18
|
-
color: [
|
|
19
|
-
onClick
|
|
21
|
+
color: ['brand-primary', 800],
|
|
22
|
+
onClick: onClick
|
|
20
23
|
}));
|
|
21
24
|
};
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
onClick: PropTypes.func.isRequired,
|
|
25
|
-
align: PropTypes.string.isRequired
|
|
26
|
-
};
|
|
27
|
-
export {
|
|
28
|
-
ExpandChevron
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=ExpandChevron.js.map
|
|
25
|
+
|
|
26
|
+
export { ExpandChevron };
|
|
@@ -1,52 +1,47 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import styled from
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
$
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
const
|
|
24
|
-
|
|
25
|
-
const [animate, setAnimate] = useState(show);
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
|
+
import { useRef, useState, useEffect } from 'react';
|
|
4
|
+
import styled from 'styled-components';
|
|
5
|
+
import { truncate, border } from '@elliemae/ds-system';
|
|
6
|
+
import { jsx } from 'react/jsx-runtime';
|
|
7
|
+
|
|
8
|
+
const RegionWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
9
|
+
componentId: "sc-mduzz9-0"
|
|
10
|
+
})(["width:100%;height:100%;"]);
|
|
11
|
+
const Region = /*#__PURE__*/styled.div.withConfig({
|
|
12
|
+
componentId: "sc-mduzz9-1"
|
|
13
|
+
})(["display:flex;", " transition:max-height ", " linear;max-height:0;", " align-items:center;", ";border-top:", ";font-weight:", ";"], props => props.hide ? 'visibility: hidden;' : '', props => props.animate ? '0.25s' : '0.20s', props => props.animate ? "\n max-height: ".concat(props.refHeight, "px;\n ") : '', truncate(), props => border(props.theme.colors.neutral['300']), props => props.theme.fontWeights.regular);
|
|
14
|
+
const ExpandableRegion = _ref => {
|
|
15
|
+
var _ref$current;
|
|
16
|
+
|
|
17
|
+
let {
|
|
18
|
+
show,
|
|
19
|
+
content
|
|
20
|
+
} = _ref;
|
|
21
|
+
const ref = useRef(null); // triggers transition
|
|
22
|
+
|
|
23
|
+
const [animate, setAnimate] = useState(show); // needed to properly handle the transition. Hide after transition ends
|
|
24
|
+
|
|
26
25
|
const [hide, setHide] = useState(!show);
|
|
27
26
|
useEffect(() => {
|
|
28
27
|
setAnimate(show);
|
|
29
|
-
if (show)
|
|
30
|
-
setHide(false);
|
|
28
|
+
if (show) setHide(false);
|
|
31
29
|
}, [show]);
|
|
30
|
+
|
|
32
31
|
const hideOnAnimationEnd = () => {
|
|
33
|
-
if (!show)
|
|
34
|
-
setHide(true);
|
|
32
|
+
if (!show) setHide(true);
|
|
35
33
|
};
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
34
|
+
|
|
35
|
+
return /*#__PURE__*/_jsx(Region, {
|
|
36
|
+
hide: hide // needed to handle transition, `auto` max-height isn't supported
|
|
37
|
+
,
|
|
38
|
+
refHeight: (ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollHeight) || 9999,
|
|
39
39
|
onTransitionEnd: hideOnAnimationEnd,
|
|
40
|
-
animate
|
|
41
|
-
},
|
|
42
|
-
ref
|
|
43
|
-
|
|
40
|
+
animate: animate
|
|
41
|
+
}, void 0, /*#__PURE__*/jsx(RegionWrapper, {
|
|
42
|
+
ref: ref,
|
|
43
|
+
children: content
|
|
44
|
+
}));
|
|
44
45
|
};
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
content: PropTypes.element
|
|
48
|
-
};
|
|
49
|
-
export {
|
|
50
|
-
ExpandableRegion
|
|
51
|
-
};
|
|
52
|
-
//# sourceMappingURL=ExpandableRegion.js.map
|
|
46
|
+
|
|
47
|
+
export { ExpandableRegion };
|