@elliemae/ds-mobile 3.14.0-next.1 → 3.14.0-next.10
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.
|
@@ -88,6 +88,12 @@ const LeftIcon = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
|
88
88
|
width: ${(props) => props.halfM};
|
|
89
89
|
}
|
|
90
90
|
`;
|
|
91
|
+
const RightIcon = (0, import_ds_system.styled)(import_ds_grid.Grid)`
|
|
92
|
+
span > svg,
|
|
93
|
+
span > svg:not([fill]) {
|
|
94
|
+
fill: #000000;
|
|
95
|
+
}
|
|
96
|
+
`;
|
|
91
97
|
const CenterWrap = import_ds_system.styled.div`
|
|
92
98
|
display: flex;
|
|
93
99
|
align-items: center;
|
|
@@ -163,7 +169,7 @@ const MobileCard = ({
|
|
|
163
169
|
}
|
|
164
170
|
)
|
|
165
171
|
] }),
|
|
166
|
-
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
172
|
+
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RightIcon, { ml: (0, import_ds_system.__UNSAFE_SPACE_TO_DIMSUM)(theme.space.s), children: prop }, i))
|
|
167
173
|
] }),
|
|
168
174
|
subIcons && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SubTextWrap, { ref: subTextRef, children: [
|
|
169
175
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubText, { children: subIcons }),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileCard/Card.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n styled,\n space,\n color,\n border,\n op,\n truncate,\n withTheme,\n __UNSAFE_SPACE_TO_DIMSUM,\n toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n ${truncate()}\n`;\n\nconst Title = styled.div`\n ${space}\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n width: 100%;\n ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n ${space}\n ${truncate()}\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n ${truncate()}\n &:nth-child(2) {\n padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n }\n`;\nconst SubTextWrap = styled.div`\n ${truncate()}\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n margin-top: 6px;\n margin-bottom: 2px;\n padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n ${color('neutral', 500)}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n display: flex;\n justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n & > span {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n`;\nconst CenterWrap = styled.div`\n display: flex;\n align-items: center;\n ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n children,\n height = 'm',\n leftAddOn,\n leftProp,\n rightProp,\n subText,\n subIcons,\n details,\n theme,\n expandable = false,\n expandedContent,\n value,\n cardContent,\n}) => {\n const subTextRef = useRef(null);\n const subTextHeight = useHeight(subTextRef);\n const isJustChildren = !(subText || subIcons || details);\n const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n return (\n <GroupItem\n render={(context = {}) => {\n const { activeValue, onChange } = context;\n const selected =\n activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n return (\n <Card\n data-testid=\"card-wrapper\"\n minHeight={\n height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n }\n >\n {expandable && (\n <ExpandChevron\n isExpanded={selected}\n onClick={(e) => {\n e.stopPropagation();\n onChange({ target: { value } });\n }}\n align={subText || subIcons ? 'top' : 'center'}\n />\n )}\n <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n {leftAddOn && (\n <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n {leftAddOn}\n </LeftIcon>\n )}\n </Grid>\n <Grid\n pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n width=\"100%\"\n >\n <CenterWrap>\n <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n <TitleEllipsis>{children}</TitleEllipsis>\n {details && (\n <Grid\n data-testid=\"card-details\"\n cols={details.map(() => 'min-content')}\n mb={(!(subText || subIcons) && halfM) || 0}\n pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n >\n {details.map((d, i) => (\n <Detail key={i}>\n {d}\n {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n </Detail>\n ))}\n </Grid>\n )}\n </Title>\n {rightProp &&\n rightProp.map((prop, i) => (\n <
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n styled,\n space,\n color,\n border,\n op,\n truncate,\n withTheme,\n __UNSAFE_SPACE_TO_DIMSUM,\n toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n ${truncate()}\n`;\n\nconst Title = styled.div`\n ${space}\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n width: 100%;\n ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n ${space}\n ${truncate()}\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n ${truncate()}\n &:nth-child(2) {\n padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n }\n`;\nconst SubTextWrap = styled.div`\n ${truncate()}\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n margin-top: 6px;\n margin-bottom: 2px;\n padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n ${color('neutral', 500)}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n display: flex;\n justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n & > span {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n`;\n\nconst RightIcon = styled(Grid)<{ halfM: string }>`\n span > svg,\n span > svg:not([fill]) {\n fill: #000000;\n }\n`;\nconst CenterWrap = styled.div`\n display: flex;\n align-items: center;\n ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n children,\n height = 'm',\n leftAddOn,\n leftProp,\n rightProp,\n subText,\n subIcons,\n details,\n theme,\n expandable = false,\n expandedContent,\n value,\n cardContent,\n}) => {\n const subTextRef = useRef(null);\n const subTextHeight = useHeight(subTextRef);\n const isJustChildren = !(subText || subIcons || details);\n const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n return (\n <GroupItem\n render={(context = {}) => {\n const { activeValue, onChange } = context;\n const selected =\n activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n return (\n <Card\n data-testid=\"card-wrapper\"\n minHeight={\n height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n }\n >\n {expandable && (\n <ExpandChevron\n isExpanded={selected}\n onClick={(e) => {\n e.stopPropagation();\n onChange({ target: { value } });\n }}\n align={subText || subIcons ? 'top' : 'center'}\n />\n )}\n <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n {leftAddOn && (\n <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n {leftAddOn}\n </LeftIcon>\n )}\n </Grid>\n <Grid\n pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n width=\"100%\"\n >\n <CenterWrap>\n <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n <TitleEllipsis>{children}</TitleEllipsis>\n {details && (\n <Grid\n data-testid=\"card-details\"\n cols={details.map(() => 'min-content')}\n mb={(!(subText || subIcons) && halfM) || 0}\n pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n >\n {details.map((d, i) => (\n <Detail key={i}>\n {d}\n {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n </Detail>\n ))}\n </Grid>\n )}\n </Title>\n {rightProp &&\n rightProp.map((prop, i) => (\n <RightIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} key={i}>\n {prop}\n </RightIcon>\n ))}\n </CenterWrap>\n {subIcons && (\n <SubTextWrap ref={subTextRef}>\n <SubText>{subIcons}</SubText>\n {subText && subText[1] && <SubText data-testid=\"card-subText\">{subText[1]}</SubText>}\n </SubTextWrap>\n )}\n {subText && !subIcons && (\n <SubTextWrap ref={subTextRef}>\n {subText.map((s, i) => (\n <SubText data-testid=\"card-subText\" key={i}>\n {s}\n </SubText>\n ))}\n </SubTextWrap>\n )}\n <ExpandableRegion show={selected} content={expandedContent} />\n {cardContent && <Grid>{cardContent}</Grid>}\n </Grid>\n </Card>\n );\n }}\n />\n );\n};\n\nMobileCard.propTypes = cardPropsTypes;\nMobileCard.displayName = 'MobileCard';\nconst DSMobileCardWithSchema = describe(MobileCard);\n\nDSMobileCardWithSchema.propTypes = cardPropsTypes;\n\nexport { DSMobileCardWithSchema };\n\nexport default withTheme(MobileCard);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Card"]
|
|
7
7
|
}
|
|
@@ -68,6 +68,12 @@ const LeftIcon = styled(Grid)`
|
|
|
68
68
|
width: ${(props) => props.halfM};
|
|
69
69
|
}
|
|
70
70
|
`;
|
|
71
|
+
const RightIcon = styled(Grid)`
|
|
72
|
+
span > svg,
|
|
73
|
+
span > svg:not([fill]) {
|
|
74
|
+
fill: #000000;
|
|
75
|
+
}
|
|
76
|
+
`;
|
|
71
77
|
const CenterWrap = styled.div`
|
|
72
78
|
display: flex;
|
|
73
79
|
align-items: center;
|
|
@@ -143,7 +149,7 @@ const MobileCard = ({
|
|
|
143
149
|
}
|
|
144
150
|
)
|
|
145
151
|
] }),
|
|
146
|
-
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ jsx(
|
|
152
|
+
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ jsx(RightIcon, { ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s), children: prop }, i))
|
|
147
153
|
] }),
|
|
148
154
|
subIcons && /* @__PURE__ */ jsxs(SubTextWrap, { ref: subTextRef, children: [
|
|
149
155
|
/* @__PURE__ */ jsx(SubText, { children: subIcons }),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/Card.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n styled,\n space,\n color,\n border,\n op,\n truncate,\n withTheme,\n __UNSAFE_SPACE_TO_DIMSUM,\n toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n ${truncate()}\n`;\n\nconst Title = styled.div`\n ${space}\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n width: 100%;\n ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n ${space}\n ${truncate()}\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n ${truncate()}\n &:nth-child(2) {\n padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n }\n`;\nconst SubTextWrap = styled.div`\n ${truncate()}\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n margin-top: 6px;\n margin-bottom: 2px;\n padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n ${color('neutral', 500)}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n display: flex;\n justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n & > span {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n`;\nconst CenterWrap = styled.div`\n display: flex;\n align-items: center;\n ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n children,\n height = 'm',\n leftAddOn,\n leftProp,\n rightProp,\n subText,\n subIcons,\n details,\n theme,\n expandable = false,\n expandedContent,\n value,\n cardContent,\n}) => {\n const subTextRef = useRef(null);\n const subTextHeight = useHeight(subTextRef);\n const isJustChildren = !(subText || subIcons || details);\n const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n return (\n <GroupItem\n render={(context = {}) => {\n const { activeValue, onChange } = context;\n const selected =\n activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n return (\n <Card\n data-testid=\"card-wrapper\"\n minHeight={\n height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n }\n >\n {expandable && (\n <ExpandChevron\n isExpanded={selected}\n onClick={(e) => {\n e.stopPropagation();\n onChange({ target: { value } });\n }}\n align={subText || subIcons ? 'top' : 'center'}\n />\n )}\n <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n {leftAddOn && (\n <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n {leftAddOn}\n </LeftIcon>\n )}\n </Grid>\n <Grid\n pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n width=\"100%\"\n >\n <CenterWrap>\n <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n <TitleEllipsis>{children}</TitleEllipsis>\n {details && (\n <Grid\n data-testid=\"card-details\"\n cols={details.map(() => 'min-content')}\n mb={(!(subText || subIcons) && halfM) || 0}\n pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n >\n {details.map((d, i) => (\n <Detail key={i}>\n {d}\n {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n </Detail>\n ))}\n </Grid>\n )}\n </Title>\n {rightProp &&\n rightProp.map((prop, i) => (\n <
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n styled,\n space,\n color,\n border,\n op,\n truncate,\n withTheme,\n __UNSAFE_SPACE_TO_DIMSUM,\n toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n ${truncate()}\n`;\n\nconst Title = styled.div`\n ${space}\n ${truncate()}\n font-weight: ${(props) => props.theme.fontWeights.semibold};\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n width: 100%;\n ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n ${space}\n ${truncate()}\n font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n ${truncate()}\n &:nth-child(2) {\n padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n }\n`;\nconst SubTextWrap = styled.div`\n ${truncate()}\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n margin-top: 6px;\n margin-bottom: 2px;\n padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n ${color('neutral', 500)}\n font-weight: ${(props) => props.theme.fontWeights.regular};\n display: flex;\n justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n & > span {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n\n & > span > svg,\n svg:not([fill]) {\n height: ${(props) => props.halfM};\n width: ${(props) => props.halfM};\n }\n`;\n\nconst RightIcon = styled(Grid)<{ halfM: string }>`\n span > svg,\n span > svg:not([fill]) {\n fill: #000000;\n }\n`;\nconst CenterWrap = styled.div`\n display: flex;\n align-items: center;\n ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n children,\n height = 'm',\n leftAddOn,\n leftProp,\n rightProp,\n subText,\n subIcons,\n details,\n theme,\n expandable = false,\n expandedContent,\n value,\n cardContent,\n}) => {\n const subTextRef = useRef(null);\n const subTextHeight = useHeight(subTextRef);\n const isJustChildren = !(subText || subIcons || details);\n const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n return (\n <GroupItem\n render={(context = {}) => {\n const { activeValue, onChange } = context;\n const selected =\n activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n return (\n <Card\n data-testid=\"card-wrapper\"\n minHeight={\n height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n }\n >\n {expandable && (\n <ExpandChevron\n isExpanded={selected}\n onClick={(e) => {\n e.stopPropagation();\n onChange({ target: { value } });\n }}\n align={subText || subIcons ? 'top' : 'center'}\n />\n )}\n <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n {leftAddOn && (\n <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n {leftAddOn}\n </LeftIcon>\n )}\n </Grid>\n <Grid\n pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n width=\"100%\"\n >\n <CenterWrap>\n <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n <TitleEllipsis>{children}</TitleEllipsis>\n {details && (\n <Grid\n data-testid=\"card-details\"\n cols={details.map(() => 'min-content')}\n mb={(!(subText || subIcons) && halfM) || 0}\n pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n >\n {details.map((d, i) => (\n <Detail key={i}>\n {d}\n {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n </Detail>\n ))}\n </Grid>\n )}\n </Title>\n {rightProp &&\n rightProp.map((prop, i) => (\n <RightIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} key={i}>\n {prop}\n </RightIcon>\n ))}\n </CenterWrap>\n {subIcons && (\n <SubTextWrap ref={subTextRef}>\n <SubText>{subIcons}</SubText>\n {subText && subText[1] && <SubText data-testid=\"card-subText\">{subText[1]}</SubText>}\n </SubTextWrap>\n )}\n {subText && !subIcons && (\n <SubTextWrap ref={subTextRef}>\n {subText.map((s, i) => (\n <SubText data-testid=\"card-subText\" key={i}>\n {s}\n </SubText>\n ))}\n </SubTextWrap>\n )}\n <ExpandableRegion show={selected} content={expandedContent} />\n {cardContent && <Grid>{cardContent}</Grid>}\n </Grid>\n </Card>\n );\n }}\n />\n );\n};\n\nMobileCard.propTypes = cardPropsTypes;\nMobileCard.displayName = 'MobileCard';\nconst DSMobileCardWithSchema = describe(MobileCard);\n\nDSMobileCardWithSchema.propTypes = cardPropsTypes;\n\nexport { DSMobileCardWithSchema };\n\nexport default withTheme(MobileCard);\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-mobile",
|
|
3
|
-
"version": "3.14.0-next.
|
|
3
|
+
"version": "3.14.0-next.10",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - System",
|
|
6
6
|
"files": [
|
|
@@ -439,21 +439,21 @@
|
|
|
439
439
|
"prop-types": "~15.8.1",
|
|
440
440
|
"react-window": "~1.8.7",
|
|
441
441
|
"react-window-infinite-loader": "~1.0.7",
|
|
442
|
-
"@elliemae/ds-form": "3.14.0-next.
|
|
443
|
-
"@elliemae/ds-
|
|
444
|
-
"@elliemae/ds-
|
|
445
|
-
"@elliemae/ds-
|
|
446
|
-
"@elliemae/ds-
|
|
447
|
-
"@elliemae/ds-
|
|
448
|
-
"@elliemae/ds-
|
|
449
|
-
"@elliemae/ds-
|
|
450
|
-
"@elliemae/ds-
|
|
451
|
-
"@elliemae/ds-
|
|
452
|
-
"@elliemae/ds-
|
|
453
|
-
"@elliemae/ds-
|
|
454
|
-
"@elliemae/ds-
|
|
455
|
-
"@elliemae/ds-
|
|
456
|
-
"@elliemae/ds-truncated-expandable-text": "3.14.0-next.
|
|
442
|
+
"@elliemae/ds-form": "3.14.0-next.10",
|
|
443
|
+
"@elliemae/ds-form-checkbox": "3.14.0-next.10",
|
|
444
|
+
"@elliemae/ds-grid": "3.14.0-next.10",
|
|
445
|
+
"@elliemae/ds-icon": "3.14.0-next.10",
|
|
446
|
+
"@elliemae/ds-icons": "3.14.0-next.10",
|
|
447
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.14.0-next.10",
|
|
448
|
+
"@elliemae/ds-shared": "3.14.0-next.10",
|
|
449
|
+
"@elliemae/ds-system": "3.14.0-next.10",
|
|
450
|
+
"@elliemae/ds-accordion": "3.14.0-next.10",
|
|
451
|
+
"@elliemae/ds-button": "3.14.0-next.10",
|
|
452
|
+
"@elliemae/ds-utilities": "3.14.0-next.10",
|
|
453
|
+
"@elliemae/ds-circular-progress-indicator": "3.14.0-next.10",
|
|
454
|
+
"@elliemae/ds-tabs": "3.14.0-next.10",
|
|
455
|
+
"@elliemae/ds-backdrop": "3.14.0-next.10",
|
|
456
|
+
"@elliemae/ds-truncated-expandable-text": "3.14.0-next.10"
|
|
457
457
|
},
|
|
458
458
|
"devDependencies": {
|
|
459
459
|
"@elliemae/pui-theme": "~2.6.0",
|