@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
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenu.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable import/no-unresolved */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable func-names */\n/* eslint-disable max-lines */\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-utilities';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSBackdrop } from '@elliemae/ds-backdrop';\nimport { truncate, withTheme } from '@elliemae/ds-system';\nimport { Group } from '@elliemae/ds-shared';\nimport { DSMobileContextMenuGroup as ContextMenuGroup } from './MobileContextMenuGroup';\n\nconst StyledContainer = styled(Grid)`\n background: ${(props) => props.theme.colors.neutral['000']};\n z-index: ${(props) => props.zIndex};\n width: ${(props) => `calc(100% - ${props.theme.space.xs})`};\n position: fixed;\n bottom: 0;\n left: ${(props) => props.theme.space.xxs};\n max-height: 90vh;\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.5), 0 0px 11px 0 rgba(0, 0, 0, 0.5);\n`;\n\nconst StyledTitle = styled(Grid)`\n font-size: 16px;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n color: ${(props) => props.theme.colors.neutral['000']};\n ${truncate()}\n\n & > span {\n height: 20px;\n width: 20px;\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: 20px;\n width: 20px;\n fill: ${(props) => props.theme.colors.neutral['000']};\n }\n`;\n\nconst HeaderContainer = styled(Grid)`\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n background: ${(props) => props.theme.colors.brand['600']};\n`;\n\nconst isArr = (prop) => Array.isArray(prop);\n\nconst DSMobileContextMenu = withTheme(\n ({\n open = false,\n title = '',\n multiple = false,\n singleSelect = false,\n onChange = noop,\n onClickOutside = noop,\n children,\n theme,\n backdropZIndex = 1000,\n zIndex = 1001,\n dataTestid = 'mobile-context-menu',\n buttonFooter = null,\n onApply = noop,\n selecteds: initSelecteds,\n }) => {\n const [selectedItems, setSelectedItems] = useState([]);\n const trueSelected = useMemo(\n () => (initSelecteds !== undefined ? initSelecteds : [...selectedItems]),\n [initSelecteds, selectedItems],\n );\n const containerRef = useRef(null);\n const handleChange = (value, childProps, event) => {\n onChange(value, childProps, event);\n if (initSelecteds === undefined) {\n if (multiple) setSelectedItems([...value]);\n else if (singleSelect) setSelectedItems(value);\n }\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n if (buttonFooter) rows.push('56px');\n\n if (!open) return null;\n\n return (\n <>\n <DSBackdrop\n type=\"cover\"\n zIndex={backdropZIndex}\n onClick={(e) => {\n // PUI-4481 prevent click on elements below backdrop\n e.stopPropagation();\n onClickOutside(e);\n }}\n />\n <StyledContainer zIndex={zIndex} rows={rows} ref={containerRef} data-testid=\"ds-mobile-context-menu\">\n <HeaderContainer justifyContent=\"center\" alignItems=\"center\" pl=\"xs\" pr=\"xs\">\n <StyledTitle alignItems=\"center\" gutter=\"xxs\" cols={Array(isArr(title) ? title.length : 1).fill('auto')}>\n {title}\n </StyledTitle>\n </HeaderContainer>\n <Grid style={{ overflow: 'hidden' }}>\n <Grid style={{ overflow: 'auto' }}>\n <Group activeValue={trueSelected} multiple={multiple} onChange={handleChange}>\n {React.Children.map(children, (child, ii) => {\n const isGroup =\n child.type === (<ContextMenuGroup />).type ||\n child.type?.name === ContextMenuGroup.componentType ||\n child.type === ContextMenuGroup.type;\n const { onClick = noop } = child.props;\n const value = ii;\n let isSelected;\n if (singleSelect) isSelected = trueSelected === value;\n else if (multiple) isSelected = trueSelected.includes(value);\n return React.cloneElement(child, {\n value,\n key: `cm.${ii}`,\n isMulti: multiple,\n singleSelect,\n isSelected,\n onClick: !isGroup ? (e) => onClick(e, child.props) : null,\n selectedItems: isGroup ? trueSelected : null,\n });\n })}\n </Group>\n </Grid>\n </Grid>\n {buttonFooter && (\n <Grid pl=\"xs\" pr=\"xs\" alignItems=\"center\">\n {React.cloneElement(buttonFooter, {\n ...buttonFooter.props,\n containerProps: {\n 'data-testid': `${dataTestid}--btn`,\n },\n buttonType: 'primary',\n size: 'l',\n onClick: handleApply.bind(buttonFooter.props),\n })}\n </Grid>\n )}\n </StyledContainer>\n </>\n );\n },\n);\n\nconst props = {\n /** toggle open the menu */\n open: PropTypes.bool.description('toggle open the menu'),\n /** context menu title */\n title: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.node])),\n ]).description('context menu title'),\n /** change handler for selectable context menu */\n onChange: PropTypes.func.description('change handler for selectable context menu'),\n /** multi select */\n multiple: PropTypes.bool.description('multi select'),\n /** click outside callback handler */\n onClickOutside: PropTypes.func.description('click outside callback handler'),\n /** array of mobile context menu items */\n children: PropTypes.arrayOf(PropTypes.element).description('array of mobile context menu items'),\n /** z index for overlay div */\n backdropZIndex: PropTypes.number.description('z index for overlay div'),\n /** z index for menu container */\n zIndex: PropTypes.number.description('z index for menu container'),\n /** for e2e tests */\n dataTestid: PropTypes.string.description('for e2e tests'),\n /** bottom button */\n buttonFooter: PropTypes.element.description('bottom button'),\n /** callback */\n onApply: PropTypes.func.description('callback'),\n /** selected elements for multi and single select */\n selecteds: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.number,\n ]).description('selected elements for multi and single select'),\n};\n\nDSMobileContextMenu.propTypes = props;\nDSMobileContextMenu.displayName = 'DSMobileContextMenu';\nconst DSMobileContextMenuWithSchema = describe(DSMobileContextMenu);\n\nDSMobileContextMenuWithSchema.propTypes = props;\n\nexport { DSMobileContextMenu, DSMobileContextMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgGjB;AA5FN,mBAAiD;AACjD,oBAAqB;AACrB,0BAAoC;AACpC,uBAAuB;AACvB,qBAAqB;AACrB,yBAA2B;AAC3B,IAAAA,oBAAoC;AACpC,uBAAsB;AACtB,oCAA6D;AAE7D,MAAM,sBAAkB,yBAAO,mBAAI;AAAA,gBACnB,CAACC,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,aACzC,CAACA,WAAUA,OAAM;AAAA,WACnB,CAACA,WAAU,eAAeA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA,UAG7C,CAACA,WAAUA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAOvC,MAAM,kBAAc,yBAAO,mBAAI;AAAA;AAAA,iBAEd,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA,WACzC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,QAC7C,4BAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAWD,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIlD,MAAM,sBAAkB,yBAAO,mBAAI;AAAA;AAAA;AAAA,gBAGnB,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA;AAGpD,MAAM,QAAQ,CAAC,SAAS,MAAM,QAAQ,IAAI;AAE1C,MAAM,0BAAsB;AAAA,EAC1B,CAAC;AAAA,IACC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,eAAe;AAAA,IACf,WAAW;AAAA,IACX,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,aAAa;AAAA,IACb,eAAe;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,EACb,MAAM;AACJ,UAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,CAAC,CAAC;AACrD,UAAM,mBAAe;AAAA,MACnB,MAAO,kBAAkB,SAAY,gBAAgB,CAAC,GAAG,aAAa;AAAA,MACtE,CAAC,eAAe,aAAa;AAAA,IAC/B;AACA,UAAM,mBAAe,qBAAO,IAAI;AAChC,UAAM,eAAe,CAAC,OAAO,YAAY,UAAU;AACjD,eAAS,OAAO,YAAY,KAAK;AACjC,UAAI,kBAAkB,QAAW;AAC/B,YAAI;AAAU,2BAAiB,CAAC,GAAG,KAAK,CAAC;AAAA,iBAChC;AAAc,2BAAiB,KAAK;AAAA,MAC/C;AAAA,IACF;AAEA,UAAM,cAAc,SAAU,GAAG;AAC/B,UAAI,KAAK;AAAS,aAAK,QAAQ,CAAC;AAChC,cAAQ,GAAG,aAAa;AAAA,IAC1B;AAEA,UAAM,OAAO,CAAC,MAAM,MAAM,GAAG,CAAC;AAC9B,QAAI;AAAc,WAAK,KAAK,MAAM;AAElC,QAAI,CAAC;AAAM,aAAO;AAElB,WACE;AAAA
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_ds_system", "props", "React", "ContextMenuGroup"]
|
|
7
7
|
}
|
|
@@ -45,35 +45,27 @@ const Title = import_ds_system.styled.div`
|
|
|
45
45
|
color: ${(props2) => props2.theme.colors.neutral["700"]};
|
|
46
46
|
font-weight: ${(props2) => props2.theme.fontWeights.semibold};
|
|
47
47
|
`;
|
|
48
|
-
const DSMobileContextMenuGroup = ({ title, isMulti, singleSelect, children, value: groupValue, selectedItems }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
|
|
49
|
-
children:
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
singleSelect,
|
|
70
|
-
isSelected,
|
|
71
|
-
onClick: (e) => onClick(e, { value, ...child.props })
|
|
72
|
-
});
|
|
73
|
-
})
|
|
74
|
-
})
|
|
75
|
-
]
|
|
76
|
-
});
|
|
48
|
+
const DSMobileContextMenuGroup = ({ title, isMulti, singleSelect, children, value: groupValue, selectedItems }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { children: [
|
|
49
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { children: title }) }),
|
|
50
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: import_react.default.Children.map(children, (child, index) => {
|
|
51
|
+
const { onClick = import_lodash.noop } = child.props;
|
|
52
|
+
const value = `${groupValue}:${index}`;
|
|
53
|
+
let isSelected;
|
|
54
|
+
if (singleSelect)
|
|
55
|
+
isSelected = selectedItems === value;
|
|
56
|
+
else if (isMulti)
|
|
57
|
+
isSelected = selectedItems.includes(value);
|
|
58
|
+
return import_react.default.cloneElement(child, {
|
|
59
|
+
value,
|
|
60
|
+
key: "group.".concat(index),
|
|
61
|
+
isGroup: true,
|
|
62
|
+
isMulti,
|
|
63
|
+
singleSelect,
|
|
64
|
+
isSelected,
|
|
65
|
+
onClick: (e) => onClick(e, { value, ...child.props })
|
|
66
|
+
});
|
|
67
|
+
}) })
|
|
68
|
+
] });
|
|
77
69
|
const props = {
|
|
78
70
|
title: import_ds_utilities.PropTypes.string.isRequired.description("group title"),
|
|
79
71
|
children: import_ds_utilities.PropTypes.node.isRequired.description("Array of MobileContextMenuItem"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenuGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { noop } from 'lodash';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\n\nconst Title = styled.div`\n height: 24px;\n line-height: 24px;\n font-size: 12px;\n border-top: 1px solid ${(props) => props.theme.colors.brand['300']};\n background: ${(props) => props.theme.colors.brand['200']};\n padding: 0 ${(props) => props.theme.space.xs};\n color: ${(props) => props.theme.colors.neutral['700']};\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nconst DSMobileContextMenuGroup = ({ title, isMulti, singleSelect, children, value: groupValue, selectedItems }) => (\n <Grid>\n <Grid>\n <Title>{title}</Title>\n </Grid>\n <Grid>\n {React.Children.map(children, (child, index) => {\n const { onClick = noop } = child.props;\n const value = `${groupValue}:${index}`;\n let isSelected;\n if (singleSelect) isSelected = selectedItems === value;\n else if (isMulti) isSelected = selectedItems.includes(value);\n return React.cloneElement(child, {\n value,\n key: 'group.'.concat(index),\n isGroup: true,\n isMulti,\n singleSelect,\n isSelected,\n onClick: (e) => onClick(e, { value, ...child.props }),\n });\n })}\n </Grid>\n </Grid>\n);\n\nconst props = {\n /**\n * Group title\n */\n title: PropTypes.string.isRequired.description('group title'),\n /**\n * Array of MobileContextMenuItem\n */\n children: PropTypes.node.isRequired.description('Array of MobileContextMenuItem'),\n /** multi select */\n isMulti: PropTypes.bool.description('multi select'),\n /** single select */\n singleSelect: PropTypes.bool.description('single select'),\n /** value for select */\n value: PropTypes.string.description('value for select'),\n /** selected items, array for multi, string for single */\n selectedItems: PropTypes.oneOfType([PropTypes.array, PropTypes.string]).description(\n 'selected items, array for multi, string for single',\n ),\n};\n\nDSMobileContextMenuGroup.propTypes = props;\nDSMobileContextMenuGroup.componentType = 'DSMobileContextMenuGroup';\nDSMobileContextMenuGroup.displayName = 'DSMobileContextMenuGroup';\nconst DSMobileContextMenuGroupWithSchema = describe(DSMobileContextMenuGroup);\n\nDSMobileContextMenuGroupWithSchema.propTypes = props;\n\nexport { DSMobileContextMenuGroup, DSMobileContextMenuGroupWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBrB;AAlBF,mBAAkB;AAClB,uBAAuB;AACvB,qBAAqB;AACrB,oBAAqB;AACrB,0BAAoC;AAEpC,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA,0BAIK,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,gBAC9C,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,eACrC,CAACA,WAAUA,OAAM,MAAM,MAAM;AAAA,WACjC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,iBAChC,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA;AAGpD,MAAM,2BAA2B,CAAC,EAAE,OAAO,SAAS,cAAc,UAAU,OAAO,YAAY,cAAc,MAC3G,6CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBrB;AAlBF,mBAAkB;AAClB,uBAAuB;AACvB,qBAAqB;AACrB,oBAAqB;AACrB,0BAAoC;AAEpC,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA,0BAIK,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,gBAC9C,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM;AAAA,eACrC,CAACA,WAAUA,OAAM,MAAM,MAAM;AAAA,WACjC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ;AAAA,iBAChC,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA;AAGpD,MAAM,2BAA2B,CAAC,EAAE,OAAO,SAAS,cAAc,UAAU,OAAO,YAAY,cAAc,MAC3G,6CAAC,uBACC;AAAA,8CAAC,uBACC,sDAAC,SAAO,iBAAM,GAChB;AAAA,EACA,4CAAC,uBACE,uBAAAC,QAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AAC9C,UAAM,EAAE,UAAU,mBAAK,IAAI,MAAM;AACjC,UAAM,QAAQ,GAAG,cAAc;AAC/B,QAAI;AACJ,QAAI;AAAc,mBAAa,kBAAkB;AAAA,aACxC;AAAS,mBAAa,cAAc,SAAS,KAAK;AAC3D,WAAO,aAAAA,QAAM,aAAa,OAAO;AAAA,MAC/B;AAAA,MACA,KAAK,SAAS,OAAO,KAAK;AAAA,MAC1B,SAAS;AAAA,MACT;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,CAAC,MAAM,QAAQ,GAAG,EAAE,OAAO,GAAG,MAAM,MAAM,CAAC;AAAA,IACtD,CAAC;AAAA,EACH,CAAC,GACH;AAAA,GACF;AAGF,MAAM,QAAQ;AAAA,EAIZ,OAAO,8BAAU,OAAO,WAAW,YAAY,aAAa;AAAA,EAI5D,UAAU,8BAAU,KAAK,WAAW,YAAY,gCAAgC;AAAA,EAEhF,SAAS,8BAAU,KAAK,YAAY,cAAc;AAAA,EAElD,cAAc,8BAAU,KAAK,YAAY,eAAe;AAAA,EAExD,OAAO,8BAAU,OAAO,YAAY,kBAAkB;AAAA,EAEtD,eAAe,8BAAU,UAAU,CAAC,8BAAU,OAAO,8BAAU,MAAM,CAAC,EAAE;AAAA,IACtE;AAAA,EACF;AACF;AAEA,yBAAyB,YAAY;AACrC,yBAAyB,gBAAgB;AACzC,yBAAyB,cAAc;AACvC,MAAM,yCAAqC,8BAAS,wBAAwB;AAE5E,mCAAmC,YAAY;",
|
|
6
6
|
"names": ["props", "React"]
|
|
7
7
|
}
|
|
@@ -37,14 +37,10 @@ var import_ds_shared = require("@elliemae/ds-shared");
|
|
|
37
37
|
var import_ds_form = require("@elliemae/ds-form");
|
|
38
38
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
39
39
|
var import_MobileTouchable = require("../MobileTouchable");
|
|
40
|
-
const Wrap = (0, import_ds_system.styled)((props2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_MobileTouchable.DSMobileTouchable, {
|
|
41
|
-
...props2
|
|
42
|
-
}))`
|
|
40
|
+
const Wrap = (0, import_ds_system.styled)((props2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_MobileTouchable.DSMobileTouchable, { ...props2 }))`
|
|
43
41
|
border-bottom: none;
|
|
44
42
|
`;
|
|
45
|
-
const PropWrap = (0, import_ds_system.styled)((props2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
|
|
46
|
-
...props2
|
|
47
|
-
}))`
|
|
43
|
+
const PropWrap = (0, import_ds_system.styled)((props2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { ...props2 }))`
|
|
48
44
|
${(props2) => {
|
|
49
45
|
if (!props2.isMulti) {
|
|
50
46
|
return `
|
|
@@ -86,76 +82,48 @@ const DSMobileContextMenuItem = ({
|
|
|
86
82
|
onClick = () => {
|
|
87
83
|
},
|
|
88
84
|
value
|
|
89
|
-
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
someItemSelected =
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
showLeftAddon =
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
leftAddon =
|
|
101
|
-
|
|
102
|
-
"data-testid": "leftAddon-checkbox"
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
cols,
|
|
119
|
-
children: [
|
|
120
|
-
(singleSelect && someItemSelected || isMulti || leftAddon) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PropWrap, {
|
|
121
|
-
"data-testid": "left-addon",
|
|
122
|
-
isMulti,
|
|
123
|
-
alignItems: "center",
|
|
124
|
-
justifyContent: "center",
|
|
125
|
-
pl: "16px",
|
|
126
|
-
children: showLeftAddon && leftAddon
|
|
127
|
-
}),
|
|
128
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, {
|
|
129
|
-
height: "44px",
|
|
130
|
-
pr: "xs",
|
|
131
|
-
pl: !leftAddon && isGroup ? "24px" : "xs",
|
|
85
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
86
|
+
import_ds_shared.GroupItem,
|
|
87
|
+
{
|
|
88
|
+
render: (context) => {
|
|
89
|
+
const { activeValue } = context;
|
|
90
|
+
let someItemSelected = activeValue >= 0 && !Array.isArray(activeValue);
|
|
91
|
+
if (isGroup)
|
|
92
|
+
someItemSelected = typeof activeValue === "string";
|
|
93
|
+
let showLeftAddon = isSelected;
|
|
94
|
+
if (isMulti || !singleSelect)
|
|
95
|
+
showLeftAddon = true;
|
|
96
|
+
let leftAddon = leftProp || null;
|
|
97
|
+
if (isMulti)
|
|
98
|
+
leftAddon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, { checked: isSelected, "data-testid": "leftAddon-checkbox" });
|
|
99
|
+
if (singleSelect)
|
|
100
|
+
leftAddon = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckMark, { "data-testid": "leftAddon-checkmark" });
|
|
101
|
+
const cols = singleSelect && someItemSelected || leftAddon && !singleSelect || isMulti ? ["40px", "auto"] : ["auto"];
|
|
102
|
+
if (rightAddon)
|
|
103
|
+
cols.push("40px");
|
|
104
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
105
|
+
Wrap,
|
|
106
|
+
{
|
|
107
|
+
"data-testid": "ds-contextmenu-item",
|
|
108
|
+
onClick: (e) => {
|
|
109
|
+
if (singleSelect || isMulti)
|
|
110
|
+
context.onChange(value, e, { value, label, title });
|
|
111
|
+
onClick(e);
|
|
112
|
+
},
|
|
113
|
+
cols,
|
|
132
114
|
children: [
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, {
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
}),
|
|
140
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, {
|
|
141
|
-
alignItems: !label ? "center" : void 0,
|
|
142
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, {
|
|
143
|
-
"data-testid": "contextMenuItem-title",
|
|
144
|
-
children: title
|
|
145
|
-
})
|
|
146
|
-
})
|
|
115
|
+
(singleSelect && someItemSelected || isMulti || leftAddon) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PropWrap, { "data-testid": "left-addon", isMulti, alignItems: "center", justifyContent: "center", pl: "16px", children: showLeftAddon && leftAddon }),
|
|
116
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { height: "44px", pr: "xs", pl: !leftAddon && isGroup ? "24px" : "xs", children: [
|
|
117
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { alignItems: "center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, { "data-testid": "contextMenuItem-label", children: label }) }),
|
|
118
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { alignItems: !label ? "center" : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { "data-testid": "contextMenuItem-title", children: title }) })
|
|
119
|
+
] }),
|
|
120
|
+
rightAddon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PropWrap, { "data-testid": "right-addon", alignItems: "center", justifyContent: "center", children: rightAddon }) : null
|
|
147
121
|
]
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
alignItems: "center",
|
|
152
|
-
justifyContent: "center",
|
|
153
|
-
children: rightAddon
|
|
154
|
-
}) : null
|
|
155
|
-
]
|
|
156
|
-
});
|
|
122
|
+
}
|
|
123
|
+
);
|
|
124
|
+
}
|
|
157
125
|
}
|
|
158
|
-
|
|
126
|
+
);
|
|
159
127
|
const props = {
|
|
160
128
|
label: import_ds_utilities.PropTypes.string.description("label"),
|
|
161
129
|
title: import_ds_utilities.PropTypes.string.isRequired.description("menu item title"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenuItem.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable import/no-unresolved */\nimport React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { Grid } from '@elliemae/ds-grid';\nimport { styled, truncate } from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { DSMobileTouchable } from '../MobileTouchable';\n\nconst Wrap = styled((props) => <DSMobileTouchable {...props} />)`\n border-bottom: none;\n`;\n\nconst PropWrap = styled((props) => <Grid {...props} />)`\n ${(props) => {\n if (!props.isMulti) {\n return `\n & > span {\n height: 18px;\n width: 18px;\n }\n\n & > span > svg {\n height: 18px;\n width: 18px;\n }\n `;\n }\n return '';\n }}\n`;\n\nconst Title = styled.span`\n font-size: 16px;\n color: ${(props) => props.theme.colors.brand['600']};\n ${truncate()}\n`;\n\nconst Label = styled.span`\n font-size: 13px;\n color: ${(props) => props.theme.colors.neutral['600']};\n`;\n\nconst CheckMark = styled(Checkmark)`\n fill: ${(props) => props.theme.colors.brand['600']};\n`;\ninterface DSMobileContextMenuItemPropsT {\n label: string;\n title: string;\n leftProp: JSX.Element;\n isGroup: boolean;\n isMulti: boolean;\n isSelected: boolean;\n singleSelect: boolean;\n onClick: (e: any) => void;\n value: string;\n}\nconst DSMobileContextMenuItem = ({\n label,\n title,\n leftProp,\n rightAddon,\n isGroup,\n isMulti,\n singleSelect,\n isSelected,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick = () => {},\n value,\n}: DSMobileContextMenuItemPropsT): JSX.Element => (\n <GroupItem\n render={(context) => {\n const { activeValue } = context;\n let someItemSelected = activeValue >= 0 && !Array.isArray(activeValue);\n if (isGroup) someItemSelected = typeof activeValue === 'string';\n\n let showLeftAddon = isSelected;\n if (isMulti || !singleSelect) showLeftAddon = true;\n\n let leftAddon = leftProp || null;\n if (isMulti) leftAddon = <DSCheckbox checked={isSelected} data-testid=\"leftAddon-checkbox\" />;\n if (singleSelect) leftAddon = <CheckMark data-testid=\"leftAddon-checkmark\" />;\n\n const cols =\n (singleSelect && someItemSelected) || (leftAddon && !singleSelect) || isMulti ? ['40px', 'auto'] : ['auto'];\n if (rightAddon) cols.push('40px');\n return (\n <Wrap\n data-testid=\"ds-contextmenu-item\"\n onClick={(e) => {\n if (singleSelect || isMulti) context.onChange(value, e, { value, label, title });\n onClick(e);\n }}\n cols={cols}\n >\n {((singleSelect && someItemSelected) || isMulti || leftAddon) && (\n <PropWrap data-testid=\"left-addon\" isMulti={isMulti} alignItems=\"center\" justifyContent=\"center\" pl=\"16px\">\n {showLeftAddon && leftAddon}\n </PropWrap>\n )}\n <Grid height=\"44px\" pr=\"xs\" pl={!leftAddon && isGroup ? '24px' : 'xs'}>\n {label && (\n <Grid alignItems=\"center\">\n <Label data-testid=\"contextMenuItem-label\">{label}</Label>\n </Grid>\n )}\n <Grid alignItems={!label ? 'center' : undefined}>\n <Title data-testid=\"contextMenuItem-title\">{title}</Title>\n </Grid>\n </Grid>\n {rightAddon ? (\n <PropWrap data-testid=\"right-addon\" alignItems=\"center\" justifyContent=\"center\">\n {rightAddon}\n </PropWrap>\n ) : null}\n </Wrap>\n );\n }}\n />\n);\n\nconst props = {\n /** label */\n label: PropTypes.string.description('label'),\n /** menu item title */\n title: PropTypes.string.isRequired.description('menu item title'),\n /** */\n leftProp: PropTypes.element.description(''),\n /** multi select */\n isMulti: PropTypes.bool.description('multi select'),\n /** */\n singleSelect: PropTypes.bool.description(''),\n /** */\n isGroup: PropTypes.bool.description(''),\n /** on click handler */\n onClick: PropTypes.func.description('on click handler'),\n /** value for select */\n value: PropTypes.number.description('value for select'),\n /** selected value */\n isSelected: PropTypes.bool.description('selected value'),\n};\n\nDSMobileContextMenuItem.propTypes = props;\nDSMobileContextMenuItem.displayName = 'DSMobileContextMenuItem';\nconst DSMobileContextMenuItemWithSchema = describe(DSMobileContextMenuItem);\n\nDSMobileContextMenuItemWithSchema.propTypes = props;\n\nexport { DSMobileContextMenuItem, DSMobileContextMenuItemWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADYQ;AAR/B,0BAAoC;AACpC,qBAAqB;AACrB,uBAAiC;AACjC,uBAA0B;AAC1B,qBAA2B;AAC3B,sBAA0B;AAC1B,6BAAkC;AAElC,MAAM,WAAO,yBAAO,CAACA,WAAU,4CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["props"]
|
|
7
7
|
}
|
|
@@ -68,8 +68,5 @@ const StyledInput = import_ds_system.styled.input`
|
|
|
68
68
|
display: none;
|
|
69
69
|
}
|
|
70
70
|
`;
|
|
71
|
-
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, {
|
|
72
|
-
ref: innerRef,
|
|
73
|
-
...props
|
|
74
|
-
});
|
|
71
|
+
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, { ref: innerRef, ...props });
|
|
75
72
|
//# sourceMappingURL=Input.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDatePicker/Input.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type=date]& { \n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${props => props.theme.colors.neutral['000']};\n padding: 0 ${props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${props => props.theme.colors.neutral[200]};\n }\n\n input[type=date]&:active, input[type=date]&:focus {\n ${props => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${props =>\n props.value === ''\n ? props.theme.colors.neutral['500']\n : props.theme.colors.neutral['800']};\n content: '${props =>\n props.value === '' ? props.placeholder : props['data-displayvalue']}';\n }\n\n input[type=date]&::-webkit-datetime-edit, input[type=date]&::-webkit-inner-spin-button, input[type=date]&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => (\n <StyledInput ref={innerRef} {...props} />\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+CrB;AA9CF,uBAAuB;AACvB,IAAAA,oBAAgD;AAEhD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,eAAS,4CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMjD,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA,iBACrC,eAAS,4CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAG/C,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,MAItD,eAAS,yBAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAAA;AAAA;AAAA;AAAA,aAIrC,WACP,MAAM,UAAU,KACZ,MAAM,MAAM,OAAO,QAAQ,SAC3B,MAAM,MAAM,OAAO,QAAQ;AAAA,gBACrB,WACV,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS9C,MAAM,QAAQ,CAAC,EAAE,aAAa,MAAM,MACzC,4CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+CrB;AA9CF,uBAAuB;AACvB,IAAAA,oBAAgD;AAEhD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,eAAS,4CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMjD,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA,iBACrC,eAAS,4CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAG/C,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,MAItD,eAAS,yBAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAAA;AAAA;AAAA;AAAA,aAIrC,WACP,MAAM,UAAU,KACZ,MAAM,MAAM,OAAO,QAAQ,SAC3B,MAAM,MAAM,OAAO,QAAQ;AAAA,gBACrB,WACV,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS9C,MAAM,QAAQ,CAAC,EAAE,aAAa,MAAM,MACzC,4CAAC,eAAY,KAAK,UAAW,GAAG,OAAO;",
|
|
6
6
|
"names": ["import_ds_system"]
|
|
7
7
|
}
|
|
@@ -46,40 +46,49 @@ const DSMobileDatePicker = ({ disabled, value, tabIndex, placeholder, onChange }
|
|
|
46
46
|
}, [inputRef.current]);
|
|
47
47
|
const valueArr = value.split("-");
|
|
48
48
|
const displayValue = value && `${valueArr[1]} / ${valueArr[2]} / ${valueArr[0]}`;
|
|
49
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
"aria-label": "Date Picker Input Mask",
|
|
66
|
-
disabled,
|
|
67
|
-
onKeyDown: (e) => e.preventDefault(),
|
|
68
|
-
type: "date",
|
|
69
|
-
placeholder,
|
|
70
|
-
onChange: (e) => {
|
|
71
|
-
const { target } = e.nativeEvent;
|
|
72
|
-
function iosClearDefault() {
|
|
73
|
-
target.defaultValue = "";
|
|
49
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
50
|
+
import_ds_form.DSInputGroup,
|
|
51
|
+
{
|
|
52
|
+
rightAddon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
53
|
+
import_ds_button.default,
|
|
54
|
+
{
|
|
55
|
+
"aria-label": "Date Picker Button",
|
|
56
|
+
color: !disabled ? import_ds_icon.DSIconColors.PRIMARY : import_ds_icon.DSIconColors.NEUTRAL,
|
|
57
|
+
disabled,
|
|
58
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.DatePicker, {}),
|
|
59
|
+
type: "button",
|
|
60
|
+
buttonType: "secondary",
|
|
61
|
+
onClick: () => {
|
|
62
|
+
inputRef.current.focus();
|
|
63
|
+
inputRef.current.click();
|
|
64
|
+
}
|
|
74
65
|
}
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
66
|
+
),
|
|
67
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
68
|
+
import_Input.Input,
|
|
69
|
+
{
|
|
70
|
+
"data-testid": "ds-mobile-date-picker",
|
|
71
|
+
innerRef: inputRef,
|
|
72
|
+
"aria-label": "Date Picker Input Mask",
|
|
73
|
+
disabled,
|
|
74
|
+
onKeyDown: (e) => e.preventDefault(),
|
|
75
|
+
type: "date",
|
|
76
|
+
placeholder,
|
|
77
|
+
onChange: (e) => {
|
|
78
|
+
const { target } = e.nativeEvent;
|
|
79
|
+
function iosClearDefault() {
|
|
80
|
+
target.defaultValue = "";
|
|
81
|
+
}
|
|
82
|
+
window.setTimeout(iosClearDefault, 0);
|
|
83
|
+
onChange(e);
|
|
84
|
+
},
|
|
85
|
+
tabIndex,
|
|
86
|
+
value,
|
|
87
|
+
"data-displayvalue": displayValue
|
|
88
|
+
}
|
|
89
|
+
)
|
|
90
|
+
}
|
|
91
|
+
);
|
|
83
92
|
};
|
|
84
93
|
DSMobileDatePicker.defaultProps = {
|
|
85
94
|
disabled: false,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDatePicker/MobileDatePicker.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef, useEffect } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { DatePicker } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport { DSInputGroup } from '@elliemae/ds-form';\nimport { Input } from './Input';\n\nconst DSMobileDatePicker = ({ disabled, value, tabIndex, placeholder, onChange }) => {\n const inputRef = useRef(null);\n useEffect(() => {\n /*\n necessary if value is being set in mount, \n otherwise the clear won't work on the first click\n [SEE input onChange comment]\n */\n if (inputRef.current) {\n inputRef.current.defaultValue = '';\n }\n }, [inputRef.current]);\n const valueArr = value.split('-');\n const displayValue = value && `${valueArr[1]} / ${valueArr[2]} / ${valueArr[0]}`;\n return (\n <DSInputGroup\n rightAddon={\n <DSButton\n aria-label=\"Date Picker Button\"\n color={!disabled ? DSIconColors.PRIMARY : DSIconColors.NEUTRAL}\n disabled={disabled}\n icon={<DatePicker />}\n type=\"button\"\n buttonType=\"secondary\"\n onClick={() => {\n inputRef.current.focus();\n inputRef.current.click();\n }}\n />\n }\n >\n <Input\n data-testid=\"ds-mobile-date-picker\"\n innerRef={inputRef}\n aria-label=\"Date Picker Input Mask\"\n disabled={disabled}\n onKeyDown={(e) => e.preventDefault()}\n type=\"date\"\n placeholder={placeholder}\n onChange={(e) => {\n // https://github.com/facebook/react/issues/8938#issuecomment-360573204\n const { target } = e.nativeEvent;\n function iosClearDefault() {\n target.defaultValue = '';\n }\n window.setTimeout(iosClearDefault, 0);\n onChange(e);\n }}\n tabIndex={tabIndex}\n value={value}\n data-displayvalue={displayValue}\n />\n </DSInputGroup>\n );\n};\n\nDSMobileDatePicker.defaultProps = {\n disabled: false,\n tabIndex: 0,\n placeholder: 'MM / DD / YYYY',\n};\n\nconst props = {\n /**\n * defaults to false\n */\n disabled: PropTypes.bool.description('defaults to false'),\n /**\n * 0 as default\n */\n tabIndex: PropTypes.number.description('0 as default'),\n /**\n * MM / DD / YYYY as default\n */\n placeholder: PropTypes.string.description('MM / DD / YYYY as default'),\n /**\n * onChange handler, receives change event as first argument\n */\n onChange: PropTypes.func.description('onChange handler, receives change event as first argument'),\n /**\n * ISO8601 string representing the date in format YYYY-MM-DD or empty string\n */\n value: PropTypes.string.description('ISO8601 string representing the date in format YYYY-MM-DD or empty string'),\n};\n\nDSMobileDatePicker.propTypes = props;\nDSMobileDatePicker.displayName = 'DSMobileDatePicker';\nconst DSMobileDatePickerWithSchema = describe(DSMobileDatePicker);\n\nDSMobileDatePickerWithSchema.propTypes = props;\n\nexport { DSMobileDatePicker, DSMobileDatePickerWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BP;AA7BhB,mBAAyC;AACzC,0BAAoC;AACpC,qBAA6B;AAC7B,sBAA2B;AAC3B,uBAAqB;AACrB,qBAA6B;AAC7B,mBAAsB;AAEtB,MAAM,qBAAqB,CAAC,EAAE,UAAU,OAAO,UAAU,aAAa,SAAS,MAAM;AACnF,QAAM,eAAW,qBAAO,IAAI;AAC5B,8BAAU,MAAM;AAMd,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,eAAe;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,SAAS,OAAO,CAAC;AACrB,QAAM,WAAW,MAAM,MAAM,GAAG;AAChC,QAAM,eAAe,SAAS,GAAG,SAAS,QAAQ,SAAS,QAAQ,SAAS;AAC5E,SACE,
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BP;AA7BhB,mBAAyC;AACzC,0BAAoC;AACpC,qBAA6B;AAC7B,sBAA2B;AAC3B,uBAAqB;AACrB,qBAA6B;AAC7B,mBAAsB;AAEtB,MAAM,qBAAqB,CAAC,EAAE,UAAU,OAAO,UAAU,aAAa,SAAS,MAAM;AACnF,QAAM,eAAW,qBAAO,IAAI;AAC5B,8BAAU,MAAM;AAMd,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,eAAe;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,SAAS,OAAO,CAAC;AACrB,QAAM,WAAW,MAAM,MAAM,GAAG;AAChC,QAAM,eAAe,SAAS,GAAG,SAAS,QAAQ,SAAS,QAAQ,SAAS;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YACE;AAAA,QAAC,iBAAAA;AAAA,QAAA;AAAA,UACC,cAAW;AAAA,UACX,OAAO,CAAC,WAAW,4BAAa,UAAU,4BAAa;AAAA,UACvD;AAAA,UACA,MAAM,4CAAC,8BAAW;AAAA,UAClB,MAAK;AAAA,UACL,YAAW;AAAA,UACX,SAAS,MAAM;AACb,qBAAS,QAAQ,MAAM;AACvB,qBAAS,QAAQ,MAAM;AAAA,UACzB;AAAA;AAAA,MACF;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,eAAY;AAAA,UACZ,UAAU;AAAA,UACV,cAAW;AAAA,UACX;AAAA,UACA,WAAW,CAAC,MAAM,EAAE,eAAe;AAAA,UACnC,MAAK;AAAA,UACL;AAAA,UACA,UAAU,CAAC,MAAM;AAEf,kBAAM,EAAE,OAAO,IAAI,EAAE;AACrB,qBAAS,kBAAkB;AACzB,qBAAO,eAAe;AAAA,YACxB;AACA,mBAAO,WAAW,iBAAiB,CAAC;AACpC,qBAAS,CAAC;AAAA,UACZ;AAAA,UACA;AAAA,UACA;AAAA,UACA,qBAAmB;AAAA;AAAA,MACrB;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,eAAe;AAAA,EAChC,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AACf;AAEA,MAAM,QAAQ;AAAA,EAIZ,UAAU,8BAAU,KAAK,YAAY,mBAAmB;AAAA,EAIxD,UAAU,8BAAU,OAAO,YAAY,cAAc;AAAA,EAIrD,aAAa,8BAAU,OAAO,YAAY,2BAA2B;AAAA,EAIrE,UAAU,8BAAU,KAAK,YAAY,2DAA2D;AAAA,EAIhG,OAAO,8BAAU,OAAO,YAAY,2EAA2E;AACjH;AAEA,mBAAmB,YAAY;AAC/B,mBAAmB,cAAc;AACjC,MAAM,mCAA+B,8BAAS,kBAAkB;AAEhE,6BAA6B,YAAY;",
|
|
6
6
|
"names": ["DSButton"]
|
|
7
7
|
}
|
|
@@ -71,12 +71,7 @@ const CaretWrap = import_ds_system.styled.span`
|
|
|
71
71
|
justify-content: center;
|
|
72
72
|
align-items: center;
|
|
73
73
|
`;
|
|
74
|
-
const Caret = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CaretWrap, {
|
|
75
|
-
onClick,
|
|
76
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronDown, {
|
|
77
|
-
color: ["brand-primary", "600"]
|
|
78
|
-
})
|
|
79
|
-
});
|
|
74
|
+
const Caret = ({ onClick }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CaretWrap, { onClick, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronDown, { color: ["brand-primary", "600"] }) });
|
|
80
75
|
Caret.propTypes = {
|
|
81
76
|
onClick: import_prop_types.default.func.isRequired
|
|
82
77
|
};
|
|
@@ -84,17 +79,8 @@ const DSMobileDropdownTriggerInput = ({
|
|
|
84
79
|
inputProps,
|
|
85
80
|
caretProps,
|
|
86
81
|
selectedItemsText
|
|
87
|
-
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(MobileDropdownInputWrap, {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
...inputProps,
|
|
92
|
-
readOnly: true,
|
|
93
|
-
value: selectedItemsText ?? inputProps.value
|
|
94
|
-
}),
|
|
95
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Caret, {
|
|
96
|
-
...caretProps
|
|
97
|
-
})
|
|
98
|
-
]
|
|
99
|
-
});
|
|
82
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(MobileDropdownInputWrap, { "data-testid": "ds-mobile-ddwn-menu", children: [
|
|
83
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(MobileDropdownInput, { ...inputProps, readOnly: true, value: selectedItemsText ?? inputProps.value }),
|
|
84
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Caret, { ...caretProps })
|
|
85
|
+
] });
|
|
100
86
|
//# sourceMappingURL=MobileDropdownInput.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDropdownMenu/MobileDropdownInput.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport PropTypes from 'prop-types';\nimport { focus } from '@elliemae/ds-system';\nimport { ChevronDown } from '@elliemae/ds-icons';\n\nexport const MobileDropdownInput = styled.input`\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n caret-color: transparent;\n padding-right: 32px;\n padding-left: 10px;\n border-radius: 2px;\n width: 100%;\n background: ${(props) => props.theme.colors.neutral['000']};\n height: 32px;\n line-height: 32px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n\n &:active,\n &:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n`;\n\nexport const MobileDropdownInputWrap = styled.span`\n position: relative;\n width: 100%;\n display: inline-block;\n height: 32px;\n`;\n\nconst CaretWrap = styled.span`\n width: 32px;\n height: 32px;\n position: absolute;\n right: 0;\n top: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const Caret = ({ onClick }): JSX.Element => (\n <CaretWrap onClick={onClick}>\n <ChevronDown color={['brand-primary', '600']} />\n </CaretWrap>\n);\n\nCaret.propTypes = {\n onClick: PropTypes.func.isRequired,\n};\n\nexport const DSMobileDropdownTriggerInput = ({\n inputProps,\n caretProps,\n selectedItemsText,\n}: {\n inputProps: Record<string, unknown>;\n caretProps: Record<string, unknown>;\n selectedItemsText?: string;\n}): JSX.Element => (\n <MobileDropdownInputWrap data-testid=\"ds-mobile-ddwn-menu\">\n <MobileDropdownInput {...inputProps} readOnly value={selectedItemsText ?? inputProps.value} />\n\n <Caret {...caretProps} />\n </MobileDropdownInputWrap>\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8CnB;AA7CJ,uBAAuB;AACvB,wBAAsB;AACtB,IAAAA,oBAAsB;AACtB,sBAA4B;AAErB,MAAM,sBAAsB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAS1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,sBAGhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,MAItD,CAAC,cAAU,yBAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAAA;AAAA;AAI7C,MAAM,0BAA0B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWlB,MAAM,QAAQ,CAAC,EAAE,QAAQ,MAC9B,4CAAC
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8CnB;AA7CJ,uBAAuB;AACvB,wBAAsB;AACtB,IAAAA,oBAAsB;AACtB,sBAA4B;AAErB,MAAM,sBAAsB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAS1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA,sBAGhC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,MAItD,CAAC,cAAU,yBAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAAA;AAAA;AAI7C,MAAM,0BAA0B,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWlB,MAAM,QAAQ,CAAC,EAAE,QAAQ,MAC9B,4CAAC,aAAU,SACT,sDAAC,+BAAY,OAAO,CAAC,iBAAiB,KAAK,GAAG,GAChD;AAGF,MAAM,YAAY;AAAA,EAChB,SAAS,kBAAAC,QAAU,KAAK;AAC1B;AAEO,MAAM,+BAA+B,CAAC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA;AACF,MAKE,6CAAC,2BAAwB,eAAY,uBACnC;AAAA,8CAAC,uBAAqB,GAAG,YAAY,UAAQ,MAAC,OAAO,qBAAqB,WAAW,OAAO;AAAA,EAE5F,4CAAC,SAAO,GAAG,YAAY;AAAA,GACzB;",
|
|
6
6
|
"names": ["import_ds_system", "PropTypes"]
|
|
7
7
|
}
|
|
@@ -71,36 +71,44 @@ const DSMobileDropdownMenu = ({
|
|
|
71
71
|
}),
|
|
72
72
|
[]
|
|
73
73
|
);
|
|
74
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
75
|
-
|
|
76
|
-
|
|
74
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
75
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
76
|
+
import_MobileDropdownInput.DSMobileDropdownTriggerInput,
|
|
77
|
+
{
|
|
77
78
|
inputProps,
|
|
78
79
|
caretProps
|
|
79
|
-
}
|
|
80
|
-
|
|
80
|
+
}
|
|
81
|
+
),
|
|
82
|
+
menuOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
83
|
+
import_MobileContextMenu.DSMobileContextMenu,
|
|
84
|
+
{
|
|
81
85
|
title,
|
|
82
86
|
open: true,
|
|
83
87
|
onChange: (_, e) => {
|
|
84
88
|
setMenuOpen(false);
|
|
85
89
|
},
|
|
86
90
|
onClickOutside: () => setMenuOpen(false),
|
|
87
|
-
children: options.map((opt, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
91
|
+
children: options.map((opt, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
92
|
+
import_MobileContextMenu.DSMobileContextMenuItem,
|
|
93
|
+
{
|
|
94
|
+
title: opt.label,
|
|
95
|
+
value: opt.value,
|
|
96
|
+
isSelected: itemsProps.isItemSelected(opt),
|
|
97
|
+
onClick: (e) => {
|
|
98
|
+
setMenuOpen(false);
|
|
99
|
+
itemsProps.onClick(opt, e);
|
|
100
|
+
},
|
|
101
|
+
label: itemsProps.label,
|
|
102
|
+
leftProp: itemsProps.leftProp,
|
|
103
|
+
isGroup: itemsProps.isGroup,
|
|
104
|
+
isMulti: itemsProps.isMulti,
|
|
105
|
+
singleSelect: itemsProps.singleSelect
|
|
94
106
|
},
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
}, "ddwn".concat(`${i}`)))
|
|
101
|
-
}) : null
|
|
102
|
-
]
|
|
103
|
-
});
|
|
107
|
+
"ddwn".concat(`${i}`)
|
|
108
|
+
))
|
|
109
|
+
}
|
|
110
|
+
) : null
|
|
111
|
+
] });
|
|
104
112
|
};
|
|
105
113
|
const props = {
|
|
106
114
|
placeholder: import_ds_utilities.PropTypes.string.description("dropdown menu placeholder"),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDropdownMenu/MobileDropdownMenu.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport {\n DSMobileContextMenu,\n DSMobileContextMenuItem,\n} from '../MobileContextMenu';\n\nimport { DSMobileDropdownTriggerInput } from './MobileDropdownInput';\ninterface OptionT {\n label: string;\n value: string;\n}\ninterface DSMobileDropdownMenuPropsT {\n placeholder: string;\n value: string;\n options: OptionT[];\n title: string;\n itemsProps: {\n label?: string;\n leftProp?: JSX.Element;\n isGroup?: boolean;\n isMulti?: boolean;\n singleSelect?: boolean;\n isItemSelected?: (opt: OptionT) => boolean;\n onClick?: (opt: OptionT, e: any) => void;\n };\n}\nconst DSMobileDropdownMenu = ({\n placeholder,\n options = [],\n title,\n value,\n itemsProps = {\n label: undefined,\n leftProp: undefined,\n isGroup: false,\n isMulti: false,\n singleSelect: false,\n isItemSelected: () => false,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick: () => {},\n },\n}: DSMobileDropdownMenuPropsT): JSX.Element => {\n const [menuOpen, setMenuOpen] = useState(false);\n const inputRef = useRef(null);\n const inputProps = React.useMemo(\n () => ({\n readOnly: true,\n value,\n onClick: () => setMenuOpen(true),\n ref: inputRef,\n placeholder,\n }),\n [value, placeholder],\n );\n const caretProps = React.useMemo(\n () => ({\n onClick: () => {\n inputRef.current.focus();\n setMenuOpen(true);\n },\n }),\n [],\n );\n return (\n <>\n <DSMobileDropdownTriggerInput\n inputProps={inputProps}\n caretProps={caretProps}\n />\n {menuOpen ? (\n <DSMobileContextMenu\n title={title}\n open\n onChange={(_, e) => {\n setMenuOpen(false);\n }}\n onClickOutside={() => setMenuOpen(false)}\n >\n {options.map((opt, i) => (\n <DSMobileContextMenuItem\n key={'ddwn'.concat(`${i}`)}\n title={opt.label}\n value={opt.value}\n isSelected={itemsProps.isItemSelected(opt)}\n onClick={(e) => {\n setMenuOpen(false);\n itemsProps.onClick(opt, e);\n }}\n label={itemsProps.label}\n leftProp={itemsProps.leftProp}\n isGroup={itemsProps.isGroup}\n isMulti={itemsProps.isMulti}\n singleSelect={itemsProps.singleSelect}\n />\n ))}\n </DSMobileContextMenu>\n ) : null}\n </>\n );\n};\n\nconst props = {\n /** dropdown menu placeholder */\n placeholder: PropTypes.string.description('dropdown menu placeholder'),\n /** context menu menu title */\n title: PropTypes.string.description('context menu menu title'),\n /** context menu options / items */\n options: PropTypes.arrayOf(\n PropTypes.shape({ value: PropTypes.string, label: PropTypes.string }),\n ).description('context menu options / items'),\n};\n\nDSMobileDropdownMenu.propTypes = props;\nDSMobileDropdownMenu.displayName = 'DSMobileDropdownMenu';\nconst DSMobileDropdownMenuWithSchema = describe(DSMobileDropdownMenu);\nDSMobileDropdownMenuWithSchema.propTypes = props;\n\nexport { DSMobileDropdownMenu, DSMobileDropdownMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkEnB;AAjEJ,mBAAwC;AACxC,0BAAoC;AACpC,+BAGO;AAEP,iCAA6C;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,eAAW,qBAAO,IAAI;AAC5B,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,KAAK;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AACA,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,SAAS,MAAM;AACb,iBAAS,QAAQ,MAAM;AACvB,oBAAY,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,SACE;AAAA
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkEnB;AAjEJ,mBAAwC;AACxC,0BAAoC;AACpC,+BAGO;AAEP,iCAA6C;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,eAAW,qBAAO,IAAI;AAC5B,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,KAAK;AAAA,MACL;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AACA,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,SAAS,MAAM;AACb,iBAAS,QAAQ,MAAM;AACvB,oBAAY,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA;AAAA,IACF;AAAA,IACC,WACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAI;AAAA,QACJ,UAAU,CAAC,GAAG,MAAM;AAClB,sBAAY,KAAK;AAAA,QACnB;AAAA,QACA,gBAAgB,MAAM,YAAY,KAAK;AAAA,QAEtC,kBAAQ,IAAI,CAAC,KAAK,MACjB;AAAA,UAAC;AAAA;AAAA,YAEC,OAAO,IAAI;AAAA,YACX,OAAO,IAAI;AAAA,YACX,YAAY,WAAW,eAAe,GAAG;AAAA,YACzC,SAAS,CAAC,MAAM;AACd,0BAAY,KAAK;AACjB,yBAAW,QAAQ,KAAK,CAAC;AAAA,YAC3B;AAAA,YACA,OAAO,WAAW;AAAA,YAClB,UAAU,WAAW;AAAA,YACrB,SAAS,WAAW;AAAA,YACpB,SAAS,WAAW;AAAA,YACpB,cAAc,WAAW;AAAA;AAAA,UAZpB,OAAO,OAAO,GAAG,GAAG;AAAA,QAa3B,CACD;AAAA;AAAA,IACH,IACE;AAAA,KACN;AAEJ;AAEA,MAAM,QAAQ;AAAA,EAEZ,aAAa,8BAAU,OAAO,YAAY,2BAA2B;AAAA,EAErE,OAAO,8BAAU,OAAO,YAAY,yBAAyB;AAAA,EAE7D,SAAS,8BAAU;AAAA,IACjB,8BAAU,MAAM,EAAE,OAAO,8BAAU,QAAQ,OAAO,8BAAU,OAAO,CAAC;AAAA,EACtE,EAAE,YAAY,8BAA8B;AAC9C;AAEA,qBAAqB,YAAY;AACjC,qBAAqB,cAAc;AACnC,MAAM,qCAAiC,8BAAS,oBAAoB;AACpE,+BAA+B,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -45,17 +45,10 @@ const Label = import_ds_system.styled.p`
|
|
|
45
45
|
font-size: ${(props2) => props2.theme.space.xs};
|
|
46
46
|
font-weight: ${(props2) => props2.theme.fontWeights.semibold};
|
|
47
47
|
`;
|
|
48
|
-
const DSMobileEmptyState = ({ label = "No search results found.", Icon }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrapper, {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
color: ["neutral", 400]
|
|
53
|
-
}),
|
|
54
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, {
|
|
55
|
-
children: label
|
|
56
|
-
})
|
|
57
|
-
]
|
|
58
|
-
});
|
|
48
|
+
const DSMobileEmptyState = ({ label = "No search results found.", Icon }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Wrapper, { children: [
|
|
49
|
+
Icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.Search, { size: "xxl", color: ["neutral", 400] }),
|
|
50
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Label, { children: label })
|
|
51
|
+
] });
|
|
59
52
|
const props = {
|
|
60
53
|
label: import_ds_utilities.PropTypes.string.description("empty state label"),
|
|
61
54
|
icon: import_ds_utilities.PropTypes.node.description("empty state icon")
|