@elliemae/ds-chat 1.53.4-rc.3 → 1.53.5-rc.0

package/esm/parts/message-delimiter/MessageDelimiter.js

@@ -2,14 +2,17 @@ import React from 'react';
 import { describe } from 'react-desc';
 import { Wrapper, Line, Text } from './styled.js';
 import { messageDelimiterProps, defaultProps } from './props.js';
+import { useValidateProps } from './config/useValidateProps.js';
 import '@elliemae/ds-grid';
 import 'styled-components';
+import '@elliemae/ds-props-helpers';
 
-var MessageDelimiter = function MessageDelimiter(_ref) {
-  var title = _ref.title,
-      size = _ref.size,
-      extraProps = _ref.extraProps,
-      verticalMargin = _ref.verticalMargin;
+var MessageDelimiter = function MessageDelimiter(props) {
+  useValidateProps(props, MessageDelimiterWithSchema.toJSON());
+  var title = props.title,
+      size = props.size,
+      extraProps = props.extraProps,
+      verticalMargin = props.verticalMargin;
   return /*#__PURE__*/React.createElement(Wrapper, {
     cols: ['1fr', 'auto', '1fr']
   }, /*#__PURE__*/React.createElement(Line, null), /*#__PURE__*/React.createElement(Text, {

package/esm/parts/message-delimiter/MessageDelimiter.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageDelimiter.js","sources":["../../../../src/parts/message-delimiter/MessageDelimiter.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport { Wrapper, Line, Text } from './styled';\nimport { defaultProps, messageDelimiterProps, MessageDelimiterProps } from './props';\n\nconst MessageDelimiter = ({ title, size, extraProps, verticalMargin }: MessageDelimiterProps): JSX.Element => (\n  <Wrapper cols={['1fr', 'auto', '1fr']}>\n    <Line />\n    <Text size={size} verticalMargin={verticalMargin} data-testid={extraProps['data-testid']}>\n      {title}\n    </Text>\n    <Line />\n  </Wrapper>\n);\n\nMessageDelimiter.defaultProps = defaultProps;\nMessageDelimiter.propTypes = messageDelimiterProps;\nconst MessageDelimiterWithSchema = describe(MessageDelimiter);\nMessageDelimiterWithSchema.propTypes = messageDelimiterProps;\n\nexport { MessageDelimiter, MessageDelimiterWithSchema };\n"],"names":["MessageDelimiter","title","size","extraProps","verticalMargin","defaultProps","propTypes","messageDelimiterProps","MessageDelimiterWithSchema","describe"],"mappings":";;;;;;;IAKMA,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,MAAGC,KAAH,QAAGA,KAAH;AAAA,MAAUC,IAAV,QAAUA,IAAV;AAAA,MAAgBC,UAAhB,QAAgBA,UAAhB;AAAA,MAA4BC,cAA5B,QAA4BA,cAA5B;AAAA,sBACvB,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE,CAAC,KAAD,EAAQ,MAAR,EAAgB,KAAhB;AAAf,kBACE,oBAAC,IAAD,OADF,eAEE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEF,IAAZ;AAAkB,IAAA,cAAc,EAAEE,cAAlC;AAAkD,mBAAaD,UAAU,CAAC,aAAD;AAAzE,KACGF,KADH,CAFF,eAKE,oBAAC,IAAD,OALF,CADuB;AAAA;;AAUzBD,gBAAgB,CAACK,YAAjB,GAAgCA,YAAhC;AACAL,gBAAgB,CAACM,SAAjB,GAA6BC,qBAA7B;IACMC,0BAA0B,GAAGC,QAAQ,CAACT,gBAAD;AAC3CQ,0BAA0B,CAACF,SAA3B,GAAuCC,qBAAvC;;;;"}
+{"version":3,"file":"MessageDelimiter.js","sources":["../../../../src/parts/message-delimiter/MessageDelimiter.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport { Wrapper, Line, Text } from './styled';\nimport { defaultProps, messageDelimiterProps, MessageDelimiterProps } from './props';\nimport { useValidateProps } from './config/useValidateProps';\n\nconst MessageDelimiter = (props: MessageDelimiterProps): JSX.Element => {\n  useValidateProps(props, MessageDelimiterWithSchema.toJSON());\n  const { title, size, extraProps, verticalMargin } = props;\n  return (\n    <Wrapper cols={['1fr', 'auto', '1fr']}>\n      <Line />\n      <Text size={size} verticalMargin={verticalMargin} data-testid={extraProps['data-testid']}>\n        {title}\n      </Text>\n      <Line />\n    </Wrapper>\n  );\n};\n\nMessageDelimiter.defaultProps = defaultProps;\nMessageDelimiter.propTypes = messageDelimiterProps;\nconst MessageDelimiterWithSchema = describe(MessageDelimiter);\nMessageDelimiterWithSchema.propTypes = messageDelimiterProps;\n\nexport { MessageDelimiter, MessageDelimiterWithSchema };\n"],"names":["MessageDelimiter","props","useValidateProps","MessageDelimiterWithSchema","toJSON","title","size","extraProps","verticalMargin","defaultProps","propTypes","messageDelimiterProps","describe"],"mappings":";;;;;;;;;IAMMA,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAA+C;AACtEC,EAAAA,gBAAgB,CAACD,KAAD,EAAQE,0BAA0B,CAACC,MAA3B,EAAR,CAAhB;AACA,MAAQC,KAAR,GAAoDJ,KAApD,CAAQI,KAAR;AAAA,MAAeC,IAAf,GAAoDL,KAApD,CAAeK,IAAf;AAAA,MAAqBC,UAArB,GAAoDN,KAApD,CAAqBM,UAArB;AAAA,MAAiCC,cAAjC,GAAoDP,KAApD,CAAiCO,cAAjC;AACA,sBACE,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE,CAAC,KAAD,EAAQ,MAAR,EAAgB,KAAhB;AAAf,kBACE,oBAAC,IAAD,OADF,eAEE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEF,IAAZ;AAAkB,IAAA,cAAc,EAAEE,cAAlC;AAAkD,mBAAaD,UAAU,CAAC,aAAD;AAAzE,KACGF,KADH,CAFF,eAKE,oBAAC,IAAD,OALF,CADF;AASD;;AAEDL,gBAAgB,CAACS,YAAjB,GAAgCA,YAAhC;AACAT,gBAAgB,CAACU,SAAjB,GAA6BC,qBAA7B;IACMR,0BAA0B,GAAGS,QAAQ,CAACZ,gBAAD;AAC3CG,0BAA0B,CAACO,SAA3B,GAAuCC,qBAAvC;;;;"}

package/esm/parts/message-delimiter/config/useValidateProps.js

@@ -0,0 +1,8 @@
+import { useValidatePropTypes } from '@elliemae/ds-props-helpers';
+
+var useValidateProps = function useValidateProps(props, schema) {
+  useValidatePropTypes(props, schema);
+};
+
+export { useValidateProps };
+//# sourceMappingURL=useValidateProps.js.map

package/esm/parts/message-delimiter/config/useValidateProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useValidateProps.js","sources":["../../../../../src/parts/message-delimiter/config/useValidateProps.tsx"],"sourcesContent":["import { useValidatePropTypes } from '@elliemae/ds-props-helpers';\nimport { MessageDelimiterProps } from '../props';\n\nexport const useValidateProps = (props: MessageDelimiterProps, schema: unknown): void => {\n  useValidatePropTypes(props, schema);\n};\n"],"names":["useValidateProps","props","schema","useValidatePropTypes"],"mappings":";;IAGaA,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAA+BC,MAA/B,EAAyD;AACvFC,EAAAA,oBAAoB,CAACF,KAAD,EAAQC,MAAR,CAApB;AACD;;;;"}

package/esm/parts/message-delimiter/index.js

@@ -5,4 +5,6 @@ import './styled.js';
 import '@elliemae/ds-grid';
 import 'styled-components';
 import './props.js';
+import './config/useValidateProps.js';
+import '@elliemae/ds-props-helpers';
 //# sourceMappingURL=index.js.map

package/esm/parts/message-delimiter/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/esm/parts/message-delimiter/props.js

@@ -12,7 +12,7 @@ var messageDelimiterProps = {
   title: PropTypes.string.isRequired.description('Text to display in the delimiter'),
   size: PropTypes.oneOf(['s', 'l']).description('size of the delimiter').defaultValue('s'),
   extraProps: PropTypes.object.description('extra props for delimiter'),
-  verticalMargin: PropTypes.string.description('Configurable css vertical margin property for flexibilty')
+  verticalMargin: PropTypes.oneOf(['string', 'number']).description('Configurable css vertical margin property for flexibilty')
 };
 
 export { defaultProps, messageDelimiterProps };

package/esm/parts/message-delimiter/props.js.map

@@ -1 +1 @@
-{"version":3,"file":"props.js","sources":["../../../../src/parts/message-delimiter/props.tsx"],"sourcesContent":["import { PropTypes } from 'react-desc';\n\nexport interface MessageDelimiterProps {\n  title: string;\n  size?: 's' | 'l';\n  verticalMargin?: number | string;\n  extraProps?: {};\n}\n\nexport const defaultProps: MessageDelimiterProps = {\n  title: '',\n  size: 's',\n  verticalMargin: '0px',\n  extraProps: { 'data-testid': 'chat-message-delimiter-title' },\n};\n\nexport const messageDelimiterProps = {\n  title: PropTypes.string.isRequired.description('Text to display in the delimiter'),\n  size: PropTypes.oneOf(['s', 'l']).description('size of the delimiter').defaultValue('s'),\n  extraProps: PropTypes.object.description('extra props for delimiter'),\n  verticalMargin: PropTypes.string.description('Configurable css vertical margin property for flexibilty'),\n};\n"],"names":["defaultProps","title","size","verticalMargin","extraProps","messageDelimiterProps","PropTypes","string","isRequired","description","oneOf","defaultValue","object"],"mappings":";;IASaA,YAAmC,GAAG;AACjDC,EAAAA,KAAK,EAAE,EAD0C;AAEjDC,EAAAA,IAAI,EAAE,GAF2C;AAGjDC,EAAAA,cAAc,EAAE,KAHiC;AAIjDC,EAAAA,UAAU,EAAE;AAAE,mBAAe;AAAjB;AAJqC;IAOtCC,qBAAqB,GAAG;AACnCJ,EAAAA,KAAK,EAAEK,SAAS,CAACC,MAAV,CAAiBC,UAAjB,CAA4BC,WAA5B,CAAwC,kCAAxC,CAD4B;AAEnCP,EAAAA,IAAI,EAAEI,SAAS,CAACI,KAAV,CAAgB,CAAC,GAAD,EAAM,GAAN,CAAhB,EAA4BD,WAA5B,CAAwC,uBAAxC,EAAiEE,YAAjE,CAA8E,GAA9E,CAF6B;AAGnCP,EAAAA,UAAU,EAAEE,SAAS,CAACM,MAAV,CAAiBH,WAAjB,CAA6B,2BAA7B,CAHuB;AAInCN,EAAAA,cAAc,EAAEG,SAAS,CAACC,MAAV,CAAiBE,WAAjB,CAA6B,0DAA7B;AAJmB;;;;"}
+{"version":3,"file":"props.js","sources":["../../../../src/parts/message-delimiter/props.tsx"],"sourcesContent":["import { PropTypes } from 'react-desc';\n\nexport interface MessageDelimiterProps {\n  title: string;\n  size?: 's' | 'l';\n  verticalMargin?: number | string;\n  extraProps?: {};\n}\n\nexport const defaultProps: MessageDelimiterProps = {\n  title: '',\n  size: 's',\n  verticalMargin: '0px',\n  extraProps: { 'data-testid': 'chat-message-delimiter-title' },\n};\n\nexport const messageDelimiterProps = {\n  title: PropTypes.string.isRequired.description('Text to display in the delimiter'),\n  size: PropTypes.oneOf(['s', 'l']).description('size of the delimiter').defaultValue('s'),\n  extraProps: PropTypes.object.description('extra props for delimiter'),\n  verticalMargin: PropTypes.oneOf(['string', 'number']).description(\n    'Configurable css vertical margin property for flexibilty',\n  ),\n};\n"],"names":["defaultProps","title","size","verticalMargin","extraProps","messageDelimiterProps","PropTypes","string","isRequired","description","oneOf","defaultValue","object"],"mappings":";;IASaA,YAAmC,GAAG;AACjDC,EAAAA,KAAK,EAAE,EAD0C;AAEjDC,EAAAA,IAAI,EAAE,GAF2C;AAGjDC,EAAAA,cAAc,EAAE,KAHiC;AAIjDC,EAAAA,UAAU,EAAE;AAAE,mBAAe;AAAjB;AAJqC;IAOtCC,qBAAqB,GAAG;AACnCJ,EAAAA,KAAK,EAAEK,SAAS,CAACC,MAAV,CAAiBC,UAAjB,CAA4BC,WAA5B,CAAwC,kCAAxC,CAD4B;AAEnCP,EAAAA,IAAI,EAAEI,SAAS,CAACI,KAAV,CAAgB,CAAC,GAAD,EAAM,GAAN,CAAhB,EAA4BD,WAA5B,CAAwC,uBAAxC,EAAiEE,YAAjE,CAA8E,GAA9E,CAF6B;AAGnCP,EAAAA,UAAU,EAAEE,SAAS,CAACM,MAAV,CAAiBH,WAAjB,CAA6B,2BAA7B,CAHuB;AAInCN,EAAAA,cAAc,EAAEG,SAAS,CAACI,KAAV,CAAgB,CAAC,QAAD,EAAW,QAAX,CAAhB,EAAsCD,WAAtC,CACd,0DADc;AAJmB;;;;"}

package/esm/parts/sidebar-button/SidebarButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarButton.js","sources":["../../../../src/parts/sidebar-button/SidebarButton.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  StyledSidebarButton,\n  StyledSidebarButtonLabel,\n  StyledSidebarButtonIcon,\n} from './styled';\nimport {\n  propsSidebarButton,\n  defaultSidebarButton,\n  SidebarButtonProps,\n} from './props';\n\nexport const SidebarButton = ({\n  label,\n  dsId,\n  onClick,\n  Icon,\n  ...rest\n}: SidebarButtonProps): JSX.Element => {\n  const handleClick = React.useCallback(() => {\n    onClick(dsId);\n  }, [onClick, dsId]);\n\n  return (\n    <StyledSidebarButton\n      key={dsId}\n      data-testid={`sidebar-button-${dsId}`}\n      onClick={handleClick}\n      {...rest}\n    >\n      <StyledSidebarButtonIcon alignItems=\"center\" justifyContent=\"center\">\n        <Icon size=\"m\" />\n      </StyledSidebarButtonIcon>\n      {label && <StyledSidebarButtonLabel>{label}</StyledSidebarButtonLabel>}\n    </StyledSidebarButton>\n  );\n};\n\nSidebarButton.propTypes = propsSidebarButton;\nSidebarButton.defaultProps = defaultSidebarButton;\n"],"names":["SidebarButton","label","dsId","onClick","Icon","rest","handleClick","React","useCallback","propTypes","propsSidebarButton","defaultProps","defaultSidebarButton"],"mappings":";;;;;;;;;;;;;;IAYaA,aAAa,GAAG,SAAhBA,aAAgB,OAMU;AAAA,MALrCC,KAKqC,QALrCA,KAKqC;AAAA,MAJrCC,IAIqC,QAJrCA,IAIqC;AAAA,MAHrCC,OAGqC,QAHrCA,OAGqC;AAAA,MAFrCC,IAEqC,QAFrCA,IAEqC;AAAA,MADlCC,IACkC;;AACrC,MAAMC,WAAW,GAAGC,KAAK,CAACC,WAAN,CAAkB,YAAM;AAC1CL,IAAAA,OAAO,CAACD,IAAD,CAAP;AACD,GAFmB,EAEjB,CAACC,OAAD,EAAUD,IAAV,CAFiB,CAApB;AAIA,sBACE,oBAAC,mBAAD;AACE,IAAA,GAAG,EAAEA,IADP;AAEE,4CAA+BA,IAA/B,CAFF;AAGE,IAAA,OAAO,EAAEI;AAHX,KAIMD,IAJN,gBAME,oBAAC,uBAAD;AAAyB,IAAA,UAAU,EAAC,QAApC;AAA6C,IAAA,cAAc,EAAC;AAA5D,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAC;AAAX,IADF,CANF,EASGJ,KAAK,iBAAI,oBAAC,wBAAD,QAA2BA,KAA3B,CATZ,CADF;AAaD;AAEDD,aAAa,CAACS,SAAd,GAA0BC,kBAA1B;AACAV,aAAa,CAACW,YAAd,GAA6BC,oBAA7B;;;;"}
+{"version":3,"file":"SidebarButton.js","sources":["../../../../src/parts/sidebar-button/SidebarButton.tsx"],"sourcesContent":["import React from 'react';\nimport { StyledSidebarButton, StyledSidebarButtonLabel, StyledSidebarButtonIcon } from './styled';\nimport { propsSidebarButton, defaultSidebarButton, SidebarButtonProps } from './props';\n\nexport const SidebarButton = ({ label, dsId, onClick, Icon, ...rest }: SidebarButtonProps): JSX.Element => {\n  const handleClick = React.useCallback(() => {\n    onClick(dsId);\n  }, [onClick, dsId]);\n\n  return (\n    <StyledSidebarButton key={dsId} data-testid={`sidebar-button-${dsId}`} onClick={handleClick} {...rest}>\n      <StyledSidebarButtonIcon alignItems=\"center\" justifyContent=\"center\">\n        <Icon size=\"m\" />\n      </StyledSidebarButtonIcon>\n      {label && <StyledSidebarButtonLabel>{label}</StyledSidebarButtonLabel>}\n    </StyledSidebarButton>\n  );\n};\n\nSidebarButton.propTypes = propsSidebarButton;\nSidebarButton.defaultProps = defaultSidebarButton;\n"],"names":["SidebarButton","label","dsId","onClick","Icon","rest","handleClick","React","useCallback","propTypes","propsSidebarButton","defaultProps","defaultSidebarButton"],"mappings":";;;;;;;;;;;;;;IAIaA,aAAa,GAAG,SAAhBA,aAAgB,OAA8E;AAAA,MAA3EC,KAA2E,QAA3EA,KAA2E;AAAA,MAApEC,IAAoE,QAApEA,IAAoE;AAAA,MAA9DC,OAA8D,QAA9DA,OAA8D;AAAA,MAArDC,IAAqD,QAArDA,IAAqD;AAAA,MAA5CC,IAA4C;;AACzG,MAAMC,WAAW,GAAGC,KAAK,CAACC,WAAN,CAAkB,YAAM;AAC1CL,IAAAA,OAAO,CAACD,IAAD,CAAP;AACD,GAFmB,EAEjB,CAACC,OAAD,EAAUD,IAAV,CAFiB,CAApB;AAIA,sBACE,oBAAC,mBAAD;AAAqB,IAAA,GAAG,EAAEA,IAA1B;AAAgC,4CAA+BA,IAA/B,CAAhC;AAAuE,IAAA,OAAO,EAAEI;AAAhF,KAAiGD,IAAjG,gBACE,oBAAC,uBAAD;AAAyB,IAAA,UAAU,EAAC,QAApC;AAA6C,IAAA,cAAc,EAAC;AAA5D,kBACE,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAC;AAAX,IADF,CADF,EAIGJ,KAAK,iBAAI,oBAAC,wBAAD,QAA2BA,KAA3B,CAJZ,CADF;AAQD;AAEDD,aAAa,CAACS,SAAd,GAA0BC,kBAA1B;AACAV,aAAa,CAACW,YAAd,GAA6BC,oBAA7B;;;;"}

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

@@ -4,10 +4,12 @@ import { BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR } from '../../styled.js';
 
 var StyledSidebarButton = /*#__PURE__*/styled.button.withConfig({
   componentId: "sc-6ygly3-0"
-})(["display:flex;align-items:center;justify-content:center;outline:none;height:", "px;width:", "px;position:relative;border:0;background:transparent;&:focus,&:hover{background:", ";}cursor:pointer;border-bottom:1px solid ", ";"], BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR, function (props) {
+})(["display:flex;align-items:center;justify-content:center;outline:none;height:", "px;width:", "px;position:relative;border:0;background:transparent;&:focus,&:hover{background:", ";}cursor:pointer;border-bottom:1px solid ", ";svg{fill:", ";}"], BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR, function (props) {
   return props.theme.colors.neutral['080'];
 }, function (props) {
   return props.theme.colors.neutral['200'];
+}, function (props) {
+  return props.theme.colors.neutral[500];
 });
 var StyledSidebarButtonIcon = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-6ygly3-1"

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

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../src/parts/sidebar-button/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR } from '../../styled';\n\n// Buttons\nexport const StyledSidebarButton = styled.button`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  outline: none;\n  height: ${BUTTON_SIDEBAR_HEIGHT}px;\n  width: ${MIN_WIDTH_SIDEBAR}px;\n  position: relative;\n  border: 0;\n  background: transparent;\n  &:focus,\n  &:hover {\n    background: ${(props) => props.theme.colors.neutral['080']};\n  }\n  cursor: pointer;\n  border-bottom: 1px solid ${(props) => props.theme.colors.neutral['200']};\n`;\n\nexport const StyledSidebarButtonIcon = styled(Grid)`\n  position: relative;\n`;\n\nexport const StyledSidebarButtonLabel = styled.div`\n  width: 30px;\n  text-transform: uppercase;\n  overflow: hidden;\n  text-align: center;\n`;\n"],"names":["StyledSidebarButton","styled","button","BUTTON_SIDEBAR_HEIGHT","MIN_WIDTH_SIDEBAR","props","theme","colors","neutral","StyledSidebarButtonIcon","Grid","StyledSidebarButtonLabel","div"],"mappings":";;;;IAKaA,mBAAmB,gBAAGC,MAAM,CAACC,MAAV;AAAA;AAAA,uOAKpBC,qBALoB,EAMrBC,iBANqB,EAYd,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,KAA3B,CAAX;AAAA,CAZc,EAeH,UAACH,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,KAA3B,CAAX;AAAA,CAfG;IAkBnBC,uBAAuB,gBAAGR,MAAM,CAACS,IAAD,CAAT;AAAA;AAAA;IAIvBC,wBAAwB,gBAAGV,MAAM,CAACW,GAAV;AAAA;AAAA;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../src/parts/sidebar-button/styled.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUTTON_SIDEBAR_HEIGHT, MIN_WIDTH_SIDEBAR } from '../../styled';\n\n// Buttons\nexport const StyledSidebarButton = styled.button`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  outline: none;\n  height: ${BUTTON_SIDEBAR_HEIGHT}px;\n  width: ${MIN_WIDTH_SIDEBAR}px;\n  position: relative;\n  border: 0;\n  background: transparent;\n  &:focus,\n  &:hover {\n    background: ${(props) => props.theme.colors.neutral['080']};\n  }\n  cursor: pointer;\n  border-bottom: 1px solid ${(props) => props.theme.colors.neutral['200']};\n\n  svg {\n    fill: ${(props) => props.theme.colors.neutral[500]};\n  }\n`;\n\nexport const StyledSidebarButtonIcon = styled(Grid)`\n  position: relative;\n`;\n\nexport const StyledSidebarButtonLabel = styled.div`\n  width: 30px;\n  text-transform: uppercase;\n  overflow: hidden;\n  text-align: center;\n`;\n"],"names":["StyledSidebarButton","styled","button","BUTTON_SIDEBAR_HEIGHT","MIN_WIDTH_SIDEBAR","props","theme","colors","neutral","StyledSidebarButtonIcon","Grid","StyledSidebarButtonLabel","div"],"mappings":";;;;IAKaA,mBAAmB,gBAAGC,MAAM,CAACC,MAAV;AAAA;AAAA,sPAKpBC,qBALoB,EAMrBC,iBANqB,EAYd,UAACC,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,KAA3B,CAAX;AAAA,CAZc,EAeH,UAACH,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,KAA3B,CAAX;AAAA,CAfG,EAkBpB,UAACH,KAAD;AAAA,SAAWA,KAAK,CAACC,KAAN,CAAYC,MAAZ,CAAmBC,OAAnB,CAA2B,GAA3B,CAAX;AAAA,CAlBoB;IAsBnBC,uBAAuB,gBAAGR,MAAM,CAACS,IAAD,CAAT;AAAA;AAAA;IAIvBC,wBAAwB,gBAAGV,MAAM,CAACW,GAAV;AAAA;AAAA;;;;"}

package/esm/parts/system-message/SystemMessage.js

@@ -2,13 +2,16 @@ import React from 'react';
 import { describe } from 'react-desc';
 import { Wrapper, Header, Title, Time, Message } from './style.js';
 import { systemMessageProps, defaultProps } from './props.js';
+import { useValidateProps } from './config/useValidateProps.js';
 import 'styled-components';
 import '@elliemae/ds-grid';
+import '@elliemae/ds-props-helpers';
 
-var SystemMessage = function SystemMessage(_ref) {
-  var title = _ref.title,
-      time = _ref.time,
-      body = _ref.body;
+var SystemMessage = function SystemMessage(props) {
+  useValidateProps(props, SystemMessageWithSchema.toJSON());
+  var title = props.title,
+      time = props.time,
+      body = props.body;
   return /*#__PURE__*/React.createElement(Wrapper, {
     rows: ['auto', 'auto']
   }, /*#__PURE__*/React.createElement(Header, {

package/esm/parts/system-message/SystemMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SystemMessage.js","sources":["../../../../src/parts/system-message/SystemMessage.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport { Wrapper, Header, Title, Time, Message } from './style';\nimport { SystemMessageProps, systemMessageProps, defaultProps } from './props';\n\nconst SystemMessage = ({\n  title,\n  time,\n  body,\n}: SystemMessageProps): JSX.Element => (\n  <Wrapper rows={['auto', 'auto']}>\n    <Header cols={['1fr', 'auto', '1fr']}>\n      <span />\n      <Title data-testid=\"chat-system-message-title\">{title}</Title>\n      <Time data-testid=\"chat-system-message-time\">{time}</Time>\n    </Header>\n    <Message data-testid=\"chat-system-message-body\">{body}</Message>\n  </Wrapper>\n);\n\nSystemMessage.defaultProps = defaultProps;\nSystemMessage.propTypes = systemMessageProps;\nconst SystemMessageWithSchema = describe(SystemMessage);\nSystemMessageWithSchema.propTypes = systemMessageProps;\n\nexport { SystemMessage, SystemMessageWithSchema };\n"],"names":["SystemMessage","title","time","body","defaultProps","propTypes","systemMessageProps","SystemMessageWithSchema","describe"],"mappings":";;;;;;;IAKMA,aAAa,GAAG,SAAhBA,aAAgB;AAAA,MACpBC,KADoB,QACpBA,KADoB;AAAA,MAEpBC,IAFoB,QAEpBA,IAFoB;AAAA,MAGpBC,IAHoB,QAGpBA,IAHoB;AAAA,sBAKpB,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAf,kBACE,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE,CAAC,KAAD,EAAQ,MAAR,EAAgB,KAAhB;AAAd,kBACE,iCADF,eAEE,oBAAC,KAAD;AAAO,mBAAY;AAAnB,KAAgDF,KAAhD,CAFF,eAGE,oBAAC,IAAD;AAAM,mBAAY;AAAlB,KAA8CC,IAA9C,CAHF,CADF,eAME,oBAAC,OAAD;AAAS,mBAAY;AAArB,KAAiDC,IAAjD,CANF,CALoB;AAAA;;AAetBH,aAAa,CAACI,YAAd,GAA6BA,YAA7B;AACAJ,aAAa,CAACK,SAAd,GAA0BC,kBAA1B;IACMC,uBAAuB,GAAGC,QAAQ,CAACR,aAAD;AACxCO,uBAAuB,CAACF,SAAxB,GAAoCC,kBAApC;;;;"}
+{"version":3,"file":"SystemMessage.js","sources":["../../../../src/parts/system-message/SystemMessage.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport { Wrapper, Header, Title, Time, Message } from './style';\nimport { SystemMessageProps, systemMessageProps, defaultProps } from './props';\nimport { useValidateProps } from './config/useValidateProps';\n\nconst SystemMessage = (props: SystemMessageProps): JSX.Element => {\n  useValidateProps(props, SystemMessageWithSchema.toJSON());\n  const { title, time, body } = props;\n  return (\n    <Wrapper rows={['auto', 'auto']}>\n      <Header cols={['1fr', 'auto', '1fr']}>\n        <span />\n        <Title data-testid=\"chat-system-message-title\">{title}</Title>\n        <Time data-testid=\"chat-system-message-time\">{time}</Time>\n      </Header>\n      <Message data-testid=\"chat-system-message-body\">{body}</Message>\n    </Wrapper>\n  );\n};\n\nSystemMessage.defaultProps = defaultProps;\nSystemMessage.propTypes = systemMessageProps;\nconst SystemMessageWithSchema = describe(SystemMessage);\nSystemMessageWithSchema.propTypes = systemMessageProps;\n\nexport { SystemMessage, SystemMessageWithSchema };\n"],"names":["SystemMessage","props","useValidateProps","SystemMessageWithSchema","toJSON","title","time","body","defaultProps","propTypes","systemMessageProps","describe"],"mappings":";;;;;;;;;IAMMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD,EAA4C;AAChEC,EAAAA,gBAAgB,CAACD,KAAD,EAAQE,uBAAuB,CAACC,MAAxB,EAAR,CAAhB;AACA,MAAQC,KAAR,GAA8BJ,KAA9B,CAAQI,KAAR;AAAA,MAAeC,IAAf,GAA8BL,KAA9B,CAAeK,IAAf;AAAA,MAAqBC,IAArB,GAA8BN,KAA9B,CAAqBM,IAArB;AACA,sBACE,oBAAC,OAAD;AAAS,IAAA,IAAI,EAAE,CAAC,MAAD,EAAS,MAAT;AAAf,kBACE,oBAAC,MAAD;AAAQ,IAAA,IAAI,EAAE,CAAC,KAAD,EAAQ,MAAR,EAAgB,KAAhB;AAAd,kBACE,iCADF,eAEE,oBAAC,KAAD;AAAO,mBAAY;AAAnB,KAAgDF,KAAhD,CAFF,eAGE,oBAAC,IAAD;AAAM,mBAAY;AAAlB,KAA8CC,IAA9C,CAHF,CADF,eAME,oBAAC,OAAD;AAAS,mBAAY;AAArB,KAAiDC,IAAjD,CANF,CADF;AAUD;;AAEDP,aAAa,CAACQ,YAAd,GAA6BA,YAA7B;AACAR,aAAa,CAACS,SAAd,GAA0BC,kBAA1B;IACMP,uBAAuB,GAAGQ,QAAQ,CAACX,aAAD;AACxCG,uBAAuB,CAACM,SAAxB,GAAoCC,kBAApC;;;;"}

package/esm/parts/system-message/config/useValidateProps.js

@@ -0,0 +1,8 @@
+import { useValidatePropTypes } from '@elliemae/ds-props-helpers';
+
+var useValidateProps = function useValidateProps(props, schema) {
+  useValidatePropTypes(props, schema);
+};
+
+export { useValidateProps };
+//# sourceMappingURL=useValidateProps.js.map

package/esm/parts/system-message/config/useValidateProps.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useValidateProps.js","sources":["../../../../../src/parts/system-message/config/useValidateProps.tsx"],"sourcesContent":["import { useValidatePropTypes } from '@elliemae/ds-props-helpers';\nimport { SystemMessageProps } from '../props';\n\nexport const useValidateProps = (props: SystemMessageProps, schema: unknown): void => {\n  useValidatePropTypes(props, schema);\n};\n"],"names":["useValidateProps","props","schema","useValidatePropTypes"],"mappings":";;IAGaA,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAA4BC,MAA5B,EAAsD;AACpFC,EAAAA,oBAAoB,CAACF,KAAD,EAAQC,MAAR,CAApB;AACD;;;;"}

package/esm/parts/system-message/index.js

@@ -5,4 +5,6 @@ import './style.js';
 import 'styled-components';
 import '@elliemae/ds-grid';
 import './props.js';
+import './config/useValidateProps.js';
+import '@elliemae/ds-props-helpers';
 //# sourceMappingURL=index.js.map

package/esm/parts/system-message/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

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

@@ -5,12 +5,14 @@ import { Grid } from '@elliemae/ds-grid';
 import CloseXsmall from '@elliemae/ds-icons/CloseXsmall';
 import { StyledWrapperCentralContent, StyledTileButtonIcon, StyledStatusBadge, StyledTileButtonLabel, StyledTileButton, StyledWrapper, StyledWrapperLeftBorder, CloseButton } from './styled.js';
 import { propsTileButton, defaultTileButton } from './props.js';
+import { useValidateProps } from './config/useValidateProps.js';
 import 'styled-components';
-import 'prop-types';
 import 'lodash';
 import '@elliemae/ds-icons/Comments';
+import '@elliemae/ds-props-helpers';
 
 var TileButton = function TileButton(props) {
+  useValidateProps(props, TileButtonWithSchema.toJSON());
   var label = props.label,
       title = props.title,
       dsId = props.dsId,

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

@@ -1 +1 @@
-{"version":3,"file":"TileButton.js","sources":["../../../../src/parts/tile-button/TileButton.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport DSTooltip from '@elliemae/ds-tooltip';\nimport { Grid } from '@elliemae/ds-grid';\nimport CloseXsmall from '@elliemae/ds-icons/CloseXsmall';\nimport {\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';\n\nconst TileButton = (props: TileButtonProps): JSX.Element => {\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  } = 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 ? <StyledStatusBadge badgeColor={badgeColor} badgePosition={badgePosition} /> : 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  return (\n    <StyledTileButton\n      key={dsId}\n      isHeader={isHeader}\n      value={dsId}\n      data-testid={`tile-button-${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    >\n      <StyledWrapper alignItems=\"center\" justifyContent=\"center\">\n        {title ? (\n          <DSTooltip\n            containerProps={{\n              id: `ds-chat-tile-tooltip-button-${dsId}`,\n              'data-testid': `ds-chat-tile-tooltip-button-${dsId}`,\n            }}\n            interactionType=\"hover\"\n            title={title}\n            triggerComponent={<span>{MainContent}</span>}\n            placement=\"bottom\"\n          />\n        ) : (\n          MainContent\n        )}\n        <StyledWrapperLeftBorder />\n        {showClose && !disabled ? (\n          <CloseButton onClick={onClose} value={dsId}>\n            <CloseXsmall />\n          </CloseButton>\n        ) : null}\n      </StyledWrapper>\n    </StyledTileButton>\n  );\n};\n\nTileButton.propTypes = propsTileButton;\nTileButton.defaultProps = defaultTileButton;\n\nconst TileButtonWithSchema = describe(TileButton);\nTileButtonWithSchema.propTypes = propsTileButton;\n\nexport { TileButton, TileButtonWithSchema };\n"],"names":["TileButton","props","label","title","dsId","onClick","onFocus","onBlur","Icon","showClose","onClose","badge","badgeColor","badgePosition","disabled","selected","isHeader","ariaLabel","handleClick","React","useCallback","MainContent","useMemo","undefined","id","propTypes","propsTileButton","defaultProps","defaultTileButton","TileButtonWithSchema","describe"],"mappings":"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"}
+{"version":3,"file":"TileButton.js","sources":["../../../../src/parts/tile-button/TileButton.tsx"],"sourcesContent":["import React from 'react';\nimport { describe } from 'react-desc';\nimport DSTooltip from '@elliemae/ds-tooltip';\nimport { Grid } from '@elliemae/ds-grid';\nimport CloseXsmall from '@elliemae/ds-icons/CloseXsmall';\nimport {\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  } = 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 ? <StyledStatusBadge badgeColor={badgeColor} badgePosition={badgePosition} /> : 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  return (\n    <StyledTileButton\n      key={dsId}\n      isHeader={isHeader}\n      value={dsId}\n      data-testid={`tile-button-${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    >\n      <StyledWrapper alignItems=\"center\" justifyContent=\"center\">\n        {title ? (\n          <DSTooltip\n            containerProps={{\n              id: `ds-chat-tile-tooltip-button-${dsId}`,\n              'data-testid': `ds-chat-tile-tooltip-button-${dsId}`,\n            }}\n            interactionType=\"hover\"\n            title={title}\n            triggerComponent={<span>{MainContent}</span>}\n            placement=\"bottom\"\n          />\n        ) : (\n          MainContent\n        )}\n        <StyledWrapperLeftBorder />\n        {showClose && !disabled ? (\n          <CloseButton onClick={onClose} value={dsId}>\n            <CloseXsmall />\n          </CloseButton>\n        ) : null}\n      </StyledWrapper>\n    </StyledTileButton>\n  );\n};\n\nTileButton.propTypes = propsTileButton;\nTileButton.defaultProps = defaultTileButton;\n\nconst TileButtonWithSchema = describe(TileButton);\nTileButtonWithSchema.propTypes = propsTileButton;\n\nexport { TileButton, TileButtonWithSchema };\n"],"names":["TileButton","props","useValidateProps","TileButtonWithSchema","toJSON","label","title","dsId","onClick","onFocus","onBlur","Icon","showClose","onClose","badge","badgeColor","badgePosition","disabled","selected","isHeader","ariaLabel","handleClick","React","useCallback","MainContent","useMemo","undefined","id","propTypes","propsTileButton","defaultProps","defaultTileButton","describe"],"mappings":"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"}

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

@@ -0,0 +1,8 @@
+import { useValidatePropTypes } from '@elliemae/ds-props-helpers';
+
+var useValidateProps = function useValidateProps(props, schema) {
+  useValidatePropTypes(props, schema);
+};
+
+export { useValidateProps };
+//# sourceMappingURL=useValidateProps.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useValidateProps.js","sources":["../../../../../src/parts/tile-button/config/useValidateProps.tsx"],"sourcesContent":["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"],"names":["useValidateProps","props","schema","useValidatePropTypes"],"mappings":";;IAGaA,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACC,KAAD,EAAyBC,MAAzB,EAAmD;AACjFC,EAAAA,oBAAoB,CAACF,KAAD,EAAQC,MAAR,CAApB;AACD;;;;"}

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

@@ -7,7 +7,8 @@ import '@elliemae/ds-icons/CloseXsmall';
 import './styled.js';
 import 'styled-components';
 import './props.js';
-import 'prop-types';
 import 'lodash';
 import '@elliemae/ds-icons/Comments';
+import './config/useValidateProps.js';
+import '@elliemae/ds-props-helpers';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

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

@@ -1,4 +1,3 @@
-import propsTypes from 'prop-types';
 import { PropTypes } from 'react-desc';
 import { noop } from 'lodash';
 import Comments from '@elliemae/ds-icons/Comments';
@@ -22,8 +21,8 @@ var defaultTileButton = {
   ariaLabel: 'Tile button'
 };
 var propsTileButton = {
-  Icon: PropTypes.element.description('Icon component').defaultValue(defaultTileButton.Icon),
-  dsId: PropTypes.oneOfType([propsTypes.number, propsTypes.string]).description('Unique id for the button').defaultValue(defaultTileButton.dsId),
+  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),
@@ -33,7 +32,7 @@ var propsTileButton = {
   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(['blue', 'green']).description('Color badge: blue or green').defaultValue(defaultTileButton.badgePosition),
+  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),

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

@@ -1 +1 @@
-{"version":3,"file":"props.js","sources":["../../../../src/parts/tile-button/props.ts"],"sourcesContent":["import React from 'react';\nimport propsTypes from 'prop-types';\nimport { PropTypes } from 'react-desc';\nimport { noop } from 'lodash';\nimport Comments from '@elliemae/ds-icons/Comments';\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}\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};\n\nexport const propsTileButton = {\n  Icon: PropTypes.element\n    .description('Icon component')\n    .defaultValue(defaultTileButton.Icon),\n  dsId: PropTypes.oneOfType([propsTypes.number, propsTypes.string])\n    .description('Unique id for the button')\n    .defaultValue(defaultTileButton.dsId),\n  label: PropTypes.string\n    .description('It will display under the icon')\n    .defaultValue(defaultTileButton.label),\n  title: PropTypes.string\n    .description('Tooltip')\n    .defaultValue(defaultTileButton.title),\n  onClick: PropTypes.func\n    .description('The function to call when is clicked')\n    .defaultValue(defaultTileButton.onClick),\n  onFocus: PropTypes.func\n    .description('The function to call when is focused')\n    .defaultValue(defaultTileButton.onFocus),\n  onBlur: PropTypes.func\n    .description('The function to call when is on blur')\n    .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\n    .description('It will display the X')\n    .defaultValue(defaultTileButton.showClose),\n  badge: PropTypes.bool\n    .description('It will display the badge')\n    .defaultValue(defaultTileButton.badge),\n  badgeColor: PropTypes.oneOf(['blue', 'green'])\n    .description('Color badge: blue or green')\n    .defaultValue(defaultTileButton.badgeColor),\n  badgePosition: PropTypes.oneOf(['blue', 'green'])\n    .description('Color badge: blue or green')\n    .defaultValue(defaultTileButton.badgePosition),\n  disabled: PropTypes.bool\n    .description('It will disabled the button')\n    .defaultValue(defaultTileButton.disabled),\n  selected: PropTypes.bool\n    .description('Indicate that the button is selected')\n    .defaultValue(defaultTileButton.disabled),\n  isHeader: PropTypes.bool\n    .description(\"It won't render the label\")\n    .defaultValue(defaultTileButton.disabled),\n  ariaLabel: PropTypes.string\n    .description('aria-label attribute')\n    .defaultValue(defaultTileButton.ariaLabel),\n};\n"],"names":["defaultTileButton","Icon","Comments","dsId","undefined","label","onClick","noop","onBlur","onFocus","title","onClose","showClose","badge","badgeColor","badgePosition","disabled","selected","isHeader","ariaLabel","propsTileButton","PropTypes","element","description","defaultValue","oneOfType","propsTypes","number","string","func","bool","oneOf"],"mappings":"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"}
+{"version":3,"file":"props.js","sources":["../../../../src/parts/tile-button/props.ts"],"sourcesContent":["import React from 'react';\nimport propsTypes from 'prop-types';\nimport { PropTypes } from 'react-desc';\nimport { noop } from 'lodash';\nimport Comments from '@elliemae/ds-icons/Comments';\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}\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};\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};\n"],"names":["defaultTileButton","Icon","Comments","dsId","undefined","label","onClick","noop","onBlur","onFocus","title","onClose","showClose","badge","badgeColor","badgePosition","disabled","selected","isHeader","ariaLabel","propsTileButton","PropTypes","func","description","defaultValue","oneOf","string","bool"],"mappings":"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"}

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

@@ -38,7 +38,11 @@ var StyledWrapperCentralContent = /*#__PURE__*/styled(Grid).withConfig({
 })(["width:24px;height:40px;"]);
 var StyledTileButtonIcon = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-1ebp1zs-3"
-})(["position:relative;height:24px;width:24px;}"]);
+})(["position:relative;height:24px;width:24px;svg{fill:", ";}&:focus{svg{fill:", ";}}"], function (props) {
+  return props.theme.colors.neutral[500];
+}, function (props) {
+  return props.theme.colors.brand[800];
+});
 var 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;"], function (props) {
@@ -56,7 +60,7 @@ var CloseButton = /*#__PURE__*/styled.button.withConfig({
 
 var StyledTileButton = /*#__PURE__*/styled.button.withConfig({
   componentId: "sc-1ebp1zs-6"
-})(["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:", ";}}&: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, function (props) {
+})(["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, function (props) {
   return props.isHeader ? "1px solid  ".concat(props.theme.colors.neutral['200']) : 'none';
 }, function (props) {
   return props.theme.colors.neutral['080'];
@@ -77,6 +81,8 @@ var StyledTileButton = /*#__PURE__*/styled.button.withConfig({
   return props.theme.colors.brand[800];
 }, StyledTileButtonLabel, function (props) {
   return props.theme.colors.neutral[600];
+}, function (props) {
+  return props.theme.colors.brand[800];
 }, function (props) {
   return props.theme.colors.neutral['050'];
 }, StyledWrapperLeftBorder, function (props) {
@@ -110,9 +116,7 @@ var StyledTileButton = /*#__PURE__*/styled.button.withConfig({
 });
 var StyledWrapper = /*#__PURE__*/styled(Grid).withConfig({
   componentId: "sc-1ebp1zs-7"
-})(["height:100%;width:100%;position:relative;&:hover{svg{fill:", ";}}"], function (props) {
-  return props.theme.colors.brand[800];
-});
+})(["height:100%;width:100%;position:relative;"]);
 
 export { CloseButton, StyledStatusBadge, StyledTileButton, StyledTileButtonIcon, StyledTileButtonLabel, StyledWrapper, StyledWrapperCentralContent, StyledWrapperLeftBorder };
 //# sourceMappingURL=styled.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../src/parts/tile-button/styled.ts"],"sourcesContent":["/* eslint-disable indent */\n/* eslint-disable max-lines */\nimport styled, { css } from 'styled-components';\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  }\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 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\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  &:hover {\n    svg {\n      fill: ${(props) => props.theme.colors.brand[800]};\n    }\n  }\n`;\n"],"names":["MIN_WIDTH_SIDEBAR","BUTTON_SIDEBAR_HEIGHT","StyledWrapperLeftBorder","styled","Grid","StyledStatusBadge","div","props","badgeColor","theme","colors","brand","success","badgePosition","StyledWrapperCentralContent","StyledTileButtonIcon","StyledTileButtonLabel","space","xs","neutral","CloseButton","button","StyledTileButton","isHeader","selected","css","nestedProps","StyledWrapper"],"mappings":"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"}
+{"version":3,"file":"styled.js","sources":["../../../../src/parts/tile-button/styled.ts"],"sourcesContent":["/* eslint-disable indent */\n/* eslint-disable max-lines */\nimport styled, { css } from 'styled-components';\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 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"],"names":["MIN_WIDTH_SIDEBAR","BUTTON_SIDEBAR_HEIGHT","StyledWrapperLeftBorder","styled","Grid","StyledStatusBadge","div","props","badgeColor","theme","colors","brand","success","badgePosition","StyledWrapperCentralContent","StyledTileButtonIcon","neutral","StyledTileButtonLabel","space","xs","CloseButton","button","StyledTileButton","isHeader","selected","css","nestedProps","StyledWrapper"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-chat",
-  "version": "1.53.4-rc.3",
+  "version": "1.53.5-rc.0",
   "license": "MIT",
   "description": "Ellie Mae - Dim Sum - Chat",
   "main": "cjs/index.js",
@@ -16,10 +16,10 @@
     "directory": "dist"
   },
   "dependencies": {
-    "@elliemae/ds-banner": "1.53.4-rc.3",
-    "@elliemae/ds-basic": "1.53.4-rc.3",
-    "@elliemae/ds-icons": "1.53.4-rc.3",
-    "@elliemae/ds-system": "1.53.4-rc.3",
+    "@elliemae/ds-banner": "1.53.5-rc.0",
+    "@elliemae/ds-basic": "1.53.5-rc.0",
+    "@elliemae/ds-icons": "1.53.5-rc.0",
+    "@elliemae/ds-system": "1.53.5-rc.0",
     "prop-types": "~15.7.2",
     "react-virtual": "^2.3.2"
   },

package/parts/bubble/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/bubble/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/bubble/config/useValidateProps.js",
+  "module": "../../../../esm/parts/bubble/config/useValidateProps.js"
+}

package/parts/chat-card/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-card/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-card/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-card/config/useValidateProps.js"
+}

package/parts/chat-composer/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-composer/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-composer/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-composer/config/useValidateProps.js"
+}

package/parts/chat-container/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-container/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-container/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-container/config/useValidateProps.js"
+}

package/parts/chat-container-messages-list/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-container-messages-list/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-container-messages-list/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-container-messages-list/config/useValidateProps.js"
+}

package/parts/chat-empty-state/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-empty-state/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-empty-state/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-empty-state/config/useValidateProps.js"
+}

package/parts/chat-sidebar/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/chat-sidebar/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/chat-sidebar/config/useValidateProps.js",
+  "module": "../../../../esm/parts/chat-sidebar/config/useValidateProps.js"
+}

package/parts/message-delimiter/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/message-delimiter/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/message-delimiter/config/useValidateProps.js",
+  "module": "../../../../esm/parts/message-delimiter/config/useValidateProps.js"
+}

package/parts/system-message/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/system-message/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/system-message/config/useValidateProps.js",
+  "module": "../../../../esm/parts/system-message/config/useValidateProps.js"
+}

package/parts/tile-button/config/useValidateProps/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "@elliemae/ds-chat/parts/tile-button/config/useValidateProps",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ],
+  "private": true,
+  "main": "../../../../cjs/parts/tile-button/config/useValidateProps.js",
+  "module": "../../../../esm/parts/tile-button/config/useValidateProps.js"
+}