@elliemae/ds-mobile 3.52.0-rc.9 → 3.52.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/CategoryBox/CategoryBox.js +2 -2
- package/dist/cjs/CategoryBox/CategoryBox.js.map +2 -2
- package/dist/cjs/GlobalHeader/MobileGlobalHeader.js +3 -3
- package/dist/cjs/GlobalHeader/MobileGlobalHeader.js.map +2 -2
- package/dist/cjs/GroupBox/GroupBox.js +2 -2
- package/dist/cjs/GroupBox/GroupBox.js.map +2 -2
- package/dist/cjs/LoadingPage/Page.js +2 -2
- package/dist/cjs/LoadingPage/Page.js.map +2 -2
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js +5 -5
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js.map +2 -2
- package/dist/cjs/MobileContextMenu/MobileContextMenuGroup.js +2 -2
- package/dist/cjs/MobileContextMenu/MobileContextMenuGroup.js.map +2 -2
- package/dist/cjs/MobileSelectList/MobileSelectList.js +4 -4
- package/dist/cjs/MobileSelectList/MobileSelectList.js.map +2 -2
- package/dist/cjs/MobileSelectList/styled.js +3 -3
- package/dist/cjs/MobileSelectList/styled.js.map +2 -2
- package/dist/cjs/MobileTouchable/MobileTouchable.js +2 -2
- package/dist/cjs/MobileTouchable/MobileTouchable.js.map +2 -2
- package/dist/cjs/Modal/Modal.js +4 -4
- package/dist/cjs/Modal/Modal.js.map +2 -2
- package/dist/cjs/SideNav/SideNav.js +2 -2
- package/dist/cjs/SideNav/SideNav.js.map +2 -2
- package/dist/esm/CategoryBox/CategoryBox.js +1 -1
- package/dist/esm/CategoryBox/CategoryBox.js.map +1 -1
- package/dist/esm/GlobalHeader/MobileGlobalHeader.js +1 -1
- package/dist/esm/GlobalHeader/MobileGlobalHeader.js.map +1 -1
- package/dist/esm/GroupBox/GroupBox.js +1 -1
- package/dist/esm/GroupBox/GroupBox.js.map +1 -1
- package/dist/esm/LoadingPage/Page.js +1 -1
- package/dist/esm/LoadingPage/Page.js.map +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenu.js +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenu.js.map +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenuGroup.js +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenuGroup.js.map +1 -1
- package/dist/esm/MobileSelectList/MobileSelectList.js +1 -1
- package/dist/esm/MobileSelectList/MobileSelectList.js.map +1 -1
- package/dist/esm/MobileSelectList/styled.js +1 -1
- package/dist/esm/MobileSelectList/styled.js.map +1 -1
- package/dist/esm/MobileTouchable/MobileTouchable.js +1 -1
- package/dist/esm/MobileTouchable/MobileTouchable.js.map +1 -1
- package/dist/esm/Modal/Modal.js +1 -1
- package/dist/esm/Modal/Modal.js.map +1 -1
- package/dist/esm/SideNav/SideNav.js +1 -1
- package/dist/esm/SideNav/SideNav.js.map +1 -1
- package/package.json +22 -22
|
@@ -35,7 +35,7 @@ module.exports = __toCommonJS(CategoryBox_exports);
|
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_react = __toESM(require("react"));
|
|
38
|
-
var
|
|
38
|
+
var import_lodash_es = require("lodash-es");
|
|
39
39
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
40
40
|
var import_ds_system = require("@elliemae/ds-system");
|
|
41
41
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
@@ -55,7 +55,7 @@ const DSCategoryBox = ({ borderTop = true, actionsRight = [], title, headerLevel
|
|
|
55
55
|
const rows = ["auto"];
|
|
56
56
|
const hasActions = actionsRight.length > 0;
|
|
57
57
|
if (hasActions) rows.push("auto");
|
|
58
|
-
const cols = import_react.default.useMemo(() => (0,
|
|
58
|
+
const cols = import_react.default.useMemo(() => (0, import_lodash_es.times)(actionsRight.length, () => "auto"), [actionsRight.length]);
|
|
59
59
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { rows: ["40px", "auto"], children: [
|
|
60
60
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
61
61
|
CategoryBox,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/CategoryBox/CategoryBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { times } from 'lodash';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { styled, truncate } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst Title = styled.h3`\n font-size: 18px;\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['700']};\n line-height: inherit;\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nconst CategoryBox = styled(Grid)`\n background: ${(props) => props.theme.colors.neutral['0']};\n border-top: ${(props) => (props.hasBorderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none')};\n`;\n\nconst DSCategoryBox = ({ borderTop = true, actionsRight = [], title, headerLevel = 3, children }) => {\n const rows = ['auto'];\n const hasActions = actionsRight.length > 0;\n if (hasActions) rows.push('auto');\n\n const cols = React.useMemo(() => times(actionsRight.length, () => 'auto'), [actionsRight.length]);\n\n return (\n <Grid rows={['40px', 'auto']}>\n <CategoryBox\n cols={rows}\n hasBorderTop={borderTop}\n alignItems=\"center\"\n pl=\"xs\"\n pr={actionsRight.length > 0 ? 'xxs' : 'xs'}\n >\n <Title as={`h${headerLevel}`}>{title}</Title>\n {hasActions && (\n <Grid cols={cols} justifySelf=\"end\">\n {actionsRight}\n </Grid>\n )}\n </CategoryBox>\n {children}\n </Grid>\n );\n};\n\nconst props = {\n /**\n * Category Box title\n */\n title: PropTypes.string.isRequired.description('Category Box title'),\n /**\n * Toggle border top of category box\n */\n borderTop: PropTypes.bool.description('Toggle border top of category box'),\n /**\n * Array of button icons\n */\n actionsRight: PropTypes.arrayOf(PropTypes.element).description('Array of button icons'),\n /**\n * semantic level of header tag for the title\n */\n headerLevel: PropTypes.oneOf([1, 2, 3, 4, 5, 6]).description('semantic level of header tag for the title'),\n /**\n * In-box children\n */\n children: PropTypes.element.description('In-box children'),\n};\n\nDSCategoryBox.displayName = 'DSCategoryBox';\nconst DSCategoryBoxWithSchema = describe(DSCategoryBox);\nDSCategoryBoxWithSchema.propTypes = props;\n\nexport { DSCategoryBox, DSCategoryBoxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BjB;AA7BN,mBAAkB;AAClB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { times } from 'lodash-es';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { styled, truncate } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst Title = styled.h3`\n font-size: 18px;\n margin: 0;\n color: ${(props) => props.theme.colors.neutral['700']};\n line-height: inherit;\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nconst CategoryBox = styled(Grid)`\n background: ${(props) => props.theme.colors.neutral['0']};\n border-top: ${(props) => (props.hasBorderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none')};\n`;\n\nconst DSCategoryBox = ({ borderTop = true, actionsRight = [], title, headerLevel = 3, children }) => {\n const rows = ['auto'];\n const hasActions = actionsRight.length > 0;\n if (hasActions) rows.push('auto');\n\n const cols = React.useMemo(() => times(actionsRight.length, () => 'auto'), [actionsRight.length]);\n\n return (\n <Grid rows={['40px', 'auto']}>\n <CategoryBox\n cols={rows}\n hasBorderTop={borderTop}\n alignItems=\"center\"\n pl=\"xs\"\n pr={actionsRight.length > 0 ? 'xxs' : 'xs'}\n >\n <Title as={`h${headerLevel}`}>{title}</Title>\n {hasActions && (\n <Grid cols={cols} justifySelf=\"end\">\n {actionsRight}\n </Grid>\n )}\n </CategoryBox>\n {children}\n </Grid>\n );\n};\n\nconst props = {\n /**\n * Category Box title\n */\n title: PropTypes.string.isRequired.description('Category Box title'),\n /**\n * Toggle border top of category box\n */\n borderTop: PropTypes.bool.description('Toggle border top of category box'),\n /**\n * Array of button icons\n */\n actionsRight: PropTypes.arrayOf(PropTypes.element).description('Array of button icons'),\n /**\n * semantic level of header tag for the title\n */\n headerLevel: PropTypes.oneOf([1, 2, 3, 4, 5, 6]).description('semantic level of header tag for the title'),\n /**\n * In-box children\n */\n children: PropTypes.element.description('In-box children'),\n};\n\nDSCategoryBox.displayName = 'DSCategoryBox';\nconst DSCategoryBoxWithSchema = describe(DSCategoryBox);\nDSCategoryBoxWithSchema.propTypes = props;\n\nexport { DSCategoryBox, DSCategoryBoxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BjB;AA7BN,mBAAkB;AAClB,uBAAsB;AACtB,8BAAoC;AACpC,uBAAiC;AACjC,qBAAqB;AAErB,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA,WAGV,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA,QAEnD,2BAAS,CAAC;AAAA,iBACG,CAACA,WAAUA,OAAM,MAAM,YAAY,QAAQ;AAAA;AAG5D,MAAM,kBAAc,yBAAO,mBAAI;AAAA,gBACf,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA,gBAC1C,CAACA,WAAWA,OAAM,eAAe,aAAaA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC,KAAK,MAAO;AAAA;AAG3G,MAAM,gBAAgB,CAAC,EAAE,YAAY,MAAM,eAAe,CAAC,GAAG,OAAO,cAAc,GAAG,SAAS,MAAM;AACnG,QAAM,OAAO,CAAC,MAAM;AACpB,QAAM,aAAa,aAAa,SAAS;AACzC,MAAI,WAAY,MAAK,KAAK,MAAM;AAEhC,QAAM,OAAO,aAAAC,QAAM,QAAQ,UAAM,wBAAM,aAAa,QAAQ,MAAM,MAAM,GAAG,CAAC,aAAa,MAAM,CAAC;AAEhG,SACE,6CAAC,uBAAK,MAAM,CAAC,QAAQ,MAAM,GACzB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,cAAc;AAAA,QACd,YAAW;AAAA,QACX,IAAG;AAAA,QACH,IAAI,aAAa,SAAS,IAAI,QAAQ;AAAA,QAEtC;AAAA,sDAAC,SAAM,IAAI,IAAI,WAAW,IAAK,iBAAM;AAAA,UACpC,cACC,4CAAC,uBAAK,MAAY,aAAY,OAC3B,wBACH;AAAA;AAAA;AAAA,IAEJ;AAAA,IACC;AAAA,KACH;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,EAIZ,OAAO,kCAAU,OAAO,WAAW,YAAY,oBAAoB;AAAA;AAAA;AAAA;AAAA,EAInE,WAAW,kCAAU,KAAK,YAAY,mCAAmC;AAAA;AAAA;AAAA;AAAA,EAIzE,cAAc,kCAAU,QAAQ,kCAAU,OAAO,EAAE,YAAY,uBAAuB;AAAA;AAAA;AAAA;AAAA,EAItF,aAAa,kCAAU,MAAM,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC,EAAE,YAAY,4CAA4C;AAAA;AAAA;AAAA;AAAA,EAIzG,UAAU,kCAAU,QAAQ,YAAY,iBAAiB;AAC3D;AAEA,cAAc,cAAc;AAC5B,MAAM,8BAA0B,kCAAS,aAAa;AACtD,wBAAwB,YAAY;",
|
|
6
6
|
"names": ["props", "React"]
|
|
7
7
|
}
|
|
@@ -40,7 +40,7 @@ var import_ds_form = require("@elliemae/ds-form");
|
|
|
40
40
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
41
41
|
var import_ds_button = require("@elliemae/ds-button");
|
|
42
42
|
var import_ds_icon = require("@elliemae/ds-icon");
|
|
43
|
-
var
|
|
43
|
+
var import_lodash_es = require("lodash-es");
|
|
44
44
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
45
45
|
var import_EM_logo = require("../Icons/EM_logo.js");
|
|
46
46
|
var import_styles = require("./styles.js");
|
|
@@ -49,7 +49,7 @@ const DSGlobalHeader = ({
|
|
|
49
49
|
containerProps = {},
|
|
50
50
|
title,
|
|
51
51
|
lastIcon,
|
|
52
|
-
onSearchChange =
|
|
52
|
+
onSearchChange = import_lodash_es.noop,
|
|
53
53
|
topMenuItems,
|
|
54
54
|
bottomMenuItems
|
|
55
55
|
}) => {
|
|
@@ -59,7 +59,7 @@ const DSGlobalHeader = ({
|
|
|
59
59
|
const searchClicked = () => {
|
|
60
60
|
setSearchBarVisible(true);
|
|
61
61
|
};
|
|
62
|
-
const onSearchChangeDebounced = (0, import_react.useCallback)((0,
|
|
62
|
+
const onSearchChangeDebounced = (0, import_react.useCallback)((0, import_lodash_es.debounce)(onSearchChange, 250), []);
|
|
63
63
|
const searchValueChanged = (e) => {
|
|
64
64
|
const val = e.target.value;
|
|
65
65
|
onSearchChangeDebounced(val);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/GlobalHeader/MobileGlobalHeader.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/jsx-no-bind */\n/* eslint-disable import/no-unresolved */\n/* eslint-disable max-lines */\nimport React, { useState, useCallback } from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { DSInput } from '@elliemae/ds-form';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSIconSizes, DSIconColors } from '@elliemae/ds-icon';\nimport { debounce, noop } from 'lodash';\nimport { Grid } from '@elliemae/ds-grid';\nimport { SvgIcon as Logo } from '../Icons/EM_logo.js';\nimport { Container, Label, SearchWrapper, Icon, RightSection, MainSection } from './styles.js';\nimport { DSSideNav } from '../SideNav/index.js';\n\nconst DSGlobalHeader = ({\n containerProps = {},\n title,\n lastIcon,\n onSearchChange = noop,\n topMenuItems,\n bottomMenuItems,\n}) => {\n const [searchBarVisible, setSearchBarVisible] = useState(false);\n const [searchValue, setSearchValue] = useState();\n const [showMenu, setShowMenu] = useState(false);\n const searchClicked = () => {\n setSearchBarVisible(true);\n };\n\n const onSearchChangeDebounced = useCallback(debounce(onSearchChange, 250), []);\n const searchValueChanged = (e) => {\n const val = e.target.value;\n onSearchChangeDebounced(val);\n setSearchValue(val);\n };\n\n const searchCloseClicked = () => {\n setSearchBarVisible(false);\n };\n\n const menuToggle = (flag) => {\n setShowMenu(flag);\n };\n\n return (\n <>\n <Container data-testid={containerProps['data-testid'] || 'global-header-wrapper'} {...containerProps}>\n {!searchBarVisible ? (\n <>\n <MainSection>\n <Icon onClick={menuToggle.bind(null, true)}>{Logo()}</Icon>\n <Label>{title}</Label>\n <span></span>\n <RightSection>\n <Grid cols={lastIcon ? [1 / 2, 1 / 2] : [1]} gutter=\"xs\">\n <Grid>\n <Search\n data-testid=\"mobile-global-header-search\"\n size={DSIconSizes.M}\n color={DSIconColors.WHITE}\n onClick={searchClicked}\n />\n </Grid>\n {lastIcon && <Grid>{lastIcon}</Grid>}\n </Grid>\n </RightSection>\n </MainSection>\n </>\n ) : (\n <SearchWrapper>\n <DSInput\n clearable\n className=\"dsInput\"\n placeholder=\"Search here\"\n onChange={searchValueChanged}\n rightComponent={\n <DSButton\n buttonType=\"primary\"\n className=\"dsButton\"\n icon={<Search size={DSIconSizes.M} color={DSIconColors.WHITE} onClick={searchCloseClicked} />}\n />\n }\n value={searchValue}\n variant=\"variant-active\"\n />\n </SearchWrapper>\n )}\n </Container>\n {showMenu ? (\n <DSSideNav\n title={title}\n menuItems={topMenuItems}\n bottomMenuItems={bottomMenuItems}\n onClose={menuToggle.bind(null, false)}\n ></DSSideNav>\n ) : null}\n </>\n );\n};\n\nconst menuProps = PropTypes.arrayOf(\n PropTypes.shape({\n icon: PropTypes.element,\n text: PropTypes.string,\n }),\n).description('menu item array');\n\nconst props = {\n /** props to inject to wrapper */\n containerProps: PropTypes.object.description('props to inject to wrapper'),\n /**\n * Heading Title\n */\n title: PropTypes.string.isRequired.description('Heading Title'),\n /**\n * Dimsum icon Element\n */\n lastIcon: PropTypes.element.description('Dimsum icon Element'),\n /**\n * Callback function for search change\n */\n onSearchChange: PropTypes.func.description('Callback function for search change'),\n /**\n * Top Menu items array\n */\n topMenuItems: menuProps,\n /**\n * Bottom Menu items array\n */\n bottomMenuItems: menuProps,\n};\n\nDSGlobalHeader.displayName = 'DSGlobalHeader';\nconst DSGlobalHeaderWithSchema = describe(DSGlobalHeader);\nDSGlobalHeaderWithSchema.propTypes = props;\n\nexport { DSGlobalHeader, DSGlobalHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDb;AA9CV,mBAA6C;AAC7C,sBAAuB;AACvB,qBAAwB;AACxB,8BAAoC;AACpC,uBAAyB;AACzB,qBAA0C;AAC1C,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/jsx-no-bind */\n/* eslint-disable import/no-unresolved */\n/* eslint-disable max-lines */\nimport React, { useState, useCallback } from 'react';\nimport { Search } from '@elliemae/ds-icons';\nimport { DSInput } from '@elliemae/ds-form';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSIconSizes, DSIconColors } from '@elliemae/ds-icon';\nimport { debounce, noop } from 'lodash-es';\nimport { Grid } from '@elliemae/ds-grid';\nimport { SvgIcon as Logo } from '../Icons/EM_logo.js';\nimport { Container, Label, SearchWrapper, Icon, RightSection, MainSection } from './styles.js';\nimport { DSSideNav } from '../SideNav/index.js';\n\nconst DSGlobalHeader = ({\n containerProps = {},\n title,\n lastIcon,\n onSearchChange = noop,\n topMenuItems,\n bottomMenuItems,\n}) => {\n const [searchBarVisible, setSearchBarVisible] = useState(false);\n const [searchValue, setSearchValue] = useState();\n const [showMenu, setShowMenu] = useState(false);\n const searchClicked = () => {\n setSearchBarVisible(true);\n };\n\n const onSearchChangeDebounced = useCallback(debounce(onSearchChange, 250), []);\n const searchValueChanged = (e) => {\n const val = e.target.value;\n onSearchChangeDebounced(val);\n setSearchValue(val);\n };\n\n const searchCloseClicked = () => {\n setSearchBarVisible(false);\n };\n\n const menuToggle = (flag) => {\n setShowMenu(flag);\n };\n\n return (\n <>\n <Container data-testid={containerProps['data-testid'] || 'global-header-wrapper'} {...containerProps}>\n {!searchBarVisible ? (\n <>\n <MainSection>\n <Icon onClick={menuToggle.bind(null, true)}>{Logo()}</Icon>\n <Label>{title}</Label>\n <span></span>\n <RightSection>\n <Grid cols={lastIcon ? [1 / 2, 1 / 2] : [1]} gutter=\"xs\">\n <Grid>\n <Search\n data-testid=\"mobile-global-header-search\"\n size={DSIconSizes.M}\n color={DSIconColors.WHITE}\n onClick={searchClicked}\n />\n </Grid>\n {lastIcon && <Grid>{lastIcon}</Grid>}\n </Grid>\n </RightSection>\n </MainSection>\n </>\n ) : (\n <SearchWrapper>\n <DSInput\n clearable\n className=\"dsInput\"\n placeholder=\"Search here\"\n onChange={searchValueChanged}\n rightComponent={\n <DSButton\n buttonType=\"primary\"\n className=\"dsButton\"\n icon={<Search size={DSIconSizes.M} color={DSIconColors.WHITE} onClick={searchCloseClicked} />}\n />\n }\n value={searchValue}\n variant=\"variant-active\"\n />\n </SearchWrapper>\n )}\n </Container>\n {showMenu ? (\n <DSSideNav\n title={title}\n menuItems={topMenuItems}\n bottomMenuItems={bottomMenuItems}\n onClose={menuToggle.bind(null, false)}\n ></DSSideNav>\n ) : null}\n </>\n );\n};\n\nconst menuProps = PropTypes.arrayOf(\n PropTypes.shape({\n icon: PropTypes.element,\n text: PropTypes.string,\n }),\n).description('menu item array');\n\nconst props = {\n /** props to inject to wrapper */\n containerProps: PropTypes.object.description('props to inject to wrapper'),\n /**\n * Heading Title\n */\n title: PropTypes.string.isRequired.description('Heading Title'),\n /**\n * Dimsum icon Element\n */\n lastIcon: PropTypes.element.description('Dimsum icon Element'),\n /**\n * Callback function for search change\n */\n onSearchChange: PropTypes.func.description('Callback function for search change'),\n /**\n * Top Menu items array\n */\n topMenuItems: menuProps,\n /**\n * Bottom Menu items array\n */\n bottomMenuItems: menuProps,\n};\n\nDSGlobalHeader.displayName = 'DSGlobalHeader';\nconst DSGlobalHeaderWithSchema = describe(DSGlobalHeader);\nDSGlobalHeaderWithSchema.propTypes = props;\n\nexport { DSGlobalHeader, DSGlobalHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Logo"]
|
|
7
7
|
}
|
|
@@ -35,7 +35,7 @@ module.exports = __toCommonJS(GroupBox_exports);
|
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
|
-
var
|
|
38
|
+
var import_lodash_es = require("lodash-es");
|
|
39
39
|
var import_ds_system = require("@elliemae/ds-system");
|
|
40
40
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
41
41
|
const Title = import_ds_system.styled.h3`
|
|
@@ -68,7 +68,7 @@ const DSGroupBox = ({ children, title, background = "grey", headerLevel = 3, act
|
|
|
68
68
|
pr: hasActions ? "xxs" : "xs",
|
|
69
69
|
children: [
|
|
70
70
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { as: `h${headerLevel}`, children: title }),
|
|
71
|
-
hasActions && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { cols: (0,
|
|
71
|
+
hasActions && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { cols: (0, import_lodash_es.times)(actionsRight.length, () => "auto"), justifySelf: "end", children: actionsRight })
|
|
72
72
|
]
|
|
73
73
|
}
|
|
74
74
|
),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/GroupBox/GroupBox.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { times } from 'lodash';\nimport { truncate, styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst Title = styled.h3`\n font-size: 14px;\n margin: 0;\n ${truncate()}\n color: ${(props) => props.theme.colors.neutral['700']};\n line-height: inherit;\n text-transform: capitalize;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nconst GroupBox = styled(Grid)`\n background: ${(props) =>\n props.background === 'grey' ? props.theme.colors.neutral['050'] : props.theme.colors.neutral['000']};\n\n border-top: ${(props) => (props.borderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none')};\n`;\n\nconst DSGroupBox = ({ children, title, background = 'grey', headerLevel = 3, actionsRight = [], borderTop }) => {\n const rows = ['auto'];\n const hasActions = actionsRight.length > 0;\n if (hasActions) rows.push('auto');\n return (\n <Grid rows={['32px', 'auto']}>\n <GroupBox\n background={background}\n cols={rows}\n borderTop={borderTop}\n alignItems=\"center\"\n pl=\"xs\"\n pr={hasActions ? 'xxs' : 'xs'}\n >\n <Title as={`h${headerLevel}`}>{title}</Title>\n {hasActions && (\n <Grid cols={times(actionsRight.length, () => 'auto')} justifySelf=\"end\">\n {actionsRight}\n </Grid>\n )}\n </GroupBox>\n {children}\n </Grid>\n );\n};\n\nconst props = {\n /**\n * In-box children\n */\n children: PropTypes.element.description('In-box children'),\n /**\n * Title background\n */\n background: PropTypes.oneOf(['white', 'grey']).description('Title background'),\n /**\n * Toggle border top of group box\n */\n borderTop: PropTypes.bool.description('Toggle border top of group box'),\n /**\n * Group Box title\n */\n title: PropTypes.string.isRequired.description('Group Box title'),\n /**\n * semantic level of header tag for the title\n */\n headerLevel: PropTypes.oneOf([1, 2, 3, 4, 5, 6]).description('semantic level of header tag for the title'),\n /**\n * Array of button icons\n */\n actionsRight: PropTypes.arrayOf(PropTypes.element).description('Array of button icons'),\n};\n\nDSGroupBox.displayName = 'DSGroupBox';\nconst DSGroupBoxWithSchema = describe(DSGroupBox);\nDSGroupBoxWithSchema.propTypes = props;\n\nexport { DSGroupBox, DSGroupBoxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BjB;AA5BN,8BAAoC;AACpC,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { times } from 'lodash-es';\nimport { truncate, styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst Title = styled.h3`\n font-size: 14px;\n margin: 0;\n ${truncate()}\n color: ${(props) => props.theme.colors.neutral['700']};\n line-height: inherit;\n text-transform: capitalize;\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n`;\n\nconst GroupBox = styled(Grid)`\n background: ${(props) =>\n props.background === 'grey' ? props.theme.colors.neutral['050'] : props.theme.colors.neutral['000']};\n\n border-top: ${(props) => (props.borderTop ? `1px solid ${props.theme.colors.neutral['100']}` : 'none')};\n`;\n\nconst DSGroupBox = ({ children, title, background = 'grey', headerLevel = 3, actionsRight = [], borderTop }) => {\n const rows = ['auto'];\n const hasActions = actionsRight.length > 0;\n if (hasActions) rows.push('auto');\n return (\n <Grid rows={['32px', 'auto']}>\n <GroupBox\n background={background}\n cols={rows}\n borderTop={borderTop}\n alignItems=\"center\"\n pl=\"xs\"\n pr={hasActions ? 'xxs' : 'xs'}\n >\n <Title as={`h${headerLevel}`}>{title}</Title>\n {hasActions && (\n <Grid cols={times(actionsRight.length, () => 'auto')} justifySelf=\"end\">\n {actionsRight}\n </Grid>\n )}\n </GroupBox>\n {children}\n </Grid>\n );\n};\n\nconst props = {\n /**\n * In-box children\n */\n children: PropTypes.element.description('In-box children'),\n /**\n * Title background\n */\n background: PropTypes.oneOf(['white', 'grey']).description('Title background'),\n /**\n * Toggle border top of group box\n */\n borderTop: PropTypes.bool.description('Toggle border top of group box'),\n /**\n * Group Box title\n */\n title: PropTypes.string.isRequired.description('Group Box title'),\n /**\n * semantic level of header tag for the title\n */\n headerLevel: PropTypes.oneOf([1, 2, 3, 4, 5, 6]).description('semantic level of header tag for the title'),\n /**\n * Array of button icons\n */\n actionsRight: PropTypes.arrayOf(PropTypes.element).description('Array of button icons'),\n};\n\nDSGroupBox.displayName = 'DSGroupBox';\nconst DSGroupBoxWithSchema = describe(DSGroupBox);\nDSGroupBoxWithSchema.propTypes = props;\n\nexport { DSGroupBox, DSGroupBoxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BjB;AA5BN,8BAAoC;AACpC,uBAAsB;AACtB,uBAAiC;AACjC,qBAAqB;AAErB,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA,QAGjB,2BAAS,CAAC;AAAA,WACH,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA,iBAGtC,CAACA,WAAUA,OAAM,MAAM,YAAY,QAAQ;AAAA;AAG5D,MAAM,eAAW,yBAAO,mBAAI;AAAA,gBACZ,CAACA,WACbA,OAAM,eAAe,SAASA,OAAM,MAAM,OAAO,QAAQ,KAAK,IAAIA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA,gBAEvF,CAACA,WAAWA,OAAM,YAAY,aAAaA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC,KAAK,MAAO;AAAA;AAGxG,MAAM,aAAa,CAAC,EAAE,UAAU,OAAO,aAAa,QAAQ,cAAc,GAAG,eAAe,CAAC,GAAG,UAAU,MAAM;AAC9G,QAAM,OAAO,CAAC,MAAM;AACpB,QAAM,aAAa,aAAa,SAAS;AACzC,MAAI,WAAY,MAAK,KAAK,MAAM;AAChC,SACE,6CAAC,uBAAK,MAAM,CAAC,QAAQ,MAAM,GACzB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM;AAAA,QACN;AAAA,QACA,YAAW;AAAA,QACX,IAAG;AAAA,QACH,IAAI,aAAa,QAAQ;AAAA,QAEzB;AAAA,sDAAC,SAAM,IAAI,IAAI,WAAW,IAAK,iBAAM;AAAA,UACpC,cACC,4CAAC,uBAAK,UAAM,wBAAM,aAAa,QAAQ,MAAM,MAAM,GAAG,aAAY,OAC/D,wBACH;AAAA;AAAA;AAAA,IAEJ;AAAA,IACC;AAAA,KACH;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,EAIZ,UAAU,kCAAU,QAAQ,YAAY,iBAAiB;AAAA;AAAA;AAAA;AAAA,EAIzD,YAAY,kCAAU,MAAM,CAAC,SAAS,MAAM,CAAC,EAAE,YAAY,kBAAkB;AAAA;AAAA;AAAA;AAAA,EAI7E,WAAW,kCAAU,KAAK,YAAY,gCAAgC;AAAA;AAAA;AAAA;AAAA,EAItE,OAAO,kCAAU,OAAO,WAAW,YAAY,iBAAiB;AAAA;AAAA;AAAA;AAAA,EAIhE,aAAa,kCAAU,MAAM,CAAC,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC,EAAE,YAAY,4CAA4C;AAAA;AAAA;AAAA;AAAA,EAIzG,cAAc,kCAAU,QAAQ,kCAAU,OAAO,EAAE,YAAY,uBAAuB;AACxF;AAEA,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU;AAChD,qBAAqB,YAAY;",
|
|
6
6
|
"names": ["props"]
|
|
7
7
|
}
|
|
@@ -36,7 +36,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
36
36
|
var import_react = __toESM(require("react"));
|
|
37
37
|
var import_prop_types = __toESM(require("prop-types"));
|
|
38
38
|
var import_ds_system = require("@elliemae/ds-system");
|
|
39
|
-
var
|
|
39
|
+
var import_lodash_es = require("lodash-es");
|
|
40
40
|
var import_ds_backdrop = require("@elliemae/ds-backdrop");
|
|
41
41
|
const LoadingPageLoader = import_ds_system.styled.div`
|
|
42
42
|
${({ type }) => type === "cover" ? "position: fixed" : "position: absolute"};
|
|
@@ -65,7 +65,7 @@ const LoadingPage = ({ backdropZIndex, children, loader, loading, type = "fill",
|
|
|
65
65
|
ref: childRef,
|
|
66
66
|
children: import_react.default.Children.toArray(child.props.children).concat([Loader, Back]),
|
|
67
67
|
style: {
|
|
68
|
-
...(0,
|
|
68
|
+
...(0, import_lodash_es.get)(child, "props.style", {}),
|
|
69
69
|
position: position === "static" ? "relative" : position
|
|
70
70
|
}
|
|
71
71
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/LoadingPage/Page.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { withTheme, styled } from '@elliemae/ds-system';\nimport { get } from 'lodash';\nimport { DSBackdrop } from '@elliemae/ds-backdrop';\n\nconst LoadingPageLoader = styled.div`\n ${({ type }) => (type === 'cover' ? 'position: fixed' : 'position: absolute')};\n\n z-index: ${(props) => props.zIndex || props.theme.zIndex.loader};\n top: 25%;\n left: 15%;\n width: 70%;\n height: 75%;\n display: flex;\n flex-direction: column;\n align-items: center;\n`;\n\nconst LoadingPage = ({ backdropZIndex, children, loader, loading, type = 'fill', zIndex }) => {\n const [position, setPosition] = useState(null);\n const childRef = useRef(null);\n useEffect(() => {\n if (childRef && childRef.current) {\n const style = childRef && window.getComputedStyle(childRef.current);\n setPosition(style.getPropertyValue('position'));\n }\n }, [childRef]);\n\n const Back = loading && <DSBackdrop type={type} zIndex={backdropZIndex} />;\n const Loader = loader && loading && (\n <LoadingPageLoader zIndex={zIndex} type={type} hide={!loading}>\n {loader}\n </LoadingPageLoader>\n );\n\n const injectRefPosition = (child) =>\n React.cloneElement(React.Children.only(child), {\n ref: childRef,\n children: React.Children.toArray(child.props.children).concat([Loader, Back]),\n style: {\n ...get(child, 'props.style', {}),\n position: position === 'static' ? 'relative' : position,\n },\n });\n\n if (React.Children.count(children) === 0) {\n return (\n <>\n {Loader}\n {Back}\n </>\n );\n }\n return injectRefPosition(children);\n};\n\nLoadingPage.propTypes = {\n /**\n * z-index of dimmer background\n */\n backdropZIndex: PropTypes.number,\n /**\n * Children page to show behind the loader\n */\n children: PropTypes.element,\n /**\n * Array of elements centrally aligned\n */\n loader: PropTypes.arrayOf(PropTypes.element),\n /**\n * Show / hide loader\n */\n loading: PropTypes.bool,\n /**\n * ['cover', 'fill']\n */\n type: PropTypes.oneOf(['fill', 'cover']),\n /**\n * z-index of loader, should be higher than the backdropZIndex\n */\n zIndex: PropTypes.number,\n};\n\nconst DSMobileLoadingPage = withTheme(LoadingPage);\n\nexport { DSMobileLoadingPage };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BG;AA7B1B,mBAAmD;AACnD,wBAAsB;AACtB,uBAAkC;AAClC,
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { withTheme, styled } from '@elliemae/ds-system';\nimport { get } from 'lodash-es';\nimport { DSBackdrop } from '@elliemae/ds-backdrop';\n\nconst LoadingPageLoader = styled.div`\n ${({ type }) => (type === 'cover' ? 'position: fixed' : 'position: absolute')};\n\n z-index: ${(props) => props.zIndex || props.theme.zIndex.loader};\n top: 25%;\n left: 15%;\n width: 70%;\n height: 75%;\n display: flex;\n flex-direction: column;\n align-items: center;\n`;\n\nconst LoadingPage = ({ backdropZIndex, children, loader, loading, type = 'fill', zIndex }) => {\n const [position, setPosition] = useState(null);\n const childRef = useRef(null);\n useEffect(() => {\n if (childRef && childRef.current) {\n const style = childRef && window.getComputedStyle(childRef.current);\n setPosition(style.getPropertyValue('position'));\n }\n }, [childRef]);\n\n const Back = loading && <DSBackdrop type={type} zIndex={backdropZIndex} />;\n const Loader = loader && loading && (\n <LoadingPageLoader zIndex={zIndex} type={type} hide={!loading}>\n {loader}\n </LoadingPageLoader>\n );\n\n const injectRefPosition = (child) =>\n React.cloneElement(React.Children.only(child), {\n ref: childRef,\n children: React.Children.toArray(child.props.children).concat([Loader, Back]),\n style: {\n ...get(child, 'props.style', {}),\n position: position === 'static' ? 'relative' : position,\n },\n });\n\n if (React.Children.count(children) === 0) {\n return (\n <>\n {Loader}\n {Back}\n </>\n );\n }\n return injectRefPosition(children);\n};\n\nLoadingPage.propTypes = {\n /**\n * z-index of dimmer background\n */\n backdropZIndex: PropTypes.number,\n /**\n * Children page to show behind the loader\n */\n children: PropTypes.element,\n /**\n * Array of elements centrally aligned\n */\n loader: PropTypes.arrayOf(PropTypes.element),\n /**\n * Show / hide loader\n */\n loading: PropTypes.bool,\n /**\n * ['cover', 'fill']\n */\n type: PropTypes.oneOf(['fill', 'cover']),\n /**\n * z-index of loader, should be higher than the backdropZIndex\n */\n zIndex: PropTypes.number,\n};\n\nconst DSMobileLoadingPage = withTheme(LoadingPage);\n\nexport { DSMobileLoadingPage };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BG;AA7B1B,mBAAmD;AACnD,wBAAsB;AACtB,uBAAkC;AAClC,uBAAoB;AACpB,yBAA2B;AAE3B,MAAM,oBAAoB,wBAAO;AAAA,IAC7B,CAAC,EAAE,KAAK,MAAO,SAAS,UAAU,oBAAoB,oBAAqB;AAAA;AAAA,aAElE,CAAC,UAAU,MAAM,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUjE,MAAM,cAAc,CAAC,EAAE,gBAAgB,UAAU,QAAQ,SAAS,OAAO,QAAQ,OAAO,MAAM;AAC5F,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,IAAI;AAC7C,QAAM,eAAW,qBAAO,IAAI;AAC5B,8BAAU,MAAM;AACd,QAAI,YAAY,SAAS,SAAS;AAChC,YAAM,QAAQ,YAAY,OAAO,iBAAiB,SAAS,OAAO;AAClE,kBAAY,MAAM,iBAAiB,UAAU,CAAC;AAAA,IAChD;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,OAAO,WAAW,4CAAC,iCAAW,MAAY,QAAQ,gBAAgB;AACxE,QAAM,SAAS,UAAU,WACvB,4CAAC,qBAAkB,QAAgB,MAAY,MAAM,CAAC,SACnD,kBACH;AAGF,QAAM,oBAAoB,CAAC,UACzB,aAAAA,QAAM,aAAa,aAAAA,QAAM,SAAS,KAAK,KAAK,GAAG;AAAA,IAC7C,KAAK;AAAA,IACL,UAAU,aAAAA,QAAM,SAAS,QAAQ,MAAM,MAAM,QAAQ,EAAE,OAAO,CAAC,QAAQ,IAAI,CAAC;AAAA,IAC5E,OAAO;AAAA,MACL,OAAG,sBAAI,OAAO,eAAe,CAAC,CAAC;AAAA,MAC/B,UAAU,aAAa,WAAW,aAAa;AAAA,IACjD;AAAA,EACF,CAAC;AAEH,MAAI,aAAAA,QAAM,SAAS,MAAM,QAAQ,MAAM,GAAG;AACxC,WACE,4EACG;AAAA;AAAA,MACA;AAAA,OACH;AAAA,EAEJ;AACA,SAAO,kBAAkB,QAAQ;AACnC;AAEA,YAAY,YAAY;AAAA;AAAA;AAAA;AAAA,EAItB,gBAAgB,kBAAAC,QAAU;AAAA;AAAA;AAAA;AAAA,EAI1B,UAAU,kBAAAA,QAAU;AAAA;AAAA;AAAA;AAAA,EAIpB,QAAQ,kBAAAA,QAAU,QAAQ,kBAAAA,QAAU,OAAO;AAAA;AAAA;AAAA;AAAA,EAI3C,SAAS,kBAAAA,QAAU;AAAA;AAAA;AAAA;AAAA,EAInB,MAAM,kBAAAA,QAAU,MAAM,CAAC,QAAQ,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA,EAIvC,QAAQ,kBAAAA,QAAU;AACpB;AAEA,MAAM,0BAAsB,4BAAU,WAAW;",
|
|
6
6
|
"names": ["React", "PropTypes"]
|
|
7
7
|
}
|
|
@@ -35,7 +35,7 @@ module.exports = __toCommonJS(MobileContextMenu_exports);
|
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_react = __toESM(require("react"));
|
|
38
|
-
var
|
|
38
|
+
var import_lodash_es = require("lodash-es");
|
|
39
39
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
40
40
|
var import_ds_system = require("@elliemae/ds-system");
|
|
41
41
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
@@ -86,15 +86,15 @@ const DSMobileContextMenu = (0, import_ds_system.withTheme)(
|
|
|
86
86
|
title = "",
|
|
87
87
|
multiple = false,
|
|
88
88
|
singleSelect = false,
|
|
89
|
-
onChange =
|
|
90
|
-
onClickOutside =
|
|
89
|
+
onChange = import_lodash_es.noop,
|
|
90
|
+
onClickOutside = import_lodash_es.noop,
|
|
91
91
|
children,
|
|
92
92
|
theme,
|
|
93
93
|
backdropZIndex = 1e3,
|
|
94
94
|
zIndex = 1001,
|
|
95
95
|
dataTestid = "mobile-context-menu",
|
|
96
96
|
buttonFooter: ButtonFooter = null,
|
|
97
|
-
onApply =
|
|
97
|
+
onApply = import_lodash_es.noop,
|
|
98
98
|
selecteds: initSelecteds,
|
|
99
99
|
onKeyDown
|
|
100
100
|
}) => {
|
|
@@ -152,7 +152,7 @@ const DSMobileContextMenu = (0, import_ds_system.withTheme)(
|
|
|
152
152
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(HeaderContainer, { justifyContent: "center", alignItems: "center", pl: "xs", pr: "xs", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledTitle, { alignItems: "center", gutter: "xxs", cols: Array(isArr(title) ? title.length : 1).fill("auto"), children: title }) }),
|
|
153
153
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { style: { overflow: "hidden" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { style: { overflow: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_shared.Group, { activeValue: trueSelected, multiple, onChange: handleChange, children: import_react.default.Children.map(children, (child, ii) => {
|
|
154
154
|
const isGroup = child.type === (/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_MobileContextMenuGroup.DSMobileContextMenuGroup, {})).type || child.type?.name === import_MobileContextMenuGroup.DSMobileContextMenuGroup.componentType || child.type === import_MobileContextMenuGroup.DSMobileContextMenuGroup.type;
|
|
155
|
-
const { onClick =
|
|
155
|
+
const { onClick = import_lodash_es.noop } = child.props;
|
|
156
156
|
const value = ii;
|
|
157
157
|
let isSelected;
|
|
158
158
|
if (singleSelect) isSelected = trueSelected === value;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenu.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-argument, max-params */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* eslint-disable max-lines, complexity, @typescript-eslint/no-unsafe-call */\n/* eslint-disable no-unused-vars, @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-assignment */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\n\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { styled, truncate, withTheme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSBackdrop } from '@elliemae/ds-backdrop';\nimport { Group } from '@elliemae/ds-shared';\nimport { DSMobileContextMenuGroup as ContextMenuGroup } from './MobileContextMenuGroup.js';\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:\n 0 0px 24px 0 rgba(0, 0, 0, 0.5),\n 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: ButtonFooter = null,\n onApply = noop,\n selecteds: initSelecteds,\n onKeyDown,\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 // this function is a mess, it is using \"this\" and invoking the onClick binded,\n // it was somehow working based on handleApply.bind(ButtonFooter.props)\n // which is arguably black magic\n // Converted to arrow function and converted \"this\" to ButtonFooter?.props\n const handleApply = (e) => {\n if (ButtonFooter?.props?.onClick) ButtonFooter?.props?.onClick?.(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n\n const footerProps = {\n containerProps: {\n 'data-testid': `${dataTestid}--btn`,\n },\n buttonType: 'primary',\n size: 'l',\n // keeping the binding for legacy code just in case, I have no idea what the intent was here,\n // composition based render-function will have no need for the binding, so only doing the binding for the React.cloneElement scenario\n onClick: (ButtonFooter?.props ?? false) === false ? handleApply : handleApply.bind(ButtonFooter.props),\n };\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\n zIndex={zIndex}\n rows={rows}\n innerRef={containerRef}\n data-testid=\"ds-mobile-context-menu\"\n onKeyDown={onKeyDown}\n >\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 // eslint-disable-next-line react/no-array-index-key\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.isValidElement(ButtonFooter) ? (\n React.cloneElement(ButtonFooter, footerProps)\n ) : (\n <ButtonFooter {...footerProps} />\n )}\n </Grid>\n ) : null}\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 onKeyDown: PropTypes.func.description('onKeyDown'),\n};\n\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;ADuHjB;AA7GN,mBAAiD;AACjD,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-unsafe-argument, max-params */\n/* eslint-disable @typescript-eslint/ban-ts-comment, @typescript-eslint/no-unused-vars, @typescript-eslint/no-explicit-any */\n/* eslint-disable max-lines, complexity, @typescript-eslint/no-unsafe-call */\n/* eslint-disable no-unused-vars, @typescript-eslint/no-unsafe-member-access */\n/* eslint-disable @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-assignment */\n/* tslint:disable */\n// @ts-nocheck\n// What's with all the above disables?\n// this is what a legacy 7 year old codebase looks like.\n\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash-es';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { styled, truncate, withTheme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSBackdrop } from '@elliemae/ds-backdrop';\nimport { Group } from '@elliemae/ds-shared';\nimport { DSMobileContextMenuGroup as ContextMenuGroup } from './MobileContextMenuGroup.js';\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:\n 0 0px 24px 0 rgba(0, 0, 0, 0.5),\n 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: ButtonFooter = null,\n onApply = noop,\n selecteds: initSelecteds,\n onKeyDown,\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 // this function is a mess, it is using \"this\" and invoking the onClick binded,\n // it was somehow working based on handleApply.bind(ButtonFooter.props)\n // which is arguably black magic\n // Converted to arrow function and converted \"this\" to ButtonFooter?.props\n const handleApply = (e) => {\n if (ButtonFooter?.props?.onClick) ButtonFooter?.props?.onClick?.(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n\n const footerProps = {\n containerProps: {\n 'data-testid': `${dataTestid}--btn`,\n },\n buttonType: 'primary',\n size: 'l',\n // keeping the binding for legacy code just in case, I have no idea what the intent was here,\n // composition based render-function will have no need for the binding, so only doing the binding for the React.cloneElement scenario\n onClick: (ButtonFooter?.props ?? false) === false ? handleApply : handleApply.bind(ButtonFooter.props),\n };\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\n zIndex={zIndex}\n rows={rows}\n innerRef={containerRef}\n data-testid=\"ds-mobile-context-menu\"\n onKeyDown={onKeyDown}\n >\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 // eslint-disable-next-line react/no-array-index-key\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.isValidElement(ButtonFooter) ? (\n React.cloneElement(ButtonFooter, footerProps)\n ) : (\n <ButtonFooter {...footerProps} />\n )}\n </Grid>\n ) : null}\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 onKeyDown: PropTypes.func.description('onKeyDown'),\n};\n\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": "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",
|
|
6
6
|
"names": ["props", "React", "ContextMenuGroup"]
|
|
7
7
|
}
|
|
@@ -37,7 +37,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
37
37
|
var import_react = __toESM(require("react"));
|
|
38
38
|
var import_ds_system = require("@elliemae/ds-system");
|
|
39
39
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
40
|
-
var
|
|
40
|
+
var import_lodash_es = require("lodash-es");
|
|
41
41
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
42
42
|
const Title = import_ds_system.styled.div`
|
|
43
43
|
height: 24px;
|
|
@@ -52,7 +52,7 @@ const Title = import_ds_system.styled.div`
|
|
|
52
52
|
const DSMobileContextMenuGroup = ({ title, isMulti, singleSelect, children, value: groupValue, selectedItems }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { children: [
|
|
53
53
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Title, { children: title }) }),
|
|
54
54
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: import_react.default.Children.map(children, (child, index) => {
|
|
55
|
-
const { onClick =
|
|
55
|
+
const { onClick = import_lodash_es.noop } = child.props;
|
|
56
56
|
const value = `${groupValue}:${index}`;
|
|
57
57
|
let isSelected;
|
|
58
58
|
if (singleSelect) isSelected = selectedItems === value;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenuGroup.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
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-props-helpers';\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.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,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { noop } from 'lodash-es';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\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.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,uBAAqB;AACrB,8BAAoC;AAEpC,MAAM,QAAQ,wBAAO;AAAA;AAAA;AAAA;AAAA,0BAIK,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA,gBACpD,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM,KAAK,CAAC;AAAA,eAC3C,CAACA,WAAUA,OAAM,MAAM,MAAM,EAAE;AAAA,WACnC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBACtC,CAACA,WAAUA,OAAM,MAAM,YAAY,QAAQ;AAAA;AAG5D,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,sBAAK,IAAI,MAAM;AACjC,UAAM,QAAQ,GAAG,UAAU,IAAI,KAAK;AACpC,QAAI;AACJ,QAAI,aAAc,cAAa,kBAAkB;AAAA,aACxC,QAAS,cAAa,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;AAAA;AAAA;AAAA,EAIZ,OAAO,kCAAU,OAAO,WAAW,YAAY,aAAa;AAAA;AAAA;AAAA;AAAA,EAI5D,UAAU,kCAAU,KAAK,WAAW,YAAY,gCAAgC;AAAA;AAAA,EAEhF,SAAS,kCAAU,KAAK,YAAY,cAAc;AAAA;AAAA,EAElD,cAAc,kCAAU,KAAK,YAAY,eAAe;AAAA;AAAA,EAExD,OAAO,kCAAU,OAAO,YAAY,kBAAkB;AAAA;AAAA,EAEtD,eAAe,kCAAU,UAAU,CAAC,kCAAU,OAAO,kCAAU,MAAM,CAAC,EAAE;AAAA,IACtE;AAAA,EACF;AACF;AAEA,yBAAyB,gBAAgB;AACzC,yBAAyB,cAAc;AACvC,MAAM,yCAAqC,kCAAS,wBAAwB;AAE5E,mCAAmC,YAAY;",
|
|
6
6
|
"names": ["props", "React"]
|
|
7
7
|
}
|
|
@@ -34,7 +34,7 @@ module.exports = __toCommonJS(MobileSelectList_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_react = __toESM(require("react"));
|
|
37
|
-
var
|
|
37
|
+
var import_lodash_es = require("lodash-es");
|
|
38
38
|
var import_prop_types = __toESM(require("prop-types"));
|
|
39
39
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
40
40
|
var import_ds_form = require("@elliemae/ds-form");
|
|
@@ -45,16 +45,16 @@ const MobileSelectList = ({
|
|
|
45
45
|
open = false,
|
|
46
46
|
header = null,
|
|
47
47
|
multiple = false,
|
|
48
|
-
onChange =
|
|
48
|
+
onChange = import_lodash_es.noop,
|
|
49
49
|
children,
|
|
50
50
|
theme,
|
|
51
51
|
zIndex = 1,
|
|
52
52
|
useSearch,
|
|
53
|
-
onSearch =
|
|
53
|
+
onSearch = import_lodash_es.noop,
|
|
54
54
|
dataTestid = "mobile-select-list",
|
|
55
55
|
buttonFooter = null,
|
|
56
56
|
ButtonFooter,
|
|
57
|
-
onApply =
|
|
57
|
+
onApply = import_lodash_es.noop,
|
|
58
58
|
selecteds: initSelecteds = []
|
|
59
59
|
}) => {
|
|
60
60
|
const rows = ["auto", 1];
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileSelectList/MobileSelectList.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint react/jsx-no-bind:0 react/no-this-in-sfc:0 */\nimport React, { useState, useEffect } from 'react';\nimport { noop } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSTextBox } from '@elliemae/ds-form';\nimport { op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { DSMobileTouchable } from '../MobileTouchable/index.js';\nimport { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from './styled.js';\n\nconst MobileSelectList = ({\n open = false,\n header = null,\n multiple = false,\n onChange = noop,\n children,\n theme,\n zIndex = 1,\n useSearch,\n onSearch = noop,\n dataTestid = 'mobile-select-list',\n buttonFooter = null,\n ButtonFooter,\n onApply = noop,\n selecteds: initSelecteds = [],\n}) => {\n const rows = ['auto', 1];\n const [selecteds, setSelected] = useState(initSelecteds);\n const [filter, setFilter] = useState('');\n useEffect(() => {\n setSelected(initSelecteds);\n }, [initSelecteds]);\n\n const handleSelection = (value) => {\n if (multiple) {\n const index = selecteds.findIndex((s) => s === value);\n if (index > -1) setSelected(selecteds.filter((s) => s !== value));\n else setSelected([...selecteds, value]);\n } else setSelected([value]);\n };\n const handleChange = function (event) {\n onChange(event, this);\n handleSelection(this.value);\n };\n const handleOnSearch = (e) => {\n setFilter(e.target.value);\n onSearch(e);\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selecteds);\n };\n if (buttonFooter || ButtonFooter) rows.push(op('*', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 1.16666));\n if (!open) return null;\n return (\n <StyledContainer data-testid={dataTestid} rows={rows} zIndex={zIndex}>\n <HeaderContainer>\n {header}\n {useSearch && (\n <Grid\n alignItems=\"center\"\n height={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)}\n pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n >\n <DSTextBox onChange={handleOnSearch} placeholder=\"Filter by name\" value={filter} />\n </Grid>\n )}\n </HeaderContainer>\n <Grid style={{ overflow: 'hidden' }}>\n <Grid style={{ overflow: 'auto' }}>\n <ListContainer data-testid={`${dataTestid}--list-container`}>\n {React.Children.map(children, (child) => {\n let leftAddon = null;\n let rightAddon = null;\n const { value, title } = child.props;\n const found = selecteds.findIndex((s) => String(s) === String(value));\n if (\n filter &&\n !String(value).toLocaleLowerCase().includes(filter.toLocaleLowerCase()) &&\n !String(title).toLocaleLowerCase().includes(filter.toLocaleLowerCase())\n )\n return null;\n if (multiple) {\n if (found > -1) leftAddon = checked;\n else leftAddon = checkbox;\n } else if (found > -1) {\n rightAddon = selectedMark;\n }\n return (\n <DSMobileTouchable onClick={handleChange.bind(child.props)}>\n {React.cloneElement(child, { leftAddon, rightAddon })}\n </DSMobileTouchable>\n );\n })}\n </ListContainer>\n </Grid>\n </Grid>\n {ButtonFooter || Boolean(buttonFooter) ? (\n <Footer\n alignItems=\"center\"\n // eslint-disable-next-line max-lines\n pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n >\n {!ButtonFooter ? (\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 ) : (\n <ButtonFooter\n containerProps={{\n 'data-testid': `${dataTestid}--btn`,\n }}\n buttonType=\"primary\"\n size=\"l\"\n onClick={handleApply}\n />\n )}\n </Footer>\n ) : null}\n </StyledContainer>\n );\n};\n\nconst DSMobileSelectList = withTheme(MobileSelectList);\n\nMobileSelectList.propTypes = {\n /** show select list */\n open: PropTypes.bool,\n /** DSMobilePageHeader instance */\n header: PropTypes.element,\n /** called when a DSMobileListItem is touched */\n onChange: PropTypes.func,\n /** allow multiple selection */\n multiple: PropTypes.bool,\n /** Array of DSMobileListItem instances */\n children: PropTypes.arrayOf(PropTypes.element),\n /** data test id for testing purposes */\n dataTestid: PropTypes.string,\n /** footer action, DSButton instance */\n buttonFooter: PropTypes.element,\n /** footer action, DSButton instance */\n ButtonFooter: PropTypes.func,\n /** called when footer action is triggered */\n onApply: PropTypes.func,\n /** zIndex */\n zIndex: PropTypes.number,\n /** init selecteds */\n selecteds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n theme: PropTypes.object.isRequired,\n useSearch: PropTypes.bool,\n onSearch: PropTypes.func,\n};\n\nexport { DSMobileSelectList };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyDjB;AAxDN,mBAA2C;AAC3C,
|
|
4
|
+
"sourcesContent": ["/* eslint react/jsx-no-bind:0 react/no-this-in-sfc:0 */\nimport React, { useState, useEffect } from 'react';\nimport { noop } from 'lodash-es';\nimport PropTypes from 'prop-types';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSTextBox } from '@elliemae/ds-form';\nimport { op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { DSMobileTouchable } from '../MobileTouchable/index.js';\nimport { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from './styled.js';\n\nconst MobileSelectList = ({\n open = false,\n header = null,\n multiple = false,\n onChange = noop,\n children,\n theme,\n zIndex = 1,\n useSearch,\n onSearch = noop,\n dataTestid = 'mobile-select-list',\n buttonFooter = null,\n ButtonFooter,\n onApply = noop,\n selecteds: initSelecteds = [],\n}) => {\n const rows = ['auto', 1];\n const [selecteds, setSelected] = useState(initSelecteds);\n const [filter, setFilter] = useState('');\n useEffect(() => {\n setSelected(initSelecteds);\n }, [initSelecteds]);\n\n const handleSelection = (value) => {\n if (multiple) {\n const index = selecteds.findIndex((s) => s === value);\n if (index > -1) setSelected(selecteds.filter((s) => s !== value));\n else setSelected([...selecteds, value]);\n } else setSelected([value]);\n };\n const handleChange = function (event) {\n onChange(event, this);\n handleSelection(this.value);\n };\n const handleOnSearch = (e) => {\n setFilter(e.target.value);\n onSearch(e);\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selecteds);\n };\n if (buttonFooter || ButtonFooter) rows.push(op('*', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 1.16666));\n if (!open) return null;\n return (\n <StyledContainer data-testid={dataTestid} rows={rows} zIndex={zIndex}>\n <HeaderContainer>\n {header}\n {useSearch && (\n <Grid\n alignItems=\"center\"\n height={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)}\n pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n >\n <DSTextBox onChange={handleOnSearch} placeholder=\"Filter by name\" value={filter} />\n </Grid>\n )}\n </HeaderContainer>\n <Grid style={{ overflow: 'hidden' }}>\n <Grid style={{ overflow: 'auto' }}>\n <ListContainer data-testid={`${dataTestid}--list-container`}>\n {React.Children.map(children, (child) => {\n let leftAddon = null;\n let rightAddon = null;\n const { value, title } = child.props;\n const found = selecteds.findIndex((s) => String(s) === String(value));\n if (\n filter &&\n !String(value).toLocaleLowerCase().includes(filter.toLocaleLowerCase()) &&\n !String(title).toLocaleLowerCase().includes(filter.toLocaleLowerCase())\n )\n return null;\n if (multiple) {\n if (found > -1) leftAddon = checked;\n else leftAddon = checkbox;\n } else if (found > -1) {\n rightAddon = selectedMark;\n }\n return (\n <DSMobileTouchable onClick={handleChange.bind(child.props)}>\n {React.cloneElement(child, { leftAddon, rightAddon })}\n </DSMobileTouchable>\n );\n })}\n </ListContainer>\n </Grid>\n </Grid>\n {ButtonFooter || Boolean(buttonFooter) ? (\n <Footer\n alignItems=\"center\"\n // eslint-disable-next-line max-lines\n pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n >\n {!ButtonFooter ? (\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 ) : (\n <ButtonFooter\n containerProps={{\n 'data-testid': `${dataTestid}--btn`,\n }}\n buttonType=\"primary\"\n size=\"l\"\n onClick={handleApply}\n />\n )}\n </Footer>\n ) : null}\n </StyledContainer>\n );\n};\n\nconst DSMobileSelectList = withTheme(MobileSelectList);\n\nMobileSelectList.propTypes = {\n /** show select list */\n open: PropTypes.bool,\n /** DSMobilePageHeader instance */\n header: PropTypes.element,\n /** called when a DSMobileListItem is touched */\n onChange: PropTypes.func,\n /** allow multiple selection */\n multiple: PropTypes.bool,\n /** Array of DSMobileListItem instances */\n children: PropTypes.arrayOf(PropTypes.element),\n /** data test id for testing purposes */\n dataTestid: PropTypes.string,\n /** footer action, DSButton instance */\n buttonFooter: PropTypes.element,\n /** footer action, DSButton instance */\n ButtonFooter: PropTypes.func,\n /** called when footer action is triggered */\n onApply: PropTypes.func,\n /** zIndex */\n zIndex: PropTypes.number,\n /** init selecteds */\n selecteds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n theme: PropTypes.object.isRequired,\n useSearch: PropTypes.bool,\n onSearch: PropTypes.func,\n};\n\nexport { DSMobileSelectList };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "PropTypes"]
|
|
7
7
|
}
|
|
@@ -39,7 +39,7 @@ __export(styled_exports, {
|
|
|
39
39
|
module.exports = __toCommonJS(styled_exports);
|
|
40
40
|
var React = __toESM(require("react"));
|
|
41
41
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
42
|
-
var
|
|
42
|
+
var import_lodash_es = require("lodash-es");
|
|
43
43
|
var import_ds_system = require("@elliemae/ds-system");
|
|
44
44
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
45
45
|
var import_ds_form = require("@elliemae/ds-form");
|
|
@@ -67,7 +67,7 @@ const ListContainer = import_ds_system.styled.div`
|
|
|
67
67
|
border: none;
|
|
68
68
|
}
|
|
69
69
|
`;
|
|
70
|
-
const checkbox = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, { checked: false, onChange:
|
|
71
|
-
const checked = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, { checked: true, onChange:
|
|
70
|
+
const checkbox = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, { checked: false, onChange: import_lodash_es.noop, style: { pointerEvents: "none" } });
|
|
71
|
+
const checked = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, { checked: true, onChange: import_lodash_es.noop, style: { pointerEvents: "none" } });
|
|
72
72
|
const selectedMark = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.Checkmark, { color: ["brand-primary", 600] });
|
|
73
73
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileSelectList/styled.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { noop } from 'lodash';\nimport { styled, border } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { DSMobileTouchable } from '../MobileTouchable/index.js';\nimport { DSMobileListItem } from '../MobileListItem/index.js';\n\nexport const StyledContainer = styled(Grid)`\n background: ${(props) => props.theme.colors.neutral['000']};\n z-index: ${(props) => props.zIndex};\n position: fixed;\n width: 100%;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n`;\n\nexport const HeaderContainer = styled(Grid)`\n border-bottom: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const Footer = styled(Grid)`\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const ListContainer = styled.div`\n & ${DSMobileTouchable}:last-child ${DSMobileListItem} {\n border: none;\n }\n`;\n\nexport const checkbox = <DSCheckbox checked={false} onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const checked = <DSCheckbox checked onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const selectedMark = <Checkmark color={['brand-primary', 600]} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkCC;AAjCxB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { noop } from 'lodash-es';\nimport { styled, border } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { DSMobileTouchable } from '../MobileTouchable/index.js';\nimport { DSMobileListItem } from '../MobileListItem/index.js';\n\nexport const StyledContainer = styled(Grid)`\n background: ${(props) => props.theme.colors.neutral['000']};\n z-index: ${(props) => props.zIndex};\n position: fixed;\n width: 100%;\n top: 0;\n left: 0;\n right: 0;\n height: 100%;\n`;\n\nexport const HeaderContainer = styled(Grid)`\n border-bottom: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const Footer = styled(Grid)`\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const ListContainer = styled.div`\n & ${DSMobileTouchable}:last-child ${DSMobileListItem} {\n border: none;\n }\n`;\n\nexport const checkbox = <DSCheckbox checked={false} onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const checked = <DSCheckbox checked onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const selectedMark = <Checkmark color={['brand-primary', 600]} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkCC;AAjCxB,uBAAqB;AACrB,uBAA+B;AAC/B,qBAAqB;AACrB,qBAA2B;AAC3B,sBAA0B;AAC1B,6BAAkC;AAClC,4BAAiC;AAE1B,MAAM,sBAAkB,yBAAO,mBAAI;AAAA,gBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,aAC/C,CAAC,UAAU,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS7B,MAAM,sBAAkB,yBAAO,mBAAI;AAAA,mBACvB,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC,CAAC;AAAA;AAGhE,MAAM,aAAS,yBAAO,mBAAI;AAAA,gBACjB,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC,CAAC;AAAA;AAG7D,MAAM,gBAAgB,wBAAO;AAAA,MAC9B,wCAAiB,eAAe,sCAAgB;AAAA;AAAA;AAAA;AAK/C,MAAM,WAAW,4CAAC,6BAAW,SAAS,OAAO,UAAU,uBAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AAC/F,MAAM,UAAU,4CAAC,6BAAW,SAAO,MAAC,UAAU,uBAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AACtF,MAAM,eAAe,4CAAC,6BAAU,OAAO,CAAC,iBAAiB,GAAG,GAAG;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,7 +34,7 @@ module.exports = __toCommonJS(MobileTouchable_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_react = require("react");
|
|
37
|
-
var
|
|
37
|
+
var import_lodash_es = require("lodash-es");
|
|
38
38
|
var import_prop_types = __toESM(require("prop-types"));
|
|
39
39
|
var import_ds_system = require("@elliemae/ds-system");
|
|
40
40
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
@@ -56,7 +56,7 @@ const StyledContainer = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
|
56
56
|
`;
|
|
57
57
|
const MobileTouchable = ({
|
|
58
58
|
children,
|
|
59
|
-
onClick =
|
|
59
|
+
onClick = import_lodash_es.noop,
|
|
60
60
|
theme,
|
|
61
61
|
dataTestid = "mobile-touchable",
|
|
62
62
|
render,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileTouchable/MobileTouchable.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { noop } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { styled, withTheme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst StyledContainer = styled(Grid)`\n cursor: pointer;\n background: ${(props) => (props.touching ? props.theme.colors.brand['100'] : props.theme.colors.neutral['000'])};\n &:focus {\n position: relative;\n &:after {\n position: absolute;\n content: '';\n border: 2px solid brand-700;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n }\n`;\n\nconst MobileTouchable = ({\n children,\n onClick = noop,\n theme,\n dataTestid = 'mobile-touchable',\n render,\n innerRef,\n ...gridProps\n}) => {\n const [touching, setTouching] = useState(false);\n const handleStart = useCallback(() => setTouching(true));\n const handleEnd = useCallback(() => setTouching(false));\n console.log('AAA', innerRef);\n return (\n <StyledContainer\n {...gridProps}\n touching={touching}\n onClick={onClick}\n onTouchStart={handleStart}\n onTouchEnd={handleEnd}\n data-testid={dataTestid}\n innerRef={innerRef}\n tabIndex={0}\n >\n {children || render(gridProps)}\n </StyledContainer>\n );\n};\n\nMobileTouchable.propTypes = {\n onClick: PropTypes.func,\n children: PropTypes.any,\n render: PropTypes.func,\n theme: PropTypes.any,\n dataTestid: PropTypes.string,\n innerRef: PropTypes.any,\n};\n\nconst DSMobileTouchable = withTheme(MobileTouchable);\n\nexport { DSMobileTouchable };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqCnB;AArCJ,mBAA6C;AAC7C,
|
|
4
|
+
"sourcesContent": ["import React, { useState, useCallback } from 'react';\nimport { noop } from 'lodash-es';\nimport PropTypes from 'prop-types';\nimport { styled, withTheme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst StyledContainer = styled(Grid)`\n cursor: pointer;\n background: ${(props) => (props.touching ? props.theme.colors.brand['100'] : props.theme.colors.neutral['000'])};\n &:focus {\n position: relative;\n &:after {\n position: absolute;\n content: '';\n border: 2px solid brand-700;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n }\n`;\n\nconst MobileTouchable = ({\n children,\n onClick = noop,\n theme,\n dataTestid = 'mobile-touchable',\n render,\n innerRef,\n ...gridProps\n}) => {\n const [touching, setTouching] = useState(false);\n const handleStart = useCallback(() => setTouching(true));\n const handleEnd = useCallback(() => setTouching(false));\n console.log('AAA', innerRef);\n return (\n <StyledContainer\n {...gridProps}\n touching={touching}\n onClick={onClick}\n onTouchStart={handleStart}\n onTouchEnd={handleEnd}\n data-testid={dataTestid}\n innerRef={innerRef}\n tabIndex={0}\n >\n {children || render(gridProps)}\n </StyledContainer>\n );\n};\n\nMobileTouchable.propTypes = {\n onClick: PropTypes.func,\n children: PropTypes.any,\n render: PropTypes.func,\n theme: PropTypes.any,\n dataTestid: PropTypes.string,\n innerRef: PropTypes.any,\n};\n\nconst DSMobileTouchable = withTheme(MobileTouchable);\n\nexport { DSMobileTouchable };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqCnB;AArCJ,mBAA6C;AAC7C,uBAAqB;AACrB,wBAAsB;AACtB,uBAAkC;AAClC,qBAAqB;AAErB,MAAM,sBAAkB,yBAAO,mBAAI;AAAA;AAAA,gBAEnB,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAejH,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,kBAAc,0BAAY,MAAM,YAAY,IAAI,CAAC;AACvD,QAAM,gBAAY,0BAAY,MAAM,YAAY,KAAK,CAAC;AACtD,UAAQ,IAAI,OAAO,QAAQ;AAC3B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,eAAa;AAAA,MACb;AAAA,MACA,UAAU;AAAA,MAET,sBAAY,OAAO,SAAS;AAAA;AAAA,EAC/B;AAEJ;AAEA,gBAAgB,YAAY;AAAA,EAC1B,SAAS,kBAAAA,QAAU;AAAA,EACnB,UAAU,kBAAAA,QAAU;AAAA,EACpB,QAAQ,kBAAAA,QAAU;AAAA,EAClB,OAAO,kBAAAA,QAAU;AAAA,EACjB,YAAY,kBAAAA,QAAU;AAAA,EACtB,UAAU,kBAAAA,QAAU;AACtB;AAEA,MAAM,wBAAoB,4BAAU,eAAe;",
|
|
6
6
|
"names": ["PropTypes"]
|
|
7
7
|
}
|
package/dist/cjs/Modal/Modal.js
CHANGED
|
@@ -35,7 +35,7 @@ module.exports = __toCommonJS(Modal_exports);
|
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
38
|
-
var
|
|
38
|
+
var import_lodash_es = require("lodash-es");
|
|
39
39
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
40
40
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
41
41
|
var import_ds_button = require("@elliemae/ds-button");
|
|
@@ -45,14 +45,14 @@ const Modal = ({
|
|
|
45
45
|
zIndex = 1,
|
|
46
46
|
title = "",
|
|
47
47
|
description = "",
|
|
48
|
-
onClose =
|
|
48
|
+
onClose = import_lodash_es.noop,
|
|
49
49
|
showSecondaryAction = true,
|
|
50
50
|
secondaryActionProps = {
|
|
51
|
-
onClick:
|
|
51
|
+
onClick: import_lodash_es.noop,
|
|
52
52
|
labelText: "Cancel"
|
|
53
53
|
},
|
|
54
54
|
primaryActionProps = {
|
|
55
|
-
onClick:
|
|
55
|
+
onClick: import_lodash_es.noop,
|
|
56
56
|
labelText: "Accept"
|
|
57
57
|
},
|
|
58
58
|
isOpen = false,
|