@elliemae/ds-chat 2.2.0 → 2.3.0-alpha.3

package/esm/parts/tile-button/TileButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/tile-button/TileButton.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport { describe } from 'react-desc';\nimport { DSTooltipV3 } from '@elliemae/ds-tooltip';\nimport { Grid } from '@elliemae/ds-grid';\nimport { CloseXsmall } from '@elliemae/ds-icons';\nimport {\n  StyledTooltipV3ButtonWrapper,\n  StyledTileButton,\n  StyledTileButtonIcon,\n  StyledTileButtonLabel,\n  StyledWrapper,\n  StyledWrapperLeftBorder,\n  StyledStatusBadge,\n  StyledWrapperCentralContent,\n  CloseButton,\n} from './styled';\nimport { propsTileButton, defaultTileButton, TileButtonProps } from './props';\nimport { useValidateProps } from './config/useValidateProps';\n\nconst TileButton = (props: TileButtonProps): JSX.Element => {\n  useValidateProps(props, TileButtonWithSchema.toJSON());\n\n  const {\n    label,\n    title,\n    dsId,\n    onClick,\n    onFocus,\n    onBlur,\n    Icon,\n    showClose,\n    onClose,\n    badge,\n    badgeColor,\n    badgePosition,\n    disabled,\n    selected,\n    isHeader,\n    ariaLabel,\n    tooltipPlacement,\n    disableTooltip,\n    innerRef,\n  } = props;\n  const handleClick = React.useCallback(() => {\n    onClick(dsId, title);\n  }, [dsId, onClick, title]);\n\n  const MainContent = React.useMemo(\n    () => (\n      <StyledWrapperCentralContent alignItems={isHeader ? 'center' : undefined}>\n        <Grid width=\"100%\" alignItems=\"center\" justifyContent=\"center\">\n          <StyledTileButtonIcon alignItems=\"center\" justifyContent=\"center\">\n            <Icon size=\"m\" />\n            {badge ? (\n              <StyledStatusBadge\n                badgeColor={badgeColor}\n                badgePosition={badgePosition}\n                data-testid={`tile-badge-${dsId}`}\n              />\n            ) : null}\n          </StyledTileButtonIcon>\n        </Grid>\n        {!isHeader ? (\n          <Grid width=\"100%\" justifyContent=\"center\">\n            {label ? <StyledTileButtonLabel>{label}</StyledTileButtonLabel> : null}\n          </Grid>\n        ) : null}\n      </StyledWrapperCentralContent>\n    ),\n    [isHeader, Icon, badge, badgeColor, badgePosition, label],\n  );\n\n  const Btn = React.useMemo(\n    () => (\n      <StyledTileButton\n        key={dsId}\n        isHeader={isHeader}\n        value={dsId}\n        data-testid={`tile-button-${dsId}`}\n        data-key={dsId}\n        onClick={handleClick}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        disabled={disabled}\n        selected={selected}\n        badgeColor={badgeColor}\n        badgePosition={badgePosition}\n        aria-pressed={selected}\n        aria-label={ariaLabel}\n        ref={innerRef}\n      >\n        <StyledWrapper alignItems=\"center\" justifyContent=\"center\">\n          <span>{MainContent}</span>\n          <StyledWrapperLeftBorder />\n          {showClose && !disabled ? (\n            <CloseButton onClick={onClose} value={dsId} data-testid={`tile-close-btn-${dsId}`}>\n              <CloseXsmall />\n            </CloseButton>\n          ) : null}\n        </StyledWrapper>\n      </StyledTileButton>\n    ),\n    [\n      MainContent,\n      ariaLabel,\n      badgeColor,\n      badgePosition,\n      disabled,\n      dsId,\n      handleClick,\n      isHeader,\n      onBlur,\n      onClose,\n      onFocus,\n      selected,\n      showClose,\n      innerRef,\n    ],\n  );\n\n  return title && !disableTooltip ? (\n    <StyledTooltipV3ButtonWrapper>\n      <DSTooltipV3 id={`ds-chat-tile-tooltip-button-${dsId}`} text={title} startPlacementPreference={tooltipPlacement}>\n        {Btn}\n      </DSTooltipV3>\n    </StyledTooltipV3ButtonWrapper>\n  ) : (\n    Btn\n  );\n};\n\nTileButton.propTypes = propsTileButton;\nTileButton.defaultProps = defaultTileButton;\n\nconst TileButtonWithSchema = describe(TileButton);\nTileButtonWithSchema.propTypes = propsTileButton;\n\nexport { TileButton, TileButtonWithSchema };\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWA;AACA;AAEA,MAAM,aAAa,CAAC,UAAwC;AAC1D,mBAAiB,OAAO,qBAAqB;AAE7C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE;AACJ,QAAM,cAAc,OAAM,YAAY,MAAM;AAC1C,YAAQ,MAAM;AAAA,KACb,CAAC,MAAM,SAAS;AAEnB,QAAM,cAAc,OAAM,QACxB,MACE,qCAAC,6BAAD;AAAA,IAA6B,YAAY,WAAW,WAAW;AAAA,KAC7D,qCAAC,MAAD;AAAA,IAAM,OAAM;AAAA,IAAO,YAAW;AAAA,IAAS,gBAAe;AAAA,KACpD,qCAAC,sBAAD;AAAA,IAAsB,YAAW;AAAA,IAAS,gBAAe;AAAA,KACvD,qCAAC,MAAD;AAAA,IAAM,MAAK;AAAA,MACV,QACC,qCAAC,mBAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA,eAAa,cAAc;AAAA,OAE3B,QAGP,CAAC,WACA,qCAAC,MAAD;AAAA,IAAM,OAAM;AAAA,IAAO,gBAAe;AAAA,KAC/B,QAAQ,qCAAC,uBAAD,MAAwB,SAAiC,QAElE,OAGR,CAAC,UAAU,MAAM,OAAO,YAAY,eAAe;AAGrD,QAAM,MAAM,OAAM,QAChB,MACE,qCAAC,kBAAD;AAAA,IACE,KAAK;AAAA,IACL;AAAA,IACA,OAAO;AAAA,IACP,eAAa,eAAe;AAAA,IAC5B,YAAU;AAAA,IACV,SAAS;AAAA,IACT;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAc;AAAA,IACd,cAAY;AAAA,IACZ,KAAK;AAAA,KAEL,qCAAC,eAAD;AAAA,IAAe,YAAW;AAAA,IAAS,gBAAe;AAAA,KAChD,qCAAC,QAAD,MAAO,cACP,qCAAC,yBAAD,OACC,aAAa,CAAC,WACb,qCAAC,aAAD;AAAA,IAAa,SAAS;AAAA,IAAS,OAAO;AAAA,IAAM,eAAa,kBAAkB;AAAA,KACzE,qCAAC,aAAD,SAEA,QAIV;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO,SAAS,CAAC,iBACf,qCAAC,8BAAD,MACE,qCAAC,aAAD;AAAA,IAAa,IAAI,+BAA+B;AAAA,IAAQ,MAAM;AAAA,IAAO,0BAA0B;AAAA,KAC5F,QAIL;AAAA;AAIJ,WAAW,YAAY;AACvB,WAAW,eAAe;AAE1B,MAAM,uBAAuB,SAAS;AACtC,qBAAqB,YAAY;",
+  "names": []
+}

package/esm/parts/tile-button/config/useValidateProps.js

@@ -1,7 +1,9 @@
-import { useValidatePropTypes } from '@elliemae/ds-props-helpers';
-
+import * as React from "react";
+import { useValidatePropTypes } from "@elliemae/ds-props-helpers";
 const useValidateProps = (props, schema) => {
   useValidatePropTypes(props, schema);
 };
-
-export { useValidateProps };
+export {
+  useValidateProps
+};
+//# sourceMappingURL=useValidateProps.js.map

package/esm/parts/tile-button/config/useValidateProps.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/tile-button/config/useValidateProps.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useValidatePropTypes } from '@elliemae/ds-props-helpers';\nimport { TileButtonProps } from '../props';\n\nexport const useValidateProps = (props: TileButtonProps, schema: unknown): void => {\n  useValidatePropTypes(props, schema);\n};\n"],
+  "mappings": "AAAA;ACAA;AAGO,MAAM,mBAAmB,CAAC,OAAwB,WAA0B;AACjF,uBAAqB,OAAO;AAAA;",
+  "names": []
+}

package/esm/parts/tile-button/index.js

@@ -1 +1,7 @@
-export { TileButton, TileButtonWithSchema } from './TileButton.js';
+import * as React from "react";
+import { TileButton, TileButtonWithSchema } from "./TileButton";
+export {
+  TileButton,
+  TileButtonWithSchema
+};
+//# sourceMappingURL=index.js.map

package/esm/parts/tile-button/index.js.map

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

package/esm/parts/tile-button/props.js

@@ -1,50 +1,64 @@
-import { PropTypes } from 'react-desc';
-import { noop } from 'lodash';
-import { Comments } from '@elliemae/ds-icons';
-
+import * as React from "react";
+import { PropTypes } from "react-desc";
+import { noop } from "lodash";
+import { Comments } from "@elliemae/ds-icons";
 const defaultTileButton = {
   Icon: Comments,
-  dsId: undefined,
-  label: '',
+  dsId: void 0,
+  label: "",
   onClick: noop,
   onBlur: noop,
   onFocus: noop,
-  title: '',
+  title: "",
   onClose: noop,
   showClose: false,
   badge: false,
-  badgeColor: 'blue',
-  badgePosition: 'left',
+  badgeColor: "blue",
+  badgePosition: "left",
   disabled: false,
   selected: false,
   isHeader: false,
-  ariaLabel: 'Tile button',
-  tooltipPlacement: 'right',
+  ariaLabel: "Tile button",
+  tooltipPlacement: "right",
   disableTooltip: false,
   innerRef: noop
 };
 const propsTileButton = {
-  Icon: PropTypes.func.description('Icon component').defaultValue(defaultTileButton.Icon),
-  dsId: PropTypes.oneOf(['number', 'string']).description('Unique id for the button').defaultValue(defaultTileButton.dsId),
-  label: PropTypes.string.description('It will display under the icon').defaultValue(defaultTileButton.label),
-  title: PropTypes.string.description('Tooltip').defaultValue(defaultTileButton.title),
-  onClick: PropTypes.func.description('The function to call when is clicked').defaultValue(defaultTileButton.onClick),
-  onFocus: PropTypes.func.description('The function to call when is focused').defaultValue(defaultTileButton.onFocus),
-  onBlur: PropTypes.func.description('The function to call when is on blur').defaultValue(defaultTileButton.onBlur),
-  onClose: PropTypes.func.description('The function to call when the X is Clicked').defaultValue(defaultTileButton.onClose),
-  showClose: PropTypes.bool.description('It will display the X').defaultValue(defaultTileButton.showClose),
-  badge: PropTypes.bool.description('It will display the badge').defaultValue(defaultTileButton.badge),
-  badgeColor: PropTypes.oneOf(['blue', 'green']).description('Color badge: blue or green').defaultValue(defaultTileButton.badgeColor),
-  badgePosition: PropTypes.oneOf(['left', 'right']).description('Color badge: blue or green').defaultValue(defaultTileButton.badgePosition),
-  disabled: PropTypes.bool.description('It will disabled the button').defaultValue(defaultTileButton.disabled),
-  selected: PropTypes.bool.description('Indicate that the button is selected').defaultValue(defaultTileButton.disabled),
+  Icon: PropTypes.func.description("Icon component").defaultValue(defaultTileButton.Icon),
+  dsId: PropTypes.oneOf(["number", "string"]).description("Unique id for the button").defaultValue(defaultTileButton.dsId),
+  label: PropTypes.string.description("It will display under the icon").defaultValue(defaultTileButton.label),
+  title: PropTypes.string.description("Tooltip").defaultValue(defaultTileButton.title),
+  onClick: PropTypes.func.description("The function to call when is clicked").defaultValue(defaultTileButton.onClick),
+  onFocus: PropTypes.func.description("The function to call when is focused").defaultValue(defaultTileButton.onFocus),
+  onBlur: PropTypes.func.description("The function to call when is on blur").defaultValue(defaultTileButton.onBlur),
+  onClose: PropTypes.func.description("The function to call when the X is Clicked").defaultValue(defaultTileButton.onClose),
+  showClose: PropTypes.bool.description("It will display the X").defaultValue(defaultTileButton.showClose),
+  badge: PropTypes.bool.description("It will display the badge").defaultValue(defaultTileButton.badge),
+  badgeColor: PropTypes.oneOf(["blue", "green"]).description("Color badge: blue or green").defaultValue(defaultTileButton.badgeColor),
+  badgePosition: PropTypes.oneOf(["left", "right"]).description("Color badge: blue or green").defaultValue(defaultTileButton.badgePosition),
+  disabled: PropTypes.bool.description("It will disabled the button").defaultValue(defaultTileButton.disabled),
+  selected: PropTypes.bool.description("Indicate that the button is selected").defaultValue(defaultTileButton.disabled),
   isHeader: PropTypes.bool.description("It won't render the label").defaultValue(defaultTileButton.disabled),
-  ariaLabel: PropTypes.string.description('aria-label attribute').defaultValue(defaultTileButton.ariaLabel),
-  tooltipPlacement: PropTypes.oneOf(['top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start']).description('start placement preferences, as per popperjs placement option').defaultValue("'right'"),
-  disableTooltip: PropTypes.bool.description('Disable tooltip option').defaultValue(defaultTileButton.disableTooltip),
-  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
-    current: PropTypes.any
-  })]).description('reference to the component')
+  ariaLabel: PropTypes.string.description("aria-label attribute").defaultValue(defaultTileButton.ariaLabel),
+  tooltipPlacement: PropTypes.oneOf([
+    "top-start",
+    "top",
+    "top-end",
+    "right-start",
+    "right",
+    "right-end",
+    "bottom-end",
+    "bottom",
+    "bottom-start",
+    "left-end",
+    "left",
+    "left-start"
+  ]).description("start placement preferences, as per popperjs placement option").defaultValue("'right'"),
+  disableTooltip: PropTypes.bool.description("Disable tooltip option").defaultValue(defaultTileButton.disableTooltip),
+  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description("reference to the component")
 };
-
-export { defaultTileButton, propsTileButton };
+export {
+  defaultTileButton,
+  propsTileButton
+};
+//# sourceMappingURL=props.js.map

package/esm/parts/tile-button/props.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/tile-button/props.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { PropTypes } from 'react-desc';\nimport { noop } from 'lodash';\nimport { Comments } from '@elliemae/ds-icons';\n\nexport interface TileButtonProps {\n  Icon: React.FC<{ size: string }>;\n  dsId: string | number;\n  label: string;\n  onClick?: (dsId: string | number, label: string) => void;\n  onBlur?: (e) => void;\n  onFocus?: (e) => void;\n  title: string;\n  showClose: boolean;\n  onClose?: (dsId: string | number) => void;\n  badge: boolean;\n  badgeColor: 'blue' | 'green';\n  badgePosition: 'left' | 'right';\n  disabled: boolean;\n  selected: boolean;\n  isHeader: boolean;\n  ariaLabel: string;\n  tooltipPlacement:\n    | 'top-start'\n    | 'top'\n    | 'top-end'\n    | 'right-start'\n    | 'right'\n    | 'right-end'\n    | 'bottom-end'\n    | 'bottom'\n    | 'bottom-start'\n    | 'left-end'\n    | 'left'\n    | 'left-start';\n  disableTooltip: boolean;\n  innerRef?: React.MutableRefObject<HTMLButtonElement> | ((_ref: HTMLButtonElement) => void);\n}\n\nexport const defaultTileButton: TileButtonProps = {\n  Icon: Comments,\n  dsId: undefined,\n  label: '',\n  onClick: noop,\n  onBlur: noop,\n  onFocus: noop,\n  title: '',\n  onClose: noop,\n  showClose: false,\n  badge: false,\n  badgeColor: 'blue',\n  badgePosition: 'left',\n  disabled: false,\n  selected: false,\n  isHeader: false,\n  ariaLabel: 'Tile button',\n  tooltipPlacement: 'right',\n  disableTooltip: false,\n  innerRef: noop,\n};\n\nexport const propsTileButton = {\n  Icon: PropTypes.func.description('Icon component').defaultValue(defaultTileButton.Icon),\n  dsId: PropTypes.oneOf(['number', 'string'])\n    .description('Unique id for the button')\n    .defaultValue(defaultTileButton.dsId),\n  label: PropTypes.string.description('It will display under the icon').defaultValue(defaultTileButton.label),\n  title: PropTypes.string.description('Tooltip').defaultValue(defaultTileButton.title),\n  onClick: PropTypes.func.description('The function to call when is clicked').defaultValue(defaultTileButton.onClick),\n  onFocus: PropTypes.func.description('The function to call when is focused').defaultValue(defaultTileButton.onFocus),\n  onBlur: PropTypes.func.description('The function to call when is on blur').defaultValue(defaultTileButton.onBlur),\n  onClose: PropTypes.func\n    .description('The function to call when the X is Clicked')\n    .defaultValue(defaultTileButton.onClose),\n  showClose: PropTypes.bool.description('It will display the X').defaultValue(defaultTileButton.showClose),\n  badge: PropTypes.bool.description('It will display the badge').defaultValue(defaultTileButton.badge),\n  badgeColor: PropTypes.oneOf(['blue', 'green'])\n    .description('Color badge: blue or green')\n    .defaultValue(defaultTileButton.badgeColor),\n  badgePosition: PropTypes.oneOf(['left', 'right'])\n    .description('Color badge: blue or green')\n    .defaultValue(defaultTileButton.badgePosition),\n  disabled: PropTypes.bool.description('It will disabled the button').defaultValue(defaultTileButton.disabled),\n  selected: PropTypes.bool.description('Indicate that the button is selected').defaultValue(defaultTileButton.disabled),\n  isHeader: PropTypes.bool.description(\"It won't render the label\").defaultValue(defaultTileButton.disabled),\n  ariaLabel: PropTypes.string.description('aria-label attribute').defaultValue(defaultTileButton.ariaLabel),\n  tooltipPlacement: PropTypes.oneOf([\n    'top-start',\n    'top',\n    'top-end',\n    'right-start',\n    'right',\n    'right-end',\n    'bottom-end',\n    'bottom',\n    'bottom-start',\n    'left-end',\n    'left',\n    'left-start',\n  ])\n    .description('start placement preferences, as per popperjs placement option')\n    .defaultValue(\"'right'\"),\n  disableTooltip: PropTypes.bool.description('Disable tooltip option').defaultValue(defaultTileButton.disableTooltip),\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]).description(\n    'reference to the component',\n  ),\n};\n"],
+  "mappings": "AAAA;ACCA;AACA;AACA;AAoCO,MAAM,oBAAqC;AAAA,EAChD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AAAA,EACP,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,UAAU;AAAA;AAGL,MAAM,kBAAkB;AAAA,EAC7B,MAAM,UAAU,KAAK,YAAY,kBAAkB,aAAa,kBAAkB;AAAA,EAClF,MAAM,UAAU,MAAM,CAAC,UAAU,WAC9B,YAAY,4BACZ,aAAa,kBAAkB;AAAA,EAClC,OAAO,UAAU,OAAO,YAAY,kCAAkC,aAAa,kBAAkB;AAAA,EACrG,OAAO,UAAU,OAAO,YAAY,WAAW,aAAa,kBAAkB;AAAA,EAC9E,SAAS,UAAU,KAAK,YAAY,wCAAwC,aAAa,kBAAkB;AAAA,EAC3G,SAAS,UAAU,KAAK,YAAY,wCAAwC,aAAa,kBAAkB;AAAA,EAC3G,QAAQ,UAAU,KAAK,YAAY,wCAAwC,aAAa,kBAAkB;AAAA,EAC1G,SAAS,UAAU,KAChB,YAAY,8CACZ,aAAa,kBAAkB;AAAA,EAClC,WAAW,UAAU,KAAK,YAAY,yBAAyB,aAAa,kBAAkB;AAAA,EAC9F,OAAO,UAAU,KAAK,YAAY,6BAA6B,aAAa,kBAAkB;AAAA,EAC9F,YAAY,UAAU,MAAM,CAAC,QAAQ,UAClC,YAAY,8BACZ,aAAa,kBAAkB;AAAA,EAClC,eAAe,UAAU,MAAM,CAAC,QAAQ,UACrC,YAAY,8BACZ,aAAa,kBAAkB;AAAA,EAClC,UAAU,UAAU,KAAK,YAAY,+BAA+B,aAAa,kBAAkB;AAAA,EACnG,UAAU,UAAU,KAAK,YAAY,wCAAwC,aAAa,kBAAkB;AAAA,EAC5G,UAAU,UAAU,KAAK,YAAY,6BAA6B,aAAa,kBAAkB;AAAA,EACjG,WAAW,UAAU,OAAO,YAAY,wBAAwB,aAAa,kBAAkB;AAAA,EAC/F,kBAAkB,UAAU,MAAM;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KAEC,YAAY,iEACZ,aAAa;AAAA,EAChB,gBAAgB,UAAU,KAAK,YAAY,0BAA0B,aAAa,kBAAkB;AAAA,EACpG,UAAU,UAAU,UAAU,CAAC,UAAU,MAAM,UAAU,MAAM,EAAE,SAAS,UAAU,SAAS,YAC3F;AAAA;",
+  "names": []
+}

package/esm/parts/tile-button/styled.js

@@ -1,78 +1,218 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
-import styled from 'styled-components';
-import { css } from '@elliemae/ds-system';
-import { Grid } from '@elliemae/ds-grid';
-
-var _templateObject;
+import * as React from "react";
+import styled from "styled-components";
+import { css } from "@elliemae/ds-system";
+import { Grid } from "@elliemae/ds-grid";
 const MIN_WIDTH_SIDEBAR = 48;
-const BUTTON_SIDEBAR_HEIGHT = 48; // Buttons
-
-const StyledWrapperLeftBorder = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1ebp1zs-0"
-})(["height:100%;width:4px;position:absolute;top:0;left:0;"]);
-const StyledStatusBadge = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1ebp1zs-1"
-})(["height:8px;width:8px;position:absolute;top:0;background:", ";", ";border-radius:50%;box-sizing:content-box;"], props => {
+const BUTTON_SIDEBAR_HEIGHT = 48;
+const StyledWrapperLeftBorder = styled(Grid)`
+  height: 100%;
+  width: 4px;
+  position: absolute;
+  top: 0;
+  left: 0;
+`;
+const StyledStatusBadge = styled.div`
+  height: 8px;
+  width: 8px;
+  position: absolute;
+  top: 0;
+  background: ${(props) => {
   switch (props.badgeColor) {
-    case 'blue':
+    case "blue":
       return props.theme.colors.brand[600];
-
-    case 'green':
+    case "green":
       return props.theme.colors.success[900];
-
     default:
       return props.theme.colors.brand[600];
   }
-}, props => {
+}};
+  ${(props) => {
   switch (props.badgePosition) {
-    case 'left':
-      return 'left: -4px;';
-
-    case 'right':
-      return 'right: -4px;';
-
+    case "left":
+      return "left: -4px;";
+    case "right":
+      return "right: -4px;";
     default:
-      return 'left: -4px;';
+      return "left: -4px;";
+  }
+}};
+  border-radius: 50%;
+  box-sizing: content-box;
+`;
+const StyledWrapperCentralContent = styled(Grid)`
+  width: 24px;
+  height: 40px;
+`;
+const StyledTileButtonIcon = styled(Grid)`
+  position: relative;
+  height: 24px;
+  width: 24px;
+  svg {
+    fill: ${(props) => props.theme.colors.neutral[500]};
+  }
+
+  &:focus {
+    svg {
+      fill: ${(props) => props.theme.colors.brand[800]};
+    }
+  }
+`;
+const StyledTileButtonLabel = styled.div`
+  width: 24px;
+  height: ${(props) => props.theme.space.xs};
+  text-transform: uppercase;
+  overflow: hidden;
+  text-align: center;
+  font-size: 13px;
+  color: ${(props) => props.theme.colors.neutral[600]};
+  line-height: 17px;
+`;
+const CloseButton = styled.button`
+  outline: none;
+  background: none;
+  height: 9px;
+  width: 9px;
+  position: absolute;
+  top: 1px;
+  right: 1px;
+  overflow: hidden;
+  padding: 0;
+  border: none;
+  span {
+    position: absolute;
+    left: -3px;
+    top: -4px;
   }
-});
-const StyledWrapperCentralContent = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1ebp1zs-2"
-})(["width:24px;height:40px;"]);
-const StyledTileButtonIcon = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1ebp1zs-3"
-})(["position:relative;height:24px;width:24px;svg{fill:", ";}&:focus{svg{fill:", ";}}"], props => props.theme.colors.neutral[500], props => props.theme.colors.brand[800]);
-const StyledTileButtonLabel = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1ebp1zs-4"
-})(["width:24px;height:", ";text-transform:uppercase;overflow:hidden;text-align:center;font-size:13px;color:", ";line-height:17px;"], props => props.theme.space.xs, props => props.theme.colors.neutral[600]);
-const CloseButton = /*#__PURE__*/styled.button.withConfig({
-  componentId: "sc-1ebp1zs-5"
-})(["outline:none;background:none;height:9px;width:9px;position:absolute;top:1px;right:1px;overflow:hidden;padding:0;border:none;span{position:absolute;left:-3px;top:-4px;}&:focus,&:hover{svg{fill:", ";}&:after{display:block;content:'';position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px ", ";border-radius:2px;}}cursor:pointer;"], props => props.theme.colors.brand[600], props => props.theme.colors.brand[600]); // MAIN WRAPPER
 
-const StyledTooltipV3ButtonWrapper = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-1ebp1zs-6"
-})(["height:", "px;width:", "px;"], BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR);
-const StyledTileButton = /*#__PURE__*/styled.button.withConfig({
-  componentId: "sc-1ebp1zs-7"
-})(["outline:none;background:transparent;height:", "px;width:", "px;position:relative;padding:0;border:none;cursor:pointer;border-bottom:", ";&:focus,&:hover,&:active,&:disabled{background:", ";& ", "{border:2px solid ", ";margin-top:-2px;", ";}}&:focus,&:hover{& ", "{background:", ";}& ", "{color:", ";}& svg{fill:", ";}}&:active:not(:disabled){background:", ";& ", "{background:", ";}& ", "{color:", ";font-weight:600;}& svg{fill:", ";}& ", "{border:2px solid ", ";}}&:disabled{background:", ";", "{background:", ";}& ", "{background:", ";border:2px solid ", ";}", "{svg{fill:", ";}}", "{color:", ";}}", ""], BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR, props => props.isHeader ? "1px solid  ".concat(props.theme.colors.neutral['200']) : 'none', props => props.theme.colors.neutral['080'], StyledStatusBadge, props => props.theme.colors.neutral['080'], props => {
+  &:focus,
+  &:hover {
+    svg {
+      fill: ${(props) => props.theme.colors.brand[600]};
+    }
+    &:after {
+      display: block;
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      border: solid 1px ${(props) => props.theme.colors.brand[600]};
+      border-radius: 2px;
+    }
+  }
+  cursor: pointer;
+`;
+const StyledTooltipV3ButtonWrapper = styled.div`
+  height: ${BUTTON_SIDEBAR_HEIGHT}px;
+  width: ${MIN_WIDTH_SIDEBAR}px;
+`;
+const StyledTileButton = styled.button`
+  outline: none;
+  background: transparent;
+  height: ${BUTTON_SIDEBAR_HEIGHT}px;
+  width: ${MIN_WIDTH_SIDEBAR}px;
+  position: relative;
+  padding: 0;
+  border: none;
+  cursor: pointer;
+  border-bottom: ${(props) => props.isHeader ? `1px solid  ${props.theme.colors.neutral["200"]}` : "none"};
+  &:focus,
+  &:hover,
+  &:active,
+  &:disabled {
+    background: ${(props) => props.theme.colors.neutral["080"]};
+    & ${StyledStatusBadge} {
+      border: 2px solid ${(props) => props.theme.colors.neutral["080"]};
+      margin-top: -2px;
+      ${(props) => {
   switch (props.badgePosition) {
-    case 'left':
-      return 'margin-left: -2px;';
+    case "left":
+      return "margin-left: -2px;";
+    case "right":
+      return "margin-right: -2px;";
+    default:
+      return "margin-left: -2px;";
+  }
+}};
+    }
+  }
 
-    case 'right':
-      return 'margin-right: -2px;';
+  &:focus,
+  &:hover {
+    & ${StyledWrapperLeftBorder} {
+      background: ${(props) => props.theme.colors.brand[800]};
+    }
+    & ${StyledTileButtonLabel} {
+      color: ${(props) => props.theme.colors.neutral[600]};
+    }
 
-    default:
-      return 'margin-left: -2px;';
+    & svg {
+      fill: ${(props) => props.theme.colors.brand[800]};
+    }
   }
-}, StyledWrapperLeftBorder, props => props.theme.colors.brand[800], StyledTileButtonLabel, props => props.theme.colors.neutral[600], props => props.theme.colors.brand[800], props => props.theme.colors.neutral['050'], StyledWrapperLeftBorder, props => props.theme.colors.brand[600], StyledTileButtonLabel, props => props.theme.colors.neutral[600], props => props.theme.colors.brand[600], StyledStatusBadge, props => props.theme.colors.neutral['050'], props => props.theme.colors.neutral['080'], StyledWrapperLeftBorder, props => props.theme.colors.neutral['400'], StyledStatusBadge, props => props.theme.colors.neutral['500'], props => props.theme.colors.neutral['080'], StyledTileButtonIcon, props => props.theme.colors.neutral[400], StyledTileButtonLabel, props => props.theme.colors.neutral[400], props => {
-  if (props.selected) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n        & ", " {\n          background: ", ";\n        }\n      "])), StyledWrapperLeftBorder, nestedProps => nestedProps.theme.colors.brand[600]);
+
+  &:active:not(:disabled) {
+    background: ${(props) => props.theme.colors.neutral["050"]};
+    & ${StyledWrapperLeftBorder} {
+      background: ${(props) => props.theme.colors.brand[600]};
+    }
+    & ${StyledTileButtonLabel} {
+      color: ${(props) => props.theme.colors.neutral[600]};
+      font-weight: 600;
+    }
+    & svg {
+      fill: ${(props) => props.theme.colors.brand[600]};
+    }
+    & ${StyledStatusBadge} {
+      border: 2px solid ${(props) => props.theme.colors.neutral["050"]};
+    }
   }
 
-  return '';
-});
-const StyledWrapper = /*#__PURE__*/styled(Grid).withConfig({
-  componentId: "sc-1ebp1zs-8"
-})(["height:100%;width:100%;position:relative;"]);
+  &:disabled {
+    background: ${(props) => props.theme.colors.neutral["080"]};
+    ${StyledWrapperLeftBorder} {
+      background: ${(props) => props.theme.colors.neutral["400"]};
+    }
+    & ${StyledStatusBadge} {
+      background: ${(props) => props.theme.colors.neutral["500"]};
+      border: 2px solid ${(props) => props.theme.colors.neutral["080"]};
+    }
+    ${StyledTileButtonIcon} {
+      svg {
+        fill: ${(props) => props.theme.colors.neutral[400]};
+      }
+    }
+    ${StyledTileButtonLabel} {
+      color: ${(props) => props.theme.colors.neutral[400]};
+    }
+  }
 
-export { CloseButton, StyledStatusBadge, StyledTileButton, StyledTileButtonIcon, StyledTileButtonLabel, StyledTooltipV3ButtonWrapper, StyledWrapper, StyledWrapperCentralContent, StyledWrapperLeftBorder };
+  ${(props) => {
+  if (props.selected) {
+    return css`
+        & ${StyledWrapperLeftBorder} {
+          background: ${(nestedProps) => nestedProps.theme.colors.brand[600]};
+        }
+      `;
+  }
+  return "";
+}}
+`;
+const StyledWrapper = styled(Grid)`
+  height: 100%;
+  width: 100%;
+  position: relative;
+`;
+export {
+  CloseButton,
+  StyledStatusBadge,
+  StyledTileButton,
+  StyledTileButtonIcon,
+  StyledTileButtonLabel,
+  StyledTooltipV3ButtonWrapper,
+  StyledWrapper,
+  StyledWrapperCentralContent,
+  StyledWrapperLeftBorder
+};
+//# sourceMappingURL=styled.js.map

package/esm/parts/tile-button/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/tile-button/styled.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\n/* eslint-disable max-lines */\nimport styled from 'styled-components';\nimport { css } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { TileButtonProps } from './props';\nconst MIN_WIDTH_SIDEBAR = 48;\nconst BUTTON_SIDEBAR_HEIGHT = 48;\n\n// Buttons\nexport const StyledWrapperLeftBorder = styled(Grid)`\n  height: 100%;\n  width: 4px;\n  position: absolute;\n  top: 0;\n  left: 0;\n`;\n\nexport const StyledStatusBadge = styled.div<Partial<TileButtonProps>>`\n  height: 8px;\n  width: 8px;\n  position: absolute;\n  top: 0;\n  background: ${(props) => {\n    switch (props.badgeColor) {\n      case 'blue':\n        return props.theme.colors.brand[600];\n      case 'green':\n        return props.theme.colors.success[900];\n      default:\n        return props.theme.colors.brand[600];\n    }\n  }};\n  ${(props) => {\n    switch (props.badgePosition) {\n      case 'left':\n        return 'left: -4px;';\n      case 'right':\n        return 'right: -4px;';\n      default:\n        return 'left: -4px;';\n    }\n  }};\n  border-radius: 50%;\n  box-sizing: content-box;\n`;\n\nexport const StyledWrapperCentralContent = styled(Grid)`\n  width: 24px;\n  height: 40px;\n`;\n\nexport const StyledTileButtonIcon = styled(Grid)`\n  position: relative;\n  height: 24px;\n  width: 24px;\n  svg {\n    fill: ${(props) => props.theme.colors.neutral[500]};\n  }\n\n  &:focus {\n    svg {\n      fill: ${(props) => props.theme.colors.brand[800]};\n    }\n  }\n`;\n\nexport const StyledTileButtonLabel = styled.div`\n  width: 24px;\n  height: ${(props) => props.theme.space.xs};\n  text-transform: uppercase;\n  overflow: hidden;\n  text-align: center;\n  font-size: 13px;\n  color: ${(props) => props.theme.colors.neutral[600]};\n  line-height: 17px;\n`;\n\nexport const CloseButton = styled.button<any>`\n  outline: none;\n  background: none;\n  height: 9px;\n  width: 9px;\n  position: absolute;\n  top: 1px;\n  right: 1px;\n  overflow: hidden;\n  padding: 0;\n  border: none;\n  span {\n    position: absolute;\n    left: -3px;\n    top: -4px;\n  }\n\n  &:focus,\n  &:hover {\n    svg {\n      fill: ${(props) => props.theme.colors.brand[600]};\n    }\n    &:after {\n      display: block;\n      content: '';\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      border: solid 1px ${(props) => props.theme.colors.brand[600]};\n      border-radius: 2px;\n    }\n  }\n  cursor: pointer;\n`;\n\n// MAIN WRAPPER\nexport const StyledTooltipV3ButtonWrapper = styled.div`\n  height: ${BUTTON_SIDEBAR_HEIGHT}px;\n  width: ${MIN_WIDTH_SIDEBAR}px;\n`;\nexport const StyledTileButton = styled.button<Partial<TileButtonProps>>`\n  outline: none;\n  background: transparent;\n  height: ${BUTTON_SIDEBAR_HEIGHT}px;\n  width: ${MIN_WIDTH_SIDEBAR}px;\n  position: relative;\n  padding: 0;\n  border: none;\n  cursor: pointer;\n  border-bottom: ${(props) => (props.isHeader ? `1px solid  ${props.theme.colors.neutral['200']}` : 'none')};\n  &:focus,\n  &:hover,\n  &:active,\n  &:disabled {\n    background: ${(props) => props.theme.colors.neutral['080']};\n    & ${StyledStatusBadge} {\n      border: 2px solid ${(props) => props.theme.colors.neutral['080']};\n      margin-top: -2px;\n      ${(props) => {\n        switch (props.badgePosition) {\n          case 'left':\n            return 'margin-left: -2px;';\n          case 'right':\n            return 'margin-right: -2px;';\n          default:\n            return 'margin-left: -2px;';\n        }\n      }};\n    }\n  }\n\n  &:focus,\n  &:hover {\n    & ${StyledWrapperLeftBorder} {\n      background: ${(props) => props.theme.colors.brand[800]};\n    }\n    & ${StyledTileButtonLabel} {\n      color: ${(props) => props.theme.colors.neutral[600]};\n    }\n\n    & svg {\n      fill: ${(props) => props.theme.colors.brand[800]};\n    }\n  }\n\n  &:active:not(:disabled) {\n    background: ${(props) => props.theme.colors.neutral['050']};\n    & ${StyledWrapperLeftBorder} {\n      background: ${(props) => props.theme.colors.brand[600]};\n    }\n    & ${StyledTileButtonLabel} {\n      color: ${(props) => props.theme.colors.neutral[600]};\n      font-weight: 600;\n    }\n    & svg {\n      fill: ${(props) => props.theme.colors.brand[600]};\n    }\n    & ${StyledStatusBadge} {\n      border: 2px solid ${(props) => props.theme.colors.neutral['050']};\n    }\n  }\n\n  &:disabled {\n    background: ${(props) => props.theme.colors.neutral['080']};\n    ${StyledWrapperLeftBorder} {\n      background: ${(props) => props.theme.colors.neutral['400']};\n    }\n    & ${StyledStatusBadge} {\n      background: ${(props) => props.theme.colors.neutral['500']};\n      border: 2px solid ${(props) => props.theme.colors.neutral['080']};\n    }\n    ${StyledTileButtonIcon} {\n      svg {\n        fill: ${(props) => props.theme.colors.neutral[400]};\n      }\n    }\n    ${StyledTileButtonLabel} {\n      color: ${(props) => props.theme.colors.neutral[400]};\n    }\n  }\n\n  ${(props) => {\n    if (props.selected) {\n      return css`\n        & ${StyledWrapperLeftBorder} {\n          background: ${(nestedProps) => nestedProps.theme.colors.brand[600]};\n        }\n      `;\n    }\n    return '';\n  }}\n`;\n\nexport const StyledWrapper = styled(Grid)`\n  height: 100%;\n  width: 100%;\n  position: relative;\n`;\n"],
+  "mappings": "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",
+  "names": []
+}

package/esm/prop-types.js

@@ -1,28 +1,31 @@
-import { PropTypes } from 'react-desc';
-import { noop } from 'lodash';
-
+import * as React from "react";
+import { PropTypes } from "react-desc";
+import { noop } from "lodash";
 const defaultProps = {
   expanded: false,
   expandedWidth: 348,
-  openedItem: undefined,
+  openedItem: void 0,
   onFooterExpand: noop,
   onFooterClose: noop,
   floating: false,
   onHeaderExpand: noop,
   onHeaderClose: noop,
-  title: 'Header Title'
+  title: "Header Title"
 };
 const chatProps = {
   containerProps: PropTypes.shape({}).defaultValue({}),
-  expanded: PropTypes.bool.description('Whether to show the chat expanded or collapsed').defaultValue(defaultProps.expanded),
-  expandedWidth: PropTypes.number.description('Total width attached to the expanded Chat').defaultValue(defaultProps.expandedWidth),
-  openedItem: PropTypes.string.description('The id of the chat item you want to be opened').defaultValue(defaultProps.openedItem),
-  messages: PropTypes.arrayOf(PropTypes.object).description('The array of out-of-the-box items you want to render inside the container list of the chat').defaultValue(defaultProps.openedItem),
-  onFooterExpand: PropTypes.func.description('The function to call when the chat is opened via the footer').defaultValue(defaultProps.onFooterExpand),
-  onFooterClose: PropTypes.func.description('The function to call when the chat is closed via the footer').defaultValue(defaultProps.onFooterClose),
-  onHeaderExpand: PropTypes.func.description('The function to call when the chat is opened via the header').defaultValue(defaultProps.onHeaderExpand),
-  onHeaderClose: PropTypes.func.description('The function to call when the chat is closed via the header').defaultValue(defaultProps.onHeaderClose),
-  floating: PropTypes.bool.description('Whether to show the chat as floating chat or not').defaultValue(defaultProps.floating)
+  expanded: PropTypes.bool.description("Whether to show the chat expanded or collapsed").defaultValue(defaultProps.expanded),
+  expandedWidth: PropTypes.number.description("Total width attached to the expanded Chat").defaultValue(defaultProps.expandedWidth),
+  openedItem: PropTypes.string.description("The id of the chat item you want to be opened").defaultValue(defaultProps.openedItem),
+  messages: PropTypes.arrayOf(PropTypes.object).description("The array of out-of-the-box items you want to render inside the container list of the chat").defaultValue(defaultProps.openedItem),
+  onFooterExpand: PropTypes.func.description("The function to call when the chat is opened via the footer").defaultValue(defaultProps.onFooterExpand),
+  onFooterClose: PropTypes.func.description("The function to call when the chat is closed via the footer").defaultValue(defaultProps.onFooterClose),
+  onHeaderExpand: PropTypes.func.description("The function to call when the chat is opened via the header").defaultValue(defaultProps.onHeaderExpand),
+  onHeaderClose: PropTypes.func.description("The function to call when the chat is closed via the header").defaultValue(defaultProps.onHeaderClose),
+  floating: PropTypes.bool.description("Whether to show the chat as floating chat or not").defaultValue(defaultProps.floating)
 };
-
-export { chatProps, defaultProps };
+export {
+  chatProps,
+  defaultProps
+};
+//# sourceMappingURL=prop-types.js.map

package/esm/prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/prop-types.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from 'react-desc';\nimport { noop } from 'lodash';\nimport { ChatProps } from './index.d';\n\nexport const defaultProps: ChatProps = {\n  expanded: false,\n  expandedWidth: 348,\n  openedItem: undefined,\n  onFooterExpand: noop,\n  onFooterClose: noop,\n  floating: false,\n  onHeaderExpand: noop,\n  onHeaderClose: noop,\n  title: 'Header Title',\n};\n\nexport const chatProps = {\n  containerProps: PropTypes.shape({}).defaultValue({}),\n  expanded: PropTypes.bool\n    .description('Whether to show the chat expanded or collapsed')\n    .defaultValue(defaultProps.expanded),\n  expandedWidth: PropTypes.number\n    .description('Total width attached to the expanded Chat')\n    .defaultValue(defaultProps.expandedWidth),\n  openedItem: PropTypes.string\n    .description('The id of the chat item you want to be opened')\n    .defaultValue(defaultProps.openedItem),\n  messages: PropTypes.arrayOf(PropTypes.object)\n    .description(\n      'The array of out-of-the-box items you want to render inside the container list of the chat',\n    )\n    .defaultValue(defaultProps.openedItem),\n  onFooterExpand: PropTypes.func\n    .description('The function to call when the chat is opened via the footer')\n    .defaultValue(defaultProps.onFooterExpand),\n  onFooterClose: PropTypes.func\n    .description('The function to call when the chat is closed via the footer')\n    .defaultValue(defaultProps.onFooterClose),\n  onHeaderExpand: PropTypes.func\n    .description('The function to call when the chat is opened via the header')\n    .defaultValue(defaultProps.onHeaderExpand),\n  onHeaderClose: PropTypes.func\n    .description('The function to call when the chat is closed via the header')\n    .defaultValue(defaultProps.onHeaderClose),\n  floating: PropTypes.bool\n    .description('Whether to show the chat as floating chat or not')\n    .defaultValue(defaultProps.floating),\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AAGO,MAAM,eAA0B;AAAA,EACrC,UAAU;AAAA,EACV,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,UAAU;AAAA,EACV,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,OAAO;AAAA;AAGF,MAAM,YAAY;AAAA,EACvB,gBAAgB,UAAU,MAAM,IAAI,aAAa;AAAA,EACjD,UAAU,UAAU,KACjB,YAAY,kDACZ,aAAa,aAAa;AAAA,EAC7B,eAAe,UAAU,OACtB,YAAY,6CACZ,aAAa,aAAa;AAAA,EAC7B,YAAY,UAAU,OACnB,YAAY,iDACZ,aAAa,aAAa;AAAA,EAC7B,UAAU,UAAU,QAAQ,UAAU,QACnC,YACC,8FAED,aAAa,aAAa;AAAA,EAC7B,gBAAgB,UAAU,KACvB,YAAY,+DACZ,aAAa,aAAa;AAAA,EAC7B,eAAe,UAAU,KACtB,YAAY,+DACZ,aAAa,aAAa;AAAA,EAC7B,gBAAgB,UAAU,KACvB,YAAY,+DACZ,aAAa,aAAa;AAAA,EAC7B,eAAe,UAAU,KACtB,YAAY,+DACZ,aAAa,aAAa;AAAA,EAC7B,UAAU,UAAU,KACjB,YAAY,oDACZ,aAAa,aAAa;AAAA;",
+  "names": []
+}

package/esm/styled.js

@@ -1,8 +1,16 @@
+import * as React from "react";
 const MIN_WIDTH_SIDEBAR = 48;
 const BUTTON_SIDEBAR_HEIGHT = 48;
 const BUTTON_FLOATING = 56;
-const BOX_SHADOW = '0 5px 8px 0 rgba(53,60,70,0.55)';
-const BOX_SHADOW_FLOATING = '0 5px 8px 0 rgba(53,60,70,0.35)';
-const BOX_SHADOW_INSET = "inset 100px 3px 4px 0 rgba(53,60,70,0.50)";
-
-export { BOX_SHADOW, BOX_SHADOW_FLOATING, BOX_SHADOW_INSET, BUTTON_FLOATING, BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR };
+const BOX_SHADOW = "0 5px 8px 0 rgba(53,60,70,0.55)";
+const BOX_SHADOW_FLOATING = "0 5px 8px 0 rgba(53,60,70,0.35)";
+const BOX_SHADOW_INSET = `inset 100px 3px 4px 0 rgba(53,60,70,0.50)`;
+export {
+  BOX_SHADOW,
+  BOX_SHADOW_FLOATING,
+  BOX_SHADOW_INSET,
+  BUTTON_FLOATING,
+  BUTTON_SIDEBAR_HEIGHT,
+  MIN_WIDTH_SIDEBAR
+};
+//# sourceMappingURL=styled.js.map

package/esm/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const MIN_WIDTH_SIDEBAR = 48;\nexport const BUTTON_SIDEBAR_HEIGHT = 48;\nexport const BUTTON_FLOATING = 56;\nexport const BOX_SHADOW = '0 5px 8px 0 rgba(53,60,70,0.55)';\nexport const BOX_SHADOW_FLOATING = '0 5px 8px 0 rgba(53,60,70,0.35)';\nexport const BOX_SHADOW_INSET = `inset 100px 3px 4px 0 rgba(53,60,70,0.50)`;\n"],
+  "mappings": "AAAA;ACAO,MAAM,oBAAoB;AAC1B,MAAM,wBAAwB;AAC9B,MAAM,kBAAkB;AACxB,MAAM,aAAa;AACnB,MAAM,sBAAsB;AAC5B,MAAM,mBAAmB;",
+  "names": []
+}

package/esm/tests/utils.js

@@ -0,0 +1,37 @@
+import * as React from "react";
+import { BUBBLE_TYPES } from "@elliemae/ds-chat";
+const getRandomMessages = (q, key) => Array(q).fill().map((v, i) => {
+  if (i > 5 && i % 22 === 0) {
+    return {
+      dsId: `${i}`,
+      body: `This is a system message that notifies the user of some important things`,
+      type: BUBBLE_TYPES.SYSTEM,
+      title: "System Message",
+      time: "4:50 pm"
+    };
+  }
+  if (i > 5 && i % 16 === 0) {
+    return {
+      dsId: `${i}`,
+      type: BUBBLE_TYPES.DELIMITER,
+      title: "Mon, Apr 25, 12:43 PM",
+      extraProps: { "data-testid": "custom-data-testid" }
+    };
+  }
+  const isSender = i % 2 === 0;
+  const chatBubbleType = isSender ? BUBBLE_TYPES.SENDER : BUBBLE_TYPES.RECIPIENT;
+  const chatTitle = isSender ? "Robert Deniro" : "Al Pacino";
+  return {
+    dsId: `${i}`,
+    body: `Message text ${key} Message text ${i}`,
+    type: chatBubbleType,
+    title: chatTitle,
+    time: "4:50 pm",
+    helpMessage: isSender ? "Delivered" : null
+  };
+});
+const loadMsgs = (q) => getRandomMessages(q, "item_key");
+export {
+  loadMsgs
+};
+//# sourceMappingURL=utils.js.map