@elliemae/ds-mobile 3.16.0 → 3.16.1-rc.10

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileListItem/MobileListSeparator.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledContainer, StyledTitle } from './style';\n\nexport const MobileListSingleItem: React.ComponentType<MobileListSingleItemT> = (props) => {\n  const { title, isSelected } = props;\n  const globalsAttrs = useGetGlobalAttributes(props);\n  return (\n    <StyledContainer cols={['auto']} height=\"40px\" width=\"100%\" pl=\"16px\" pr=\"16px\" gutter=\"xs\" {...globalsAttrs}>\n      <Grid alignItems=\"center\">{isSelected && <Checkmark color={['brand-primary', '600']} />}</Grid>\n      <Grid alignItems=\"center\">\n        <StyledTitle>{title}</StyledTitle>\n      </Grid>\n    </StyledContainer>\n  );\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledContainer, StyledTitle } from './style.js';\n\nexport const MobileListSingleItem: React.ComponentType<MobileListSingleItemT> = (props) => {\n  const { title, isSelected } = props;\n  const globalsAttrs = useGetGlobalAttributes(props);\n  return (\n    <StyledContainer cols={['auto']} height=\"40px\" width=\"100%\" pl=\"16px\" pr=\"16px\" gutter=\"xs\" {...globalsAttrs}>\n      <Grid alignItems=\"center\">{isSelected && <Checkmark color={['brand-primary', '600']} />}</Grid>\n      <Grid alignItems=\"center\">\n        <StyledTitle>{title}</StyledTitle>\n      </Grid>\n    </StyledContainer>\n  );\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACSnB,SAC2C,KAD3C;AARJ,SAAS,YAAY;AACrB,SAAS,8BAA8B;AACvC,SAAS,iBAAiB,mBAAmB;AAEtC,MAAM,uBAAmE,CAAC,UAAU;AACzF,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,eAAe,uBAAuB,KAAK;AACjD,SACE,qBAAC,mBAAgB,MAAM,CAAC,MAAM,GAAG,QAAO,QAAO,OAAM,QAAO,IAAG,QAAO,IAAG,QAAO,QAAO,MAAM,GAAG,cAC9F;AAAA,wBAAC,QAAK,YAAW,UAAU,wBAAc,oBAAC,aAAU,OAAO,CAAC,iBAAiB,KAAK,GAAG,GAAG;AAAA,IACxF,oBAAC,QAAK,YAAW,UACf,8BAAC,eAAa,iBAAM,GACtB;AAAA,KACF;AAEJ;",
   "names": []
 }

package/dist/esm/MobileListItem/MobileListSingleItem.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Grid } from "@elliemae/ds-grid";
 import { Checkmark } from "@elliemae/ds-icons";
 import { useGetGlobalAttributes } from "@elliemae/ds-props-helpers";
-import { StyledContainer, StyledTitle } from "./style";
+import { StyledContainer, StyledTitle } from "./style.js";
 const MobileListSingleItem = (props) => {
   const { title, isSelected } = props;
   const globalsAttrs = useGetGlobalAttributes(props);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileListItem/MobileListSingleItem.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledContainer, StyledTitle } from './style';\ninterface MobileListSingleItemT {\n  title: string;\n  value: string;\n  isSelected: boolean;\n}\nexport const MobileListSingleItem: React.ComponentType<MobileListSingleItemT> = (props) => {\n  const { title, isSelected } = props;\n  const globalsAttrs = useGetGlobalAttributes(props);\n  return (\n    <StyledContainer\n      cols={['16px', 'auto']}\n      height=\"40px\"\n      width=\"100%\"\n      pl=\"16px\"\n      pr=\"16px\"\n      gutter=\"xs\"\n      {...globalsAttrs}\n    >\n      <Grid alignItems=\"center\">{isSelected && <Checkmark color={['brand-primary', '600']} />}</Grid>\n      <Grid alignItems=\"center\">\n        <StyledTitle>{title}</StyledTitle>\n      </Grid>\n    </StyledContainer>\n  );\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { useGetGlobalAttributes } from '@elliemae/ds-props-helpers';\nimport { StyledContainer, StyledTitle } from './style.js';\ninterface MobileListSingleItemT {\n  title: string;\n  value: string;\n  isSelected: boolean;\n}\nexport const MobileListSingleItem: React.ComponentType<MobileListSingleItemT> = (props) => {\n  const { title, isSelected } = props;\n  const globalsAttrs = useGetGlobalAttributes(props);\n  return (\n    <StyledContainer\n      cols={['16px', 'auto']}\n      height=\"40px\"\n      width=\"100%\"\n      pl=\"16px\"\n      pr=\"16px\"\n      gutter=\"xs\"\n      {...globalsAttrs}\n    >\n      <Grid alignItems=\"center\">{isSelected && <Checkmark color={['brand-primary', '600']} />}</Grid>\n      <Grid alignItems=\"center\">\n        <StyledTitle>{title}</StyledTitle>\n      </Grid>\n    </StyledContainer>\n  );\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACcnB,SAS2C,KAT3C;AAbJ,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAC1B,SAAS,8BAA8B;AACvC,SAAS,iBAAiB,mBAAmB;AAMtC,MAAM,uBAAmE,CAAC,UAAU;AACzF,QAAM,EAAE,OAAO,WAAW,IAAI;AAC9B,QAAM,eAAe,uBAAuB,KAAK;AACjD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,QAAO;AAAA,MACP,OAAM;AAAA,MACN,IAAG;AAAA,MACH,IAAG;AAAA,MACH,QAAO;AAAA,MACN,GAAG;AAAA,MAEJ;AAAA,4BAAC,QAAK,YAAW,UAAU,wBAAc,oBAAC,aAAU,OAAO,CAAC,iBAAiB,KAAK,GAAG,GAAG;AAAA,QACxF,oBAAC,QAAK,YAAW,UACf,8BAAC,eAAa,iBAAM,GACtB;AAAA;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/MobileListItem/index.js

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

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

@@ -1,7 +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';\nexport * from './MobileListSingleItem';\nexport * from './MobileListMultipleItem';\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './MobileListItem.js';\nexport * from './MobileListSingleItem.js';\nexport * from './MobileListMultipleItem.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileListItem/style.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nexport const StyledContainer = styled(Grid)`\n  background: ${(props) => props.theme.colors.neutral['000']};\n`;\n\nexport const StyledTitle = styled.div`\n  font-size: 16px;\n  overflow-wrap: break-word;\n  white-space: pre-wrap;\n`;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAEd,MAAM,kBAAkB,OAAO,IAAI;AAAA,gBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG/C,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;",
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAEd,MAAM,kBAAkB,OAAO,IAAI;AAAA,gBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAGpD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;",
   "names": []
 }

package/dist/esm/MobilePageHeader/MobilePageHeader.js

@@ -7,7 +7,7 @@ import { TruncatedExpandableText } from "@elliemae/ds-truncated-expandable-text"
 import { Grid } from "@elliemae/ds-grid";
 import { ChevronSmallDown } from "@elliemae/ds-icons";
 import DSButton from "@elliemae/ds-button";
-import MobileSeparator from "../MobileSeparator";
+import MobileSeparator from "../MobileSeparator/index.js";
 const StyledTitle = styled(Grid)`
   font-size: 22px;
   font-weight: ${(props) => props.theme.fontWeights.regular};

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

@@ -1,7 +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 '@elliemae/ds-props-helpers';\nimport { styled, border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { TruncatedExpandableText } from '@elliemae/ds-truncated-expandable-text';\nimport { Grid } from '@elliemae/ds-grid';\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  line-height: 1.15;\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)<{ withBlueBorder: boolean }>`\n  border-bottom: ${({ theme, withBlueBorder }) =>\n    border(withBlueBorder ? theme.colors.brand['700'] : theme.colors.neutral['300'])};\n`;\n\nconst MobilePageHeader = ({\n  pageTitle = null,\n  withBlueBorder = false,\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      withBlueBorder={withBlueBorder}\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\" pr=\"16px\">\n              {backArrow}\n            </Grid>\n          )}\n          <Grid flexGrow={0} pt={!breadCrumb ? 0 : theme.space.xxs}>\n            <Grid>\n              <Grid>\n                {breadCrumb && <StyledBreadCrumb data-testid=\"page-header-breadcrum\">{breadCrumb}</StyledBreadCrumb>}\n                <StyledTitle\n                  cols={['auto', '1fr']}\n                  gutter=\"xxxs\"\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} alignItems=\"flex-start\" justifyItems=\"center\">\n                    <TruncatedExpandableText value={pageTitle} />\n                  </Grid>\n                  {contextMenu ? (\n                    <Grid alignItems=\"center\">\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                  ) : null}\n                </StyledTitle>\n              </Grid>\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;\nMobilePageHeader.displayName = 'MobilePageHeader';\nconst PageHeaderWithSchema = describe(MobilePageHeader);\nPageHeaderWithSchema.propTypes = pageHeaderProps;\n\nconst DSMobilePageHeader = withTheme(MobilePageHeader);\n\nexport { DSMobilePageHeader, PageHeaderWithSchema };\n"],
-  "mappings": "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",
+  "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 '@elliemae/ds-props-helpers';\nimport { styled, border, truncate, withTheme, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { TruncatedExpandableText } from '@elliemae/ds-truncated-expandable-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { ChevronSmallDown } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport MobileSeparator from '../MobileSeparator/index.js';\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  line-height: 1.15;\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)<{ withBlueBorder: boolean }>`\n  border-bottom: ${({ theme, withBlueBorder }) =>\n    border(withBlueBorder ? theme.colors.brand['700'] : theme.colors.neutral['300'])};\n`;\n\nconst MobilePageHeader = ({\n  pageTitle = null,\n  withBlueBorder = false,\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      withBlueBorder={withBlueBorder}\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\" pr=\"16px\">\n              {backArrow}\n            </Grid>\n          )}\n          <Grid flexGrow={0} pt={!breadCrumb ? 0 : theme.space.xxs}>\n            <Grid>\n              <Grid>\n                {breadCrumb && <StyledBreadCrumb data-testid=\"page-header-breadcrum\">{breadCrumb}</StyledBreadCrumb>}\n                <StyledTitle\n                  cols={['auto', '1fr']}\n                  gutter=\"xxxs\"\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} alignItems=\"flex-start\" justifyItems=\"center\">\n                    <TruncatedExpandableText value={pageTitle} />\n                  </Grid>\n                  {contextMenu ? (\n                    <Grid alignItems=\"center\">\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                  ) : null}\n                </StyledTitle>\n              </Grid>\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;\nMobilePageHeader.displayName = 'MobilePageHeader';\nconst PageHeaderWithSchema = describe(MobilePageHeader);\nPageHeaderWithSchema.propTypes = pageHeaderProps;\n\nconst DSMobilePageHeader = withTheme(MobilePageHeader);\n\nexport { DSMobilePageHeader, PageHeaderWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC2Ef,cA+CY,YA/CZ;AAvER,OAAOA,UAAS,SAAS,UAAU,mBAAmB;AACtD,SAAS,UAAU,iBAAiB;AACpC,SAAS,QAAQ,QAAQ,UAAU,WAAW,gCAAgC;AAC9E,SAAS,+BAA+B;AACxC,SAAS,YAAY;AACrB,SAAS,wBAAwB;AACjC,OAAO,cAAc;AACrB,OAAO,qBAAqB;AAE5B,MAAM,cAAc,OAAO,IAAI;AAAA;AAAA,iBAEd,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBACtC,CAAC,UAAW,MAAM,iBAAiB,SAAS;AAAA,iBAC3C,CAAC,UAAW,MAAM,iBAAiB,MAAM;AAAA;AAAA;AAI1D,MAAM,mBAAmB,OAAO;AAAA;AAAA,iBAEf,CAAC,UAAU,MAAM,MAAM,YAAY;AAAA,WACzC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,IAClD,SAAS;AAAA;AAGb,MAAM,QAAQ,OAAO;AAAA,WACV,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,IAClD,SAAS;AAAA;AAGb,MAAM,QAAQ,OAAO;AAAA,IACjB,SAAS;AAAA,WACF,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,IAClD,CAAC,UAAW,MAAM,kBAAkB,uBAAuB;AAAA,gBAC/C,CAAC,UAAW,MAAM,iBAAiB,SAAS;AAAA;AAG5D,MAAM,UAAU,OAAO,IAAI;AAAA,mBACR,CAAC,EAAE,OAAO,eAAe,MACxC,OAAO,iBAAiB,MAAM,OAAO,MAAM,KAAK,IAAI,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAGnF,MAAM,mBAAmB,CAAC;AAAA,EACxB,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,oBAAoB,MAAM;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,WAAW,UAAU,KAAK;AAEhC,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,QAAQ;AACZ,QAAI;AAAa;AACjB,QAAI;AAAc;AAClB,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,YAAY,CAAC;AAC9B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS;AACjC,QAAM,gBAAgB,YAAY,MAAM;AACtC,YAAQ,CAAC,IAAI;AAAA,EACf,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,YACJ,oBAAC,QAAK,QAAO,QAAO,YAAW,UAC7B,8BAAC,QAAK,QAAO,QACX,8BAAC,mBAAgB,WAAU,YAAW,QAAO,OAAM,OAAO,CAAC,WAAW,KAAK,GAAG,GAChF,GACF;AAEF,QAAM,OAAO,CAAC,GAAG,MAAM;AACvB,QAAM,QAAQ,CAAC,MAAM;AACrB,MAAI;AAAc,SAAK,KAAK,MAAM;AAClC,MAAI;AAAU,UAAM,KAAK,MAAM;AAC/B,MAAI;AAAO,UAAM,KAAK,MAAM;AAE5B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI,MAAM,MAAM;AAAA,MAChB,IAAI,MAAM,MAAM;AAAA,MAChB,YAAW;AAAA,MACX,OAAM;AAAA,MACN,eAAY;AAAA,MACZ;AAAA,MAEA;AAAA,6BAAC,QAAK,YAAW,cAAa,gBAAe,cAAa,MAAM,OAC9D;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;AAAA,cAClC,YAAW;AAAA,cACX,IAAI,iBAAiB,KAAK,CAAC,YAAY,CAAC,QAAQ,yBAAyB,MAAM,MAAM,CAAC,IAAI;AAAA,cAEzF;AAAA,6BACC,oBAAC,QAAK,QAAQ,aAAa,SAAS,QAAQ,YAAW,UAAS,IAAG,QAChE,qBACH;AAAA,gBAEF,oBAAC,QAAK,UAAU,GAAG,IAAI,CAAC,aAAa,IAAI,MAAM,MAAM,KACnD,8BAAC,QACC,+BAAC,QACE;AAAA,gCAAc,oBAAC,oBAAiB,eAAY,yBAAyB,sBAAW;AAAA,kBACjF;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM,CAAC,QAAQ,KAAK;AAAA,sBACpB,QAAO;AAAA,sBACP,UAAS;AAAA,sBACT,YAAW;AAAA,sBACX,gBAAgB,CAAC,CAAC;AAAA,sBAClB,eAAY;AAAA,sBAEZ;AAAA,4CAAC,QAAK,IAAI,aAAa,IAAI,MAAM,MAAM,MAAM,YAAW,cAAa,cAAa,UAChF,8BAAC,2BAAwB,OAAO,WAAW,GAC7C;AAAA,wBACC,cACC,qBAAC,QAAK,YAAW,UACf;AAAA;AAAA,4BAAC;AAAA;AAAA,8BACC,YAAW;AAAA,8BACX,MAAM,oBAAC,oBAAiB;AAAA,8BACxB,MAAK;AAAA,8BACL,SAAS,MAAM;AACb,8CAAc;AACd,kDAAkB;AAAA,8BACpB;AAAA,8BACA,gBAAgB,EAAE,eAAe,uBAAuB;AAAA;AAAA,0BAC1D;AAAA,0BACCA,OAAM,aAAa,aAAa;AAAA,4BAC/B,MAAM,YAAY,MAAM,SAAS,SAAY,YAAY,MAAM,OAAO;AAAA,4BACtE,UAAU,CAAC,OAAO,SAAS;AACzB,kCAAI,YAAY,MAAM;AAAU,4CAAY,MAAM,SAAS,OAAO,IAAI;AACtE,4CAAc;AAAA,4BAChB;AAAA,0BACF,CAAC;AAAA,2BACH,IACE;AAAA;AAAA;AAAA,kBACN;AAAA,mBACF,GACF,GACF;AAAA;AAAA;AAAA,UACF;AAAA,UACC,YACC,qBAAC,QAAK,QAAQ,aAAa,SAAS,QAAQ,YAAW,UAAS,MAAM,CAAC,QAAQ,MAAM,GAClF;AAAA;AAAA,YACD,oBAAC,SAAM,iBAAiB,CAAC,CAAC,OAAO,eAAY,qBAC1C,iBACH;AAAA,aACF;AAAA,UAED,SACC,oBAAC,QAAK,QAAQ,aAAa,SAAS,QAAQ,YAAW,UACrD,8BAAC,SAAM,gBAAgB,CAAC,CAAC,YAAY,eAAY,qBAC9C,iBACH,GACF;AAAA,WAEJ;AAAA,QACC,eAAe,KACd;AAAA,UAAC;AAAA;AAAA,YACC,QAAQ,aAAa,SAAS;AAAA,YAC9B,YAAW;AAAA,YACX,MAAM,iBAAiB,IAAI,CAAC,MAAM,IAAI,CAAC,QAAQ,QAAQ,MAAM;AAAA,YAE5D;AAAA,6BAAe,oBAAC,QAAM,uBAAY;AAAA,cAClC,iBAAiB,KAAK;AAAA,cACtB,gBAAgB,oBAAC,QAAM,wBAAa;AAAA;AAAA;AAAA,QACvC;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEA,MAAM,kBAAkB;AAAA,EACtB,WAAW,UAAU,OAAO,YAAY,YAAY,EAAE;AAAA,EACtD,aAAa,UAAU,QAAQ,YAAY,sBAAsB;AAAA,EACjE,mBAAmB,UAAU,KAAK,YAAY,yCAAyC;AAAA,EACvF,aAAa,UAAU,QAAQ,YAAY,eAAe;AAAA,EAC1D,cAAc,UAAU,QAAQ,YAAY,eAAe;AAAA,EAC3D,WAAW,UAAU,QAAQ,YAAY,mBAAmB;AAAA,EAC5D,YAAY,UAAU,OAAO,YAAY,mBAAmB;AAAA,EAC5D,OAAO,UAAU,OAAO,YAAY,oBAAoB;AAAA,EACxD,OAAO,UAAU,OAAO,YAAY,oBAAoB;AAAA,EACxD,OAAO,UAAU,OAAO,YAAY,cAAc;AACpD;AAEA,iBAAiB,YAAY;AAC7B,iBAAiB,cAAc;AAC/B,MAAM,uBAAuB,SAAS,gBAAgB;AACtD,qBAAqB,YAAY;AAEjC,MAAM,qBAAqB,UAAU,gBAAgB;",
   "names": ["React"]
 }

package/dist/esm/MobilePageHeader/index.js

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

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

@@ -1,7 +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"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './MobilePageHeader.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
   "names": []
 }

package/dist/esm/MobileSelectList/MobileSelectList.js

@@ -6,8 +6,8 @@ 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";
+import { DSMobileTouchable } from "../MobileTouchable/index.js";
+import { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from "./styled.js";
 const MobileSelectList = ({
   open = false,
   header = null,
@@ -108,15 +108,25 @@ const MobileSelectList = ({
 };
 const DSMobileSelectList = withTheme(MobileSelectList);
 MobileSelectList.propTypes = {
+  /** show select list */
   open: PropTypes.bool,
+  /** DSMobilePageHeader instance */
   header: PropTypes.element,
+  /** called when a DSMobileListItem is touched */
   onChange: PropTypes.func,
+  /** allow multiple selection */
   multiple: PropTypes.bool,
+  /** Array of DSMobileListItem instances */
   children: PropTypes.arrayOf(PropTypes.element),
+  /** data test id for testing purposes */
   dataTestid: PropTypes.string,
+  /** footer action, DSButton instance */
   buttonFooter: PropTypes.element,
+  /** called when footer action is triggered */
   onApply: PropTypes.func,
+  /** zIndex */
   zIndex: PropTypes.number,
+  /** init selecteds */
   selecteds: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
   theme: PropTypes.object.isRequired,
   useSearch: PropTypes.bool,

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

@@ -1,7 +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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",
+  "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/index.js';\nimport { StyledContainer, HeaderContainer, Footer, ListContainer, checkbox, checked, selectedMark } from './styled.js';\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": ["React"]
 }

package/dist/esm/MobileSelectList/index.js

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

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

@@ -1,7 +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"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './MobileSelectList.js';\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
   "names": []
 }

package/dist/esm/MobileSelectList/styled.js

@@ -1,13 +1,12 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
 import { noop } from "lodash";
-import { styled } from "@elliemae/ds-system";
+import { styled, border } from "@elliemae/ds-system";
 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";
+import { DSMobileTouchable } from "../MobileTouchable/index.js";
+import { DSMobileListItem } from "../MobileListItem/index.js";
 const StyledContainer = styled(Grid)`
   background: ${(props) => props.theme.colors.neutral["000"]};
   z-index: ${(props) => props.zIndex};

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

@@ -1,7 +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 '@elliemae/ds-system';\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,YAAY,WAAW;ACmCC;AAlCxB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB;AAC1B,SAAS,cAAc;AACvB,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AAE1B,MAAM,kBAAkB,OAAO,IAAI;AAAA,gBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA,aACzC,CAAC,UAAU,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvB,MAAM,kBAAkB,OAAO,IAAI;AAAA,mBACvB,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAG/D,MAAM,SAAS,OAAO,IAAI;AAAA,gBACjB,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,MAAM;AAAA;AAG5D,MAAM,gBAAgB,OAAO;AAAA,MAC9B,gCAAgC;AAAA;AAAA;AAAA;AAK/B,MAAM,WAAW,oBAAC,cAAW,SAAS,OAAO,UAAU,MAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AAC/F,MAAM,UAAU,oBAAC,cAAW,SAAO,MAAC,UAAU,MAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AACtF,MAAM,eAAe,oBAAC,aAAU,OAAO,CAAC,iBAAiB,GAAG,GAAG;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { noop } from 'lodash';\nimport { styled, border } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { DSMobileTouchable } from '../MobileTouchable/index.js';\nimport { DSMobileListItem } from '../MobileListItem/index.js';\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,YAAY,WAAW;ACkCC;AAjCxB,SAAS,YAAY;AACrB,SAAS,QAAQ,cAAc;AAC/B,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,iBAAiB;AAC1B,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AAE1B,MAAM,kBAAkB,OAAO,IAAI;AAAA,gBAC1B,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,aAC9C,CAAC,UAAU,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvB,MAAM,kBAAkB,OAAO,IAAI;AAAA,mBACvB,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAG/D,MAAM,SAAS,OAAO,IAAI;AAAA,gBACjB,CAAC,UAAU,OAAO,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAG5D,MAAM,gBAAgB,OAAO;AAAA,MAC9B,gCAAgC;AAAA;AAAA;AAAA;AAK/B,MAAM,WAAW,oBAAC,cAAW,SAAS,OAAO,UAAU,MAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AAC/F,MAAM,UAAU,oBAAC,cAAW,SAAO,MAAC,UAAU,MAAM,OAAO,EAAE,eAAe,OAAO,GAAG;AACtF,MAAM,eAAe,oBAAC,aAAU,OAAO,CAAC,iBAAiB,GAAG,GAAG;",
   "names": []
 }

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

@@ -2,6 +2,6 @@
   "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 '@elliemae/ds-props-helpers';\nimport { styled } from '@elliemae/ds-system';\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;\nMobileSeparator.displayName = 'MobileSeparator';\nconst MobileSeparatorWithSchema = describe(MobileSeparator);\nMobileSeparatorWithSchema.propTypes = mobileSeparatorProps;\n\nexport { MobileSeparatorWithSchema };\nexport default MobileSeparator;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACqBd;AApBT,SAAS,UAAU,iBAAiB;AACpC,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,YAAY,OAAO,IAAI;AAAA,gBACb,CAAC,EAAE,OAAO,OAAO,WAAW,MAAM,GAAG,MAAM,OAAO,MAAM,IAAI,MAAM,WAAW;AAAA,iBAC5E,CAAC,EAAE,OAAO,OAAO,WAAW,MAAM,GAAG,MAAM,OAAO,MAAM,IAAI,MAAM,WAAW;AAAA;AAG9F,MAAM,kBAAkB,CAAC,EAAE,QAAQ,CAAC,WAAW,KAAK,GAAG,YAAY,cAAc,OAAO,SAAS,SAAS,KAAK,MAAM;AACnH,QAAM,cAAc,cAAc,aAAa,WAAW;AAC1D,QAAM,OAAO,cAAc,aAAa,OAAO;AAC/C,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,CAAC,cAAc;AAAA,IACf,CAAC,OAAO;AAAA,IACR,YAAY;AAAA,IACZ;AAAA,EACF;AACA,SAAO,oBAAC,aAAW,GAAG,QAAQ;AAChC;AAEA,MAAM,uBAAuB;AAAA,EAC3B,MAAM,UAAU,MAAM,CAAC,SAAS,QAAQ,CAAC,EAAE,YAAY,yBAAyB,EAAE,aAAa,OAAO;AAAA,EACtG,WAAW,UAAU,MAAM,CAAC,YAAY,YAAY,CAAC,EAClD,YAAY,4BAA4B,EACxC,aAAa,YAAY;AAAA,EAC5B,OAAO,UAAU,MAAM,YAAY,wBAAwB,EAAE,aAAa,CAAC,WAAW,KAAK,CAAC;AAAA,EAC5F,QAAQ,UAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAC9D,YAAY,yBAAyB,EACrC,aAAa,IAAI;AACtB;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe;AAC1D,0BAA0B,YAAY;AAGtC,IAAO,oBAAQ;",
+  "mappings": "AAAA,YAAY,WAAW;ACqBd;AApBT,SAAS,UAAU,iBAAiB;AACpC,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,YAAY,OAAO,IAAI;AAAA,gBACb,CAAC,EAAE,OAAO,OAAO,WAAW,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,SAAS;AAAA,iBAC5E,CAAC,EAAE,OAAO,OAAO,WAAW,MAAM,GAAG,MAAM,OAAO,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,SAAS;AAAA;AAG9F,MAAM,kBAAkB,CAAC,EAAE,QAAQ,CAAC,WAAW,KAAK,GAAG,YAAY,cAAc,OAAO,SAAS,SAAS,KAAK,MAAM;AACnH,QAAM,cAAc,cAAc,aAAa,WAAW;AAC1D,QAAM,OAAO,cAAc,aAAa,OAAO;AAC/C,QAAM,SAAS;AAAA,IACb,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,CAAC,WAAW,GAAG;AAAA,IACf,CAAC,IAAI,GAAG;AAAA,IACR,YAAY;AAAA,IACZ;AAAA,EACF;AACA,SAAO,oBAAC,aAAW,GAAG,QAAQ;AAChC;AAEA,MAAM,uBAAuB;AAAA,EAC3B,MAAM,UAAU,MAAM,CAAC,SAAS,QAAQ,CAAC,EAAE,YAAY,yBAAyB,EAAE,aAAa,OAAO;AAAA,EACtG,WAAW,UAAU,MAAM,CAAC,YAAY,YAAY,CAAC,EAClD,YAAY,4BAA4B,EACxC,aAAa,YAAY;AAAA,EAC5B,OAAO,UAAU,MAAM,YAAY,wBAAwB,EAAE,aAAa,CAAC,WAAW,KAAK,CAAC;AAAA,EAC5F,QAAQ,UAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAC9D,YAAY,yBAAyB,EACrC,aAAa,IAAI;AACtB;AAEA,gBAAgB,YAAY;AAC5B,gBAAgB,cAAc;AAC9B,MAAM,4BAA4B,SAAS,eAAe;AAC1D,0BAA0B,YAAY;AAGtC,IAAO,oBAAQ;",
   "names": []
 }

package/dist/esm/MobileSeparator/index.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import DSMobileSeparator, { MobileSeparatorWithSchema } from "./Separator";
+import DSMobileSeparator, { MobileSeparatorWithSchema } from "./Separator.js";
 var MobileSeparator_default = DSMobileSeparator;
 export {
   MobileSeparatorWithSchema,

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileSeparator/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import DSMobileSeparator, { MobileSeparatorWithSchema } from './Separator';\n\nexport { MobileSeparatorWithSchema };\nexport default DSMobileSeparator;\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import DSMobileSeparator, { MobileSeparatorWithSchema } from './Separator.js';\n\nexport { MobileSeparatorWithSchema };\nexport default DSMobileSeparator;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAO,qBAAqB,iCAAiC;AAG7D,IAAO,0BAAQ;",
   "names": []
 }

package/dist/esm/MobileTimePicker/Input.js

@@ -1,9 +1,8 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
-import { focus, __UNSAFE_SPACE_TO_DIMSUM } from "@elliemae/ds-system";
-import { styled } from "@elliemae/ds-system";
+import { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from "@elliemae/ds-system";
 const StyledInput = styled.input`
-  input[type=time]& {   
+  input[type='time']& {
     -webkit-appearance: none;
     -moz-appearance: none;
     -webkit-tap-highlight-color: transparent;
@@ -25,7 +24,8 @@ const StyledInput = styled.input`
     border: solid 1px ${(props) => props.theme.colors.neutral[200]};
   }
 
-  input[type=time]&:active, input[type=time]&:focus {
+  input[type='time']&:active,
+  input[type='time']&:focus {
     ${(props) => focus(props.theme.colors.brand[700])}
   }
 
@@ -34,7 +34,9 @@ const StyledInput = styled.input`
     content: '${(props) => props.value === "" ? props.placeholder : props["data-displayvalue"]}';
   }
 
-  input[type=time]&::-webkit-datetime-edit, input[type=time]&::-webkit-inner-spin-button, input[type=time]&::-webkit-clear-button {
+  input[type='time']&::-webkit-datetime-edit,
+  input[type='time']&::-webkit-inner-spin-button,
+  input[type='time']&::-webkit-clear-button {
     -webkit-appearance: none;
     display: none;
   }

package/dist/esm/MobileTimePicker/Input.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileTimePicker/Input.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM } from '@elliemae/ds-system';\nimport { styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n  input[type=time]& {   \n    -webkit-appearance: none;\n    -moz-appearance: none;\n    -webkit-tap-highlight-color: transparent;\n    appearance: none;\n    color: transparent;\n\n    white-space: nowrap;\n    position: relative;\n    height: ${props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n    width: 100%;\n    max-width: calc(100% - 32px);\n    outline: none;\n    box-sizing: border-box;\n    display: flex;\n    background: ${props => props.theme.colors.neutral['000']};\n    padding: 0 ${props => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n    z-index: 1;\n    border-radius: 2px;\n    border: solid 1px ${props => props.theme.colors.neutral[200]};\n  }\n\n  input[type=time]&:active, input[type=time]&:focus {\n    ${props => focus(props.theme.colors.brand[700])}\n  }\n\n  &:before {\n    color: ${props =>\n      props.value === ''\n        ? props.theme.colors.neutral['500']\n        : props.theme.colors.neutral['800']};\n    content: '${props =>\n      props.value === '' ? props.placeholder : props['data-displayvalue']}';\n  }\n\n  input[type=time]&::-webkit-datetime-edit, input[type=time]&::-webkit-inner-spin-button, input[type=time]&::-webkit-clear-button {\n    -webkit-appearance: none;\n    display: none;\n  }\n`;\n\nexport const Input = ({ innerRef, ...props }) => (\n  <StyledInput ref={innerRef} {...props} />\n);\n"],
-  "mappings": "AAAA,YAAY,WAAW;AC+CrB;AA9CF,SAAS,OAAO,gCAAgC;AAChD,SAAS,cAAc;AAEvB,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,WAAS,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMjD,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA,iBACrC,WAAS,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAG/C,WAAS,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,MAItD,WAAS,MAAM,MAAM,MAAM,OAAO,MAAM,IAAI;AAAA;AAAA;AAAA;AAAA,aAIrC,WACP,MAAM,UAAU,KACZ,MAAM,MAAM,OAAO,QAAQ,SAC3B,MAAM,MAAM,OAAO,QAAQ;AAAA,gBACrB,WACV,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS9C,MAAM,QAAQ,CAAC,EAAE,aAAa,MAAM,MACzC,oBAAC,eAAY,KAAK,UAAW,GAAG,OAAO;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { focus, __UNSAFE_SPACE_TO_DIMSUM, styled } from '@elliemae/ds-system';\n\nconst StyledInput = styled.input`\n  input[type='time']& {\n    -webkit-appearance: none;\n    -moz-appearance: none;\n    -webkit-tap-highlight-color: transparent;\n    appearance: none;\n    color: transparent;\n\n    white-space: nowrap;\n    position: relative;\n    height: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.l)};\n    width: 100%;\n    max-width: calc(100% - 32px);\n    outline: none;\n    box-sizing: border-box;\n    display: flex;\n    background: ${(props) => props.theme.colors.neutral['000']};\n    padding: 0 ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n    z-index: 1;\n    border-radius: 2px;\n    border: solid 1px ${(props) => props.theme.colors.neutral[200]};\n  }\n\n  input[type='time']&:active,\n  input[type='time']&:focus {\n    ${(props) => focus(props.theme.colors.brand[700])}\n  }\n\n  &:before {\n    color: ${(props) => (props.value === '' ? props.theme.colors.neutral['500'] : props.theme.colors.neutral['800'])};\n    content: '${(props) => (props.value === '' ? props.placeholder : props['data-displayvalue'])}';\n  }\n\n  input[type='time']&::-webkit-datetime-edit,\n  input[type='time']&::-webkit-inner-spin-button,\n  input[type='time']&::-webkit-clear-button {\n    -webkit-appearance: none;\n    display: none;\n  }\n`;\n\nexport const Input = ({ innerRef, ...props }) => <StyledInput ref={innerRef} {...props} />;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC4C0B;AA3CjD,SAAS,OAAO,0BAA0B,cAAc;AAExD,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAUb,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAMnD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBAC5C,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAAA;AAAA,wBAGjD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,MAK3D,CAAC,UAAU,MAAM,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,MAAM,OAAO,QAAQ,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,gBAClG,CAAC,UAAW,MAAM,UAAU,KAAK,MAAM,cAAc,MAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWvF,MAAM,QAAQ,CAAC,EAAE,UAAU,GAAG,MAAM,MAAM,oBAAC,eAAY,KAAK,UAAW,GAAG,OAAO;",
   "names": []
 }

package/dist/esm/MobileTimePicker/MobileTimePicker.js

@@ -6,7 +6,7 @@ import { DSIconColors } from "@elliemae/ds-icon";
 import { RecentDocuments } from "@elliemae/ds-icons";
 import DSButton from "@elliemae/ds-button";
 import { DSInputGroup } from "@elliemae/ds-form";
-import { Input } from "./Input";
+import { Input } from "./Input.js";
 const DSMobileTimePicker = ({ disabled, value, tabIndex, placeholder, onChange }) => {
   const inputRef = useRef(null);
   const valueArr = value.split(":");
@@ -72,10 +72,25 @@ DSMobileTimePicker.defaultProps = {
   value: ""
 };
 const pickerProps = {
+  /**
+   * defaults to false
+   */
   disabled: PropTypes.bool.description("disabled prop, defaults to false"),
+  /**
+   * 0 as default
+   */
   tabIndex: PropTypes.number.description("focus order HTML property, 0 as default"),
+  /**
+   * HH : MM am as default
+   */
   placeholder: PropTypes.string.description("HH : MM am as default"),
+  /**
+   * onChange handler, receives change event as first argument
+   */
   onChange: PropTypes.func.description("onChange handler, receives change event as first argument"),
+  /**
+   * HH:MM string representing the time or empty string
+   */
   value: PropTypes.string.description("HH:MM string representing the time or empty string")
 };
 DSMobileTimePicker.propTypes = pickerProps;

package/dist/esm/MobileTimePicker/MobileTimePicker.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileTimePicker/MobileTimePicker.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useMemo, useEffect } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport { DSInputGroup } from '@elliemae/ds-form';\nimport { Input } from './Input';\n\nconst DSMobileTimePicker = ({ disabled, value, tabIndex, placeholder, onChange }) => {\n  const inputRef = useRef(null);\n  const valueArr = value.split(':');\n  useEffect(() => {\n    /*\n      necessary if value is being set in mount, \n      otherwise the clear won't work on the first click\n      [SEE input onChange comment]\n    */\n    if (inputRef.current) {\n      inputRef.current.defaultValue = '';\n    }\n  }, [inputRef.current]);\n  const displayValue = useMemo(() => {\n    if (!value || !valueArr[0] || !valueArr[1]) return '';\n    const ampm = valueArr[0] >= 12 ? 'pm' : 'am';\n    const h = valueArr[0] > 12 ? valueArr[0] - 12 : valueArr[0];\n\n    return `${h} : ${valueArr[1]} ${ampm}`;\n  }, [value]);\n\n  return (\n    <DSInputGroup\n      rightAddon={\n        <DSButton\n          aria-label=\"Time Picker Button\"\n          color={!disabled ? DSIconColors.PRIMARY : DSIconColors.NEUTRAL}\n          disabled={disabled}\n          icon={<RecentDocuments />}\n          type=\"button\"\n          buttonType=\"secondary\"\n          onClick={() => {\n            inputRef.current.focus();\n            inputRef.current.click();\n          }}\n        />\n      }\n    >\n      <Input\n        innerRef={inputRef}\n        type=\"time\"\n        data-testid=\"ds-mobile-time-picker\"\n        aria-label=\"Time Picker Input Mask\"\n        disabled={disabled}\n        placeholder={placeholder}\n        tabIndex={tabIndex}\n        value={value}\n        data-displayvalue={displayValue}\n        onChange={(e) => {\n          // https://github.com/facebook/react/issues/8938#issuecomment-360573204\n          const { target } = e.nativeEvent;\n          function iosClearDefault() {\n            target.defaultValue = '';\n          }\n          window.setTimeout(iosClearDefault, 0);\n          onChange(e);\n        }}\n      />\n    </DSInputGroup>\n  );\n};\n\nDSMobileTimePicker.defaultProps = {\n  disabled: false,\n  tabIndex: 0,\n  placeholder: 'HH : MM am',\n  value: '',\n};\n\nconst pickerProps = {\n  /**\n   * defaults to false\n   */\n  disabled: PropTypes.bool.description('disabled prop, defaults to false'),\n  /**\n   * 0 as default\n   */\n  tabIndex: PropTypes.number.description('focus order HTML property, 0 as default'),\n  /**\n   * HH : MM am as default\n   */\n  placeholder: PropTypes.string.description('HH : MM am as default'),\n  /**\n   * onChange handler, receives change event as first argument\n   */\n  onChange: PropTypes.func.description('onChange handler, receives change event as first argument'),\n  /**\n   * HH:MM string representing the time or empty string\n   */\n  value: PropTypes.string.description('HH:MM string representing the time or empty string'),\n};\n\nDSMobileTimePicker.propTypes = pickerProps;\nDSMobileTimePicker.displayName = 'DSMobileTimePicker';\nconst DSMobileTimePickerWithSchema = describe(DSMobileTimePicker).description('Time picker for mobile & tablet');\n\nDSMobileTimePickerWithSchema.propTypes = pickerProps;\n\nexport { DSMobileTimePicker, DSMobileTimePickerWithSchema };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACoCP;AApChB,SAAgB,QAAQ,SAAS,iBAAiB;AAClD,SAAS,WAAW,gBAAgB;AACpC,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,OAAO,cAAc;AACrB,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AAEtB,MAAM,qBAAqB,CAAC,EAAE,UAAU,OAAO,UAAU,aAAa,SAAS,MAAM;AACnF,QAAM,WAAW,OAAO,IAAI;AAC5B,QAAM,WAAW,MAAM,MAAM,GAAG;AAChC,YAAU,MAAM;AAMd,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,eAAe;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,SAAS,OAAO,CAAC;AACrB,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,CAAC,SAAS,CAAC,SAAS,MAAM,CAAC,SAAS;AAAI,aAAO;AACnD,UAAM,OAAO,SAAS,MAAM,KAAK,OAAO;AACxC,UAAM,IAAI,SAAS,KAAK,KAAK,SAAS,KAAK,KAAK,SAAS;AAEzD,WAAO,GAAG,OAAO,SAAS,MAAM;AAAA,EAClC,GAAG,CAAC,KAAK,CAAC;AAEV,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YACE;AAAA,QAAC;AAAA;AAAA,UACC,cAAW;AAAA,UACX,OAAO,CAAC,WAAW,aAAa,UAAU,aAAa;AAAA,UACvD;AAAA,UACA,MAAM,oBAAC,mBAAgB;AAAA,UACvB,MAAK;AAAA,UACL,YAAW;AAAA,UACX,SAAS,MAAM;AACb,qBAAS,QAAQ,MAAM;AACvB,qBAAS,QAAQ,MAAM;AAAA,UACzB;AAAA;AAAA,MACF;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,UAAU;AAAA,UACV,MAAK;AAAA,UACL,eAAY;AAAA,UACZ,cAAW;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,qBAAmB;AAAA,UACnB,UAAU,CAAC,MAAM;AAEf,kBAAM,EAAE,OAAO,IAAI,EAAE;AACrB,qBAAS,kBAAkB;AACzB,qBAAO,eAAe;AAAA,YACxB;AACA,mBAAO,WAAW,iBAAiB,CAAC;AACpC,qBAAS,CAAC;AAAA,UACZ;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,eAAe;AAAA,EAChC,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,OAAO;AACT;AAEA,MAAM,cAAc;AAAA,EAIlB,UAAU,UAAU,KAAK,YAAY,kCAAkC;AAAA,EAIvE,UAAU,UAAU,OAAO,YAAY,yCAAyC;AAAA,EAIhF,aAAa,UAAU,OAAO,YAAY,uBAAuB;AAAA,EAIjE,UAAU,UAAU,KAAK,YAAY,2DAA2D;AAAA,EAIhG,OAAO,UAAU,OAAO,YAAY,oDAAoD;AAC1F;AAEA,mBAAmB,YAAY;AAC/B,mBAAmB,cAAc;AACjC,MAAM,+BAA+B,SAAS,kBAAkB,EAAE,YAAY,iCAAiC;AAE/G,6BAA6B,YAAY;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useMemo, useEffect } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { DSIconColors } from '@elliemae/ds-icon';\nimport { RecentDocuments } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport { DSInputGroup } from '@elliemae/ds-form';\nimport { Input } from './Input.js';\n\nconst DSMobileTimePicker = ({ disabled, value, tabIndex, placeholder, onChange }) => {\n  const inputRef = useRef(null);\n  const valueArr = value.split(':');\n  useEffect(() => {\n    /*\n      necessary if value is being set in mount, \n      otherwise the clear won't work on the first click\n      [SEE input onChange comment]\n    */\n    if (inputRef.current) {\n      inputRef.current.defaultValue = '';\n    }\n  }, [inputRef.current]);\n  const displayValue = useMemo(() => {\n    if (!value || !valueArr[0] || !valueArr[1]) return '';\n    const ampm = valueArr[0] >= 12 ? 'pm' : 'am';\n    const h = valueArr[0] > 12 ? valueArr[0] - 12 : valueArr[0];\n\n    return `${h} : ${valueArr[1]} ${ampm}`;\n  }, [value]);\n\n  return (\n    <DSInputGroup\n      rightAddon={\n        <DSButton\n          aria-label=\"Time Picker Button\"\n          color={!disabled ? DSIconColors.PRIMARY : DSIconColors.NEUTRAL}\n          disabled={disabled}\n          icon={<RecentDocuments />}\n          type=\"button\"\n          buttonType=\"secondary\"\n          onClick={() => {\n            inputRef.current.focus();\n            inputRef.current.click();\n          }}\n        />\n      }\n    >\n      <Input\n        innerRef={inputRef}\n        type=\"time\"\n        data-testid=\"ds-mobile-time-picker\"\n        aria-label=\"Time Picker Input Mask\"\n        disabled={disabled}\n        placeholder={placeholder}\n        tabIndex={tabIndex}\n        value={value}\n        data-displayvalue={displayValue}\n        onChange={(e) => {\n          // https://github.com/facebook/react/issues/8938#issuecomment-360573204\n          const { target } = e.nativeEvent;\n          function iosClearDefault() {\n            target.defaultValue = '';\n          }\n          window.setTimeout(iosClearDefault, 0);\n          onChange(e);\n        }}\n      />\n    </DSInputGroup>\n  );\n};\n\nDSMobileTimePicker.defaultProps = {\n  disabled: false,\n  tabIndex: 0,\n  placeholder: 'HH : MM am',\n  value: '',\n};\n\nconst pickerProps = {\n  /**\n   * defaults to false\n   */\n  disabled: PropTypes.bool.description('disabled prop, defaults to false'),\n  /**\n   * 0 as default\n   */\n  tabIndex: PropTypes.number.description('focus order HTML property, 0 as default'),\n  /**\n   * HH : MM am as default\n   */\n  placeholder: PropTypes.string.description('HH : MM am as default'),\n  /**\n   * onChange handler, receives change event as first argument\n   */\n  onChange: PropTypes.func.description('onChange handler, receives change event as first argument'),\n  /**\n   * HH:MM string representing the time or empty string\n   */\n  value: PropTypes.string.description('HH:MM string representing the time or empty string'),\n};\n\nDSMobileTimePicker.propTypes = pickerProps;\nDSMobileTimePicker.displayName = 'DSMobileTimePicker';\nconst DSMobileTimePickerWithSchema = describe(DSMobileTimePicker).description('Time picker for mobile & tablet');\n\nDSMobileTimePickerWithSchema.propTypes = pickerProps;\n\nexport { DSMobileTimePicker, DSMobileTimePickerWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACoCP;AApChB,SAAgB,QAAQ,SAAS,iBAAiB;AAClD,SAAS,WAAW,gBAAgB;AACpC,SAAS,oBAAoB;AAC7B,SAAS,uBAAuB;AAChC,OAAO,cAAc;AACrB,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AAEtB,MAAM,qBAAqB,CAAC,EAAE,UAAU,OAAO,UAAU,aAAa,SAAS,MAAM;AACnF,QAAM,WAAW,OAAO,IAAI;AAC5B,QAAM,WAAW,MAAM,MAAM,GAAG;AAChC,YAAU,MAAM;AAMd,QAAI,SAAS,SAAS;AACpB,eAAS,QAAQ,eAAe;AAAA,IAClC;AAAA,EACF,GAAG,CAAC,SAAS,OAAO,CAAC;AACrB,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,CAAC,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC,SAAS,CAAC;AAAG,aAAO;AACnD,UAAM,OAAO,SAAS,CAAC,KAAK,KAAK,OAAO;AACxC,UAAM,IAAI,SAAS,CAAC,IAAI,KAAK,SAAS,CAAC,IAAI,KAAK,SAAS,CAAC;AAE1D,WAAO,GAAG,OAAO,SAAS,CAAC,KAAK;AAAA,EAClC,GAAG,CAAC,KAAK,CAAC;AAEV,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YACE;AAAA,QAAC;AAAA;AAAA,UACC,cAAW;AAAA,UACX,OAAO,CAAC,WAAW,aAAa,UAAU,aAAa;AAAA,UACvD;AAAA,UACA,MAAM,oBAAC,mBAAgB;AAAA,UACvB,MAAK;AAAA,UACL,YAAW;AAAA,UACX,SAAS,MAAM;AACb,qBAAS,QAAQ,MAAM;AACvB,qBAAS,QAAQ,MAAM;AAAA,UACzB;AAAA;AAAA,MACF;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,UAAU;AAAA,UACV,MAAK;AAAA,UACL,eAAY;AAAA,UACZ,cAAW;AAAA,UACX;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,qBAAmB;AAAA,UACnB,UAAU,CAAC,MAAM;AAEf,kBAAM,EAAE,OAAO,IAAI,EAAE;AACrB,qBAAS,kBAAkB;AACzB,qBAAO,eAAe;AAAA,YACxB;AACA,mBAAO,WAAW,iBAAiB,CAAC;AACpC,qBAAS,CAAC;AAAA,UACZ;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,mBAAmB,eAAe;AAAA,EAChC,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,OAAO;AACT;AAEA,MAAM,cAAc;AAAA;AAAA;AAAA;AAAA,EAIlB,UAAU,UAAU,KAAK,YAAY,kCAAkC;AAAA;AAAA;AAAA;AAAA,EAIvE,UAAU,UAAU,OAAO,YAAY,yCAAyC;AAAA;AAAA;AAAA;AAAA,EAIhF,aAAa,UAAU,OAAO,YAAY,uBAAuB;AAAA;AAAA;AAAA;AAAA,EAIjE,UAAU,UAAU,KAAK,YAAY,2DAA2D;AAAA;AAAA;AAAA;AAAA,EAIhG,OAAO,UAAU,OAAO,YAAY,oDAAoD;AAC1F;AAEA,mBAAmB,YAAY;AAC/B,mBAAmB,cAAc;AACjC,MAAM,+BAA+B,SAAS,kBAAkB,EAAE,YAAY,iCAAiC;AAE/G,6BAA6B,YAAY;",
   "names": []
 }

package/dist/esm/MobileTimePicker/index.js

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

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

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

package/dist/esm/MobileTouchable/MobileTouchable.js

@@ -3,9 +3,8 @@ import { jsx } from "react/jsx-runtime";
 import { useState, useCallback } from "react";
 import { noop } from "lodash";
 import PropTypes from "prop-types";
-import { styled } from "@elliemae/ds-system";
+import { styled, withTheme } from "@elliemae/ds-system";
 import { Grid } from "@elliemae/ds-grid";
-import { withTheme } from "@elliemae/ds-system";
 const StyledContainer = styled(Grid)`
   cursor: pointer;
   background: ${(props) => props.touching ? props.theme.colors.brand["100"] : props.theme.colors.neutral["000"]};

package/dist/esm/MobileTouchable/MobileTouchable.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/MobileTouchable/MobileTouchable.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useCallback } from 'react';\nimport { noop } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { withTheme } from '@elliemae/ds-system';\n\nconst StyledContainer = styled(Grid)`\n  cursor: pointer;\n  background: ${(props) => (props.touching ? props.theme.colors.brand['100'] : props.theme.colors.neutral['000'])};\n`;\n\nconst MobileTouchable = ({\n  children,\n  onClick = noop,\n  theme,\n  dataTestid = 'mobile-touchable',\n  render,\n  ...gridProps\n}) => {\n  const [touching, setTouching] = useState(false);\n  const handleStart = useCallback(() => setTouching(true));\n  const handleEnd = useCallback(() => setTouching(false));\n  return (\n    <StyledContainer\n      {...gridProps}\n      touching={touching}\n      onClick={onClick}\n      onTouchStart={handleStart}\n      onTouchEnd={handleEnd}\n      data-testid={dataTestid}\n    >\n      {children || render(gridProps)}\n    </StyledContainer>\n  );\n};\n\nMobileTouchable.propTypes = {\n  onClick: PropTypes.func,\n  children: PropTypes.any,\n  render: PropTypes.func,\n  theme: PropTypes.any,\n  dataTestid: PropTypes.string,\n};\n\nconst DSMobileTouchable = withTheme(MobileTouchable);\n\nexport { DSMobileTouchable };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACwBnB;AAxBJ,SAAgB,UAAU,mBAAmB;AAC7C,SAAS,YAAY;AACrB,OAAO,eAAe;AACtB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,iBAAiB;AAE1B,MAAM,kBAAkB,OAAO,IAAI;AAAA;AAAA,gBAEnB,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,SAAS,MAAM,MAAM,OAAO,QAAQ;AAAA;AAG1G,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,aAAa;AAAA,EACb;AAAA,KACG;AACL,MAAM;AACJ,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,cAAc,YAAY,MAAM,YAAY,IAAI,CAAC;AACvD,QAAM,YAAY,YAAY,MAAM,YAAY,KAAK,CAAC;AACtD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,eAAa;AAAA,MAEZ,sBAAY,OAAO,SAAS;AAAA;AAAA,EAC/B;AAEJ;AAEA,gBAAgB,YAAY;AAAA,EAC1B,SAAS,UAAU;AAAA,EACnB,UAAU,UAAU;AAAA,EACpB,QAAQ,UAAU;AAAA,EAClB,OAAO,UAAU;AAAA,EACjB,YAAY,UAAU;AACxB;AAEA,MAAM,oBAAoB,UAAU,eAAe;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useCallback } from 'react';\nimport { noop } from 'lodash';\nimport PropTypes from 'prop-types';\nimport { styled, withTheme } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nconst StyledContainer = styled(Grid)`\n  cursor: pointer;\n  background: ${(props) => (props.touching ? props.theme.colors.brand['100'] : props.theme.colors.neutral['000'])};\n`;\n\nconst MobileTouchable = ({\n  children,\n  onClick = noop,\n  theme,\n  dataTestid = 'mobile-touchable',\n  render,\n  ...gridProps\n}) => {\n  const [touching, setTouching] = useState(false);\n  const handleStart = useCallback(() => setTouching(true));\n  const handleEnd = useCallback(() => setTouching(false));\n  return (\n    <StyledContainer\n      {...gridProps}\n      touching={touching}\n      onClick={onClick}\n      onTouchStart={handleStart}\n      onTouchEnd={handleEnd}\n      data-testid={dataTestid}\n    >\n      {children || render(gridProps)}\n    </StyledContainer>\n  );\n};\n\nMobileTouchable.propTypes = {\n  onClick: PropTypes.func,\n  children: PropTypes.any,\n  render: PropTypes.func,\n  theme: PropTypes.any,\n  dataTestid: PropTypes.string,\n};\n\nconst DSMobileTouchable = withTheme(MobileTouchable);\n\nexport { DSMobileTouchable };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACuBnB;AAvBJ,SAAgB,UAAU,mBAAmB;AAC7C,SAAS,YAAY;AACrB,OAAO,eAAe;AACtB,SAAS,QAAQ,iBAAiB;AAClC,SAAS,YAAY;AAErB,MAAM,kBAAkB,OAAO,IAAI;AAAA;AAAA,gBAEnB,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,KAAK,IAAI,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAG/G,MAAM,kBAAkB,CAAC;AAAA,EACvB;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,cAAc,YAAY,MAAM,YAAY,IAAI,CAAC;AACvD,QAAM,YAAY,YAAY,MAAM,YAAY,KAAK,CAAC;AACtD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MACA,cAAc;AAAA,MACd,YAAY;AAAA,MACZ,eAAa;AAAA,MAEZ,sBAAY,OAAO,SAAS;AAAA;AAAA,EAC/B;AAEJ;AAEA,gBAAgB,YAAY;AAAA,EAC1B,SAAS,UAAU;AAAA,EACnB,UAAU,UAAU;AAAA,EACpB,QAAQ,UAAU;AAAA,EAClB,OAAO,UAAU;AAAA,EACjB,YAAY,UAAU;AACxB;AAEA,MAAM,oBAAoB,UAAU,eAAe;",
   "names": []
 }

package/dist/esm/MobileTouchable/index.js

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

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

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

package/dist/esm/Modal/Modal.js

@@ -6,7 +6,7 @@ import { Grid } from "@elliemae/ds-grid";
 import { WarningTriangle } from "@elliemae/ds-icons";
 import DSButton from "@elliemae/ds-button";
 import { useTheme } from "@elliemae/ds-system";
-import { ModalPosition, ModalBox, BackShadow, ModalIcon, ModalTitle, ModalDescription, BodyFix } from "./styled";
+import { ModalPosition, ModalBox, BackShadow, ModalIcon, ModalTitle, ModalDescription, BodyFix } from "./styled.js";
 const Modal = ({
   zIndex = 1,
   title = "",

package/dist/esm/Modal/Modal.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/Modal/Modal.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { noop } from 'lodash';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport { useTheme } from '@elliemae/ds-system';\nimport { ModalPosition, ModalBox, BackShadow, ModalIcon, ModalTitle, ModalDescription, BodyFix } from './styled';\n\nconst Modal = ({\n  zIndex = 1,\n  title = '',\n  description = '',\n  onClose = noop,\n  showSecondaryAction = true,\n  secondaryActionProps = {\n    onClick: noop,\n    labelText: 'Cancel',\n  },\n  primaryActionProps = {\n    onClick: noop,\n    labelText: 'Accept',\n  },\n  isOpen = false,\n  children = undefined,\n}) => {\n  const theme = useTheme();\n  if (!isOpen) return null;\n  return (\n    <>\n      <BodyFix isOpen={isOpen} />\n      <BackShadow onClick={onClose} zIndex={zIndex} />\n      <ModalPosition zIndex={zIndex} cols={['auto']}>\n        {children !== undefined ? (\n          <>{children}</>\n        ) : (\n          <ModalBox\n            maxHeight={`${window.innerHeight * 0.75}px`}\n            rows={[1, '80px']}\n            style={{\n              overflow: 'hidden',\n            }}\n          >\n            <Grid\n              pl=\"xs\"\n              pr=\"xs\"\n              style={{\n                overflow: 'hidden',\n              }}\n            >\n              <Grid\n                rows={['auto', 'auto', 1]}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                <ModalIcon>\n                  <WarningTriangle size=\"xxl\" />\n                </ModalIcon>\n                <ModalTitle data-testid=\"modal-title\">{title}</ModalTitle>\n                <ModalDescription\n                  data-testid=\"modal-desc\"\n                  style={{\n                    overflow: 'auto',\n                  }}\n                >\n                  {description}\n                </ModalDescription>\n              </Grid>\n            </Grid>\n            <Grid pt=\"24px\">\n              <Grid\n                pl=\"xs\"\n                pr=\"xs\"\n                cols={showSecondaryAction ? [1, 1] : [1]}\n                gutter=\"xs\"\n                justifyContent=\"center\"\n                alignItems=\"center\"\n                style={{\n                  borderTop: `1px solid ${theme.colors.neutral[100]}`,\n                }}\n              >\n                {showSecondaryAction && (\n                  <DSButton\n                    {...secondaryActionProps}\n                    labelText={secondaryActionProps.labelText || ' Cancel'}\n                    buttonType=\"secondary\"\n                    data-testid=\"modal-secondary-btn\"\n                  />\n                )}\n                <DSButton\n                  labelText={primaryActionProps.labelText || ' Accept'}\n                  {...primaryActionProps}\n                  buttonType=\"primary\"\n                  data-testid=\"modal-primary-btn\"\n                />\n              </Grid>\n            </Grid>\n          </ModalBox>\n        )}\n      </ModalPosition>\n    </>\n  );\n};\n\nconst modalProps = {\n  isOpen: PropTypes.bool.description('Wheter the modal is open or closed').defaultValue(false),\n  zIndex: PropTypes.number.description('z-index value').defaultValue(1),\n  title: PropTypes.string.description('Modal s title').isRequired,\n  description: PropTypes.string.description('Modal s content').isRequired,\n  onClose: PropTypes.func.description('Function executed when the modal closes'),\n  showSecondaryAction: PropTypes.bool.description('Wheter to show secondary action button or not').defaultValue(true),\n  secondaryActionProps: PropTypes.shape({\n    onClick: PropTypes.func,\n    labelText: PropTypes.string,\n  }).description('Secondary action props'),\n  primaryActionProps: PropTypes.shape({\n    onClick: PropTypes.func,\n    labelText: PropTypes.string,\n  }).description('Primary action props'),\n};\n\nModal.propTypes = modalProps;\nModal.displayName = 'Modal';\nconst ModalWithSchema = describe(Modal);\nModalWithSchema.propTypes = modalProps;\n\nexport { Modal, ModalWithSchema };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe, PropTypes } from '@elliemae/ds-props-helpers';\nimport { noop } from 'lodash';\nimport { Grid } from '@elliemae/ds-grid';\nimport { WarningTriangle } from '@elliemae/ds-icons';\nimport DSButton from '@elliemae/ds-button';\nimport { useTheme } from '@elliemae/ds-system';\nimport { ModalPosition, ModalBox, BackShadow, ModalIcon, ModalTitle, ModalDescription, BodyFix } from './styled.js';\n\nconst Modal = ({\n  zIndex = 1,\n  title = '',\n  description = '',\n  onClose = noop,\n  showSecondaryAction = true,\n  secondaryActionProps = {\n    onClick: noop,\n    labelText: 'Cancel',\n  },\n  primaryActionProps = {\n    onClick: noop,\n    labelText: 'Accept',\n  },\n  isOpen = false,\n  children = undefined,\n}) => {\n  const theme = useTheme();\n  if (!isOpen) return null;\n  return (\n    <>\n      <BodyFix isOpen={isOpen} />\n      <BackShadow onClick={onClose} zIndex={zIndex} />\n      <ModalPosition zIndex={zIndex} cols={['auto']}>\n        {children !== undefined ? (\n          <>{children}</>\n        ) : (\n          <ModalBox\n            maxHeight={`${window.innerHeight * 0.75}px`}\n            rows={[1, '80px']}\n            style={{\n              overflow: 'hidden',\n            }}\n          >\n            <Grid\n              pl=\"xs\"\n              pr=\"xs\"\n              style={{\n                overflow: 'hidden',\n              }}\n            >\n              <Grid\n                rows={['auto', 'auto', 1]}\n                style={{\n                  overflow: 'hidden',\n                }}\n              >\n                <ModalIcon>\n                  <WarningTriangle size=\"xxl\" />\n                </ModalIcon>\n                <ModalTitle data-testid=\"modal-title\">{title}</ModalTitle>\n                <ModalDescription\n                  data-testid=\"modal-desc\"\n                  style={{\n                    overflow: 'auto',\n                  }}\n                >\n                  {description}\n                </ModalDescription>\n              </Grid>\n            </Grid>\n            <Grid pt=\"24px\">\n              <Grid\n                pl=\"xs\"\n                pr=\"xs\"\n                cols={showSecondaryAction ? [1, 1] : [1]}\n                gutter=\"xs\"\n                justifyContent=\"center\"\n                alignItems=\"center\"\n                style={{\n                  borderTop: `1px solid ${theme.colors.neutral[100]}`,\n                }}\n              >\n                {showSecondaryAction && (\n                  <DSButton\n                    {...secondaryActionProps}\n                    labelText={secondaryActionProps.labelText || ' Cancel'}\n                    buttonType=\"secondary\"\n                    data-testid=\"modal-secondary-btn\"\n                  />\n                )}\n                <DSButton\n                  labelText={primaryActionProps.labelText || ' Accept'}\n                  {...primaryActionProps}\n                  buttonType=\"primary\"\n                  data-testid=\"modal-primary-btn\"\n                />\n              </Grid>\n            </Grid>\n          </ModalBox>\n        )}\n      </ModalPosition>\n    </>\n  );\n};\n\nconst modalProps = {\n  isOpen: PropTypes.bool.description('Wheter the modal is open or closed').defaultValue(false),\n  zIndex: PropTypes.number.description('z-index value').defaultValue(1),\n  title: PropTypes.string.description('Modal s title').isRequired,\n  description: PropTypes.string.description('Modal s content').isRequired,\n  onClose: PropTypes.func.description('Function executed when the modal closes'),\n  showSecondaryAction: PropTypes.bool.description('Wheter to show secondary action button or not').defaultValue(true),\n  secondaryActionProps: PropTypes.shape({\n    onClick: PropTypes.func,\n    labelText: PropTypes.string,\n  }).description('Secondary action props'),\n  primaryActionProps: PropTypes.shape({\n    onClick: PropTypes.func,\n    labelText: PropTypes.string,\n  }).description('Primary action props'),\n};\n\nModal.propTypes = modalProps;\nModal.displayName = 'Modal';\nconst ModalWithSchema = describe(Modal);\nModalWithSchema.propTypes = modalProps;\n\nexport { Modal, ModalWithSchema };\n"],
+  "mappings": "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",
   "names": []
 }