@elliemae/ds-mobile 3.16.0-next.2 → 3.16.0-next.21

package/dist/cjs/MobileBanner/MobileBanner.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/MobileBanner/MobileBanner.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useLayoutEffect, useEffect, useRef, useState } from 'react';\nimport { CloseX } from '@elliemae/ds-icons';\nimport { describe } from '@elliemae/ds-utilities';\nimport { icons } from './utils/icons';\nimport { DSMobileBannerT, propTypes } from './propTypes';\nimport {\n  StyledActionLink,\n  StyledCloseButton,\n  StyledInnerContainer,\n  StyledBannerContainer,\n  StyledContent,\n  StyledIconContainer,\n  StyledSubTitle,\n  StyledTitle,\n  StyledSubTitleText,\n  StyledCloseButtonContainer,\n} from './styles';\nimport { useDSMobileBanner } from './config/useMobileBanner';\nimport { DSMobileBannerName } from './DSMobileBannerDefinitions';\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} ref={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"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2Ef;AA3ER,mBAAoE;AACpE,sBAAuB;AACvB,0BAAyB;AACzB,mBAAsB;AACtB,uBAA2C;AAC3C,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,KAAK,mBAAmB,aACxE;AAAA,oDAAC,qCAAoB,eAAY,yBAAyB,6BAAM,OAAM;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,8BAAS,cAAc;AACxD,yBAAyB,YAAY;",
+  "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} ref={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"],
+  "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,KAAK,mBAAmB,aACxE;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;",
   "names": []
 }

package/dist/cjs/MobileBanner/config/useMobileBanner.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -29,14 +33,14 @@ __export(useMobileBanner_exports, {
 module.exports = __toCommonJS(useMobileBanner_exports);
 var React = __toESM(require("react"));
 var import_react = __toESM(require("react"));
-var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_propTypes = require("../propTypes");
-var import_DSMobileBannerDefinitions = require("../DSMobileBannerDefinitions");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_propTypes = require("../propTypes.js");
+var import_DSMobileBannerDefinitions = require("../DSMobileBannerDefinitions.js");
 const useDSMobileBanner = (props) => {
-  (0, import_ds_utilities.useValidateTypescriptPropTypes)(props, import_propTypes.propTypes, import_DSMobileBannerDefinitions.DSMobileBannerName);
-  const propsWithDefault = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_propTypes.defaultProps);
-  const globalAttributes = (0, import_ds_utilities.useGetGlobalAttributes)(propsWithDefault);
-  const xstyledProps = (0, import_ds_utilities.useGetXstyledProps)(propsWithDefault);
+  (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, import_propTypes.propTypes, import_DSMobileBannerDefinitions.DSMobileBannerName);
+  const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_propTypes.defaultProps);
+  const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
+  const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
   return import_react.default.useMemo(
     () => ({ globalAttributes, xstyledProps, propsWithDefault }),
     [globalAttributes, xstyledProps, propsWithDefault]

package/dist/cjs/MobileBanner/config/useMobileBanner.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/MobileBanner/config/useMobileBanner.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport {\n  useGetGlobalAttributes,\n  useGetXstyledProps,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n  GlobalAttributesT,\n  XstyledProps,\n} from '@elliemae/ds-utilities';\n\nimport { propTypes, defaultProps, type DSMobileBannerT } from '../propTypes';\nimport { DSMobileBannerName } from '../DSMobileBannerDefinitions';\n\ninterface UseMobileBannerT {\n  propsWithDefault: DSMobileBannerT.InternalProps;\n  globalAttributes: GlobalAttributesT;\n  xstyledProps: XstyledProps;\n}\n\nexport const useDSMobileBanner = (props: DSMobileBannerT.Props): UseMobileBannerT => {\n  useValidateTypescriptPropTypes(props, propTypes, DSMobileBannerName);\n  const propsWithDefault = useMemoMergePropsWithDefault<MobileBannerPropsT>(props, defaultProps);\n  const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n  const xstyledProps = useGetXstyledProps(propsWithDefault);\n  return React.useMemo(\n    () => ({ globalAttributes, xstyledProps, propsWithDefault }),\n    [globalAttributes, xstyledProps, propsWithDefault],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAOO;AAEP,uBAA8D;AAC9D,uCAAmC;AAQ5B,MAAM,oBAAoB,CAAC,UAAmD;AACnF,0DAA+B,OAAO,4BAAW,mDAAkB;AACnE,QAAM,uBAAmB,kDAAiD,OAAO,6BAAY;AAC7F,QAAM,uBAAmB,4CAAuB,gBAAgB;AAEhE,QAAM,mBAAe,wCAAmB,gBAAgB;AACxD,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO,EAAE,kBAAkB,cAAc,iBAAiB;AAAA,IAC1D,CAAC,kBAAkB,cAAc,gBAAgB;AAAA,EACnD;AACF;",
+  "sourcesContent": ["import React from 'react';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n  useGetGlobalAttributes,\n  useGetXstyledProps,\n  useMemoMergePropsWithDefault,\n  useValidateTypescriptPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { propTypes, defaultProps, type DSMobileBannerT } from '../propTypes.js';\nimport { DSMobileBannerName } from '../DSMobileBannerDefinitions.js';\n\ninterface UseMobileBannerT {\n  propsWithDefault: DSMobileBannerT.InternalProps;\n  globalAttributes: GlobalAttributesT;\n  xstyledProps: XstyledProps;\n}\n\nexport const useDSMobileBanner = (props: DSMobileBannerT.Props): UseMobileBannerT => {\n  useValidateTypescriptPropTypes(props, propTypes, DSMobileBannerName);\n  const propsWithDefault = useMemoMergePropsWithDefault<MobileBannerPropsT>(props, defaultProps);\n  const globalAttributes = useGetGlobalAttributes(propsWithDefault);\n\n  const xstyledProps = useGetXstyledProps(propsWithDefault);\n  return React.useMemo(\n    () => ({ globalAttributes, xstyledProps, propsWithDefault }),\n    [globalAttributes, xstyledProps, propsWithDefault],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,8BAKO;AACP,uBAA8D;AAC9D,uCAAmC;AAQ5B,MAAM,oBAAoB,CAAC,UAAmD;AACnF,8DAA+B,OAAO,4BAAW,mDAAkB;AACnE,QAAM,uBAAmB,sDAAiD,OAAO,6BAAY;AAC7F,QAAM,uBAAmB,gDAAuB,gBAAgB;AAEhE,QAAM,mBAAe,4CAAmB,gBAAgB;AACxD,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO,EAAE,kBAAkB,cAAc,iBAAiB;AAAA,IAC1D,CAAC,kBAAkB,cAAc,gBAAgB;AAAA,EACnD;AACF;",
   "names": ["React"]
 }

package/dist/cjs/MobileBanner/index.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -30,6 +34,6 @@ __export(MobileBanner_exports, {
 });
 module.exports = __toCommonJS(MobileBanner_exports);
 var React = __toESM(require("react"));
-var import_MobileBanner = require("./MobileBanner");
-var import_bannerTypes = require("./utils/bannerTypes");
+var import_MobileBanner = require("./MobileBanner.js");
+var import_bannerTypes = require("./utils/bannerTypes.js");
 //# sourceMappingURL=index.js.map

package/dist/cjs/MobileBanner/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/MobileBanner/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export { DSMobileBanner, DSMobileBannerWithSchema } from './MobileBanner';\nexport { MOBILE_BANNER_TYPES } from './utils/bannerTypes';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAyD;AACzD,yBAAoC;",
+  "sourcesContent": ["export { DSMobileBanner, DSMobileBannerWithSchema } from './MobileBanner.js';\nexport { MOBILE_BANNER_TYPES } from './utils/bannerTypes.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAyD;AACzD,yBAAoC;",
   "names": []
 }

package/dist/cjs/MobileBanner/propTypes.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -29,8 +33,8 @@ __export(propTypes_exports, {
 });
 module.exports = __toCommonJS(propTypes_exports);
 var React = __toESM(require("react"));
-var import_ds_utilities = require("@elliemae/ds-utilities");
-var import_bannerTypes = require("./utils/bannerTypes");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_bannerTypes = require("./utils/bannerTypes.js");
 const defaultProps = {
   type: import_bannerTypes.MOBILE_BANNER_TYPES.SUCCESS,
   isOpen: false,
@@ -45,19 +49,19 @@ const defaultProps = {
   focusOnOpen: false
 };
 const propTypes = {
-  ...import_ds_utilities.globalAttributesPropTypes,
-  ...import_ds_utilities.xstyledPropTypes,
-  type: import_ds_utilities.PropTypes.oneOf(["info", "success", "warning", "error"]).description("Type of banner").defaultValue(defaultProps.type),
-  isOpen: import_ds_utilities.PropTypes.bool.description("Whether the banner is open or not").defaultValue(defaultProps.isOpen),
-  closeButtonOnClick: import_ds_utilities.PropTypes.func.description("OnClick function used in the close button").defaultValue(defaultProps.closeButtonOnClick),
-  actionLinkLabel: import_ds_utilities.PropTypes.string.description("Label used in the the action link").defaultValue(defaultProps.actionLinkLabel),
-  actionLinkHref: import_ds_utilities.PropTypes.string.description("Href used in the the action link").defaultValue(defaultProps.actionLinkLabel),
-  actionLinkOnClick: import_ds_utilities.PropTypes.func.description("OnClick function used in the action link").defaultValue(defaultProps.actionLinkOnClick),
-  label: import_ds_utilities.PropTypes.string.description("Label text for the banner").defaultValue(defaultProps.lavel),
-  body: import_ds_utilities.PropTypes.string.description("Body text for the banner").defaultValue(defaultProps.body),
-  showCloseButton: import_ds_utilities.PropTypes.bool.description("Whether the close button should be visible or not").defaultValue(defaultProps.showCloseButton),
-  containerProps: import_ds_utilities.PropTypes.shape({}).description("Set of properties attached to the banner container").defaultValue(defaultProps.containerProps),
-  focusOnOpen: import_ds_utilities.PropTypes.bool.description(
+  ...import_ds_props_helpers.globalAttributesPropTypes,
+  ...import_ds_props_helpers.xstyledPropTypes,
+  type: import_ds_props_helpers.PropTypes.oneOf(["info", "success", "warning", "error"]).description("Type of banner").defaultValue(defaultProps.type),
+  isOpen: import_ds_props_helpers.PropTypes.bool.description("Whether the banner is open or not").defaultValue(defaultProps.isOpen),
+  closeButtonOnClick: import_ds_props_helpers.PropTypes.func.description("OnClick function used in the close button").defaultValue(defaultProps.closeButtonOnClick),
+  actionLinkLabel: import_ds_props_helpers.PropTypes.string.description("Label used in the the action link").defaultValue(defaultProps.actionLinkLabel),
+  actionLinkHref: import_ds_props_helpers.PropTypes.string.description("Href used in the the action link").defaultValue(defaultProps.actionLinkLabel),
+  actionLinkOnClick: import_ds_props_helpers.PropTypes.func.description("OnClick function used in the action link").defaultValue(defaultProps.actionLinkOnClick),
+  label: import_ds_props_helpers.PropTypes.string.description("Label text for the banner").defaultValue(defaultProps.lavel),
+  body: import_ds_props_helpers.PropTypes.string.description("Body text for the banner").defaultValue(defaultProps.body),
+  showCloseButton: import_ds_props_helpers.PropTypes.bool.description("Whether the close button should be visible or not").defaultValue(defaultProps.showCloseButton),
+  containerProps: import_ds_props_helpers.PropTypes.shape({}).description("Set of properties attached to the banner container").defaultValue(defaultProps.containerProps),
+  focusOnOpen: import_ds_props_helpers.PropTypes.bool.description(
     "Whether the banner should get focus when its openedWhether the banner should get focus when it's opened"
   ).defaultValue(defaultProps.focusOnOpen)
 };

package/dist/cjs/MobileBanner/propTypes.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/MobileBanner/propTypes.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-utilities';\nimport { MOBILE_BANNER_TYPES } from './utils/bannerTypes';\n\ntype MobileBannerTypesT = typeof MOBILE_BANNER_TYPES[keyof typeof MOBILE_BANNER_TYPES];\n\nexport const defaultProps = {\n  type: MOBILE_BANNER_TYPES.SUCCESS,\n  isOpen: false,\n  closeButtonOnClick: () => null,\n  actionLinkLabel: null,\n  actionLinkHref: null,\n  actionLinkOnClick: () => null,\n  label: '',\n  body: '',\n  showCloseButton: true,\n  containerProps: {},\n  focusOnOpen: false,\n};\n\nexport declare namespace DSMobileBannerT {\n  export interface DefaultProps {\n    type: MobileBannerTypesT;\n    isOpen: boolean;\n    closeButtonOnClick: () => void | null;\n    actionLinkLabel: string;\n    actionLinkHref: string;\n    actionLinkOnClick: () => void | null;\n    label: string;\n    body: string;\n    showCloseButton?: boolean;\n    containerProps: Record<string, unknown>;\n    focusOnOpen?: boolean;\n  }\n\n  export interface PropsOptional {}\n\n  export interface PropsRequired {}\n\n  export interface Props extends PropsOptional, PropsRequired, DefaultProps {}\n  export interface InternalProps extends PropsOptional, PropsRequired, Required<DefaultProps> {}\n}\n\nexport const propTypes = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  type: PropTypes.oneOf(['info', 'success', 'warning', 'error']).description('Type of banner').defaultValue(defaultProps.type),\n  isOpen: PropTypes.bool.description('Whether the banner is open or not').defaultValue(defaultProps.isOpen),\n  closeButtonOnClick: PropTypes.func.description('OnClick function used in the close button').defaultValue(defaultProps.closeButtonOnClick),\n  actionLinkLabel: PropTypes.string.description('Label used in the the action link').defaultValue(defaultProps.actionLinkLabel),\n  actionLinkHref: PropTypes.string.description('Href used in the the action link').defaultValue(defaultProps.actionLinkLabel),\n  actionLinkOnClick: PropTypes.func.description('OnClick function used in the action link').defaultValue(defaultProps.actionLinkOnClick),\n  label: PropTypes.string.description('Label text for the banner').defaultValue(defaultProps.lavel),\n  body: PropTypes.string.description('Body text for the banner').defaultValue(defaultProps.body),\n  showCloseButton: PropTypes.bool.description('Whether the close button should be visible or not').defaultValue(defaultProps.showCloseButton),\n  containerProps: PropTypes.shape({}).description('Set of properties attached to the banner container').defaultValue(defaultProps.containerProps),\n  focusOnOpen: PropTypes.bool.description(\n    \"Whether the banner should get focus when its openedWhether the banner should get focus when it's opened\",\n  ).defaultValue(defaultProps.focusOnOpen),\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAAuE;AACvE,yBAAoC;AAI7B,MAAM,eAAe;AAAA,EAC1B,MAAM,uCAAoB;AAAA,EAC1B,QAAQ;AAAA,EACR,oBAAoB,MAAM;AAAA,EAC1B,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,mBAAmB,MAAM;AAAA,EACzB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,gBAAgB,CAAC;AAAA,EACjB,aAAa;AACf;AAyBO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,8BAAU,MAAM,CAAC,QAAQ,WAAW,WAAW,OAAO,CAAC,EAAE,YAAY,gBAAgB,EAAE,aAAa,aAAa,IAAI;AAAA,EAC3H,QAAQ,8BAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,aAAa,MAAM;AAAA,EACxG,oBAAoB,8BAAU,KAAK,YAAY,2CAA2C,EAAE,aAAa,aAAa,kBAAkB;AAAA,EACxI,iBAAiB,8BAAU,OAAO,YAAY,mCAAmC,EAAE,aAAa,aAAa,eAAe;AAAA,EAC5H,gBAAgB,8BAAU,OAAO,YAAY,kCAAkC,EAAE,aAAa,aAAa,eAAe;AAAA,EAC1H,mBAAmB,8BAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,aAAa,iBAAiB;AAAA,EACrI,OAAO,8BAAU,OAAO,YAAY,2BAA2B,EAAE,aAAa,aAAa,KAAK;AAAA,EAChG,MAAM,8BAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,aAAa,IAAI;AAAA,EAC7F,iBAAiB,8BAAU,KAAK,YAAY,mDAAmD,EAAE,aAAa,aAAa,eAAe;AAAA,EAC1I,gBAAgB,8BAAU,MAAM,CAAC,CAAC,EAAE,YAAY,oDAAoD,EAAE,aAAa,aAAa,cAAc;AAAA,EAC9I,aAAa,8BAAU,KAAK;AAAA,IAC1B;AAAA,EACF,EAAE,aAAa,aAAa,WAAW;AACzC;",
+  "sourcesContent": ["import { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { MOBILE_BANNER_TYPES } from './utils/bannerTypes.js';\n\ntype MobileBannerTypesT = (typeof MOBILE_BANNER_TYPES)[keyof typeof MOBILE_BANNER_TYPES];\n\nexport const defaultProps = {\n  type: MOBILE_BANNER_TYPES.SUCCESS,\n  isOpen: false,\n  closeButtonOnClick: () => null,\n  actionLinkLabel: null,\n  actionLinkHref: null,\n  actionLinkOnClick: () => null,\n  label: '',\n  body: '',\n  showCloseButton: true,\n  containerProps: {},\n  focusOnOpen: false,\n};\n\nexport declare namespace DSMobileBannerT {\n  export interface DefaultProps {\n    type: MobileBannerTypesT;\n    isOpen: boolean;\n    closeButtonOnClick: () => void | null;\n    actionLinkLabel: string;\n    actionLinkHref: string;\n    actionLinkOnClick: () => void | null;\n    label: string;\n    body: string;\n    showCloseButton?: boolean;\n    containerProps: Record<string, unknown>;\n    focusOnOpen?: boolean;\n  }\n\n  export interface PropsOptional {}\n\n  export interface PropsRequired {}\n\n  export interface Props extends PropsOptional, PropsRequired, DefaultProps {}\n  export interface InternalProps extends PropsOptional, PropsRequired, Required<DefaultProps> {}\n}\n\nexport const propTypes = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  type: PropTypes.oneOf(['info', 'success', 'warning', 'error'])\n    .description('Type of banner')\n    .defaultValue(defaultProps.type),\n  isOpen: PropTypes.bool.description('Whether the banner is open or not').defaultValue(defaultProps.isOpen),\n  closeButtonOnClick: PropTypes.func\n    .description('OnClick function used in the close button')\n    .defaultValue(defaultProps.closeButtonOnClick),\n  actionLinkLabel: PropTypes.string\n    .description('Label used in the the action link')\n    .defaultValue(defaultProps.actionLinkLabel),\n  actionLinkHref: PropTypes.string\n    .description('Href used in the the action link')\n    .defaultValue(defaultProps.actionLinkLabel),\n  actionLinkOnClick: PropTypes.func\n    .description('OnClick function used in the action link')\n    .defaultValue(defaultProps.actionLinkOnClick),\n  label: PropTypes.string.description('Label text for the banner').defaultValue(defaultProps.lavel),\n  body: PropTypes.string.description('Body text for the banner').defaultValue(defaultProps.body),\n  showCloseButton: PropTypes.bool\n    .description('Whether the close button should be visible or not')\n    .defaultValue(defaultProps.showCloseButton),\n  containerProps: PropTypes.shape({})\n    .description('Set of properties attached to the banner container')\n    .defaultValue(defaultProps.containerProps),\n  focusOnOpen: PropTypes.bool\n    .description(\n      \"Whether the banner should get focus when its openedWhether the banner should get focus when it's opened\",\n    )\n    .defaultValue(defaultProps.focusOnOpen),\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAuE;AACvE,yBAAoC;AAI7B,MAAM,eAAe;AAAA,EAC1B,MAAM,uCAAoB;AAAA,EAC1B,QAAQ;AAAA,EACR,oBAAoB,MAAM;AAAA,EAC1B,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,mBAAmB,MAAM;AAAA,EACzB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,gBAAgB,CAAC;AAAA,EACjB,aAAa;AACf;AAyBO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,kCAAU,MAAM,CAAC,QAAQ,WAAW,WAAW,OAAO,CAAC,EAC1D,YAAY,gBAAgB,EAC5B,aAAa,aAAa,IAAI;AAAA,EACjC,QAAQ,kCAAU,KAAK,YAAY,mCAAmC,EAAE,aAAa,aAAa,MAAM;AAAA,EACxG,oBAAoB,kCAAU,KAC3B,YAAY,2CAA2C,EACvD,aAAa,aAAa,kBAAkB;AAAA,EAC/C,iBAAiB,kCAAU,OACxB,YAAY,mCAAmC,EAC/C,aAAa,aAAa,eAAe;AAAA,EAC5C,gBAAgB,kCAAU,OACvB,YAAY,kCAAkC,EAC9C,aAAa,aAAa,eAAe;AAAA,EAC5C,mBAAmB,kCAAU,KAC1B,YAAY,0CAA0C,EACtD,aAAa,aAAa,iBAAiB;AAAA,EAC9C,OAAO,kCAAU,OAAO,YAAY,2BAA2B,EAAE,aAAa,aAAa,KAAK;AAAA,EAChG,MAAM,kCAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,aAAa,IAAI;AAAA,EAC7F,iBAAiB,kCAAU,KACxB,YAAY,mDAAmD,EAC/D,aAAa,aAAa,eAAe;AAAA,EAC5C,gBAAgB,kCAAU,MAAM,CAAC,CAAC,EAC/B,YAAY,oDAAoD,EAChE,aAAa,aAAa,cAAc;AAAA,EAC3C,aAAa,kCAAU,KACpB;AAAA,IACC;AAAA,EACF,EACC,aAAa,aAAa,WAAW;AAC1C;",
   "names": []
 }

package/dist/cjs/MobileBanner/styles.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -39,9 +43,8 @@ __export(styles_exports, {
 module.exports = __toCommonJS(styles_exports);
 var React = __toESM(require("react"));
 var import_ds_system = require("@elliemae/ds-system");
-var import_ds_system2 = require("@elliemae/ds-system");
 var import_ds_button = require("@elliemae/ds-button");
-var import_styleHelpers = require("./utils/styleHelpers");
+var import_styleHelpers = require("./utils/styleHelpers.js");
 const StyledInnerContainer = import_ds_system.styled.div`
   display: flex;
   min-height: 60px;
@@ -57,7 +60,7 @@ const StyledTextContent = import_ds_system.styled.div`
 `;
 const StyledTitle = import_ds_system.styled.div`
   color: ${({ theme }) => theme.colors.neutral[700]};
-  font-size: ${({ theme }) => (0, import_ds_system2.toMobile)(theme.fontSizes.title[700])};
+  font-size: ${({ theme }) => (0, import_ds_system.toMobile)(theme.fontSizes.title[700])};
   font-weight: ${({ theme }) => theme.fontWeights.semibold};
   margin-bottom: ${({ theme }) => theme.space.xxxs};
   @media not all and (min-resolution: 0.001dpcm) {
@@ -76,7 +79,7 @@ const StyledSubTitle = import_ds_system.styled.div`
   flex-wrap: wrap;
   justify-content: flex-start;
 
-  font-size: ${({ theme }) => (0, import_ds_system2.toMobile)(theme.fontSizes.title[600])};
+  font-size: ${({ theme }) => (0, import_ds_system.toMobile)(theme.fontSizes.title[600])};
   font-weight: ${({ theme }) => theme.fontWeights.regular};
 
   & > * {
@@ -120,7 +123,7 @@ const StyledCloseButton = (0, import_ds_system.styled)(import_ds_button.DSButton
 const StyledActionLink = import_ds_system.styled.a`
   text-decoration: none;
   line-height: 1.1;
-  font-size: ${({ theme }) => (0, import_ds_system2.toMobile)(theme.fontSizes.title[600])};
+  font-size: ${({ theme }) => (0, import_ds_system.toMobile)(theme.fontSizes.title[600])};
   font-weight: ${({ theme }) => theme.fontWeights.regular};
   color: ${({ theme }) => theme.colors.brand[600]};
 `;

package/dist/cjs/MobileBanner/styles.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/MobileBanner/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { toMobile } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { handleAnimation, handleBorderColor } from './utils/styleHelpers';\nimport { MOBILE_BANNER_TYPES } from './utils/bannerTypes';\n\ntype MobileBannerTypesT = typeof MOBILE_BANNER_TYPES[keyof typeof MOBILE_BANNER_TYPES];\n\ninterface StyledBannerContainerT {\n  type: MobileBannerTypesT;\n  isOpen: boolean;\n  isAnimating: boolean;\n  height: number;\n}\n\ninterface StyledInnerContainerT {\n  type: MobileBannerTypesT;\n  isOpen: boolean;\n  isAnimating: boolean;\n  ref: React.MutableRefObject<HTMLDivElement>;\n}\n\ninterface StyledContentT {\n  showCloseButton: boolean;\n}\nexport const StyledInnerContainer = styled.div<StyledInnerContainerT>`\n  display: flex;\n  min-height: 60px;\n  width: 100%;\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  border-bottom: 4px solid ${({ type, theme }) => handleBorderColor(type, theme)};\n  transform: translateY(${({ isOpen }) => (isOpen ? '0' : '-100%')});\n  ${({ isAnimating, isOpen }) => handleAnimation(isAnimating, isOpen)};\n  padding: 8px 8px 8px 16px;\n`;\n\nexport const StyledTextContent = styled.div`\n  width: 100%;\n`;\n\nexport const StyledTitle = styled.div`\n  color: ${({ theme }) => theme.colors.neutral[700]};\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[700])};\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  margin-bottom: ${({ theme }) => theme.space.xxxs};\n  @media not all and (min-resolution: 0.001dpcm) {\n    @media {\n      -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render\n      -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render\n    }\n  }\n  @media screen and (min--moz-device-pixel-ratio: 0) {\n    -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render\n    -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render\n  }\n`;\n\nexport const StyledSubTitle = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-start;\n\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n\n  & > * {\n    margin-top: 4px;\n  }\n`;\n\nexport const StyledIconContainer = styled.div`\n  margin-right: ${({ theme }) => theme.space.xxs};\n`;\n\nexport const StyledContent = styled.div<StyledContentT>`\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  margin-right: ${({ showCloseButton }) => (!showCloseButton ? '28px' : '0')};\n`;\n\nexport const StyledCloseButtonContainer = styled.div`\n  display: flex;\n  align-items: flex-start;\n`;\n\nexport const StyledSubTitleText = styled.span`\n  margin-right: 16px;\n  line-height: 1.1;\n`;\n\nexport const StyledCloseButton = styled(DSButtonV2)`\n  position: relative;\n  &:focus {\n    &:after {\n      display: block;\n      content: ' ';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n      border-radius: 2px;\n      pointer-events: none;\n    }\n  }\n`;\n\nexport const StyledActionLink = styled.a`\n  text-decoration: none;\n  line-height: 1.1;\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n  color: ${({ theme }) => theme.colors.brand[600]};\n`;\n\nexport const StyledBannerContainer = styled('div')<StyledBannerContainerT>`\n  overflow: hidden;\n  height: ${({ isOpen }) => (isOpen ? 'auto' : '0px')};\n  ${({ isAnimating, isOpen, height }) => handleAnimation(isAnimating, isOpen, height)};\n  ${xStyledCommonProps}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA2C;AAC3C,IAAAA,oBAAyB;AACzB,uBAA2B;AAC3B,0BAAmD;AAsB5C,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA;AAAA,sBAIrB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA,6BAC7B,CAAC,EAAE,MAAM,MAAM,UAAM,uCAAkB,MAAM,KAAK;AAAA,0BACrD,CAAC,EAAE,OAAO,MAAO,SAAS,MAAM;AAAA,IACtD,CAAC,EAAE,aAAa,OAAO,UAAM,qCAAgB,aAAa,MAAM;AAAA;AAAA;AAI7D,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAIjC,MAAM,cAAc,wBAAO;AAAA,WACvB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA,eAChC,CAAC,EAAE,MAAM,UAAM,4BAAS,MAAM,UAAU,MAAM,IAAI;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA,mBAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA,mCAIX,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKtC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI9D,MAAM,iBAAiB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKtB,CAAC,EAAE,MAAM,UAAM,4BAAS,MAAM,UAAU,MAAM,IAAI;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAO3C,MAAM,sBAAsB,wBAAO;AAAA,kBACxB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAGtC,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA,kBAIlB,CAAC,EAAE,gBAAgB,MAAO,CAAC,kBAAkB,SAAS;AAAA;AAGjE,MAAM,6BAA6B,wBAAO;AAAA;AAAA;AAAA;AAK1C,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAKlC,MAAM,wBAAoB,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAWxB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrD,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA,eAGxB,CAAC,EAAE,MAAM,UAAM,4BAAS,MAAM,UAAU,MAAM,IAAI;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA,WACvC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAGtC,MAAM,4BAAwB,yBAAO,KAAK;AAAA;AAAA,YAErC,CAAC,EAAE,OAAO,MAAO,SAAS,SAAS;AAAA,IAC3C,CAAC,EAAE,aAAa,QAAQ,OAAO,UAAM,qCAAgB,aAAa,QAAQ,MAAM;AAAA,IAChF;AAAA;",
-  "names": ["import_ds_system"]
+  "sourcesContent": ["import { styled, xStyledCommonProps, toMobile } from '@elliemae/ds-system';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { handleAnimation, handleBorderColor } from './utils/styleHelpers.js';\nimport type { MOBILE_BANNER_TYPES } from './utils/bannerTypes.js';\n\ntype MobileBannerTypesT = (typeof MOBILE_BANNER_TYPES)[keyof typeof MOBILE_BANNER_TYPES];\n\ninterface StyledBannerContainerT {\n  type: MobileBannerTypesT;\n  isOpen: boolean;\n  isAnimating: boolean;\n  height: number;\n}\n\ninterface StyledInnerContainerT {\n  type: MobileBannerTypesT;\n  isOpen: boolean;\n  isAnimating: boolean;\n  ref: React.MutableRefObject<HTMLDivElement>;\n}\n\ninterface StyledContentT {\n  showCloseButton: boolean;\n}\nexport const StyledInnerContainer = styled.div<StyledInnerContainerT>`\n  display: flex;\n  min-height: 60px;\n  width: 100%;\n  background-color: ${({ theme }) => theme.colors.neutral['000']};\n  border-bottom: 4px solid ${({ type, theme }) => handleBorderColor(type, theme)};\n  transform: translateY(${({ isOpen }) => (isOpen ? '0' : '-100%')});\n  ${({ isAnimating, isOpen }) => handleAnimation(isAnimating, isOpen)};\n  padding: 8px 8px 8px 16px;\n`;\n\nexport const StyledTextContent = styled.div`\n  width: 100%;\n`;\n\nexport const StyledTitle = styled.div`\n  color: ${({ theme }) => theme.colors.neutral[700]};\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[700])};\n  font-weight: ${({ theme }) => theme.fontWeights.semibold};\n  margin-bottom: ${({ theme }) => theme.space.xxxs};\n  @media not all and (min-resolution: 0.001dpcm) {\n    @media {\n      -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render\n      -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render\n    }\n  }\n  @media screen and (min--moz-device-pixel-ratio: 0) {\n    -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render\n    -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render\n  }\n`;\n\nexport const StyledSubTitle = styled.div`\n  display: flex;\n  flex-wrap: wrap;\n  justify-content: flex-start;\n\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n\n  & > * {\n    margin-top: 4px;\n  }\n`;\n\nexport const StyledIconContainer = styled.div`\n  margin-right: ${({ theme }) => theme.space.xxs};\n`;\n\nexport const StyledContent = styled.div<StyledContentT>`\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  margin-right: ${({ showCloseButton }) => (!showCloseButton ? '28px' : '0')};\n`;\n\nexport const StyledCloseButtonContainer = styled.div`\n  display: flex;\n  align-items: flex-start;\n`;\n\nexport const StyledSubTitleText = styled.span`\n  margin-right: 16px;\n  line-height: 1.1;\n`;\n\nexport const StyledCloseButton = styled(DSButtonV2)`\n  position: relative;\n  &:focus {\n    &:after {\n      display: block;\n      content: ' ';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n      border-radius: 2px;\n      pointer-events: none;\n    }\n  }\n`;\n\nexport const StyledActionLink = styled.a`\n  text-decoration: none;\n  line-height: 1.1;\n  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n  color: ${({ theme }) => theme.colors.brand[600]};\n`;\n\nexport const StyledBannerContainer = styled('div')<StyledBannerContainerT>`\n  overflow: hidden;\n  height: ${({ isOpen }) => (isOpen ? 'auto' : '0px')};\n  ${({ isAnimating, isOpen, height }) => handleAnimation(isAnimating, isOpen, height)};\n  ${xStyledCommonProps}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAqD;AACrD,uBAA2B;AAC3B,0BAAmD;AAsB5C,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA;AAAA,sBAIrB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,6BAClC,CAAC,EAAE,MAAM,MAAM,UAAM,uCAAkB,MAAM,KAAK;AAAA,0BACrD,CAAC,EAAE,OAAO,MAAO,SAAS,MAAM;AAAA,IACtD,CAAC,EAAE,aAAa,OAAO,UAAM,qCAAgB,aAAa,MAAM;AAAA;AAAA;AAI7D,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAIjC,MAAM,cAAc,wBAAO;AAAA,WACvB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,eACnC,CAAC,EAAE,MAAM,UAAM,2BAAS,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA,mBAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA,mCAIX,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKzC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAIjE,MAAM,iBAAiB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,eAKtB,CAAC,EAAE,MAAM,UAAM,2BAAS,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAO3C,MAAM,sBAAsB,wBAAO;AAAA,kBACxB,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM;AAAA;AAGtC,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA,kBAIlB,CAAC,EAAE,gBAAgB,MAAO,CAAC,kBAAkB,SAAS;AAAA;AAGjE,MAAM,6BAA6B,wBAAO;AAAA;AAAA;AAAA;AAK1C,MAAM,qBAAqB,wBAAO;AAAA;AAAA;AAAA;AAKlC,MAAM,wBAAoB,yBAAO,2BAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAWxB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAOxD,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA,eAGxB,CAAC,EAAE,MAAM,UAAM,2BAAS,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,iBAChD,CAAC,EAAE,MAAM,MAAM,MAAM,YAAY;AAAA,WACvC,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAGzC,MAAM,4BAAwB,yBAAO,KAAK;AAAA;AAAA,YAErC,CAAC,EAAE,OAAO,MAAO,SAAS,SAAS;AAAA,IAC3C,CAAC,EAAE,aAAa,QAAQ,OAAO,UAAM,qCAAgB,aAAa,QAAQ,MAAM;AAAA,IAChF;AAAA;",
+  "names": []
 }

package/dist/cjs/MobileBanner/utils/bannerTypes.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/MobileBanner/utils/bannerTypes.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/MobileBanner/utils/bannerTypes.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["export const MOBILE_BANNER_TYPES = {\n  INFO: 'info',\n  SUCCESS: 'success',\n  WARNING: 'warning',\n  ERROR: 'error',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,sBAAsB;AAAA,EACjC,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,sBAAsB;AAAA,EACjC,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAO;AACT;",
   "names": []
 }

package/dist/cjs/MobileBanner/utils/icons.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/MobileBanner/utils/icons.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/MobileBanner/utils/icons.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { AlertsDetailFill, SuccessFill, InfoFill, WarningSquare } from '@elliemae/ds-icons';\n\nexport const icons = {\n  success: <SuccessFill color={['success', 900]} width=\"24px\" height=\"24px\" />,\n  info: <InfoFill color={['brand-primary', 600]} width=\"24px\" height=\"24px\" />,\n  error: <AlertsDetailFill color={['danger', 900]} width=\"24px\" height=\"24px\" />,\n  warning: <WarningSquare color={['warning', 900]} width=\"24px\" height=\"24px\" />,\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIZ;AAHX,sBAAuE;AAEhE,MAAM,QAAQ;AAAA,EACnB,SAAS,4CAAC,+BAAY,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,MAAM,4CAAC,4BAAS,OAAO,CAAC,iBAAiB,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,OAAO,4CAAC,oCAAiB,OAAO,CAAC,UAAU,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC5E,SAAS,4CAAC,iCAAc,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAC9E;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIZ;AAHX,sBAAuE;AAEhE,MAAM,QAAQ;AAAA,EACnB,SAAS,4CAAC,+BAAY,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,MAAM,4CAAC,4BAAS,OAAO,CAAC,iBAAiB,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC1E,OAAO,4CAAC,oCAAiB,OAAO,CAAC,UAAU,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAAA,EAC5E,SAAS,4CAAC,iCAAc,OAAO,CAAC,WAAW,GAAG,GAAG,OAAM,QAAO,QAAO,QAAO;AAC9E;",
   "names": []
 }

package/dist/cjs/MobileBanner/utils/styleHelpers.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -34,7 +38,7 @@ __export(styleHelpers_exports, {
 module.exports = __toCommonJS(styleHelpers_exports);
 var React = __toESM(require("react"));
 var import_ds_system = require("@elliemae/ds-system");
-var import_bannerTypes = require("./bannerTypes");
+var import_bannerTypes = require("./bannerTypes.js");
 const slideIn = import_ds_system.kfrm`
   0% {
     transform: translate3d(0, -100%, 0);

package/dist/cjs/MobileBanner/utils/styleHelpers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/MobileBanner/utils/styleHelpers.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { kfrm, css } from '@elliemae/ds-system';\nimport type { FlattenSimpleInterpolation } from '@elliemae/ds-system';\nimport type { MobileBannerTypesT } from '../index.d';\nimport { MOBILE_BANNER_TYPES } from './bannerTypes';\n\nexport const slideIn = kfrm`\n  0% {\n    transform: translate3d(0, -100%, 0);\n  }\n  100% {\n    transform: translate3d(0, 0, 0);\n  }\n`;\n\nexport const slideOut = kfrm`\n  0% {\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n  60% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 0;\n    transform: translate3d(0, -100%, 0);\n  }\n`;\n\nexport const spanContainer = (height: number) => kfrm`\n  0% {\n    height: 0px;\n  }\n  100% {\n    height: ${height}px;\n  }\n`;\n\nexport const shrinkContainer = (height: number) => kfrm`\n  0% {\n    height: ${height}px;\n  }\n  100% {\n    height: 0px;\n  }\n`;\n\nexport const handleBorderColor = (type: MobileBannerTypesT, { colors }): string => {\n  switch (type) {\n    case MOBILE_BANNER_TYPES.SUCCESS:\n      return colors.success[900];\n    case MOBILE_BANNER_TYPES.INFO:\n      return colors.brand[600];\n    case MOBILE_BANNER_TYPES.WARNING:\n      return colors.warning[900];\n    case MOBILE_BANNER_TYPES.ERROR:\n      return colors.danger[900];\n  }\n};\n\nexport const handleAnimation = (\n  isAnimating: boolean,\n  isOpen: boolean,\n  height: number | null = null,\n): FlattenSimpleInterpolation => {\n  if (isAnimating) {\n    if (isOpen) {\n      return css`\n        animation: ${height ? spanContainer(height) : slideIn} 0.5s ease-in;\n      `;\n    } else {\n      return css`\n        animation: ${height ? shrinkContainer(height) : slideOut} 0.5s ease-in;\n      `;\n    }\n  }\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA0B;AAG1B,yBAAoC;AAE7B,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShB,MAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcjB,MAAM,gBAAgB,CAAC,WAAmB;AAAA;AAAA;AAAA;AAAA;AAAA,cAKnC;AAAA;AAAA;AAIP,MAAM,kBAAkB,CAAC,WAAmB;AAAA;AAAA,cAErC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOP,MAAM,oBAAoB,CAAC,MAA0B,EAAE,OAAO,MAAc;AACjF,UAAQ,MAAM;AAAA,IACZ,KAAK,uCAAoB;AACvB,aAAO,OAAO,QAAQ;AAAA,IACxB,KAAK,uCAAoB;AACvB,aAAO,OAAO,MAAM;AAAA,IACtB,KAAK,uCAAoB;AACvB,aAAO,OAAO,QAAQ;AAAA,IACxB,KAAK,uCAAoB;AACvB,aAAO,OAAO,OAAO;AAAA,EACzB;AACF;AAEO,MAAM,kBAAkB,CAC7B,aACA,QACA,SAAwB,SACO;AAC/B,MAAI,aAAa;AACf,QAAI,QAAQ;AACV,aAAO;AAAA,qBACQ,SAAS,cAAc,MAAM,IAAI;AAAA;AAAA,IAElD,OAAO;AACL,aAAO;AAAA,qBACQ,SAAS,gBAAgB,MAAM,IAAI;AAAA;AAAA,IAEpD;AAAA,EACF;AACF;",
+  "sourcesContent": ["import { kfrm, css } from '@elliemae/ds-system';\nimport type { FlattenSimpleInterpolation } from '@elliemae/ds-system';\nimport type { MobileBannerTypesT } from '../index.d';\nimport { MOBILE_BANNER_TYPES } from './bannerTypes.js';\n\nexport const slideIn = kfrm`\n  0% {\n    transform: translate3d(0, -100%, 0);\n  }\n  100% {\n    transform: translate3d(0, 0, 0);\n  }\n`;\n\nexport const slideOut = kfrm`\n  0% {\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n  60% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 0;\n    transform: translate3d(0, -100%, 0);\n  }\n`;\n\nexport const spanContainer = (height: number) => kfrm`\n  0% {\n    height: 0px;\n  }\n  100% {\n    height: ${height}px;\n  }\n`;\n\nexport const shrinkContainer = (height: number) => kfrm`\n  0% {\n    height: ${height}px;\n  }\n  100% {\n    height: 0px;\n  }\n`;\n\nexport const handleBorderColor = (type: MobileBannerTypesT, { colors }): string => {\n  switch (type) {\n    case MOBILE_BANNER_TYPES.SUCCESS:\n      return colors.success[900];\n    case MOBILE_BANNER_TYPES.INFO:\n      return colors.brand[600];\n    case MOBILE_BANNER_TYPES.WARNING:\n      return colors.warning[900];\n    case MOBILE_BANNER_TYPES.ERROR:\n      return colors.danger[900];\n  }\n};\n\nexport const handleAnimation = (\n  isAnimating: boolean,\n  isOpen: boolean,\n  height: number | null = null,\n): FlattenSimpleInterpolation => {\n  if (isAnimating) {\n    if (isOpen) {\n      return css`\n        animation: ${height ? spanContainer(height) : slideIn} 0.5s ease-in;\n      `;\n    } else {\n      return css`\n        animation: ${height ? shrinkContainer(height) : slideOut} 0.5s ease-in;\n      `;\n    }\n  }\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAA0B;AAG1B,yBAAoC;AAE7B,MAAM,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAShB,MAAM,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcjB,MAAM,gBAAgB,CAAC,WAAmB;AAAA;AAAA;AAAA;AAAA;AAAA,cAKnC;AAAA;AAAA;AAIP,MAAM,kBAAkB,CAAC,WAAmB;AAAA;AAAA,cAErC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOP,MAAM,oBAAoB,CAAC,MAA0B,EAAE,OAAO,MAAc;AACjF,UAAQ,MAAM;AAAA,IACZ,KAAK,uCAAoB;AACvB,aAAO,OAAO,QAAQ,GAAG;AAAA,IAC3B,KAAK,uCAAoB;AACvB,aAAO,OAAO,MAAM,GAAG;AAAA,IACzB,KAAK,uCAAoB;AACvB,aAAO,OAAO,QAAQ,GAAG;AAAA,IAC3B,KAAK,uCAAoB;AACvB,aAAO,OAAO,OAAO,GAAG;AAAA,EAC5B;AACF;AAEO,MAAM,kBAAkB,CAC7B,aACA,QACA,SAAwB,SACO;AAC/B,MAAI,aAAa;AACf,QAAI,QAAQ;AACV,aAAO;AAAA,qBACQ,SAAS,cAAc,MAAM,IAAI;AAAA;AAAA,IAElD,OAAO;AACL,aAAO;AAAA,qBACQ,SAAS,gBAAgB,MAAM,IAAI;AAAA;AAAA,IAEpD;AAAA,EACF;AACF;",
   "names": []
 }

package/dist/cjs/MobileCard/ActionAddon.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -51,8 +55,17 @@ const Addon = (0, import_ds_system.styled)(import_ds_button.default)`
 `;
 const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Addon, { onClick, labelText: label, icon: icon || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronSmallDown, { color: ["brand-primary", 700] }) });
 ActionAddon.propTypes = {
+  /**
+   * Addon label
+   */
   label: import_prop_types.default.string,
+  /**
+   * On click callback
+   */
   onClick: import_prop_types.default.func,
+  /**
+   * Icon to display after the label
+   */
   icon: import_prop_types.default.element
 };
 //# sourceMappingURL=ActionAddon.js.map

package/dist/cjs/MobileCard/ActionAddon.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/MobileCard/ActionAddon.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport Button from '@elliemae/ds-button';\n\nconst Addon = styled(Button)`\n  background-color: transparent;\n  padding-right: 4px;\n  height: 100%;\n  border: none;\n  font-size: 12px;\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  color: ${(props) => props.theme.colors.brand['700']};\n  cursor: pointer;\n  &:focus,\n  &::after {\n    background-color: transparent;\n    box-shadow: none !important; /* needed */\n    border: none !important; /* needed */\n  }\n`;\n\nexport const ActionAddon = ({ label, onClick, icon }) => (\n  <Addon onClick={onClick} labelText={label} icon={icon || <ChevronSmallDown color={['brand-primary', 700]} />} />\n);\n\nActionAddon.propTypes = {\n  /**\n   * Addon label\n   */\n  label: PropTypes.string,\n  /**\n   * On click callback\n   */\n  onClick: PropTypes.func,\n  /**\n   * Icon to display after the label\n   */\n  icon: PropTypes.element,\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwBoC;AAvB3D,wBAAsB;AACtB,uBAAuB;AACvB,sBAAiC;AACjC,uBAAmB;AAEnB,MAAM,YAAQ,yBAAO,iBAAAA,OAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUxC,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MACjD,4CAAC,SAAM,SAAkB,WAAW,OAAO,MAAM,QAAQ,4CAAC,oCAAiB,OAAO,CAAC,iBAAiB,GAAG,GAAG,GAAI;AAGhH,YAAY,YAAY;AAAA,EAItB,OAAO,kBAAAC,QAAU;AAAA,EAIjB,SAAS,kBAAAA,QAAU;AAAA,EAInB,MAAM,kBAAAA,QAAU;AAClB;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwBoC;AAvB3D,wBAAsB;AACtB,uBAAuB;AACvB,sBAAiC;AACjC,uBAAmB;AAEnB,MAAM,YAAQ,yBAAO,iBAAAA,OAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU7C,MAAM,cAAc,CAAC,EAAE,OAAO,SAAS,KAAK,MACjD,4CAAC,SAAM,SAAkB,WAAW,OAAO,MAAM,QAAQ,4CAAC,oCAAiB,OAAO,CAAC,iBAAiB,GAAG,GAAG,GAAI;AAGhH,YAAY,YAAY;AAAA;AAAA;AAAA;AAAA,EAItB,OAAO,kBAAAC,QAAU;AAAA;AAAA;AAAA;AAAA,EAIjB,SAAS,kBAAAA,QAAU;AAAA;AAAA;AAAA;AAAA,EAInB,MAAM,kBAAAA,QAAU;AAClB;",
   "names": ["Button", "PropTypes"]
 }

package/dist/cjs/MobileCard/Card.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -31,15 +35,15 @@ module.exports = __toCommonJS(Card_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_ds_utilities = require("@elliemae/ds-utilities");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_shared = require("@elliemae/ds-shared");
 var import_ds_grid = require("@elliemae/ds-grid");
-var import_StyledCard = require("./StyledCard");
-var import_ExpandChevron = require("./ExpandChevron");
-var import_useHeight = require("./useHeight");
-var import_ExpandableRegion = require("./ExpandableRegion");
-var import_props = require("./props");
+var import_StyledCard = require("./StyledCard.js");
+var import_ExpandChevron = require("./ExpandChevron.js");
+var import_useHeight = require("./useHeight.js");
+var import_ExpandableRegion = require("./ExpandableRegion.js");
+var import_props = require("./props.js");
 const TitleEllipsis = import_ds_system.styled.div`
   ${(0, import_ds_system.truncate)()}
 `;
@@ -190,7 +194,7 @@ const MobileCard = ({
 };
 MobileCard.propTypes = import_props.cardPropsTypes;
 MobileCard.displayName = "MobileCard";
-const DSMobileCardWithSchema = (0, import_ds_utilities.describe)(MobileCard);
+const DSMobileCardWithSchema = (0, import_ds_props_helpers.describe)(MobileCard);
 DSMobileCardWithSchema.propTypes = import_props.cardPropsTypes;
 var Card_default = (0, import_ds_system.withTheme)(MobileCard);
 //# sourceMappingURL=Card.js.map

package/dist/cjs/MobileCard/Card.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/MobileCard/Card.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/no-array-index-key */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\nimport React, { useRef } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport {\n  styled,\n  space,\n  color,\n  border,\n  op,\n  truncate,\n  withTheme,\n  __UNSAFE_SPACE_TO_DIMSUM,\n  toMobile,\n} from '@elliemae/ds-system';\nimport { GroupItem } from '@elliemae/ds-shared';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCard as Card } from './StyledCard';\nimport { ExpandChevron } from './ExpandChevron';\nimport { useHeight } from './useHeight';\nimport { ExpandableRegion } from './ExpandableRegion';\nimport { cardPropsTypes, MobileCardProps } from './props';\n\nconst TitleEllipsis = styled.div`\n  ${truncate()}\n`;\n\nconst Title = styled.div`\n  ${space}\n  ${truncate()}\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  font-size: ${(props) => toMobile(props.theme.fontSizes.title[600])};\n  width: 100%;\n  ${color('neutral', 800)}\n`;\nconst Detail = styled.span`\n  ${space}\n  ${truncate()}\n  font-size: ${(props) => toMobile(props.theme.fontSizes.title[500])};\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n`;\nconst SubText = styled.span`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n  ${truncate()}\n  &:nth-child(2) {\n    padding-left: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  }\n`;\nconst SubTextWrap = styled.div`\n  ${truncate()}\n  border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n  margin-top: 6px;\n  margin-bottom: 2px;\n  padding-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xxs)};\n  font-size: ${(props) => toMobile(props.theme.fontSizes.subTitle[400])};\n  ${color('neutral', 500)}\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  display: flex;\n  justify-content: space-between;\n`;\nconst LeftIcon = styled(Grid)<{ halfM: string }>`\n  & > span {\n    height: ${(props) => props.halfM};\n    width: ${(props) => props.halfM};\n  }\n\n  & > span > svg,\n  svg:not([fill]) {\n    height: ${(props) => props.halfM};\n    width: ${(props) => props.halfM};\n  }\n`;\n\nconst RightIcon = styled(Grid)<{ halfM: string }>`\n  span > svg,\n  span > svg:not([fill]) {\n    fill: #000000;\n  }\n`;\nconst CenterWrap = styled.div`\n  display: flex;\n  align-items: center;\n  ${truncate()}\n`;\n\nconst MobileCard: React.ComponentType<MobileCardProps> = ({\n  children,\n  height = 'm',\n  leftAddOn,\n  leftProp,\n  rightProp,\n  subText,\n  subIcons,\n  details,\n  theme,\n  expandable = false,\n  expandedContent,\n  value,\n  cardContent,\n}) => {\n  const subTextRef = useRef(null);\n  const subTextHeight = useHeight(subTextRef);\n  const isJustChildren = !(subText || subIcons || details);\n  const halfM = op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.m), 2);\n\n  return (\n    <GroupItem\n      render={(context = {}) => {\n        const { activeValue, onChange } = context;\n        const selected =\n          activeValue !== undefined && (activeValue === value || (activeValue?.length && activeValue?.includes(value)));\n\n        return (\n          <Card\n            data-testid=\"card-wrapper\"\n            minHeight={\n              height === 'm' ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxl) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)\n            }\n          >\n            {expandable && (\n              <ExpandChevron\n                isExpanded={selected}\n                onClick={(e) => {\n                  e.stopPropagation();\n                  onChange({ target: { value } });\n                }}\n                align={subText || subIcons ? 'top' : 'center'}\n              />\n            )}\n            <Grid pb={(subText || subIcons) && subTextHeight} cols={['auto', 'auto']} alignItems=\"center\">\n              {leftProp && <Grid ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}>{leftProp}</Grid>}\n              {leftAddOn && (\n                <LeftIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} halfM={halfM}>\n                  {leftAddOn}\n                </LeftIcon>\n              )}\n            </Grid>\n            <Grid\n              pl={!leftAddOn ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : __UNSAFE_SPACE_TO_DIMSUM(theme.space.xs)}\n              pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n              width=\"100%\"\n            >\n              <CenterWrap>\n                <Title pt={!isJustChildren && halfM} data-testid=\"card-title\">\n                  <TitleEllipsis>{children}</TitleEllipsis>\n                  {details && (\n                    <Grid\n                      data-testid=\"card-details\"\n                      cols={details.map(() => 'min-content')}\n                      mb={(!(subText || subIcons) && halfM) || 0}\n                      pt={op('/', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs), 2)}\n                    >\n                      {details.map((d, i) => (\n                        <Detail key={i}>\n                          {d}\n                          {i < details.length - 1 && <Detail px={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xxs)}>\u2022</Detail>}\n                        </Detail>\n                      ))}\n                    </Grid>\n                  )}\n                </Title>\n                {rightProp &&\n                  rightProp.map((prop, i) => (\n                    <RightIcon ml={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)} key={i}>\n                      {prop}\n                    </RightIcon>\n                  ))}\n              </CenterWrap>\n              {subIcons && (\n                <SubTextWrap ref={subTextRef}>\n                  <SubText>{subIcons}</SubText>\n                  {subText && subText[1] && <SubText data-testid=\"card-subText\">{subText[1]}</SubText>}\n                </SubTextWrap>\n              )}\n              {subText && !subIcons && (\n                <SubTextWrap ref={subTextRef}>\n                  {subText.map((s, i) => (\n                    <SubText data-testid=\"card-subText\" key={i}>\n                      {s}\n                    </SubText>\n                  ))}\n                </SubTextWrap>\n              )}\n              <ExpandableRegion show={selected} content={expandedContent} />\n              {cardContent && <Grid>{cardContent}</Grid>}\n            </Grid>\n          </Card>\n        );\n      }}\n    />\n  );\n};\n\nMobileCard.propTypes = cardPropsTypes;\nMobileCard.displayName = 'MobileCard';\nconst DSMobileCardWithSchema = describe(MobileCard);\n\nDSMobileCardWithSchema.propTypes = cardPropsTypes;\n\nexport { DSMobileCardWithSchema };\n\nexport default withTheme(MobileCard);\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": "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",
+  "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 ref={subTextRef}>\n                  <SubText>{subIcons}</SubText>\n                  {subText && subText[1] && <SubText data-testid=\"card-subText\">{subText[1]}</SubText>}\n                </SubTextWrap>\n              )}\n              {subText && !subIcons && (\n                <SubTextWrap ref={subTextRef}>\n                  {subText.map((s, i) => (\n                    <SubText data-testid=\"card-subText\" key={i}>\n                      {s}\n                    </SubText>\n                  ))}\n                </SubTextWrap>\n              )}\n              <ExpandableRegion show={selected} content={expandedContent} />\n              {cardContent && <Grid>{cardContent}</Grid>}\n            </Grid>\n          </Card>\n        );\n      }}\n    />\n  );\n};\n\nMobileCard.propTypes = cardPropsTypes;\nMobileCard.displayName = 'MobileCard';\nconst DSMobileCardWithSchema = describe(MobileCard);\n\nDSMobileCardWithSchema.propTypes = cardPropsTypes;\n\nexport { DSMobileCardWithSchema };\n\nexport default withTheme(MobileCard);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
   "names": ["Card"]
 }

package/dist/cjs/MobileCard/CardIcons.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -28,7 +32,10 @@ __export(CardIcons_exports, {
 });
 module.exports = __toCommonJS(CardIcons_exports);
 var React = __toESM(require("react"));
-var import_jsx_runtime = require("react/jsx-runtime");
+var import_jsx_runtime = (
+  // eslint-disable-next-line react/no-array-index-key
+  require("react/jsx-runtime")
+);
 var import_prop_types = __toESM(require("prop-types"));
 var import_ds_system = require("@elliemae/ds-system");
 var import_ds_grid = require("@elliemae/ds-grid");
@@ -90,7 +97,13 @@ const CardIconsWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid)`
 `;
 const SubIcons = ({ icons = [], colors = [] }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardIconsWrapper, { cols: icons.map(() => "12px"), gutter: "6px", height: "14px", "data-testid": "card-subIcons", children: icons.map((Icon, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: `icon-color-${colors[i] || "muted"}` }, i)) });
 SubIcons.propTypes = {
+  /**
+   * Array of  Icons
+   */
   icons: import_prop_types.default.arrayOf(import_prop_types.default.func),
+  /**
+   * Color Types: muted, warn, error, success
+   */
   colors: import_prop_types.default.arrayOf(import_prop_types.default.oneOf(["muted", "warn", "error", "success", "primary"]))
 };
 //# sourceMappingURL=CardIcons.js.map

package/dist/cjs/MobileCard/CardIcons.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/MobileCard/CardIcons.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["/* eslint-disable import/no-unresolved */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst CardIconsWrapper = styled(Grid)`\n  align-items: center;\n  span,\n  svg {\n    width: 12px !important;\n    height: 12px !important;\n  }\n  span.icon-color-muted svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.neutral['600']};\n    height: 12px !important;\n    width: 12px !important;\n\n    & * {\n      fill: ${(props) => props.theme.colors.neutral['600']};\n    }\n  }\n  span.icon-color-warn svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.warning['600']};\n    height: 12px !important;\n    width: 12px !important;\n\n    & * {\n      fill: ${(props) => props.theme.colors.warning['600']};\n    }\n  }\n  span.icon-color-error svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.danger['900']};\n    height: 12px !important;\n    width: 12px !important;\n\n    & * {\n      fill: ${(props) => props.theme.colors.danger['900']};\n    }\n  }\n  span.icon-color-success svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.success['900']};\n    height: 12px !important;\n    width: 12px !important;\n\n    & * {\n      fill: ${(props) => props.theme.colors.success['900']};\n    }\n  }\n  span.icon-color-primary svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.brand[600]};\n  }\n  span.icon-color-primary svg,\n  svg:not([fill]) {\n    fill: ${(props) => props.theme.colors.brand[600]};\n  }\n`;\n\nexport const SubIcons = ({ icons = [], colors = [] }) => (\n  <CardIconsWrapper cols={icons.map(() => '12px')} gutter=\"6px\" height=\"14px\" data-testid=\"card-subIcons\">\n    {icons.map((Icon, i) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Icon key={i} className={`icon-color-${colors[i] || 'muted'}`} />\n    ))}\n  </CardIconsWrapper>\n);\n\nSubIcons.propTypes = {\n  /**\n   * Array of  Icons\n   */\n  icons: PropTypes.arrayOf(PropTypes.func),\n  /**\n   * Color Types: muted, warn, error, success\n   */\n  colors: PropTypes.arrayOf(PropTypes.oneOf(['muted', 'warn', 'error', 'success', 'primary'])),\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmEjB;AAjEN,wBAAsB;AACtB,uBAAuB;AACvB,qBAAqB;AAErB,MAAM,uBAAmB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YASxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,cAKnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,YAKvC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,cAKpC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,YAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA,YAIpC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAIzC,MAAM,WAAW,CAAC,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAC,EAAE,MACjD,4CAAC,oBAAiB,MAAM,MAAM,IAAI,MAAM,MAAM,GAAG,QAAO,OAAM,QAAO,QAAO,eAAY,iBACrF,gBAAM,IAAI,CAAC,MAAM,MAEhB,4CAAC,QAAa,WAAW,cAAc,OAAO,MAAM,aAAzC,CAAoD,CAChE,GACH;AAGF,SAAS,YAAY;AAAA,EAInB,OAAO,kBAAAA,QAAU,QAAQ,kBAAAA,QAAU,IAAI;AAAA,EAIvC,QAAQ,kBAAAA,QAAU,QAAQ,kBAAAA,QAAU,MAAM,CAAC,SAAS,QAAQ,SAAS,WAAW,SAAS,CAAC,CAAC;AAC7F;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmEjB;AAAA;AAAA;AAAA;AAjEN,wBAAsB;AACtB,uBAAuB;AACvB,qBAAqB;AAErB,MAAM,uBAAmB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YASxB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,cAKzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,YAK7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,cAKzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,YAK7C,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,cAKxC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,YAK5C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,cAKzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,YAK7C,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA,YAIvC,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAI5C,MAAM,WAAW,CAAC,EAAE,QAAQ,CAAC,GAAG,SAAS,CAAC,EAAE,MACjD,4CAAC,oBAAiB,MAAM,MAAM,IAAI,MAAM,MAAM,GAAG,QAAO,OAAM,QAAO,QAAO,eAAY,iBACrF,gBAAM,IAAI,CAAC,MAAM,MAEhB,4CAAC,QAAa,WAAW,cAAc,OAAO,CAAC,KAAK,aAAzC,CAAoD,CAChE,GACH;AAGF,SAAS,YAAY;AAAA;AAAA;AAAA;AAAA,EAInB,OAAO,kBAAAA,QAAU,QAAQ,kBAAAA,QAAU,IAAI;AAAA;AAAA;AAAA;AAAA,EAIvC,QAAQ,kBAAAA,QAAU,QAAQ,kBAAAA,QAAU,MAAM,CAAC,SAAS,QAAQ,SAAS,WAAW,SAAS,CAAC,CAAC;AAC7F;",
   "names": ["PropTypes"]
 }