@elliemae/ds-mobile 3.0.0-next.2 → 3.0.0-next.6

package/dist/esm/MobileActionToolbar/MobileActionToolbar.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileActionToolbar/MobileActionToolbar.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport { Grid } from '@elliemae/ds-grid';\nimport styled from 'styled-components';\nimport { withTheme } from '@elliemae/ds-system';\nimport ToolbarItem from './MobileActionToolbarItem';\n\nconst ToolStrip = styled(Grid)`\n  display: flex;\n  justify-content: space-around;\n  align-items: center;\n  background-color: ${(props) => props.theme.colors.neutral['000']};\n`;\nconst Toolbar = ({ withDepth = true, buttons = [], theme }) => {\n  const rows = [1];\n  const toolbarHeight = theme.space.m;\n  const borderStyle = withDepth ? { boxShadow: '0 1px 5px 0 rgba(0,0,0,0.5)' } : { boxShadow: 'none' };\n  return (\n    <ToolStrip rows={rows} height={toolbarHeight} style={borderStyle}>\n      {buttons}\n    </ToolStrip>\n  );\n};\n\nconst props = {\n  /** toggle box shadow for buttons border */\n  withDepth: PropTypes.bool.description('toggle box shadow for buttons border'),\n  /** button array for the mobile action toolbar */\n  buttons: PropTypes.arrayOf(PropTypes.element).description('button array for the mobile action toolbar'),\n};\n\nToolbar.propTypes = props;\n\nconst DSMobileActionToolbar = withTheme(Toolbar);\n\nconst DSMobileActionToolbarWithSchema = describe(DSMobileActionToolbar);\nDSMobileActionToolbarWithSchema.propTypes = props;\n\nexport { ToolbarItem, DSMobileActionToolbarWithSchema };\nexport default DSMobileActionToolbar;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY,OAAO;AAAA;AAAA;AAAA;AAAA,sBAIH,CAAC,WAAU,OAAM,MAAM,OAAO,QAAQ;AAAA;AAE5D,MAAM,UAAU,CAAC,EAAE,YAAY,MAAM,UAAU,IAAI,YAAY;AAC7D,QAAM,OAAO,CAAC;AACd,QAAM,gBAAgB,MAAM,MAAM;AAClC,QAAM,cAAc,YAAY,EAAE,WAAW,kCAAkC,EAAE,WAAW;AAC5F,SACE,qCAAC,WAAD;AAAA,IAAW;AAAA,IAAY,QAAQ;AAAA,IAAe,OAAO;AAAA,KAClD;AAAA;AAKP,MAAM,QAAQ;AAAA,EAEZ,WAAW,UAAU,KAAK,YAAY;AAAA,EAEtC,SAAS,UAAU,QAAQ,UAAU,SAAS,YAAY;AAAA;AAG5D,QAAQ,YAAY;AAEpB,MAAM,wBAAwB,UAAU;AAExC,MAAM,kCAAkC,SAAS;AACjD,gCAAgC,YAAY;AAG5C,IAAO,8BAAQ;",
+  "names": []
+}

package/dist/esm/MobileActionToolbar/MobileActionToolbarItem.js

@@ -0,0 +1,57 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import * as React from "react";
+import React2 from "react";
+import { PropTypes, describe } from "react-desc";
+import DSButton from "@elliemae/ds-button";
+const ToolbarItem = (_a) => {
+  var _b = _a, { icon } = _b, otherProps = __objRest(_b, ["icon"]);
+  const displayIcon = React2.cloneElement(icon, { size: "m" });
+  return /* @__PURE__ */ React2.createElement(DSButton, __spreadProps(__spreadValues({}, otherProps), {
+    buttonType: "text",
+    icon: displayIcon,
+    size: "m"
+  }));
+};
+ToolbarItem.displayName = "ToolbarItem";
+const props = {
+  icon: PropTypes.element.description("Toolbar item icon")
+};
+ToolbarItem.propTypes = props;
+const DSToolbarItemWithSchema = describe(ToolbarItem);
+DSToolbarItemWithSchema.propTypes = props;
+var MobileActionToolbarItem_default = ToolbarItem;
+export {
+  DSToolbarItemWithSchema,
+  MobileActionToolbarItem_default as default
+};
+//# sourceMappingURL=MobileActionToolbarItem.js.map

package/dist/esm/MobileActionToolbar/MobileActionToolbarItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileActionToolbar/MobileActionToolbarItem.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport DSButton from '@elliemae/ds-button';\n\nconst ToolbarItem = ({ icon, ...otherProps }) => {\n  const displayIcon = React.cloneElement(icon, { size: 'm' });\n  return <DSButton {...otherProps} buttonType=\"text\" icon={displayIcon} size=\"m\" />;\n};\n\nToolbarItem.displayName = 'ToolbarItem';\n\nconst props = {\n  /** toolbar item icon */\n  icon: PropTypes.element.description('Toolbar item icon'),\n};\n\nToolbarItem.propTypes = props;\n\nconst DSToolbarItemWithSchema = describe(ToolbarItem);\n\nDSToolbarItemWithSchema.propTypes = props;\n\nexport default ToolbarItem;\n\nexport { DSToolbarItemWithSchema };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AAEA,MAAM,cAAc,CAAC,OAA4B;AAA5B,eAAE,WAAF,IAAW,uBAAX,IAAW,CAAT;AACrB,QAAM,cAAc,OAAM,aAAa,MAAM,EAAE,MAAM;AACrD,SAAO,qCAAC,UAAD,iCAAc,aAAd;AAAA,IAA0B,YAAW;AAAA,IAAO,MAAM;AAAA,IAAa,MAAK;AAAA;AAAA;AAG7E,YAAY,cAAc;AAE1B,MAAM,QAAQ;AAAA,EAEZ,MAAM,UAAU,QAAQ,YAAY;AAAA;AAGtC,YAAY,YAAY;AAExB,MAAM,0BAA0B,SAAS;AAEzC,wBAAwB,YAAY;AAEpC,IAAO,kCAAQ;",
+  "names": []
+}

package/dist/esm/MobileActionToolbar/index.js

@@ -0,0 +1,9 @@
+import * as React from "react";
+export * from "./MobileActionToolbar";
+import { default as default2 } from "./MobileActionToolbar";
+import { DSToolbarItemWithSchema } from "./MobileActionToolbarItem";
+export {
+  DSToolbarItemWithSchema,
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/MobileActionToolbar/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileActionToolbar/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './MobileActionToolbar';\nexport { default } from './MobileActionToolbar';\nexport { DSToolbarItemWithSchema } from './MobileActionToolbarItem';\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;",
+  "names": []
+}

package/dist/esm/MobileBanner/MobileBanner.js

@@ -0,0 +1,116 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import * as React from "react";
+import React2, { useLayoutEffect, useEffect, useRef, useState } from "react";
+import { CloseX } from "@elliemae/ds-icons";
+import { describe } from "react-desc";
+import { icons } from "./utils/icons";
+import { propTypes } from "./propTypes";
+import { defaultProps } from "./defaultProps";
+import {
+  StyledActionLink,
+  StyledCloseButton,
+  StyledInnerContainer,
+  StyledBannerContainer,
+  StyledContent,
+  StyledIconContainer,
+  StyledSubTitle,
+  StyledTitle,
+  StyledCloseButtonContainer
+} from "./styles";
+const DSMobileBanner = ({
+  type,
+  isOpen,
+  closeButtonOnClick,
+  label,
+  body,
+  actionLinkLabel,
+  actionLinkHref,
+  actionLinkOnClick,
+  showCloseButton,
+  containerProps,
+  focusOnOpen
+}) => {
+  const innerContainerRef = useRef(null);
+  const closeRef = useRef(null);
+  const [current, setCurrent] = useState(isOpen);
+  const [isAnimating, setIsAnimating] = useState(false);
+  const [height, setHeight] = useState(0);
+  useEffect(() => {
+    if (innerContainerRef.current) {
+      setHeight(innerContainerRef.current.offsetHeight);
+    }
+  }, [isAnimating, isOpen]);
+  useEffect(() => {
+    if (focusOnOpen && closeRef.current && isOpen) {
+      closeRef.current?.focus?.();
+    }
+  }, [focusOnOpen, isOpen]);
+  useLayoutEffect(() => {
+    if (isOpen !== current || isOpen)
+      setIsAnimating(true);
+    else
+      setIsAnimating(false);
+  }, [isOpen, current]);
+  if (!isAnimating && !isOpen)
+    return null;
+  return /* @__PURE__ */ React2.createElement(StyledBannerContainer, __spreadProps(__spreadValues({
+    type,
+    isOpen,
+    isAnimating,
+    onAnimationEnd: () => setCurrent(isOpen),
+    height
+  }, containerProps), {
+    "data-testid": "ds-mobile-banner-container",
+    role: "alert"
+  }), /* @__PURE__ */ React2.createElement(StyledInnerContainer, {
+    type,
+    isOpen,
+    ref: innerContainerRef,
+    isAnimating
+  }, /* @__PURE__ */ React2.createElement(StyledIconContainer, {
+    "data-testid": "ds-mobile-banner-icon"
+  }, icons[type]), /* @__PURE__ */ React2.createElement(StyledContent, {
+    showCloseButton
+  }, /* @__PURE__ */ React2.createElement(StyledTitle, null, label), /* @__PURE__ */ React2.createElement(StyledSubTitle, null, body, actionLinkLabel && /* @__PURE__ */ React2.createElement(StyledActionLink, {
+    href: actionLinkHref,
+    "data-testid": "ds-mobile-banner-link",
+    onClick: actionLinkOnClick
+  }, actionLinkLabel))), showCloseButton && /* @__PURE__ */ React2.createElement(StyledCloseButtonContainer, null, /* @__PURE__ */ React2.createElement(StyledCloseButton, {
+    "data-testid": "ds-mobile-banner-close-button",
+    buttonType: "link",
+    onClick: closeButtonOnClick,
+    "aria-label": "Close Banner",
+    icon: /* @__PURE__ */ React2.createElement(CloseX, {
+      width: "12px",
+      height: "12px"
+    }),
+    innerRef: closeRef
+  }))));
+};
+DSMobileBanner.defaultProps = defaultProps;
+DSMobileBanner.propTypes = propTypes;
+const DSMobileBannerWithSchema = describe(DSMobileBanner);
+DSMobileBannerWithSchema.propTypes = propTypes;
+export {
+  DSMobileBanner,
+  DSMobileBannerWithSchema
+};
+//# sourceMappingURL=MobileBanner.js.map

package/dist/esm/MobileBanner/MobileBanner.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/MobileBanner.tsx"],
+  "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 'react-desc';\nimport type { MobileBannerPropsT } from './index.d';\nimport { icons } from './utils/icons';\nimport { propTypes } from './propTypes';\nimport { defaultProps } from './defaultProps';\nimport {\n  StyledActionLink,\n  StyledCloseButton,\n  StyledInnerContainer,\n  StyledBannerContainer,\n  StyledContent,\n  StyledIconContainer,\n  StyledSubTitle,\n  StyledTitle,\n  StyledCloseButtonContainer,\n} from './styles';\n\nconst DSMobileBanner = ({\n  type,\n  isOpen,\n  closeButtonOnClick,\n  label,\n  body,\n  actionLinkLabel,\n  actionLinkHref,\n  actionLinkOnClick,\n  showCloseButton,\n  containerProps,\n  focusOnOpen,\n}: MobileBannerPropsT): JSX.Element => {\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    >\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            {body}\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=\"link\"\n              onClick={closeButtonOnClick}\n              aria-label=\"Close Banner\"\n              icon={<CloseX width=\"12px\" height=\"12px\" />}\n              innerRef={closeRef}\n            />\n          </StyledCloseButtonContainer>\n        )}\n      </StyledInnerContainer>\n    </StyledBannerContainer>\n  );\n};\n\nDSMobileBanner.defaultProps = defaultProps;\nDSMobileBanner.propTypes = propTypes;\nconst DSMobileBannerWithSchema = describe(DSMobileBanner);\nDSMobileBannerWithSchema.propTypes = propTypes;\n\nexport { DSMobileBanner, DSMobileBannerWithSchema };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AAEA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA,MAAM,iBAAiB,CAAC;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACqC;AACrC,QAAM,oBAAoB,OAA8B;AACxD,QAAM,WAAW,OAA8B;AAC/C,QAAM,CAAC,SAAS,cAAc,SAAkB;AAChD,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AACxD,QAAM,CAAC,QAAQ,aAAa,SAAiB;AAE7C,YAAU,MAAM;AACd,QAAI,kBAAkB,SAAS;AAC7B,gBAAU,kBAAkB,QAAQ;AAAA;AAAA,KAErC,CAAC,aAAa;AAEjB,YAAU,MAAM;AACd,QAAI,eAAe,SAAS,WAAW,QAAQ;AAC7C,eAAS,SAAS;AAAA;AAAA,KAEnB,CAAC,aAAa;AAEjB,kBAAgB,MAAM;AACpB,QAAI,WAAW,WAAW;AAAQ,qBAAe;AAAA;AAC5C,qBAAe;AAAA,KACnB,CAAC,QAAQ;AAEZ,MAAI,CAAC,eAAe,CAAC;AAAQ,WAAO;AAEpC,SACE,qCAAC,uBAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,MAAM,WAAW;AAAA,IACjC;AAAA,KACI,iBANN;AAAA,IAOE,eAAY;AAAA,IACZ,MAAK;AAAA,MAEL,qCAAC,sBAAD;AAAA,IAAsB;AAAA,IAAY;AAAA,IAAgB,KAAK;AAAA,IAAmB;AAAA,KACxE,qCAAC,qBAAD;AAAA,IAAqB,eAAY;AAAA,KAAyB,MAAM,QAChE,qCAAC,eAAD;AAAA,IAAe;AAAA,KACb,qCAAC,aAAD,MAAc,QACd,qCAAC,gBAAD,MACG,MACA,mBACC,qCAAC,kBAAD;AAAA,IAAkB,MAAM;AAAA,IAAgB,eAAY;AAAA,IAAwB,SAAS;AAAA,KAClF,oBAKR,mBACC,qCAAC,4BAAD,MACE,qCAAC,mBAAD;AAAA,IACE,eAAY;AAAA,IACZ,YAAW;AAAA,IACX,SAAS;AAAA,IACT,cAAW;AAAA,IACX,MAAM,qCAAC,QAAD;AAAA,MAAQ,OAAM;AAAA,MAAO,QAAO;AAAA;AAAA,IAClC,UAAU;AAAA;AAAA;AASxB,eAAe,eAAe;AAC9B,eAAe,YAAY;AAC3B,MAAM,2BAA2B,SAAS;AAC1C,yBAAyB,YAAY;",
+  "names": []
+}

package/{esm → dist/esm}/MobileBanner/defaultProps.js

@@ -1,5 +1,5 @@
-import { MOBILE_BANNER_TYPES } from './utils/bannerTypes.js';
-
+import * as React from "react";
+import { MOBILE_BANNER_TYPES } from "./utils/bannerTypes";
 const defaultProps = {
   type: MOBILE_BANNER_TYPES.SUCCESS,
   isOpen: false,
@@ -7,11 +7,13 @@ const defaultProps = {
   actionLinkLabel: null,
   actionLinkHref: null,
   actionLinkOnClick: () => null,
-  label: '',
-  body: '',
+  label: "",
+  body: "",
   showCloseButton: true,
   containerProps: {},
   focusOnOpen: false
 };
-
-export { defaultProps };
+export {
+  defaultProps
+};
+//# sourceMappingURL=defaultProps.js.map

package/dist/esm/MobileBanner/defaultProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/defaultProps.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { MOBILE_BANNER_TYPES } from './utils/bannerTypes';\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"],
+  "mappings": "AAAA;ACAA;AAEO,MAAM,eAAe;AAAA,EAC1B,MAAM,oBAAoB;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;AAAA,EAChB,aAAa;AAAA;",
+  "names": []
+}

package/dist/esm/MobileBanner/index.d.js

@@ -0,0 +1,2 @@
+import * as React from "react";
+//# sourceMappingURL=index.d.js.map

package/dist/esm/MobileBanner/index.d.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n"],
+  "mappings": "AAAA;",
+  "names": []
+}

package/dist/esm/MobileBanner/index.js

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { DSMobileBanner, DSMobileBannerWithSchema } from "./MobileBanner";
+import { MOBILE_BANNER_TYPES } from "./utils/bannerTypes";
+export {
+  DSMobileBanner,
+  DSMobileBannerWithSchema,
+  MOBILE_BANNER_TYPES
+};
+//# sourceMappingURL=index.js.map

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

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

package/dist/esm/MobileBanner/propTypes.js

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { PropTypes } from "react-desc";
+const propTypes = {
+  type: PropTypes.oneOf(["info", "success", "warning", "error"]).description("Type of banner"),
+  isOpen: PropTypes.bool.description("Whether the banner is open or not"),
+  closeButtonOnClick: PropTypes.func.description("OnClick function used in the close button"),
+  actionLinkLabel: PropTypes.string.description("Label used in the the action link"),
+  actionLinkHref: PropTypes.string.description("Href used in the the action link"),
+  actionLinkOnClick: PropTypes.string.description("OnClick function used in the action link"),
+  label: PropTypes.string.description("Label text for the banner"),
+  body: PropTypes.string.description("Body text for the banner"),
+  showCloseButton: PropTypes.bool.description("Whether the close button should be visible or not"),
+  containerProps: PropTypes.shape({}).description("Set of properties attached to the banner container"),
+  focusOnOpen: PropTypes.bool.description("Whether the banner should get focus when its openedWhether the banner should get focus when it's opened")
+};
+export {
+  propTypes
+};
+//# sourceMappingURL=propTypes.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/propTypes.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from 'react-desc';\n\nexport const propTypes = {\n  type: PropTypes.oneOf(['info', 'success', 'warning', 'error']).description('Type of banner'),\n  isOpen: PropTypes.bool.description('Whether the banner is open or not'),\n  closeButtonOnClick: PropTypes.func.description('OnClick function used in the close button'),\n  actionLinkLabel: PropTypes.string.description('Label used in the the action link'),\n  actionLinkHref: PropTypes.string.description('Href used in the the action link'),\n  actionLinkOnClick: PropTypes.string.description('OnClick function used in the action link'),\n  label: PropTypes.string.description('Label text for the banner'),\n  body: PropTypes.string.description('Body text for the banner'),\n  showCloseButton: PropTypes.bool.description('Whether the close button should be visible or not'),\n  containerProps: PropTypes.shape({}).description('Set of properties attached to the banner container'),\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  ),\n};\n"],
+  "mappings": "AAAA;ACAA;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM,UAAU,MAAM,CAAC,QAAQ,WAAW,WAAW,UAAU,YAAY;AAAA,EAC3E,QAAQ,UAAU,KAAK,YAAY;AAAA,EACnC,oBAAoB,UAAU,KAAK,YAAY;AAAA,EAC/C,iBAAiB,UAAU,OAAO,YAAY;AAAA,EAC9C,gBAAgB,UAAU,OAAO,YAAY;AAAA,EAC7C,mBAAmB,UAAU,OAAO,YAAY;AAAA,EAChD,OAAO,UAAU,OAAO,YAAY;AAAA,EACpC,MAAM,UAAU,OAAO,YAAY;AAAA,EACnC,iBAAiB,UAAU,KAAK,YAAY;AAAA,EAC5C,gBAAgB,UAAU,MAAM,IAAI,YAAY;AAAA,EAChD,aAAa,UAAU,KAAK,YAC1B;AAAA;",
+  "names": []
+}

package/dist/esm/MobileBanner/styles.js

@@ -0,0 +1,99 @@
+import * as React from "react";
+import styled from "styled-components";
+import { toMobile } from "@elliemae/ds-system";
+import DSButton from "@elliemae/ds-button";
+import { handleAnimation, handleBorderColor } from "./utils/styleHelpers";
+const StyledInnerContainer = styled.div`
+  display: flex;
+  min-height: 68px;
+  width: 100%;
+  background-color: ${({ theme }) => theme.colors.neutral["000"]};
+  border-bottom: 4px solid ${({ type, theme }) => handleBorderColor(type, theme)};
+  transform: translateY(${({ isOpen }) => isOpen ? "0" : "-100%"});
+  ${({ isAnimating, isOpen }) => handleAnimation(isAnimating, isOpen)};
+`;
+const StyledTextContent = styled.div`
+  width: 100%;
+`;
+const StyledTitle = styled.div`
+  color: ${({ theme }) => theme.colors.neutral[700]};
+  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[700])};
+  font-weight: ${({ theme }) => theme.fontWeights.semibold};
+  margin-bottom: ${({ theme }) => theme.space.xxs};
+  @media not all and (min-resolution: 0.001dpcm) {
+    @media {
+      -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render
+      -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render
+    }
+  }
+  @media screen and (min--moz-device-pixel-ratio: 0) {
+    -webkit-font-smoothing: subpixel-antialiased; // fix safari bold render
+    -webkit-text-stroke: 0.4px ${({ theme }) => theme.colors.neutral[700]}; // fix safari bold render
+  }
+`;
+const StyledSubTitle = styled.div`
+  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};
+  font-weight: ${({ theme }) => theme.fontWeights.regular};
+`;
+const StyledIconContainer = styled.div`
+  margin-top: 10px;
+  margin-right: ${({ theme }) => theme.space.xxs};
+  margin-left: ${({ theme }) => theme.space.xs};
+`;
+const StyledContent = styled.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  margin: ${({ theme }) => theme.space.xxs2} 0;
+  margin-right: ${({ showCloseButton }) => !showCloseButton ? "28px" : "0"};
+`;
+const StyledCloseButtonContainer = styled.div`
+  display: flex;
+  align-items: flex-start;
+  margin-top: 6px;
+  margin-right: 6px;
+`;
+const StyledCloseButton = styled(DSButton)`
+  position: relative;
+  &:focus {
+    &:after {
+      display: block;
+      content: ' ';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border: 2px solid ${({ theme }) => theme.colors.brand[700]};
+      border-radius: 2px;
+      pointer-events: none;
+    }
+  }
+`;
+const StyledActionLink = styled.a`
+  text-decoration: none;
+  float: right;
+  margin-left: ${({ theme }) => theme.space.xs};
+  line-height: 1.1;
+  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};
+  font-weight: ${({ theme }) => theme.fontWeights.regular};
+  color: ${({ theme }) => theme.colors.brand[600]};
+`;
+const StyledBannerContainer = styled.div`
+  overflow: hidden;
+  height: ${({ isOpen }) => isOpen ? "auto" : "0px"};
+  ${({ isAnimating, isOpen, height }) => handleAnimation(isAnimating, isOpen, height)};
+`;
+export {
+  StyledActionLink,
+  StyledBannerContainer,
+  StyledCloseButton,
+  StyledCloseButtonContainer,
+  StyledContent,
+  StyledIconContainer,
+  StyledInnerContainer,
+  StyledSubTitle,
+  StyledTextContent,
+  StyledTitle
+};
+//# sourceMappingURL=styles.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileBanner/styles.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import styled from 'styled-components';\nimport { toMobile } from '@elliemae/ds-system';\nimport DSButton from '@elliemae/ds-button';\nimport type { StyledBannerContainerT, StyledContentT, StyledInnerContainerT } from './index.d';\nimport { handleAnimation, handleBorderColor } from './utils/styleHelpers';\n\nexport const StyledInnerContainer = styled.div<StyledInnerContainerT>`\n  display: flex;\n  min-height: 68px;\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`;\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.xxs};\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  font-size: ${({ theme }) => toMobile(theme.fontSizes.title[600])};\n  font-weight: ${({ theme }) => theme.fontWeights.regular};\n`;\n\nexport const StyledIconContainer = styled.div`\n  margin-top: 10px;\n  margin-right: ${({ theme }) => theme.space.xxs};\n  margin-left: ${({ theme }) => theme.space.xs};\n`;\n\nexport const StyledContent = styled.div<StyledContentT>`\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  margin: ${({ theme }) => theme.space.xxs2} 0;\n  margin-right: ${({ showCloseButton }) => (!showCloseButton ? '28px' : '0')};\n`;\n\nexport const StyledCloseButtonContainer = styled.div`\n  display: flex;\n  align-items: flex-start;\n  margin-top: 6px;\n  margin-right: 6px;\n`;\nexport const StyledCloseButton = styled(DSButton)`\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  float: right;\n  margin-left: ${({ theme }) => theme.space.xs};\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`;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAEA;AAEO,MAAM,uBAAuB,OAAO;AAAA;AAAA;AAAA;AAAA,sBAIrB,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,6BAC7B,CAAC,EAAE,MAAM,YAAY,kBAAkB,MAAM;AAAA,0BAChD,CAAC,EAAE,aAAc,SAAS,MAAM;AAAA,IACtD,CAAC,EAAE,aAAa,aAAa,gBAAgB,aAAa;AAAA;AAGvD,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAIjC,MAAM,cAAc,OAAO;AAAA,WACvB,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA,eAChC,CAAC,EAAE,YAAY,SAAS,MAAM,UAAU,MAAM;AAAA,iBAC5C,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA,mBAC/B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA;AAAA;AAAA,mCAIX,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,iCAKtC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAI9D,MAAM,iBAAiB,OAAO;AAAA,eACtB,CAAC,EAAE,YAAY,SAAS,MAAM,UAAU,MAAM;AAAA,iBAC5C,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA;AAG3C,MAAM,sBAAsB,OAAO;AAAA;AAAA,kBAExB,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,iBAC5B,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAGrC,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAAA,YAIxB,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA,kBACrB,CAAC,EAAE,sBAAuB,CAAC,kBAAkB,SAAS;AAAA;AAGjE,MAAM,6BAA6B,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAM1C,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAWd,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrD,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA,iBAGtB,CAAC,EAAE,YAAY,MAAM,MAAM;AAAA;AAAA,eAE7B,CAAC,EAAE,YAAY,SAAS,MAAM,UAAU,MAAM;AAAA,iBAC5C,CAAC,EAAE,YAAY,MAAM,YAAY;AAAA,WACvC,CAAC,EAAE,YAAY,MAAM,OAAO,MAAM;AAAA;AAGtC,MAAM,wBAAwB,OAAO;AAAA;AAAA,YAEhC,CAAC,EAAE,aAAc,SAAS,SAAS;AAAA,IAC3C,CAAC,EAAE,aAAa,QAAQ,aAAa,gBAAgB,aAAa,QAAQ;AAAA;",
+  "names": []
+}

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

@@ -0,0 +1,11 @@
+import * as React from "react";
+const MOBILE_BANNER_TYPES = {
+  INFO: "info",
+  SUCCESS: "success",
+  WARNING: "warning",
+  ERROR: "error"
+};
+export {
+  MOBILE_BANNER_TYPES
+};
+//# sourceMappingURL=bannerTypes.js.map

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

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

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

@@ -0,0 +1,25 @@
+import * as React from "react";
+import React2 from "react";
+import { AlertsDetailFill, SuccessFill, InfoFill, WarningSquare } from "@elliemae/ds-icons";
+const icons = {
+  success: /* @__PURE__ */ React2.createElement(SuccessFill, {
+    fill: "#207e56"
+  }),
+  info: /* @__PURE__ */ React2.createElement(InfoFill, {
+    fill: "#1e79c2"
+  }),
+  error: /* @__PURE__ */ React2.createElement(AlertsDetailFill, {
+    width: "24px",
+    height: "24px",
+    fill: "#c64252"
+  }),
+  warning: /* @__PURE__ */ React2.createElement(WarningSquare, {
+    width: "24px",
+    height: "24px",
+    fill: "#d17a00"
+  })
+};
+export {
+  icons
+};
+//# sourceMappingURL=icons.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/MobileBanner/utils/icons.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { AlertsDetailFill, SuccessFill, InfoFill, WarningSquare } from '@elliemae/ds-icons';\n\nexport const icons = {\n  success: <SuccessFill fill=\"#207e56\" />,\n  info: <InfoFill fill=\"#1e79c2\" />,\n  error: <AlertsDetailFill width=\"24px\" height=\"24px\" fill=\"#c64252\" />,\n  warning: <WarningSquare width=\"24px\" height=\"24px\" fill=\"#d17a00\" />,\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AAEO,MAAM,QAAQ;AAAA,EACnB,SAAS,qCAAC,aAAD;AAAA,IAAa,MAAK;AAAA;AAAA,EAC3B,MAAM,qCAAC,UAAD;AAAA,IAAU,MAAK;AAAA;AAAA,EACrB,OAAO,qCAAC,kBAAD;AAAA,IAAkB,OAAM;AAAA,IAAO,QAAO;AAAA,IAAO,MAAK;AAAA;AAAA,EACzD,SAAS,qCAAC,eAAD;AAAA,IAAe,OAAM;AAAA,IAAO,QAAO;AAAA,IAAO,MAAK;AAAA;AAAA;",
+  "names": []
+}

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

@@ -0,0 +1,74 @@
+import * as React from "react";
+import { kfrm, css } from "@elliemae/ds-system";
+import { MOBILE_BANNER_TYPES } from "./bannerTypes";
+const slideIn = kfrm`
+  0% {
+    transform: translate3d(0, -100%, 0);
+  }
+  100% {
+    transform: translate3d(0, 0, 0);
+  }
+`;
+const slideOut = kfrm`
+  0% {
+    transform: translate3d(0, 0, 0);
+    opacity: 1;
+  }
+  60% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+    transform: translate3d(0, -100%, 0);
+  }
+`;
+const spanContainer = (height) => kfrm`
+  0% {
+    height: 0px;
+  }
+  100% {
+    height: ${height}px;
+  }
+`;
+const shrinkContainer = (height) => kfrm`
+  0% {
+    height: ${height}px;
+  }
+  100% {
+    height: 0px;
+  }
+`;
+const handleBorderColor = (type, { colors }) => {
+  switch (type) {
+    case MOBILE_BANNER_TYPES.SUCCESS:
+      return colors.success[900];
+    case MOBILE_BANNER_TYPES.INFO:
+      return colors.brand[600];
+    case MOBILE_BANNER_TYPES.WARNING:
+      return colors.warning[900];
+    case MOBILE_BANNER_TYPES.ERROR:
+      return colors.danger[900];
+  }
+};
+const handleAnimation = (isAnimating, isOpen, height = null) => {
+  if (isAnimating) {
+    if (isOpen) {
+      return css`
+        animation: ${height ? spanContainer(height) : slideIn} 0.5s ease-in;
+      `;
+    } else {
+      return css`
+        animation: ${height ? shrinkContainer(height) : slideOut} 0.5s ease-in;
+      `;
+    }
+  }
+};
+export {
+  handleAnimation,
+  handleBorderColor,
+  shrinkContainer,
+  slideIn,
+  slideOut,
+  spanContainer
+};
+//# sourceMappingURL=styleHelpers.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/MobileBanner/utils/styleHelpers.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { kfrm, css } from '@elliemae/ds-system';\nimport type { FlattenSimpleInterpolation } from 'styled-components';\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"],
+  "mappings": "AAAA;ACAA;AAGA;AAEO,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,aAAqB;AACjF,UAAQ;AAAA,SACD,oBAAoB;AACvB,aAAO,OAAO,QAAQ;AAAA,SACnB,oBAAoB;AACvB,aAAO,OAAO,MAAM;AAAA,SACjB,oBAAoB;AACvB,aAAO,OAAO,QAAQ;AAAA,SACnB,oBAAoB;AACvB,aAAO,OAAO,OAAO;AAAA;AAAA;AAIpB,MAAM,kBAAkB,CAC7B,aACA,QACA,SAAwB,SACO;AAC/B,MAAI,aAAa;AACf,QAAI,QAAQ;AACV,aAAO;AAAA,qBACQ,SAAS,cAAc,UAAU;AAAA;AAAA,WAE3C;AACL,aAAO;AAAA,qBACQ,SAAS,gBAAgB,UAAU;AAAA;AAAA;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/MobileCard/ActionAddon.js

@@ -0,0 +1,38 @@
+import * as React from "react";
+import React2 from "react";
+import PropTypes from "prop-types";
+import styled from "styled-components";
+import { ChevronSmallDown } from "@elliemae/ds-icons";
+import Button from "@elliemae/ds-button";
+const Addon = styled(Button)`
+  background-color: transparent;
+  padding-right: 4px;
+  height: 100%;
+  border: none;
+  font-size: 12px;
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  color: ${(props) => props.theme.colors.brand["700"]};
+  cursor: pointer;
+  &:focus,
+  &::after {
+    background-color: transparent;
+    box-shadow: none !important; /* needed */
+    border: none !important; /* needed */
+  }
+`;
+const ActionAddon = ({ label, onClick, icon }) => /* @__PURE__ */ React2.createElement(Addon, {
+  onClick,
+  labelText: label,
+  icon: icon || /* @__PURE__ */ React2.createElement(ChevronSmallDown, {
+    color: ["brand-primary", 700]
+  })
+});
+ActionAddon.propTypes = {
+  label: PropTypes.string,
+  onClick: PropTypes.func,
+  icon: PropTypes.element
+};
+export {
+  ActionAddon
+};
+//# sourceMappingURL=ActionAddon.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileCard/ActionAddon.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\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"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,QAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAMJ,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,WAC5C,qCAAC,OAAD;AAAA,EAAO;AAAA,EAAkB,WAAW;AAAA,EAAO,MAAM,QAAQ,qCAAC,kBAAD;AAAA,IAAkB,OAAO,CAAC,iBAAiB;AAAA;AAAA;AAGtG,YAAY,YAAY;AAAA,EAItB,OAAO,UAAU;AAAA,EAIjB,SAAS,UAAU;AAAA,EAInB,MAAM,UAAU;AAAA;",
+  "names": []
+}