@elliemae/ds-mobile 3.25.0-next.1 → 3.25.0-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/MobileBanner/MobileBanner.js +1 -1
- package/dist/cjs/MobileBanner/MobileBanner.js.map +2 -2
- package/dist/cjs/MobileCard/Card.js +2 -2
- package/dist/cjs/MobileCard/Card.js.map +2 -2
- package/dist/cjs/MobileCard/ExpandableRegion.js +1 -1
- package/dist/cjs/MobileCard/ExpandableRegion.js.map +2 -2
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js +1 -1
- package/dist/cjs/MobileContextMenu/MobileContextMenu.js.map +2 -2
- package/dist/cjs/MobileDatePicker/Input.js +1 -1
- package/dist/cjs/MobileDatePicker/Input.js.map +2 -2
- package/dist/cjs/MobileDropdownMenu/MobileDropdownMenu.js +1 -1
- package/dist/cjs/MobileDropdownMenu/MobileDropdownMenu.js.map +2 -2
- package/dist/cjs/MobileTimePicker/Input.js +1 -1
- package/dist/cjs/MobileTimePicker/Input.js.map +2 -2
- package/dist/cjs/SwipeToRefresh/SwipeToRefresh.js +2 -2
- package/dist/cjs/SwipeToRefresh/SwipeToRefresh.js.map +2 -2
- package/dist/esm/MobileBanner/MobileBanner.js +1 -1
- package/dist/esm/MobileBanner/MobileBanner.js.map +2 -2
- package/dist/esm/MobileCard/Card.js +2 -2
- package/dist/esm/MobileCard/Card.js.map +2 -2
- package/dist/esm/MobileCard/ExpandableRegion.js +1 -1
- package/dist/esm/MobileCard/ExpandableRegion.js.map +2 -2
- package/dist/esm/MobileContextMenu/MobileContextMenu.js +1 -1
- package/dist/esm/MobileContextMenu/MobileContextMenu.js.map +2 -2
- package/dist/esm/MobileDatePicker/Input.js +1 -1
- package/dist/esm/MobileDatePicker/Input.js.map +2 -2
- package/dist/esm/MobileDropdownMenu/MobileDropdownMenu.js +1 -1
- package/dist/esm/MobileDropdownMenu/MobileDropdownMenu.js.map +2 -2
- package/dist/esm/MobileTimePicker/Input.js +1 -1
- package/dist/esm/MobileTimePicker/Input.js.map +2 -2
- package/dist/esm/SwipeToRefresh/SwipeToRefresh.js +2 -2
- package/dist/esm/SwipeToRefresh/SwipeToRefresh.js.map +2 -2
- package/dist/types/Accordion/react-desc-prop-types.d.ts +2 -0
- package/dist/types/GlobalHeader/styles.d.ts +6 -6
- package/dist/types/InfiniteLoader/styled.d.ts +1 -1
- package/dist/types/MobileBanner/MobileBanner.d.ts +1 -0
- package/dist/types/MobileBanner/propTypes.d.ts +1 -0
- package/dist/types/MobileBanner/styles.d.ts +11 -17
- package/dist/types/MobileCard/StyledCard.d.ts +1 -1
- package/dist/types/MobileDropdownMenu/MobileDropdownInput.d.ts +2 -2
- package/dist/types/MobileListItem/style.d.ts +2 -2
- package/dist/types/MobileSelectList/styled.d.ts +4 -4
- package/dist/types/Modal/styled.d.ts +6 -6
- package/dist/types/PageSummary/Tags.d.ts +4 -4
- package/dist/types/SideNav/styles.d.ts +8 -8
- package/dist/types/SwipeToRefresh/styled.d.ts +4 -4
- package/package.json +19 -19
|
@@ -93,7 +93,7 @@ const DSMobileBanner = (props) => {
|
|
|
93
93
|
role: "alert",
|
|
94
94
|
...globalAttributes,
|
|
95
95
|
...xstyledProps,
|
|
96
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledInnerContainer, { type, isOpen,
|
|
96
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledInnerContainer, { type, isOpen, innerRef: innerContainerRef, isAnimating, children: [
|
|
97
97
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledIconContainer, { "data-testid": "ds-mobile-banner-icon", children: import_icons.icons[type] }),
|
|
98
98
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledContent, { showCloseButton, children: [
|
|
99
99
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledTitle, { children: label }),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileBanner/MobileBanner.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { icons } from './utils/icons.js';\nimport type { DSMobileBannerT } from './propTypes.js';\nimport { propTypes } from './propTypes.js';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles.js';\nimport { useDSMobileBanner } from './config/useMobileBanner.js';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions.js';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen}
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4Ef;AA5ER,mBAAoE;AACpE,sBAAuB;AACvB,8BAAyB;AACzB,mBAAsB;AAEtB,uBAA0B;AAC1B,oBAWO;AACP,6BAAkC;AAClC,uCAAmC;AAEnC,MAAM,iBAAiB,CAAC,UAAiC;AACvD,QAAM,EAAE,kBAAkB,cAAc,iBAAiB,QAAI,0CAAkB,KAAK;AACpF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,wBAAoB,qBAA8B,IAAI;AAC5D,QAAM,eAAW,qBAA8B,IAAI;AACnD,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAkB,MAAM;AACtD,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAkB,KAAK;AAC7D,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAiB,CAAC;AAE9C,8BAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ,YAAY;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,8BAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS,QAAQ;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,oCAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe,IAAI;AAAA;AAChD,qBAAe,KAAK;AAAA,EAC3B,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,MAAM,WAAW,MAAM;AAAA,MACvC;AAAA,MACC,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,uDAAC,sCAAqB,MAAY,QAAgB,
|
|
4
|
+
"sourcesContent": ["import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { icons } from './utils/icons.js';\nimport type { DSMobileBannerT } from './propTypes.js';\nimport { propTypes } from './propTypes.js';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles.js';\nimport { useDSMobileBanner } from './config/useMobileBanner.js';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions.js';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen} innerRef={innerContainerRef} isAnimating={isAnimating}>\n <StyledIconContainer data-testid=\"ds-mobile-banner-icon\">{icons[type]}</StyledIconContainer>\n <StyledContent showCloseButton={showCloseButton}>\n <StyledTitle>{label}</StyledTitle>\n <StyledSubTitle>\n <StyledSubTitleText>{body}</StyledSubTitleText>\n {actionLinkLabel && (\n <StyledActionLink href={actionLinkHref} data-testid=\"ds-mobile-banner-link\" onClick={actionLinkOnClick}>\n {actionLinkLabel}\n </StyledActionLink>\n )}\n </StyledSubTitle>\n </StyledContent>\n {showCloseButton && (\n <StyledCloseButtonContainer>\n <StyledCloseButton\n data-testid=\"ds-mobile-banner-close-button\"\n buttonType=\"icon\"\n onClick={closeButtonOnClick}\n aria-label=\"Close Banner\"\n innerRef={closeRef}\n size=\"s\"\n >\n <CloseX width=\"12px\" height=\"12px\" />\n </StyledCloseButton>\n </StyledCloseButtonContainer>\n )}\n </StyledInnerContainer>\n </StyledBannerContainer>\n );\n};\n\nDSMobileBanner.propTypes = propTypes;\nDSMobileBanner.displayName = DSMobileBannerName;\nconst DSMobileBannerWithSchema = describe(DSMobileBanner);\nDSMobileBannerWithSchema.propTypes = propTypes;\n\nexport { DSMobileBanner, DSMobileBannerWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4Ef;AA5ER,mBAAoE;AACpE,sBAAuB;AACvB,8BAAyB;AACzB,mBAAsB;AAEtB,uBAA0B;AAC1B,oBAWO;AACP,6BAAkC;AAClC,uCAAmC;AAEnC,MAAM,iBAAiB,CAAC,UAAiC;AACvD,QAAM,EAAE,kBAAkB,cAAc,iBAAiB,QAAI,0CAAkB,KAAK;AACpF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,wBAAoB,qBAA8B,IAAI;AAC5D,QAAM,eAAW,qBAA8B,IAAI;AACnD,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAkB,MAAM;AACtD,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAkB,KAAK;AAC7D,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAiB,CAAC;AAE9C,8BAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ,YAAY;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,8BAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS,QAAQ;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,oCAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe,IAAI;AAAA;AAChD,qBAAe,KAAK;AAAA,EAC3B,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,MAAM,WAAW,MAAM;AAAA,MACvC;AAAA,MACC,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,uDAAC,sCAAqB,MAAY,QAAgB,UAAU,mBAAmB,aAC7E;AAAA,oDAAC,qCAAoB,eAAY,yBAAyB,6BAAM,IAAI,GAAE;AAAA,QACtE,6CAAC,+BAAc,iBACb;AAAA,sDAAC,6BAAa,iBAAM;AAAA,UACpB,6CAAC,gCACC;AAAA,wDAAC,oCAAoB,gBAAK;AAAA,YACzB,mBACC,4CAAC,kCAAiB,MAAM,gBAAgB,eAAY,yBAAwB,SAAS,mBAClF,2BACH;AAAA,aAEJ;AAAA,WACF;AAAA,QACC,mBACC,4CAAC,4CACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,YAAW;AAAA,YACX,SAAS;AAAA,YACT,cAAW;AAAA,YACX,UAAU;AAAA,YACV,MAAK;AAAA,YAEL,sDAAC,0BAAO,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,QACrC,GACF;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,+BAA2B,kCAAS,cAAc;AACxD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -175,11 +175,11 @@ const MobileCard = ({
|
|
|
175
175
|
] }),
|
|
176
176
|
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))
|
|
177
177
|
] }),
|
|
178
|
-
subIcons && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SubTextWrap, {
|
|
178
|
+
subIcons && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(SubTextWrap, { innerRef: subTextRef, children: [
|
|
179
179
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubText, { children: subIcons }),
|
|
180
180
|
subText && subText[1] && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubText, { "data-testid": "card-subText", children: subText[1] })
|
|
181
181
|
] }),
|
|
182
|
-
subText && !subIcons && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubTextWrap, {
|
|
182
|
+
subText && !subIcons && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubTextWrap, { innerRef: subTextRef, children: subText.map((s, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubText, { "data-testid": "card-subText", children: s }, i)) }),
|
|
183
183
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ExpandableRegion.ExpandableRegion, { show: selected, content: expandedContent }),
|
|
184
184
|
cardContent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_grid.Grid, { children: cardContent })
|
|
185
185
|
]
|
|
@@ -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-props-helpers';\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.js';\nimport { ExpandChevron } from './ExpandChevron.js';\nimport { useHeight } from './useHeight.js';\nimport { ExpandableRegion } from './ExpandableRegion.js';\nimport type { MobileCardProps } from './props.js';\nimport { cardPropsTypes } from './props.js';\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
|
|
5
|
-
"mappings": "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
|
|
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-props-helpers';\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.js';\nimport { ExpandChevron } from './ExpandChevron.js';\nimport { useHeight } from './useHeight.js';\nimport { ExpandableRegion } from './ExpandableRegion.js';\nimport type { MobileCardProps } from './props.js';\nimport { cardPropsTypes } from './props.js';\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 innerRef={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 innerRef={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
|
}
|
|
@@ -73,7 +73,7 @@ const ExpandableRegion = ({ show, content }) => {
|
|
|
73
73
|
refHeight: ref?.current?.scrollHeight || 9999,
|
|
74
74
|
onTransitionEnd: hideOnAnimationEnd,
|
|
75
75
|
animate,
|
|
76
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RegionWrapper, { ref, children: content })
|
|
76
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RegionWrapper, { innerRef: ref, children: content })
|
|
77
77
|
}
|
|
78
78
|
);
|
|
79
79
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileCard/ExpandableRegion.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useEffect, useState, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, border, truncate } from '@elliemae/ds-system';\n\nconst RegionWrapper = styled.div`\n width: 100%;\n height: 100%;\n`;\n\nconst Region = styled.div<{ hide: boolean; animate: boolean; refHeight: number }>`\n display: flex;\n ${(props) => (props.hide ? 'visibility: hidden;' : '')}\n transition: max-height ${(props) => (props.animate ? '0.25s' : '0.20s')} linear;\n max-height: 0;\n ${(props) =>\n props.animate\n ? `\n max-height: ${props.refHeight}px;\n `\n : ''}\n align-items: center;\n ${truncate()};\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\n\nexport const ExpandableRegion = ({ show, content }: { show: boolean; content: JSX.Element | JSX.Element[] }) => {\n const ref = useRef<HTMLDivElement>(null);\n // triggers transition\n const [animate, setAnimate] = useState(show);\n // needed to properly handle the transition. Hide after transition ends\n const [hide, setHide] = useState(!show);\n useEffect(() => {\n setAnimate(show);\n if (show) setHide(false);\n }, [show]);\n\n const hideOnAnimationEnd = () => {\n if (!show) setHide(true);\n };\n\n return (\n <Region\n hide={hide}\n // needed to handle transition, `auto` max-height isn't supported\n refHeight={ref?.current?.scrollHeight || 9999}\n onTransitionEnd={hideOnAnimationEnd}\n animate={animate}\n >\n <RegionWrapper
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDjB;AAjDN,mBAAmD;AACnD,wBAAsB;AACtB,uBAAyC;AAEzC,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,wBAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,QAEJ,2BAAS;AAAA,gBACG,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,UAAM,qBAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC,IAAI;AACtC,8BAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MAEA,WAAW,KAAK,SAAS,gBAAgB;AAAA,MACzC,iBAAiB;AAAA,MACjB;AAAA,MAEA,sDAAC,iBAAc,
|
|
4
|
+
"sourcesContent": ["import React, { useEffect, useState, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, border, truncate } from '@elliemae/ds-system';\n\nconst RegionWrapper = styled.div`\n width: 100%;\n height: 100%;\n`;\n\nconst Region = styled.div<{ hide: boolean; animate: boolean; refHeight: number }>`\n display: flex;\n ${(props) => (props.hide ? 'visibility: hidden;' : '')}\n transition: max-height ${(props) => (props.animate ? '0.25s' : '0.20s')} linear;\n max-height: 0;\n ${(props) =>\n props.animate\n ? `\n max-height: ${props.refHeight}px;\n `\n : ''}\n align-items: center;\n ${truncate()};\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\n\nexport const ExpandableRegion = ({ show, content }: { show: boolean; content: JSX.Element | JSX.Element[] }) => {\n const ref = useRef<HTMLDivElement>(null);\n // triggers transition\n const [animate, setAnimate] = useState(show);\n // needed to properly handle the transition. Hide after transition ends\n const [hide, setHide] = useState(!show);\n useEffect(() => {\n setAnimate(show);\n if (show) setHide(false);\n }, [show]);\n\n const hideOnAnimationEnd = () => {\n if (!show) setHide(true);\n };\n\n return (\n <Region\n hide={hide}\n // needed to handle transition, `auto` max-height isn't supported\n refHeight={ref?.current?.scrollHeight || 9999}\n onTransitionEnd={hideOnAnimationEnd}\n animate={animate}\n >\n <RegionWrapper innerRef={ref}>{content}</RegionWrapper>\n </Region>\n );\n};\n\nExpandableRegion.propTypes = {\n show: PropTypes.bool,\n content: PropTypes.element,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDjB;AAjDN,mBAAmD;AACnD,wBAAsB;AACtB,uBAAyC;AAEzC,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,wBAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,QAEJ,2BAAS;AAAA,gBACG,CAAC,cAAU,yBAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,UAAM,qBAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC,IAAI;AACtC,8BAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MAEA,WAAW,KAAK,SAAS,gBAAgB;AAAA,MACzC,iBAAiB;AAAA,MACjB;AAAA,MAEA,sDAAC,iBAAc,UAAU,KAAM,mBAAQ;AAAA;AAAA,EACzC;AAEJ;AAEA,iBAAiB,YAAY;AAAA,EAC3B,MAAM,kBAAAA,QAAU;AAAA,EAChB,SAAS,kBAAAA,QAAU;AACrB;",
|
|
6
6
|
"names": ["PropTypes"]
|
|
7
7
|
}
|
|
@@ -134,7 +134,7 @@ const DSMobileContextMenu = (0, import_ds_system.withTheme)(
|
|
|
134
134
|
}
|
|
135
135
|
}
|
|
136
136
|
),
|
|
137
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(StyledContainer, { zIndex, rows,
|
|
137
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(StyledContainer, { zIndex, rows, innerRef: containerRef, "data-testid": "ds-mobile-context-menu", children: [
|
|
138
138
|
/* @__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 }) }),
|
|
139
139
|
/* @__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) => {
|
|
140
140
|
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;
|
|
@@ -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 import/no-unresolved */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable func-names */\n/* eslint-disable max-lines */\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-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 = null,\n onApply = noop,\n selecteds: initSelecteds,\n }) => {\n const [selectedItems, setSelectedItems] = useState([]);\n const trueSelected = useMemo(\n () => (initSelecteds !== undefined ? initSelecteds : [...selectedItems]),\n [initSelecteds, selectedItems],\n );\n const containerRef = useRef(null);\n const handleChange = (value, childProps, event) => {\n onChange(value, childProps, event);\n if (initSelecteds === undefined) {\n if (multiple) setSelectedItems([...value]);\n else if (singleSelect) setSelectedItems(value);\n }\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n if (buttonFooter) rows.push('56px');\n\n if (!open) return null;\n\n return (\n <>\n <DSBackdrop\n type=\"cover\"\n zIndex={backdropZIndex}\n onClick={(e) => {\n // PUI-4481 prevent click on elements below backdrop\n e.stopPropagation();\n onClickOutside(e);\n }}\n />\n <StyledContainer zIndex={zIndex} rows={rows}
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiGjB;AA7FN,mBAAiD;AACjD,oBAAqB;AACrB,8BAAoC;AACpC,uBAA4C;AAC5C,qBAAqB;AACrB,yBAA2B;AAC3B,uBAAsB;AACtB,oCAA6D;AAE7D,MAAM,sBAAkB,yBAAO,mBAAI;AAAA,gBACnB,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,aAC9C,CAACA,WAAUA,OAAM;AAAA,WACnB,CAACA,WAAU,eAAeA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA,UAG7C,CAACA,WAAUA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvC,MAAM,kBAAc,yBAAO,mBAAI;AAAA;AAAA,iBAEd,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA,WACzC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,QAClD,2BAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAWD,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAIvD,MAAM,sBAAkB,yBAAO,mBAAI;AAAA;AAAA;AAAA,gBAGnB,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM,KAAK;AAAA;AAGzD,MAAM,QAAQ,CAAC,SAAS,MAAM,QAAQ,IAAI;AAE1C,MAAM,0BAAsB;AAAA,EAC1B,CAAC;AAAA,IACC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,eAAe;AAAA,IACf,WAAW;AAAA,IACX,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,aAAa;AAAA,IACb,eAAe;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,EACb,MAAM;AACJ,UAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,CAAC,CAAC;AACrD,UAAM,mBAAe;AAAA,MACnB,MAAO,kBAAkB,SAAY,gBAAgB,CAAC,GAAG,aAAa;AAAA,MACtE,CAAC,eAAe,aAAa;AAAA,IAC/B;AACA,UAAM,mBAAe,qBAAO,IAAI;AAChC,UAAM,eAAe,CAAC,OAAO,YAAY,UAAU;AACjD,eAAS,OAAO,YAAY,KAAK;AACjC,UAAI,kBAAkB,QAAW;AAC/B,YAAI;AAAU,2BAAiB,CAAC,GAAG,KAAK,CAAC;AAAA,iBAChC;AAAc,2BAAiB,KAAK;AAAA,MAC/C;AAAA,IACF;AAEA,UAAM,cAAc,SAAU,GAAG;AAC/B,UAAI,KAAK;AAAS,aAAK,QAAQ,CAAC;AAChC,cAAQ,GAAG,aAAa;AAAA,IAC1B;AAEA,UAAM,OAAO,CAAC,MAAM,MAAM,GAAG,CAAC;AAC9B,QAAI;AAAc,WAAK,KAAK,MAAM;AAElC,QAAI,CAAC;AAAM,aAAO;AAElB,WACE,4EACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAQ;AAAA,UACR,SAAS,CAAC,MAAM;AAEd,cAAE,gBAAgB;AAClB,2BAAe,CAAC;AAAA,UAClB;AAAA;AAAA,MACF;AAAA,MACA,6CAAC,mBAAgB,QAAgB,MAAY,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable import/no-unresolved */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable func-names */\n/* eslint-disable max-lines */\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-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 = null,\n onApply = noop,\n selecteds: initSelecteds,\n }) => {\n const [selectedItems, setSelectedItems] = useState([]);\n const trueSelected = useMemo(\n () => (initSelecteds !== undefined ? initSelecteds : [...selectedItems]),\n [initSelecteds, selectedItems],\n );\n const containerRef = useRef(null);\n const handleChange = (value, childProps, event) => {\n onChange(value, childProps, event);\n if (initSelecteds === undefined) {\n if (multiple) setSelectedItems([...value]);\n else if (singleSelect) setSelectedItems(value);\n }\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n if (buttonFooter) rows.push('56px');\n\n if (!open) return null;\n\n return (\n <>\n <DSBackdrop\n type=\"cover\"\n zIndex={backdropZIndex}\n onClick={(e) => {\n // PUI-4481 prevent click on elements below backdrop\n e.stopPropagation();\n onClickOutside(e);\n }}\n />\n <StyledContainer zIndex={zIndex} rows={rows} innerRef={containerRef} data-testid=\"ds-mobile-context-menu\">\n <HeaderContainer justifyContent=\"center\" alignItems=\"center\" pl=\"xs\" pr=\"xs\">\n <StyledTitle alignItems=\"center\" gutter=\"xxs\" cols={Array(isArr(title) ? title.length : 1).fill('auto')}>\n {title}\n </StyledTitle>\n </HeaderContainer>\n <Grid style={{ overflow: 'hidden' }}>\n <Grid style={{ overflow: 'auto' }}>\n <Group activeValue={trueSelected} multiple={multiple} onChange={handleChange}>\n {React.Children.map(children, (child, ii) => {\n const isGroup =\n child.type === (<ContextMenuGroup />).type ||\n child.type?.name === ContextMenuGroup.componentType ||\n child.type === ContextMenuGroup.type;\n const { onClick = noop } = child.props;\n const value = ii;\n let isSelected;\n if (singleSelect) isSelected = trueSelected === value;\n else if (multiple) isSelected = trueSelected.includes(value);\n return React.cloneElement(child, {\n value,\n key: `cm.${ii}`,\n isMulti: multiple,\n singleSelect,\n isSelected,\n onClick: !isGroup ? (e) => onClick(e, child.props) : null,\n selectedItems: isGroup ? trueSelected : null,\n });\n })}\n </Group>\n </Grid>\n </Grid>\n {buttonFooter && (\n <Grid pl=\"xs\" pr=\"xs\" alignItems=\"center\">\n {React.cloneElement(buttonFooter, {\n ...buttonFooter.props,\n containerProps: {\n 'data-testid': `${dataTestid}--btn`,\n },\n buttonType: 'primary',\n size: 'l',\n onClick: handleApply.bind(buttonFooter.props),\n })}\n </Grid>\n )}\n </StyledContainer>\n </>\n );\n },\n);\n\nconst props = {\n /** toggle open the menu */\n open: PropTypes.bool.description('toggle open the menu'),\n /** context menu title */\n title: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.node])),\n ]).description('context menu title'),\n /** change handler for selectable context menu */\n onChange: PropTypes.func.description('change handler for selectable context menu'),\n /** multi select */\n multiple: PropTypes.bool.description('multi select'),\n /** click outside callback handler */\n onClickOutside: PropTypes.func.description('click outside callback handler'),\n /** array of mobile context menu items */\n children: PropTypes.arrayOf(PropTypes.element).description('array of mobile context menu items'),\n /** z index for overlay div */\n backdropZIndex: PropTypes.number.description('z index for overlay div'),\n /** z index for menu container */\n zIndex: PropTypes.number.description('z index for menu container'),\n /** for e2e tests */\n dataTestid: PropTypes.string.description('for e2e tests'),\n /** bottom button */\n buttonFooter: PropTypes.element.description('bottom button'),\n /** callback */\n onApply: PropTypes.func.description('callback'),\n /** selected elements for multi and single select */\n selecteds: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.number,\n ]).description('selected elements for multi and single select'),\n};\n\nDSMobileContextMenu.propTypes = props;\nDSMobileContextMenu.displayName = 'DSMobileContextMenu';\nconst DSMobileContextMenuWithSchema = describe(DSMobileContextMenu);\n\nDSMobileContextMenuWithSchema.propTypes = props;\n\nexport { DSMobileContextMenu, DSMobileContextMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["props", "React", "ContextMenuGroup"]
|
|
7
7
|
}
|
|
@@ -74,5 +74,5 @@ const StyledInput = import_ds_system.styled.input`
|
|
|
74
74
|
display: none;
|
|
75
75
|
}
|
|
76
76
|
`;
|
|
77
|
-
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, {
|
|
77
|
+
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, { innerRef, ...props });
|
|
78
78
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDatePicker/Input.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { styled, focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4C0B;AA3CjD,uBAAwD;AAExD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,cAAU,wBAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { styled, focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4C0B;AA3CjD,uBAAwD;AAExD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,cAAU,wBAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileDropdownMenu/MobileDropdownMenu.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSMobileContextMenu, DSMobileContextMenuItem } from '../MobileContextMenu/index.js';\nimport { DSMobileDropdownTriggerInput } from './MobileDropdownInput.js';\ninterface OptionT {\n label: string;\n value: string;\n}\ninterface DSMobileDropdownMenuPropsT {\n placeholder: string;\n value: string;\n options: OptionT[];\n title: string;\n itemsProps: {\n label?: string;\n leftProp?: JSX.Element;\n isGroup?: boolean;\n isMulti?: boolean;\n singleSelect?: boolean;\n isItemSelected?: (opt: OptionT) => boolean;\n onClick?: (opt: OptionT, e: any) => void;\n };\n}\nconst DSMobileDropdownMenu = ({\n placeholder,\n options = [],\n title,\n value,\n itemsProps = {\n label: undefined,\n leftProp: undefined,\n isGroup: false,\n isMulti: false,\n singleSelect: false,\n isItemSelected: () => false,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick: () => {},\n },\n}: DSMobileDropdownMenuPropsT): JSX.Element => {\n const [menuOpen, setMenuOpen] = useState(false);\n const inputRef = useRef(null);\n const inputProps = React.useMemo(\n () => ({\n readOnly: true,\n value,\n onClick: () => setMenuOpen(true),\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8DnB;AA7DJ,mBAAwC;AACxC,8BAAoC;AACpC,+BAA6D;AAC7D,iCAA6C;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,eAAW,qBAAO,IAAI;AAC5B,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSMobileContextMenu, DSMobileContextMenuItem } from '../MobileContextMenu/index.js';\nimport { DSMobileDropdownTriggerInput } from './MobileDropdownInput.js';\ninterface OptionT {\n label: string;\n value: string;\n}\ninterface DSMobileDropdownMenuPropsT {\n placeholder: string;\n value: string;\n options: OptionT[];\n title: string;\n itemsProps: {\n label?: string;\n leftProp?: JSX.Element;\n isGroup?: boolean;\n isMulti?: boolean;\n singleSelect?: boolean;\n isItemSelected?: (opt: OptionT) => boolean;\n onClick?: (opt: OptionT, e: any) => void;\n };\n}\nconst DSMobileDropdownMenu = ({\n placeholder,\n options = [],\n title,\n value,\n itemsProps = {\n label: undefined,\n leftProp: undefined,\n isGroup: false,\n isMulti: false,\n singleSelect: false,\n isItemSelected: () => false,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick: () => {},\n },\n}: DSMobileDropdownMenuPropsT): JSX.Element => {\n const [menuOpen, setMenuOpen] = useState(false);\n const inputRef = useRef(null);\n const inputProps = React.useMemo(\n () => ({\n readOnly: true,\n value,\n onClick: () => setMenuOpen(true),\n innerRef: inputRef,\n placeholder,\n }),\n [value, placeholder],\n );\n const caretProps = React.useMemo(\n () => ({\n onClick: () => {\n inputRef.current.focus();\n setMenuOpen(true);\n },\n }),\n [],\n );\n return (\n <>\n <DSMobileDropdownTriggerInput inputProps={inputProps} caretProps={caretProps} />\n {menuOpen ? (\n <DSMobileContextMenu\n title={title}\n open\n onChange={(_, e) => {\n setMenuOpen(false);\n }}\n onClickOutside={() => setMenuOpen(false)}\n >\n {options.map((opt, i) => (\n <DSMobileContextMenuItem\n key={'ddwn'.concat(`${i}`)}\n title={opt.label}\n value={opt.value}\n isSelected={itemsProps.isItemSelected(opt)}\n onClick={(e) => {\n setMenuOpen(false);\n itemsProps.onClick(opt, e);\n }}\n label={itemsProps.label}\n leftProp={itemsProps.leftProp}\n isGroup={itemsProps.isGroup}\n isMulti={itemsProps.isMulti}\n singleSelect={itemsProps.singleSelect}\n />\n ))}\n </DSMobileContextMenu>\n ) : null}\n </>\n );\n};\n\nconst props = {\n /** dropdown menu placeholder */\n placeholder: PropTypes.string.description('dropdown menu placeholder'),\n /** context menu menu title */\n title: PropTypes.string.description('context menu menu title'),\n /** context menu options / items */\n options: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string, label: PropTypes.string })).description(\n 'context menu options / items',\n ),\n};\n\nDSMobileDropdownMenu.propTypes = props;\nDSMobileDropdownMenu.displayName = 'DSMobileDropdownMenu';\nconst DSMobileDropdownMenuWithSchema = describe(DSMobileDropdownMenu);\nDSMobileDropdownMenuWithSchema.propTypes = props;\n\nexport { DSMobileDropdownMenu, DSMobileDropdownMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8DnB;AA7DJ,mBAAwC;AACxC,8BAAoC;AACpC,+BAA6D;AAC7D,iCAA6C;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,eAAW,qBAAO,IAAI;AAC5B,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,UAAU;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AACA,QAAM,aAAa,aAAAA,QAAM;AAAA,IACvB,OAAO;AAAA,MACL,SAAS,MAAM;AACb,iBAAS,QAAQ,MAAM;AACvB,oBAAY,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,SACE,4EACE;AAAA,gDAAC,2DAA6B,YAAwB,YAAwB;AAAA,IAC7E,WACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAI;AAAA,QACJ,UAAU,CAAC,GAAG,MAAM;AAClB,sBAAY,KAAK;AAAA,QACnB;AAAA,QACA,gBAAgB,MAAM,YAAY,KAAK;AAAA,QAEtC,kBAAQ,IAAI,CAAC,KAAK,MACjB;AAAA,UAAC;AAAA;AAAA,YAEC,OAAO,IAAI;AAAA,YACX,OAAO,IAAI;AAAA,YACX,YAAY,WAAW,eAAe,GAAG;AAAA,YACzC,SAAS,CAAC,MAAM;AACd,0BAAY,KAAK;AACjB,yBAAW,QAAQ,KAAK,CAAC;AAAA,YAC3B;AAAA,YACA,OAAO,WAAW;AAAA,YAClB,UAAU,WAAW;AAAA,YACrB,SAAS,WAAW;AAAA,YACpB,SAAS,WAAW;AAAA,YACpB,cAAc,WAAW;AAAA;AAAA,UAZpB,OAAO,OAAO,GAAG,GAAG;AAAA,QAa3B,CACD;AAAA;AAAA,IACH,IACE;AAAA,KACN;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA,EAEZ,aAAa,kCAAU,OAAO,YAAY,2BAA2B;AAAA;AAAA,EAErE,OAAO,kCAAU,OAAO,YAAY,yBAAyB;AAAA;AAAA,EAE7D,SAAS,kCAAU,QAAQ,kCAAU,MAAM,EAAE,OAAO,kCAAU,QAAQ,OAAO,kCAAU,OAAO,CAAC,CAAC,EAAE;AAAA,IAChG;AAAA,EACF;AACF;AAEA,qBAAqB,YAAY;AACjC,qBAAqB,cAAc;AACnC,MAAM,qCAAiC,kCAAS,oBAAoB;AACpE,+BAA+B,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -74,5 +74,5 @@ const StyledInput = import_ds_system.styled.input`
|
|
|
74
74
|
display: none;
|
|
75
75
|
}
|
|
76
76
|
`;
|
|
77
|
-
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, {
|
|
77
|
+
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledInput, { innerRef, ...props });
|
|
78
78
|
//# sourceMappingURL=Input.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/MobileTimePicker/Input.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4C0B;AA3CjD,uBAAwD;AAExD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,cAAU,wBAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4C0B;AA3CjD,uBAAwD;AAExD,MAAM,cAAc,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,cAAU,2CAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,cAAU,wBAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,4CAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -52,7 +52,7 @@ const SwipeToRefresh = ({ children, loading, onRefresh }) => {
|
|
|
52
52
|
onTouchEnd: swipe.touchEnd,
|
|
53
53
|
onTouchCancel: swipe.touchCancel,
|
|
54
54
|
onTouchMove: swipe.touchMove,
|
|
55
|
-
|
|
55
|
+
innerRef: swipe.ref,
|
|
56
56
|
children: [
|
|
57
57
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
58
58
|
import_styled.LoaderBox,
|
|
@@ -72,7 +72,7 @@ const SwipeToRefresh = ({ children, loading, onRefresh }) => {
|
|
|
72
72
|
)
|
|
73
73
|
}
|
|
74
74
|
),
|
|
75
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
75
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { innerRef: swipe.target, style: { height: 1 } }),
|
|
76
76
|
children
|
|
77
77
|
]
|
|
78
78
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/SwipeToRefresh/SwipeToRefresh.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { useTheme } from '@elliemae/ds-system';\nimport { useSwipe } from './useSwipe.js';\nimport { SwipeContainer, SwipeDrag, LoaderBox, PositionLoader } from './styled.js';\nimport { ProgressIndicator } from './ProgressIndicator.js';\n\nconst SwipeToRefresh = ({ children, loading, onRefresh }) => {\n const breakpoint = 60;\n const theme = useTheme();\n const swipe = useSwipe({ onRefresh, breakpoint });\n const progress = swipe.height > breakpoint ? 100 : (swipe.height * 100) / breakpoint;\n return (\n <SwipeContainer>\n <SwipeDrag\n onTouchStart={swipe.touchStart}\n onTouchEnd={swipe.touchEnd}\n onTouchCancel={swipe.touchCancel}\n onTouchMove={swipe.touchMove}\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADejB;AAdN,8BAAoC;AACpC,4CAA4C;AAC5C,uBAAyB;AACzB,sBAAyB;AACzB,oBAAqE;AACrE,+BAAkC;AAElC,MAAM,iBAAiB,CAAC,EAAE,UAAU,SAAS,UAAU,MAAM;AAC3D,QAAM,aAAa;AACnB,QAAM,YAAQ,2BAAS;AACvB,QAAM,YAAQ,0BAAS,EAAE,WAAW,WAAW,CAAC;AAChD,QAAM,WAAW,MAAM,SAAS,aAAa,MAAO,MAAM,SAAS,MAAO;AAC1E,SACE,4CAAC,gCACC;AAAA,IAAC;AAAA;AAAA,MACC,cAAc,MAAM;AAAA,MACpB,YAAY,MAAM;AAAA,MAClB,eAAe,MAAM;AAAA,MACrB,aAAa,MAAM;AAAA,MACnB,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { useTheme } from '@elliemae/ds-system';\nimport { useSwipe } from './useSwipe.js';\nimport { SwipeContainer, SwipeDrag, LoaderBox, PositionLoader } from './styled.js';\nimport { ProgressIndicator } from './ProgressIndicator.js';\n\nconst SwipeToRefresh = ({ children, loading, onRefresh }) => {\n const breakpoint = 60;\n const theme = useTheme();\n const swipe = useSwipe({ onRefresh, breakpoint });\n const progress = swipe.height > breakpoint ? 100 : (swipe.height * 100) / breakpoint;\n return (\n <SwipeContainer>\n <SwipeDrag\n onTouchStart={swipe.touchStart}\n onTouchEnd={swipe.touchEnd}\n onTouchCancel={swipe.touchCancel}\n onTouchMove={swipe.touchMove}\n innerRef={swipe.ref}\n >\n <LoaderBox\n height={loading ? theme.space.m : `${swipe.height}px`}\n alignItems=\"flex-start\"\n data-testid=\"loader-box\"\n >\n <PositionLoader\n height={theme.space.m}\n justifyContent=\"center\"\n alignItems=\"center\"\n mt={swipe.height > 40 || loading ? 0 : `${swipe.height - 40}px`}\n >\n {loading ? <DSCircularProgressIndicator /> : <ProgressIndicator progress={progress} />}\n </PositionLoader>\n </LoaderBox>\n <div innerRef={swipe.target} style={{ height: 1 }} />\n {children}\n </SwipeDrag>\n </SwipeContainer>\n );\n};\n\nconst props = {\n /** component inside swipe to refresh container */\n children: PropTypes.element.isRequired.description('component inside swipe to refresh container'),\n /** toggle loading state for swipe */\n loading: PropTypes.bool.description('toggle loading state for swipe'),\n /** callback on refresh swipe */\n onRefresh: PropTypes.func.description('callback on refresh swipe'),\n};\n\nSwipeToRefresh.propTypes = props;\nSwipeToRefresh.displayName = 'SwipeToRefresh';\nconst SwipeToRefreshWithSchema = describe(SwipeToRefresh);\n\nSwipeToRefreshWithSchema.propTypes = props;\n\nexport { SwipeToRefresh, SwipeToRefreshWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADejB;AAdN,8BAAoC;AACpC,4CAA4C;AAC5C,uBAAyB;AACzB,sBAAyB;AACzB,oBAAqE;AACrE,+BAAkC;AAElC,MAAM,iBAAiB,CAAC,EAAE,UAAU,SAAS,UAAU,MAAM;AAC3D,QAAM,aAAa;AACnB,QAAM,YAAQ,2BAAS;AACvB,QAAM,YAAQ,0BAAS,EAAE,WAAW,WAAW,CAAC;AAChD,QAAM,WAAW,MAAM,SAAS,aAAa,MAAO,MAAM,SAAS,MAAO;AAC1E,SACE,4CAAC,gCACC;AAAA,IAAC;AAAA;AAAA,MACC,cAAc,MAAM;AAAA,MACpB,YAAY,MAAM;AAAA,MAClB,eAAe,MAAM;AAAA,MACrB,aAAa,MAAM;AAAA,MACnB,UAAU,MAAM;AAAA,MAEhB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,QAAQ,UAAU,MAAM,MAAM,IAAI,GAAG,MAAM;AAAA,YAC3C,YAAW;AAAA,YACX,eAAY;AAAA,YAEZ;AAAA,cAAC;AAAA;AAAA,gBACC,QAAQ,MAAM,MAAM;AAAA,gBACpB,gBAAe;AAAA,gBACf,YAAW;AAAA,gBACX,IAAI,MAAM,SAAS,MAAM,UAAU,IAAI,GAAG,MAAM,SAAS;AAAA,gBAExD,oBAAU,4CAAC,qEAA4B,IAAK,4CAAC,8CAAkB,UAAoB;AAAA;AAAA,YACtF;AAAA;AAAA,QACF;AAAA,QACA,4CAAC,SAAI,UAAU,MAAM,QAAQ,OAAO,EAAE,QAAQ,EAAE,GAAG;AAAA,QAClD;AAAA;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA,EAEZ,UAAU,kCAAU,QAAQ,WAAW,YAAY,6CAA6C;AAAA;AAAA,EAEhG,SAAS,kCAAU,KAAK,YAAY,gCAAgC;AAAA;AAAA,EAEpE,WAAW,kCAAU,KAAK,YAAY,2BAA2B;AACnE;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,+BAA2B,kCAAS,cAAc;AAExD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -70,7 +70,7 @@ const DSMobileBanner = (props) => {
|
|
|
70
70
|
role: "alert",
|
|
71
71
|
...globalAttributes,
|
|
72
72
|
...xstyledProps,
|
|
73
|
-
children: /* @__PURE__ */ jsxs(StyledInnerContainer, { type, isOpen,
|
|
73
|
+
children: /* @__PURE__ */ jsxs(StyledInnerContainer, { type, isOpen, innerRef: innerContainerRef, isAnimating, children: [
|
|
74
74
|
/* @__PURE__ */ jsx(StyledIconContainer, { "data-testid": "ds-mobile-banner-icon", children: icons[type] }),
|
|
75
75
|
/* @__PURE__ */ jsxs(StyledContent, { showCloseButton, children: [
|
|
76
76
|
/* @__PURE__ */ jsx(StyledTitle, { children: label }),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/MobileBanner.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { icons } from './utils/icons.js';\nimport type { DSMobileBannerT } from './propTypes.js';\nimport { propTypes } from './propTypes.js';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles.js';\nimport { useDSMobileBanner } from './config/useMobileBanner.js';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions.js';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen}
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC4Ef,cAGE,YAHF;AA5ER,SAAgB,iBAAiB,WAAW,QAAQ,gBAAgB;AACpE,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,aAAa;AAEtB,SAAS,iBAAiB;AAC1B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAClC,SAAS,0BAA0B;AAEnC,MAAM,iBAAiB,CAAC,UAAiC;AACvD,QAAM,EAAE,kBAAkB,cAAc,iBAAiB,IAAI,kBAAkB,KAAK;AACpF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,oBAAoB,OAA8B,IAAI;AAC5D,QAAM,WAAW,OAA8B,IAAI;AACnD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,MAAM;AACtD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAkB,KAAK;AAC7D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,CAAC;AAE9C,YAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ,YAAY;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,YAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS,QAAQ;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,kBAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe,IAAI;AAAA;AAChD,qBAAe,KAAK;AAAA,EAC3B,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,MAAM,WAAW,MAAM;AAAA,MACvC;AAAA,MACC,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,+BAAC,wBAAqB,MAAY,QAAgB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { icons } from './utils/icons.js';\nimport type { DSMobileBannerT } from './propTypes.js';\nimport { propTypes } from './propTypes.js';\nimport {\n StyledActionLink,\n StyledCloseButton,\n StyledInnerContainer,\n StyledBannerContainer,\n StyledContent,\n StyledIconContainer,\n StyledSubTitle,\n StyledTitle,\n StyledSubTitleText,\n StyledCloseButtonContainer,\n} from './styles.js';\nimport { useDSMobileBanner } from './config/useMobileBanner.js';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions.js';\n\nconst DSMobileBanner = (props: DSMobileBannerT.Props) => {\n const { globalAttributes, xstyledProps, propsWithDefault } = useDSMobileBanner(props);\n const {\n type,\n isOpen,\n closeButtonOnClick,\n label,\n body,\n actionLinkLabel,\n actionLinkHref,\n actionLinkOnClick,\n showCloseButton,\n containerProps,\n focusOnOpen,\n } = propsWithDefault;\n\n const innerContainerRef = useRef<HTMLDivElement | null>(null);\n const closeRef = useRef<HTMLDivElement | null>(null);\n const [current, setCurrent] = useState<boolean>(isOpen);\n const [isAnimating, setIsAnimating] = useState<boolean>(false);\n const [height, setHeight] = useState<number>(0);\n\n useEffect(() => {\n if (innerContainerRef.current) {\n setHeight(innerContainerRef.current.offsetHeight);\n }\n }, [isAnimating, isOpen]);\n\n useEffect(() => {\n if (focusOnOpen && closeRef.current && isOpen) {\n closeRef.current?.focus?.();\n }\n }, [focusOnOpen, isOpen]);\n\n useLayoutEffect(() => {\n if (isOpen !== current || isOpen) setIsAnimating(true);\n else setIsAnimating(false);\n }, [isOpen, current]);\n\n if (!isAnimating && !isOpen) return null;\n\n return (\n <StyledBannerContainer\n type={type}\n isOpen={isOpen}\n isAnimating={isAnimating}\n onAnimationEnd={() => setCurrent(isOpen)}\n height={height}\n {...containerProps}\n data-testid=\"ds-mobile-banner-container\"\n role=\"alert\"\n {...globalAttributes}\n {...xstyledProps}\n >\n <StyledInnerContainer type={type} isOpen={isOpen} innerRef={innerContainerRef} isAnimating={isAnimating}>\n <StyledIconContainer data-testid=\"ds-mobile-banner-icon\">{icons[type]}</StyledIconContainer>\n <StyledContent showCloseButton={showCloseButton}>\n <StyledTitle>{label}</StyledTitle>\n <StyledSubTitle>\n <StyledSubTitleText>{body}</StyledSubTitleText>\n {actionLinkLabel && (\n <StyledActionLink href={actionLinkHref} data-testid=\"ds-mobile-banner-link\" onClick={actionLinkOnClick}>\n {actionLinkLabel}\n </StyledActionLink>\n )}\n </StyledSubTitle>\n </StyledContent>\n {showCloseButton && (\n <StyledCloseButtonContainer>\n <StyledCloseButton\n data-testid=\"ds-mobile-banner-close-button\"\n buttonType=\"icon\"\n onClick={closeButtonOnClick}\n aria-label=\"Close Banner\"\n innerRef={closeRef}\n size=\"s\"\n >\n <CloseX width=\"12px\" height=\"12px\" />\n </StyledCloseButton>\n </StyledCloseButtonContainer>\n )}\n </StyledInnerContainer>\n </StyledBannerContainer>\n );\n};\n\nDSMobileBanner.propTypes = propTypes;\nDSMobileBanner.displayName = DSMobileBannerName;\nconst DSMobileBannerWithSchema = describe(DSMobileBanner);\nDSMobileBannerWithSchema.propTypes = propTypes;\n\nexport { DSMobileBanner, DSMobileBannerWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4Ef,cAGE,YAHF;AA5ER,SAAgB,iBAAiB,WAAW,QAAQ,gBAAgB;AACpE,SAAS,cAAc;AACvB,SAAS,gBAAgB;AACzB,SAAS,aAAa;AAEtB,SAAS,iBAAiB;AAC1B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,yBAAyB;AAClC,SAAS,0BAA0B;AAEnC,MAAM,iBAAiB,CAAC,UAAiC;AACvD,QAAM,EAAE,kBAAkB,cAAc,iBAAiB,IAAI,kBAAkB,KAAK;AACpF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,oBAAoB,OAA8B,IAAI;AAC5D,QAAM,WAAW,OAA8B,IAAI;AACnD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,MAAM;AACtD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAkB,KAAK;AAC7D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,CAAC;AAE9C,YAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ,YAAY;AAAA,IAClD;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,YAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS,QAAQ;AAAA,IAC5B;AAAA,EACF,GAAG,CAAC,aAAa,MAAM,CAAC;AAExB,kBAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe,IAAI;AAAA;AAChD,qBAAe,KAAK;AAAA,EAC3B,GAAG,CAAC,QAAQ,OAAO,CAAC;AAEpB,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,gBAAgB,MAAM,WAAW,MAAM;AAAA,MACvC;AAAA,MACC,GAAG;AAAA,MACJ,eAAY;AAAA,MACZ,MAAK;AAAA,MACJ,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,+BAAC,wBAAqB,MAAY,QAAgB,UAAU,mBAAmB,aAC7E;AAAA,4BAAC,uBAAoB,eAAY,yBAAyB,gBAAM,IAAI,GAAE;AAAA,QACtE,qBAAC,iBAAc,iBACb;AAAA,8BAAC,eAAa,iBAAM;AAAA,UACpB,qBAAC,kBACC;AAAA,gCAAC,sBAAoB,gBAAK;AAAA,YACzB,mBACC,oBAAC,oBAAiB,MAAM,gBAAgB,eAAY,yBAAwB,SAAS,mBAClF,2BACH;AAAA,aAEJ;AAAA,WACF;AAAA,QACC,mBACC,oBAAC,8BACC;AAAA,UAAC;AAAA;AAAA,YACC,eAAY;AAAA,YACZ,YAAW;AAAA,YACX,SAAS;AAAA,YACT,cAAW;AAAA,YACX,UAAU;AAAA,YACV,MAAK;AAAA,YAEL,8BAAC,UAAO,OAAM,QAAO,QAAO,QAAO;AAAA;AAAA,QACrC,GACF;AAAA,SAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc;AACxD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -151,11 +151,11 @@ const MobileCard = ({
|
|
|
151
151
|
] }),
|
|
152
152
|
rightProp && rightProp.map((prop, i) => /* @__PURE__ */ jsx(RightIcon, { ml: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s), children: prop }, i))
|
|
153
153
|
] }),
|
|
154
|
-
subIcons && /* @__PURE__ */ jsxs(SubTextWrap, {
|
|
154
|
+
subIcons && /* @__PURE__ */ jsxs(SubTextWrap, { innerRef: subTextRef, children: [
|
|
155
155
|
/* @__PURE__ */ jsx(SubText, { children: subIcons }),
|
|
156
156
|
subText && subText[1] && /* @__PURE__ */ jsx(SubText, { "data-testid": "card-subText", children: subText[1] })
|
|
157
157
|
] }),
|
|
158
|
-
subText && !subIcons && /* @__PURE__ */ jsx(SubTextWrap, {
|
|
158
|
+
subText && !subIcons && /* @__PURE__ */ jsx(SubTextWrap, { innerRef: subTextRef, children: subText.map((s, i) => /* @__PURE__ */ jsx(SubText, { "data-testid": "card-subText", children: s }, i)) }),
|
|
159
159
|
/* @__PURE__ */ jsx(ExpandableRegion, { show: selected, content: expandedContent }),
|
|
160
160
|
cardContent && /* @__PURE__ */ jsx(Grid, { children: cardContent })
|
|
161
161
|
]
|
|
@@ -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-props-helpers';\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.js';\nimport { ExpandChevron } from './ExpandChevron.js';\nimport { useHeight } from './useHeight.js';\nimport { ExpandableRegion } from './ExpandableRegion.js';\nimport type { MobileCardProps } from './props.js';\nimport { cardPropsTypes } from './props.js';\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
|
|
5
|
-
"mappings": "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
|
|
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-props-helpers';\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.js';\nimport { ExpandChevron } from './ExpandChevron.js';\nimport { useHeight } from './useHeight.js';\nimport { ExpandableRegion } from './ExpandableRegion.js';\nimport type { MobileCardProps } from './props.js';\nimport { cardPropsTypes } from './props.js';\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 innerRef={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 innerRef={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
|
}
|
|
@@ -40,7 +40,7 @@ const ExpandableRegion = ({ show, content }) => {
|
|
|
40
40
|
refHeight: ref?.current?.scrollHeight || 9999,
|
|
41
41
|
onTransitionEnd: hideOnAnimationEnd,
|
|
42
42
|
animate,
|
|
43
|
-
children: /* @__PURE__ */ jsx(RegionWrapper, { ref, children: content })
|
|
43
|
+
children: /* @__PURE__ */ jsx(RegionWrapper, { innerRef: ref, children: content })
|
|
44
44
|
}
|
|
45
45
|
);
|
|
46
46
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/ExpandableRegion.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useEffect, useState, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, border, truncate } from '@elliemae/ds-system';\n\nconst RegionWrapper = styled.div`\n width: 100%;\n height: 100%;\n`;\n\nconst Region = styled.div<{ hide: boolean; animate: boolean; refHeight: number }>`\n display: flex;\n ${(props) => (props.hide ? 'visibility: hidden;' : '')}\n transition: max-height ${(props) => (props.animate ? '0.25s' : '0.20s')} linear;\n max-height: 0;\n ${(props) =>\n props.animate\n ? `\n max-height: ${props.refHeight}px;\n `\n : ''}\n align-items: center;\n ${truncate()};\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\n\nexport const ExpandableRegion = ({ show, content }: { show: boolean; content: JSX.Element | JSX.Element[] }) => {\n const ref = useRef<HTMLDivElement>(null);\n // triggers transition\n const [animate, setAnimate] = useState(show);\n // needed to properly handle the transition. Hide after transition ends\n const [hide, setHide] = useState(!show);\n useEffect(() => {\n setAnimate(show);\n if (show) setHide(false);\n }, [show]);\n\n const hideOnAnimationEnd = () => {\n if (!show) setHide(true);\n };\n\n return (\n <Region\n hide={hide}\n // needed to handle transition, `auto` max-height isn't supported\n refHeight={ref?.current?.scrollHeight || 9999}\n onTransitionEnd={hideOnAnimationEnd}\n animate={animate}\n >\n <RegionWrapper
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACiDjB;AAjDN,SAAgB,WAAW,UAAU,cAAc;AACnD,OAAO,eAAe;AACtB,SAAS,QAAQ,QAAQ,gBAAgB;AAEzC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,OAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,IAEJ,SAAS;AAAA,gBACG,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,MAAM,OAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC,IAAI;AACtC,YAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MAEA,WAAW,KAAK,SAAS,gBAAgB;AAAA,MACzC,iBAAiB;AAAA,MACjB;AAAA,MAEA,8BAAC,iBAAc,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useEffect, useState, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { styled, border, truncate } from '@elliemae/ds-system';\n\nconst RegionWrapper = styled.div`\n width: 100%;\n height: 100%;\n`;\n\nconst Region = styled.div<{ hide: boolean; animate: boolean; refHeight: number }>`\n display: flex;\n ${(props) => (props.hide ? 'visibility: hidden;' : '')}\n transition: max-height ${(props) => (props.animate ? '0.25s' : '0.20s')} linear;\n max-height: 0;\n ${(props) =>\n props.animate\n ? `\n max-height: ${props.refHeight}px;\n `\n : ''}\n align-items: center;\n ${truncate()};\n border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\n\nexport const ExpandableRegion = ({ show, content }: { show: boolean; content: JSX.Element | JSX.Element[] }) => {\n const ref = useRef<HTMLDivElement>(null);\n // triggers transition\n const [animate, setAnimate] = useState(show);\n // needed to properly handle the transition. Hide after transition ends\n const [hide, setHide] = useState(!show);\n useEffect(() => {\n setAnimate(show);\n if (show) setHide(false);\n }, [show]);\n\n const hideOnAnimationEnd = () => {\n if (!show) setHide(true);\n };\n\n return (\n <Region\n hide={hide}\n // needed to handle transition, `auto` max-height isn't supported\n refHeight={ref?.current?.scrollHeight || 9999}\n onTransitionEnd={hideOnAnimationEnd}\n animate={animate}\n >\n <RegionWrapper innerRef={ref}>{content}</RegionWrapper>\n </Region>\n );\n};\n\nExpandableRegion.propTypes = {\n show: PropTypes.bool,\n content: PropTypes.element,\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACiDjB;AAjDN,SAAgB,WAAW,UAAU,cAAc;AACnD,OAAO,eAAe;AACtB,SAAS,QAAQ,QAAQ,gBAAgB;AAEzC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAK7B,MAAM,SAAS,OAAO;AAAA;AAAA,IAElB,CAAC,UAAW,MAAM,OAAO,wBAAwB;AAAA,2BAC1B,CAAC,UAAW,MAAM,UAAU,UAAU;AAAA;AAAA,IAE7D,CAAC,UACD,MAAM,UACF;AAAA,oBACY,MAAM;AAAA,QAElB;AAAA;AAAA,IAEJ,SAAS;AAAA,gBACG,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA,iBAClD,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAG7C,MAAM,mBAAmB,CAAC,EAAE,MAAM,QAAQ,MAA+D;AAC9G,QAAM,MAAM,OAAuB,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,IAAI;AAE3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC,IAAI;AACtC,YAAU,MAAM;AACd,eAAW,IAAI;AACf,QAAI;AAAM,cAAQ,KAAK;AAAA,EACzB,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAM,cAAQ,IAAI;AAAA,EACzB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MAEA,WAAW,KAAK,SAAS,gBAAgB;AAAA,MACzC,iBAAiB;AAAA,MACjB;AAAA,MAEA,8BAAC,iBAAc,UAAU,KAAM,mBAAQ;AAAA;AAAA,EACzC;AAEJ;AAEA,iBAAiB,YAAY;AAAA,EAC3B,MAAM,UAAU;AAAA,EAChB,SAAS,UAAU;AACrB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -100,7 +100,7 @@ const DSMobileContextMenu = withTheme(
|
|
|
100
100
|
}
|
|
101
101
|
}
|
|
102
102
|
),
|
|
103
|
-
/* @__PURE__ */ jsxs(StyledContainer, { zIndex, rows,
|
|
103
|
+
/* @__PURE__ */ jsxs(StyledContainer, { zIndex, rows, innerRef: containerRef, "data-testid": "ds-mobile-context-menu", children: [
|
|
104
104
|
/* @__PURE__ */ jsx(HeaderContainer, { justifyContent: "center", alignItems: "center", pl: "xs", pr: "xs", children: /* @__PURE__ */ jsx(StyledTitle, { alignItems: "center", gutter: "xxs", cols: Array(isArr(title) ? title.length : 1).fill("auto"), children: title }) }),
|
|
105
105
|
/* @__PURE__ */ jsx(Grid, { style: { overflow: "hidden" }, children: /* @__PURE__ */ jsx(Grid, { style: { overflow: "auto" }, children: /* @__PURE__ */ jsx(Group, { activeValue: trueSelected, multiple, onChange: handleChange, children: React2.Children.map(children, (child, ii) => {
|
|
106
106
|
const isGroup = child.type === (/* @__PURE__ */ jsx(ContextMenuGroup, {})).type || child.type?.name === ContextMenuGroup.componentType || child.type === ContextMenuGroup.type;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileContextMenu/MobileContextMenu.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable func-names */\n/* eslint-disable max-lines */\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-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 = null,\n onApply = noop,\n selecteds: initSelecteds,\n }) => {\n const [selectedItems, setSelectedItems] = useState([]);\n const trueSelected = useMemo(\n () => (initSelecteds !== undefined ? initSelecteds : [...selectedItems]),\n [initSelecteds, selectedItems],\n );\n const containerRef = useRef(null);\n const handleChange = (value, childProps, event) => {\n onChange(value, childProps, event);\n if (initSelecteds === undefined) {\n if (multiple) setSelectedItems([...value]);\n else if (singleSelect) setSelectedItems(value);\n }\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n if (buttonFooter) rows.push('56px');\n\n if (!open) return null;\n\n return (\n <>\n <DSBackdrop\n type=\"cover\"\n zIndex={backdropZIndex}\n onClick={(e) => {\n // PUI-4481 prevent click on elements below backdrop\n e.stopPropagation();\n onClickOutside(e);\n }}\n />\n <StyledContainer zIndex={zIndex} rows={rows}
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACiGjB,mBACE,KASA,YAVF;AA7FN,OAAOA,UAAS,UAAU,QAAQ,eAAe;AACjD,SAAS,YAAY;AACrB,SAAS,UAAU,iBAAiB;AACpC,SAAS,QAAQ,UAAU,iBAAiB;AAC5C,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,aAAa;AACtB,SAAS,4BAA4B,wBAAwB;AAE7D,MAAM,kBAAkB,OAAO,IAAI;AAAA,gBACnB,CAACC,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,aAC9C,CAACA,WAAUA,OAAM;AAAA,WACnB,CAACA,WAAU,eAAeA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA,UAG7C,CAACA,WAAUA,OAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvC,MAAM,cAAc,OAAO,IAAI;AAAA;AAAA,iBAEd,CAACA,WAAUA,OAAM,MAAM,YAAY;AAAA,WACzC,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,IAClD,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAWD,CAACA,WAAUA,OAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAIvD,MAAM,kBAAkB,OAAO,IAAI;AAAA;AAAA;AAAA,gBAGnB,CAACA,WAAUA,OAAM,MAAM,OAAO,MAAM,KAAK;AAAA;AAGzD,MAAM,QAAQ,CAAC,SAAS,MAAM,QAAQ,IAAI;AAE1C,MAAM,sBAAsB;AAAA,EAC1B,CAAC;AAAA,IACC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,eAAe;AAAA,IACf,WAAW;AAAA,IACX,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,aAAa;AAAA,IACb,eAAe;AAAA,IACf,UAAU;AAAA,IACV,WAAW;AAAA,EACb,MAAM;AACJ,UAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,CAAC,CAAC;AACrD,UAAM,eAAe;AAAA,MACnB,MAAO,kBAAkB,SAAY,gBAAgB,CAAC,GAAG,aAAa;AAAA,MACtE,CAAC,eAAe,aAAa;AAAA,IAC/B;AACA,UAAM,eAAe,OAAO,IAAI;AAChC,UAAM,eAAe,CAAC,OAAO,YAAY,UAAU;AACjD,eAAS,OAAO,YAAY,KAAK;AACjC,UAAI,kBAAkB,QAAW;AAC/B,YAAI;AAAU,2BAAiB,CAAC,GAAG,KAAK,CAAC;AAAA,iBAChC;AAAc,2BAAiB,KAAK;AAAA,MAC/C;AAAA,IACF;AAEA,UAAM,cAAc,SAAU,GAAG;AAC/B,UAAI,KAAK;AAAS,aAAK,QAAQ,CAAC;AAChC,cAAQ,GAAG,aAAa;AAAA,IAC1B;AAEA,UAAM,OAAO,CAAC,MAAM,MAAM,GAAG,CAAC;AAC9B,QAAI;AAAc,WAAK,KAAK,MAAM;AAElC,QAAI,CAAC;AAAM,aAAO;AAElB,WACE,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAQ;AAAA,UACR,SAAS,CAAC,MAAM;AAEd,cAAE,gBAAgB;AAClB,2BAAe,CAAC;AAAA,UAClB;AAAA;AAAA,MACF;AAAA,MACA,qBAAC,mBAAgB,QAAgB,MAAY,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable react/no-array-index-key */\n/* eslint-disable func-names */\n/* eslint-disable max-lines */\nimport React, { useState, useRef, useMemo } from 'react';\nimport { noop } from 'lodash';\nimport { describe, PropTypes } from '@elliemae/ds-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 = null,\n onApply = noop,\n selecteds: initSelecteds,\n }) => {\n const [selectedItems, setSelectedItems] = useState([]);\n const trueSelected = useMemo(\n () => (initSelecteds !== undefined ? initSelecteds : [...selectedItems]),\n [initSelecteds, selectedItems],\n );\n const containerRef = useRef(null);\n const handleChange = (value, childProps, event) => {\n onChange(value, childProps, event);\n if (initSelecteds === undefined) {\n if (multiple) setSelectedItems([...value]);\n else if (singleSelect) setSelectedItems(value);\n }\n };\n\n const handleApply = function (e) {\n if (this.onClick) this.onClick(e);\n onApply(e, selectedItems);\n };\n\n const rows = [theme.space.s, 1];\n if (buttonFooter) rows.push('56px');\n\n if (!open) return null;\n\n return (\n <>\n <DSBackdrop\n type=\"cover\"\n zIndex={backdropZIndex}\n onClick={(e) => {\n // PUI-4481 prevent click on elements below backdrop\n e.stopPropagation();\n onClickOutside(e);\n }}\n />\n <StyledContainer zIndex={zIndex} rows={rows} innerRef={containerRef} data-testid=\"ds-mobile-context-menu\">\n <HeaderContainer justifyContent=\"center\" alignItems=\"center\" pl=\"xs\" pr=\"xs\">\n <StyledTitle alignItems=\"center\" gutter=\"xxs\" cols={Array(isArr(title) ? title.length : 1).fill('auto')}>\n {title}\n </StyledTitle>\n </HeaderContainer>\n <Grid style={{ overflow: 'hidden' }}>\n <Grid style={{ overflow: 'auto' }}>\n <Group activeValue={trueSelected} multiple={multiple} onChange={handleChange}>\n {React.Children.map(children, (child, ii) => {\n const isGroup =\n child.type === (<ContextMenuGroup />).type ||\n child.type?.name === ContextMenuGroup.componentType ||\n child.type === ContextMenuGroup.type;\n const { onClick = noop } = child.props;\n const value = ii;\n let isSelected;\n if (singleSelect) isSelected = trueSelected === value;\n else if (multiple) isSelected = trueSelected.includes(value);\n return React.cloneElement(child, {\n value,\n key: `cm.${ii}`,\n isMulti: multiple,\n singleSelect,\n isSelected,\n onClick: !isGroup ? (e) => onClick(e, child.props) : null,\n selectedItems: isGroup ? trueSelected : null,\n });\n })}\n </Group>\n </Grid>\n </Grid>\n {buttonFooter && (\n <Grid pl=\"xs\" pr=\"xs\" alignItems=\"center\">\n {React.cloneElement(buttonFooter, {\n ...buttonFooter.props,\n containerProps: {\n 'data-testid': `${dataTestid}--btn`,\n },\n buttonType: 'primary',\n size: 'l',\n onClick: handleApply.bind(buttonFooter.props),\n })}\n </Grid>\n )}\n </StyledContainer>\n </>\n );\n },\n);\n\nconst props = {\n /** toggle open the menu */\n open: PropTypes.bool.description('toggle open the menu'),\n /** context menu title */\n title: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.node])),\n ]).description('context menu title'),\n /** change handler for selectable context menu */\n onChange: PropTypes.func.description('change handler for selectable context menu'),\n /** multi select */\n multiple: PropTypes.bool.description('multi select'),\n /** click outside callback handler */\n onClickOutside: PropTypes.func.description('click outside callback handler'),\n /** array of mobile context menu items */\n children: PropTypes.arrayOf(PropTypes.element).description('array of mobile context menu items'),\n /** z index for overlay div */\n backdropZIndex: PropTypes.number.description('z index for overlay div'),\n /** z index for menu container */\n zIndex: PropTypes.number.description('z index for menu container'),\n /** for e2e tests */\n dataTestid: PropTypes.string.description('for e2e tests'),\n /** bottom button */\n buttonFooter: PropTypes.element.description('bottom button'),\n /** callback */\n onApply: PropTypes.func.description('callback'),\n /** selected elements for multi and single select */\n selecteds: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.number,\n ]).description('selected elements for multi and single select'),\n};\n\nDSMobileContextMenu.propTypes = props;\nDSMobileContextMenu.displayName = 'DSMobileContextMenu';\nconst DSMobileContextMenuWithSchema = describe(DSMobileContextMenu);\n\nDSMobileContextMenuWithSchema.propTypes = props;\n\nexport { DSMobileContextMenu, DSMobileContextMenuWithSchema };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "props"]
|
|
7
7
|
}
|
|
@@ -41,7 +41,7 @@ const StyledInput = styled.input`
|
|
|
41
41
|
display: none;
|
|
42
42
|
}
|
|
43
43
|
`;
|
|
44
|
-
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ jsx(StyledInput, {
|
|
44
|
+
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ jsx(StyledInput, { innerRef, ...props });
|
|
45
45
|
export {
|
|
46
46
|
Input
|
|
47
47
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileDatePicker/Input.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled, focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC4C0B;AA3CjD,SAAS,QAAQ,OAAO,gCAAgC;AAExD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,UAAU,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled, focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='date']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='date']&:active,\n input[type='date']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='date']&::-webkit-datetime-edit,\n input[type='date']&::-webkit-inner-spin-button,\n input[type='date']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4C0B;AA3CjD,SAAS,QAAQ,OAAO,gCAAgC;AAExD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,UAAU,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileDropdownMenu/MobileDropdownMenu.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSMobileContextMenu, DSMobileContextMenuItem } from '../MobileContextMenu/index.js';\nimport { DSMobileDropdownTriggerInput } from './MobileDropdownInput.js';\ninterface OptionT {\n label: string;\n value: string;\n}\ninterface DSMobileDropdownMenuPropsT {\n placeholder: string;\n value: string;\n options: OptionT[];\n title: string;\n itemsProps: {\n label?: string;\n leftProp?: JSX.Element;\n isGroup?: boolean;\n isMulti?: boolean;\n singleSelect?: boolean;\n isItemSelected?: (opt: OptionT) => boolean;\n onClick?: (opt: OptionT, e: any) => void;\n };\n}\nconst DSMobileDropdownMenu = ({\n placeholder,\n options = [],\n title,\n value,\n itemsProps = {\n label: undefined,\n leftProp: undefined,\n isGroup: false,\n isMulti: false,\n singleSelect: false,\n isItemSelected: () => false,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick: () => {},\n },\n}: DSMobileDropdownMenuPropsT): JSX.Element => {\n const [menuOpen, setMenuOpen] = useState(false);\n const inputRef = useRef(null);\n const inputProps = React.useMemo(\n () => ({\n readOnly: true,\n value,\n onClick: () => setMenuOpen(true),\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC8DnB,mBACE,KADF;AA7DJ,OAAOA,UAAS,QAAQ,gBAAgB;AACxC,SAAS,WAAW,gBAAgB;AACpC,SAAS,qBAAqB,+BAA+B;AAC7D,SAAS,oCAAoC;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,OAAO,IAAI;AAC5B,QAAM,aAAaA,OAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { useRef, useState } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSMobileContextMenu, DSMobileContextMenuItem } from '../MobileContextMenu/index.js';\nimport { DSMobileDropdownTriggerInput } from './MobileDropdownInput.js';\ninterface OptionT {\n label: string;\n value: string;\n}\ninterface DSMobileDropdownMenuPropsT {\n placeholder: string;\n value: string;\n options: OptionT[];\n title: string;\n itemsProps: {\n label?: string;\n leftProp?: JSX.Element;\n isGroup?: boolean;\n isMulti?: boolean;\n singleSelect?: boolean;\n isItemSelected?: (opt: OptionT) => boolean;\n onClick?: (opt: OptionT, e: any) => void;\n };\n}\nconst DSMobileDropdownMenu = ({\n placeholder,\n options = [],\n title,\n value,\n itemsProps = {\n label: undefined,\n leftProp: undefined,\n isGroup: false,\n isMulti: false,\n singleSelect: false,\n isItemSelected: () => false,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n onClick: () => {},\n },\n}: DSMobileDropdownMenuPropsT): JSX.Element => {\n const [menuOpen, setMenuOpen] = useState(false);\n const inputRef = useRef(null);\n const inputProps = React.useMemo(\n () => ({\n readOnly: true,\n value,\n onClick: () => setMenuOpen(true),\n innerRef: inputRef,\n placeholder,\n }),\n [value, placeholder],\n );\n const caretProps = React.useMemo(\n () => ({\n onClick: () => {\n inputRef.current.focus();\n setMenuOpen(true);\n },\n }),\n [],\n );\n return (\n <>\n <DSMobileDropdownTriggerInput inputProps={inputProps} caretProps={caretProps} />\n {menuOpen ? (\n <DSMobileContextMenu\n title={title}\n open\n onChange={(_, e) => {\n setMenuOpen(false);\n }}\n onClickOutside={() => setMenuOpen(false)}\n >\n {options.map((opt, i) => (\n <DSMobileContextMenuItem\n key={'ddwn'.concat(`${i}`)}\n title={opt.label}\n value={opt.value}\n isSelected={itemsProps.isItemSelected(opt)}\n onClick={(e) => {\n setMenuOpen(false);\n itemsProps.onClick(opt, e);\n }}\n label={itemsProps.label}\n leftProp={itemsProps.leftProp}\n isGroup={itemsProps.isGroup}\n isMulti={itemsProps.isMulti}\n singleSelect={itemsProps.singleSelect}\n />\n ))}\n </DSMobileContextMenu>\n ) : null}\n </>\n );\n};\n\nconst props = {\n /** dropdown menu placeholder */\n placeholder: PropTypes.string.description('dropdown menu placeholder'),\n /** context menu menu title */\n title: PropTypes.string.description('context menu menu title'),\n /** context menu options / items */\n options: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string, label: PropTypes.string })).description(\n 'context menu options / items',\n ),\n};\n\nDSMobileDropdownMenu.propTypes = props;\nDSMobileDropdownMenu.displayName = 'DSMobileDropdownMenu';\nconst DSMobileDropdownMenuWithSchema = describe(DSMobileDropdownMenu);\nDSMobileDropdownMenuWithSchema.propTypes = props;\n\nexport { DSMobileDropdownMenu, DSMobileDropdownMenuWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC8DnB,mBACE,KADF;AA7DJ,OAAOA,UAAS,QAAQ,gBAAgB;AACxC,SAAS,WAAW,gBAAgB;AACpC,SAAS,qBAAqB,+BAA+B;AAC7D,SAAS,oCAAoC;AAoB7C,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,UAAU,CAAC;AAAA,EACX;AAAA,EACA;AAAA,EACA,aAAa;AAAA,IACX,OAAO;AAAA,IACP,UAAU;AAAA,IACV,SAAS;AAAA,IACT,SAAS;AAAA,IACT,cAAc;AAAA,IACd,gBAAgB,MAAM;AAAA;AAAA,IAEtB,SAAS,MAAM;AAAA,IAAC;AAAA,EAClB;AACF,MAA+C;AAC7C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,OAAO,IAAI;AAC5B,QAAM,aAAaA,OAAM;AAAA,IACvB,OAAO;AAAA,MACL,UAAU;AAAA,MACV;AAAA,MACA,SAAS,MAAM,YAAY,IAAI;AAAA,MAC/B,UAAU;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,OAAO,WAAW;AAAA,EACrB;AACA,QAAM,aAAaA,OAAM;AAAA,IACvB,OAAO;AAAA,MACL,SAAS,MAAM;AACb,iBAAS,QAAQ,MAAM;AACvB,oBAAY,IAAI;AAAA,MAClB;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EACH;AACA,SACE,iCACE;AAAA,wBAAC,gCAA6B,YAAwB,YAAwB;AAAA,IAC7E,WACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAI;AAAA,QACJ,UAAU,CAAC,GAAG,MAAM;AAClB,sBAAY,KAAK;AAAA,QACnB;AAAA,QACA,gBAAgB,MAAM,YAAY,KAAK;AAAA,QAEtC,kBAAQ,IAAI,CAAC,KAAK,MACjB;AAAA,UAAC;AAAA;AAAA,YAEC,OAAO,IAAI;AAAA,YACX,OAAO,IAAI;AAAA,YACX,YAAY,WAAW,eAAe,GAAG;AAAA,YACzC,SAAS,CAAC,MAAM;AACd,0BAAY,KAAK;AACjB,yBAAW,QAAQ,KAAK,CAAC;AAAA,YAC3B;AAAA,YACA,OAAO,WAAW;AAAA,YAClB,UAAU,WAAW;AAAA,YACrB,SAAS,WAAW;AAAA,YACpB,SAAS,WAAW;AAAA,YACpB,cAAc,WAAW;AAAA;AAAA,UAZpB,OAAO,OAAO,GAAG,GAAG;AAAA,QAa3B,CACD;AAAA;AAAA,IACH,IACE;AAAA,KACN;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA,EAEZ,aAAa,UAAU,OAAO,YAAY,2BAA2B;AAAA;AAAA,EAErE,OAAO,UAAU,OAAO,YAAY,yBAAyB;AAAA;AAAA,EAE7D,SAAS,UAAU,QAAQ,UAAU,MAAM,EAAE,OAAO,UAAU,QAAQ,OAAO,UAAU,OAAO,CAAC,CAAC,EAAE;AAAA,IAChG;AAAA,EACF;AACF;AAEA,qBAAqB,YAAY;AACjC,qBAAqB,cAAc;AACnC,MAAM,iCAAiC,SAAS,oBAAoB;AACpE,+BAA+B,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -41,7 +41,7 @@ const StyledInput = styled.input`
|
|
|
41
41
|
display: none;
|
|
42
42
|
}
|
|
43
43
|
`;
|
|
44
|
-
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ jsx(StyledInput, {
|
|
44
|
+
const Input = ({ innerRef, ...props }) => /* @__PURE__ */ jsx(StyledInput, { innerRef, ...props });
|
|
45
45
|
export {
|
|
46
46
|
Input
|
|
47
47
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileTimePicker/Input.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC4C0B;AA3CjD,SAAS,OAAO,0BAA0B,cAAc;AAExD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,UAAU,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n input[type='time']& {\n -webkit-appearance: none;\n -moz-appearance: none;\n -webkit-tap-highlight-color: transparent;\n appearance: none;\n color: transparent;\n\n white-space: nowrap;\n position: relative;\n height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n width: 100%;\n max-width: calc(100% - 32px);\n outline: none;\n box-sizing: border-box;\n display: flex;\n background: ${(props) => props.theme.colors.neutral['000']};\n padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n z-index: 1;\n border-radius: 2px;\n border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n }\n\n input[type='time']&:active,\n input[type='time']&:focus {\n ${(props) => focus(props.theme.colors.brand[700])}\n }\n\n &:before {\n color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n }\n\n input[type='time']&::-webkit-datetime-edit,\n input[type='time']&::-webkit-inner-spin-button,\n input[type='time']&::-webkit-clear-button {\n -webkit-appearance: none;\n display: none;\n }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput innerRef={innerRef} {...props} />;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4C0B;AA3CjD,SAAS,OAAO,0BAA0B,cAAc;AAExD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,UAAU,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,UAAqB,GAAG,OAAO;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,7 +18,7 @@ const SwipeToRefresh = ({ children, loading, onRefresh }) => {
|
|
|
18
18
|
onTouchEnd: swipe.touchEnd,
|
|
19
19
|
onTouchCancel: swipe.touchCancel,
|
|
20
20
|
onTouchMove: swipe.touchMove,
|
|
21
|
-
|
|
21
|
+
innerRef: swipe.ref,
|
|
22
22
|
children: [
|
|
23
23
|
/* @__PURE__ */ jsx(
|
|
24
24
|
LoaderBox,
|
|
@@ -38,7 +38,7 @@ const SwipeToRefresh = ({ children, loading, onRefresh }) => {
|
|
|
38
38
|
)
|
|
39
39
|
}
|
|
40
40
|
),
|
|
41
|
-
/* @__PURE__ */ jsx("div", {
|
|
41
|
+
/* @__PURE__ */ jsx("div", { innerRef: swipe.target, style: { height: 1 } }),
|
|
42
42
|
children
|
|
43
43
|
]
|
|
44
44
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/SwipeToRefresh/SwipeToRefresh.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { useTheme } from '@elliemae/ds-system';\nimport { useSwipe } from './useSwipe.js';\nimport { SwipeContainer, SwipeDrag, LoaderBox, PositionLoader } from './styled.js';\nimport { ProgressIndicator } from './ProgressIndicator.js';\n\nconst SwipeToRefresh = ({ children, loading, onRefresh }) => {\n const breakpoint = 60;\n const theme = useTheme();\n const swipe = useSwipe({ onRefresh, breakpoint });\n const progress = swipe.height > breakpoint ? 100 : (swipe.height * 100) / breakpoint;\n return (\n <SwipeContainer>\n <SwipeDrag\n onTouchStart={swipe.touchStart}\n onTouchEnd={swipe.touchEnd}\n onTouchCancel={swipe.touchCancel}\n onTouchMove={swipe.touchMove}\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACejB,SAkBiB,KAlBjB;AAdN,SAAS,WAAW,gBAAgB;AACpC,SAAS,mCAAmC;AAC5C,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,SAAS,gBAAgB,WAAW,WAAW,sBAAsB;AACrE,SAAS,yBAAyB;AAElC,MAAM,iBAAiB,CAAC,EAAE,UAAU,SAAS,UAAU,MAAM;AAC3D,QAAM,aAAa;AACnB,QAAM,QAAQ,SAAS;AACvB,QAAM,QAAQ,SAAS,EAAE,WAAW,WAAW,CAAC;AAChD,QAAM,WAAW,MAAM,SAAS,aAAa,MAAO,MAAM,SAAS,MAAO;AAC1E,SACE,oBAAC,kBACC;AAAA,IAAC;AAAA;AAAA,MACC,cAAc,MAAM;AAAA,MACpB,YAAY,MAAM;AAAA,MAClB,eAAe,MAAM;AAAA,MACrB,aAAa,MAAM;AAAA,MACnB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\nimport { useTheme } from '@elliemae/ds-system';\nimport { useSwipe } from './useSwipe.js';\nimport { SwipeContainer, SwipeDrag, LoaderBox, PositionLoader } from './styled.js';\nimport { ProgressIndicator } from './ProgressIndicator.js';\n\nconst SwipeToRefresh = ({ children, loading, onRefresh }) => {\n const breakpoint = 60;\n const theme = useTheme();\n const swipe = useSwipe({ onRefresh, breakpoint });\n const progress = swipe.height > breakpoint ? 100 : (swipe.height * 100) / breakpoint;\n return (\n <SwipeContainer>\n <SwipeDrag\n onTouchStart={swipe.touchStart}\n onTouchEnd={swipe.touchEnd}\n onTouchCancel={swipe.touchCancel}\n onTouchMove={swipe.touchMove}\n innerRef={swipe.ref}\n >\n <LoaderBox\n height={loading ? theme.space.m : `${swipe.height}px`}\n alignItems=\"flex-start\"\n data-testid=\"loader-box\"\n >\n <PositionLoader\n height={theme.space.m}\n justifyContent=\"center\"\n alignItems=\"center\"\n mt={swipe.height > 40 || loading ? 0 : `${swipe.height - 40}px`}\n >\n {loading ? <DSCircularProgressIndicator /> : <ProgressIndicator progress={progress} />}\n </PositionLoader>\n </LoaderBox>\n <div innerRef={swipe.target} style={{ height: 1 }} />\n {children}\n </SwipeDrag>\n </SwipeContainer>\n );\n};\n\nconst props = {\n /** component inside swipe to refresh container */\n children: PropTypes.element.isRequired.description('component inside swipe to refresh container'),\n /** toggle loading state for swipe */\n loading: PropTypes.bool.description('toggle loading state for swipe'),\n /** callback on refresh swipe */\n onRefresh: PropTypes.func.description('callback on refresh swipe'),\n};\n\nSwipeToRefresh.propTypes = props;\nSwipeToRefresh.displayName = 'SwipeToRefresh';\nconst SwipeToRefreshWithSchema = describe(SwipeToRefresh);\n\nSwipeToRefreshWithSchema.propTypes = props;\n\nexport { SwipeToRefresh, SwipeToRefreshWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACejB,SAkBiB,KAlBjB;AAdN,SAAS,WAAW,gBAAgB;AACpC,SAAS,mCAAmC;AAC5C,SAAS,gBAAgB;AACzB,SAAS,gBAAgB;AACzB,SAAS,gBAAgB,WAAW,WAAW,sBAAsB;AACrE,SAAS,yBAAyB;AAElC,MAAM,iBAAiB,CAAC,EAAE,UAAU,SAAS,UAAU,MAAM;AAC3D,QAAM,aAAa;AACnB,QAAM,QAAQ,SAAS;AACvB,QAAM,QAAQ,SAAS,EAAE,WAAW,WAAW,CAAC;AAChD,QAAM,WAAW,MAAM,SAAS,aAAa,MAAO,MAAM,SAAS,MAAO;AAC1E,SACE,oBAAC,kBACC;AAAA,IAAC;AAAA;AAAA,MACC,cAAc,MAAM;AAAA,MACpB,YAAY,MAAM;AAAA,MAClB,eAAe,MAAM;AAAA,MACrB,aAAa,MAAM;AAAA,MACnB,UAAU,MAAM;AAAA,MAEhB;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,QAAQ,UAAU,MAAM,MAAM,IAAI,GAAG,MAAM;AAAA,YAC3C,YAAW;AAAA,YACX,eAAY;AAAA,YAEZ;AAAA,cAAC;AAAA;AAAA,gBACC,QAAQ,MAAM,MAAM;AAAA,gBACpB,gBAAe;AAAA,gBACf,YAAW;AAAA,gBACX,IAAI,MAAM,SAAS,MAAM,UAAU,IAAI,GAAG,MAAM,SAAS;AAAA,gBAExD,oBAAU,oBAAC,+BAA4B,IAAK,oBAAC,qBAAkB,UAAoB;AAAA;AAAA,YACtF;AAAA;AAAA,QACF;AAAA,QACA,oBAAC,SAAI,UAAU,MAAM,QAAQ,OAAO,EAAE,QAAQ,EAAE,GAAG;AAAA,QAClD;AAAA;AAAA;AAAA,EACH,GACF;AAEJ;AAEA,MAAM,QAAQ;AAAA;AAAA,EAEZ,UAAU,UAAU,QAAQ,WAAW,YAAY,6CAA6C;AAAA;AAAA,EAEhG,SAAS,UAAU,KAAK,YAAY,gCAAgC;AAAA;AAAA,EAEpE,WAAW,UAAU,KAAK,YAAY,2BAA2B;AACnE;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc;AAExD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -93,6 +93,7 @@ export declare const mobileAccordionItemPropTypes: {
|
|
|
93
93
|
'on-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
94
94
|
'data-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
95
95
|
'all HTML attributes': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
96
|
+
innerRef: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
96
97
|
about: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
97
98
|
accept: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
98
99
|
acceptCharset: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
@@ -546,6 +547,7 @@ export declare const mobileAccordionPropTypes: {
|
|
|
546
547
|
'on-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
547
548
|
'data-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
548
549
|
'all HTML attributes': import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
550
|
+
innerRef: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
549
551
|
about: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
550
552
|
accept: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
551
553
|
acceptCharset: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").ReactDescT;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare const Container: import("styled-components").StyledComponent<"header", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
-
export declare const SearchWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const Icon: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const Label: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
5
|
-
export declare const RightSection: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
6
|
-
export declare const MainSection: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
1
|
+
export declare const Container: import("styled-components").StyledComponent<"header", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"header">, never>;
|
|
2
|
+
export declare const SearchWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
3
|
+
export declare const Icon: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
4
|
+
export declare const Label: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
5
|
+
export declare const RightSection: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
6
|
+
export declare const MainSection: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const LoaderBox: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
1
|
+
export declare const LoaderBox: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -99,6 +99,7 @@ declare const DSMobileBanner: {
|
|
|
99
99
|
'on-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
100
100
|
'data-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
101
101
|
'all HTML attributes': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
102
|
+
innerRef: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
102
103
|
about: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
103
104
|
accept: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
104
105
|
acceptCharset: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
@@ -134,6 +134,7 @@ export declare const propTypes: {
|
|
|
134
134
|
'on-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
135
135
|
'data-*': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
136
136
|
'all HTML attributes': import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
137
|
+
innerRef: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
137
138
|
about: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
138
139
|
accept: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
139
140
|
acceptCharset: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").ReactDescT;
|
|
@@ -7,24 +7,18 @@ interface StyledBannerContainerT {
|
|
|
7
7
|
isAnimating: boolean;
|
|
8
8
|
height: number;
|
|
9
9
|
}
|
|
10
|
-
interface StyledInnerContainerT {
|
|
11
|
-
type: MobileBannerTypesT;
|
|
12
|
-
isOpen: boolean;
|
|
13
|
-
isAnimating: boolean;
|
|
14
|
-
ref: React.MutableRefObject<HTMLDivElement>;
|
|
15
|
-
}
|
|
16
10
|
interface StyledContentT {
|
|
17
11
|
showCloseButton: boolean;
|
|
18
12
|
}
|
|
19
|
-
export declare const StyledInnerContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme,
|
|
20
|
-
export declare const StyledTextContent: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
21
|
-
export declare const StyledTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
22
|
-
export declare const StyledSubTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
23
|
-
export declare const StyledIconContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
24
|
-
export declare const StyledContent: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, StyledContentT & import("@elliemae/ds-system").OwnerInterface
|
|
25
|
-
export declare const StyledCloseButtonContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
26
|
-
export declare const StyledSubTitleText: import("styled-components").StyledComponent<"span", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
27
|
-
export declare const StyledCloseButton: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-button-v2").DSButtonT.Props>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
28
|
-
export declare const StyledActionLink: import("styled-components").StyledComponent<"a", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
29
|
-
export declare const StyledBannerContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, StyledBannerContainerT & import("@elliemae/ds-system").OwnerInterface
|
|
13
|
+
export declare const StyledInnerContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, never, never>;
|
|
14
|
+
export declare const StyledTextContent: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
15
|
+
export declare const StyledTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
16
|
+
export declare const StyledSubTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
17
|
+
export declare const StyledIconContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
18
|
+
export declare const StyledContent: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, StyledContentT & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
19
|
+
export declare const StyledCloseButtonContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
20
|
+
export declare const StyledSubTitleText: import("styled-components").StyledComponent<"span", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"span">, never>;
|
|
21
|
+
export declare const StyledCloseButton: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-button-v2").DSButtonT.Props>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ComponentType<import("@elliemae/ds-button-v2").DSButtonT.Props>>, never>;
|
|
22
|
+
export declare const StyledActionLink: import("styled-components").StyledComponent<"a", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"a">, never>;
|
|
23
|
+
export declare const StyledBannerContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, StyledBannerContainerT & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
30
24
|
export {};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const StyledCard: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, {
|
|
2
2
|
minHeight: string;
|
|
3
|
-
} & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
+
} & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
|
-
export declare const MobileDropdownInput: import("styled-components").StyledComponent<"input", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const MobileDropdownInputWrap: import("styled-components").StyledComponent<"span", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
+
export declare const MobileDropdownInput: import("styled-components").StyledComponent<"input", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"input">, never>;
|
|
4
|
+
export declare const MobileDropdownInputWrap: import("styled-components").StyledComponent<"span", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"span">, never>;
|
|
5
5
|
export declare const Caret: {
|
|
6
6
|
({ onClick }: {
|
|
7
7
|
onClick: any;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const StyledContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const StyledTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
+
export declare const StyledContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
3
|
+
export declare const StyledTitle: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
export declare const StyledContainer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const HeaderContainer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const Footer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
+
export declare const StyledContainer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>>, never>;
|
|
3
|
+
export declare const HeaderContainer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>>, never>;
|
|
4
|
+
export declare const Footer: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<React.ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & React.RefAttributes<HTMLDivElement>>>, never>;
|
|
5
5
|
export declare const ListContainer: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, {
|
|
6
6
|
[x: string]: any;
|
|
7
7
|
[x: number]: any;
|
|
8
8
|
[x: symbol]: any;
|
|
9
9
|
} & {
|
|
10
10
|
theme?: import("styled-components").DefaultTheme | undefined;
|
|
11
|
-
} & import("@elliemae/ds-system").OwnerInterface
|
|
11
|
+
} & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
12
12
|
export declare const checkbox: import("react/jsx-runtime.js").JSX.Element;
|
|
13
13
|
export declare const checked: import("react/jsx-runtime.js").JSX.Element;
|
|
14
14
|
export declare const selectedMark: import("react/jsx-runtime.js").JSX.Element;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const BodyFix: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;
|
|
3
|
-
export declare const ModalBox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const ModalPosition: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
5
|
-
export declare const BackShadow: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
6
|
-
export declare const ModalIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
7
|
-
export declare const ModalTitle: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
8
|
-
export declare const ModalDescription: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
+
export declare const ModalBox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
4
|
+
export declare const ModalPosition: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
5
|
+
export declare const BackShadow: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
6
|
+
export declare const ModalIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
7
|
+
export declare const ModalTitle: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
8
|
+
export declare const ModalDescription: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare const Header: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
-
export declare const Toolbar: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const BodyWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const Section: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
1
|
+
export declare const Header: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
2
|
+
export declare const Toolbar: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
3
|
+
export declare const BodyWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
4
|
+
export declare const Section: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export declare const Container: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
-
export declare const MenuWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const Menu: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const Heading: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
5
|
-
export declare const Icon: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
6
|
-
export declare const Hr: import("styled-components").StyledComponent<"hr", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
7
|
-
export declare const MenuList: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
8
|
-
export declare const BottomMenu: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
1
|
+
export declare const Container: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
2
|
+
export declare const MenuWrapper: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
3
|
+
export declare const Menu: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
4
|
+
export declare const Heading: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
5
|
+
export declare const Icon: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
6
|
+
export declare const Hr: import("styled-components").StyledComponent<"hr", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"hr">, never>;
|
|
7
|
+
export declare const MenuList: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
8
|
+
export declare const BottomMenu: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const SwipeContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
3
|
-
export declare const SwipeDrag: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
4
|
-
export declare const LoaderBox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
5
|
-
export declare const PositionLoader: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface
|
|
2
|
+
export declare const SwipeContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
3
|
+
export declare const SwipeDrag: import("styled-components").StyledComponent<"div", import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"div">, never>;
|
|
4
|
+
export declare const LoaderBox: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
|
5
|
+
export declare const PositionLoader: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-mobile",
|
|
3
|
-
"version": "3.25.0-next.
|
|
3
|
+
"version": "3.25.0-next.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - System",
|
|
6
6
|
"files": [
|
|
@@ -439,30 +439,30 @@
|
|
|
439
439
|
"prop-types": "~15.8.1",
|
|
440
440
|
"react-window": "~1.8.8",
|
|
441
441
|
"react-window-infinite-loader": "~1.0.8",
|
|
442
|
-
"@elliemae/ds-accordion": "3.25.0-next.
|
|
443
|
-
"@elliemae/ds-
|
|
444
|
-
"@elliemae/ds-
|
|
445
|
-
"@elliemae/ds-button": "3.25.0-next.
|
|
446
|
-
"@elliemae/ds-
|
|
447
|
-
"@elliemae/ds-form": "3.25.0-next.
|
|
448
|
-
"@elliemae/ds-
|
|
449
|
-
"@elliemae/ds-
|
|
450
|
-
"@elliemae/ds-
|
|
451
|
-
"@elliemae/ds-
|
|
452
|
-
"@elliemae/ds-
|
|
453
|
-
"@elliemae/ds-
|
|
454
|
-
"@elliemae/ds-shared": "3.25.0-next.
|
|
455
|
-
"@elliemae/ds-system": "3.25.0-next.
|
|
456
|
-
"@elliemae/ds-
|
|
457
|
-
"@elliemae/ds-
|
|
458
|
-
"@elliemae/ds-utilities": "3.25.0-next.
|
|
442
|
+
"@elliemae/ds-accordion": "3.25.0-next.2",
|
|
443
|
+
"@elliemae/ds-button": "3.25.0-next.2",
|
|
444
|
+
"@elliemae/ds-backdrop": "3.25.0-next.2",
|
|
445
|
+
"@elliemae/ds-button-v2": "3.25.0-next.2",
|
|
446
|
+
"@elliemae/ds-form": "3.25.0-next.2",
|
|
447
|
+
"@elliemae/ds-form-checkbox": "3.25.0-next.2",
|
|
448
|
+
"@elliemae/ds-grid": "3.25.0-next.2",
|
|
449
|
+
"@elliemae/ds-circular-progress-indicator": "3.25.0-next.2",
|
|
450
|
+
"@elliemae/ds-icon": "3.25.0-next.2",
|
|
451
|
+
"@elliemae/ds-icons": "3.25.0-next.2",
|
|
452
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.25.0-next.2",
|
|
453
|
+
"@elliemae/ds-props-helpers": "3.25.0-next.2",
|
|
454
|
+
"@elliemae/ds-shared": "3.25.0-next.2",
|
|
455
|
+
"@elliemae/ds-system": "3.25.0-next.2",
|
|
456
|
+
"@elliemae/ds-truncated-expandable-text": "3.25.0-next.2",
|
|
457
|
+
"@elliemae/ds-tabs": "3.25.0-next.2",
|
|
458
|
+
"@elliemae/ds-utilities": "3.25.0-next.2"
|
|
459
459
|
},
|
|
460
460
|
"devDependencies": {
|
|
461
461
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
462
462
|
"@elliemae/pui-theme": "~2.7.0",
|
|
463
463
|
"styled-components": "~5.3.9",
|
|
464
464
|
"styled-system": "~5.1.5",
|
|
465
|
-
"@elliemae/ds-monorepo-devops": "3.25.0-next.
|
|
465
|
+
"@elliemae/ds-monorepo-devops": "3.25.0-next.2"
|
|
466
466
|
},
|
|
467
467
|
"peerDependencies": {
|
|
468
468
|
"@elliemae/pui-theme": "^2.6.0",
|