@athoscommerce/snap-preact 1.5.1-beta.110 → 1.5.1-beta.112
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/ChatProductQueryMessage/ChatProductQueryMessage.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.js +25 -10
- package/dist/cjs/components/src/components/Organisms/Chat/Chat.d.ts.map +1 -1
- package/dist/cjs/components/src/components/Organisms/Chat/Chat.js +13 -18
- package/dist/esm/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.d.ts.map +1 -1
- package/dist/esm/components/src/components/Molecules/ChatProductQueryMessage/ChatProductQueryMessage.js +25 -10
- package/dist/esm/components/src/components/Organisms/Chat/Chat.d.ts.map +1 -1
- package/dist/esm/components/src/components/Organisms/Chat/Chat.js +12 -17
- package/package.json +12 -12
|
@@ -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;
|
|
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;AA2crE,eAAO,MAAM,uBAAuB,gBAAyB,4BAA4B;;CAiQvF,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;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC1B,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"}
|
|
@@ -33,7 +33,7 @@ var defaultStyles = function (_a) {
|
|
|
33
33
|
flexDirection: 'column',
|
|
34
34
|
gap: '1em',
|
|
35
35
|
'.ss__chat-product-query-message__header': {
|
|
36
|
-
background: new utilities_1.Colour(colorPrimary).lightenHex(0.
|
|
36
|
+
background: new utilities_1.Colour(colorPrimary).lightenHex(0.05),
|
|
37
37
|
padding: '1em',
|
|
38
38
|
display: 'flex',
|
|
39
39
|
flexDirection: 'column',
|
|
@@ -110,7 +110,7 @@ var defaultStyles = function (_a) {
|
|
|
110
110
|
'.ss__chat-product-query-message__header__product__actions': {
|
|
111
111
|
display: 'flex',
|
|
112
112
|
flexDirection: 'column',
|
|
113
|
-
alignItems: '
|
|
113
|
+
alignItems: 'stretch',
|
|
114
114
|
alignSelf: 'stretch',
|
|
115
115
|
justifyContent: 'center',
|
|
116
116
|
gap: '0.35em',
|
|
@@ -128,6 +128,7 @@ var defaultStyles = function (_a) {
|
|
|
128
128
|
},
|
|
129
129
|
},
|
|
130
130
|
'.ss__chat-product-query-message__header__product__actions__add-to-cart .ss__button': {
|
|
131
|
+
flexDirection: 'row-reverse',
|
|
131
132
|
borderRadius: '0.5em',
|
|
132
133
|
padding: '0.4em 0.75em',
|
|
133
134
|
fontWeight: 'bold',
|
|
@@ -135,22 +136,36 @@ var defaultStyles = function (_a) {
|
|
|
135
136
|
whiteSpace: 'nowrap',
|
|
136
137
|
cursor: 'pointer',
|
|
137
138
|
fontSize: '0.8em',
|
|
138
|
-
background: '#
|
|
139
|
-
color: '#
|
|
139
|
+
background: '#feeeae',
|
|
140
|
+
color: '#000',
|
|
141
|
+
justifyContent: 'center',
|
|
142
|
+
width: '100%',
|
|
143
|
+
textAlign: 'center',
|
|
144
|
+
svg: {
|
|
145
|
+
fill: '#000',
|
|
146
|
+
stroke: '#000',
|
|
147
|
+
},
|
|
140
148
|
'&:not(.ss__button--disabled):hover': {
|
|
141
|
-
background: '#
|
|
149
|
+
background: '#fde68a',
|
|
142
150
|
},
|
|
143
151
|
},
|
|
144
|
-
// Visual styles for the Show similar / Discuss product buttons live in the
|
|
145
|
-
// Chat component so the chat-level theme drives them. Only layout-related
|
|
146
|
-
// rules remain here.
|
|
147
152
|
'.ss__chat-product-query-message__header__product__actions__show-similar .ss__button, .ss__chat-product-query-message__header__product__actions__discuss-product .ss__button': {
|
|
153
|
+
flexDirection: 'row-reverse',
|
|
148
154
|
borderRadius: '0.5em',
|
|
149
155
|
padding: '0.4em 0.75em',
|
|
150
156
|
fontWeight: 'bold',
|
|
151
157
|
whiteSpace: 'nowrap',
|
|
152
158
|
cursor: 'pointer',
|
|
153
159
|
fontSize: '0.8em',
|
|
160
|
+
background: '#000',
|
|
161
|
+
color: '#fff',
|
|
162
|
+
justifyContent: 'center',
|
|
163
|
+
width: '100%',
|
|
164
|
+
textAlign: 'center',
|
|
165
|
+
svg: {
|
|
166
|
+
fill: '#fff',
|
|
167
|
+
stroke: '#fff',
|
|
168
|
+
},
|
|
154
169
|
},
|
|
155
170
|
},
|
|
156
171
|
},
|
|
@@ -456,10 +471,10 @@ exports.ChatProductQueryMessage = (0, mobx_react_lite_1.observer)(function (prop
|
|
|
456
471
|
(_a = controller === null || controller === void 0 ? void 0 : controller.store.currentChat) === null || _a === void 0 ? void 0 : _a.popProductQueryMessage(chatItem.sourceMessageId);
|
|
457
472
|
controller === null || controller === void 0 ? void 0 : controller.store.clearProductQuickview();
|
|
458
473
|
};
|
|
459
|
-
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)("button", { type: "button", className: (0, classnames_1.default)('ss__chat-product-query-message__header__back'), "aria-label": "Back to inspiration", 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 || displayedCore.parentImageUrl) && ((0, jsx_runtime_1.jsx)(Image_1.Image, { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__image'), src: (displayedCore.imageUrl || displayedCore.parentImageUrl), 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.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__price'), children: [displayedCore.msrp != null && Number(displayedCore.msrp) > Number(displayedCore.price) && ((0, jsx_runtime_1.jsx)(__1.Price, { value: displayedCore.msrp, lineThrough: true })), (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 () {
|
|
474
|
+
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)("button", { type: "button", className: (0, classnames_1.default)('ss__chat-product-query-message__header__back'), "aria-label": "Back to inspiration", 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 || displayedCore.parentImageUrl) && ((0, jsx_runtime_1.jsx)(Image_1.Image, { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__image'), src: (displayedCore.imageUrl || displayedCore.parentImageUrl), 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.jsxs)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__details__price'), children: [displayedCore.msrp != null && Number(displayedCore.msrp) > Number(displayedCore.price) && ((0, jsx_runtime_1.jsx)(__1.Price, { value: displayedCore.msrp, lineThrough: true })), (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, { icon: "cart", content: 'Add to Cart', onClick: function () {
|
|
460
475
|
controller === null || controller === void 0 ? void 0 : controller.track.product.addToCart(product);
|
|
461
476
|
controller === null || controller === void 0 ? void 0 : controller.addToCart(product);
|
|
462
|
-
} }) }), (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.productSimilar(sourceProduct); } }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__discuss-product'), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { content: 'Discuss Product', onClick: function () { return controller === null || controller === void 0 ? void 0 : controller.productQuery(sourceProduct); } }) })] })] })] }), selections.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__variants'), role: "group", "aria-label": "Variant selection", 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'), id: "ss__chat-pq-variant-".concat(selection.field), 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'), role: "radiogroup", "aria-labelledby": "ss__chat-pq-variant-".concat(selection.field), children: selection.values.map(function (selectionValue) {
|
|
477
|
+
} }) }), (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, { icon: "search-thin", content: 'Show Similar', onClick: function () { return controller === null || controller === void 0 ? void 0 : controller.productSimilar(sourceProduct); } }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__header__product__actions__discuss-product'), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { icon: "chat", content: 'Discuss Product', onClick: function () { return controller === null || controller === void 0 ? void 0 : controller.productQuery(sourceProduct); } }) })] })] })] }), selections.length > 0 && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ss__chat-product-query-message__variants'), role: "group", "aria-label": "Variant selection", 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'), id: "ss__chat-pq-variant-".concat(selection.field), 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'), role: "radiogroup", "aria-labelledby": "ss__chat-pq-variant-".concat(selection.field), children: selection.values.map(function (selectionValue) {
|
|
463
478
|
var _a;
|
|
464
479
|
var isUnavailable = !selectionValue.available;
|
|
465
480
|
var isSelected = ((_a = selection.selected) === null || _a === void 0 ? void 0 : _a.value) === selectionValue.value;
|
|
@@ -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;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA6BrE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,GAAG,CAAC,OAAO;;
|
|
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;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA6BrE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,GAAG,CAAC,OAAO;;CAw5C/E,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,EAAE,cAAc,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,uBAAuB,GAAG;IACrC,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;IAC5B,+BAA+B,CAAC,EAAE,OAAO,CAAC;IAC1C,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF,MAAM,WAAW,QAAQ;CAExB"}
|
|
@@ -299,7 +299,7 @@ exports.ChatOrganism = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
299
299
|
})() }), (0, jsx_runtime_1.jsx)("div", { className: "ss__chat__history__chat__button__date", children: chat.createdAt.toLocaleString() })] }) }, chat.id)); }) })) : null] })); };
|
|
300
300
|
var FacetButton = function (props) { return (0, jsx_runtime_1.jsx)(Button_1.Button, { icon: props.open ? 'angle-down' : 'angle-up', children: props.label }); };
|
|
301
301
|
var getFacetButtonLabel = function (facet) {
|
|
302
|
-
var _a, _b
|
|
302
|
+
var _a, _b;
|
|
303
303
|
var base = facet.label || facet.field;
|
|
304
304
|
// Slider facets show the active low-high range in the button when narrowed.
|
|
305
305
|
if (facet.type === 'range') {
|
|
@@ -311,24 +311,19 @@ exports.ChatOrganism = (0, mobx_react_lite_1.observer)(function (properties) {
|
|
|
311
311
|
}
|
|
312
312
|
return base;
|
|
313
313
|
}
|
|
314
|
-
|
|
315
|
-
//
|
|
316
|
-
|
|
314
|
+
// Count current selections from the urlManager (source of truth for live state).
|
|
315
|
+
// `value.filtered` reflects the server's snapshot at response time and goes stale
|
|
316
|
+
// once the user deselects locally.
|
|
317
|
+
var applied = (facet.values || []).filter(function (value) {
|
|
317
318
|
var _a, _b;
|
|
318
|
-
if (value
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
});
|
|
327
|
-
// Count pending facet attachments (newly selected, not yet sent)
|
|
328
|
-
(((_c = controller.store.currentChat) === null || _c === void 0 ? void 0 : _c.attachments.items) || [])
|
|
329
|
-
.filter(function (item) { return item.type === 'facet' && item.key === facet.field && (item.state === 'active' || item.state === 'attached'); })
|
|
330
|
-
.forEach(function (item) { return applied.add(item.value); });
|
|
331
|
-
return applied.size > 0 ? "".concat(base, " (").concat(applied.size, ")") : base;
|
|
319
|
+
if (!value)
|
|
320
|
+
return false;
|
|
321
|
+
var optionValue = 'low' in value && 'high' in value
|
|
322
|
+
? "".concat((_a = value.low) !== null && _a !== void 0 ? _a : '*', ":").concat((_b = value.high) !== null && _b !== void 0 ? _b : '*')
|
|
323
|
+
: value.value || value.label;
|
|
324
|
+
return controller.store.isFacetSelected(facet.field, optionValue);
|
|
325
|
+
}).length;
|
|
326
|
+
return applied > 0 ? "".concat(base, " (").concat(applied, ")") : base;
|
|
332
327
|
};
|
|
333
328
|
// Slider dropdown grows to fill the remaining chat width from its anchor,
|
|
334
329
|
// so the price range slider isn't cramped inside a 150px-wide dropdown.
|
|
@@ -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;
|
|
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;AA2crE,eAAO,MAAM,uBAAuB,gBAAyB,4BAA4B;;CAiQvF,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;IAC5C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC1B,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"}
|
|
@@ -15,7 +15,7 @@ const defaultStyles = ({ primaryColor, primaryColorText }) => {
|
|
|
15
15
|
flexDirection: 'column',
|
|
16
16
|
gap: '1em',
|
|
17
17
|
'.ss__chat-product-query-message__header': {
|
|
18
|
-
background: new Colour(colorPrimary).lightenHex(0.
|
|
18
|
+
background: new Colour(colorPrimary).lightenHex(0.05),
|
|
19
19
|
padding: '1em',
|
|
20
20
|
display: 'flex',
|
|
21
21
|
flexDirection: 'column',
|
|
@@ -92,7 +92,7 @@ const defaultStyles = ({ primaryColor, primaryColorText }) => {
|
|
|
92
92
|
'.ss__chat-product-query-message__header__product__actions': {
|
|
93
93
|
display: 'flex',
|
|
94
94
|
flexDirection: 'column',
|
|
95
|
-
alignItems: '
|
|
95
|
+
alignItems: 'stretch',
|
|
96
96
|
alignSelf: 'stretch',
|
|
97
97
|
justifyContent: 'center',
|
|
98
98
|
gap: '0.35em',
|
|
@@ -110,6 +110,7 @@ const defaultStyles = ({ primaryColor, primaryColorText }) => {
|
|
|
110
110
|
},
|
|
111
111
|
},
|
|
112
112
|
'.ss__chat-product-query-message__header__product__actions__add-to-cart .ss__button': {
|
|
113
|
+
flexDirection: 'row-reverse',
|
|
113
114
|
borderRadius: '0.5em',
|
|
114
115
|
padding: '0.4em 0.75em',
|
|
115
116
|
fontWeight: 'bold',
|
|
@@ -117,22 +118,36 @@ const defaultStyles = ({ primaryColor, primaryColorText }) => {
|
|
|
117
118
|
whiteSpace: 'nowrap',
|
|
118
119
|
cursor: 'pointer',
|
|
119
120
|
fontSize: '0.8em',
|
|
120
|
-
background: '#
|
|
121
|
-
color: '#
|
|
121
|
+
background: '#feeeae',
|
|
122
|
+
color: '#000',
|
|
123
|
+
justifyContent: 'center',
|
|
124
|
+
width: '100%',
|
|
125
|
+
textAlign: 'center',
|
|
126
|
+
svg: {
|
|
127
|
+
fill: '#000',
|
|
128
|
+
stroke: '#000',
|
|
129
|
+
},
|
|
122
130
|
'&:not(.ss__button--disabled):hover': {
|
|
123
|
-
background: '#
|
|
131
|
+
background: '#fde68a',
|
|
124
132
|
},
|
|
125
133
|
},
|
|
126
|
-
// Visual styles for the Show similar / Discuss product buttons live in the
|
|
127
|
-
// Chat component so the chat-level theme drives them. Only layout-related
|
|
128
|
-
// rules remain here.
|
|
129
134
|
'.ss__chat-product-query-message__header__product__actions__show-similar .ss__button, .ss__chat-product-query-message__header__product__actions__discuss-product .ss__button': {
|
|
135
|
+
flexDirection: 'row-reverse',
|
|
130
136
|
borderRadius: '0.5em',
|
|
131
137
|
padding: '0.4em 0.75em',
|
|
132
138
|
fontWeight: 'bold',
|
|
133
139
|
whiteSpace: 'nowrap',
|
|
134
140
|
cursor: 'pointer',
|
|
135
141
|
fontSize: '0.8em',
|
|
142
|
+
background: '#000',
|
|
143
|
+
color: '#fff',
|
|
144
|
+
justifyContent: 'center',
|
|
145
|
+
width: '100%',
|
|
146
|
+
textAlign: 'center',
|
|
147
|
+
svg: {
|
|
148
|
+
fill: '#fff',
|
|
149
|
+
stroke: '#fff',
|
|
150
|
+
},
|
|
136
151
|
},
|
|
137
152
|
},
|
|
138
153
|
},
|
|
@@ -432,10 +447,10 @@ export const ChatProductQueryMessage = observer((properties) => {
|
|
|
432
447
|
controller?.store.currentChat?.popProductQueryMessage(chatItem.sourceMessageId);
|
|
433
448
|
controller?.store.clearProductQuickview();
|
|
434
449
|
};
|
|
435
|
-
return (_jsx(CacheProvider, { children: _jsxs("div", { className: classnames('ss__chat-product-query-message', className, internalClassName), ...styling, children: [_jsxs("div", { className: classnames('ss__chat-product-query-message__header'), children: [cameFromInspiration && (_jsxs("button", { type: "button", className: classnames('ss__chat-product-query-message__header__back'), "aria-label": "Back to inspiration", onClick: handleBack, children: [_jsx(Icon, { icon: "angle-left", size: "14px" }), _jsx("span", { children: "Back to inspiration" })] })), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product'), children: [(displayedCore.imageUrl || displayedCore.parentImageUrl) && (_jsx(Image, { className: classnames('ss__chat-product-query-message__header__product__image'), src: (displayedCore.imageUrl || displayedCore.parentImageUrl), alt: displayedCore.name || '' })), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__details'), children: [displayedCore.name && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__details__name'), children: displayedCore.url ? (_jsx("a", { href: displayedCore.url, onClick: (e) => controller?.track.product.click(e, product), target: "_blank", rel: "noopener noreferrer", children: displayedCore.name })) : (displayedCore.name) })), displayedCore.brand && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__details__brand'), children: displayedCore.brand })), displayedCore.price != null && (_jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__details__price'), children: [displayedCore.msrp != null && Number(displayedCore.msrp) > Number(displayedCore.price) && (_jsx(Price, { value: displayedCore.msrp, lineThrough: true })), _jsx(Price, { value: displayedCore.price })] }))] }), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__actions'), children: [displayedCore.url && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__go-to-product'), children: _jsx("a", { href: displayedCore.url, onClick: (e) => controller?.track.product.click(e, product), target: "_blank", rel: "noopener noreferrer", children: "Go to product" }) })), _jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__add-to-cart'), children: _jsx(Button, { content: 'Add to Cart', onClick: () => {
|
|
450
|
+
return (_jsx(CacheProvider, { children: _jsxs("div", { className: classnames('ss__chat-product-query-message', className, internalClassName), ...styling, children: [_jsxs("div", { className: classnames('ss__chat-product-query-message__header'), children: [cameFromInspiration && (_jsxs("button", { type: "button", className: classnames('ss__chat-product-query-message__header__back'), "aria-label": "Back to inspiration", onClick: handleBack, children: [_jsx(Icon, { icon: "angle-left", size: "14px" }), _jsx("span", { children: "Back to inspiration" })] })), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product'), children: [(displayedCore.imageUrl || displayedCore.parentImageUrl) && (_jsx(Image, { className: classnames('ss__chat-product-query-message__header__product__image'), src: (displayedCore.imageUrl || displayedCore.parentImageUrl), alt: displayedCore.name || '' })), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__details'), children: [displayedCore.name && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__details__name'), children: displayedCore.url ? (_jsx("a", { href: displayedCore.url, onClick: (e) => controller?.track.product.click(e, product), target: "_blank", rel: "noopener noreferrer", children: displayedCore.name })) : (displayedCore.name) })), displayedCore.brand && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__details__brand'), children: displayedCore.brand })), displayedCore.price != null && (_jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__details__price'), children: [displayedCore.msrp != null && Number(displayedCore.msrp) > Number(displayedCore.price) && (_jsx(Price, { value: displayedCore.msrp, lineThrough: true })), _jsx(Price, { value: displayedCore.price })] }))] }), _jsxs("div", { className: classnames('ss__chat-product-query-message__header__product__actions'), children: [displayedCore.url && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__go-to-product'), children: _jsx("a", { href: displayedCore.url, onClick: (e) => controller?.track.product.click(e, product), target: "_blank", rel: "noopener noreferrer", children: "Go to product" }) })), _jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__add-to-cart'), children: _jsx(Button, { icon: "cart", content: 'Add to Cart', onClick: () => {
|
|
436
451
|
controller?.track.product.addToCart(product);
|
|
437
452
|
controller?.addToCart(product);
|
|
438
|
-
} }) }), controller?.store.features.similarProducts.enabled && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__show-similar'), children: _jsx(Button, { content: 'Show Similar', onClick: () => controller?.productSimilar(sourceProduct) }) })), _jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__discuss-product'), children: _jsx(Button, { content: 'Discuss Product', onClick: () => controller?.productQuery(sourceProduct) }) })] })] })] }), selections.length > 0 && (_jsx("div", { className: classnames('ss__chat-product-query-message__variants'), role: "group", "aria-label": "Variant selection", children: selections.map((selection) => (_jsxs("div", { children: [_jsxs("div", { className: classnames('ss__chat-product-query-message__variants__label'), id: `ss__chat-pq-variant-${selection.field}`, children: [formatLabel(selection.field), " (", selection.values.length, ")"] }), _jsx("div", { className: classnames('ss__chat-product-query-message__variants__swatches'), role: "radiogroup", "aria-labelledby": `ss__chat-pq-variant-${selection.field}`, children: selection.values.map((selectionValue) => {
|
|
453
|
+
} }) }), controller?.store.features.similarProducts.enabled && (_jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__show-similar'), children: _jsx(Button, { icon: "search-thin", content: 'Show Similar', onClick: () => controller?.productSimilar(sourceProduct) }) })), _jsx("div", { className: classnames('ss__chat-product-query-message__header__product__actions__discuss-product'), children: _jsx(Button, { icon: "chat", content: 'Discuss Product', onClick: () => controller?.productQuery(sourceProduct) }) })] })] })] }), selections.length > 0 && (_jsx("div", { className: classnames('ss__chat-product-query-message__variants'), role: "group", "aria-label": "Variant selection", children: selections.map((selection) => (_jsxs("div", { children: [_jsxs("div", { className: classnames('ss__chat-product-query-message__variants__label'), id: `ss__chat-pq-variant-${selection.field}`, children: [formatLabel(selection.field), " (", selection.values.length, ")"] }), _jsx("div", { className: classnames('ss__chat-product-query-message__variants__swatches'), role: "radiogroup", "aria-labelledby": `ss__chat-pq-variant-${selection.field}`, children: selection.values.map((selectionValue) => {
|
|
439
454
|
const isUnavailable = !selectionValue.available;
|
|
440
455
|
const isSelected = selection.selected?.value === selectionValue.value;
|
|
441
456
|
return (_jsxs("button", { type: "button", className: classnames('ss__chat-product-query-message__variants__swatch', {
|
|
@@ -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;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA6BrE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,GAAG,CAAC,OAAO;;
|
|
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;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AA6BrE,eAAO,MAAM,YAAY,gBAAyB,iBAAiB,KAAG,GAAG,CAAC,OAAO;;CAw5C/E,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC/B,UAAU,EAAE,cAAc,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;CACzB,GAAG,uBAAuB,GAC1B,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,MAAM,uBAAuB,GAAG;IACrC,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;IAC5B,+BAA+B,CAAC,EAAE,OAAO,CAAC;IAC1C,QAAQ,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAChC,CAAC;AAEF,MAAM,WAAW,QAAQ;CAExB"}
|
|
@@ -247,23 +247,18 @@ export const ChatOrganism = observer((properties) => {
|
|
|
247
247
|
}
|
|
248
248
|
return base;
|
|
249
249
|
}
|
|
250
|
-
|
|
251
|
-
//
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
});
|
|
262
|
-
// Count pending facet attachments (newly selected, not yet sent)
|
|
263
|
-
(controller.store.currentChat?.attachments.items || [])
|
|
264
|
-
.filter((item) => item.type === 'facet' && item.key === facet.field && (item.state === 'active' || item.state === 'attached'))
|
|
265
|
-
.forEach((item) => applied.add(item.value));
|
|
266
|
-
return applied.size > 0 ? `${base} (${applied.size})` : base;
|
|
250
|
+
// Count current selections from the urlManager (source of truth for live state).
|
|
251
|
+
// `value.filtered` reflects the server's snapshot at response time and goes stale
|
|
252
|
+
// once the user deselects locally.
|
|
253
|
+
const applied = (facet.values || []).filter((value) => {
|
|
254
|
+
if (!value)
|
|
255
|
+
return false;
|
|
256
|
+
const optionValue = 'low' in value && 'high' in value
|
|
257
|
+
? `${value.low ?? '*'}:${value.high ?? '*'}`
|
|
258
|
+
: value.value || value.label;
|
|
259
|
+
return controller.store.isFacetSelected(facet.field, optionValue);
|
|
260
|
+
}).length;
|
|
261
|
+
return applied > 0 ? `${base} (${applied})` : base;
|
|
267
262
|
};
|
|
268
263
|
// Slider dropdown grows to fill the remaining chat width from its anchor,
|
|
269
264
|
// so the price range slider isn't cramped inside a 150px-wide dropdown.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@athoscommerce/snap-preact",
|
|
3
|
-
"version": "1.5.1-beta.
|
|
3
|
+
"version": "1.5.1-beta.112+05d95b25d",
|
|
4
4
|
"description": "Snap Preact",
|
|
5
5
|
"main": "dist/cjs/src/index.js",
|
|
6
6
|
"module": "dist/esm/src/index.js",
|
|
@@ -26,16 +26,16 @@
|
|
|
26
26
|
"storybook": "storybook dev -c ./components/.storybook -p 6006"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@athoscommerce/snap-client": "1.5.1-beta.
|
|
30
|
-
"@athoscommerce/snap-controller": "1.5.1-beta.
|
|
31
|
-
"@athoscommerce/snap-event-manager": "1.5.1-beta.
|
|
32
|
-
"@athoscommerce/snap-logger": "1.5.1-beta.
|
|
33
|
-
"@athoscommerce/snap-platforms": "1.5.1-beta.
|
|
34
|
-
"@athoscommerce/snap-profiler": "1.5.1-beta.
|
|
35
|
-
"@athoscommerce/snap-store-mobx": "1.5.1-beta.
|
|
36
|
-
"@athoscommerce/snap-toolbox": "1.5.1-beta.
|
|
37
|
-
"@athoscommerce/snap-tracker": "1.5.1-beta.
|
|
38
|
-
"@athoscommerce/snap-url-manager": "1.5.1-beta.
|
|
29
|
+
"@athoscommerce/snap-client": "1.5.1-beta.112+05d95b25d",
|
|
30
|
+
"@athoscommerce/snap-controller": "1.5.1-beta.112+05d95b25d",
|
|
31
|
+
"@athoscommerce/snap-event-manager": "1.5.1-beta.112+05d95b25d",
|
|
32
|
+
"@athoscommerce/snap-logger": "1.5.1-beta.112+05d95b25d",
|
|
33
|
+
"@athoscommerce/snap-platforms": "1.5.1-beta.112+05d95b25d",
|
|
34
|
+
"@athoscommerce/snap-profiler": "1.5.1-beta.112+05d95b25d",
|
|
35
|
+
"@athoscommerce/snap-store-mobx": "1.5.1-beta.112+05d95b25d",
|
|
36
|
+
"@athoscommerce/snap-toolbox": "1.5.1-beta.112+05d95b25d",
|
|
37
|
+
"@athoscommerce/snap-tracker": "1.5.1-beta.112+05d95b25d",
|
|
38
|
+
"@athoscommerce/snap-url-manager": "1.5.1-beta.112+05d95b25d",
|
|
39
39
|
"@emotion/react": "11.13.0",
|
|
40
40
|
"classnames": "^2.3.2",
|
|
41
41
|
"color": "^4.2.3",
|
|
@@ -103,5 +103,5 @@
|
|
|
103
103
|
"require": "./dist/cjs/toolbox/src/index.js"
|
|
104
104
|
}
|
|
105
105
|
},
|
|
106
|
-
"gitHead": "
|
|
106
|
+
"gitHead": "05d95b25dbb4e784493aa8a92c3667d4fd783276"
|
|
107
107
|
}
|