@elliemae/ds-mobile 3.4.0-rc.3 → 3.4.1
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/MobileContextMenu/MobileContextMenuItem.js +11 -4
- package/dist/cjs/MobileContextMenu/MobileContextMenuItem.js.map +2 -2
- package/dist/cjs/PageList/PageList.js +9 -5
- package/dist/cjs/PageList/PageList.js.map +2 -2
- package/dist/esm/MobileContextMenu/MobileContextMenuItem.js +11 -4
- package/dist/esm/MobileContextMenu/MobileContextMenuItem.js.map +2 -2
- package/dist/esm/PageList/PageList.js +9 -5
- package/dist/esm/PageList/PageList.js.map +2 -2
- package/package.json +16 -16
|
@@ -30,7 +30,6 @@ var import_react = __toESM(require("react"));
|
|
|
30
30
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
31
31
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
32
32
|
var import_ds_system = require("@elliemae/ds-system");
|
|
33
|
-
var import_ds_system2 = require("@elliemae/ds-system");
|
|
34
33
|
var import_ds_shared = require("@elliemae/ds-shared");
|
|
35
34
|
var import_ds_form = require("@elliemae/ds-form");
|
|
36
35
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
@@ -63,7 +62,7 @@ const PropWrap = (0, import_ds_system.styled)((props2) => /* @__PURE__ */ import
|
|
|
63
62
|
const Title = import_ds_system.styled.span`
|
|
64
63
|
font-size: 16px;
|
|
65
64
|
color: ${(props2) => props2.theme.colors.brand["600"]};
|
|
66
|
-
${(0,
|
|
65
|
+
${(0, import_ds_system.truncate)()}
|
|
67
66
|
`;
|
|
68
67
|
const Label = import_ds_system.styled.span`
|
|
69
68
|
font-size: 13px;
|
|
@@ -76,6 +75,7 @@ const DSMobileContextMenuItem = ({
|
|
|
76
75
|
label,
|
|
77
76
|
title,
|
|
78
77
|
leftProp,
|
|
78
|
+
rightAddon,
|
|
79
79
|
isGroup,
|
|
80
80
|
isMulti,
|
|
81
81
|
singleSelect,
|
|
@@ -102,6 +102,9 @@ const DSMobileContextMenuItem = ({
|
|
|
102
102
|
leftAddon = /* @__PURE__ */ import_react.default.createElement(CheckMark, {
|
|
103
103
|
"data-testid": "leftAddon-checkmark"
|
|
104
104
|
});
|
|
105
|
+
const cols = singleSelect && someItemSelected || leftAddon && !singleSelect || isMulti ? ["40px", "auto"] : ["auto"];
|
|
106
|
+
if (rightAddon)
|
|
107
|
+
cols.push("40px");
|
|
105
108
|
return /* @__PURE__ */ import_react.default.createElement(Wrap, {
|
|
106
109
|
"data-testid": "ds-contextmenu-item",
|
|
107
110
|
onClick: (e) => {
|
|
@@ -109,7 +112,7 @@ const DSMobileContextMenuItem = ({
|
|
|
109
112
|
context.onChange(value, e, { value, label, title });
|
|
110
113
|
onClick(e);
|
|
111
114
|
},
|
|
112
|
-
cols
|
|
115
|
+
cols
|
|
113
116
|
}, (singleSelect && someItemSelected || isMulti || leftAddon) && /* @__PURE__ */ import_react.default.createElement(PropWrap, {
|
|
114
117
|
"data-testid": "left-addon",
|
|
115
118
|
isMulti,
|
|
@@ -128,7 +131,11 @@ const DSMobileContextMenuItem = ({
|
|
|
128
131
|
alignItems: !label ? "center" : void 0
|
|
129
132
|
}, /* @__PURE__ */ import_react.default.createElement(Title, {
|
|
130
133
|
"data-testid": "contextMenuItem-title"
|
|
131
|
-
}, title)))
|
|
134
|
+
}, title))), rightAddon ? /* @__PURE__ */ import_react.default.createElement(PropWrap, {
|
|
135
|
+
"data-testid": "right-addon",
|
|
136
|
+
alignItems: "center",
|
|
137
|
+
justifyContent: "center"
|
|
138
|
+
}, rightAddon) : null);
|
|
132
139
|
}
|
|
133
140
|
});
|
|
134
141
|
const props = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileContextMenu/MobileContextMenuItem.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,mBAAkB;AAClB,0BAAoC;AACpC,qBAAqB;AACrB,
|
|
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": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -30,20 +30,24 @@ var import_react = __toESM(require("react"));
|
|
|
30
30
|
var import_prop_types = __toESM(require("prop-types"));
|
|
31
31
|
var import_ds_system = require("@elliemae/ds-system");
|
|
32
32
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
33
|
-
var import_ds_system2 = require("@elliemae/ds-system");
|
|
34
33
|
var import_FullPageContainer = require("../FullPageContainer");
|
|
35
34
|
const PageTitleWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
36
35
|
min-height: 44px;
|
|
37
36
|
`;
|
|
38
|
-
const DSMobilePageList = (0,
|
|
39
|
-
const rows = [
|
|
37
|
+
const DSMobilePageList = (0, import_ds_system.withTheme)(({ header = null, pageTitle = null, filterBar = null, body = null, footer = null, theme }) => {
|
|
38
|
+
const rows = [];
|
|
40
39
|
if (header)
|
|
41
|
-
rows.
|
|
40
|
+
rows.push((0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xxl));
|
|
41
|
+
if (pageTitle)
|
|
42
|
+
rows.push("auto");
|
|
43
|
+
if (filterBar)
|
|
44
|
+
rows.push((0, import_ds_system.op)("*", (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.xl), 0.83));
|
|
45
|
+
rows.push(1);
|
|
42
46
|
if (footer)
|
|
43
47
|
rows.push("56px");
|
|
44
48
|
return /* @__PURE__ */ import_react.default.createElement(import_FullPageContainer.DSFullPageContainer, {
|
|
45
49
|
rows
|
|
46
|
-
}, header
|
|
50
|
+
}, header ? /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, header) : null, pageTitle ? /* @__PURE__ */ import_react.default.createElement(PageTitleWrapper, null, pageTitle) : null, filterBar ? /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, filterBar) : null, /* @__PURE__ */ import_react.default.createElement(import_FullPageContainer.DSFullPageContainerScroll, null, body), footer && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, null, footer));
|
|
47
51
|
});
|
|
48
52
|
DSMobilePageList.propTypes = {
|
|
49
53
|
header: import_prop_types.default.element,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/PageList/PageList.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSFullPageContainer, DSFullPageContainerScroll } from '../FullPageContainer';\n\nconst PageTitleWrapper = styled(Grid)`\n min-height: 44px;\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst DSMobilePageList = withTheme(\n ({ header = null, pageTitle = null, filterBar = null, body = null, footer = null, theme }) => {\n const rows = [];\n if (header) rows.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl));\n if (pageTitle) rows.push('auto');\n if (filterBar) rows.push(op('*', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 0.83));\n rows.push(1);\n if (footer) rows.push('56px');\n return (\n <DSFullPageContainer rows={rows}>\n {header ? <Grid>{header}</Grid> : null}\n {pageTitle ? <PageTitleWrapper>{pageTitle}</PageTitleWrapper> : null}\n {filterBar ? <Grid>{filterBar}</Grid> : null}\n <DSFullPageContainerScroll>{body}</DSFullPageContainerScroll>\n {footer && <Grid>{footer}</Grid>}\n </DSFullPageContainer>\n );\n },\n);\n\nDSMobilePageList.propTypes = {\n header: PropTypes.element,\n pageTitle: PropTypes.element,\n filterBar: PropTypes.element,\n body: PropTypes.element,\n footer: PropTypes.element,\n};\n\nconst DSPageList = DSMobilePageList;\n\nexport { DSPageList, DSMobilePageList };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,uBAAgE;AAChE,qBAAqB;AACrB,+BAA+D;AAE/D,MAAM,mBAAmB,6BAAO,mBAAI;AAAA;AAAA;AAKpC,MAAM,mBAAmB,gCACvB,CAAC,EAAE,SAAS,MAAM,YAAY,MAAM,YAAY,MAAM,OAAO,MAAM,SAAS,MAAM,YAAY;AAC5F,QAAM,OAAO,CAAC;AACd,MAAI;AAAQ,SAAK,KAAK,+CAAyB,MAAM,MAAM,GAAG,CAAC;AAC/D,MAAI;AAAW,SAAK,KAAK,MAAM;AAC/B,MAAI;AAAW,SAAK,KAAK,yBAAG,KAAK,+CAAyB,MAAM,MAAM,EAAE,GAAG,IAAI,CAAC;AAChF,OAAK,KAAK,CAAC;AACX,MAAI;AAAQ,SAAK,KAAK,MAAM;AAC5B,SACE,mDAAC;AAAA,IAAoB;AAAA,KAClB,SAAS,mDAAC,2BAAM,MAAO,IAAU,MACjC,YAAY,mDAAC,wBAAkB,SAAU,IAAsB,MAC/D,YAAY,mDAAC,2BAAM,SAAU,IAAU,MACxC,mDAAC,0DAA2B,IAAK,GAChC,UAAU,mDAAC,2BAAM,MAAO,CAC3B;AAEJ,CACF;AAEA,iBAAiB,YAAY;AAAA,EAC3B,QAAQ,0BAAU;AAAA,EAClB,WAAW,0BAAU;AAAA,EACrB,WAAW,0BAAU;AAAA,EACrB,MAAM,0BAAU;AAAA,EAChB,QAAQ,0BAAU;AACpB;AAEA,MAAM,aAAa;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,8 +2,7 @@ import * as React from "react";
|
|
|
2
2
|
import React2 from "react";
|
|
3
3
|
import { PropTypes, describe } from "@elliemae/ds-utilities";
|
|
4
4
|
import { Grid } from "@elliemae/ds-grid";
|
|
5
|
-
import { styled } from "@elliemae/ds-system";
|
|
6
|
-
import { truncate } from "@elliemae/ds-system";
|
|
5
|
+
import { styled, truncate } from "@elliemae/ds-system";
|
|
7
6
|
import { GroupItem } from "@elliemae/ds-shared";
|
|
8
7
|
import { DSCheckbox } from "@elliemae/ds-form";
|
|
9
8
|
import { Checkmark } from "@elliemae/ds-icons";
|
|
@@ -49,6 +48,7 @@ const DSMobileContextMenuItem = ({
|
|
|
49
48
|
label,
|
|
50
49
|
title,
|
|
51
50
|
leftProp,
|
|
51
|
+
rightAddon,
|
|
52
52
|
isGroup,
|
|
53
53
|
isMulti,
|
|
54
54
|
singleSelect,
|
|
@@ -75,6 +75,9 @@ const DSMobileContextMenuItem = ({
|
|
|
75
75
|
leftAddon = /* @__PURE__ */ React2.createElement(CheckMark, {
|
|
76
76
|
"data-testid": "leftAddon-checkmark"
|
|
77
77
|
});
|
|
78
|
+
const cols = singleSelect && someItemSelected || leftAddon && !singleSelect || isMulti ? ["40px", "auto"] : ["auto"];
|
|
79
|
+
if (rightAddon)
|
|
80
|
+
cols.push("40px");
|
|
78
81
|
return /* @__PURE__ */ React2.createElement(Wrap, {
|
|
79
82
|
"data-testid": "ds-contextmenu-item",
|
|
80
83
|
onClick: (e) => {
|
|
@@ -82,7 +85,7 @@ const DSMobileContextMenuItem = ({
|
|
|
82
85
|
context.onChange(value, e, { value, label, title });
|
|
83
86
|
onClick(e);
|
|
84
87
|
},
|
|
85
|
-
cols
|
|
88
|
+
cols
|
|
86
89
|
}, (singleSelect && someItemSelected || isMulti || leftAddon) && /* @__PURE__ */ React2.createElement(PropWrap, {
|
|
87
90
|
"data-testid": "left-addon",
|
|
88
91
|
isMulti,
|
|
@@ -101,7 +104,11 @@ const DSMobileContextMenuItem = ({
|
|
|
101
104
|
alignItems: !label ? "center" : void 0
|
|
102
105
|
}, /* @__PURE__ */ React2.createElement(Title, {
|
|
103
106
|
"data-testid": "contextMenuItem-title"
|
|
104
|
-
}, title)))
|
|
107
|
+
}, title))), rightAddon ? /* @__PURE__ */ React2.createElement(PropWrap, {
|
|
108
|
+
"data-testid": "right-addon",
|
|
109
|
+
alignItems: "center",
|
|
110
|
+
justifyContent: "center"
|
|
111
|
+
}, rightAddon) : null);
|
|
105
112
|
}
|
|
106
113
|
});
|
|
107
114
|
const props = {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileContextMenu/MobileContextMenuItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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
|
|
5
|
-
"mappings": "AAAA;ACGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,22 +1,26 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import React2 from "react";
|
|
3
3
|
import PropTypes from "prop-types";
|
|
4
|
-
import { styled } from "@elliemae/ds-system";
|
|
4
|
+
import { styled, op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
|
|
5
5
|
import { Grid } from "@elliemae/ds-grid";
|
|
6
|
-
import { op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
|
|
7
6
|
import { DSFullPageContainer, DSFullPageContainerScroll } from "../FullPageContainer";
|
|
8
7
|
const PageTitleWrapper = styled(Grid)`
|
|
9
8
|
min-height: 44px;
|
|
10
9
|
`;
|
|
11
10
|
const DSMobilePageList = withTheme(({ header = null, pageTitle = null, filterBar = null, body = null, footer = null, theme }) => {
|
|
12
|
-
const rows = [
|
|
11
|
+
const rows = [];
|
|
13
12
|
if (header)
|
|
14
|
-
rows.
|
|
13
|
+
rows.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl));
|
|
14
|
+
if (pageTitle)
|
|
15
|
+
rows.push("auto");
|
|
16
|
+
if (filterBar)
|
|
17
|
+
rows.push(op("*", __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 0.83));
|
|
18
|
+
rows.push(1);
|
|
15
19
|
if (footer)
|
|
16
20
|
rows.push("56px");
|
|
17
21
|
return /* @__PURE__ */ React2.createElement(DSFullPageContainer, {
|
|
18
22
|
rows
|
|
19
|
-
}, header
|
|
23
|
+
}, header ? /* @__PURE__ */ React2.createElement(Grid, null, header) : null, pageTitle ? /* @__PURE__ */ React2.createElement(PageTitleWrapper, null, pageTitle) : null, filterBar ? /* @__PURE__ */ React2.createElement(Grid, null, filterBar) : null, /* @__PURE__ */ React2.createElement(DSFullPageContainerScroll, null, body), footer && /* @__PURE__ */ React2.createElement(Grid, null, footer));
|
|
20
24
|
});
|
|
21
25
|
DSMobilePageList.propTypes = {
|
|
22
26
|
header: PropTypes.element,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/PageList/PageList.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport {
|
|
5
|
-
"mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSFullPageContainer, DSFullPageContainerScroll } from '../FullPageContainer';\n\nconst PageTitleWrapper = styled(Grid)`\n min-height: 44px;\n`;\n\n// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\nconst DSMobilePageList = withTheme(\n ({ header = null, pageTitle = null, filterBar = null, body = null, footer = null, theme }) => {\n const rows = [];\n if (header) rows.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl));\n if (pageTitle) rows.push('auto');\n if (filterBar) rows.push(op('*', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 0.83));\n rows.push(1);\n if (footer) rows.push('56px');\n return (\n <DSFullPageContainer rows={rows}>\n {header ? <Grid>{header}</Grid> : null}\n {pageTitle ? <PageTitleWrapper>{pageTitle}</PageTitleWrapper> : null}\n {filterBar ? <Grid>{filterBar}</Grid> : null}\n <DSFullPageContainerScroll>{body}</DSFullPageContainerScroll>\n {footer && <Grid>{footer}</Grid>}\n </DSFullPageContainer>\n );\n },\n);\n\nDSMobilePageList.propTypes = {\n header: PropTypes.element,\n pageTitle: PropTypes.element,\n filterBar: PropTypes.element,\n body: PropTypes.element,\n footer: PropTypes.element,\n};\n\nconst DSPageList = DSMobilePageList;\n\nexport { DSPageList, DSMobilePageList };\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,mBAAmB,OAAO,IAAI;AAAA;AAAA;AAKpC,MAAM,mBAAmB,UACvB,CAAC,EAAE,SAAS,MAAM,YAAY,MAAM,YAAY,MAAM,OAAO,MAAM,SAAS,MAAM,YAAY;AAC5F,QAAM,OAAO,CAAC;AACd,MAAI;AAAQ,SAAK,KAAK,yBAAyB,MAAM,MAAM,GAAG,CAAC;AAC/D,MAAI;AAAW,SAAK,KAAK,MAAM;AAC/B,MAAI;AAAW,SAAK,KAAK,GAAG,KAAK,yBAAyB,MAAM,MAAM,EAAE,GAAG,IAAI,CAAC;AAChF,OAAK,KAAK,CAAC;AACX,MAAI;AAAQ,SAAK,KAAK,MAAM;AAC5B,SACE,qCAAC;AAAA,IAAoB;AAAA,KAClB,SAAS,qCAAC,YAAM,MAAO,IAAU,MACjC,YAAY,qCAAC,wBAAkB,SAAU,IAAsB,MAC/D,YAAY,qCAAC,YAAM,SAAU,IAAU,MACxC,qCAAC,iCAA2B,IAAK,GAChC,UAAU,qCAAC,YAAM,MAAO,CAC3B;AAEJ,CACF;AAEA,iBAAiB,YAAY;AAAA,EAC3B,QAAQ,UAAU;AAAA,EAClB,WAAW,UAAU;AAAA,EACrB,WAAW,UAAU;AAAA,EACrB,MAAM,UAAU;AAAA,EAChB,QAAQ,UAAU;AACpB;AAEA,MAAM,aAAa;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-mobile",
|
|
3
|
-
"version": "3.4.
|
|
3
|
+
"version": "3.4.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - System",
|
|
6
6
|
"files": [
|
|
@@ -435,21 +435,21 @@
|
|
|
435
435
|
"typeSafety": false
|
|
436
436
|
},
|
|
437
437
|
"dependencies": {
|
|
438
|
-
"@elliemae/ds-accordion": "3.4.
|
|
439
|
-
"@elliemae/ds-backdrop": "3.4.
|
|
440
|
-
"@elliemae/ds-button": "3.4.
|
|
441
|
-
"@elliemae/ds-circular-progress-indicator": "3.4.
|
|
442
|
-
"@elliemae/ds-form": "3.4.
|
|
443
|
-
"@elliemae/ds-form-checkbox": "3.4.
|
|
444
|
-
"@elliemae/ds-grid": "3.4.
|
|
445
|
-
"@elliemae/ds-icon": "3.4.
|
|
446
|
-
"@elliemae/ds-icons": "3.4.
|
|
447
|
-
"@elliemae/ds-indeterminate-progress-indicator": "3.4.
|
|
448
|
-
"@elliemae/ds-shared": "3.4.
|
|
449
|
-
"@elliemae/ds-system": "3.4.
|
|
450
|
-
"@elliemae/ds-tabs": "3.4.
|
|
451
|
-
"@elliemae/ds-truncated-expandable-text": "3.4.
|
|
452
|
-
"@elliemae/ds-utilities": "3.4.
|
|
438
|
+
"@elliemae/ds-accordion": "3.4.1",
|
|
439
|
+
"@elliemae/ds-backdrop": "3.4.1",
|
|
440
|
+
"@elliemae/ds-button": "3.4.1",
|
|
441
|
+
"@elliemae/ds-circular-progress-indicator": "3.4.1",
|
|
442
|
+
"@elliemae/ds-form": "3.4.1",
|
|
443
|
+
"@elliemae/ds-form-checkbox": "3.4.1",
|
|
444
|
+
"@elliemae/ds-grid": "3.4.1",
|
|
445
|
+
"@elliemae/ds-icon": "3.4.1",
|
|
446
|
+
"@elliemae/ds-icons": "3.4.1",
|
|
447
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.4.1",
|
|
448
|
+
"@elliemae/ds-shared": "3.4.1",
|
|
449
|
+
"@elliemae/ds-system": "3.4.1",
|
|
450
|
+
"@elliemae/ds-tabs": "3.4.1",
|
|
451
|
+
"@elliemae/ds-truncated-expandable-text": "3.4.1",
|
|
452
|
+
"@elliemae/ds-utilities": "3.4.1",
|
|
453
453
|
"polished": "~3.6.7",
|
|
454
454
|
"prop-types": "~15.8.1",
|
|
455
455
|
"react-window": "~1.8.7",
|