@elliemae/ds-chat-bubble 3.16.0 → 3.16.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/ChatBubble.js +9 -5
- package/dist/cjs/ChatBubble.js.map +2 -2
- package/dist/cjs/ChatBubbleArrow.js +6 -2
- package/dist/cjs/ChatBubbleArrow.js.map +2 -2
- package/dist/cjs/ChatBubbleDataTestIds.js +4 -0
- package/dist/cjs/ChatBubbleDataTestIds.js.map +1 -1
- package/dist/cjs/DSChatBubbleDefinitions.js +4 -0
- package/dist/cjs/DSChatBubbleDefinitions.js.map +1 -1
- package/dist/cjs/index.js +8 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/package.json +4 -0
- package/dist/cjs/react-desc-prop-types.js +4 -0
- package/dist/cjs/react-desc-prop-types.js.map +1 -1
- package/dist/cjs/styled.js +5 -1
- package/dist/cjs/styled.js.map +2 -2
- package/dist/esm/ChatBubble.js +5 -5
- package/dist/esm/ChatBubble.js.map +1 -1
- package/dist/esm/ChatBubbleArrow.js +2 -2
- package/dist/esm/ChatBubbleArrow.js.map +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/package.json +4 -0
- package/dist/esm/styled.js +1 -1
- package/dist/esm/styled.js.map +2 -2
- package/dist/types/ChatBubble.d.ts +2 -2
- package/dist/types/ChatBubbleArrow.d.ts +1 -1
- package/dist/types/index.d.ts +4 -4
- package/dist/types/styled.d.ts +3 -3
- package/package.json +7 -7
package/dist/cjs/ChatBubble.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -33,11 +37,11 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
33
37
|
var import_react = __toESM(require("react"));
|
|
34
38
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
35
39
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
36
|
-
var import_styled = require("./styled");
|
|
37
|
-
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
38
|
-
var import_ChatBubbleArrow = require("./ChatBubbleArrow");
|
|
39
|
-
var import_ChatBubbleDataTestIds = require("./ChatBubbleDataTestIds");
|
|
40
|
-
var import_DSChatBubbleDefinitions = require("./DSChatBubbleDefinitions");
|
|
40
|
+
var import_styled = require("./styled.js");
|
|
41
|
+
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
42
|
+
var import_ChatBubbleArrow = require("./ChatBubbleArrow.js");
|
|
43
|
+
var import_ChatBubbleDataTestIds = require("./ChatBubbleDataTestIds.js");
|
|
44
|
+
var import_DSChatBubbleDefinitions = require("./DSChatBubbleDefinitions.js");
|
|
41
45
|
const ChatBubble = (props) => {
|
|
42
46
|
const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultBubbleProps);
|
|
43
47
|
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.BubblesPropTypes, import_DSChatBubbleDefinitions.DSChatBubbleName);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ChatBubble.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { WarningCircleFill } from '@elliemae/ds-icons';\nimport {\n StyledWrapper,\n StyledColoredBubble,\n StyledTitleBubble,\n StyledTitleLeftBubble,\n StyledTitleRightBubble,\n StyleBodyWrapper,\n StyleErrorMessage,\n StyleHelpMessage,\n} from './styled';\nimport { BubblesPropTypes, type DSChatBubbleT, defaultBubbleProps } from './react-desc-prop-types';\nimport { ChatBubbleArrow } from './ChatBubbleArrow';\nimport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds';\nimport { DSChatBubbleName } from './DSChatBubbleDefinitions';\n\nconst ChatBubble: React.ComponentType<DSChatBubbleT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultBubbleProps);\n useValidateTypescriptPropTypes(propsWithDefault, BubblesPropTypes, DSChatBubbleName);\n\n const { dsId, type, title, time, body, errorMessage, helpMessage } = propsWithDefault;\n const bodyParts = React.useMemo(() => (typeof body === 'string' ? body.split('\\n') : [body]), [body]);\n return (\n <StyledWrapper data-testid={`${ChatBubbleDataTestIds.BUBBLE}-${dsId}`}>\n <StyledColoredBubble type={type}>\n <StyledTitleBubble cols={['1fr', 'auto']} gutter=\"xs\" alignItems=\"flex-end\" className=\"sr-only\">\n <StyledTitleLeftBubble alignItems=\"center\" data-testid={`${ChatBubbleDataTestIds.BUBBLE_TITLE}-${dsId}`}>\n {title}\n </StyledTitleLeftBubble>\n <StyledTitleRightBubble\n alignItems=\"center\"\n type={type}\n data-testid={`${ChatBubbleDataTestIds.BUBBLE_TIME}-${dsId}`}\n >\n {time}\n </StyledTitleRightBubble>\n </StyledTitleBubble>\n <StyleBodyWrapper data-testid={`chat-bubble-body-${dsId}`}>\n {bodyParts.map((item, index) => (\n <React.Fragment key={`${item}-${dsId}`}>\n {item}\n {index < bodyParts.length - 1 ? <br /> : null}\n </React.Fragment>\n ))}\n </StyleBodyWrapper>\n <ChatBubbleArrow type={type} />\n </StyledColoredBubble>\n {errorMessage ? (\n <StyleErrorMessage data-testid={`chat-bubble-error-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{errorMessage}</span>\n <WarningCircleFill />\n </StyleErrorMessage>\n ) : null}\n {helpMessage ? (\n <StyleHelpMessage data-testid={`chat-bubble-help-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{helpMessage}</span>\n </StyleHelpMessage>\n ) : null}\n </StyledWrapper>\n );\n};\n\nChatBubble.propTypes = BubblesPropTypes;\nChatBubble.displayName = DSChatBubbleName;\nconst ChatBubbleWithSchema = describe(ChatBubble);\nChatBubbleWithSchema.propTypes = BubblesPropTypes;\n\nexport { ChatBubble, ChatBubbleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { WarningCircleFill } from '@elliemae/ds-icons';\nimport {\n StyledWrapper,\n StyledColoredBubble,\n StyledTitleBubble,\n StyledTitleLeftBubble,\n StyledTitleRightBubble,\n StyleBodyWrapper,\n StyleErrorMessage,\n StyleHelpMessage,\n} from './styled.js';\nimport { BubblesPropTypes, type DSChatBubbleT, defaultBubbleProps } from './react-desc-prop-types.js';\nimport { ChatBubbleArrow } from './ChatBubbleArrow.js';\nimport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds.js';\nimport { DSChatBubbleName } from './DSChatBubbleDefinitions.js';\n\nconst ChatBubble: React.ComponentType<DSChatBubbleT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultBubbleProps);\n useValidateTypescriptPropTypes(propsWithDefault, BubblesPropTypes, DSChatBubbleName);\n\n const { dsId, type, title, time, body, errorMessage, helpMessage } = propsWithDefault;\n const bodyParts = React.useMemo(() => (typeof body === 'string' ? body.split('\\n') : [body]), [body]);\n return (\n <StyledWrapper data-testid={`${ChatBubbleDataTestIds.BUBBLE}-${dsId}`}>\n <StyledColoredBubble type={type}>\n <StyledTitleBubble cols={['1fr', 'auto']} gutter=\"xs\" alignItems=\"flex-end\" className=\"sr-only\">\n <StyledTitleLeftBubble alignItems=\"center\" data-testid={`${ChatBubbleDataTestIds.BUBBLE_TITLE}-${dsId}`}>\n {title}\n </StyledTitleLeftBubble>\n <StyledTitleRightBubble\n alignItems=\"center\"\n type={type}\n data-testid={`${ChatBubbleDataTestIds.BUBBLE_TIME}-${dsId}`}\n >\n {time}\n </StyledTitleRightBubble>\n </StyledTitleBubble>\n <StyleBodyWrapper data-testid={`chat-bubble-body-${dsId}`}>\n {bodyParts.map((item, index) => (\n <React.Fragment key={`${item}-${dsId}`}>\n {item}\n {index < bodyParts.length - 1 ? <br /> : null}\n </React.Fragment>\n ))}\n </StyleBodyWrapper>\n <ChatBubbleArrow type={type} />\n </StyledColoredBubble>\n {errorMessage ? (\n <StyleErrorMessage data-testid={`chat-bubble-error-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{errorMessage}</span>\n <WarningCircleFill />\n </StyleErrorMessage>\n ) : null}\n {helpMessage ? (\n <StyleHelpMessage data-testid={`chat-bubble-help-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{helpMessage}</span>\n </StyleHelpMessage>\n ) : null}\n </StyledWrapper>\n );\n};\n\nChatBubble.propTypes = BubblesPropTypes;\nChatBubble.displayName = DSChatBubbleName;\nconst ChatBubbleWithSchema = describe(ChatBubble);\nChatBubbleWithSchema.propTypes = BubblesPropTypes;\n\nexport { ChatBubble, ChatBubbleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2Bf;AA3BR,mBAAkB;AAClB,8BAAuF;AACvF,sBAAkC;AAClC,oBASO;AACP,mCAAyE;AACzE,6BAAgC;AAChC,mCAAsC;AACtC,qCAAiC;AAEjC,MAAM,aAAuD,CAAC,UAAU;AACtE,QAAM,uBAAmB,sDAA6B,OAAO,+CAAkB;AAC/E,8DAA+B,kBAAkB,+CAAkB,+CAAgB;AAEnF,QAAM,EAAE,MAAM,MAAM,OAAO,MAAM,MAAM,cAAc,YAAY,IAAI;AACrE,QAAM,YAAY,aAAAA,QAAM,QAAQ,MAAO,OAAO,SAAS,WAAW,KAAK,MAAM,IAAI,IAAI,CAAC,IAAI,GAAI,CAAC,IAAI,CAAC;AACpG,SACE,6CAAC,+BAAc,eAAa,GAAG,mDAAsB,UAAU,QAC7D;AAAA,iDAAC,qCAAoB,MACnB;AAAA,mDAAC,mCAAkB,MAAM,CAAC,OAAO,MAAM,GAAG,QAAO,MAAK,YAAW,YAAW,WAAU,WACpF;AAAA,oDAAC,uCAAsB,YAAW,UAAS,eAAa,GAAG,mDAAsB,gBAAgB,QAC9F,iBACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX;AAAA,YACA,eAAa,GAAG,mDAAsB,eAAe;AAAA,YAEpD;AAAA;AAAA,QACH;AAAA,SACF;AAAA,MACA,4CAAC,kCAAiB,eAAa,oBAAoB,QAChD,oBAAU,IAAI,CAAC,MAAM,UACpB,6CAAC,aAAAA,QAAM,UAAN,EACE;AAAA;AAAA,QACA,QAAQ,UAAU,SAAS,IAAI,4CAAC,QAAG,IAAK;AAAA,WAFtB,GAAG,QAAQ,MAGhC,CACD,GACH;AAAA,MACA,4CAAC,0CAAgB,MAAY;AAAA,OAC/B;AAAA,IACC,eACC,6CAAC,mCAAkB,eAAa,6BAA6B,QAAQ,GAAE,OAAM,QAAO,OAAM,MAAM,CAAC,GAAG,MAAM,GACxG;AAAA,kDAAC,UAAM,wBAAa;AAAA,MACpB,4CAAC,qCAAkB;AAAA,OACrB,IACE;AAAA,IACH,cACC,4CAAC,kCAAiB,eAAa,4BAA4B,QAAQ,GAAE,OAAM,QAAO,OAAM,MAAM,CAAC,GAAG,MAAM,GACtG,sDAAC,UAAM,uBAAY,GACrB,IACE;AAAA,KACN;AAEJ;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU;AAChD,qBAAqB,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -29,9 +33,9 @@ __export(ChatBubbleArrow_exports, {
|
|
|
29
33
|
module.exports = __toCommonJS(ChatBubbleArrow_exports);
|
|
30
34
|
var React = __toESM(require("react"));
|
|
31
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
-
var import_styled = require("./styled");
|
|
36
|
+
var import_styled = require("./styled.js");
|
|
33
37
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
34
|
-
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
38
|
+
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
35
39
|
const ChatBubbleArrow = ({ type }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledBubbleArrow, { children: type === import_react_desc_prop_types.BUBBLE_TYPES.RECIPIENT ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { width: "15px", height: "14px", viewBox: "0 0 15 14", children: [
|
|
36
40
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("defs", { children: [
|
|
37
41
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ChatBubbleArrow.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { StyledBubbleArrow } from './styled';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { BUBBLE_TYPES, type DSChatBubbleT, propsArrowBubble } from './react-desc-prop-types';\n\nexport const ChatBubbleArrow: React.ComponentType<Pick<DSChatBubbleT.Props, 'type'>> = ({ type }) => (\n <StyledBubbleArrow>\n {type === BUBBLE_TYPES.RECIPIENT ? (\n <svg width=\"15px\" height=\"14px\" viewBox=\"0 0 15 14\">\n <defs>\n <path\n d=\"M12,8.5 C12,7.9373169 11.6782751,7.4856453 11.2282104,7.196228 C11.2286673,7.1967363 3,2 3,2 L3,10 L10.5627441,10 L10.5658569,9.9933472 C11.3630371,9.9580688 12,9.3058472 12,8.5 Z\"\n id=\"path-chat-bubble\"\n ></path>\n <filter x=\"-55.6%\" y=\"-50.0%\" width=\"211.1%\" height=\"225.0%\" filterUnits=\"objectBoundingBox\" id=\"filter-2\">\n <feOffset dx=\"2.3\" dy=\"1.2\" in=\"SourceAlpha\" result=\"shadowOffsetOuter1\"></feOffset>\n <feGaussianBlur stdDeviation=\"1.5\" in=\"shadowOffsetOuter1\" result=\"shadowBlurOuter1\"></feGaussianBlur>\n <feColorMatrix\n values=\"0 0 0 0 0.207843137 \n 0 0 0 0 0.235294118 \n 0 0 0 0 0.274509804 \n 0 0 0 0.8 0\"\n type=\"matrix\"\n in=\"shadowBlurOuter1\"\n ></feColorMatrix>\n </filter>\n </defs>\n <g id=\"[DSK]-Visual-Design\" stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g id=\"Path-Copy\" transform=\"translate(7.500000, 6.000000) scale(-1, 1) translate(-7.500000, -6.000000) \">\n <use fill=\"black\" fillOpacity=\"1\" filter=\"url(#filter-2)\" xlinkHref=\"#path-chat-bubble\"></use>\n <use fill=\"#FFFFFF\" fillRule=\"evenodd\" xlinkHref=\"#path-chat-bubble\"></use>\n </g>\n </g>\n </svg>\n ) : (\n <svg width=\"9px\" height=\"8px\" viewBox=\"0 0 9 8\">\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M9,6.5 C9,5.9373169 8.6782751,5.4856453 8.2282104,5.196228 C8.2286673,5.1967363 0,0 0,0 L0,8 L7.5627441,8 L7.5658569,7.9933472 C8.3630371,7.9580688 9,7.3058472 9,6.5 Z\"\n id=\"Path\"\n fill=\"#1E79C2\"\n ></path>\n </g>\n </svg>\n )}\n </StyledBubbleArrow>\n);\n\nChatBubbleArrow.propTypes = propsArrowBubble;\nconst ChatBubbleArrowWithSchema = describe(ChatBubbleArrow);\nChatBubbleArrowWithSchema.propTypes = propsArrowBubble;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { StyledBubbleArrow } from './styled.js';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { BUBBLE_TYPES, type DSChatBubbleT, propsArrowBubble } from './react-desc-prop-types.js';\n\nexport const ChatBubbleArrow: React.ComponentType<Pick<DSChatBubbleT.Props, 'type'>> = ({ type }) => (\n <StyledBubbleArrow>\n {type === BUBBLE_TYPES.RECIPIENT ? (\n <svg width=\"15px\" height=\"14px\" viewBox=\"0 0 15 14\">\n <defs>\n <path\n d=\"M12,8.5 C12,7.9373169 11.6782751,7.4856453 11.2282104,7.196228 C11.2286673,7.1967363 3,2 3,2 L3,10 L10.5627441,10 L10.5658569,9.9933472 C11.3630371,9.9580688 12,9.3058472 12,8.5 Z\"\n id=\"path-chat-bubble\"\n ></path>\n <filter x=\"-55.6%\" y=\"-50.0%\" width=\"211.1%\" height=\"225.0%\" filterUnits=\"objectBoundingBox\" id=\"filter-2\">\n <feOffset dx=\"2.3\" dy=\"1.2\" in=\"SourceAlpha\" result=\"shadowOffsetOuter1\"></feOffset>\n <feGaussianBlur stdDeviation=\"1.5\" in=\"shadowOffsetOuter1\" result=\"shadowBlurOuter1\"></feGaussianBlur>\n <feColorMatrix\n values=\"0 0 0 0 0.207843137 \n 0 0 0 0 0.235294118 \n 0 0 0 0 0.274509804 \n 0 0 0 0.8 0\"\n type=\"matrix\"\n in=\"shadowBlurOuter1\"\n ></feColorMatrix>\n </filter>\n </defs>\n <g id=\"[DSK]-Visual-Design\" stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g id=\"Path-Copy\" transform=\"translate(7.500000, 6.000000) scale(-1, 1) translate(-7.500000, -6.000000) \">\n <use fill=\"black\" fillOpacity=\"1\" filter=\"url(#filter-2)\" xlinkHref=\"#path-chat-bubble\"></use>\n <use fill=\"#FFFFFF\" fillRule=\"evenodd\" xlinkHref=\"#path-chat-bubble\"></use>\n </g>\n </g>\n </svg>\n ) : (\n <svg width=\"9px\" height=\"8px\" viewBox=\"0 0 9 8\">\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M9,6.5 C9,5.9373169 8.6782751,5.4856453 8.2282104,5.196228 C8.2286673,5.1967363 0,0 0,0 L0,8 L7.5627441,8 L7.5658569,7.9933472 C8.3630371,7.9580688 9,7.3058472 9,6.5 Z\"\n id=\"Path\"\n fill=\"#1E79C2\"\n ></path>\n </g>\n </svg>\n )}\n </StyledBubbleArrow>\n);\n\nChatBubbleArrow.propTypes = propsArrowBubble;\nconst ChatBubbleArrowWithSchema = describe(ChatBubbleArrow);\nChatBubbleArrowWithSchema.propTypes = propsArrowBubble;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADUb;AATV,oBAAkC;AAClC,8BAAyB;AACzB,mCAAmE;AAE5D,MAAM,kBAA0E,CAAC,EAAE,KAAK,MAC7F,4CAAC,mCACE,mBAAS,0CAAa,YACrB,6CAAC,SAAI,OAAM,QAAO,QAAO,QAAO,SAAQ,aACtC;AAAA,+CAAC,UACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,IAAG;AAAA;AAAA,IACJ;AAAA,IACD,6CAAC,YAAO,GAAE,UAAS,GAAE,UAAS,OAAM,UAAS,QAAO,UAAS,aAAY,qBAAoB,IAAG,YAC9F;AAAA,kDAAC,cAAS,IAAG,OAAM,IAAG,OAAM,IAAG,eAAc,QAAO,sBAAqB;AAAA,MACzE,4CAAC,oBAAe,cAAa,OAAM,IAAG,sBAAqB,QAAO,oBAAmB;AAAA,MACrF;AAAA,QAAC;AAAA;AAAA,UACC,QAAO;AAAA,UAIP,MAAK;AAAA,UACL,IAAG;AAAA;AAAA,MACJ;AAAA,OACH;AAAA,KACF;AAAA,EACA,4CAAC,OAAE,IAAG,uBAAsB,QAAO,QAAO,aAAY,KAAI,MAAK,QAAO,UAAS,WAC7E,uDAAC,OAAE,IAAG,aAAY,WAAU,+EAC1B;AAAA,gDAAC,SAAI,MAAK,SAAQ,aAAY,KAAI,QAAO,kBAAiB,WAAU,qBAAoB;AAAA,IACxF,4CAAC,SAAI,MAAK,WAAU,UAAS,WAAU,WAAU,qBAAoB;AAAA,KACvE,GACF;AAAA,GACF,IAEA,4CAAC,SAAI,OAAM,OAAM,QAAO,OAAM,SAAQ,WACpC,sDAAC,OAAE,QAAO,QAAO,aAAY,KAAI,MAAK,QAAO,UAAS,WACpD;AAAA,EAAC;AAAA;AAAA,IACC,GAAE;AAAA,IACF,IAAG;AAAA,IACH,MAAK;AAAA;AACN,GACH,GACF,GAEJ;AAGF,gBAAgB,YAAY;AAC5B,MAAM,gCAA4B,kCAAS,eAAe;AAC1D,0BAA0B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ChatBubbleDataTestIds.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export const ChatBubbleDataTestIds = {\n BUBBLE: 'ds-chat-bubble',\n BUBBLE_TITLE: 'chat-bubble-title',\n BUBBLE_BODY: 'chat-bubble-body',\n BUBBLE_TIME: 'chat-bubble-time',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,wBAAwB;AAAA,EACnC,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,aAAa;AAAA,EACb,aAAa;AACf;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSChatBubbleDefinitions.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export const DSChatBubbleName = 'DSBubble';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,mBAAmB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -19,6 +19,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
19
19
|
};
|
|
20
20
|
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
21
21
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
22
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
23
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
24
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
25
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
22
26
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
23
27
|
mod
|
|
24
28
|
));
|
|
@@ -32,8 +36,8 @@ __export(src_exports, {
|
|
|
32
36
|
});
|
|
33
37
|
module.exports = __toCommonJS(src_exports);
|
|
34
38
|
var React = __toESM(require("react"));
|
|
35
|
-
var import_ChatBubble = require("./ChatBubble");
|
|
36
|
-
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
37
|
-
var import_ChatBubbleDataTestIds = require("./ChatBubbleDataTestIds");
|
|
38
|
-
__reExport(src_exports, require("./styled"), module.exports);
|
|
39
|
+
var import_ChatBubble = require("./ChatBubble.js");
|
|
40
|
+
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
41
|
+
var import_ChatBubbleDataTestIds = require("./ChatBubbleDataTestIds.js");
|
|
42
|
+
__reExport(src_exports, require("./styled.js"), module.exports);
|
|
39
43
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble';\nexport { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types';\nexport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds';\nexport * from './styled';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble.js';\nexport { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types.js';\nexport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds.js';\nexport * from './styled.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAiD;AACjD,mCAAiD;AACjD,mCAAsC;AACtC,wBAAc,wBAHd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-props-helpers';\nimport type { WeakValidationMap } from 'react';\nimport type React from 'react';\n\n// eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\nexport const BUBBLE_TYPES = {\n SENDER: 'SENDER',\n RECIPIENT: 'RECIPIENT',\n DELIMITER: 'DELIMITER',\n SYSTEM: 'SYSTEM',\n};\n\nexport declare namespace DSChatBubbleT {\n export interface Props {\n dsId: string | number;\n type: BubbleTypesValues;\n title?: string;\n body: string;\n time: string;\n errorMessage: string | React.ReactChild;\n helpMessage: string | React.ReactChild;\n onClick: (id: string | number) => void;\n }\n\n export type BubbleTypesKeys = keyof typeof BUBBLE_TYPES;\n export type BubbleTypesValues = (typeof BUBBLE_TYPES)[BubbleTypesKeys];\n}\n\nexport const defaultBubbleProps: DSChatBubbleT.Props = {\n dsId: '',\n type: BUBBLE_TYPES.SENDER,\n time: '',\n body: '',\n onClick: noop,\n errorMessage: '',\n helpMessage: '',\n};\n\nexport const BubblesPropTypes = {\n dsId: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n .description('Unique id for bubble')\n .defaultValue(defaultBubbleProps.dsId),\n type: PropTypes.oneOf([BUBBLE_TYPES.RECIPIENT, BUBBLE_TYPES.SENDER])\n .isRequired.description('Define bubble type ')\n .defaultValue(defaultBubbleProps.type),\n title: PropTypes.string.description('Title of the bubble').defaultValue(defaultBubbleProps.title),\n time: PropTypes.string.isRequired.description('Time of the bubble').defaultValue(defaultBubbleProps.title),\n body: PropTypes.oneOfType([PropTypes.string, PropTypes.element])\n .isRequired.description('Bubble content')\n .defaultValue(defaultBubbleProps.body),\n onClick: PropTypes.func.description('Callback when the bubble is tapped').defaultValue(defaultBubbleProps.onClick),\n errorMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.element])\n .description('Error message to display at bottom of the bubble')\n .defaultValue(defaultBubbleProps.onClick),\n helpMessage: PropTypes.oneOfType([PropTypes.string, PropTypes.element])\n .description('Help message to display at bottom of the bubble')\n .defaultValue(defaultBubbleProps.onClick),\n} as WeakValidationMap<unknown>;\n\nexport const propsArrowBubble = {\n type: PropTypes.oneOf([BUBBLE_TYPES.RECIPIENT, BUBBLE_TYPES.SENDER]).isRequired.defaultValue(defaultBubbleProps.type),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA0B;AAK1B,SAAS,QAA6B,OAAgB;AAAC;AAChD,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AACV;AAkBO,MAAM,qBAA0C;AAAA,EACrD,MAAM;AAAA,EACN,MAAM,aAAa;AAAA,EACnB,MAAM;AAAA,EACN,MAAM;AAAA,EACN,SAAS;AAAA,EACT,cAAc;AAAA,EACd,aAAa;AACf;AAEO,MAAM,mBAAmB;AAAA,EAC9B,MAAM,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAC3D,YAAY,sBAAsB,EAClC,aAAa,mBAAmB,IAAI;AAAA,EACvC,MAAM,kCAAU,MAAM,CAAC,aAAa,WAAW,aAAa,MAAM,CAAC,EAChE,WAAW,YAAY,qBAAqB,EAC5C,aAAa,mBAAmB,IAAI;AAAA,EACvC,OAAO,kCAAU,OAAO,YAAY,qBAAqB,EAAE,aAAa,mBAAmB,KAAK;AAAA,EAChG,MAAM,kCAAU,OAAO,WAAW,YAAY,oBAAoB,EAAE,aAAa,mBAAmB,KAAK;AAAA,EACzG,MAAM,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,OAAO,CAAC,EAC5D,WAAW,YAAY,gBAAgB,EACvC,aAAa,mBAAmB,IAAI;AAAA,EACvC,SAAS,kCAAU,KAAK,YAAY,oCAAoC,EAAE,aAAa,mBAAmB,OAAO;AAAA,EACjH,cAAc,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,OAAO,CAAC,EACpE,YAAY,kDAAkD,EAC9D,aAAa,mBAAmB,OAAO;AAAA,EAC1C,aAAa,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,OAAO,CAAC,EACnE,YAAY,iDAAiD,EAC7D,aAAa,mBAAmB,OAAO;AAC5C;AAEO,MAAM,mBAAmB;AAAA,EAC9B,MAAM,kCAAU,MAAM,CAAC,aAAa,WAAW,aAAa,MAAM,CAAC,EAAE,WAAW,aAAa,mBAAmB,IAAI;AACtH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styled.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -38,7 +42,7 @@ module.exports = __toCommonJS(styled_exports);
|
|
|
38
42
|
var React = __toESM(require("react"));
|
|
39
43
|
var import_ds_system = require("@elliemae/ds-system");
|
|
40
44
|
var import_ds_grid = require("@elliemae/ds-grid");
|
|
41
|
-
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
45
|
+
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
42
46
|
const StyledWrapper = import_ds_system.styled.div`
|
|
43
47
|
min-width: 224px;
|
|
44
48
|
border-radius: 10px;
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUBBLE_TYPES } from './react-desc-prop-types';\n\n// Bubble WRAPPER\nexport const StyledWrapper = styled.div`\n min-width: 224px;\n border-radius: 10px;\n overflow-wrap: break-word;\n white-space: pre-wrap;\n`;\n\n// Bubble HEADER\nexport const StyledTitleBubble = styled(Grid)`\n padding-top: 6px;\n padding-left: 10px;\n padding-right: 10px;\n padding-bottom: 4px;\n`;\n\nexport const StyledTitleLeftBubble = styled(Grid)`\n font-size: 13px;\n font-weight: 600;\n`;\nexport const StyledTitleRightBubble = styled(Grid)<{ type: string }>`\n font-size: 13px;\n font-weight: 400;\n color: ${(props) => (props.type === BUBBLE_TYPES.SENDER ? '#FFF' : '#657489')};\n`;\n\nexport const StyleBodyWrapper = styled.div`\n font-size: 13px;\n font-weight: 400;\n line-height: 15px;\n min-height: 18px;\n padding: 0px 10px 8px 10px;\n`;\n\nexport const StyleErrorMessage = styled.div`\n font-size: 12px;\n font-weight: 400;\n padding-top: ${(props) => props.theme.space.xxxs};\n color: ${(props) => props.theme.colors.danger[900]};\n align-items: flex-end;\n justify-content: center;\n text-align: right;\n line-height: 15px;\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n .em-ds-icon {\n margin-left: 8px;\n }\n`;\n\nexport const StyleHelpMessage = styled(StyleErrorMessage)`\n font-size: 12px;\n line-height: 15px;\n color: ${(props) => props.theme.colors.neutral[500]};\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n`;\n\n// bubble sender/ recipient\nexport const StyledBubbleArrow = styled.div`\n display: block;\n content: '';\n position: absolute;\n bottom: 10px;\n height: 15px;\n`;\n\nexport const StyledColoredBubble = styled.div<{ type: string }>`\n min-width: 224px;\n border-radius: 10px;\n position: relative;\n\n ${(props) =>\n props.type === BUBBLE_TYPES.SENDER\n ? `\n border: 1px solid ${props.theme.colors.brand['700']};\n background: ${props.theme.colors.brand[600]};\n color: ${props.theme.colors.neutral['000']};\n ${StyledBubbleArrow}{ \n right: -9px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.brand[600]};\n }\n }\n\n a {\n color: #FFF;\n }\n\n `\n : `\n box-shadow: 0 1px 3px 0 rgba(53,60,70,0.80);\n background: ${props.theme.colors.neutral['000']};\n color: ${props.theme.colors.neutral[700]};\n\n ${StyledBubbleArrow}{ \n left: -11px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.neutral['000']};\n }\n }\n\n `}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUBBLE_TYPES } from './react-desc-prop-types.js';\n\n// Bubble WRAPPER\nexport const StyledWrapper = styled.div`\n min-width: 224px;\n border-radius: 10px;\n overflow-wrap: break-word;\n white-space: pre-wrap;\n`;\n\n// Bubble HEADER\nexport const StyledTitleBubble = styled(Grid)`\n padding-top: 6px;\n padding-left: 10px;\n padding-right: 10px;\n padding-bottom: 4px;\n`;\n\nexport const StyledTitleLeftBubble = styled(Grid)`\n font-size: 13px;\n font-weight: 600;\n`;\nexport const StyledTitleRightBubble = styled(Grid)<{ type: string }>`\n font-size: 13px;\n font-weight: 400;\n color: ${(props) => (props.type === BUBBLE_TYPES.SENDER ? '#FFF' : '#657489')};\n`;\n\nexport const StyleBodyWrapper = styled.div`\n font-size: 13px;\n font-weight: 400;\n line-height: 15px;\n min-height: 18px;\n padding: 0px 10px 8px 10px;\n`;\n\nexport const StyleErrorMessage = styled.div`\n font-size: 12px;\n font-weight: 400;\n padding-top: ${(props) => props.theme.space.xxxs};\n color: ${(props) => props.theme.colors.danger[900]};\n align-items: flex-end;\n justify-content: center;\n text-align: right;\n line-height: 15px;\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n .em-ds-icon {\n margin-left: 8px;\n }\n`;\n\nexport const StyleHelpMessage = styled(StyleErrorMessage)`\n font-size: 12px;\n line-height: 15px;\n color: ${(props) => props.theme.colors.neutral[500]};\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n`;\n\n// bubble sender/ recipient\nexport const StyledBubbleArrow = styled.div`\n display: block;\n content: '';\n position: absolute;\n bottom: 10px;\n height: 15px;\n`;\n\nexport const StyledColoredBubble = styled.div<{ type: string }>`\n min-width: 224px;\n border-radius: 10px;\n position: relative;\n\n ${(props) =>\n props.type === BUBBLE_TYPES.SENDER\n ? `\n border: 1px solid ${props.theme.colors.brand['700']};\n background: ${props.theme.colors.brand[600]};\n color: ${props.theme.colors.neutral['000']};\n ${StyledBubbleArrow}{ \n right: -9px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.brand[600]};\n }\n }\n\n a {\n color: #FFF;\n }\n\n `\n : `\n box-shadow: 0 1px 3px 0 rgba(53,60,70,0.80);\n background: ${props.theme.colors.neutral['000']};\n color: ${props.theme.colors.neutral[700]};\n\n ${StyledBubbleArrow}{ \n left: -11px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.neutral['000']};\n }\n }\n\n `}\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;ADCvB,uBAAuB;AACvB,qBAAqB;AACrB,mCAA6B;AAGtB,MAAM,gBAAgB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ7B,MAAM,wBAAoB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrC,MAAM,4BAAwB,yBAAO,mBAAI;AAAA;AAAA;AAAA;AAIzC,MAAM,6BAAyB,yBAAO,mBAAI;AAAA;AAAA;AAAA,WAGtC,CAAC,UAAW,MAAM,SAAS,0CAAa,SAAS,SAAS;AAAA;AAG9D,MAAM,mBAAmB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQhC,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA,iBAGvB,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA,WACnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAMvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,uBAAmB,yBAAO,iBAAiB;AAAA;AAAA;AAAA,WAG7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,YAExC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAK9C,MAAM,oBAAoB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQjC,MAAM,sBAAsB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKtC,CAAC,UACD,MAAM,SAAS,0CAAa,SACxB;AAAA,4BACoB,MAAM,MAAM,OAAO,MAAM,KAAK;AAAA,sBACpC,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,iBACjC,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,UACvC;AAAA;AAAA;AAAA;AAAA,wBAIc,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAS5C;AAAA;AAAA,sBAEc,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBACrC,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,UAErC;AAAA;AAAA;AAAA;AAAA,wBAIc,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/ChatBubble.js
CHANGED
|
@@ -12,11 +12,11 @@ import {
|
|
|
12
12
|
StyleBodyWrapper,
|
|
13
13
|
StyleErrorMessage,
|
|
14
14
|
StyleHelpMessage
|
|
15
|
-
} from "./styled";
|
|
16
|
-
import { BubblesPropTypes, defaultBubbleProps } from "./react-desc-prop-types";
|
|
17
|
-
import { ChatBubbleArrow } from "./ChatBubbleArrow";
|
|
18
|
-
import { ChatBubbleDataTestIds } from "./ChatBubbleDataTestIds";
|
|
19
|
-
import { DSChatBubbleName } from "./DSChatBubbleDefinitions";
|
|
15
|
+
} from "./styled.js";
|
|
16
|
+
import { BubblesPropTypes, defaultBubbleProps } from "./react-desc-prop-types.js";
|
|
17
|
+
import { ChatBubbleArrow } from "./ChatBubbleArrow.js";
|
|
18
|
+
import { ChatBubbleDataTestIds } from "./ChatBubbleDataTestIds.js";
|
|
19
|
+
import { DSChatBubbleName } from "./DSChatBubbleDefinitions.js";
|
|
20
20
|
const ChatBubble = (props) => {
|
|
21
21
|
const propsWithDefault = useMemoMergePropsWithDefault(props, defaultBubbleProps);
|
|
22
22
|
useValidateTypescriptPropTypes(propsWithDefault, BubblesPropTypes, DSChatBubbleName);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/ChatBubble.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { WarningCircleFill } from '@elliemae/ds-icons';\nimport {\n StyledWrapper,\n StyledColoredBubble,\n StyledTitleBubble,\n StyledTitleLeftBubble,\n StyledTitleRightBubble,\n StyleBodyWrapper,\n StyleErrorMessage,\n StyleHelpMessage,\n} from './styled';\nimport { BubblesPropTypes, type DSChatBubbleT, defaultBubbleProps } from './react-desc-prop-types';\nimport { ChatBubbleArrow } from './ChatBubbleArrow';\nimport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds';\nimport { DSChatBubbleName } from './DSChatBubbleDefinitions';\n\nconst ChatBubble: React.ComponentType<DSChatBubbleT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultBubbleProps);\n useValidateTypescriptPropTypes(propsWithDefault, BubblesPropTypes, DSChatBubbleName);\n\n const { dsId, type, title, time, body, errorMessage, helpMessage } = propsWithDefault;\n const bodyParts = React.useMemo(() => (typeof body === 'string' ? body.split('\\n') : [body]), [body]);\n return (\n <StyledWrapper data-testid={`${ChatBubbleDataTestIds.BUBBLE}-${dsId}`}>\n <StyledColoredBubble type={type}>\n <StyledTitleBubble cols={['1fr', 'auto']} gutter=\"xs\" alignItems=\"flex-end\" className=\"sr-only\">\n <StyledTitleLeftBubble alignItems=\"center\" data-testid={`${ChatBubbleDataTestIds.BUBBLE_TITLE}-${dsId}`}>\n {title}\n </StyledTitleLeftBubble>\n <StyledTitleRightBubble\n alignItems=\"center\"\n type={type}\n data-testid={`${ChatBubbleDataTestIds.BUBBLE_TIME}-${dsId}`}\n >\n {time}\n </StyledTitleRightBubble>\n </StyledTitleBubble>\n <StyleBodyWrapper data-testid={`chat-bubble-body-${dsId}`}>\n {bodyParts.map((item, index) => (\n <React.Fragment key={`${item}-${dsId}`}>\n {item}\n {index < bodyParts.length - 1 ? <br /> : null}\n </React.Fragment>\n ))}\n </StyleBodyWrapper>\n <ChatBubbleArrow type={type} />\n </StyledColoredBubble>\n {errorMessage ? (\n <StyleErrorMessage data-testid={`chat-bubble-error-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{errorMessage}</span>\n <WarningCircleFill />\n </StyleErrorMessage>\n ) : null}\n {helpMessage ? (\n <StyleHelpMessage data-testid={`chat-bubble-help-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{helpMessage}</span>\n </StyleHelpMessage>\n ) : null}\n </StyledWrapper>\n );\n};\n\nChatBubble.propTypes = BubblesPropTypes;\nChatBubble.displayName = DSChatBubbleName;\nconst ChatBubbleWithSchema = describe(ChatBubble);\nChatBubbleWithSchema.propTypes = BubblesPropTypes;\n\nexport { ChatBubble, ChatBubbleWithSchema };\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useValidateTypescriptPropTypes, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { WarningCircleFill } from '@elliemae/ds-icons';\nimport {\n StyledWrapper,\n StyledColoredBubble,\n StyledTitleBubble,\n StyledTitleLeftBubble,\n StyledTitleRightBubble,\n StyleBodyWrapper,\n StyleErrorMessage,\n StyleHelpMessage,\n} from './styled.js';\nimport { BubblesPropTypes, type DSChatBubbleT, defaultBubbleProps } from './react-desc-prop-types.js';\nimport { ChatBubbleArrow } from './ChatBubbleArrow.js';\nimport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds.js';\nimport { DSChatBubbleName } from './DSChatBubbleDefinitions.js';\n\nconst ChatBubble: React.ComponentType<DSChatBubbleT.Props> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultBubbleProps);\n useValidateTypescriptPropTypes(propsWithDefault, BubblesPropTypes, DSChatBubbleName);\n\n const { dsId, type, title, time, body, errorMessage, helpMessage } = propsWithDefault;\n const bodyParts = React.useMemo(() => (typeof body === 'string' ? body.split('\\n') : [body]), [body]);\n return (\n <StyledWrapper data-testid={`${ChatBubbleDataTestIds.BUBBLE}-${dsId}`}>\n <StyledColoredBubble type={type}>\n <StyledTitleBubble cols={['1fr', 'auto']} gutter=\"xs\" alignItems=\"flex-end\" className=\"sr-only\">\n <StyledTitleLeftBubble alignItems=\"center\" data-testid={`${ChatBubbleDataTestIds.BUBBLE_TITLE}-${dsId}`}>\n {title}\n </StyledTitleLeftBubble>\n <StyledTitleRightBubble\n alignItems=\"center\"\n type={type}\n data-testid={`${ChatBubbleDataTestIds.BUBBLE_TIME}-${dsId}`}\n >\n {time}\n </StyledTitleRightBubble>\n </StyledTitleBubble>\n <StyleBodyWrapper data-testid={`chat-bubble-body-${dsId}`}>\n {bodyParts.map((item, index) => (\n <React.Fragment key={`${item}-${dsId}`}>\n {item}\n {index < bodyParts.length - 1 ? <br /> : null}\n </React.Fragment>\n ))}\n </StyleBodyWrapper>\n <ChatBubbleArrow type={type} />\n </StyledColoredBubble>\n {errorMessage ? (\n <StyleErrorMessage data-testid={`chat-bubble-error-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{errorMessage}</span>\n <WarningCircleFill />\n </StyleErrorMessage>\n ) : null}\n {helpMessage ? (\n <StyleHelpMessage data-testid={`chat-bubble-help-message-${dsId}`} p=\"xxs\" gutter=\"xxs\" cols={[1, 'auto']}>\n <span>{helpMessage}</span>\n </StyleHelpMessage>\n ) : null}\n </StyledWrapper>\n );\n};\n\nChatBubble.propTypes = BubblesPropTypes;\nChatBubble.displayName = DSChatBubbleName;\nconst ChatBubbleWithSchema = describe(ChatBubble);\nChatBubbleWithSchema.propTypes = BubblesPropTypes;\n\nexport { ChatBubble, ChatBubbleWithSchema };\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;AC2Bf,SACE,KADF;AA3BR,OAAOA,YAAW;AAClB,SAAS,UAAU,gCAAgC,oCAAoC;AACvF,SAAS,yBAAyB;AAClC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAsC,0BAA0B;AACzE,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;AACtC,SAAS,wBAAwB;AAEjC,MAAM,aAAuD,CAAC,UAAU;AACtE,QAAM,mBAAmB,6BAA6B,OAAO,kBAAkB;AAC/E,iCAA+B,kBAAkB,kBAAkB,gBAAgB;AAEnF,QAAM,EAAE,MAAM,MAAM,OAAO,MAAM,MAAM,cAAc,YAAY,IAAI;AACrE,QAAM,YAAYA,OAAM,QAAQ,MAAO,OAAO,SAAS,WAAW,KAAK,MAAM,IAAI,IAAI,CAAC,IAAI,GAAI,CAAC,IAAI,CAAC;AACpG,SACE,qBAAC,iBAAc,eAAa,GAAG,sBAAsB,UAAU,QAC7D;AAAA,yBAAC,uBAAoB,MACnB;AAAA,2BAAC,qBAAkB,MAAM,CAAC,OAAO,MAAM,GAAG,QAAO,MAAK,YAAW,YAAW,WAAU,WACpF;AAAA,4BAAC,yBAAsB,YAAW,UAAS,eAAa,GAAG,sBAAsB,gBAAgB,QAC9F,iBACH;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX;AAAA,YACA,eAAa,GAAG,sBAAsB,eAAe;AAAA,YAEpD;AAAA;AAAA,QACH;AAAA,SACF;AAAA,MACA,oBAAC,oBAAiB,eAAa,oBAAoB,QAChD,oBAAU,IAAI,CAAC,MAAM,UACpB,qBAACA,OAAM,UAAN,EACE;AAAA;AAAA,QACA,QAAQ,UAAU,SAAS,IAAI,oBAAC,QAAG,IAAK;AAAA,WAFtB,GAAG,QAAQ,MAGhC,CACD,GACH;AAAA,MACA,oBAAC,mBAAgB,MAAY;AAAA,OAC/B;AAAA,IACC,eACC,qBAAC,qBAAkB,eAAa,6BAA6B,QAAQ,GAAE,OAAM,QAAO,OAAM,MAAM,CAAC,GAAG,MAAM,GACxG;AAAA,0BAAC,UAAM,wBAAa;AAAA,MACpB,oBAAC,qBAAkB;AAAA,OACrB,IACE;AAAA,IACH,cACC,oBAAC,oBAAiB,eAAa,4BAA4B,QAAQ,GAAE,OAAM,QAAO,OAAM,MAAM,CAAC,GAAG,MAAM,GACtG,8BAAC,UAAM,uBAAY,GACrB,IACE;AAAA,KACN;AAEJ;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU;AAChD,qBAAqB,YAAY;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { StyledBubbleArrow } from "./styled";
|
|
3
|
+
import { StyledBubbleArrow } from "./styled.js";
|
|
4
4
|
import { describe } from "@elliemae/ds-props-helpers";
|
|
5
|
-
import { BUBBLE_TYPES, propsArrowBubble } from "./react-desc-prop-types";
|
|
5
|
+
import { BUBBLE_TYPES, propsArrowBubble } from "./react-desc-prop-types.js";
|
|
6
6
|
const ChatBubbleArrow = ({ type }) => /* @__PURE__ */ jsx(StyledBubbleArrow, { children: type === BUBBLE_TYPES.RECIPIENT ? /* @__PURE__ */ jsxs("svg", { width: "15px", height: "14px", viewBox: "0 0 15 14", children: [
|
|
7
7
|
/* @__PURE__ */ jsxs("defs", { children: [
|
|
8
8
|
/* @__PURE__ */ jsx(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/ChatBubbleArrow.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledBubbleArrow } from './styled';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { BUBBLE_TYPES, type DSChatBubbleT, propsArrowBubble } from './react-desc-prop-types';\n\nexport const ChatBubbleArrow: React.ComponentType<Pick<DSChatBubbleT.Props, 'type'>> = ({ type }) => (\n <StyledBubbleArrow>\n {type === BUBBLE_TYPES.RECIPIENT ? (\n <svg width=\"15px\" height=\"14px\" viewBox=\"0 0 15 14\">\n <defs>\n <path\n d=\"M12,8.5 C12,7.9373169 11.6782751,7.4856453 11.2282104,7.196228 C11.2286673,7.1967363 3,2 3,2 L3,10 L10.5627441,10 L10.5658569,9.9933472 C11.3630371,9.9580688 12,9.3058472 12,8.5 Z\"\n id=\"path-chat-bubble\"\n ></path>\n <filter x=\"-55.6%\" y=\"-50.0%\" width=\"211.1%\" height=\"225.0%\" filterUnits=\"objectBoundingBox\" id=\"filter-2\">\n <feOffset dx=\"2.3\" dy=\"1.2\" in=\"SourceAlpha\" result=\"shadowOffsetOuter1\"></feOffset>\n <feGaussianBlur stdDeviation=\"1.5\" in=\"shadowOffsetOuter1\" result=\"shadowBlurOuter1\"></feGaussianBlur>\n <feColorMatrix\n values=\"0 0 0 0 0.207843137 \n 0 0 0 0 0.235294118 \n 0 0 0 0 0.274509804 \n 0 0 0 0.8 0\"\n type=\"matrix\"\n in=\"shadowBlurOuter1\"\n ></feColorMatrix>\n </filter>\n </defs>\n <g id=\"[DSK]-Visual-Design\" stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g id=\"Path-Copy\" transform=\"translate(7.500000, 6.000000) scale(-1, 1) translate(-7.500000, -6.000000) \">\n <use fill=\"black\" fillOpacity=\"1\" filter=\"url(#filter-2)\" xlinkHref=\"#path-chat-bubble\"></use>\n <use fill=\"#FFFFFF\" fillRule=\"evenodd\" xlinkHref=\"#path-chat-bubble\"></use>\n </g>\n </g>\n </svg>\n ) : (\n <svg width=\"9px\" height=\"8px\" viewBox=\"0 0 9 8\">\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M9,6.5 C9,5.9373169 8.6782751,5.4856453 8.2282104,5.196228 C8.2286673,5.1967363 0,0 0,0 L0,8 L7.5627441,8 L7.5658569,7.9933472 C8.3630371,7.9580688 9,7.3058472 9,6.5 Z\"\n id=\"Path\"\n fill=\"#1E79C2\"\n ></path>\n </g>\n </svg>\n )}\n </StyledBubbleArrow>\n);\n\nChatBubbleArrow.propTypes = propsArrowBubble;\nconst ChatBubbleArrowWithSchema = describe(ChatBubbleArrow);\nChatBubbleArrowWithSchema.propTypes = propsArrowBubble;\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledBubbleArrow } from './styled.js';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { BUBBLE_TYPES, type DSChatBubbleT, propsArrowBubble } from './react-desc-prop-types.js';\n\nexport const ChatBubbleArrow: React.ComponentType<Pick<DSChatBubbleT.Props, 'type'>> = ({ type }) => (\n <StyledBubbleArrow>\n {type === BUBBLE_TYPES.RECIPIENT ? (\n <svg width=\"15px\" height=\"14px\" viewBox=\"0 0 15 14\">\n <defs>\n <path\n d=\"M12,8.5 C12,7.9373169 11.6782751,7.4856453 11.2282104,7.196228 C11.2286673,7.1967363 3,2 3,2 L3,10 L10.5627441,10 L10.5658569,9.9933472 C11.3630371,9.9580688 12,9.3058472 12,8.5 Z\"\n id=\"path-chat-bubble\"\n ></path>\n <filter x=\"-55.6%\" y=\"-50.0%\" width=\"211.1%\" height=\"225.0%\" filterUnits=\"objectBoundingBox\" id=\"filter-2\">\n <feOffset dx=\"2.3\" dy=\"1.2\" in=\"SourceAlpha\" result=\"shadowOffsetOuter1\"></feOffset>\n <feGaussianBlur stdDeviation=\"1.5\" in=\"shadowOffsetOuter1\" result=\"shadowBlurOuter1\"></feGaussianBlur>\n <feColorMatrix\n values=\"0 0 0 0 0.207843137 \n 0 0 0 0 0.235294118 \n 0 0 0 0 0.274509804 \n 0 0 0 0.8 0\"\n type=\"matrix\"\n in=\"shadowBlurOuter1\"\n ></feColorMatrix>\n </filter>\n </defs>\n <g id=\"[DSK]-Visual-Design\" stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <g id=\"Path-Copy\" transform=\"translate(7.500000, 6.000000) scale(-1, 1) translate(-7.500000, -6.000000) \">\n <use fill=\"black\" fillOpacity=\"1\" filter=\"url(#filter-2)\" xlinkHref=\"#path-chat-bubble\"></use>\n <use fill=\"#FFFFFF\" fillRule=\"evenodd\" xlinkHref=\"#path-chat-bubble\"></use>\n </g>\n </g>\n </svg>\n ) : (\n <svg width=\"9px\" height=\"8px\" viewBox=\"0 0 9 8\">\n <g stroke=\"none\" strokeWidth=\"1\" fill=\"none\" fillRule=\"evenodd\">\n <path\n d=\"M9,6.5 C9,5.9373169 8.6782751,5.4856453 8.2282104,5.196228 C8.2286673,5.1967363 0,0 0,0 L0,8 L7.5627441,8 L7.5658569,7.9933472 C8.3630371,7.9580688 9,7.3058472 9,6.5 Z\"\n id=\"Path\"\n fill=\"#1E79C2\"\n ></path>\n </g>\n </svg>\n )}\n </StyledBubbleArrow>\n);\n\nChatBubbleArrow.propTypes = propsArrowBubble;\nconst ChatBubbleArrowWithSchema = describe(ChatBubbleArrow);\nChatBubbleArrowWithSchema.propTypes = propsArrowBubble;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACUb,cAIA,YAJA;AATV,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AACzB,SAAS,cAAkC,wBAAwB;AAE5D,MAAM,kBAA0E,CAAC,EAAE,KAAK,MAC7F,oBAAC,qBACE,mBAAS,aAAa,YACrB,qBAAC,SAAI,OAAM,QAAO,QAAO,QAAO,SAAQ,aACtC;AAAA,uBAAC,UACC;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,GAAE;AAAA,QACF,IAAG;AAAA;AAAA,IACJ;AAAA,IACD,qBAAC,YAAO,GAAE,UAAS,GAAE,UAAS,OAAM,UAAS,QAAO,UAAS,aAAY,qBAAoB,IAAG,YAC9F;AAAA,0BAAC,cAAS,IAAG,OAAM,IAAG,OAAM,IAAG,eAAc,QAAO,sBAAqB;AAAA,MACzE,oBAAC,oBAAe,cAAa,OAAM,IAAG,sBAAqB,QAAO,oBAAmB;AAAA,MACrF;AAAA,QAAC;AAAA;AAAA,UACC,QAAO;AAAA,UAIP,MAAK;AAAA,UACL,IAAG;AAAA;AAAA,MACJ;AAAA,OACH;AAAA,KACF;AAAA,EACA,oBAAC,OAAE,IAAG,uBAAsB,QAAO,QAAO,aAAY,KAAI,MAAK,QAAO,UAAS,WAC7E,+BAAC,OAAE,IAAG,aAAY,WAAU,+EAC1B;AAAA,wBAAC,SAAI,MAAK,SAAQ,aAAY,KAAI,QAAO,kBAAiB,WAAU,qBAAoB;AAAA,IACxF,oBAAC,SAAI,MAAK,WAAU,UAAS,WAAU,WAAU,qBAAoB;AAAA,KACvE,GACF;AAAA,GACF,IAEA,oBAAC,SAAI,OAAM,OAAM,QAAO,OAAM,SAAQ,WACpC,8BAAC,OAAE,QAAO,QAAO,aAAY,KAAI,MAAK,QAAO,UAAS,WACpD;AAAA,EAAC;AAAA;AAAA,IACC,GAAE;AAAA,IACF,IAAG;AAAA,IACH,MAAK;AAAA;AACN,GACH,GACF,GAEJ;AAGF,gBAAgB,YAAY;AAC5B,MAAM,4BAA4B,SAAS,eAAe;AAC1D,0BAA0B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { ChatBubble, ChatBubbleWithSchema } from "./ChatBubble";
|
|
3
|
-
import { BUBBLE_TYPES } from "./react-desc-prop-types";
|
|
4
|
-
import { ChatBubbleDataTestIds } from "./ChatBubbleDataTestIds";
|
|
5
|
-
export * from "./styled";
|
|
2
|
+
import { ChatBubble, ChatBubbleWithSchema } from "./ChatBubble.js";
|
|
3
|
+
import { BUBBLE_TYPES } from "./react-desc-prop-types.js";
|
|
4
|
+
import { ChatBubbleDataTestIds } from "./ChatBubbleDataTestIds.js";
|
|
5
|
+
export * from "./styled.js";
|
|
6
6
|
export {
|
|
7
7
|
BUBBLE_TYPES,
|
|
8
8
|
ChatBubble,
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble';\nexport { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types';\nexport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds';\nexport * from './styled';\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble.js';\nexport { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types.js';\nexport { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds.js';\nexport * from './styled.js';\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,4BAA4B;AACjD,SAAS,oBAAwC;AACjD,SAAS,6BAA6B;AACtC,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled } from "@elliemae/ds-system";
|
|
3
3
|
import { Grid } from "@elliemae/ds-grid";
|
|
4
|
-
import { BUBBLE_TYPES } from "./react-desc-prop-types";
|
|
4
|
+
import { BUBBLE_TYPES } from "./react-desc-prop-types.js";
|
|
5
5
|
const StyledWrapper = styled.div`
|
|
6
6
|
min-width: 224px;
|
|
7
7
|
border-radius: 10px;
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUBBLE_TYPES } from './react-desc-prop-types';\n\n// Bubble WRAPPER\nexport const StyledWrapper = styled.div`\n min-width: 224px;\n border-radius: 10px;\n overflow-wrap: break-word;\n white-space: pre-wrap;\n`;\n\n// Bubble HEADER\nexport const StyledTitleBubble = styled(Grid)`\n padding-top: 6px;\n padding-left: 10px;\n padding-right: 10px;\n padding-bottom: 4px;\n`;\n\nexport const StyledTitleLeftBubble = styled(Grid)`\n font-size: 13px;\n font-weight: 600;\n`;\nexport const StyledTitleRightBubble = styled(Grid)<{ type: string }>`\n font-size: 13px;\n font-weight: 400;\n color: ${(props) => (props.type === BUBBLE_TYPES.SENDER ? '#FFF' : '#657489')};\n`;\n\nexport const StyleBodyWrapper = styled.div`\n font-size: 13px;\n font-weight: 400;\n line-height: 15px;\n min-height: 18px;\n padding: 0px 10px 8px 10px;\n`;\n\nexport const StyleErrorMessage = styled.div`\n font-size: 12px;\n font-weight: 400;\n padding-top: ${(props) => props.theme.space.xxxs};\n color: ${(props) => props.theme.colors.danger[900]};\n align-items: flex-end;\n justify-content: center;\n text-align: right;\n line-height: 15px;\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n .em-ds-icon {\n margin-left: 8px;\n }\n`;\n\nexport const StyleHelpMessage = styled(StyleErrorMessage)`\n font-size: 12px;\n line-height: 15px;\n color: ${(props) => props.theme.colors.neutral[500]};\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n`;\n\n// bubble sender/ recipient\nexport const StyledBubbleArrow = styled.div`\n display: block;\n content: '';\n position: absolute;\n bottom: 10px;\n height: 15px;\n`;\n\nexport const StyledColoredBubble = styled.div<{ type: string }>`\n min-width: 224px;\n border-radius: 10px;\n position: relative;\n\n ${(props) =>\n props.type === BUBBLE_TYPES.SENDER\n ? `\n border: 1px solid ${props.theme.colors.brand['700']};\n background: ${props.theme.colors.brand[600]};\n color: ${props.theme.colors.neutral['000']};\n ${StyledBubbleArrow}{ \n right: -9px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.brand[600]};\n }\n }\n\n a {\n color: #FFF;\n }\n\n `\n : `\n box-shadow: 0 1px 3px 0 rgba(53,60,70,0.80);\n background: ${props.theme.colors.neutral['000']};\n color: ${props.theme.colors.neutral[700]};\n\n ${StyledBubbleArrow}{ \n left: -11px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.neutral['000']};\n }\n }\n\n `}\n`;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAGtB,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ7B,MAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrC,MAAM,wBAAwB,OAAO,IAAI;AAAA;AAAA;AAAA;AAIzC,MAAM,yBAAyB,OAAO,IAAI;AAAA;AAAA;AAAA,WAGtC,CAAC,UAAW,MAAM,SAAS,aAAa,SAAS,SAAS;AAAA;AAG9D,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQhC,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA,iBAGvB,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA,WACnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { BUBBLE_TYPES } from './react-desc-prop-types.js';\n\n// Bubble WRAPPER\nexport const StyledWrapper = styled.div`\n min-width: 224px;\n border-radius: 10px;\n overflow-wrap: break-word;\n white-space: pre-wrap;\n`;\n\n// Bubble HEADER\nexport const StyledTitleBubble = styled(Grid)`\n padding-top: 6px;\n padding-left: 10px;\n padding-right: 10px;\n padding-bottom: 4px;\n`;\n\nexport const StyledTitleLeftBubble = styled(Grid)`\n font-size: 13px;\n font-weight: 600;\n`;\nexport const StyledTitleRightBubble = styled(Grid)<{ type: string }>`\n font-size: 13px;\n font-weight: 400;\n color: ${(props) => (props.type === BUBBLE_TYPES.SENDER ? '#FFF' : '#657489')};\n`;\n\nexport const StyleBodyWrapper = styled.div`\n font-size: 13px;\n font-weight: 400;\n line-height: 15px;\n min-height: 18px;\n padding: 0px 10px 8px 10px;\n`;\n\nexport const StyleErrorMessage = styled.div`\n font-size: 12px;\n font-weight: 400;\n padding-top: ${(props) => props.theme.space.xxxs};\n color: ${(props) => props.theme.colors.danger[900]};\n align-items: flex-end;\n justify-content: center;\n text-align: right;\n line-height: 15px;\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n .em-ds-icon {\n margin-left: 8px;\n }\n`;\n\nexport const StyleHelpMessage = styled(StyleErrorMessage)`\n font-size: 12px;\n line-height: 15px;\n color: ${(props) => props.theme.colors.neutral[500]};\n svg {\n fill: ${(props) => props.theme.colors.danger[900]};\n }\n a {\n font-size: 12px;\n color: ${(props) => props.theme.colors.danger[900]};\n }\n`;\n\n// bubble sender/ recipient\nexport const StyledBubbleArrow = styled.div`\n display: block;\n content: '';\n position: absolute;\n bottom: 10px;\n height: 15px;\n`;\n\nexport const StyledColoredBubble = styled.div<{ type: string }>`\n min-width: 224px;\n border-radius: 10px;\n position: relative;\n\n ${(props) =>\n props.type === BUBBLE_TYPES.SENDER\n ? `\n border: 1px solid ${props.theme.colors.brand['700']};\n background: ${props.theme.colors.brand[600]};\n color: ${props.theme.colors.neutral['000']};\n ${StyledBubbleArrow}{ \n right: -9px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.brand[600]};\n }\n }\n\n a {\n color: #FFF;\n }\n\n `\n : `\n box-shadow: 0 1px 3px 0 rgba(53,60,70,0.80);\n background: ${props.theme.colors.neutral['000']};\n color: ${props.theme.colors.neutral[700]};\n\n ${StyledBubbleArrow}{ \n left: -11px;\n bottom: 6px;\n svg{\n fill: ${props.theme.colors.neutral['000']};\n }\n }\n\n `}\n`;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAGtB,MAAM,gBAAgB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAQ7B,MAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAOrC,MAAM,wBAAwB,OAAO,IAAI;AAAA;AAAA;AAAA;AAIzC,MAAM,yBAAyB,OAAO,IAAI;AAAA;AAAA;AAAA,WAGtC,CAAC,UAAW,MAAM,SAAS,aAAa,SAAS,SAAS;AAAA;AAG9D,MAAM,mBAAmB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQhC,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA,iBAGvB,CAAC,UAAU,MAAM,MAAM,MAAM;AAAA,WACnC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAMvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAO9C,MAAM,mBAAmB,OAAO,iBAAiB;AAAA;AAAA;AAAA,WAG7C,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,YAExC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA,aAIvC,CAAC,UAAU,MAAM,MAAM,OAAO,OAAO,GAAG;AAAA;AAAA;AAK9C,MAAM,oBAAoB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQjC,MAAM,sBAAsB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKtC,CAAC,UACD,MAAM,SAAS,aAAa,SACxB;AAAA,4BACoB,MAAM,MAAM,OAAO,MAAM,KAAK;AAAA,sBACpC,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA,iBACjC,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,UACvC;AAAA;AAAA;AAAA;AAAA,wBAIc,MAAM,MAAM,OAAO,MAAM,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAS5C;AAAA;AAAA,sBAEc,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,iBACrC,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,UAErC;AAAA;AAAA;AAAA;AAAA,wBAIc,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { type DSChatBubbleT } from './react-desc-prop-types';
|
|
2
|
+
import { type DSChatBubbleT } from './react-desc-prop-types.js';
|
|
3
3
|
declare const ChatBubble: React.ComponentType<DSChatBubbleT.Props>;
|
|
4
|
-
declare const ChatBubbleWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").DocumentedReactComponent<DSChatBubbleT.Props>;
|
|
4
|
+
declare const ChatBubbleWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<DSChatBubbleT.Props>;
|
|
5
5
|
export { ChatBubble, ChatBubbleWithSchema };
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble';
|
|
2
|
-
export { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types';
|
|
3
|
-
export { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds';
|
|
4
|
-
export * from './styled';
|
|
1
|
+
export { ChatBubble, ChatBubbleWithSchema } from './ChatBubble.js';
|
|
2
|
+
export { BUBBLE_TYPES, type DSChatBubbleT } from './react-desc-prop-types.js';
|
|
3
|
+
export { ChatBubbleDataTestIds } from './ChatBubbleDataTestIds.js';
|
|
4
|
+
export * from './styled.js';
|
package/dist/types/styled.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const StyledWrapper: import("styled-components").StyledComponent<keyof JSX.IntrinsicElements, import("@elliemae/ds-system").Theme, Record<string, unknown> & object, never>;
|
|
3
|
-
export declare const StyledTitleBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object, never>;
|
|
4
|
-
export declare const StyledTitleLeftBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object, never>;
|
|
5
|
-
export declare const StyledTitleRightBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, {
|
|
3
|
+
export declare const StyledTitleBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types.js").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object, never>;
|
|
4
|
+
export declare const StyledTitleLeftBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types.js").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, object, never>;
|
|
5
|
+
export declare const StyledTitleRightBubble: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/dist/types/react-desc-prop-types.js").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, {
|
|
6
6
|
type: string;
|
|
7
7
|
}, never>;
|
|
8
8
|
export declare const StyleBodyWrapper: import("styled-components").StyledComponent<keyof JSX.IntrinsicElements, import("@elliemae/ds-system").Theme, Record<string, unknown> & object, never>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-chat-bubble",
|
|
3
|
-
"version": "3.16.
|
|
3
|
+
"version": "3.16.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Chat",
|
|
6
6
|
"files": [
|
|
@@ -51,17 +51,17 @@
|
|
|
51
51
|
"typeSafety": false
|
|
52
52
|
},
|
|
53
53
|
"dependencies": {
|
|
54
|
-
"@elliemae/ds-grid": "3.16.
|
|
55
|
-
"@elliemae/ds-icons": "3.16.
|
|
56
|
-
"@elliemae/ds-props-helpers": "3.16.
|
|
57
|
-
"@elliemae/ds-system": "3.16.
|
|
58
|
-
"@elliemae/ds-utilities": "3.16.
|
|
54
|
+
"@elliemae/ds-grid": "3.16.1",
|
|
55
|
+
"@elliemae/ds-icons": "3.16.1",
|
|
56
|
+
"@elliemae/ds-props-helpers": "3.16.1",
|
|
57
|
+
"@elliemae/ds-system": "3.16.1",
|
|
58
|
+
"@elliemae/ds-utilities": "3.16.1"
|
|
59
59
|
},
|
|
60
60
|
"devDependencies": {
|
|
61
61
|
"@testing-library/dom": "~8.19.0",
|
|
62
62
|
"@testing-library/jest-dom": "~5.16.5",
|
|
63
63
|
"@testing-library/react": "~12.1.3",
|
|
64
|
-
"styled-components": "~5.3.
|
|
64
|
+
"styled-components": "~5.3.9"
|
|
65
65
|
},
|
|
66
66
|
"peerDependencies": {
|
|
67
67
|
"lodash": "^4.17.21",
|