@elliemae/ds-mobile 3.0.0-next.1 → 3.0.0-next.5

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileFooter/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import DSMobileFooter, { MobileFooterWithSchema } from './Footer';\nimport { DSMobileFooterText, DSMobileFooterTextWithSchema } from './Text';\nimport { DSMobileFooterAction, DSMobileFooterActionWithSchema } from './Action';\n\nexport {\n  DSMobileFooterText,\n  DSMobileFooterAction,\n  DSMobileFooter,\n  DSMobileFooterActionWithSchema,\n  DSMobileFooterTextWithSchema,\n  MobileFooterWithSchema,\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;",
+  "names": []
+}

package/dist/esm/MobileListItem/MobileListItem.js

@@ -0,0 +1,64 @@
+import * as React from "react";
+import React2 from "react";
+import { describe, PropTypes } from "react-desc";
+import styled from "styled-components";
+import { Grid } from "@elliemae/ds-grid";
+import { border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
+const StyledContainer = styled(Grid)`
+  background: ${(props) => props.theme.colors.neutral["000"]};
+  border-bottom: ${(props) => border(props.theme.colors.neutral["300"])};
+`;
+const StyledTitle = styled.div`
+  font-weight: ${(props) => props.theme.fontWeights.semibold};
+  font-size: 13px;
+  color: ${(props) => props.theme.colors.neutral["800"]};
+  ${truncate()}
+`;
+const MobileListItem = ({
+  leftAddon = null,
+  rightAddon = null,
+  title = "",
+  value = "",
+  dataTestid = "mobile-list-item",
+  theme
+}) => {
+  const cols = [1];
+  if (leftAddon)
+    cols.unshift(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
+  if (rightAddon)
+    cols.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));
+  return /* @__PURE__ */ React2.createElement(StyledContainer, {
+    cols,
+    height: theme.space.m,
+    width: "100%",
+    pl: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
+    pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
+    gutter: "xs",
+    "data-testid": `${dataTestid}--${value}`
+  }, leftAddon && /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "center",
+    justifyContent: "center"
+  }, leftAddon), /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "center"
+  }, /* @__PURE__ */ React2.createElement(StyledTitle, null, title)), rightAddon && /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "center",
+    justifyContent: "center"
+  }, rightAddon));
+};
+const DSMobileListItem = withTheme(MobileListItem);
+const listItemProps = {
+  leftAddon: PropTypes.element.description("Element placed at the left"),
+  rightAddon: PropTypes.element.description("Element placed at the right"),
+  title: PropTypes.string.description("Item s title").isRequired,
+  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description("Item s value, used for data-testid attr"),
+  dataTestid: PropTypes.string.description("ID used for testing").defaultValue("mobile-list-item"),
+  theme: PropTypes.object.description("")
+};
+MobileListItem.propTypes = listItemProps;
+const ListItemWithSchema = describe(MobileListItem);
+ListItemWithSchema.propTypes = listItemProps;
+export {
+  DSMobileListItem,
+  ListItemWithSchema
+};
+//# sourceMappingURL=MobileListItem.js.map

package/dist/esm/MobileListItem/MobileListItem.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileListItem/MobileListItem.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\n\nconst StyledContainer = styled(Grid)`\n  background: ${(props) => props.theme.colors.neutral['000']};\n  border-bottom: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\nconst StyledTitle = styled.div`\n  font-weight: ${(props) => props.theme.fontWeights.semibold};\n  font-size: 13px;\n  color: ${(props) => props.theme.colors.neutral['800']};\n  ${truncate()}\n`;\n\nconst MobileListItem = ({\n  leftAddon = null,\n  rightAddon = null,\n  title = '',\n  value = '',\n  dataTestid = 'mobile-list-item',\n  theme,\n}) => {\n  const cols = [1];\n  if (leftAddon) cols.unshift(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));\n  if (rightAddon) cols.push(__UNSAFE_SPACE_TO_DIMSUM(theme.space.m));\n  return (\n    <StyledContainer\n      cols={cols}\n      height={theme.space.m}\n      width=\"100%\"\n      pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n      pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n      gutter=\"xs\"\n      data-testid={`${dataTestid}--${value}`}\n    >\n      {leftAddon && (\n        <Grid alignItems=\"center\" justifyContent=\"center\">\n          {leftAddon}\n        </Grid>\n      )}\n      <Grid alignItems=\"center\">\n        <StyledTitle>{title}</StyledTitle>\n      </Grid>\n      {rightAddon && (\n        <Grid alignItems=\"center\" justifyContent=\"center\">\n          {rightAddon}\n        </Grid>\n      )}\n    </StyledContainer>\n  );\n};\n\nconst DSMobileListItem = withTheme(MobileListItem);\n\nconst listItemProps = {\n  leftAddon: PropTypes.element.description('Element placed at the left'),\n  rightAddon: PropTypes.element.description('Element placed at the right'),\n  title: PropTypes.string.description('Item s title').isRequired,\n  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n    'Item s value, used for data-testid attr',\n  ),\n  dataTestid: PropTypes.string.description('ID used for testing').defaultValue('mobile-list-item'),\n  theme: PropTypes.object.description(''),\n};\n\nMobileListItem.propTypes = listItemProps;\n\nconst ListItemWithSchema = describe(MobileListItem);\nListItemWithSchema.propTypes = listItemProps;\n\nexport { DSMobileListItem, ListItemWithSchema };\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,kBAAkB,OAAO;AAAA,gBACf,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,mBACnC,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAEhE,MAAM,cAAc,OAAO;AAAA,iBACV,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA;AAAA,WAEzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,IAC7C;AAAA;AAGJ,MAAM,iBAAiB,CAAC;AAAA,EACtB,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,aAAa;AAAA,EACb;AAAA,MACI;AACJ,QAAM,OAAO,CAAC;AACd,MAAI;AAAW,SAAK,QAAQ,yBAAyB,MAAM,MAAM;AACjE,MAAI;AAAY,SAAK,KAAK,yBAAyB,MAAM,MAAM;AAC/D,SACE,qCAAC,iBAAD;AAAA,IACE;AAAA,IACA,QAAQ,MAAM,MAAM;AAAA,IACpB,OAAM;AAAA,IACN,IAAI,yBAAyB,MAAM,MAAM;AAAA,IACzC,IAAI,yBAAyB,MAAM,MAAM;AAAA,IACzC,QAAO;AAAA,IACP,eAAa,GAAG,eAAe;AAAA,KAE9B,aACC,qCAAC,MAAD;AAAA,IAAM,YAAW;AAAA,IAAS,gBAAe;AAAA,KACtC,YAGL,qCAAC,MAAD;AAAA,IAAM,YAAW;AAAA,KACf,qCAAC,aAAD,MAAc,SAEf,cACC,qCAAC,MAAD;AAAA,IAAM,YAAW;AAAA,IAAS,gBAAe;AAAA,KACtC;AAAA;AAOX,MAAM,mBAAmB,UAAU;AAEnC,MAAM,gBAAgB;AAAA,EACpB,WAAW,UAAU,QAAQ,YAAY;AAAA,EACzC,YAAY,UAAU,QAAQ,YAAY;AAAA,EAC1C,OAAO,UAAU,OAAO,YAAY,gBAAgB;AAAA,EACpD,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,SAAS,YAC/D;AAAA,EAEF,YAAY,UAAU,OAAO,YAAY,uBAAuB,aAAa;AAAA,EAC7E,OAAO,UAAU,OAAO,YAAY;AAAA;AAGtC,eAAe,YAAY;AAE3B,MAAM,qBAAqB,SAAS;AACpC,mBAAmB,YAAY;",
+  "names": []
+}

package/dist/esm/MobileListItem/index.js

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

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

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

package/dist/esm/MobilePageHeader/MobilePageHeader.js

@@ -0,0 +1,173 @@
+import * as React from "react";
+import React2, { useMemo, useState, useCallback } from "react";
+import { describe, PropTypes } from "react-desc";
+import styled from "styled-components";
+import { TruncatedExpandableText } from "@elliemae/ds-truncated-expandable-text";
+import { Grid } from "@elliemae/ds-grid";
+import { border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
+import { ChevronSmallDown } from "@elliemae/ds-icons";
+import DSButton from "@elliemae/ds-button";
+import MobileSeparator from "../MobileSeparator";
+const StyledTitle = styled(Grid)`
+  font-size: 22px;
+  font-weight: ${(props) => props.theme.fontWeights.regular};
+  color: ${(props) => props.theme.colors.neutral["700"]};
+  min-height: ${(props) => props.withBreadcrumb ? "auto" : "44px"};
+  padding-top: ${(props) => props.withBreadcrumb ? "0" : "6px"};
+`;
+const StyledBreadCrumb = styled.div`
+  font-size: 16px;
+  font-weight: ${(props) => props.theme.fontWeights.regular};
+  color: ${(props) => props.theme.colors.neutral["600"]};
+  ${truncate()}
+`;
+const Label = styled.div`
+  color: ${(props) => props.theme.colors.neutral["500"]};
+  ${truncate()}
+`;
+const Value = styled.div`
+  ${truncate()}
+  color: ${(props) => props.theme.colors.neutral["600"]};
+  ${(props) => props.withMarginRight ? `margin-right: 4px;` : ""}
+  margin-top: ${(props) => props.withBreadcrumb ? "12px" : "0"};
+`;
+const Wrapper = styled(Grid)`
+  border-bottom: ${(props) => border(props.theme.colors.neutral["300"])};
+`;
+const MobilePageHeader = ({
+  pageTitle = null,
+  contextMenu = null,
+  firstAction = null,
+  secondAction = null,
+  backArrow = null,
+  breadCrumb = null,
+  onOpenContextMenu = () => null,
+  value,
+  label,
+  theme
+}) => {
+  const hasValue = value === 0 || value;
+  const countActions = useMemo(() => {
+    let count = 0;
+    if (firstAction)
+      count++;
+    if (secondAction)
+      count++;
+    return count;
+  }, [firstAction, secondAction]);
+  const [open, setOpen] = useState();
+  const handleContext = useCallback(() => {
+    setOpen(!open);
+  }, [open]);
+  const separator = /* @__PURE__ */ React2.createElement(Grid, {
+    height: "32px",
+    alignItems: "center"
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    height: "24px"
+  }, /* @__PURE__ */ React2.createElement(MobileSeparator, {
+    direction: "vertical",
+    margin: "xxs",
+    color: ["neutral", "300"]
+  })));
+  const cols = [1, "auto"];
+  const cols2 = ["auto"];
+  if (countActions)
+    cols.push("auto");
+  if (hasValue)
+    cols2.push("auto");
+  if (label)
+    cols2.push("auto");
+  return /* @__PURE__ */ React2.createElement(Wrapper, {
+    cols,
+    pl: theme.space.xs,
+    pr: theme.space.xs,
+    alignItems: "flex-start",
+    width: "100%",
+    "data-testid": "page-header-wrapper"
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "flex-start",
+    justifyContent: "flex-start",
+    cols: cols2
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    cols: backArrow ? ["auto", 1] : [1],
+    alignItems: "flex-start",
+    pr: countActions === 0 && !hasValue && !label ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : 0
+  }, backArrow && /* @__PURE__ */ React2.createElement(Grid, {
+    height: breadCrumb ? "56px" : "44px",
+    alignItems: "center"
+  }, backArrow), /* @__PURE__ */ React2.createElement(Grid, {
+    flexGrow: 0,
+    pt: !breadCrumb ? 0 : theme.space.xxs
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    cols: ["auto", "auto"],
+    alignItems: "flex-start"
+  }, /* @__PURE__ */ React2.createElement(Grid, null, breadCrumb && /* @__PURE__ */ React2.createElement(StyledBreadCrumb, {
+    "data-testid": "page-header-breadcrum"
+  }, breadCrumb), /* @__PURE__ */ React2.createElement(StyledTitle, {
+    maxWidth: "100%",
+    alignItems: "flex-start",
+    withBreadcrumb: !!breadCrumb,
+    "data-testid": "page-header-title"
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    pt: breadCrumb ? 0 : theme.space.xxxs
+  }, /* @__PURE__ */ React2.createElement(TruncatedExpandableText, {
+    value: pageTitle
+  })))), contextMenu && /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "center",
+    mt: breadCrumb ? "20px" : "8px"
+  }, /* @__PURE__ */ React2.createElement(DSButton, {
+    buttonType: "text",
+    icon: /* @__PURE__ */ React2.createElement(ChevronSmallDown, null),
+    size: "s",
+    onClick: () => {
+      handleContext();
+      onOpenContextMenu();
+    },
+    containerProps: { "data-testid": "trigger-context-menu" }
+  }), React2.cloneElement(contextMenu, {
+    open: contextMenu.props.open !== void 0 ? contextMenu.props.open : open,
+    onChange: (event, item) => {
+      if (contextMenu.props.onChange)
+        contextMenu.props.onChange(event, item);
+      handleContext();
+    }
+  }))))), hasValue && /* @__PURE__ */ React2.createElement(Grid, {
+    height: breadCrumb ? "56px" : "44px",
+    alignItems: "center",
+    cols: ["auto", "auto"]
+  }, separator, /* @__PURE__ */ React2.createElement(Value, {
+    withMarginRight: !!label,
+    "data-testid": "page-header-value"
+  }, value)), label && /* @__PURE__ */ React2.createElement(Grid, {
+    height: breadCrumb ? "56px" : "44px",
+    alignItems: "center"
+  }, /* @__PURE__ */ React2.createElement(Label, {
+    withBreadcrumb: !!breadCrumb,
+    "data-testid": "page-header-label"
+  }, label))), countActions > 0 && /* @__PURE__ */ React2.createElement(Grid, {
+    height: breadCrumb ? "56px" : "44px",
+    alignItems: "center",
+    cols: countActions === 1 ? ["auto"] : ["auto", "auto", "auto"]
+  }, firstAction && /* @__PURE__ */ React2.createElement(Grid, null, firstAction), countActions === 2 && separator, secondAction && /* @__PURE__ */ React2.createElement(Grid, null, secondAction)));
+};
+const pageHeaderProps = {
+  pageTitle: PropTypes.string.description("Page title").isRequired,
+  contextMenu: PropTypes.element.description("Context Menu to open"),
+  onOpenContextMenu: PropTypes.func.description("function called when context menu opens"),
+  firstAction: PropTypes.element.description("Action Button"),
+  secondAction: PropTypes.element.description("Action Button"),
+  backArrow: PropTypes.element.description("Back Arrow Button"),
+  breadCrumb: PropTypes.string.description("BreadCrumbs title"),
+  value: PropTypes.number.description("Page summary value"),
+  label: PropTypes.string.description("Page summary label"),
+  theme: PropTypes.object.description("dimsum theme")
+};
+MobilePageHeader.propTypes = pageHeaderProps;
+const PageHeaderWithSchema = describe(MobilePageHeader);
+PageHeaderWithSchema.propTypes = pageHeaderProps;
+const DSMobilePageHeader = withTheme(MobilePageHeader);
+export {
+  DSMobilePageHeader,
+  PageHeaderWithSchema
+};
+//# sourceMappingURL=MobilePageHeader.js.map

package/dist/esm/MobilePageHeader/MobilePageHeader.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobilePageHeader/MobilePageHeader.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable import/no-unresolved */\n/* eslint-disable no-plusplus */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useMemo, useState, useCallback } from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport styled from 'styled-components';\nimport { TruncatedExpandableText } from '@elliemae/ds-truncated-expandable-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport MobileSeparator from '../MobileSeparator';\n\nconst StyledTitle = styled(Grid)`\n  font-size: 22px;\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  color: ${(props) => props.theme.colors.neutral['700']};\n  min-height: ${(props) => (props.withBreadcrumb ? 'auto' : '44px')};\n  padding-top: ${(props) => (props.withBreadcrumb ? '0' : '6px')};\n`;\n\nconst StyledBreadCrumb = styled.div`\n  font-size: 16px;\n  font-weight: ${(props) => props.theme.fontWeights.regular};\n  color: ${(props) => props.theme.colors.neutral['600']};\n  ${truncate()}\n`;\n\nconst Label = styled.div`\n  color: ${(props) => props.theme.colors.neutral['500']};\n  ${truncate()}\n`;\n\nconst Value = styled.div`\n  ${truncate()}\n  color: ${(props) => props.theme.colors.neutral['600']};\n  ${(props) => (props.withMarginRight ? `margin-right: 4px;` : '')}\n  margin-top: ${(props) => (props.withBreadcrumb ? '12px' : '0')};\n`;\n\nconst Wrapper = styled(Grid)`\n  border-bottom: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nconst MobilePageHeader = ({\n  pageTitle = null,\n  contextMenu = null,\n  firstAction = null,\n  secondAction = null,\n  backArrow = null,\n  breadCrumb = null,\n  onOpenContextMenu = () => null,\n  value,\n  label,\n  theme,\n}) => {\n  const hasValue = value === 0 || value;\n\n  const countActions = useMemo(() => {\n    let count = 0;\n    if (firstAction) count++;\n    if (secondAction) count++;\n    return count;\n  }, [firstAction, secondAction]);\n  const [open, setOpen] = useState();\n  const handleContext = useCallback(() => {\n    setOpen(!open);\n  }, [open]);\n\n  const separator = (\n    <Grid height=\"32px\" alignItems=\"center\">\n      <Grid height=\"24px\">\n        <MobileSeparator direction=\"vertical\" margin=\"xxs\" color={['neutral', '300']} />\n      </Grid>\n    </Grid>\n  );\n  const cols = [1, 'auto'];\n  const cols2 = ['auto'];\n  if (countActions) cols.push('auto');\n  if (hasValue) cols2.push('auto');\n  if (label) cols2.push('auto');\n\n  return (\n    <Wrapper\n      cols={cols}\n      pl={theme.space.xs}\n      pr={theme.space.xs}\n      alignItems=\"flex-start\"\n      width=\"100%\"\n      data-testid=\"page-header-wrapper\"\n    >\n      <Grid alignItems=\"flex-start\" justifyContent=\"flex-start\" cols={cols2}>\n        <Grid\n          cols={backArrow ? ['auto', 1] : [1]}\n          alignItems=\"flex-start\"\n          pr={countActions === 0 && !hasValue && !label ? __UNSAFE_SPACE_TO_DIMSUM(theme.space.s) : 0}\n        >\n          {backArrow && (\n            <Grid height={breadCrumb ? '56px' : '44px'} alignItems=\"center\">\n              {backArrow}\n            </Grid>\n          )}\n          <Grid flexGrow={0} pt={!breadCrumb ? 0 : theme.space.xxs}>\n            <Grid cols={['auto', 'auto']} alignItems=\"flex-start\">\n              <Grid>\n                {breadCrumb && <StyledBreadCrumb data-testid=\"page-header-breadcrum\">{breadCrumb}</StyledBreadCrumb>}\n                <StyledTitle\n                  maxWidth=\"100%\"\n                  alignItems=\"flex-start\"\n                  withBreadcrumb={!!breadCrumb}\n                  data-testid=\"page-header-title\"\n                >\n                  <Grid pt={breadCrumb ? 0 : theme.space.xxxs}>\n                    <TruncatedExpandableText value={pageTitle} />\n                  </Grid>\n                </StyledTitle>\n              </Grid>\n              {contextMenu && (\n                <Grid alignItems=\"center\" mt={breadCrumb ? '20px' : '8px'}>\n                  <DSButton\n                    buttonType=\"text\"\n                    icon={<ChevronSmallDown />}\n                    size=\"s\"\n                    onClick={() => {\n                      handleContext();\n                      onOpenContextMenu();\n                    }}\n                    containerProps={{ 'data-testid': 'trigger-context-menu' }}\n                  />\n                  {React.cloneElement(contextMenu, {\n                    open: contextMenu.props.open !== undefined ? contextMenu.props.open : open,\n                    onChange: (event, item) => {\n                      if (contextMenu.props.onChange) contextMenu.props.onChange(event, item);\n                      handleContext();\n                    },\n                  })}\n                </Grid>\n              )}\n            </Grid>\n          </Grid>\n        </Grid>\n        {hasValue && (\n          <Grid height={breadCrumb ? '56px' : '44px'} alignItems=\"center\" cols={['auto', 'auto']}>\n            {separator}\n            <Value withMarginRight={!!label} data-testid=\"page-header-value\">\n              {value}\n            </Value>\n          </Grid>\n        )}\n        {label && (\n          <Grid height={breadCrumb ? '56px' : '44px'} alignItems=\"center\">\n            <Label withBreadcrumb={!!breadCrumb} data-testid=\"page-header-label\">\n              {label}\n            </Label>\n          </Grid>\n        )}\n      </Grid>\n      {countActions > 0 && (\n        <Grid\n          height={breadCrumb ? '56px' : '44px'}\n          alignItems=\"center\"\n          cols={countActions === 1 ? ['auto'] : ['auto', 'auto', 'auto']}\n        >\n          {firstAction && <Grid>{firstAction}</Grid>}\n          {countActions === 2 && separator}\n          {secondAction && <Grid>{secondAction}</Grid>}\n        </Grid>\n      )}\n    </Wrapper>\n  );\n};\n\nconst pageHeaderProps = {\n  pageTitle: PropTypes.string.description('Page title').isRequired,\n  contextMenu: PropTypes.element.description('Context Menu to open'),\n  onOpenContextMenu: PropTypes.func.description('function called when context menu opens'),\n  firstAction: PropTypes.element.description('Action Button'),\n  secondAction: PropTypes.element.description('Action Button'),\n  backArrow: PropTypes.element.description('Back Arrow Button'),\n  breadCrumb: PropTypes.string.description('BreadCrumbs title'),\n  value: PropTypes.number.description('Page summary value'),\n  label: PropTypes.string.description('Page summary label'),\n  theme: PropTypes.object.description('dimsum theme'),\n};\n\nMobilePageHeader.propTypes = pageHeaderProps;\n\nconst PageHeaderWithSchema = describe(MobilePageHeader);\nPageHeaderWithSchema.propTypes = pageHeaderProps;\n\nconst DSMobilePageHeader = withTheme(MobilePageHeader);\n\nexport { DSMobilePageHeader, PageHeaderWithSchema };\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/MobilePageHeader/index.js

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

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

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

package/dist/esm/MobileSelectList/MobileSelectList.js

@@ -0,0 +1,146 @@
+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, { useState, useEffect } from "react";
+import { noop } from "lodash";
+import PropTypes from "prop-types";
+import { Grid } from "@elliemae/ds-grid";
+import { DSTextBox } from "@elliemae/ds-form";
+import { op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
+import { DSMobileTouchable } from "../MobileTouchable";
+import { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from "./styled";
+const MobileSelectList = ({
+  open = false,
+  header = null,
+  multiple = false,
+  onChange = noop,
+  children,
+  theme,
+  zIndex = 1,
+  useSearch,
+  onSearch = noop,
+  dataTestid = "mobile-select-list",
+  buttonFooter = null,
+  onApply = noop,
+  selecteds: initSelecteds = []
+}) => {
+  const rows = ["auto", 1];
+  const [selecteds, setSelected] = useState(initSelecteds);
+  const [filter, setFilter] = useState("");
+  useEffect(() => {
+    setSelected(initSelecteds);
+  }, [initSelecteds]);
+  const handleSelection = (value) => {
+    if (multiple) {
+      const index = selecteds.findIndex((s) => s === value);
+      if (index > -1)
+        setSelected(selecteds.filter((s) => s !== value));
+      else
+        setSelected([...selecteds, value]);
+    } else
+      setSelected([value]);
+  };
+  const handleChange = function(event) {
+    onChange(event, this);
+    handleSelection(this.value);
+  };
+  const handleOnSearch = (e) => {
+    setFilter(e.target.value);
+    onSearch(e);
+  };
+  const handleApply = function(e) {
+    if (this.onClick)
+      this.onClick(e);
+    onApply(e, selecteds);
+  };
+  if (buttonFooter)
+    rows.push(op("*", __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 1.16666));
+  if (!open)
+    return null;
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(StyledContainer, {
+    "data-testid": dataTestid,
+    rows,
+    zIndex
+  }, /* @__PURE__ */ React2.createElement(HeaderContainer, null, header, useSearch && /* @__PURE__ */ React2.createElement(Grid, {
+    alignItems: "center",
+    height: __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl),
+    pl: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
+    pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
+  }, /* @__PURE__ */ React2.createElement(DSTextBox, {
+    onChange: handleOnSearch,
+    placeholder: "Filter by name",
+    value: filter
+  }))), /* @__PURE__ */ React2.createElement(Grid, {
+    style: { overflow: "hidden" }
+  }, /* @__PURE__ */ React2.createElement(Grid, {
+    style: { overflow: "auto" }
+  }, /* @__PURE__ */ React2.createElement(ListContainer, {
+    "data-testid": `${dataTestid}--list-container`
+  }, React2.Children.map(children, (child) => {
+    let leftAddon = null;
+    let rightAddon = null;
+    const { value, title } = child.props;
+    const found = selecteds.findIndex((s) => String(s) === String(value));
+    if (filter && !String(value).toLocaleLowerCase().includes(filter.toLocaleLowerCase()) && !String(title).toLocaleLowerCase().includes(filter.toLocaleLowerCase()))
+      return null;
+    if (multiple) {
+      if (found > -1)
+        leftAddon = checked;
+      else
+        leftAddon = checkbox;
+    } else if (found > -1) {
+      rightAddon = selectedMark;
+    }
+    return /* @__PURE__ */ React2.createElement(DSMobileTouchable, {
+      onClick: handleChange.bind(child.props)
+    }, React2.cloneElement(child, { leftAddon, rightAddon }));
+  })))), buttonFooter && /* @__PURE__ */ React2.createElement(Footer, {
+    alignItems: "center",
+    pl: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s),
+    pr: __UNSAFE_SPACE_TO_DIMSUM(theme.space.s)
+  }, React2.cloneElement(buttonFooter, __spreadProps(__spreadValues({}, buttonFooter.props), {
+    containerProps: {
+      "data-testid": `${dataTestid}--btn`
+    },
+    buttonType: "primary",
+    size: "l",
+    onClick: handleApply.bind(buttonFooter.props)
+  })))));
+};
+const DSMobileSelectList = withTheme(MobileSelectList);
+MobileSelectList.propTypes = {
+  open: PropTypes.bool,
+  header: PropTypes.element,
+  onChange: PropTypes.func,
+  multiple: PropTypes.bool,
+  children: PropTypes.arrayOf(PropTypes.element),
+  dataTestid: PropTypes.string,
+  buttonFooter: PropTypes.element,
+  onApply: PropTypes.func,
+  zIndex: PropTypes.number,
+  selecteds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
+  theme: PropTypes.object.isRequired,
+  useSearch: PropTypes.bool,
+  onSearch: PropTypes.func
+};
+export {
+  DSMobileSelectList
+};
+//# sourceMappingURL=MobileSelectList.js.map

package/dist/esm/MobileSelectList/MobileSelectList.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileSelectList/MobileSelectList.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint react/jsx-no-bind:0 react/no-this-in-sfc:0 */\nimport React, { useState, useEffect } from 'react';\nimport { noop } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSTextBox } from '@elliemae/ds-form';\nimport { op, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { DSMobileTouchable } from '../MobileTouchable';\nimport { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from './styled';\n\nconst MobileSelectList = ({\n  open = false,\n  header = null,\n  multiple = false,\n  onChange = noop,\n  children,\n  theme,\n  zIndex = 1,\n  useSearch,\n  onSearch = noop,\n  dataTestid = 'mobile-select-list',\n  buttonFooter = null,\n  onApply = noop,\n  selecteds: initSelecteds = [],\n}) => {\n  const rows = ['auto', 1];\n  const [selecteds, setSelected] = useState(initSelecteds);\n  const [filter, setFilter] = useState('');\n  useEffect(() => {\n    setSelected(initSelecteds);\n  }, [initSelecteds]);\n\n  const handleSelection = (value) => {\n    if (multiple) {\n      const index = selecteds.findIndex((s) => s === value);\n      if (index > -1) setSelected(selecteds.filter((s) => s !== value));\n      else setSelected([...selecteds, value]);\n    } else setSelected([value]);\n  };\n  const handleChange = function (event) {\n    onChange(event, this);\n    handleSelection(this.value);\n  };\n  const handleOnSearch = (e) => {\n    setFilter(e.target.value);\n    onSearch(e);\n  };\n\n  const handleApply = function (e) {\n    if (this.onClick) this.onClick(e);\n    onApply(e, selecteds);\n  };\n  if (buttonFooter) rows.push(op('*', __UNSAFE_SPACE_TO_DIMSUM(theme.space.xl), 1.16666));\n  if (!open) return null;\n  return (\n    <>\n      <StyledContainer data-testid={dataTestid} rows={rows} zIndex={zIndex}>\n        <HeaderContainer>\n          {header}\n          {useSearch && (\n            <Grid\n              alignItems=\"center\"\n              height={__UNSAFE_SPACE_TO_DIMSUM(theme.space.xl)}\n              pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n              pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n            >\n              <DSTextBox onChange={handleOnSearch} placeholder=\"Filter by name\" value={filter} />\n            </Grid>\n          )}\n        </HeaderContainer>\n        <Grid style={{ overflow: 'hidden' }}>\n          <Grid style={{ overflow: 'auto' }}>\n            <ListContainer data-testid={`${dataTestid}--list-container`}>\n              {React.Children.map(children, (child) => {\n                let leftAddon = null;\n                let rightAddon = null;\n                const { value, title } = child.props;\n                const found = selecteds.findIndex((s) => String(s) === String(value));\n                if (\n                  filter &&\n                  !String(value).toLocaleLowerCase().includes(filter.toLocaleLowerCase()) &&\n                  !String(title).toLocaleLowerCase().includes(filter.toLocaleLowerCase())\n                )\n                  return null;\n                if (multiple) {\n                  if (found > -1) leftAddon = checked;\n                  else leftAddon = checkbox;\n                } else if (found > -1) {\n                  rightAddon = selectedMark;\n                }\n                return (\n                  <DSMobileTouchable onClick={handleChange.bind(child.props)}>\n                    {React.cloneElement(child, { leftAddon, rightAddon })}\n                  </DSMobileTouchable>\n                );\n              })}\n            </ListContainer>\n          </Grid>\n        </Grid>\n        {buttonFooter && (\n          <Footer\n            alignItems=\"center\"\n            // eslint-disable-next-line max-lines\n            pl={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n            pr={__UNSAFE_SPACE_TO_DIMSUM(theme.space.s)}\n          >\n            {React.cloneElement(buttonFooter, {\n              ...buttonFooter.props,\n              containerProps: {\n                'data-testid': `${dataTestid}--btn`,\n              },\n              buttonType: 'primary',\n              size: 'l',\n              onClick: handleApply.bind(buttonFooter.props),\n            })}\n          </Footer>\n        )}\n      </StyledContainer>\n    </>\n  );\n};\n\nconst DSMobileSelectList = withTheme(MobileSelectList);\n\nMobileSelectList.propTypes = {\n  /** show select list */\n  open: PropTypes.bool,\n  /** DSMobilePageHeader instance */\n  header: PropTypes.element,\n  /** called when a DSMobileListItem is touched */\n  onChange: PropTypes.func,\n  /** allow multiple selection */\n  multiple: PropTypes.bool,\n  /** Array of DSMobileListItem instances */\n  children: PropTypes.arrayOf(PropTypes.element),\n  /** data test id for testing purposes */\n  dataTestid: PropTypes.string,\n  /** footer action, DSButton instance */\n  buttonFooter: PropTypes.element,\n  /** called when footer action is triggered */\n  onApply: PropTypes.func,\n  /** zIndex */\n  zIndex: PropTypes.number,\n  /** init selecteds */\n  selecteds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n  theme: PropTypes.object.isRequired,\n  useSearch: PropTypes.bool,\n  onSearch: PropTypes.func,\n};\n\nexport { DSMobileSelectList };\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/MobileSelectList/index.js

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

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

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

package/dist/esm/MobileSelectList/styled.js

@@ -0,0 +1,54 @@
+import * as React from "react";
+import React2 from "react";
+import { noop } from "lodash";
+import styled from "styled-components";
+import { Grid } from "@elliemae/ds-grid";
+import { DSCheckbox } from "@elliemae/ds-form";
+import { Checkmark } from "@elliemae/ds-icons";
+import { border } from "@elliemae/ds-system";
+import { DSMobileTouchable } from "../MobileTouchable";
+import { DSMobileListItem } from "../MobileListItem";
+const StyledContainer = styled(Grid)`
+  background: ${(props) => props.theme.colors.neutral["000"]};
+  z-index: ${(props) => props.zIndex};
+  position: fixed;
+  width: 100%;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 100%;
+`;
+const HeaderContainer = styled(Grid)`
+  border-bottom: ${(props) => border(props.theme.colors.neutral["300"])};
+`;
+const Footer = styled(Grid)`
+  border-top: ${(props) => border(props.theme.colors.neutral["300"])};
+`;
+const ListContainer = styled.div`
+  & ${DSMobileTouchable}:last-child ${DSMobileListItem} {
+    border: none;
+  }
+`;
+const checkbox = /* @__PURE__ */ React2.createElement(DSCheckbox, {
+  checked: false,
+  onChange: noop,
+  style: { pointerEvents: "none" }
+});
+const checked = /* @__PURE__ */ React2.createElement(DSCheckbox, {
+  checked: true,
+  onChange: noop,
+  style: { pointerEvents: "none" }
+});
+const selectedMark = /* @__PURE__ */ React2.createElement(Checkmark, {
+  color: ["brand-primary", 600]
+});
+export {
+  Footer,
+  HeaderContainer,
+  ListContainer,
+  StyledContainer,
+  checkbox,
+  checked,
+  selectedMark
+};
+//# sourceMappingURL=styled.js.map

package/dist/esm/MobileSelectList/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileSelectList/styled.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { noop } from 'lodash';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { border } from '@elliemae/ds-system';\nimport { DSMobileTouchable } from '../MobileTouchable';\nimport { DSMobileListItem } from '../MobileListItem';\n\nexport const StyledContainer = styled(Grid)`\n  background: ${(props) => props.theme.colors.neutral['000']};\n  z-index: ${(props) => props.zIndex};\n  position: fixed;\n  width: 100%;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: 100%;\n`;\n\nexport const HeaderContainer = styled(Grid)`\n  border-bottom: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const Footer = styled(Grid)`\n  border-top: ${(props) => border(props.theme.colors.neutral['300'])};\n`;\n\nexport const ListContainer = styled.div`\n  & ${DSMobileTouchable}:last-child ${DSMobileListItem} {\n    border: none;\n  }\n`;\n\nexport const checkbox = <DSCheckbox checked={false} onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const checked = <DSCheckbox checked onChange={noop} style={{ pointerEvents: 'none' }} />;\nexport const selectedMark = <Checkmark color={['brand-primary', 600]} />;\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEO,MAAM,kBAAkB,OAAO;AAAA,gBACtB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,aACzC,CAAC,UAAU,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvB,MAAM,kBAAkB,OAAO;AAAA,mBACnB,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGzD,MAAM,SAAS,OAAO;AAAA,gBACb,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ;AAAA;AAGtD,MAAM,gBAAgB,OAAO;AAAA,MAC9B,gCAAgC;AAAA;AAAA;AAAA;AAK/B,MAAM,WAAW,qCAAC,YAAD;AAAA,EAAY,SAAS;AAAA,EAAO,UAAU;AAAA,EAAM,OAAO,EAAE,eAAe;AAAA;AACrF,MAAM,UAAU,qCAAC,YAAD;AAAA,EAAY,SAAO;AAAA,EAAC,UAAU;AAAA,EAAM,OAAO,EAAE,eAAe;AAAA;AAC5E,MAAM,eAAe,qCAAC,WAAD;AAAA,EAAW,OAAO,CAAC,iBAAiB;AAAA;",
+  "names": []
+}

package/dist/esm/MobileSeparator/Separator.js

@@ -0,0 +1,53 @@
+var __defProp = Object.defineProperty;
+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;
+};
+import * as React from "react";
+import React2 from "react";
+import { describe, PropTypes } from "react-desc";
+import styled from "styled-components";
+import { Grid } from "@elliemae/ds-grid";
+const Separator = styled(Grid)`
+  border-top: ${({ theme, color, borderType }) => `${theme.colors[color[0]][color[1]]} 1px ${borderType}`};
+  border-left: ${({ theme, color, borderType }) => `${theme.colors[color[0]][color[1]]} 1px ${borderType}`};
+`;
+const MobileSeparator = ({ color = ["neutral", "800"], direction = "horizontal", type = "solid", margin = "xs" }) => {
+  const orientation = direction === "vertical" ? "height" : "width";
+  const xORy = direction === "vertical" ? "mx" : "my";
+  const styles = {
+    width: 0,
+    height: 0,
+    [orientation]: "100%",
+    [xORy]: margin,
+    borderType: type,
+    color
+  };
+  return /* @__PURE__ */ React2.createElement(Separator, __spreadValues({}, styles));
+};
+const mobileSeparatorProps = {
+  type: PropTypes.oneOf(["solid", "dashed"]).description("Style type of separator").defaultValue("solid"),
+  direction: PropTypes.oneOf(["vertical", "horizontal"]).description("Direction of the separator").defaultValue("horizontal"),
+  color: PropTypes.array.description("Color of the separator").defaultValue(["neutral", "800"]),
+  margin: PropTypes.oneOf(["xxs", "xs", "s", "m", "l", "xl", "xxl"]).description("Margin of the separator").defaultValue("xs")
+};
+MobileSeparator.propTypes = mobileSeparatorProps;
+const MobileSeparatorWithSchema = describe(MobileSeparator);
+MobileSeparatorWithSchema.propTypes = mobileSeparatorProps;
+var Separator_default = MobileSeparator;
+export {
+  MobileSeparatorWithSchema,
+  Separator_default as default
+};
+//# sourceMappingURL=Separator.js.map

package/dist/esm/MobileSeparator/Separator.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileSeparator/Separator.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, PropTypes } from 'react-desc';\nimport styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst Separator = styled(Grid)`\n  border-top: ${({ theme, color, borderType }) => `${theme.colors[color[0]][color[1]]} 1px ${borderType}`};\n  border-left: ${({ theme, color, borderType }) => `${theme.colors[color[0]][color[1]]} 1px ${borderType}`};\n`;\n\nconst MobileSeparator = ({ color = ['neutral', '800'], direction = 'horizontal', type = 'solid', margin = 'xs' }) => {\n  const orientation = direction === 'vertical' ? 'height' : 'width';\n  const xORy = direction === 'vertical' ? 'mx' : 'my';\n  const styles = {\n    width: 0,\n    height: 0,\n    [orientation]: '100%',\n    [xORy]: margin,\n    borderType: type,\n    color,\n  };\n  return <Separator {...styles} />;\n};\n\nconst mobileSeparatorProps = {\n  type: PropTypes.oneOf(['solid', 'dashed']).description('Style type of separator').defaultValue('solid'),\n  direction: PropTypes.oneOf(['vertical', 'horizontal'])\n    .description('Direction of the separator')\n    .defaultValue('horizontal'),\n  color: PropTypes.array.description('Color of the separator').defaultValue(['neutral', '800']),\n  margin: PropTypes.oneOf(['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl'])\n    .description('Margin of the separator')\n    .defaultValue('xs'),\n};\n\nMobileSeparator.propTypes = mobileSeparatorProps;\n\nconst MobileSeparatorWithSchema = describe(MobileSeparator);\nMobileSeparatorWithSchema.propTypes = mobileSeparatorProps;\n\nexport { MobileSeparatorWithSchema };\nexport default MobileSeparator;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AAEA,MAAM,YAAY,OAAO;AAAA,gBACT,CAAC,EAAE,OAAO,OAAO,iBAAiB,GAAG,MAAM,OAAO,MAAM,IAAI,MAAM,WAAW;AAAA,iBAC5E,CAAC,EAAE,OAAO,OAAO,iBAAiB,GAAG,MAAM,OAAO,MAAM,IAAI,MAAM,WAAW;AAAA;AAG9F,MAAM,kBAAkB,CAAC,EAAE,QAAQ,CAAC,WAAW,QAAQ,YAAY,cAAc,OAAO,SAAS,SAAS,WAAW;AACnH,QAAM,cAAc,cAAc,aAAa,WAAW;AAC1D,QAAM,OAAO,cAAc,aAAa,OAAO;AAC/C,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,IACP,QAAQ;AAAA,KACP,cAAc;AAAA,KACd,OAAO;AAAA,IACR,YAAY;AAAA,IACZ;AAAA;AAEF,SAAO,qCAAC,WAAD,mBAAe;AAAA;AAGxB,MAAM,uBAAuB;AAAA,EAC3B,MAAM,UAAU,MAAM,CAAC,SAAS,WAAW,YAAY,2BAA2B,aAAa;AAAA,EAC/F,WAAW,UAAU,MAAM,CAAC,YAAY,eACrC,YAAY,8BACZ,aAAa;AAAA,EAChB,OAAO,UAAU,MAAM,YAAY,0BAA0B,aAAa,CAAC,WAAW;AAAA,EACtF,QAAQ,UAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,QACxD,YAAY,2BACZ,aAAa;AAAA;AAGlB,gBAAgB,YAAY;AAE5B,MAAM,4BAA4B,SAAS;AAC3C,0BAA0B,YAAY;AAGtC,IAAO,oBAAQ;",
+  "names": []
+}