@elliemae/ds-chat-tile 3.35.0 → 3.36.0-next.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/TileButton.js
CHANGED
|
@@ -131,7 +131,6 @@ const TileButton = (props) => {
|
|
|
131
131
|
);
|
|
132
132
|
return title && !disableTooltip ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledTooltipV3ButtonWrapper, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_tooltip.DSTooltipV3, { id: `ds-chat-tile-tooltip-button-${dsId}`, text: title, startPlacementPreference: tooltipPlacement, children: Btn }) }) : Btn;
|
|
133
133
|
};
|
|
134
|
-
TileButton.propTypes = import_react_desc_prop_types.propsTileButton;
|
|
135
134
|
TileButton.displayName = import_DSChatTileButtonDefinitions.DSChatTileButtonName;
|
|
136
135
|
const TileButtonWithSchema = (0, import_ds_props_helpers.describe)(TileButton);
|
|
137
136
|
TileButtonWithSchema.propTypes = import_react_desc_prop_types.propsTileButton;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/TileButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\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.js';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\nimport { propsTileButton, defaultTileButton } from './react-desc-prop-types.js';\nimport { DSChatTileButtonName } from './DSChatTileButtonDefinitions.js';\n\nconst TileButton: React.ComponentType<DSChatTileT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChatTileT.InternalProps>(props, defaultTileButton);\n useValidateTypescriptPropTypes(propsWithDefault, propsTileButton, DSChatTileButtonName);\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 } = propsWithDefault;\n\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, dsId, 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 innerRef={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}`} aria-label=\"close\">\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.
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwDb;AAtDV,mBAAkB;AAClB,8BAAuF;AACvF,wBAA4B;AAC5B,qBAAqB;AACrB,sBAA4B;AAC5B,oBAUO;AAEP,mCAAmD;AACnD,yCAAqC;AAErC,MAAM,aAAqD,CAAC,UAAU;AACpE,QAAM,uBAAmB,sDAAwD,OAAO,8CAAiB;AACzG,8DAA+B,kBAAkB,8CAAiB,uDAAoB;AAEtF,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,EACF,IAAI;AAEJ,QAAM,cAAc,aAAAA,QAAM,YAAY,MAAM;AAC1C,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,MAAM,SAAS,KAAK,CAAC;AAEzB,QAAM,cAAc,aAAAA,QAAM;AAAA,IACxB,MACE,6CAAC,6CAA4B,YAAY,WAAW,WAAW,QAC7D;AAAA,kDAAC,uBAAK,OAAM,QAAO,YAAW,UAAS,gBAAe,UACpD,uDAAC,sCAAqB,YAAW,UAAS,gBAAe,UACvD;AAAA,oDAAC,QAAK,MAAK,KAAI;AAAA,QACd,QACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,eAAa,cAAc;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\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.js';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\nimport { propsTileButton, defaultTileButton } from './react-desc-prop-types.js';\nimport { DSChatTileButtonName } from './DSChatTileButtonDefinitions.js';\n\nconst TileButton: React.ComponentType<DSChatTileT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChatTileT.InternalProps>(props, defaultTileButton);\n useValidateTypescriptPropTypes(propsWithDefault, propsTileButton, DSChatTileButtonName);\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 } = propsWithDefault;\n\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, dsId, 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 innerRef={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}`} aria-label=\"close\">\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.displayName = DSChatTileButtonName;\nconst TileButtonWithSchema = describe(TileButton);\nTileButtonWithSchema.propTypes = propsTileButton as WeakValidationMap<unknown>;\n\nexport { TileButton, TileButtonWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwDb;AAtDV,mBAAkB;AAClB,8BAAuF;AACvF,wBAA4B;AAC5B,qBAAqB;AACrB,sBAA4B;AAC5B,oBAUO;AAEP,mCAAmD;AACnD,yCAAqC;AAErC,MAAM,aAAqD,CAAC,UAAU;AACpE,QAAM,uBAAmB,sDAAwD,OAAO,8CAAiB;AACzG,8DAA+B,kBAAkB,8CAAiB,uDAAoB;AAEtF,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,EACF,IAAI;AAEJ,QAAM,cAAc,aAAAA,QAAM,YAAY,MAAM;AAC1C,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,MAAM,SAAS,KAAK,CAAC;AAEzB,QAAM,cAAc,aAAAA,QAAM;AAAA,IACxB,MACE,6CAAC,6CAA4B,YAAY,WAAW,WAAW,QAC7D;AAAA,kDAAC,uBAAK,OAAM,QAAO,YAAW,UAAS,gBAAe,UACpD,uDAAC,sCAAqB,YAAW,UAAS,gBAAe,UACvD;AAAA,oDAAC,QAAK,MAAK,KAAI;AAAA,QACd,QACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,eAAa,cAAc,IAAI;AAAA;AAAA,QACjC,IACE;AAAA,SACN,GACF;AAAA,MACC,CAAC,WACA,4CAAC,uBAAK,OAAM,QAAO,gBAAe,UAC/B,kBAAQ,4CAAC,uCAAuB,iBAAM,IAA2B,MACpE,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,MAAM,OAAO,MAAM,YAAY,eAAe,KAAK;AAAA,EAChE;AAEA,QAAM,MAAM,aAAAA,QAAM;AAAA,IAChB,MACE;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,OAAO;AAAA,QACP,eAAa,eAAe,IAAI;AAAA,QAChC,YAAU;AAAA,QACV,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,cAAY;AAAA,QACZ;AAAA,QAEA,uDAAC,+BAAc,YAAW,UAAS,gBAAe,UAChD;AAAA,sDAAC,UAAM,uBAAY;AAAA,UACnB,4CAAC,yCAAwB;AAAA,UACxB,aAAa,CAAC,WACb,4CAAC,6BAAY,SAAS,SAAS,OAAO,MAAM,eAAa,kBAAkB,IAAI,IAAI,cAAW,SAC5F,sDAAC,+BAAY,GACf,IACE;AAAA,WACN;AAAA;AAAA,MAxBK;AAAA,IAyBP;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,SAAS,CAAC,iBACf,4CAAC,8CACC,sDAAC,iCAAY,IAAI,+BAA+B,IAAI,IAAI,MAAM,OAAO,0BAA0B,kBAC5F,eACH,GACF,IAEA;AAEJ;AAEA,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU;AAChD,qBAAqB,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable indent */\n/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\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<DSChatTileT.Props>`\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: 2px solid ${(props) => props.theme.colors.neutral['050']};\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 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[600]};\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`\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 svg {\n fill: #000000;\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<DSChatTileT.Props>>`\n outline: none;\n background: ${(props) => props.theme.colors.neutral['050']};\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 }\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 `\n & ${StyledWrapperLeftBorder} {\n background: ${props.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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,uBAAuB;AACvB,qBAAqB;AAErB,MAAM,oBAAoB;AAC1B,MAAM,wBAAwB;AAGvB,MAAM,8BAA0B,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ3C,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKxB,CAAC,UAAU;AACvB,UAAQ,MAAM,YAAY;AAAA,IACxB,KAAK;AACH,aAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,IACrC,KAAK;AACH,aAAO,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,IACvC;AACE,aAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,EACvC;AACF;AAAA,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/TileButton.js
CHANGED
|
@@ -107,7 +107,6 @@ const TileButton = (props) => {
|
|
|
107
107
|
);
|
|
108
108
|
return title && !disableTooltip ? /* @__PURE__ */ jsx(StyledTooltipV3ButtonWrapper, { children: /* @__PURE__ */ jsx(DSTooltipV3, { id: `ds-chat-tile-tooltip-button-${dsId}`, text: title, startPlacementPreference: tooltipPlacement, children: Btn }) }) : Btn;
|
|
109
109
|
};
|
|
110
|
-
TileButton.propTypes = propsTileButton;
|
|
111
110
|
TileButton.displayName = DSChatTileButtonName;
|
|
112
111
|
const TileButtonWithSchema = describe(TileButton);
|
|
113
112
|
TileButtonWithSchema.propTypes = propsTileButton;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/TileButton.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\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.js';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\nimport { propsTileButton, defaultTileButton } from './react-desc-prop-types.js';\nimport { DSChatTileButtonName } from './DSChatTileButtonDefinitions.js';\n\nconst TileButton: React.ComponentType<DSChatTileT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChatTileT.InternalProps>(props, defaultTileButton);\n useValidateTypescriptPropTypes(propsWithDefault, propsTileButton, DSChatTileButtonName);\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 } = propsWithDefault;\n\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, dsId, 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 innerRef={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}`} aria-label=\"close\">\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.
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACwDb,SACE,KADF;AAtDV,OAAOA,YAAW;AAClB,SAAS,UAAU,gCAAgC,oCAAoC;AACvF,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,iBAAiB,yBAAyB;AACnD,SAAS,4BAA4B;AAErC,MAAM,aAAqD,CAAC,UAAU;AACpE,QAAM,mBAAmB,6BAAwD,OAAO,iBAAiB;AACzG,iCAA+B,kBAAkB,iBAAiB,oBAAoB;AAEtF,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,EACF,IAAI;AAEJ,QAAM,cAAcA,OAAM,YAAY,MAAM;AAC1C,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,MAAM,SAAS,KAAK,CAAC;AAEzB,QAAM,cAAcA,OAAM;AAAA,IACxB,MACE,qBAAC,+BAA4B,YAAY,WAAW,WAAW,QAC7D;AAAA,0BAAC,QAAK,OAAM,QAAO,YAAW,UAAS,gBAAe,UACpD,+BAAC,wBAAqB,YAAW,UAAS,gBAAe,UACvD;AAAA,4BAAC,QAAK,MAAK,KAAI;AAAA,QACd,QACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,eAAa,cAAc;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\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.js';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\nimport { propsTileButton, defaultTileButton } from './react-desc-prop-types.js';\nimport { DSChatTileButtonName } from './DSChatTileButtonDefinitions.js';\n\nconst TileButton: React.ComponentType<DSChatTileT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<DSChatTileT.InternalProps>(props, defaultTileButton);\n useValidateTypescriptPropTypes(propsWithDefault, propsTileButton, DSChatTileButtonName);\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 } = propsWithDefault;\n\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, dsId, 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 innerRef={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}`} aria-label=\"close\">\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.displayName = DSChatTileButtonName;\nconst TileButtonWithSchema = describe(TileButton);\nTileButtonWithSchema.propTypes = propsTileButton as WeakValidationMap<unknown>;\n\nexport { TileButton, TileButtonWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACwDb,SACE,KADF;AAtDV,OAAOA,YAAW;AAClB,SAAS,UAAU,gCAAgC,oCAAoC;AACvF,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAC5B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,iBAAiB,yBAAyB;AACnD,SAAS,4BAA4B;AAErC,MAAM,aAAqD,CAAC,UAAU;AACpE,QAAM,mBAAmB,6BAAwD,OAAO,iBAAiB;AACzG,iCAA+B,kBAAkB,iBAAiB,oBAAoB;AAEtF,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,EACF,IAAI;AAEJ,QAAM,cAAcA,OAAM,YAAY,MAAM;AAC1C,YAAQ,MAAM,KAAK;AAAA,EACrB,GAAG,CAAC,MAAM,SAAS,KAAK,CAAC;AAEzB,QAAM,cAAcA,OAAM;AAAA,IACxB,MACE,qBAAC,+BAA4B,YAAY,WAAW,WAAW,QAC7D;AAAA,0BAAC,QAAK,OAAM,QAAO,YAAW,UAAS,gBAAe,UACpD,+BAAC,wBAAqB,YAAW,UAAS,gBAAe,UACvD;AAAA,4BAAC,QAAK,MAAK,KAAI;AAAA,QACd,QACC;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA,eAAa,cAAc,IAAI;AAAA;AAAA,QACjC,IACE;AAAA,SACN,GACF;AAAA,MACC,CAAC,WACA,oBAAC,QAAK,OAAM,QAAO,gBAAe,UAC/B,kBAAQ,oBAAC,yBAAuB,iBAAM,IAA2B,MACpE,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,MAAM,OAAO,MAAM,YAAY,eAAe,KAAK;AAAA,EAChE;AAEA,QAAM,MAAMA,OAAM;AAAA,IAChB,MACE;AAAA,MAAC;AAAA;AAAA,QAEC;AAAA,QACA,OAAO;AAAA,QACP,eAAa,eAAe,IAAI;AAAA,QAChC,YAAU;AAAA,QACV,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAc;AAAA,QACd,cAAY;AAAA,QACZ;AAAA,QAEA,+BAAC,iBAAc,YAAW,UAAS,gBAAe,UAChD;AAAA,8BAAC,UAAM,uBAAY;AAAA,UACnB,oBAAC,2BAAwB;AAAA,UACxB,aAAa,CAAC,WACb,oBAAC,eAAY,SAAS,SAAS,OAAO,MAAM,eAAa,kBAAkB,IAAI,IAAI,cAAW,SAC5F,8BAAC,eAAY,GACf,IACE;AAAA,WACN;AAAA;AAAA,MAxBK;AAAA,IAyBP;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAO,SAAS,CAAC,iBACf,oBAAC,gCACC,8BAAC,eAAY,IAAI,+BAA+B,IAAI,IAAI,MAAM,OAAO,0BAA0B,kBAC5F,eACH,GACF,IAEA;AAEJ;AAEA,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU;AAChD,qBAAqB,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styled.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\n/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport type { DSChatTileT } from './react-desc-prop-types.js';\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<DSChatTileT.Props>`\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: 2px solid ${(props) => props.theme.colors.neutral['050']};\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 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[600]};\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`\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 svg {\n fill: #000000;\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<DSChatTileT.Props>>`\n outline: none;\n background: ${(props) => props.theme.colors.neutral['050']};\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 }\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 `\n & ${StyledWrapperLeftBorder} {\n background: ${props.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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,MAAM,oBAAoB;AAC1B,MAAM,wBAAwB;AAGvB,MAAM,0BAA0B,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ3C,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKxB,CAAC,UAAU;AACvB,UAAQ,MAAM,YAAY;AAAA,IACxB,KAAK;AACH,aAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,IACrC,KAAK;AACH,aAAO,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,IACvC;AACE,aAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,EACvC;AACF;AAAA,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-chat-tile",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.36.0-next.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Chat Tile",
|
|
6
6
|
"files": [
|
|
@@ -48,16 +48,16 @@
|
|
|
48
48
|
"typeSafety": true
|
|
49
49
|
},
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@elliemae/ds-grid": "3.
|
|
52
|
-
"@elliemae/ds-
|
|
53
|
-
"@elliemae/ds-
|
|
54
|
-
"@elliemae/ds-
|
|
55
|
-
"@elliemae/ds-tooltip": "3.
|
|
51
|
+
"@elliemae/ds-grid": "3.36.0-next.1",
|
|
52
|
+
"@elliemae/ds-props-helpers": "3.36.0-next.1",
|
|
53
|
+
"@elliemae/ds-icons": "3.36.0-next.1",
|
|
54
|
+
"@elliemae/ds-system": "3.36.0-next.1",
|
|
55
|
+
"@elliemae/ds-tooltip": "3.36.0-next.1"
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
58
58
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
59
59
|
"styled-components": "~5.3.9",
|
|
60
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
60
|
+
"@elliemae/ds-monorepo-devops": "3.36.0-next.1"
|
|
61
61
|
},
|
|
62
62
|
"peerDependencies": {
|
|
63
63
|
"lodash": "^4.17.21",
|