@athoscommerce/snap-preact 1.2.3-beta.1 → 1.2.3-beta.3
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/components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.js +4 -1
- package/dist/cjs/components/src/components/Molecules/ChatProductComparisonMessage/ChatProductComparisonMessage.js +1 -1
- package/dist/cjs/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.js +5 -2
- package/dist/cjs/components/src/components/Organisms/Chat/Chat.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Organisms/Chat/Chat.js +143 -39
- package/dist/cjs/components/src/components/Organisms/Chat/ChatResult.d.ts +2 -3
- package/dist/cjs/components/src/components/Organisms/Chat/ChatResult.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Organisms/Chat/ChatResult.js +17 -7
- package/dist/cjs/components/src/components/Organisms/Chat/MessageUser.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Organisms/Chat/MessageUser.js +54 -22
- package/dist/cjs/components/src/components/Organisms/Chat/ResultsDisplay.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Organisms/Chat/ResultsDisplay.js +4 -1
- package/dist/cjs/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.js +6 -10
- package/dist/cjs/components/src/components/Templates/AutocompleteModal/AutocompleteModal.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Templates/AutocompleteModal/AutocompleteModal.js +4 -8
- package/dist/cjs/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.js +5 -9
- package/dist/cjs/components/src/hooks/useAcRenderedInput.js +1 -1
- package/dist/esm/components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.d.ts.map +1 -1
- package/dist/esm/components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.js +4 -1
- package/dist/esm/components/src/components/Molecules/ChatProductComparisonMessage/ChatProductComparisonMessage.js +1 -1
- package/dist/esm/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.d.ts.map +1 -1
- package/dist/esm/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.js +5 -2
- package/dist/esm/components/src/components/Organisms/Chat/Chat.d.ts.map +1 -1
- package/dist/esm/components/src/components/Organisms/Chat/Chat.js +131 -28
- package/dist/esm/components/src/components/Organisms/Chat/ChatResult.d.ts +2 -3
- package/dist/esm/components/src/components/Organisms/Chat/ChatResult.d.ts.map +1 -1
- package/dist/esm/components/src/components/Organisms/Chat/ChatResult.js +17 -7
- package/dist/esm/components/src/components/Organisms/Chat/MessageUser.d.ts.map +1 -1
- package/dist/esm/components/src/components/Organisms/Chat/MessageUser.js +51 -20
- package/dist/esm/components/src/components/Organisms/Chat/ResultsDisplay.d.ts.map +1 -1
- package/dist/esm/components/src/components/Organisms/Chat/ResultsDisplay.js +4 -1
- package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.d.ts.map +1 -1
- package/dist/esm/components/src/components/Templates/AutocompleteFixed/AutocompleteFixed.js +4 -8
- package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.d.ts.map +1 -1
- package/dist/esm/components/src/components/Templates/AutocompleteModal/AutocompleteModal.js +4 -8
- package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.d.ts.map +1 -1
- package/dist/esm/components/src/components/Templates/AutocompleteSlideout/AutocompleteSlideout.js +4 -8
- package/dist/esm/components/src/hooks/useAcRenderedInput.js +1 -1
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatInspirationResultMessage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAErE,OAAO,EAAoB,iCAAiC,EAAE,MAAM,4BAA4B,CAAC;AAyDjG,eAAO,MAAM,4BAA4B,gBAAyB,iCAAiC;;
|
|
1
|
+
{"version":3,"file":"ChatInspirationResultMessage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ChatInspirationResultMessage/ChatInspirationResultMessage.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAErE,OAAO,EAAoB,iCAAiC,EAAE,MAAM,4BAA4B,CAAC;AAyDjG,eAAO,MAAM,4BAA4B,gBAAyB,iCAAiC;;CA8GjG,CAAC;AAMH,MAAM,MAAM,iCAAiC,GAAG;IAC/C,QAAQ,EAAE,iCAAiC,CAAC;IAC5C,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,gCAAgC,CAAC,CAAC;CACjD,GAAG,+CAA+C,GAClD,cAAc,CAAC,iCAAiC,CAAC,CAAC;AAEnD,MAAM,MAAM,+CAA+C,GAAG;IAC7D,QAAQ,EAAE,iCAAiC,CAAC;CAC5C,CAAC;AAEF,MAAM,WAAW,gCAAgC;CAKhD"}
|
|
@@ -103,11 +103,14 @@ exports.ChatInspirationResultMessage = (0, mobx_react_lite_1.observer)(function
|
|
|
103
103
|
return null;
|
|
104
104
|
}
|
|
105
105
|
return inspirationSections.length ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('ss__chat-inspiration-result-message', className, internalClassName) }, styling, { children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections'), children: inspirationSections.map(function (section, index) { return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__title'), children: section.clusterTitle }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__description'), children: section.clusterDescription }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__queries'), children: section.searchQueries.map(function (searchTerm, index) { return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__queries__query'), onClick: function () {
|
|
106
|
+
if ((controller === null || controller === void 0 ? void 0 : controller.store.loading) || (controller === null || controller === void 0 ? void 0 : controller.store.blocked))
|
|
107
|
+
return;
|
|
106
108
|
controller === null || controller === void 0 ? void 0 : controller.search({ data: { requestType: 'productSearch', searchTerm: searchTerm } });
|
|
107
109
|
}, children: searchTerm }, index)); }) }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__products'), children: (0, jsx_runtime_1.jsx)(__1.Carousel, __assign({}, subProps.Carousel, { children: section.products.map(function (product) {
|
|
108
110
|
var _a, _b, _c, _d;
|
|
109
111
|
var display = (product === null || product === void 0 ? void 0 : product.display) || product;
|
|
110
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__products__product'), children: (0, jsx_runtime_1.jsx)(Image_1.Image, { onClick: function () {
|
|
112
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-inspiration-result-message__inspiration-sections__section__products__product'), children: (0, jsx_runtime_1.jsx)(Image_1.Image, { onClick: function (e) {
|
|
113
|
+
controller === null || controller === void 0 ? void 0 : controller.track.product.click(e, product);
|
|
111
114
|
controller === null || controller === void 0 ? void 0 : controller.viewProduct(product);
|
|
112
115
|
onViewProduct === null || onViewProduct === void 0 ? void 0 : onViewProduct();
|
|
113
116
|
}, alt: ((_b = (_a = display === null || display === void 0 ? void 0 : display.mappings) === null || _a === void 0 ? void 0 : _a.core) === null || _b === void 0 ? void 0 : _b.name) || '', src: ((_d = (_c = display === null || display === void 0 ? void 0 : display.mappings) === null || _c === void 0 ? void 0 : _c.core) === null || _d === void 0 ? void 0 : _d.imageUrl) || '' }) }, product.id));
|
|
@@ -90,7 +90,7 @@ exports.ChatProductComparisonMessage = (0, mobx_react_lite_1.observer)(function
|
|
|
90
90
|
console.warn('ChatProductComparisonMessage received message with unsupported type:', messageType, 'Expected type: productComparison');
|
|
91
91
|
return null;
|
|
92
92
|
}
|
|
93
|
-
var headings =
|
|
93
|
+
var headings = searchResults.length ? searchResults.map(function (r) { return String(r === null || r === void 0 ? void 0 : r.id); }) : [];
|
|
94
94
|
var getDisplay = function (r) { return (r === null || r === void 0 ? void 0 : r.display) || r; };
|
|
95
95
|
var allProductsHaveImage = headings.length > 0 && headings.every(function (heading) { var _a, _b, _c; return !!((_c = (_b = (_a = getDisplay(searchResults.find(function (r) { return (r === null || r === void 0 ? void 0 : r.id) === heading; }))) === null || _a === void 0 ? void 0 : _a.mappings) === null || _b === void 0 ? void 0 : _b.core) === null || _c === void 0 ? void 0 : _c.imageUrl); });
|
|
96
96
|
return comparisonData.features.length ? ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsx)("div", __assign({ className: (0, classnames_1.default)('ss__chat-product-comparison-message', className, internalClassName) }, styling, { children: (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-comparison-message__table-wrapper'), children: (0, jsx_runtime_1.jsxs)("table", { className: (0, classnames_1.default)('ss__chat-product-comparison-message__table'), children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", {}), headings.map(function (heading) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatProductQueryMessage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA+ZrE,eAAO,MAAM,uBAAuB,gBAAyB,4BAA4B;;
|
|
1
|
+
{"version":3,"file":"ChatProductQueryMessage.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA+ZrE,eAAO,MAAM,uBAAuB,gBAAyB,4BAA4B;;CA0OvF,CAAC;AAEH,MAAM,MAAM,4BAA4B,GAAG;IAC1C,QAAQ,EAAE,2BAA2B,CAAC;IACtC,UAAU,CAAC,EAAE,cAAc,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,EAAE,CAAC;IACzB,IAAI,CAAC,EAAE,OAAO,CAAC,2BAA2B,CAAC,CAAC;CAC5C,GAAG,0CAA0C,GAC7C,cAAc,CAAC,4BAA4B,CAAC,CAAC;AAE9C,MAAM,MAAM,2BAA2B,GAAG;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE,cAAc,CAAC;IAC5B,aAAa,EAAE,GAAG,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,0CAA0C,GAAG;IACxD,QAAQ,EAAE,2BAA2B,CAAC;CACtC,CAAC;AAEF,MAAM,WAAW,2BAA2B;CAE3C"}
|
|
@@ -430,7 +430,10 @@ exports.ChatProductQueryMessage = (0, mobx_react_lite_1.observer)(function (prop
|
|
|
430
430
|
(_a = controller === null || controller === void 0 ? void 0 : controller.store.currentChat) === null || _a === void 0 ? void 0 : _a.popProductQueryMessage(chatItem.sourceMessageId);
|
|
431
431
|
controller === null || controller === void 0 ? void 0 : controller.store.clearProductQuickview();
|
|
432
432
|
};
|
|
433
|
-
return ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)('ss__chat-product-query-message', className, internalClassName) }, styling, { children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header'), children: [cameFromInspiration && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__back'), onClick: handleBack, children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: "angle-left", size: "14px" }), (0, jsx_runtime_1.jsx)("span", { children: "Back to inspiration" })] })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product'), children: [displayedCore.imageUrl && ((0, jsx_runtime_1.jsx)(Image_1.Image, { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__image'), src: displayedCore.imageUrl, alt: displayedCore.name || '' })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details'), children: [displayedCore.name && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__name'), children: displayedCore.url ? ((0, jsx_runtime_1.jsx)("a", { href: displayedCore.url, target: "_blank", rel: "noopener noreferrer", children: displayedCore.name })) : (displayedCore.name) })), displayedCore.brand && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__brand'), children: displayedCore.brand })), displayedCore.price != null && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__price'), children: (0, jsx_runtime_1.jsx)(__1.Price, { value: displayedCore.price }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions'), children: [displayedCore.url && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__go-to-product'), children: (0, jsx_runtime_1.jsx)("a", { href: displayedCore.url,
|
|
433
|
+
return ((0, jsx_runtime_1.jsx)(providers_1.CacheProvider, { children: (0, jsx_runtime_1.jsxs)("div", __assign({ className: (0, classnames_1.default)('ss__chat-product-query-message', className, internalClassName) }, styling, { children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header'), children: [cameFromInspiration && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__back'), onClick: handleBack, children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: "angle-left", size: "14px" }), (0, jsx_runtime_1.jsx)("span", { children: "Back to inspiration" })] })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product'), children: [displayedCore.imageUrl && ((0, jsx_runtime_1.jsx)(Image_1.Image, { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__image'), src: displayedCore.imageUrl, alt: displayedCore.name || '' })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details'), children: [displayedCore.name && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__name'), children: displayedCore.url ? ((0, jsx_runtime_1.jsx)("a", { href: displayedCore.url, onClick: function (e) { return controller === null || controller === void 0 ? void 0 : controller.track.product.click(e, product); }, target: "_blank", rel: "noopener noreferrer", children: displayedCore.name })) : (displayedCore.name) })), displayedCore.brand && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__brand'), children: displayedCore.brand })), displayedCore.price != null && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__price'), children: (0, jsx_runtime_1.jsx)(__1.Price, { value: displayedCore.price }) }))] }), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions'), children: [displayedCore.url && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__go-to-product'), children: (0, jsx_runtime_1.jsx)("a", { href: displayedCore.url, onClick: function (e) { return controller === null || controller === void 0 ? void 0 : controller.track.product.click(e, product); }, target: "_blank", rel: "noopener noreferrer", children: "Go to product" }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__add-to-cart'), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { content: 'Add to Cart', onClick: function () {
|
|
434
|
+
controller === null || controller === void 0 ? void 0 : controller.track.product.addToCart(product);
|
|
435
|
+
controller === null || controller === void 0 ? void 0 : controller.addToCart(product);
|
|
436
|
+
} }) }), (controller === null || controller === void 0 ? void 0 : controller.store.features.similarProducts.enabled) && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__show-similar'), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { content: 'Show Similar', onClick: function () { return controller === null || controller === void 0 ? void 0 : controller.discussProduct(sourceProduct, { requestType: 'productSimilar' }); } }) }))] })] })] }), selections.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__variants'), children: selections.map(function (selection) { return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__variants__label'), children: [formatLabel(selection.field), " (", selection.values.length, ")"] }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__variants__swatches'), children: selection.values.map(function (selectionValue) {
|
|
434
437
|
var _a;
|
|
435
438
|
var isUnavailable = !selectionValue.available;
|
|
436
439
|
var isSelected = ((_a = selection.selected) === null || _a === void 0 ? void 0 : _a.value) === selectionValue.value;
|
|
@@ -441,5 +444,5 @@ exports.ChatProductQueryMessage = (0, mobx_react_lite_1.observer)(function (prop
|
|
|
441
444
|
}) })] }, selection.field)); }) })), infoRows.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__title'), children: "Product Information" }), (0, jsx_runtime_1.jsx)("table", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__table'), children: (0, jsx_runtime_1.jsx)("tbody", { children: infoRows.map(function (row) { return ((0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: row.label }), (0, jsx_runtime_1.jsx)("td", { children: row.rawKey === 'availability' ? ((0, jsx_runtime_1.jsx)("span", { className: (0, classnames_1.default)({
|
|
442
445
|
'ss__chat-product-query-message__section__table__availability--in-stock': row.value === 'In Stock',
|
|
443
446
|
'ss__chat-product-query-message__section__table__availability--out-of-stock': row.value === 'Out of Stock',
|
|
444
|
-
}), children: row.value === 'In Stock' ? "\u2713 ".concat(row.value) : row.value })) : (row.value) })] }, row.key)); }) }) })] })), descriptionRow && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__title'), children: "Description" }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__description'), children: descriptionRow.value })] })), features.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__title'), children: "Features" }), (0, jsx_runtime_1.jsx)("ul", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__features'), children: features.map(function (feature, idx) { return ((0, jsx_runtime_1.jsx)("li", { children: feature }, idx)); }) })] }))] })) }));
|
|
447
|
+
}), children: row.value === 'In Stock' ? "\u2713 ".concat(row.value) : row.value })) : row.rawKey.toLowerCase() === 'price' ? ((0, jsx_runtime_1.jsx)(__1.Price, { value: Number(row.value) })) : (row.value) })] }, row.key)); }) }) })] })), descriptionRow && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__title'), children: "Description" }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__description'), children: descriptionRow.value })] })), features.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section'), children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__title'), children: "Features" }), (0, jsx_runtime_1.jsx)("ul", { className: (0, classnames_1.default)('ss__chat-product-query-message__section__features'), children: features.map(function (feature, idx) { return ((0, jsx_runtime_1.jsx)("li", { children: feature }, idx)); }) })] }))] })) }));
|
|
445
448
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chat.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/Chat.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"Chat.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/Chat.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAwgCrE,eAAO,MAAM,IAAI,gBAAyB,SAAS,KAAG,GAAG,CAAC,OAAO;;CAwwC/D,CAAC;AAEH,MAAM,WAAW,SAAU,SAAQ,cAAc;IAChD,UAAU,EAAE,cAAc,CAAC;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC5B"}
|
|
@@ -213,11 +213,11 @@ var defaultStyles = function (_a) {
|
|
|
213
213
|
padding: '12px 16px',
|
|
214
214
|
fontSize: '14px',
|
|
215
215
|
color: '#333',
|
|
216
|
-
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.
|
|
216
|
+
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.2)',
|
|
217
217
|
cursor: 'pointer',
|
|
218
218
|
lineHeight: 1.4,
|
|
219
219
|
'&:hover': {
|
|
220
|
-
boxShadow: '0 4px 12px rgba(0, 0, 0, 0.
|
|
220
|
+
boxShadow: '0 4px 12px rgba(0, 0, 0, 0.2)',
|
|
221
221
|
},
|
|
222
222
|
},
|
|
223
223
|
},
|
|
@@ -257,6 +257,7 @@ var defaultStyles = function (_a) {
|
|
|
257
257
|
display: 'flex',
|
|
258
258
|
'.ss__chat__header__title__logo': {
|
|
259
259
|
height: '44px',
|
|
260
|
+
width: 'auto',
|
|
260
261
|
},
|
|
261
262
|
'.ss__chat__header__title__text': {
|
|
262
263
|
display: 'flex',
|
|
@@ -472,9 +473,9 @@ var defaultStyles = function (_a) {
|
|
|
472
473
|
alignItems: 'stretch',
|
|
473
474
|
'.ss__chat__content__header__comparisons__content__items': {
|
|
474
475
|
display: 'flex',
|
|
475
|
-
gap: '1em',
|
|
476
476
|
flex: '1 1 calc(100% - 100px)',
|
|
477
477
|
justifyContent: 'space-between',
|
|
478
|
+
gap: '0.5em',
|
|
478
479
|
},
|
|
479
480
|
'.ss__chat__content__header__comparisons__content__comparison': {
|
|
480
481
|
background: '#fff',
|
|
@@ -483,7 +484,7 @@ var defaultStyles = function (_a) {
|
|
|
483
484
|
display: 'flex',
|
|
484
485
|
flexDirection: 'column',
|
|
485
486
|
gap: '0.5em',
|
|
486
|
-
flex: '0 1
|
|
487
|
+
flex: '0 1 25%',
|
|
487
488
|
position: 'relative',
|
|
488
489
|
'&.ss__chat__content__header__comparisons__content__comparison--placeholder': {
|
|
489
490
|
border: '2px dashed #ddd',
|
|
@@ -540,7 +541,6 @@ var defaultStyles = function (_a) {
|
|
|
540
541
|
},
|
|
541
542
|
'.ss__chat__messages': {
|
|
542
543
|
flex: '1 1 auto',
|
|
543
|
-
overflowY: 'auto',
|
|
544
544
|
overscrollBehavior: 'contain',
|
|
545
545
|
margin: 0,
|
|
546
546
|
maxHeight: '100%',
|
|
@@ -548,6 +548,32 @@ var defaultStyles = function (_a) {
|
|
|
548
548
|
'.ss__chat__messages__end': {
|
|
549
549
|
height: '1px',
|
|
550
550
|
},
|
|
551
|
+
'.ss__chat__new-messages': {
|
|
552
|
+
position: 'sticky',
|
|
553
|
+
bottom: '10px',
|
|
554
|
+
display: 'flex',
|
|
555
|
+
alignItems: 'center',
|
|
556
|
+
justifyContent: 'center',
|
|
557
|
+
gap: '6px',
|
|
558
|
+
margin: '0 auto',
|
|
559
|
+
width: 'fit-content',
|
|
560
|
+
padding: '6px 16px',
|
|
561
|
+
background: colorPrimary,
|
|
562
|
+
color: '#fff',
|
|
563
|
+
borderRadius: '999px',
|
|
564
|
+
fontSize: '13px',
|
|
565
|
+
fontWeight: 500,
|
|
566
|
+
cursor: 'pointer',
|
|
567
|
+
boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
|
|
568
|
+
zIndex: 5,
|
|
569
|
+
'&:hover': {
|
|
570
|
+
background: '#1a2a5c',
|
|
571
|
+
},
|
|
572
|
+
svg: {
|
|
573
|
+
fill: '#fff',
|
|
574
|
+
stroke: '#fff',
|
|
575
|
+
},
|
|
576
|
+
},
|
|
551
577
|
'.ss__chat__message': {
|
|
552
578
|
marginBottom: '30px',
|
|
553
579
|
ul: {
|
|
@@ -712,13 +738,19 @@ var defaultStyles = function (_a) {
|
|
|
712
738
|
display: 'flex',
|
|
713
739
|
justifyContent: 'flex-end',
|
|
714
740
|
padding: '0 2px',
|
|
741
|
+
// reserve the slot so toggling the button's visibility doesn't reflow the header
|
|
742
|
+
visibility: 'hidden',
|
|
743
|
+
'&.ss__chat__actions__facets-apply--active': {
|
|
744
|
+
visibility: 'visible',
|
|
745
|
+
},
|
|
715
746
|
'.ss__button': {
|
|
716
747
|
background: '#253B80',
|
|
717
748
|
color: '#fff',
|
|
718
749
|
border: 'none',
|
|
719
750
|
borderRadius: '999px',
|
|
720
|
-
padding: '
|
|
721
|
-
fontSize: '
|
|
751
|
+
padding: '2px 10px',
|
|
752
|
+
fontSize: '12px',
|
|
753
|
+
lineHeight: '1.4',
|
|
722
754
|
cursor: 'pointer',
|
|
723
755
|
'&:not(.ss__button--disabled):hover': {
|
|
724
756
|
background: '#1a2a5c',
|
|
@@ -956,6 +988,7 @@ var defaultStyles = function (_a) {
|
|
|
956
988
|
padding: '0.5em 0',
|
|
957
989
|
margin: '0 0 0 1em',
|
|
958
990
|
flex: '1 0 auto',
|
|
991
|
+
border: 'none',
|
|
959
992
|
'&::placeholder': {
|
|
960
993
|
color: '#999',
|
|
961
994
|
opacity: 0.7,
|
|
@@ -1004,7 +1037,7 @@ var defaultStyles = function (_a) {
|
|
|
1004
1037
|
});
|
|
1005
1038
|
};
|
|
1006
1039
|
exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
1007
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w
|
|
1040
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
1008
1041
|
var globalTheme = (0, providers_1.useTheme)();
|
|
1009
1042
|
var globalTreePath = (0, providers_1.useTreePath)();
|
|
1010
1043
|
var isMobile = (0, __1.useMediaQuery)('(max-width: 767px)');
|
|
@@ -1034,10 +1067,12 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1034
1067
|
var swipeStartTime = (0, hooks_1.useRef)(0);
|
|
1035
1068
|
var swipeActive = (0, hooks_1.useRef)(false);
|
|
1036
1069
|
var swipeOffsetRef = (0, hooks_1.useRef)(0);
|
|
1037
|
-
var
|
|
1038
|
-
var
|
|
1039
|
-
var
|
|
1040
|
-
var
|
|
1070
|
+
var _x = (0, hooks_1.useState)(0), swipeOffset = _x[0], setSwipeOffsetRaw = _x[1];
|
|
1071
|
+
var _y = (0, hooks_1.useState)(false), swipeAnimating = _y[0], setSwipeAnimating = _y[1];
|
|
1072
|
+
var _z = (0, hooks_1.useState)(false), mobileProductInfoOpen = _z[0], setMobileProductInfoOpen = _z[1];
|
|
1073
|
+
var _0 = (0, hooks_1.useState)(0), footerHeight = _0[0], setFooterHeight = _0[1];
|
|
1074
|
+
var _1 = (0, hooks_1.useState)(false), showNewMessages = _1[0], setShowNewMessages = _1[1];
|
|
1075
|
+
var isNearBottomRef = (0, hooks_1.useRef)(true);
|
|
1041
1076
|
var updateSwipeOffset = function (value) {
|
|
1042
1077
|
swipeOffsetRef.current = value;
|
|
1043
1078
|
setSwipeOffsetRaw(value);
|
|
@@ -1046,15 +1081,79 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1046
1081
|
var _a;
|
|
1047
1082
|
(_a = messagesEndRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: 'smooth' });
|
|
1048
1083
|
};
|
|
1049
|
-
//
|
|
1084
|
+
// Conditional scroll: only scrolls if the user is already near the bottom.
|
|
1085
|
+
// Passed to child components (e.g. image onLoad) so they don't yank the user
|
|
1086
|
+
// back to the bottom when they have scrolled up to read older messages.
|
|
1087
|
+
var scrollToBottomIfNear = function () {
|
|
1088
|
+
if (isNearBottomRef.current) {
|
|
1089
|
+
scrollToBottom();
|
|
1090
|
+
}
|
|
1091
|
+
};
|
|
1092
|
+
// productQuery messages are filtered out of the main chat render (they only drive the side-chat panel),
|
|
1093
|
+
// so don't auto-scroll when one is added — otherwise clicking a product in the side chat scrolls the main thread.
|
|
1094
|
+
var visibleChatLength = (((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.chat) || []).filter(function (m) { return m.messageType !== 'productQuery'; }).length;
|
|
1095
|
+
// Scroll to bottom when chat opens
|
|
1050
1096
|
(0, hooks_1.useEffect)(function () {
|
|
1051
|
-
// if (store.open && messagesContainerRef.current) {
|
|
1052
|
-
// messagesContainerRef.current.scrollTop = messagesContainerRef.current.scrollHeight;
|
|
1053
|
-
// }
|
|
1054
1097
|
if (store.open) {
|
|
1055
1098
|
scrollToBottom();
|
|
1099
|
+
setShowNewMessages(false);
|
|
1100
|
+
isNearBottomRef.current = true;
|
|
1101
|
+
}
|
|
1102
|
+
}, [store.open]);
|
|
1103
|
+
// Handle new messages — auto-scroll for user messages, show popup for response messages when scrolled up
|
|
1104
|
+
(0, hooks_1.useEffect)(function () {
|
|
1105
|
+
var _a;
|
|
1106
|
+
if (!store.open)
|
|
1107
|
+
return;
|
|
1108
|
+
var chat = ((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.chat) || [];
|
|
1109
|
+
var visibleChat = chat.filter(function (m) { return m.messageType !== 'productQuery'; });
|
|
1110
|
+
var lastMessage = visibleChat[visibleChat.length - 1];
|
|
1111
|
+
if (!lastMessage)
|
|
1112
|
+
return;
|
|
1113
|
+
if (lastMessage.messageType === 'user') {
|
|
1114
|
+
scrollToBottom();
|
|
1115
|
+
setShowNewMessages(false);
|
|
1116
|
+
}
|
|
1117
|
+
else {
|
|
1118
|
+
if (isNearBottomRef.current) {
|
|
1119
|
+
scrollToBottom();
|
|
1120
|
+
setShowNewMessages(false);
|
|
1121
|
+
}
|
|
1122
|
+
else {
|
|
1123
|
+
setShowNewMessages(true);
|
|
1124
|
+
}
|
|
1125
|
+
}
|
|
1126
|
+
}, [visibleChatLength]);
|
|
1127
|
+
// Scroll to show loading indicator when user sends a message
|
|
1128
|
+
(0, hooks_1.useEffect)(function () {
|
|
1129
|
+
if (store.open && store.loading) {
|
|
1130
|
+
scrollToBottom();
|
|
1131
|
+
}
|
|
1132
|
+
}, [store.loading]);
|
|
1133
|
+
// Track scroll position to dismiss the "New messages" popup when user scrolls to bottom
|
|
1134
|
+
(0, hooks_1.useEffect)(function () {
|
|
1135
|
+
var container = messagesContainerRef.current;
|
|
1136
|
+
if (!container)
|
|
1137
|
+
return;
|
|
1138
|
+
var handleScroll = function () {
|
|
1139
|
+
var threshold = 100;
|
|
1140
|
+
var isNearBottom = container.scrollHeight - container.scrollTop - container.clientHeight < threshold;
|
|
1141
|
+
isNearBottomRef.current = isNearBottom;
|
|
1142
|
+
if (isNearBottom) {
|
|
1143
|
+
setShowNewMessages(false);
|
|
1144
|
+
}
|
|
1145
|
+
};
|
|
1146
|
+
container.addEventListener('scroll', handleScroll);
|
|
1147
|
+
return function () { return container.removeEventListener('scroll', handleScroll); };
|
|
1148
|
+
}, [store.open]);
|
|
1149
|
+
// Re-focus the chat input on desktop after a search completes.
|
|
1150
|
+
// The input is disabled while loading, which causes the browser to drop focus.
|
|
1151
|
+
// On mobile we intentionally skip this so the virtual keyboard dismisses.
|
|
1152
|
+
(0, hooks_1.useEffect)(function () {
|
|
1153
|
+
if (!store.loading && !isMobile && store.open) {
|
|
1154
|
+
controller.focusInput();
|
|
1056
1155
|
}
|
|
1057
|
-
}, [
|
|
1156
|
+
}, [store.loading]);
|
|
1058
1157
|
// const subProps: ChatSubProps = {};
|
|
1059
1158
|
var activeMessage = (_b = store.currentChat) === null || _b === void 0 ? void 0 : _b.activeMessage;
|
|
1060
1159
|
// On mobile, only auto-open the secondary panel for the first productComparison
|
|
@@ -1225,8 +1324,7 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1225
1324
|
productQuery: 'Product Information',
|
|
1226
1325
|
}[activeMessage.messageType] || null }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__header__title__secondary", children: {
|
|
1227
1326
|
inspirationResult: 'Choose a style direction to explore',
|
|
1228
|
-
productComparison: "Comparing ".concat(((_g = activeMessage === null || activeMessage === void 0 ? void 0 : activeMessage.
|
|
1229
|
-
((_h = activeMessage === null || activeMessage === void 0 ? void 0 : activeMessage.searchResults) === null || _h === void 0 ? void 0 : _h.length), " products"),
|
|
1327
|
+
productComparison: "Comparing ".concat(((_g = activeMessage === null || activeMessage === void 0 ? void 0 : activeMessage.searchResults) === null || _g === void 0 ? void 0 : _g.length) || '', " products"),
|
|
1230
1328
|
productQuery: 'Complete product details',
|
|
1231
1329
|
}[activeMessage.messageType] || null })] }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__header__buttons", children: (0, jsx_runtime_1.jsx)(Button_1.Button, { className: "ss__chat__header__button--close", icon: { icon: 'close2', title: 'Close Chat' }, onClick: function () {
|
|
1232
1330
|
var _a, _b;
|
|
@@ -1244,7 +1342,7 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1244
1342
|
} }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__content", children: (0, jsx_runtime_1.jsx)("div", { className: 'ss__chat__messages', children: {
|
|
1245
1343
|
inspirationResult: ((0, jsx_runtime_1.jsx)(ChatInspirationResultMessage_1.ChatInspirationResultMessage, { chatItem: activeMessage, controller: controller, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined })),
|
|
1246
1344
|
productComparison: ((0, jsx_runtime_1.jsx)(ChatProductComparisonMessage_1.ChatProductComparisonMessage, { chatItem: activeMessage, controller: controller })),
|
|
1247
|
-
productQuery: ((0, jsx_runtime_1.jsx)(ChatProductQueryMessage_1.ChatProductQueryMessage, { chatItem: activeMessage, controller: controller, displayFields: (
|
|
1345
|
+
productQuery: ((0, jsx_runtime_1.jsx)(ChatProductQueryMessage_1.ChatProductQueryMessage, { chatItem: activeMessage, controller: controller, displayFields: (_h = controller.config.settings) === null || _h === void 0 ? void 0 : _h.displayFields })),
|
|
1248
1346
|
}[activeMessage.messageType] || null }) })] })) : null, store.open ? ((0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__primary', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__header', children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__header__title", children: [logo ? (0, jsx_runtime_1.jsx)("img", { className: "ss__chat__header__title__logo", src: logo }) : null, (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__header__title__text", children: [title ? (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__header__title__text__primary", children: title }) : null, subtitle ? (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__header__title__text__secondary", children: subtitle }) : null] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__header__buttons", children: [(0, jsx_runtime_1.jsx)(Button_1.Button
|
|
1249
1347
|
// disabled={store.currentChat?.chat && store.currentChat.chat.length <= 1}
|
|
1250
1348
|
, {
|
|
@@ -1265,7 +1363,7 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1265
1363
|
store.currentChat.save();
|
|
1266
1364
|
}
|
|
1267
1365
|
}, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: "close-thin", size: "14px" }) }))] })) : null;
|
|
1268
|
-
})(), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__content", children: [(0, jsx_runtime_1.jsx)("div", { className: "ss__chat__content__header", children: ((
|
|
1366
|
+
})(), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__content", children: [(0, jsx_runtime_1.jsx)("div", { className: "ss__chat__content__header", children: ((_j = store.currentChat) === null || _j === void 0 ? void 0 : _j.comparisons.compared) && store.currentChat.comparisons.compared.length > 0 && ((0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__content__header__comparisons', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__content__header__comparisons__header', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__content__header__comparisons__header__title', children: [(0, jsx_runtime_1.jsx)(__1.Icon, { className: 'ss__chat__content__header__comparisons__header__title__icon', icon: 'clipboard' }), (0, jsx_runtime_1.jsxs)("span", { className: 'ss__chat__content__header__comparisons__header__title__text', children: ["Compare Products (", (_k = store.currentChat) === null || _k === void 0 ? void 0 : _k.comparisons.compared.length, "/", (_l = store.currentChat) === null || _l === void 0 ? void 0 : _l.comparisons.maxItems, ")"] })] }), (0, jsx_runtime_1.jsx)("div", { className: 'ss__chat__content__header__comparisons__header__actions', children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: function () { var _a; return (_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.comparisons.reset(); }, children: "clear" }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__content__header__comparisons__content', children: [(0, jsx_runtime_1.jsx)("div", { className: 'ss__chat__content__header__comparisons__content__items', children: Array.from({ length: (_m = store.currentChat) === null || _m === void 0 ? void 0 : _m.comparisons.maxItems }).map(function (_, index) {
|
|
1269
1367
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
1270
1368
|
var comparisonItem = (_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.comparisons.compared[index];
|
|
1271
1369
|
return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat__content__header__comparisons__content__comparison', {
|
|
@@ -1283,14 +1381,14 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1283
1381
|
(_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.comparisons.remove(comparisonItem.result.id);
|
|
1284
1382
|
}, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: 'close-thin', size: '12px' }) })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: 'plus-thin' }), (0, jsx_runtime_1.jsx)("div", { className: 'ss__chat__content__header__comparisons__content__comparison--placeholder__text', children: "Add" })] })) }, index));
|
|
1285
1383
|
}) }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat__content__header__comparisons__action', {
|
|
1286
|
-
'ss__chat__content__header__comparisons__action--hidden': (((
|
|
1287
|
-
}), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: function () { return controller.search(); }, icon: { icon: 'compare', title: 'Compare' }, children: "Compare" }) })] })] })) }), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__messages', ref: messagesContainerRef, children: [(!((
|
|
1384
|
+
'ss__chat__content__header__comparisons__action--hidden': (((_o = store.currentChat) === null || _o === void 0 ? void 0 : _o.comparisons.compared.length) || 0) < 2,
|
|
1385
|
+
}), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: function () { return controller.search(); }, icon: { icon: 'compare', title: 'Compare' }, children: "Compare" }) })] })] })) }), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__messages', ref: messagesContainerRef, style: visibleChatLength ? { overflowY: 'auto', scrollbarGutter: 'stable' } : undefined, children: [(!((_p = store.currentChat) === null || _p === void 0 ? void 0 : _p.chat) || store.currentChat.chat.length === 0) && store.welcomeMessage && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__welcome", children: [(0, jsx_runtime_1.jsx)("div", { className: "ss__chat__welcome__message", children: store.welcomeMessage }), (0, jsx_runtime_1.jsx)(SuggestedQuestions_1.SuggestedQuestions, { questions: store.suggestedQuestions, controller: controller })] })), (_q = store.currentChat) === null || _q === void 0 ? void 0 : _q.chat.filter(function (chatItem) { return chatItem.messageType !== 'productQuery'; }).map(function (chatItem, index) { return ((0, jsx_runtime_1.jsx)("div", { className: "ss__chat__message ss__chat__message--".concat(chatItem.messageType), children: {
|
|
1288
1386
|
user: ((0, jsx_runtime_1.jsx)(MessageUser_1.MessageUser, { chatItem: chatItem, controller: controller, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined })),
|
|
1289
|
-
text: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1290
|
-
content: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1291
|
-
productSearchResult: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1292
|
-
inspirationResult: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1293
|
-
productAnswer: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1387
|
+
text: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1388
|
+
content: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1389
|
+
productSearchResult: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1390
|
+
inspirationResult: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1391
|
+
productAnswer: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1294
1392
|
productComparison: (function () {
|
|
1295
1393
|
var _a;
|
|
1296
1394
|
// On mobile, only the first productComparison in the session
|
|
@@ -1298,21 +1396,26 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1298
1396
|
// prominent "Show Details" button instead.
|
|
1299
1397
|
var comparisonMessages = (((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.chat) || []).filter(function (m) { return m.messageType === 'productComparison'; });
|
|
1300
1398
|
var isFirst = comparisonMessages.length > 0 && comparisonMessages[0].id === chatItem.id;
|
|
1301
|
-
return ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1399
|
+
return ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, showDetailsButton: isMobile && !isFirst, sideChatOpen: !!shouldShowSideChat }));
|
|
1302
1400
|
})(),
|
|
1303
|
-
productRecommendation: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1401
|
+
productRecommendation: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, onViewProduct: isMobile ? function () { return setMobileProductInfoOpen(true); } : undefined, sideChatOpen: !!shouldShowSideChat })),
|
|
1304
1402
|
actions: (0, jsx_runtime_1.jsx)(SuggestedQuestions_1.SuggestedQuestions, { actions: chatItem.actions, controller: controller }),
|
|
1305
|
-
errorResponse: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1306
|
-
topicDrift: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom:
|
|
1403
|
+
errorResponse: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, sideChatOpen: !!shouldShowSideChat })),
|
|
1404
|
+
topicDrift: ((0, jsx_runtime_1.jsx)(MessageText_1.MessageText, { chatItem: chatItem, controller: controller, scrollToBottom: scrollToBottomIfNear, sideChatOpen: !!shouldShowSideChat })),
|
|
1307
1405
|
productQuery: null,
|
|
1308
|
-
}[chatItem.messageType] || null }, index)); }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__messages__end", ref: messagesEndRef })
|
|
1406
|
+
}[chatItem.messageType] || null }, index)); }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__messages__end", ref: messagesEndRef }), showNewMessages && ((0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__new-messages", onClick: function () {
|
|
1407
|
+
scrollToBottom();
|
|
1408
|
+
setShowNewMessages(false);
|
|
1409
|
+
}, children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: "angle-down", size: "12px" }), (0, jsx_runtime_1.jsx)("span", { children: "New messages" })] }))] }), (0, jsx_runtime_1.jsx)(ChatLoadingIndicator_1.ChatLoadingIndicator, { loading: store.loading, verbs: loadingVerbs }), !((_r = store.currentChat) === null || _r === void 0 ? void 0 : _r.isExpired) ? ((0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__content__footer", ref: footerRef, children: [store.error && (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__error", children: store.error.message }), ((_s = store.currentChat) === null || _s === void 0 ? void 0 : _s.sessionLimitReached) && ((0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__topic-drift', children: [(0, jsx_runtime_1.jsx)(__1.Icon, { icon: "info", size: "18px", className: 'ss__chat__topic-drift__icon--info' }), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__topic-drift__text', children: [(0, jsx_runtime_1.jsx)("span", { children: "Session limit reached" }), (0, jsx_runtime_1.jsx)("span", { children: "This chat has reached its maximum number of interactions. Start a new session to continue." })] }), (0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__topic-drift__button', onClick: function () {
|
|
1309
1410
|
controller.store.createChat();
|
|
1310
|
-
}, children: "New Session" })] })), ((
|
|
1411
|
+
}, children: "New Session" })] })), ((_t = store.currentChat) === null || _t === void 0 ? void 0 : _t.actions) && store.currentChat.actions.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: 'ss__chat__actions', children: (_u = store.currentChat) === null || _u === void 0 ? void 0 : _u.actions.map(function (action, index) {
|
|
1311
1412
|
var _a;
|
|
1312
1413
|
return ((0, jsx_runtime_1.jsx)("div", { className: "ss__chat__actions__wrap", children: {
|
|
1313
|
-
facets: action.data.length ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__actions__facets-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ss__chat__actions--title", children: "Filter by:" }), multiselectFacets && (((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.attachments.attached.some(function (item) { return item.type === 'facet'; }))
|
|
1414
|
+
facets: action.data.length ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__actions__facets-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ss__chat__actions--title", children: "Filter by:" }), multiselectFacets && ((0, jsx_runtime_1.jsx)("div", { className: "ss__chat__actions__facets-apply".concat(((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.attachments.attached.some(function (item) { return item.type === 'facet'; }))
|
|
1415
|
+
? ' ss__chat__actions__facets-apply--active'
|
|
1416
|
+
: ''), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: function () {
|
|
1314
1417
|
controller.search();
|
|
1315
|
-
}, children: "Apply
|
|
1418
|
+
}, children: "Apply" }) }))] }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__actions--facets", children: action.data.slice(0, 10).map(function (facet, idx) {
|
|
1316
1419
|
var _a;
|
|
1317
1420
|
if (!((_a = facet.values) === null || _a === void 0 ? void 0 : _a.length))
|
|
1318
1421
|
return null;
|
|
@@ -1558,12 +1661,13 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1558
1661
|
var messageText = (_b = store.currentChat) === null || _b === void 0 ? void 0 : _b.handleTopicDrift();
|
|
1559
1662
|
if (messageText) {
|
|
1560
1663
|
controller.store.createChat();
|
|
1664
|
+
controller.search({ data: { message: messageText } });
|
|
1561
1665
|
}
|
|
1562
1666
|
}, children: buttonText })), (0, jsx_runtime_1.jsx)("span", { onClick: function () {
|
|
1563
1667
|
var _a;
|
|
1564
1668
|
(_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.dismissTopicDrift();
|
|
1565
1669
|
}, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: "close-thin", size: "14px", className: 'ss__chat__topic-drift__icon--close' }) })] }));
|
|
1566
|
-
})(), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__input', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__input__input', children: [(0, jsx_runtime_1.jsx)("input", { type: "text", name: "ss-chat-input", disabled: store.loading || store.blocked || ((
|
|
1670
|
+
})(), (0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__input', children: [(0, jsx_runtime_1.jsxs)("div", { className: 'ss__chat__input__input', children: [(0, jsx_runtime_1.jsx)("input", { type: "text", name: "ss-chat-input", disabled: store.loading || store.blocked || ((_v = store.currentChat) === null || _v === void 0 ? void 0 : _v.sessionLimitReached), placeholder: (function () {
|
|
1567
1671
|
var _a, _b, _c;
|
|
1568
1672
|
var comparedCount = ((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.comparisons.compared.length) || 0;
|
|
1569
1673
|
var committedCount = ((_b = store.currentChat) === null || _b === void 0 ? void 0 : _b.comparisons.committed.length) || 0;
|
|
@@ -1591,7 +1695,7 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1591
1695
|
if (e.keyCode === 13 && isMobile && mobileProductInfoOpen) {
|
|
1592
1696
|
setMobileProductInfoOpen(false);
|
|
1593
1697
|
}
|
|
1594
|
-
}, value: controller.store.inputValue }), store.features.imageSearch.enabled && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__upload-button', disabled: store.loading || store.blocked || ((
|
|
1698
|
+
}, value: controller.store.inputValue }), store.features.imageSearch.enabled && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__upload-button', disabled: store.loading || store.blocked || ((_w = store.currentChat) === null || _w === void 0 ? void 0 : _w.sessionLimitReached), onClick: function () { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, icon: { icon: 'image', title: 'Upload Image' } }), (0, jsx_runtime_1.jsx)("input", { ref: fileInputRef, onChange: function (e) { return __awaiter(void 0, void 0, void 0, function () {
|
|
1595
1699
|
return __generator(this, function (_a) {
|
|
1596
1700
|
switch (_a.label) {
|
|
1597
1701
|
case 0: return [4 /*yield*/, controller.upload(e.target.files)];
|
|
@@ -1606,7 +1710,7 @@ exports.Chat = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
1606
1710
|
var _a, _b;
|
|
1607
1711
|
var hasImageAttachment = (((_a = store.currentChat) === null || _a === void 0 ? void 0 : _a.attachments.attached) || []).some(function (item) { return item.type === 'image' && !item.error; });
|
|
1608
1712
|
var messageEmpty = !controller.store.inputValue.trim();
|
|
1609
|
-
var sendDisabled = store.blocked || ((_b = store.currentChat) === null || _b === void 0 ? void 0 : _b.sessionLimitReached) || (hasImageAttachment && messageEmpty);
|
|
1713
|
+
var sendDisabled = store.blocked || ((_b = store.currentChat) === null || _b === void 0 ? void 0 : _b.sessionLimitReached) || (hasImageAttachment && messageEmpty) || messageEmpty;
|
|
1610
1714
|
return ((0, jsx_runtime_1.jsx)(Button_1.Button, { className: "ss__chat__send-button", icon: { icon: 'send', title: 'Send Message' }, disabled: sendDisabled, onClick: function () {
|
|
1611
1715
|
if (sendDisabled)
|
|
1612
1716
|
return;
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { ChatController } from '@athoscommerce/snap-controller';
|
|
2
2
|
import { Product } from '@athoscommerce/snap-store-mobx';
|
|
3
3
|
import { ComponentProps } from '../../../types';
|
|
4
|
-
export declare const ChatResult: (
|
|
5
|
-
displayName: string;
|
|
6
|
-
};
|
|
4
|
+
export declare const ChatResult: (props: ChatResultProps) => import("@emotion/react/jsx-runtime").JSX.Element;
|
|
7
5
|
export interface ChatResultProps extends ComponentProps {
|
|
8
6
|
result: Product;
|
|
9
7
|
controller: ChatController;
|
|
10
8
|
scrollToBottom: () => void;
|
|
9
|
+
trackingRef?: (el: HTMLElement | null) => void;
|
|
11
10
|
}
|
|
12
11
|
//# sourceMappingURL=ChatResult.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatResult.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/ChatResult.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAMzD,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAyG7D,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"ChatResult.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/ChatResult.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,gCAAgC,CAAC;AAMzD,OAAO,EAAE,cAAc,EAAe,MAAM,gBAAgB,CAAC;AAyG7D,eAAO,MAAM,UAAU,8EA+GtB,CAAC;AAMF,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACtD,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,cAAc,CAAC;IAC3B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;CAC/C"}
|
|
@@ -114,8 +114,8 @@ var defaultStyles = function () {
|
|
|
114
114
|
},
|
|
115
115
|
});
|
|
116
116
|
};
|
|
117
|
-
exports.ChatResult = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
118
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
117
|
+
exports.ChatResult = (0, providers_1.withTracking)((0, mobx_react_lite_1.observer)(function (properties) {
|
|
118
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
119
119
|
var globalTheme = (0, providers_1.useTheme)();
|
|
120
120
|
var globalTreePath = (0, providers_1.useTreePath)();
|
|
121
121
|
var snap = (0, providers_1.useSnap)();
|
|
@@ -123,7 +123,7 @@ exports.ChatResult = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
123
123
|
treePath: globalTreePath,
|
|
124
124
|
};
|
|
125
125
|
var props = (0, utilities_1.mergeProps)('chatResult', globalTheme, defaultProps, properties);
|
|
126
|
-
var controller = props.controller, result = props.result, scrollToBottom = props.scrollToBottom, customComponent = props.customComponent;
|
|
126
|
+
var controller = props.controller, result = props.result, scrollToBottom = props.scrollToBottom, customComponent = props.customComponent, trackingRef = props.trackingRef;
|
|
127
127
|
if (customComponent) {
|
|
128
128
|
var ComponentOverride = (0, hooks_1.useComponent)(((_a = snap === null || snap === void 0 ? void 0 : snap.templates) === null || _a === void 0 ? void 0 : _a.library.import.component.result) || {}, customComponent);
|
|
129
129
|
if (ComponentOverride) {
|
|
@@ -131,6 +131,9 @@ exports.ChatResult = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
131
131
|
}
|
|
132
132
|
}
|
|
133
133
|
var isInComparison = (_b = controller.store.currentChat) === null || _b === void 0 ? void 0 : _b.comparisons.items.some(function (item) { var _a; return ((_a = item.result) === null || _a === void 0 ? void 0 : _a.id) === result.id; });
|
|
134
|
+
// a result is "configurable" when it ships with selectable variant options
|
|
135
|
+
// (e.g. color/size); those need a selection before they can be added to cart
|
|
136
|
+
var isConfigurable = !!((_c = result.variants) === null || _c === void 0 ? void 0 : _c.optionConfig) && Object.keys(result.variants.optionConfig).length > 0;
|
|
134
137
|
var subProps = {
|
|
135
138
|
button: {
|
|
136
139
|
// component theme overrides
|
|
@@ -146,13 +149,20 @@ exports.ChatResult = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
146
149
|
},
|
|
147
150
|
};
|
|
148
151
|
var styling = (0, utilities_1.mergeStyles)(properties, defaultStyles);
|
|
149
|
-
return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "ss__chat__result" }, styling, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__image", children: [(0, jsx_runtime_1.jsx)(__1.OverlayBadge, { controller: controller, result: result, renderEmpty: true, children: (0, jsx_runtime_1.jsx)(Image_1.Image, __assign({ className: 'ss__chat__result__detail-slot__image', alt: ((
|
|
152
|
+
return ((0, jsx_runtime_1.jsxs)("div", __assign({ className: "ss__chat__result", ref: trackingRef }, styling, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__image", children: [(0, jsx_runtime_1.jsx)(__1.OverlayBadge, { controller: controller, result: result, renderEmpty: true, children: (0, jsx_runtime_1.jsx)(Image_1.Image, __assign({ className: 'ss__chat__result__detail-slot__image', alt: ((_d = result.display.mappings.core) === null || _d === void 0 ? void 0 : _d.name) || '', src: ((_e = result.display.mappings.core) === null || _e === void 0 ? void 0 : _e.imageUrl) || '' }, subProps.image)) }), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__image__buttons", children: [controller.store.features.similarProducts.enabled && ((0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__result__image__buttons__similar', content: 'Similar', onClick: function () {
|
|
150
153
|
controller.discussProduct(result, { requestType: 'productSimilar' });
|
|
151
154
|
} })), (0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__result__image__buttons__compare', content: isInComparison ? undefined : 'Compare', icon: isInComparison ? { icon: 'check-thin', title: 'Added to comparison' } : undefined, onClick: function () {
|
|
152
155
|
controller.compareProduct(result);
|
|
153
156
|
} })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__image__icons", children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__result__image__icons__icon--inquire', icon: { icon: 'chat', title: 'Discuss Product' }, onClick: function () {
|
|
154
157
|
controller.discussProduct(result, { requestType: 'productQuery' });
|
|
155
|
-
} }), (0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__result__image__icons__icon--cart', icon: { icon: 'cart', title: 'Add to Cart' }, onClick: function () {
|
|
158
|
+
} }), (0, jsx_runtime_1.jsx)(Button_1.Button, { className: 'ss__chat__result__image__icons__icon--cart', icon: { icon: 'cart', title: isConfigurable ? 'Configure' : 'Add to Cart' }, onClick: function () {
|
|
159
|
+
// configurable products need a variant selection — open the product
|
|
160
|
+
// information panel so the user can pick options before adding to cart
|
|
161
|
+
if (isConfigurable) {
|
|
162
|
+
controller.viewProduct(result);
|
|
163
|
+
return;
|
|
164
|
+
}
|
|
165
|
+
controller.track.product.addToCart(result);
|
|
156
166
|
controller.addToCart(result);
|
|
157
|
-
} })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__content", children: [((
|
|
158
|
-
});
|
|
167
|
+
} })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ss__chat__result__content", children: [((_f = result.display.mappings.core) === null || _f === void 0 ? void 0 : _f.name) && ((0, jsx_runtime_1.jsx)("div", { className: "ss__chat__result__content__title--primary", children: (_g = result.display.mappings.core) === null || _g === void 0 ? void 0 : _g.name })), ((_h = result.display.mappings.core) === null || _h === void 0 ? void 0 : _h.price) && ((0, jsx_runtime_1.jsx)("div", { className: "ss__chat__result__content__price", children: (0, jsx_runtime_1.jsx)(__1.Price, { value: (_j = result.display.mappings.core) === null || _j === void 0 ? void 0 : _j.price }) })), (0, jsx_runtime_1.jsx)(__1.CalloutBadge, { controller: controller, result: result })] })] })));
|
|
168
|
+
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MessageUser.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/MessageUser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;
|
|
1
|
+
{"version":3,"file":"MessageUser.d.ts","sourceRoot":"","sources":["../../../../../../../components/src/components/Organisms/Chat/MessageUser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAwIhE,eAAO,MAAM,WAAW,WAAoB,gBAAgB;;CA6F1D,CAAC;AAEH,UAAU,gBAAgB;IACzB,QAAQ,EAAE,GAAG,CAAC;IACd,UAAU,EAAE,cAAc,CAAC;IAC3B,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;CACvC"}
|