@blotoutio/providers-shop-gpt-sdk 1.0.0 → 1.1.0

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/index.cjs.js CHANGED
@@ -40,6 +40,8 @@ const formatMoney = (n, currency, options) => n.toLocaleString('en-US', {
40
40
  ...options,
41
41
  });
42
42
 
43
+ const delay = (n, resolvedValue) => new Promise((resolve) => setTimeout(() => resolve(resolvedValue), n));
44
+
43
45
  /**
44
46
  * ISO-3166 2-leter country codes and their names
45
47
  * @see https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2
@@ -300,6 +302,39 @@ const isoCountries = new Map([
300
302
  new Set(isoCountries.keys());
301
303
 
302
304
  const packageName = 'shopGPT';
305
+ const previewKeyName = 'previewShopGPT';
306
+
307
+ const canLog = () => {
308
+ try {
309
+ return localStorage.getItem('edgeTagDebug') === '1';
310
+ }
311
+ catch {
312
+ return false;
313
+ }
314
+ };
315
+ const prefix = `[EdgeTag]`;
316
+ const logger = {
317
+ log: (...args) => {
318
+ if (canLog()) {
319
+ console.log(prefix, ...args);
320
+ }
321
+ },
322
+ error: (...args) => {
323
+ if (canLog()) {
324
+ console.error(prefix, ...args);
325
+ }
326
+ },
327
+ info: (...args) => {
328
+ if (canLog()) {
329
+ console.info(prefix, ...args);
330
+ }
331
+ },
332
+ trace: (...args) => {
333
+ if (canLog()) {
334
+ console.trace(prefix, ...args);
335
+ }
336
+ },
337
+ };
303
338
 
304
339
  var _a$1;
305
340
  const registryKey = Symbol.for('shop-gpt');
@@ -328,12 +363,17 @@ const createShopGPTAPI = ({ fetch: fetchImpl = window.fetch, baseURL, userId, st
328
363
  const url = new URL(`/providers/shopGPT${path}`, baseURL);
329
364
  return url;
330
365
  };
331
- const processQuery = async (query, productHandle) => {
366
+ const processQuery = async (query, threadId, productHandle) => {
332
367
  var _a;
333
368
  const response = await fetchImpl(getURL('/query'), {
334
369
  method: 'POST',
335
370
  headers: getHeaders(),
336
- body: JSON.stringify({ query, timestamp: Date.now(), productHandle }),
371
+ body: JSON.stringify({
372
+ query,
373
+ timestamp: Date.now(),
374
+ productHandle,
375
+ threadId,
376
+ }),
337
377
  credentials: 'include',
338
378
  });
339
379
  if (!response.ok) {
@@ -343,54 +383,71 @@ const createShopGPTAPI = ({ fetch: fetchImpl = window.fetch, baseURL, userId, st
343
383
  return {
344
384
  message: data.message,
345
385
  products: (_a = data.products) === null || _a === void 0 ? void 0 : _a.filter((item) => !!item).map((item) => ({ ...item, quantity: 1 })),
386
+ chatTitle: data.chatTitle,
346
387
  };
347
388
  };
348
- const queryPrompts = async () => {
349
- const response = await fetchImpl(getURL('/query-prompts'), {
389
+ const fetchChatHistory = async (threadId) => {
390
+ if (!threadId) {
391
+ return [];
392
+ }
393
+ const response = await fetchImpl(getURL(`/query-history?threadId=${threadId}`), {
350
394
  method: 'GET',
351
395
  headers: getHeaders(),
352
396
  credentials: 'include',
353
397
  });
354
398
  if (!response.ok) {
355
- throw new Error(`Could not fetch query Prompts - ${response.status}: ${await response.text()}`);
399
+ throw new Error(`Could not fetch query history - ${response.status}: ${await response.text()}`);
356
400
  }
357
401
  const data = (await response.json());
358
- return data.prompts;
402
+ return data.history;
359
403
  };
360
- const initialPrompt = async (productId) => {
361
- const response = await fetchImpl(getURL('/query-initial-prompt'), {
362
- method: 'POST',
404
+ const fetchChatThreads = async () => {
405
+ const response = await fetchImpl(getURL('/thread'), {
406
+ method: 'GET',
363
407
  headers: getHeaders(),
364
- body: JSON.stringify({ productId }),
365
408
  credentials: 'include',
366
409
  });
367
410
  if (!response.ok) {
368
- throw new Error(`Could not fetch query Prompts - ${response.status}: ${await response.text()}`);
411
+ throw new Error(`Could not fetch chat threads - ${response.status}: ${await response.text()}`);
369
412
  }
370
413
  const data = (await response.json());
371
- return data.prompt;
414
+ return data.threads;
372
415
  };
373
- const fetchChatHistory = async () => {
374
- const response = await fetchImpl(getURL('/query-history'), {
375
- method: 'GET',
416
+ const createChatThread = async (payload) => {
417
+ const response = await fetchImpl(getURL('/thread'), {
418
+ method: 'POST',
376
419
  headers: getHeaders(),
377
420
  credentials: 'include',
421
+ body: JSON.stringify({
422
+ title: payload.title,
423
+ devContext: payload.devContext,
424
+ }),
378
425
  });
379
426
  if (!response.ok) {
380
- throw new Error(`Could not fetch query history - ${response.status}: ${await response.text()}`);
427
+ throw new Error(`Failed to create chat threads - ${response.status}: ${await response.text()}`);
381
428
  }
382
429
  const data = (await response.json());
383
- return data.history;
430
+ return data;
384
431
  };
385
432
  return {
386
433
  processQuery,
387
- queryPrompts,
388
- initialPrompt,
389
434
  fetchChatHistory,
435
+ fetchChatThreads,
436
+ createChatThread,
390
437
  };
391
438
  };
392
439
 
440
+ // eslint-disable-next-line @nx/enforce-module-boundaries
393
441
  const error = (message) => console.error(message);
442
+ const hasPreviewKey = () => {
443
+ var _a;
444
+ try {
445
+ return ((_a = sessionStorage.getItem(previewKeyName)) !== null && _a !== void 0 ? _a : '0') == '1';
446
+ }
447
+ catch {
448
+ return false;
449
+ }
450
+ };
394
451
  const init = (params) => {
395
452
  var _a, _b, _c;
396
453
  if (typeof window == 'undefined' || typeof document == 'undefined') {
@@ -410,8 +467,13 @@ const init = (params) => {
410
467
  // exit if not in top window
411
468
  return;
412
469
  }
413
- const { enabled } = (_c = params.manifest.variables) !== null && _c !== void 0 ? _c : {};
414
- if (enabled) {
470
+ const { enabled, devMode, merchantUrl, profiles, productHandles, targetPath, uiMode, } = (_c = params.manifest.variables) !== null && _c !== void 0 ? _c : {};
471
+ let shouldShowUI = enabled;
472
+ if (!enabled && hasPreviewKey()) {
473
+ logger.log('Enabling UI in preview mode');
474
+ shouldShowUI = true;
475
+ }
476
+ if (shouldShowUI) {
415
477
  const uiImplementation = window[registryKey].ui;
416
478
  if (!uiImplementation) {
417
479
  error('UI implementation is missing');
@@ -425,6 +487,12 @@ const init = (params) => {
425
487
  uiImplementation.init({
426
488
  storeAPI,
427
489
  shopGPTAPI,
490
+ devMode,
491
+ uiMode,
492
+ merchantUrl,
493
+ profiles,
494
+ productHandles,
495
+ path: targetPath,
428
496
  });
429
497
  }
430
498
  };
@@ -482,114 +550,54 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
482
550
  * Copyright 2019 Google LLC
483
551
  * SPDX-License-Identifier: BSD-3-Clause
484
552
  */
485
- const t$3=globalThis,e$6=t$3.ShadowRoot&&(void 0===t$3.ShadyCSS||t$3.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$3=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$6&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$3.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$3.set(s,t));}return t}toString(){return this.cssText}};const r$5=t=>new n$3("string"==typeof t?t:t+"",void 0,s$2),i$3=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$3(o,t,s$2)},S$1=(s,o)=>{if(e$6)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$3.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$6?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$5(e)})(t):t;
553
+ const t$3=globalThis,e$6=t$3.ShadowRoot&&(void 0===t$3.ShadyCSS||t$3.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,s$2=Symbol(),o$4=new WeakMap;let n$3 = class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s$2)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e;}get styleSheet(){let t=this.o;const s=this.t;if(e$6&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o$4.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o$4.set(s,t));}return t}toString(){return this.cssText}};const r$4=t=>new n$3("string"==typeof t?t:t+"",void 0,s$2),i$3=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[o+1]),t[0]);return new n$3(o,t,s$2)},S$1=(s,o)=>{if(e$6)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement("style"),n=t$3.litNonce;void 0!==n&&o.setAttribute("nonce",n),o.textContent=e.cssText,s.appendChild(o);}},c$2=e$6?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return r$4(e)})(t):t;
486
554
 
487
555
  /**
488
556
  * @license
489
557
  * Copyright 2017 Google LLC
490
558
  * SPDX-License-Identifier: BSD-3-Clause
491
- */const{is:i$2,defineProperty:e$5,getOwnPropertyDescriptor:r$4,getOwnPropertyNames:h$1,getOwnPropertySymbols:o$2,getPrototypeOf:n$2}=Object,a$1=globalThis,c$1=a$1.trustedTypes,l$1=c$1?c$1.emptyScript:"",p$1=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$2(t,s),y$1={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let b$1 = class b extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=y$1){if(s.state&&(s.attribute=!1),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);void 0!==r&&e$5(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$4(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??y$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...h$1(t),...o$2(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return !1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:u$1).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$1;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f$1)(this[t],s))return;this.P(t,s,i);}!1===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){this.isUpdatePending=!0;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t)!0!==i.wrapped||this._$AL.has(s)||void 0===this[s]||this.P(s,this[s],i);}let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EU();}catch(s){throw t=!1,this._$EU(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t);}_$EU(){this._$AL=new Map,this.isUpdatePending=!1;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return !0}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}};b$1.elementStyles=[],b$1.shadowRootOptions={mode:"open"},b$1[d$1("elementProperties")]=new Map,b$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:b$1}),(a$1.reactiveElementVersions??=[]).push("2.0.4");
559
+ */const{is:i$2,defineProperty:e$5,getOwnPropertyDescriptor:r$3,getOwnPropertyNames:h$1,getOwnPropertySymbols:o$3,getPrototypeOf:n$2}=Object,a$1=globalThis,c$1=a$1.trustedTypes,l$1=c$1?c$1.emptyScript:"",p$1=a$1.reactiveElementPolyfillSupport,d$1=(t,s)=>t,u$1={toAttribute(t,s){switch(s){case Boolean:t=t?l$1:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t);}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t);}catch(t){i=null;}}return i}},f$1=(t,s)=>!i$2(t,s),y$1={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1};Symbol.metadata??=Symbol("metadata"),a$1.litPropertyMetadata??=new WeakMap;let b$1 = class b extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t);}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=y$1){if(s.state&&(s.attribute=!1),this._$Ei(),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),r=this.getPropertyDescriptor(t,i,s);void 0!==r&&e$5(this.prototype,t,r);}}static getPropertyDescriptor(t,s,i){const{get:e,set:h}=r$3(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t;}};return {get(){return e?.call(this)},set(s){const r=e?.call(this);h.call(this,s),this.requestUpdate(t,r,i);},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??y$1}static _$Ei(){if(this.hasOwnProperty(d$1("elementProperties")))return;const t=n$2(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties);}static finalize(){if(this.hasOwnProperty(d$1("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(d$1("properties"))){const t=this.properties,s=[...h$1(t),...o$3(t)];for(const i of s)this.createProperty(i,t[i]);}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i);}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t);}this.elementStyles=this.finalizeStyles(this.styles);}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(c$2(s));}else void 0!==s&&i.push(c$2(s));return i}static _$Eu(t,s){const i=s.attribute;return !1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev();}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)));}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.();}removeController(t){this._$EO?.delete(t);}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t);}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return S$1(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()));}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()));}attributeChangedCallback(t,s,i){this._$AK(t,i);}_$EC(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:u$1).toAttribute(s,i.type);this._$Em=t,null==r?this.removeAttribute(e):this.setAttribute(e,r),this._$Em=null;}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u$1;this._$Em=e,this[e]=r.fromAttribute(s,t.type),this._$Em=null;}}requestUpdate(t,s,i){if(void 0!==t){if(i??=this.constructor.getPropertyOptions(t),!(i.hasChanged??f$1)(this[t],s))return;this.P(t,s,i);}!1===this.isUpdatePending&&(this._$ES=this._$ET());}P(t,s,i){this._$AL.has(t)||this._$AL.set(t,s),!0===i.reflect&&this._$Em!==t&&(this._$Ej??=new Set).add(t);}async _$ET(){this.isUpdatePending=!0;try{await this._$ES;}catch(t){Promise.reject(t);}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0;}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t)!0!==i.wrapped||this._$AL.has(s)||void 0===this[s]||this.P(s,this[s],i);}let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EU();}catch(s){throw t=!1,this._$EU(),s}t&&this._$AE(s);}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t);}_$EU(){this._$AL=new Map,this.isUpdatePending=!1;}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return !0}update(t){this._$Ej&&=this._$Ej.forEach((t=>this._$EC(t,this[t]))),this._$EU();}updated(t){}firstUpdated(t){}};b$1.elementStyles=[],b$1.shadowRootOptions={mode:"open"},b$1[d$1("elementProperties")]=new Map,b$1[d$1("finalized")]=new Map,p$1?.({ReactiveElement:b$1}),(a$1.reactiveElementVersions??=[]).push("2.0.4");
492
560
 
493
561
  /**
494
562
  * @license
495
563
  * Copyright 2017 Google LLC
496
564
  * SPDX-License-Identifier: BSD-3-Clause
497
565
  */
498
- const t$2=globalThis,i$1=t$2.trustedTypes,s$1=i$1?i$1.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$4="$lit$",h=`lit$${Math.random().toFixed(9).slice(2)}$`,o$1="?"+h,n$1=`<${o$1}>`,r$3=document,l=()=>r$3.createComment(""),c=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a=Array.isArray,u=t=>a(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),b=y(2),w=Symbol.for("lit-noChange"),T=Symbol.for("lit-nothing"),A=new WeakMap,E=r$3.createTreeWalker(r$3,129);function C(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$1?s$1.createHTML(i):i}const P=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":"",c=f;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f?s+n$1:d>=0?(o.push(a),s.slice(0,d)+e$4+s.slice(d)+h+x):s+h+(-2===d?i:x);}return [C(t,l+(t[s]||"<?>")+(2===i?"</svg>":"")),o]};class V{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=P(t,s);if(this.el=V.createElement(f,n),E.currentNode=this.el.content,2===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=E.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$4)){const i=v[a++],s=r.getAttribute(t).split(h),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?k:"?"===e[1]?H:"@"===e[1]?I:R}),r.removeAttribute(t);}else t.startsWith(h)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h),s=t.length-1;if(s>0){r.textContent=i$1?i$1.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l()),E.nextNode(),d.push({type:2,index:++c});r.append(t[s],l());}}}else if(8===r.nodeType)if(r.data===o$1)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h,t+1));)d.push({type:7,index:c}),t+=h.length-1;}c++;}}static createElement(t,i){const s=r$3.createElement("template");return s.innerHTML=t,s}}function N(t,i,s=t,e){if(i===w)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(!1),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=N(t,h._$AS(t,i.values),h,e)),i}class S{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$3).importNode(i,!0);E.currentNode=e;let h=E.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new M(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new L(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=E.nextNode(),o++);}return E.currentNode=r$3,e}p(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class M{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=T,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??!0;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=N(this,t,i),c(t)?t===T||null==t||""===t?(this._$AH!==T&&this._$AR(),this._$AH=T):t!==this._$AH&&t!==w&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u(t)?this.k(t):this._(t);}S(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.S(t));}_(t){this._$AH!==T&&c(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$3.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=V.createElement(C(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new S(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new V(t)),i}k(t){a(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new M(this.S(l()),this.S(l()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class R{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=T,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=T;}_$AI(t,i=this,s,e){const h=this.strings;let o=!1;if(void 0===h)t=N(this,t,i,0),o=!c(t)||t!==this._$AH&&t!==w,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=N(this,e[s+n],i,n),r===w&&(r=this._$AH[n]),o||=!c(r)||r!==this._$AH[n],r===T?t=T:t!==T&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===T?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class k extends R{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===T?void 0:t;}}class H extends R{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==T);}}class I extends R{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=N(this,t,i,0)??T)===w)return;const s=this._$AH,e=t===T&&s!==T||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==T&&(s===T||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class L{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){N(this,t);}}const Z=t$2.litHtmlPolyfillSupport;Z?.(V,M),(t$2.litHtmlVersions??=[]).push("3.1.3");const j=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new M(i.insertBefore(l(),t),t,void 0,s??{});}return h._$AI(t),h};
499
-
500
- /**
501
- * @license
502
- * Copyright 2017 Google LLC
503
- * SPDX-License-Identifier: BSD-3-Clause
504
- */class s extends b$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=j(i,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1);}render(){return w}}s._$litElement$=!0,s[("finalized")]=!0,globalThis.litElementHydrateSupport?.({LitElement:s});const r$2=globalThis.litElementPolyfillSupport;r$2?.({LitElement:s});(globalThis.litElementVersions??=[]).push("4.0.5");
566
+ const t$2=globalThis,i$1=t$2.trustedTypes,s$1=i$1?i$1.createPolicy("lit-html",{createHTML:t=>t}):void 0,e$4="$lit$",h=`lit$${Math.random().toFixed(9).slice(2)}$`,o$2="?"+h,n$1=`<${o$2}>`,r$2=document,l=()=>r$2.createComment(""),c=t=>null===t||"object"!=typeof t&&"function"!=typeof t,a=Array.isArray,u=t=>a(t)||"function"==typeof t?.[Symbol.iterator],d="[ \t\n\f\r]",f=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,_=/>/g,m=RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),p=/'/g,g=/"/g,$=/^(?:script|style|textarea|title)$/i,y=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),x=y(1),b=y(2),w=Symbol.for("lit-noChange"),T=Symbol.for("lit-nothing"),A=new WeakMap,E=r$2.createTreeWalker(r$2,129);function C(t,i){if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==s$1?s$1.createHTML(i):i}const P=(t,i)=>{const s=t.length-1,o=[];let r,l=2===i?"<svg>":"",c=f;for(let i=0;i<s;i++){const s=t[i];let a,u,d=-1,y=0;for(;y<s.length&&(c.lastIndex=y,u=c.exec(s),null!==u);)y=c.lastIndex,c===f?"!--"===u[1]?c=v:void 0!==u[1]?c=_:void 0!==u[2]?($.test(u[2])&&(r=RegExp("</"+u[2],"g")),c=m):void 0!==u[3]&&(c=m):c===m?">"===u[0]?(c=r??f,d=-1):void 0===u[1]?d=-2:(d=c.lastIndex-u[2].length,a=u[1],c=void 0===u[3]?m:'"'===u[3]?g:p):c===g||c===p?c=m:c===v||c===_?c=f:(c=m,r=void 0);const x=c===m&&t[i+1].startsWith("/>")?" ":"";l+=c===f?s+n$1:d>=0?(o.push(a),s.slice(0,d)+e$4+s.slice(d)+h+x):s+h+(-2===d?i:x);}return [C(t,l+(t[s]||"<?>")+(2===i?"</svg>":"")),o]};class V{constructor({strings:t,_$litType$:s},n){let r;this.parts=[];let c=0,a=0;const u=t.length-1,d=this.parts,[f,v]=P(t,s);if(this.el=V.createElement(f,n),E.currentNode=this.el.content,2===s){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes);}for(;null!==(r=E.nextNode())&&d.length<u;){if(1===r.nodeType){if(r.hasAttributes())for(const t of r.getAttributeNames())if(t.endsWith(e$4)){const i=v[a++],s=r.getAttribute(t).split(h),e=/([.?@])?(.*)/.exec(i);d.push({type:1,index:c,name:e[2],strings:s,ctor:"."===e[1]?k:"?"===e[1]?H:"@"===e[1]?I:R}),r.removeAttribute(t);}else t.startsWith(h)&&(d.push({type:6,index:c}),r.removeAttribute(t));if($.test(r.tagName)){const t=r.textContent.split(h),s=t.length-1;if(s>0){r.textContent=i$1?i$1.emptyScript:"";for(let i=0;i<s;i++)r.append(t[i],l()),E.nextNode(),d.push({type:2,index:++c});r.append(t[s],l());}}}else if(8===r.nodeType)if(r.data===o$2)d.push({type:2,index:c});else {let t=-1;for(;-1!==(t=r.data.indexOf(h,t+1));)d.push({type:7,index:c}),t+=h.length-1;}c++;}}static createElement(t,i){const s=r$2.createElement("template");return s.innerHTML=t,s}}function N(t,i,s=t,e){if(i===w)return i;let h=void 0!==e?s._$Co?.[e]:s._$Cl;const o=c(i)?void 0:i._$litDirective$;return h?.constructor!==o&&(h?._$AO?.(!1),void 0===o?h=void 0:(h=new o(t),h._$AT(t,s,e)),void 0!==e?(s._$Co??=[])[e]=h:s._$Cl=h),void 0!==h&&(i=N(t,h._$AS(t,i.values),h,e)),i}class S{constructor(t,i){this._$AV=[],this._$AN=void 0,this._$AD=t,this._$AM=i;}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(t){const{el:{content:i},parts:s}=this._$AD,e=(t?.creationScope??r$2).importNode(i,!0);E.currentNode=e;let h=E.nextNode(),o=0,n=0,l=s[0];for(;void 0!==l;){if(o===l.index){let i;2===l.type?i=new M(h,h.nextSibling,this,t):1===l.type?i=new l.ctor(h,l.name,l.strings,this,t):6===l.type&&(i=new L(h,this,t)),this._$AV.push(i),l=s[++n];}o!==l?.index&&(h=E.nextNode(),o++);}return E.currentNode=r$2,e}p(t){let i=0;for(const s of this._$AV)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++;}}class M{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(t,i,s,e){this.type=2,this._$AH=T,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cv=e?.isConnected??!0;}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t?.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=N(this,t,i),c(t)?t===T||null==t||""===t?(this._$AH!==T&&this._$AR(),this._$AH=T):t!==this._$AH&&t!==w&&this._(t):void 0!==t._$litType$?this.$(t):void 0!==t.nodeType?this.T(t):u(t)?this.k(t):this._(t);}S(t){return this._$AA.parentNode.insertBefore(t,this._$AB)}T(t){this._$AH!==t&&(this._$AR(),this._$AH=this.S(t));}_(t){this._$AH!==T&&c(this._$AH)?this._$AA.nextSibling.data=t:this.T(r$2.createTextNode(t)),this._$AH=t;}$(t){const{values:i,_$litType$:s}=t,e="number"==typeof s?this._$AC(t):(void 0===s.el&&(s.el=V.createElement(C(s.h,s.h[0]),this.options)),s);if(this._$AH?._$AD===e)this._$AH.p(i);else {const t=new S(e,this),s=t.u(this.options);t.p(i),this.T(s),this._$AH=t;}}_$AC(t){let i=A.get(t.strings);return void 0===i&&A.set(t.strings,i=new V(t)),i}k(t){a(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const h of t)e===i.length?i.push(s=new M(this.S(l()),this.S(l()),this,this.options)):s=i[e],s._$AI(h),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e);}_$AR(t=this._$AA.nextSibling,i){for(this._$AP?.(!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i;}}setConnected(t){void 0===this._$AM&&(this._$Cv=t,this._$AP?.(t));}}class R{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(t,i,s,e,h){this.type=1,this._$AH=T,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=h,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=T;}_$AI(t,i=this,s,e){const h=this.strings;let o=!1;if(void 0===h)t=N(this,t,i,0),o=!c(t)||t!==this._$AH&&t!==w,o&&(this._$AH=t);else {const e=t;let n,r;for(t=h[0],n=0;n<h.length-1;n++)r=N(this,e[s+n],i,n),r===w&&(r=this._$AH[n]),o||=!c(r)||r!==this._$AH[n],r===T?t=T:t!==T&&(t+=(r??"")+h[n+1]),this._$AH[n]=r;}o&&!e&&this.j(t);}j(t){t===T?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"");}}class k extends R{constructor(){super(...arguments),this.type=3;}j(t){this.element[this.name]=t===T?void 0:t;}}class H extends R{constructor(){super(...arguments),this.type=4;}j(t){this.element.toggleAttribute(this.name,!!t&&t!==T);}}class I extends R{constructor(t,i,s,e,h){super(t,i,s,e,h),this.type=5;}_$AI(t,i=this){if((t=N(this,t,i,0)??T)===w)return;const s=this._$AH,e=t===T&&s!==T||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,h=t!==T&&(s===T||e);e&&this.element.removeEventListener(this.name,this,s),h&&this.element.addEventListener(this.name,this,t),this._$AH=t;}handleEvent(t){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,t):this._$AH.handleEvent(t);}}class L{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s;}get _$AU(){return this._$AM._$AU}_$AI(t){N(this,t);}}const Z=t$2.litHtmlPolyfillSupport;Z?.(V,M),(t$2.litHtmlVersions??=[]).push("3.1.3");const j=(t,i,s)=>{const e=s?.renderBefore??i;let h=e._$litPart$;if(void 0===h){const t=s?.renderBefore??null;e._$litPart$=h=new M(i.insertBefore(l(),t),t,void 0,s??{});}return h._$AI(t),h};
505
567
 
506
568
  /**
507
569
  * @license
508
570
  * Copyright 2017 Google LLC
509
571
  * SPDX-License-Identifier: BSD-3-Clause
510
- */
511
- const t$1={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e$3=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
512
-
513
- /**
514
- * @license
515
- * Copyright 2018 Google LLC
516
- * SPDX-License-Identifier: BSD-3-Clause
517
- */const e$2=e$3(class extends i{constructor(t){if(super(t),t.type!==t$1.ATTRIBUTE||"class"!==t.name||t.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return w}});
572
+ */class s extends b$1{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0;}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=j(i,this.renderRoot,this.renderOptions);}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0);}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1);}render(){return w}}s._$litElement$=!0,s[("finalized")]=!0,globalThis.litElementHydrateSupport?.({LitElement:s});const r$1=globalThis.litElementPolyfillSupport;r$1?.({LitElement:s});(globalThis.litElementVersions??=[]).push("4.0.5");
518
573
 
519
574
  /**
520
575
  * @license
521
576
  * Copyright 2017 Google LLC
522
577
  * SPDX-License-Identifier: BSD-3-Clause
523
578
  */
524
- const t=t=>(e,o)=>{void 0!==o?o.addInitializer((()=>{customElements.define(t,e);})):customElements.define(t,e);};
525
-
526
- /**
527
- * @license
528
- * Copyright 2017 Google LLC
529
- * SPDX-License-Identifier: BSD-3-Clause
530
- */const o={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1},r$1=(t=o,e,r)=>{const{kind:n,metadata:i}=r;let s=globalThis.litPropertyMetadata.get(i);if(void 0===s&&globalThis.litPropertyMetadata.set(i,s=new Map),s.set(r.name,t),"accessor"===n){const{name:o}=r;return {set(r){const n=e.get.call(this);e.set.call(this,r),this.requestUpdate(o,n,t);},init(e){return void 0!==e&&this.P(o,void 0,t),e}}}if("setter"===n){const{name:o}=r;return function(r){const n=this[o];e.call(this,r),this.requestUpdate(o,n,t);}}throw Error("Unsupported decorator location: "+n)};function n(t){return (e,o)=>"object"==typeof o?r$1(t,e,o):((t,e,o)=>{const r=e.hasOwnProperty(o);return e.constructor.createProperty(o,r?{...t,wrapped:!0}:t),r?Object.getOwnPropertyDescriptor(e,o):void 0})(t,e,o)}
579
+ const t$1=t=>(e,o)=>{void 0!==o?o.addInitializer((()=>{customElements.define(t,e);})):customElements.define(t,e);};
531
580
 
532
581
  /**
533
582
  * @license
534
583
  * Copyright 2017 Google LLC
535
584
  * SPDX-License-Identifier: BSD-3-Clause
536
- */function r(r){return n({...r,state:!0,attribute:!1})}
585
+ */const o$1={attribute:!0,type:String,converter:u$1,reflect:!1,hasChanged:f$1},r=(t=o$1,e,r)=>{const{kind:n,metadata:i}=r;let s=globalThis.litPropertyMetadata.get(i);if(void 0===s&&globalThis.litPropertyMetadata.set(i,s=new Map),s.set(r.name,t),"accessor"===n){const{name:o}=r;return {set(r){const n=e.get.call(this);e.set.call(this,r),this.requestUpdate(o,n,t);},init(e){return void 0!==e&&this.P(o,void 0,t),e}}}if("setter"===n){const{name:o}=r;return function(r){const n=this[o];e.call(this,r),this.requestUpdate(o,n,t);}}throw Error("Unsupported decorator location: "+n)};function n(t){return (e,o)=>"object"==typeof o?r(t,e,o):((t,e,o)=>{const r=e.hasOwnProperty(o);return e.constructor.createProperty(o,r?{...t,wrapped:!0}:t),r?Object.getOwnPropertyDescriptor(e,o):void 0})(t,e,o)}
537
586
 
538
587
  /**
539
588
  * @license
540
589
  * Copyright 2017 Google LLC
541
590
  * SPDX-License-Identifier: BSD-3-Clause
542
591
  */
543
- const e$1=(e,t,c)=>(c.configurable=!0,c.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
592
+ const e$3=(e,t,c)=>(c.configurable=!0,c.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,c),c);
544
593
 
545
594
  /**
546
595
  * @license
547
596
  * Copyright 2017 Google LLC
548
597
  * SPDX-License-Identifier: BSD-3-Clause
549
- */function e(e,r){return (n,s,i)=>{const o=t=>t.renderRoot?.querySelector(e)??null;if(r){const{get:e,set:r}="object"==typeof s?n:i??(()=>{const t=Symbol();return {get(){return this[t]},set(e){this[t]=e;}}})();return e$1(n,s,{get(){let t=e.call(this);return void 0===t&&(t=o(this),(null!==t||this.hasUpdated)&&r.call(this,t)),t}})}return e$1(n,s,{get(){return o(this)}})}}
550
-
551
- const canLog = () => {
552
- try {
553
- return localStorage.getItem('edgeTagDebug') === '1';
554
- }
555
- catch {
556
- return false;
557
- }
558
- };
559
- const prefix = `[EdgeTag]`;
560
- const logger = {
561
- log: (...args) => {
562
- if (canLog()) {
563
- console.log(prefix, ...args);
564
- }
565
- },
566
- error: (...args) => {
567
- if (canLog()) {
568
- console.error(prefix, ...args);
569
- }
570
- },
571
- info: (...args) => {
572
- if (canLog()) {
573
- console.info(prefix, ...args);
574
- }
575
- },
576
- trace: (...args) => {
577
- if (canLog()) {
578
- console.trace(prefix, ...args);
579
- }
580
- },
581
- };
582
-
583
- const shopGPTStyles = () => i$3 `
584
- :host {
585
- position: fixed;
586
- top: 0;
587
- left: 0;
588
- height: 100%;
589
- width: 100%;
590
- z-index: 2147483647;
591
- }
598
+ */function e$2(e,r){return (n,s,i)=>{const o=t=>t.renderRoot?.querySelector(e)??null;if(r){const{get:e,set:r}="object"==typeof s?n:i??(()=>{const t=Symbol();return {get(){return this[t]},set(e){this[t]=e;}}})();return e$3(n,s,{get(){let t=e.call(this);return void 0===t&&(t=o(this),(null!==t||this.hasUpdated)&&r.call(this,t)),t}})}return e$3(n,s,{get(){return o(this)}})}}
592
599
 
600
+ const scrollBarStyles = i$3 `
593
601
  ::-webkit-scrollbar {
594
602
  width: 20px;
595
603
  }
@@ -608,6 +616,9 @@ const shopGPTStyles = () => i$3 `
608
616
  ::-webkit-scrollbar-thumb:hover {
609
617
  background-color: #a8bbbf;
610
618
  }
619
+ `;
620
+ const shopGPTStyles = i$3 `
621
+ ${scrollBarStyles}
611
622
 
612
623
  * {
613
624
  box-sizing: border-box;
@@ -619,28 +630,64 @@ const shopGPTStyles = () => i$3 `
619
630
  padding: 0;
620
631
  }
621
632
 
622
- .container {
623
- display: flex;
624
- flex-direction: column;
625
- overflow: hidden;
633
+ #shop-gpt-dialog-overlay {
634
+ max-width: 100vw;
635
+ max-height: 100vh;
636
+ width: 100%;
626
637
  height: 100%;
627
- background: #ffffff;
628
- font-size: 16px;
629
- font-style: normal;
630
- font-weight: 400;
631
- line-height: 21px;
638
+ margin: 0;
639
+ padding: 0;
640
+ border: none;
632
641
  }
633
642
 
634
- .mobile-version {
635
- display: none;
643
+ #shop-gpt-modal {
644
+ right: 19px;
645
+ bottom: 28px;
646
+ height: 80%;
647
+ width: 35%;
648
+ min-height: 620px;
649
+ min-width: 475px;
650
+ border-radius: 10px;
651
+ overflow: hidden;
652
+ box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.12),
653
+ 0px 20px 20px 0px rgba(0, 0, 0, 0.08);
654
+ position: fixed;
655
+ z-index: 2000;
656
+
657
+ @media screen and (max-width: 768px) {
658
+ min-height: unset;
659
+ min-width: unset;
660
+ width: 90vw;
661
+ height: 80vh;
662
+ bottom: 10px;
663
+ right: 10px;
664
+ }
636
665
  }
637
666
 
638
- @media screen and (max-width: 430px) {
639
- .container {
640
- display: none;
667
+ .chatbot-widget {
668
+ position: fixed;
669
+ bottom: 20px;
670
+ right: 20px;
671
+ z-index: 1000;
672
+
673
+ button {
674
+ color: #ffffff;
675
+ border: none;
676
+ cursor: pointer;
677
+ width: 56px;
678
+ height: 56px;
679
+ background-color: #001531;
680
+ border-radius: 50%;
681
+ justify-content: center;
682
+ align-items: center;
683
+ box-shadow: 0 0 4px 1px #ffffff;
641
684
  }
685
+ }
686
+
687
+ .mobile-version {
688
+ display: none;
642
689
 
643
- .mobile-version {
690
+ @media screen and (max-width: 430px) {
644
691
  display: flex;
645
692
  overflow: hidden;
646
693
  height: 100%;
@@ -648,566 +695,976 @@ const shopGPTStyles = () => i$3 `
648
695
  justify-content: center;
649
696
  align-items: center;
650
697
  padding: 25px;
698
+ font-weight: 700;
651
699
  }
652
700
  }
653
701
 
654
- .header {
702
+ .shopgpt-container {
655
703
  display: flex;
656
- justify-content: space-between;
657
- align-items: center;
658
- padding: 24px;
659
- text-align: center;
660
- border-bottom: 1px solid #d4d4d8;
661
- height: 114px;
704
+ gap: 1px;
705
+ background: #dbe2eb;
706
+ height: 100%;
707
+ width: 100%;
662
708
 
663
- @media screen and (max-width: 430px) {
664
- height: 68px;
665
- padding: 16px;
709
+ chat-threads {
710
+ width: 20%;
666
711
  }
667
- }
668
712
 
669
- .chat-header-title {
670
- color: #000;
671
- font-size: 20px;
672
- font-weight: 700;
673
- font-style: normal;
674
- line-height: 28px;
675
- text-align: left;
676
- text-underline-position: from-font;
677
- text-decoration-skip-ink: none;
678
- margin: 0;
679
- }
713
+ products-section {
714
+ width: 39%;
715
+ }
680
716
 
681
- @media screen and (max-width: 430px) {
682
- .product-content {
683
- max-width: calc(100vw - 150px);
717
+ chat-section {
718
+ width: 41%;
719
+ }
720
+
721
+ @media screen and (max-width: 430px) {
722
+ display: none;
684
723
  }
685
724
  }
725
+ `;
686
726
 
687
- .typing-dots {
688
- display: flex;
689
- align-items: center;
690
- justify-content: center;
691
- gap: 8px;
727
+ /**
728
+ * @license
729
+ * Copyright 2017 Google LLC
730
+ * SPDX-License-Identifier: BSD-3-Clause
731
+ */
732
+ const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i;}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}
733
+
734
+ /**
735
+ * @license
736
+ * Copyright 2018 Google LLC
737
+ * SPDX-License-Identifier: BSD-3-Clause
738
+ */const e=e$1(class extends i{constructor(t$1){if(super(t$1),t$1.type!==t.ATTRIBUTE||"class"!==t$1.name||t$1.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return " "+Object.keys(t).filter((s=>t[s])).join(" ")+" "}update(s,[i]){if(void 0===this.st){this.st=new Set,void 0!==s.strings&&(this.nt=new Set(s.strings.join(" ").split(/\s/).filter((t=>""!==t))));for(const t in i)i[t]&&!this.nt?.has(t)&&this.st.add(t);return this.render(i)}const r=s.element.classList;for(const t of this.st)t in i||(r.remove(t),this.st.delete(t));for(const t in i){const s=!!i[t];s===this.st.has(t)||this.nt?.has(t)||(s?(r.add(t),this.st.add(t)):(r.remove(t),this.st.delete(t)));}return w}});
739
+
740
+ /**
741
+ * @license
742
+ * Copyright 2021 Google LLC
743
+ * SPDX-License-Identifier: BSD-3-Clause
744
+ */
745
+ function*o(o,f){if(void 0!==o){let i=0;for(const t of o)yield f(t,i++);}}
746
+
747
+ const sendFilledIcon = b `
748
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
749
+ <g clip-path="url(#clip0_12481_1826)">
750
+ <path d="M21.7872 11.3331L5.28724 3.08312C5.15792 3.01844 5.01266 2.99253 4.86895 3.00849C4.72524 3.02446 4.58921 3.08163 4.47724 3.17312C4.37031 3.26273 4.2905 3.3804 4.24677 3.5129C4.20305 3.64539 4.19715 3.78745 4.22974 3.92312L6.21724 11.2506H14.6997V12.7506H6.21724L4.19974 20.0556C4.16916 20.1689 4.16559 20.2878 4.18932 20.4027C4.21305 20.5176 4.26341 20.6254 4.33636 20.7173C4.40931 20.8092 4.50281 20.8827 4.60934 20.9319C4.71587 20.9811 4.83247 21.0047 4.94974 21.0006C5.06715 20.9999 5.18275 20.9717 5.28724 20.9181L21.7872 12.6681C21.9101 12.6052 22.0132 12.5096 22.0852 12.3918C22.1572 12.274 22.1953 12.1386 22.1953 12.0006C22.1953 11.8626 22.1572 11.7272 22.0852 11.6094C22.0132 11.4917 21.9101 11.3961 21.7872 11.3331Z" fill="white"/>
751
+ </g>
752
+ <defs>
753
+ <clipPath id="clip0_12481_1826">
754
+ <rect width="24" height="24" fill="white"/>
755
+ </clipPath>
756
+ </defs>
757
+ </svg>
758
+ `;
759
+ const chatIcon = b `<svg focusable="false" preserveAspectRatio="xMidYMid meet" fill="currentColor" width="16" height="16" viewBox="0 0 32 32" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><path d="M16 19a6.9908 6.9908 0 01-5.833-3.1287l1.666-1.1074a5.0007 5.0007 0 008.334 0l1.666 1.1074A6.9908 6.9908 0 0116 19zM20 8a2 2 0 102 2A1.9806 1.9806 0 0020 8zM12 8a2 2 0 102 2A1.9806 1.9806 0 0012 8z"></path><path d="M17.7358,30,16,29l4-7h6a1.9966,1.9966,0,0,0,2-2V6a1.9966,1.9966,0,0,0-2-2H6A1.9966,1.9966,0,0,0,4,6V20a1.9966,1.9966,0,0,0,2,2h9v2H6a3.9993,3.9993,0,0,1-4-4V6A3.9988,3.9988,0,0,1,6,2H26a3.9988,3.9988,0,0,1,4,4V20a3.9993,3.9993,0,0,1-4,4H21.1646Z"></path></svg>`;
760
+ const botIcon = b `
761
+ <svg xmlns="http://www.w3.org/2000/svg" width="12" height="18" viewBox="0 0 12 18" fill="none">
762
+ <g clip-path="url(#clip0_12438_1597)">
763
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M0.0703335 0.211252C0.0351569 0.281773 0.0351562 0.374089 0.0351562 0.55872V17.2552C0.0351562 17.4398 0.0351569 17.5321 0.0703335 17.6026C0.101276 17.6647 0.150648 17.7151 0.211375 17.7468C0.280413 17.7826 0.37079 17.7826 0.551541 17.7826H1.75313C1.93388 17.7826 2.02425 17.7826 2.09329 17.7468C2.15402 17.7151 2.20339 17.6647 2.23433 17.6026C2.26951 17.5321 2.26951 17.4398 2.26951 17.2552V16.6659C3.28957 17.5011 4.58438 18.0007 5.99343 18.0007C9.2841 18.0007 11.9517 15.2758 11.9517 11.9145C11.9517 8.55319 9.2841 5.82832 5.99343 5.82832C4.58438 5.82832 3.28957 6.32793 2.26951 7.1632V0.55872C2.26951 0.374089 2.26951 0.281773 2.23433 0.211252C2.20339 0.149221 2.15402 0.0987883 2.09329 0.0671818C2.02425 0.03125 1.93388 0.03125 1.75313 0.03125H0.551541C0.37079 0.03125 0.280413 0.03125 0.211375 0.0671818C0.150648 0.0987883 0.101276 0.149221 0.0703335 0.211252ZM2.26951 11.9145C2.26951 14.0154 3.93677 15.7184 5.99343 15.7184C8.05007 15.7184 9.71735 14.0154 9.71735 11.9145C9.71735 9.81372 8.05007 8.11064 5.99343 8.11064C3.93677 8.11064 2.26951 9.81372 2.26951 11.9145Z" fill="#F25C2B"/>
764
+ </g>
765
+ <defs>
766
+ <clipPath id="clip0_12438_1597">
767
+ <rect width="12" height="18" fill="white"/>
768
+ </clipPath>
769
+ </defs>
770
+ </svg>
771
+ `;
772
+ const cursorBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
773
+ <path d="M47.8458 21.1038L9.34579 7.10383C9.03323 6.99108 8.69504 6.96965 8.37074 7.04203C8.04645 7.11441 7.74947 7.27761 7.51452 7.51256C7.27957 7.74751 7.11636 8.0445 7.04398 8.36879C6.9716 8.69308 6.99304 9.03128 7.10579 9.34383L21.1058 47.8438C21.2281 48.1821 21.4516 48.4744 21.7459 48.6811C22.0403 48.8877 22.3911 48.9987 22.7508 48.9988C23.1013 48.9992 23.4438 48.8943 23.734 48.6977C24.0241 48.5011 24.2486 48.2219 24.3783 47.8963L31.0983 31.0963L47.8983 24.3763C48.2303 24.2504 48.5162 24.0264 48.7179 23.7342C48.9196 23.4419 49.0277 23.0952 49.0277 22.7401C49.0277 22.385 48.9196 22.0383 48.7179 21.746C48.5162 21.4537 48.2303 21.2298 47.8983 21.1038H47.8458ZM29.1033 28.1038L28.4033 28.3838L28.1233 29.0838L22.7508 42.3488L11.6733 11.6713L42.3508 22.7488L29.1033 28.1038Z" fill="#172A41"/>
774
+ </svg>`;
775
+ const closeBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="36" height="37" viewBox="0 0 36 37" fill="none">
776
+ <path d="M27 11.075L25.425 9.5L18 16.925L10.575 9.5L9 11.075L16.425 18.5L9 25.925L10.575 27.5L18 20.075L25.425 27.5L27 25.925L19.575 18.5L27 11.075Z" fill="#A3B2C6"/>
777
+ </svg>`;
778
+ const leftBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
779
+ <path d="M6.64645 2.64645L6.9954 2.2975L7.34889 2.64184L8.06389 3.33834L8.42613 3.69121L8.06918 4.04942L5.12908 7H14H14.5V7.5V8.5V9H14H5.1329L8.06839 11.9328L8.42264 12.2867L8.06818 12.6404L7.35318 13.3539L6.99963 13.7067L6.64645 13.3536L1.64645 8.35355L1.29289 8L1.64645 7.64645L6.64645 2.64645Z" fill="#4E647F" stroke="#4E647F"/>
780
+ </svg>`;
781
+ const rightBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
782
+ <path d="M9.35355 2.64645L9.0046 2.2975L8.65111 2.64184L7.93611 3.33834L7.57387 3.69121L7.93082 4.04942L10.8709 7H2H1.5V7.5V8.5V9H2H10.8671L7.93161 11.9328L7.57736 12.2867L7.93182 12.6404L8.64682 13.3539L9.00037 13.7067L9.35355 13.3536L14.3536 8.35355L14.7071 8L14.3536 7.64645L9.35355 2.64645Z" fill="#4E647F" stroke="#4E647F"/>
783
+ </svg>`;
784
+ const searchIcon = b `<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64" fill="none">
785
+ <path d="M32 54C27.6488 54 23.3953 52.7097 19.7775 50.2923C16.1596 47.875 13.3398 44.439 11.6747 40.419C10.0095 36.3991 9.57386 31.9756 10.4227 27.708C11.2716 23.4404 13.3669 19.5204 16.4437 16.4437C19.5204 13.3669 23.4404 11.2716 27.708 10.4227C31.9756 9.57386 36.3991 10.0095 40.419 11.6747C44.439 13.3398 47.875 16.1596 50.2923 19.7775C52.7097 23.3953 54 27.6488 54 32C53.9931 37.8327 51.6731 43.4244 47.5488 47.5488C43.4244 51.6731 37.8327 53.9931 32 54ZM32 14C28.4399 14 24.9598 15.0557 21.9997 17.0336C19.0397 19.0114 16.7326 21.8226 15.3702 25.1117C14.0078 28.4008 13.6513 32.02 14.3459 35.5116C15.0404 39.0033 16.7547 42.2106 19.2721 44.7279C21.7894 47.2453 24.9967 48.9596 28.4884 49.6541C31.98 50.3487 35.5992 49.9922 38.8883 48.6298C42.1774 47.2675 44.9886 44.9604 46.9665 42.0003C48.9443 39.0402 50 35.5601 50 32C49.9947 27.2277 48.0966 22.6524 44.7221 19.2779C41.3476 15.9034 36.7723 14.0053 32 14Z" fill="#172A41"/>
786
+ <path d="M44 34C43.4696 34 42.9609 33.7893 42.5858 33.4142C42.2107 33.0391 42 32.5304 42 32C41.9968 29.3488 40.9422 26.8071 39.0676 24.9324C37.1929 23.0578 34.6512 22.0032 32 22C31.4696 22 30.9609 21.7893 30.5858 21.4142C30.2107 21.0391 30 20.5304 30 20C30 19.4696 30.2107 18.9609 30.5858 18.5858C30.9609 18.2107 31.4696 18 32 18C35.7117 18.0042 39.2702 19.4806 41.8948 22.1052C44.5194 24.7298 45.9958 28.2883 46 32C46 32.5304 45.7893 33.0391 45.4142 33.4142C45.0391 33.7893 44.5304 34 44 34Z" fill="#F25C2B"/>
787
+ <path d="M59.9997 62.0007C59.4693 62.0006 58.9607 61.7898 58.5857 61.4147L48.9657 51.7947C48.78 51.6086 48.6328 51.3878 48.5324 51.1448C48.4321 50.9019 48.3806 50.6415 48.3809 50.3786C48.3811 50.1157 48.4332 49.8555 48.5341 49.6127C48.6349 49.3699 48.7826 49.1494 48.9687 48.9637C49.1548 48.778 49.3756 48.6308 49.6186 48.5305C49.8616 48.4301 50.1219 48.3786 50.3848 48.3789C50.6477 48.3792 50.9079 48.4312 51.1507 48.5321C51.3935 48.633 51.614 48.7806 51.7997 48.9667L61.4197 58.5867C61.6997 58.8668 61.8902 59.2237 61.9671 59.6121C62.0441 60.0006 62.004 60.4032 61.8519 60.7688C61.6998 61.1345 61.4426 61.4467 61.1129 61.666C60.7831 61.8853 60.3957 62.0018 59.9997 62.0007Z" fill="#172A41"/>
788
+ </svg>`;
789
+ const shopGPTIcon = b `<svg xmlns="http://www.w3.org/2000/svg" width="105" height="36" viewBox="0 0 105 36" fill="none">
790
+ <path d="M10.1239 4.77861C10.0338 3.97936 9.66197 3.36022 9.00845 2.9212C8.35493 2.47655 7.53239 2.25422 6.54084 2.25422C5.83099 2.25422 5.2169 2.36679 4.69859 2.59193C4.18028 2.81144 3.77746 3.11538 3.49014 3.50375C3.20845 3.88649 3.06761 4.3227 3.06761 4.81238C3.06761 5.22326 3.16338 5.57786 3.35493 5.87617C3.55211 6.17448 3.80845 6.42495 4.12394 6.62758C4.44507 6.82458 4.78873 6.99062 5.15493 7.1257C5.52113 7.25516 5.87324 7.3621 6.21127 7.44653L7.90141 7.88555C8.45352 8.02064 9.01972 8.20356 9.6 8.43433C10.1803 8.6651 10.7183 8.96904 11.2141 9.34615C11.7099 9.72326 12.1099 10.1904 12.4141 10.7477C12.7239 11.3049 12.8789 11.9719 12.8789 12.7486C12.8789 13.728 12.6254 14.5976 12.1183 15.3574C11.6169 16.1173 10.8873 16.7167 9.92958 17.1557C8.97746 17.5947 7.82535 17.8143 6.47324 17.8143C5.17746 17.8143 4.05634 17.6088 3.10986 17.1979C2.16338 16.7871 1.42254 16.2045 0.887324 15.4503C0.352113 14.6904 0.056338 13.7899 0 12.7486H2.61972C2.67042 13.3734 2.87324 13.894 3.22817 14.3105C3.58873 14.7214 4.04789 15.0281 4.60563 15.2308C5.16901 15.4278 5.78591 15.5263 6.45634 15.5263C7.19437 15.5263 7.8507 15.4109 8.42535 15.1801C9.00563 14.9437 9.46197 14.6173 9.79437 14.2007C10.1268 13.7786 10.293 13.2861 10.293 12.7233C10.293 12.2111 10.1465 11.7917 9.85352 11.4653C9.5662 11.1388 9.17465 10.8687 8.67887 10.6548C8.18873 10.4409 7.6338 10.2523 7.01408 10.0891L4.96901 9.53189C3.5831 9.15478 2.48451 8.60038 1.67324 7.86867C0.867606 7.13696 0.464789 6.16886 0.464789 4.96435C0.464789 3.9681 0.735211 3.0985 1.27606 2.35553C1.8169 1.61257 2.5493 1.03565 3.47324 0.624766C4.39718 0.208255 5.43944 0 6.6 0C7.77183 0 8.80563 0.205441 9.70141 0.616323C10.6028 1.02721 11.3127 1.59287 11.831 2.31332C12.3493 3.02814 12.6197 3.84991 12.6423 4.77861H10.1239Z" fill="#172A41"/>
791
+ <path d="M18.1924 9.82739V17.5272H15.6656V0.236398H18.1586V6.66979H18.3191C18.6233 5.97186 19.0881 5.41745 19.7135 5.00657C20.3388 4.59569 21.1557 4.39024 22.1642 4.39024C23.0543 4.39024 23.8318 4.57317 24.4966 4.93902C25.167 5.30488 25.6853 5.85084 26.0515 6.57692C26.4233 7.29737 26.6093 8.19794 26.6093 9.27861V17.5272H24.0825V9.58255C24.0825 8.63133 23.8374 7.894 23.3473 7.37054C22.8571 6.84146 22.1755 6.57692 21.3022 6.57692C20.705 6.57692 20.1698 6.70356 19.6966 6.95685C19.229 7.21013 18.86 7.58161 18.5895 8.07129C18.3247 8.55535 18.1924 9.14071 18.1924 9.82739Z" fill="#172A41"/>
792
+ <path d="M35.3178 17.7889C34.1009 17.7889 33.0389 17.5103 32.1319 16.9531C31.2248 16.3959 30.5206 15.6163 30.0192 14.6144C29.5178 13.6126 29.2671 12.4418 29.2671 11.1023C29.2671 9.75704 29.5178 8.58068 30.0192 7.57317C30.5206 6.56567 31.2248 5.7833 32.1319 5.22608C33.0389 4.66886 34.1009 4.39024 35.3178 4.39024C36.5347 4.39024 37.5967 4.66886 38.5037 5.22608C39.4108 5.7833 40.115 6.56567 40.6164 7.57317C41.1178 8.58068 41.3685 9.75704 41.3685 11.1023C41.3685 12.4418 41.1178 13.6126 40.6164 14.6144C40.115 15.6163 39.4108 16.3959 38.5037 16.9531C37.5967 17.5103 36.5347 17.7889 35.3178 17.7889ZM35.3263 15.6698C36.115 15.6698 36.7685 15.4615 37.2868 15.045C37.8051 14.6285 38.1882 14.0741 38.4361 13.3818C38.6896 12.6895 38.8164 11.9268 38.8164 11.0938C38.8164 10.2664 38.6896 9.50657 38.4361 8.81426C38.1882 8.11632 37.8051 7.55629 37.2868 7.13415C36.7685 6.71201 36.115 6.50094 35.3263 6.50094C34.5319 6.50094 33.8727 6.71201 33.3488 7.13415C32.8305 7.55629 32.4446 8.11632 32.191 8.81426C31.9432 9.50657 31.8192 10.2664 31.8192 11.0938C31.8192 11.9268 31.9432 12.6895 32.191 13.3818C32.4446 14.0741 32.8305 14.6285 33.3488 15.045C33.8727 15.4615 34.5319 15.6698 35.3263 15.6698Z" fill="#172A41"/>
793
+ <path d="M44.058 22.3902V4.5591H46.5257V6.66135H46.7369C46.8834 6.39118 47.0947 6.0788 47.3707 5.7242C47.6468 5.36961 48.0299 5.06004 48.52 4.7955C49.0102 4.52533 49.6581 4.39024 50.4637 4.39024C51.5116 4.39024 52.4468 4.65478 53.2693 5.18387C54.0919 5.71295 54.7369 6.47561 55.2045 7.47186C55.6778 8.46811 55.9144 9.66698 55.9144 11.0685C55.9144 12.47 55.6806 13.6717 55.213 14.6735C54.7454 15.6698 54.1031 16.4381 53.2862 16.9784C52.4693 17.5131 51.5369 17.7805 50.489 17.7805C49.7003 17.7805 49.0552 17.6482 48.5538 17.3837C48.058 17.1191 47.6693 16.8096 47.3876 16.455C47.1059 16.1004 46.889 15.7852 46.7369 15.5094H46.5848V22.3902H44.058ZM46.5341 11.0432C46.5341 11.955 46.6665 12.7542 46.9313 13.4409C47.1961 14.1276 47.5792 14.6651 48.0806 15.0535C48.582 15.4362 49.1961 15.6276 49.9228 15.6276C50.6778 15.6276 51.3088 15.4278 51.8158 15.0281C52.3228 14.6229 52.7059 14.0741 52.9651 13.3818C53.2299 12.6895 53.3623 11.9099 53.3623 11.0432C53.3623 10.1876 53.2327 9.41932 52.9735 8.73827C52.72 8.05722 52.3369 7.5197 51.8242 7.1257C51.3172 6.73171 50.6834 6.53471 49.9228 6.53471C49.1904 6.53471 48.5707 6.72326 48.0637 7.10038C47.5623 7.47749 47.182 8.00375 46.9228 8.67917C46.6637 9.3546 46.5341 10.1426 46.5341 11.0432Z" fill="#172A41"/>
794
+ <path d="M70.53 5.69887C70.3666 5.18668 70.1469 4.72795 69.8708 4.3227C69.6004 3.91182 69.2765 3.56285 68.899 3.2758C68.5215 2.98311 68.0905 2.76079 67.606 2.60882C67.1272 2.45685 66.6004 2.38086 66.0258 2.38086C65.0511 2.38086 64.1722 2.63133 63.3891 3.13227C62.606 3.63321 61.9863 4.36773 61.53 5.33583C61.0793 6.29831 60.8539 7.47749 60.8539 8.87336C60.8539 10.2749 61.0821 11.4597 61.5384 12.4278C61.9948 13.3959 62.6201 14.1304 63.4145 14.6313C64.2089 15.1323 65.1131 15.3827 66.1272 15.3827C67.068 15.3827 67.8877 15.1914 68.5863 14.8086C69.2905 14.4259 69.8342 13.8856 70.2173 13.1876C70.606 12.4841 70.8004 11.6567 70.8004 10.7054L71.4765 10.8321H66.5243V8.67917H73.3272V10.6463C73.3272 12.0985 73.0173 13.3593 72.3976 14.4287C71.7835 15.4925 70.9328 16.3143 69.8455 16.894C68.7638 17.4737 67.5243 17.7636 66.1272 17.7636C64.561 17.7636 63.1863 17.4034 62.0032 16.6829C60.8258 15.9625 59.9074 14.9409 59.2483 13.6182C58.5891 12.2899 58.2596 10.7139 58.2596 8.89024C58.2596 7.51126 58.4511 6.27298 58.8342 5.17542C59.2173 4.07786 59.7553 3.14634 60.4483 2.38086C61.1469 1.60976 61.9666 1.02158 62.9074 0.616323C63.8539 0.205441 64.8877 0 66.0089 0C66.9441 0 67.8145 0.137899 68.6201 0.413696C69.4314 0.689493 70.1525 1.08068 70.7835 1.58724C71.4201 2.09381 71.9469 2.69606 72.3638 3.394C72.7807 4.0863 73.0624 4.8546 73.2089 5.69887H70.53Z" fill="#172A41"/>
795
+ <path d="M76.5111 17.5272V0.236398H82.6801C84.0266 0.236398 85.1421 0.481238 86.0266 0.970919C86.9111 1.4606 87.573 2.13039 88.0125 2.9803C88.4519 3.82458 88.6716 4.7758 88.6716 5.83396C88.6716 6.89775 88.4491 7.8546 88.004 8.7045C87.5646 9.54878 86.8998 10.2186 86.0097 10.7139C85.1252 11.2036 84.0125 11.4484 82.6716 11.4484H78.4294V9.2364H82.435C83.2857 9.2364 83.9759 9.09006 84.5054 8.79737C85.035 8.49906 85.4237 8.09381 85.6716 7.58161C85.9195 7.06942 86.0435 6.48687 86.0435 5.83396C86.0435 5.18105 85.9195 4.60131 85.6716 4.09475C85.4237 3.58818 85.0322 3.19137 84.497 2.90432C83.9674 2.61726 83.2688 2.47373 82.4012 2.47373H79.1223V17.5272H76.5111Z" fill="#172A41"/>
796
+ <path d="M90.7485 2.48218V0.236398H104.143V2.48218H98.7429V17.5272H96.14V2.48218H90.7485Z" fill="#172A41"/>
797
+ <path d="M0.269894 36V28.1989H1.34947V29.1186H1.4419C1.50599 29.0004 1.59842 28.8637 1.71919 28.7086C1.83996 28.5535 2.00757 28.418 2.22201 28.3023C2.43644 28.1841 2.71989 28.125 3.07236 28.125C3.53081 28.125 3.93996 28.2407 4.29982 28.4722C4.65968 28.7037 4.9419 29.0373 5.14648 29.4732C5.35352 29.9091 5.45704 30.4336 5.45704 31.0467C5.45704 31.6599 5.35475 32.1856 5.15018 32.6239C4.9456 33.0598 4.66461 33.3959 4.30722 33.6323C3.94982 33.8663 3.5419 33.9832 3.08345 33.9832C2.73838 33.9832 2.45616 33.9254 2.2368 33.8096C2.01989 33.6939 1.84982 33.5585 1.72658 33.4033C1.60335 33.2482 1.50845 33.1103 1.4419 32.9896H1.37535V36H0.269894ZM1.35317 31.0356C1.35317 31.4346 1.41109 31.7842 1.52694 32.0847C1.64278 32.3851 1.81039 32.6203 2.02975 32.7902C2.24912 32.9576 2.51778 33.0413 2.83574 33.0413C3.16602 33.0413 3.44208 32.9539 3.66391 32.7791C3.88574 32.6018 4.05335 32.3617 4.16673 32.0588C4.28257 31.7559 4.34049 31.4149 4.34049 31.0356C4.34049 30.6614 4.2838 30.3252 4.17042 30.0273C4.05951 29.7293 3.8919 29.4941 3.66761 29.3218C3.44577 29.1494 3.16849 29.0632 2.83574 29.0632C2.51532 29.0632 2.24419 29.1457 2.02236 29.3107C1.80299 29.4757 1.63662 29.7059 1.52324 30.0014C1.40986 30.2969 1.35317 30.6417 1.35317 31.0356Z" fill="#4E647F"/>
798
+ <path d="M8.95679 33.9869C8.4244 33.9869 7.95978 33.865 7.56295 33.6212C7.16612 33.3775 6.85802 33.0364 6.63866 32.5981C6.41929 32.1598 6.30961 31.6476 6.30961 31.0615C6.30961 30.473 6.41929 29.9583 6.63866 29.5175C6.85802 29.0767 7.16612 28.7345 7.56295 28.4907C7.95978 28.2469 8.4244 28.125 8.95679 28.125C9.48919 28.125 9.9538 28.2469 10.3506 28.4907C10.7475 28.7345 11.0556 29.0767 11.2749 29.5175C11.4943 29.9583 11.604 30.473 11.604 31.0615C11.604 31.6476 11.4943 32.1598 11.2749 32.5981C11.0556 33.0364 10.7475 33.3775 10.3506 33.6212C9.9538 33.865 9.48919 33.9869 8.95679 33.9869ZM8.96049 33.0598C9.30556 33.0598 9.59147 32.9687 9.81824 32.7865C10.045 32.6042 10.2126 32.3617 10.3211 32.0588C10.432 31.7559 10.4874 31.4223 10.4874 31.0578C10.4874 30.6958 10.432 30.3634 10.3211 30.0605C10.2126 29.7552 10.045 29.5101 9.81824 29.3255C9.59147 29.1408 9.30556 29.0484 8.96049 29.0484C8.61295 29.0484 8.32457 29.1408 8.09535 29.3255C7.86859 29.5101 7.69975 29.7552 7.58883 30.0605C7.48038 30.3634 7.42616 30.6958 7.42616 31.0578C7.42616 31.4223 7.48038 31.7559 7.58883 32.0588C7.69975 32.3617 7.86859 32.6042 8.09535 32.7865C8.32457 32.9687 8.61295 33.0598 8.96049 33.0598Z" fill="#4E647F"/>
799
+ <path d="M13.7653 33.8724L12.0942 28.1989H13.2366L14.3495 32.3654H14.405L15.5215 28.1989H16.6639L17.7731 32.3469H17.8285L18.934 28.1989H20.0764L18.409 33.8724H17.2814L16.1278 29.7761H16.0428L14.8893 33.8724H13.7653Z" fill="#4E647F"/>
800
+ <path d="M23.2693 33.9869C22.7098 33.9869 22.2279 33.8675 21.8237 33.6286C21.422 33.3873 21.1114 33.0487 20.892 32.6129C20.6751 32.1745 20.5667 31.6611 20.5667 31.0726C20.5667 30.4914 20.6751 29.9792 20.892 29.536C21.1114 29.0928 21.417 28.7468 21.8089 28.4981C22.2033 28.2494 22.6642 28.125 23.1917 28.125C23.5121 28.125 23.8227 28.1779 24.1234 28.2838C24.4241 28.3897 24.694 28.5559 24.9331 28.7825C25.1721 29.009 25.3607 29.3033 25.4987 29.6653C25.6367 30.0248 25.7058 30.4619 25.7058 30.9765V31.3681H21.1915V30.5407H24.6225C24.6225 30.2501 24.5633 29.9928 24.445 29.7687C24.3267 29.5422 24.1603 29.3636 23.9459 29.2331C23.7339 29.1026 23.485 29.0373 23.1991 29.0373C22.8885 29.0373 22.6174 29.1137 22.3857 29.2664C22.1565 29.4166 21.979 29.6136 21.8533 29.8574C21.7301 30.0987 21.6684 30.3609 21.6684 30.6441V31.2905C21.6684 31.6697 21.735 31.9923 21.8681 32.2583C22.0036 32.5242 22.1922 32.7274 22.4338 32.8677C22.6753 33.0056 22.9575 33.0746 23.2804 33.0746C23.4899 33.0746 23.6809 33.045 23.8535 32.9859C24.026 32.9244 24.1751 32.8333 24.3008 32.7126C24.4265 32.5919 24.5227 32.443 24.5892 32.2657L25.6355 32.454C25.5517 32.7618 25.4014 33.0315 25.1845 33.263C24.97 33.492 24.7001 33.6705 24.3748 33.7985C24.0519 33.9241 23.6834 33.9869 23.2693 33.9869Z" fill="#4E647F"/>
801
+ <path d="M26.8014 33.8724V28.1989H27.8699V29.1001H27.9291C28.0326 28.7948 28.215 28.5547 28.4762 28.3799C28.74 28.2026 29.0382 28.1139 29.371 28.1139C29.44 28.1139 29.5213 28.1164 29.615 28.1213C29.7111 28.1262 29.7863 28.1324 29.8405 28.1398V29.1962C29.7961 29.1839 29.7173 29.1703 29.6039 29.1555C29.4905 29.1383 29.3771 29.1297 29.2637 29.1297C29.0025 29.1297 28.7696 29.1851 28.565 29.2959C28.3629 29.4043 28.2027 29.5557 28.0843 29.7502C27.966 29.9423 27.9069 30.1615 27.9069 30.4077V33.8724H26.8014Z" fill="#4E647F"/>
802
+ <path d="M32.9104 33.9869C32.3509 33.9869 31.8691 33.8675 31.4649 33.6286C31.0631 33.3873 30.7525 33.0487 30.5332 32.6129C30.3163 32.1745 30.2078 31.6611 30.2078 31.0726C30.2078 30.4914 30.3163 29.9792 30.5332 29.536C30.7525 29.0928 31.0582 28.7468 31.4501 28.4981C31.8444 28.2494 32.3053 28.125 32.8328 28.125C33.1532 28.125 33.4638 28.1779 33.7645 28.2838C34.0652 28.3897 34.3351 28.5559 34.5742 28.7825C34.8133 29.009 35.0018 29.3033 35.1399 29.6653C35.2779 30.0248 35.3469 30.4619 35.3469 30.9765V31.3681H30.8326V30.5407H34.2636C34.2636 30.2501 34.2045 29.9928 34.0862 29.7687C33.9678 29.5422 33.8015 29.3636 33.587 29.2331C33.3751 29.1026 33.1261 29.0373 32.8402 29.0373C32.5296 29.0373 32.2585 29.1137 32.0268 29.2664C31.7976 29.4166 31.6201 29.6136 31.4944 29.8574C31.3712 30.0987 31.3096 30.3609 31.3096 30.6441V31.2905C31.3096 31.6697 31.3761 31.9923 31.5092 32.2583C31.6448 32.5242 31.8333 32.7274 32.0749 32.8677C32.3164 33.0056 32.5987 33.0746 32.9215 33.0746C33.1311 33.0746 33.3221 33.045 33.4946 32.9859C33.6671 32.9244 33.8163 32.8333 33.942 32.7126C34.0677 32.5919 34.1638 32.443 34.2303 32.2657L35.2766 32.454C35.1928 32.7618 35.0425 33.0315 34.8256 33.263C34.6112 33.492 34.3413 33.6705 34.0159 33.7985C33.693 33.9241 33.3245 33.9869 32.9104 33.9869Z" fill="#4E647F"/>
803
+ <path d="M38.5684 33.9832C38.11 33.9832 37.7008 33.8663 37.341 33.6323C36.9836 33.3959 36.7026 33.0598 36.498 32.6239C36.2959 32.1856 36.1948 31.6599 36.1948 31.0467C36.1948 30.4336 36.2971 29.9091 36.5017 29.4732C36.7087 29.0373 36.9922 28.7037 37.3521 28.4722C37.7119 28.2407 38.1198 28.125 38.5758 28.125C38.9283 28.125 39.2117 28.1841 39.4262 28.3023C39.6431 28.418 39.8107 28.5535 39.929 28.7086C40.0498 28.8637 40.1434 29.0004 40.21 29.1186H40.2765V26.3077H41.382V33.8724H40.3024V32.9896H40.21C40.1434 33.1103 40.0473 33.2482 39.9216 33.4033C39.7984 33.5585 39.6283 33.6939 39.4114 33.8096C39.1945 33.9254 38.9135 33.9832 38.5684 33.9832ZM38.8124 33.0413C39.1304 33.0413 39.3991 32.9576 39.6184 32.7902C39.8403 32.6203 40.0079 32.3851 40.1213 32.0847C40.2371 31.7842 40.295 31.4346 40.295 31.0356C40.295 30.6417 40.2383 30.2969 40.1249 30.0014C40.0116 29.7059 39.8452 29.4757 39.6258 29.3107C39.4065 29.1457 39.1353 29.0632 38.8124 29.0632C38.4797 29.0632 38.2024 29.1494 37.9806 29.3218C37.7587 29.4941 37.5911 29.7293 37.4778 30.0273C37.3668 30.3252 37.3114 30.6614 37.3114 31.0356C37.3114 31.4149 37.3681 31.7559 37.4815 32.0588C37.5948 32.3617 37.7624 32.6018 37.9843 32.7791C38.2086 32.9539 38.4846 33.0413 38.8124 33.0413Z" fill="#4E647F"/>
804
+ <path d="M45.542 33.8724V26.3077H46.6475V29.1186H46.7141C46.7781 29.0004 46.8706 28.8637 46.9913 28.7086C47.1121 28.5535 47.2797 28.418 47.4942 28.3023C47.7086 28.1841 47.9921 28.125 48.3445 28.125C48.803 28.125 49.2121 28.2407 49.572 28.4722C49.9318 28.7037 50.2141 29.0373 50.4186 29.4732C50.6257 29.9091 50.7292 30.4336 50.7292 31.0467C50.7292 31.6599 50.6269 32.1856 50.4223 32.6239C50.2178 33.0598 49.9368 33.3959 49.5794 33.6323C49.222 33.8663 48.8141 33.9832 48.3556 33.9832C48.0105 33.9832 47.7283 33.9254 47.509 33.8096C47.292 33.6939 47.122 33.5585 46.9987 33.4033C46.8755 33.2482 46.7806 33.1103 46.7141 32.9896H46.6216V33.8724H45.542ZM46.6253 31.0356C46.6253 31.4346 46.6832 31.7842 46.7991 32.0847C46.9149 32.3851 47.0825 32.6203 47.3019 32.7902C47.5213 32.9576 47.7899 33.0413 48.1079 33.0413C48.4382 33.0413 48.7142 32.9539 48.9361 32.7791C49.1579 32.6018 49.3255 32.3617 49.4389 32.0588C49.5547 31.7559 49.6126 31.4149 49.6126 31.0356C49.6126 30.6614 49.556 30.3252 49.4426 30.0273C49.3317 29.7293 49.1641 29.4941 48.9398 29.3218C48.7179 29.1494 48.4406 29.0632 48.1079 29.0632C47.7875 29.0632 47.5163 29.1457 47.2945 29.3107C47.0751 29.4757 46.9088 29.7059 46.7954 30.0014C46.682 30.2969 46.6253 30.6417 46.6253 31.0356Z" fill="#4E647F"/>
805
+ <path d="M52.3452 36C52.1801 36 52.0297 35.9865 51.8942 35.9594C51.7586 35.9347 51.6576 35.9077 51.591 35.8781L51.8572 34.9731C52.0593 35.0273 52.2393 35.0507 52.397 35.0433C52.5547 35.0359 52.694 34.9768 52.8148 34.866C52.938 34.7552 53.0465 34.5742 53.1401 34.3231L53.2769 33.9463L51.1991 28.1989H52.3822L53.8204 32.6018H53.8796L55.3178 28.1989H56.5046L54.1642 34.6296C54.0558 34.9251 53.9178 35.1751 53.7502 35.3795C53.5826 35.5863 53.3829 35.7414 53.1512 35.8449C52.9195 35.9483 52.6509 36 52.3452 36Z" fill="#4E647F"/>
806
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M60.5232 25.7954C60.507 25.8274 60.507 25.8693 60.507 25.9532V33.5339C60.507 33.6178 60.507 33.6597 60.5232 33.6917C60.5374 33.7198 60.56 33.7428 60.5879 33.7571C60.6196 33.7734 60.661 33.7734 60.7439 33.7734H61.2952C61.3781 33.7734 61.4196 33.7734 61.4513 33.7571C61.4791 33.7428 61.5018 33.7198 61.516 33.6917C61.5321 33.6597 61.5321 33.6178 61.5321 33.5339V33.2664C62.0001 33.6456 62.5941 33.8724 63.2406 33.8724C64.7502 33.8724 65.9741 32.6352 65.9741 31.1091C65.9741 29.5829 64.7502 28.3457 63.2406 28.3457C62.5941 28.3457 62.0001 28.5726 61.5321 28.9518V25.9532C61.5321 25.8693 61.5321 25.8274 61.516 25.7954C61.5018 25.7672 61.4791 25.7443 61.4513 25.73C61.4196 25.7137 61.3781 25.7137 61.2952 25.7137H60.7439C60.661 25.7137 60.6196 25.7137 60.5879 25.73C60.56 25.7443 60.5374 25.7672 60.5232 25.7954ZM61.5321 31.1091C61.5321 32.0629 62.297 32.8362 63.2406 32.8362C64.1841 32.8362 64.949 32.0629 64.949 31.1091C64.949 30.1552 64.1841 29.382 63.2406 29.382C62.297 29.382 61.5321 30.1552 61.5321 31.1091Z" fill="#F25C2B"/>
807
+ <path d="M88.2382 28.5703C88.2221 28.6023 88.2221 28.6442 88.2221 28.7281V31.3302C88.2196 31.5036 88.1831 31.675 88.1149 31.8353C88.0442 32.0015 87.9407 32.1525 87.8101 32.2797C87.7732 32.3156 87.7344 32.3494 87.6938 32.381C87.585 32.4797 87.4613 32.5596 87.3276 32.6173C87.1653 32.6873 86.9915 32.7234 86.8158 32.7234C86.6403 32.7234 86.4663 32.6873 86.3041 32.6173C86.1702 32.5595 86.0463 32.4795 85.9374 32.3805C85.897 32.3491 85.8584 32.3154 85.8217 32.2797C85.6911 32.1525 85.5875 32.0015 85.5169 31.8353C85.4487 31.675 85.4124 31.5036 85.41 31.3302L85.4097 28.7282C85.4097 28.6443 85.4096 28.6024 85.3935 28.5704C85.3793 28.5422 85.3567 28.5193 85.3288 28.505C85.2971 28.4887 85.2557 28.4887 85.1727 28.4887H84.6215C84.5386 28.4887 84.4971 28.4887 84.4654 28.505C84.4376 28.5193 84.4149 28.5422 84.4007 28.5704C84.3846 28.6024 84.3846 28.6443 84.3846 28.7282V31.3302C84.3846 31.6628 84.4475 31.9922 84.5697 32.2995C84.5786 32.322 84.5878 32.3443 84.5973 32.3664C84.7182 32.6474 84.8874 32.9033 85.0967 33.1213C85.3224 33.3566 85.5905 33.5431 85.8855 33.6704C86.1804 33.7977 86.4966 33.8633 86.8158 33.8633C87.1351 33.8633 87.4513 33.7977 87.7462 33.6704C88.0412 33.5431 88.3093 33.3566 88.535 33.1213C88.7443 32.9033 88.9135 32.6474 89.0344 32.3664C89.0439 32.3443 89.0531 32.322 89.0621 32.2995C89.1842 31.9922 89.2471 31.6628 89.2471 31.3302V28.7281C89.2471 28.6442 89.2471 28.6023 89.231 28.5703C89.2168 28.5421 89.1941 28.5192 89.1663 28.5049C89.1346 28.4886 89.0931 28.4886 89.0102 28.4886H88.459C88.376 28.4886 88.3346 28.4886 88.3029 28.5049C88.275 28.5192 88.2524 28.5421 88.2382 28.5703Z" fill="#F25C2B"/>
808
+ <path d="M66.8112 25.9393C66.8112 25.8555 66.8112 25.8136 66.8273 25.7815C66.8415 25.7534 66.8642 25.7305 66.8921 25.7161C66.9237 25.6998 66.9652 25.6998 67.0481 25.6998H67.5994C67.6823 25.6998 67.7238 25.6998 67.7554 25.7161C67.7833 25.7305 67.8059 25.7534 67.8201 25.7815C67.8363 25.8136 67.8363 25.8555 67.8363 25.9393V33.5201C67.8363 33.6039 67.8363 33.6458 67.8201 33.6778C67.8059 33.706 67.7833 33.7289 67.7554 33.7433C67.7238 33.7595 67.6823 33.7595 67.5994 33.7595H67.0481C66.9652 33.7595 66.9237 33.7595 66.8921 33.7433C66.8642 33.7289 66.8415 33.706 66.8273 33.6778C66.8112 33.6458 66.8112 33.6039 66.8112 33.5201V25.9393Z" fill="#F25C2B"/>
809
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M71.4069 32.827C72.3504 32.827 73.1154 32.0538 73.1154 31.0999C73.1154 30.1461 72.3504 29.3728 71.4069 29.3728C70.4633 29.3728 69.6984 30.1461 69.6984 31.0999C69.6984 32.0538 70.4633 32.827 71.4069 32.827ZM71.4069 33.8633C72.9166 33.8633 74.1404 32.6261 74.1404 31.0999C74.1404 29.5738 72.9166 28.3366 71.4069 28.3366C69.8972 28.3366 68.6734 29.5738 68.6734 31.0999C68.6734 32.6261 69.8972 33.8633 71.4069 33.8633Z" fill="#F25C2B"/>
810
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M80.8045 32.827C81.748 32.827 82.5129 32.0538 82.5129 31.0999C82.5129 30.1461 81.748 29.3728 80.8045 29.3728C79.8609 29.3728 79.096 30.1461 79.096 31.0999C79.096 32.0538 79.8609 32.827 80.8045 32.827ZM80.8045 33.8633C82.3141 33.8633 83.538 32.6261 83.538 31.0999C83.538 29.5738 82.3141 28.3366 80.8045 28.3366C79.2948 28.3366 78.0709 29.5738 78.0709 31.0999C78.0709 32.6261 79.2948 33.8633 80.8045 33.8633Z" fill="#F25C2B"/>
811
+ <path d="M75.2265 25.6998C75.1436 25.6998 75.1021 25.6998 75.0705 25.7161C75.0426 25.7305 75.02 25.7534 75.0058 25.7815C74.9896 25.8135 74.9896 25.8555 74.9896 25.9393V26.9083H74.6394C74.5593 26.9083 74.5183 26.9086 74.4872 26.9247C74.4593 26.939 74.4367 26.9619 74.4225 26.99C74.4063 27.0221 74.4063 27.064 74.4063 27.1478V27.7051C74.4063 27.7889 74.4063 27.8308 74.4225 27.8628C74.4367 27.891 74.4593 27.9139 74.4872 27.9282C74.5188 27.9446 74.5603 27.9446 74.6432 27.9446H74.9896V32.0994H74.9882C74.9878 32.1063 74.9874 32.1131 74.987 32.12C74.9876 32.1359 74.9885 32.1518 74.9896 32.1676V32.2073L74.9918 32.2072C75.0376 33.0766 75.7476 33.7581 76.6088 33.7595C76.7762 33.7594 76.9423 33.733 77.1013 33.6816C77.1703 33.6593 77.2245 33.5768 77.2243 33.5035L77.2261 32.7371C77.2261 32.7257 77.224 32.7075 77.2211 32.6964C77.2206 32.6945 77.22 32.6924 77.2194 32.6903C77.2148 32.6737 77.2005 32.6492 77.1865 32.6391C77.1828 32.6365 77.1347 32.6088 77.0944 32.6334C77.0512 32.6536 77.0505 32.654 77.0498 32.6543C77.0388 32.6596 77.0016 32.6737 76.9842 32.6839C76.8335 32.7484 76.8109 32.7469 76.7666 32.7532C76.7363 32.7575 76.7058 32.7596 76.6752 32.7596C76.6174 32.7596 76.56 32.752 76.5042 32.7369C76.4485 32.7218 76.3949 32.6993 76.3449 32.6702C76.3181 32.6523 76.2927 32.6326 76.2687 32.6111C76.2546 32.6011 76.241 32.5905 76.2278 32.5793C76.2212 32.5744 76.2146 32.5693 76.2081 32.5641C76.2064 32.5618 76.2047 32.5596 76.203 32.5573C76.0832 32.4441 76.0151 32.2858 76.0147 32.12C76.0151 32.1146 76.0157 32.1092 76.0163 32.1039C76.0157 32.0999 76.0152 32.0959 76.0147 32.092V27.9446H76.9737C77.0566 27.9446 77.0981 27.9446 77.1298 27.9282C77.1576 27.9139 77.1803 27.891 77.1945 27.8628C77.2106 27.8308 77.2106 27.7889 77.2106 27.7051V27.1478C77.2106 27.064 77.2106 27.0221 77.1945 26.99C77.1803 26.9619 77.1576 26.939 77.1298 26.9247C77.0981 26.9083 77.0566 26.9083 76.9737 26.9083H76.0147V25.9393C76.0147 25.8555 76.0147 25.8135 75.9985 25.7815C75.9843 25.7534 75.9617 25.7305 75.9338 25.7161C75.9021 25.6998 75.8607 25.6998 75.7778 25.6998H75.2265Z" fill="#F25C2B"/>
812
+ <path d="M90.323 25.7117C90.2401 25.7117 90.1986 25.7117 90.1669 25.7281C90.1391 25.7424 90.1165 25.7653 90.1022 25.7934C90.0861 25.8255 90.0861 25.8674 90.0861 25.9512V26.9203H89.7359C89.6558 26.9203 89.6148 26.9205 89.5836 26.9366C89.5558 26.9509 89.5331 26.9738 89.5189 27.002C89.5028 27.034 89.5028 27.0759 89.5028 27.1597V27.717C89.5028 27.8008 89.5028 27.8427 89.5189 27.8748C89.5331 27.9029 89.5558 27.9258 89.5836 27.9402C89.6153 27.9565 89.6568 27.9565 89.7397 27.9565H90.0861V32.1113H90.0847C90.0843 32.1182 90.0838 32.1251 90.0835 32.1319C90.0841 32.1478 90.085 32.1637 90.0861 32.1795V32.2192L90.0883 32.2191C90.1341 33.0885 90.844 33.7701 91.7052 33.7715C91.8727 33.7713 92.0388 33.745 92.1978 33.6936C92.2668 33.6713 92.321 33.5887 92.3208 33.5154L92.3225 32.749C92.3226 32.7376 92.3205 32.7194 92.3176 32.7084C92.317 32.7064 92.3165 32.7043 92.3159 32.7022C92.3113 32.6856 92.297 32.6611 92.283 32.651C92.2793 32.6484 92.2311 32.6207 92.1908 32.6453C92.1477 32.6656 92.147 32.6659 92.1463 32.6662C92.1353 32.6715 92.0981 32.6856 92.0807 32.6958C91.9299 32.7603 91.9074 32.7589 91.8631 32.7651C91.8328 32.7694 91.8023 32.7716 91.7716 32.7716C91.7139 32.7716 91.6565 32.7639 91.6007 32.7488C91.5449 32.7337 91.4914 32.7113 91.4414 32.6821C91.4146 32.6643 91.3891 32.6445 91.3652 32.623C91.3511 32.613 91.3375 32.6024 91.3243 32.5912C91.3176 32.5863 91.3111 32.5812 91.3046 32.576C91.3029 32.5738 91.3012 32.5715 91.2995 32.5692C91.1797 32.456 91.1115 32.2977 91.1112 32.1319C91.1116 32.1265 91.1121 32.1212 91.1127 32.1158C91.1122 32.1118 91.1116 32.1079 91.1112 32.1039V27.9565H92.0702C92.1531 27.9565 92.1946 27.9565 92.2262 27.9402C92.2541 27.9258 92.2767 27.9029 92.2909 27.8748C92.3071 27.8427 92.3071 27.8008 92.3071 27.717V27.1597C92.3071 27.0759 92.3071 27.034 92.2909 27.002C92.2767 26.9738 92.2541 26.9509 92.2262 26.9366C92.1946 26.9203 92.1531 26.9203 92.0702 26.9203H91.1112V25.9512C91.1112 25.8674 91.1112 25.8255 91.095 25.7934C91.0808 25.7653 91.0582 25.7424 91.0303 25.7281C90.9986 25.7117 90.9572 25.7117 90.8743 25.7117H90.323Z" fill="#F25C2B"/>
813
+ </svg>`;
814
+
815
+ const chatThreadsStyles = i$3 `
816
+ :host {
817
+ padding: 24px 24px 21px;
818
+ font-family: 'Inter', sans-serif;
819
+ font-size: 16px;
820
+ font-weight: 400;
821
+ background-color: #fff;
822
+
823
+ button {
824
+ border-style: none;
825
+ cursor: pointer;
826
+ }
692
827
  }
693
828
 
694
- .dot {
695
- width: 6px;
696
- height: 6px;
697
- background-color: #b6b6b6;
698
- border-radius: 50%;
699
- animation: bounce 1.2s infinite ease-in-out;
829
+ ::-webkit-scrollbar {
830
+ width: 20px;
700
831
  }
701
832
 
702
- .dot:nth-child(1) {
703
- animation-delay: 0s;
833
+ ::-webkit-scrollbar-track {
834
+ background-color: transparent;
704
835
  }
705
836
 
706
- .dot:nth-child(2) {
707
- animation-delay: 0.2s;
837
+ ::-webkit-scrollbar-thumb {
838
+ background-color: #d6dee1;
839
+ border-radius: 20px;
840
+ border: 6px solid transparent;
841
+ background-clip: content-box;
708
842
  }
709
843
 
710
- .dot:nth-child(3) {
711
- animation-delay: 0.4s;
844
+ ::-webkit-scrollbar-thumb:hover {
845
+ background-color: #a8bbbf;
712
846
  }
713
847
 
714
- @keyframes bounce {
715
- 0%,
716
- 80%,
717
- 100% {
718
- transform: translateY(0);
719
- background-color: #b6b6b6;
720
- }
721
- 40% {
722
- transform: translateY(-4px);
723
- background-color: #8b8b8b;
724
- }
848
+ * {
849
+ box-sizing: border-box;
725
850
  }
726
851
 
727
- .bot-icon {
728
- width: 24px;
729
- height: 24px;
730
- background-color: #f25c2b;
731
- border-radius: 50%;
732
- display: flex;
733
- align-items: center;
734
- justify-content: center;
735
- padding: 5px;
852
+ .line {
853
+ display: block;
854
+ height: 1px;
855
+ background: #dbe2eb;
856
+ margin: 16px 0;
857
+ width: 100%;
736
858
  }
737
859
 
738
- .loader {
739
- display: flex;
740
- flex: 1;
860
+ .btn-new-search {
741
861
  width: 100%;
742
- height: 100%;
743
- align-items: center;
744
- justify-content: center;
745
- z-index: 5000;
862
+ padding: 10px;
863
+ text-align: center;
746
864
 
747
- .spinner {
748
- /* --webkit-animation: spin 1s linear infinite; */
749
- animation: 1s linear infinite spin;
750
- border-radius: 50%;
751
- border: 5px solid #f9d5ba;
752
- border-top: 5px solid #555;
753
- width: 30px;
754
- height: 30px;
755
- margin: 10px;
756
- }
757
- }
865
+ border-radius: 5px;
866
+ background-color: #172a41;
867
+ box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
868
+ 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
758
869
 
759
- @keyframes spin {
760
- 0% {
761
- transform: rotate(0deg);
762
- }
763
- 100% {
764
- transform: rotate(360deg);
870
+ color: #fff;
871
+ line-height: 150%;
872
+ text-transform: capitalize;
873
+
874
+ &:hover {
875
+ background: #091627;
765
876
  }
766
877
  }
767
878
 
768
- .chat-header-sub-title {
769
- color: #000;
770
- font-size: 12px;
771
- font-weight: 400;
772
- font-style: normal;
773
- line-height: 12px;
774
- text-align: left;
775
- text-underline-position: from-font;
776
- text-decoration-skip-ink: none;
777
- margin: 0;
778
- }
779
-
780
- .body {
879
+ .history {
880
+ margin-top: 24px;
781
881
  display: flex;
782
- flex: 1;
882
+ flex-direction: column;
883
+ height: calc(100% - 183px);
884
+ overflow: hidden;
783
885
 
784
- @media screen and (max-width: 430px) {
785
- flex-direction: column;
786
- justify-content: flex-end;
886
+ .title {
887
+ color: #677c95;
888
+ font-weight: 500;
889
+ text-transform: uppercase;
890
+ margin: 0 0 12px;
891
+ max-height: 18px;
892
+ padding-left: 12px;
787
893
  }
788
- }
789
894
 
790
- .powered-by-tc {
791
- text-align: right;
792
- color: #000;
793
- font-size: 12px;
794
- line-height: 150%;
795
-
796
- p {
797
- margin: 0;
895
+ .threads {
896
+ flex: 1;
897
+ overflow-y: auto;
898
+ overflow-x: hidden;
798
899
  }
799
- }
800
-
801
- .products-section {
802
- flex: 1 0 0;
803
- display: flex;
804
- flex-direction: column;
805
- justify-content: center;
806
- align-items: center;
807
- gap: 1px;
808
- border-right: 1px solid #d4d4d8;
809
- background: #f5f3ee;
810
900
 
811
- .product-section {
812
- flex: 1;
813
- padding: 24px;
901
+ .thread-title {
902
+ color: #172a41;
814
903
  width: 100%;
815
-
816
- h2 {
817
- color: #a49b94;
818
- font-size: 18px;
819
- font-weight: 700;
820
- line-height: 24px;
821
- text-transform: uppercase;
822
- margin: 0 0 24px;
823
- }
824
-
825
- p.no-product-text {
826
- color: #000;
827
- font-size: 18px;
828
- line-height: 24px;
829
- opacity: 0.6;
830
- }
904
+ padding: 12px;
905
+ cursor: pointer;
831
906
  }
832
907
 
833
- .hidden {
834
- display: none;
908
+ .thread-title.active {
909
+ border-radius: 5px;
910
+ background: #f1f4f8;
835
911
  }
836
912
 
837
- .show-more,
838
- .show-less {
839
- display: none;
840
- margin: 16px 0;
841
- color: #a49b94;
842
- text-align: center;
843
- font-size: 14px;
844
- font-weight: 700;
845
- line-height: 12px;
846
- letter-spacing: -0.28px;
847
- text-transform: uppercase;
913
+ .thread-title.disabled {
914
+ cursor: not-allowed;
848
915
  }
916
+ }
849
917
 
850
- @media screen and (max-width: 430px) {
851
- flex: 0;
852
- box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
853
- 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
854
- z-index: 1;
855
-
856
- .product-section {
857
- padding: 16px 16px 0;
858
-
859
- h2 {
860
- display: flex;
861
- font-size: 12px;
862
- font-weight: 700;
863
- line-height: 18px;
864
- letter-spacing: -0.36px;
865
- margin: 0 0 16px;
866
- color: #53433a;
867
- align-items: center;
868
- gap: 16px;
869
-
870
- &::after {
871
- content: '';
872
- flex-grow: 1;
873
- height: 1px;
874
- background: #a49b94;
875
- }
876
- }
877
-
878
- .no-products {
879
- display: none;
880
- }
881
- }
882
-
883
- .product-section.recommended-product h2 {
884
- display: none;
885
- }
918
+ .footer {
919
+ padding: 10px 0 0;
920
+ color: #4e647f;
921
+ line-height: 150%;
886
922
 
887
- .show-more,
888
- .show-less {
889
- display: block;
890
- }
923
+ a {
924
+ color: #4e647f;
925
+ text-decoration-line: underline;
926
+ text-decoration-style: solid;
927
+ text-decoration-skip-ink: auto;
928
+ text-decoration-thickness: auto;
929
+ text-underline-offset: auto;
930
+ text-underline-position: from-font;
891
931
  }
892
932
  }
933
+ `;
893
934
 
894
- @media screen and (max-width: 430px) {
895
- .no-recommended-product {
896
- display: none;
935
+ let LoadSpinner =
936
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
937
+ class LoadSpinner extends s {
938
+ render() {
939
+ return x ` <div class="loader"><div class="spinner"></div></div> `;
897
940
  }
898
- }
899
-
900
- .recommended-product {
901
- border-bottom: 1px solid #d4d4d8;
902
-
903
- .product {
904
- display: flex;
905
- gap: 12px;
906
-
907
- /* .buy-now-btn {
908
- cursor: pointer;
909
- padding: 7px 37px;
910
- background: #971b1b;
911
- border-radius: 5px;
912
- margin-top: 12px;
913
- color: #ffffff;
914
- font-size: 18px;
915
- line-height: 24px;
916
- letter-spacing: -0.35px;
917
- border: 0;
918
- } */
919
-
920
- /* Replica of TrueClassic */
921
- .buy-now-btn {
922
- cursor: pointer;
923
- padding: 7px 37px;
924
- background: #53433a;
925
- border-radius: 5px;
926
- margin-top: 12px;
927
- color: #ffffff;
928
- font-size: 18px;
929
- line-height: 24px;
930
- letter-spacing: -0.35px;
931
- border: 0;
932
- text-transform: uppercase;
933
-
934
- :hover {
935
- background-color: #2e2520;
936
- }
937
-
938
- :active {
939
- background-color: #0c0a09;
941
+ };
942
+ LoadSpinner.styles = [
943
+ i$3 `
944
+ .loader {
945
+ display: flex;
946
+ flex: 1;
947
+ width: 100%;
948
+ height: 100%;
949
+ align-items: center;
950
+ justify-content: center;
951
+ z-index: 5000;
952
+
953
+ .spinner {
954
+ --webkit-animation: spin 1s linear infinite;
955
+ animation: 1s linear infinite spin;
956
+ border-radius: 50%;
957
+ border: 5px solid #f9d5ba;
958
+ border-top: 5px solid #555;
959
+ width: 30px;
960
+ height: 30px;
961
+ margin: 10px;
940
962
  }
941
963
  }
942
964
 
943
- p {
944
- margin: 0;
945
- }
946
-
947
- img {
948
- cursor: pointer;
949
- width: 170px;
950
- height: 213px;
951
- }
952
-
953
- .product-name,
954
- .product-variation-details {
955
- cursor: pointer;
956
- font-size: 16px;
957
- line-height: 24px;
958
- color: #3f3f46;
959
- white-space: nowrap;
960
- overflow: hidden;
961
- text-overflow: ellipsis;
962
- margin-bottom: 12px;
963
- }
964
- }
965
-
966
- @media screen and (max-width: 430px) {
967
- border-bottom: unset;
968
-
969
- .product {
970
- img {
971
- height: 132px;
972
- width: 106px;
965
+ @keyframes spin {
966
+ 0% {
967
+ transform: rotate(0deg);
973
968
  }
974
-
975
- .product-name,
976
- .product-variation-details {
977
- margin: 0;
969
+ 100% {
970
+ transform: rotate(360deg);
978
971
  }
979
972
  }
973
+ `,
974
+ ];
975
+ LoadSpinner = __decorate([
976
+ t$1('load-spinner')
977
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
978
+ ], LoadSpinner);
979
+
980
+ let ChatThreads =
981
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
982
+ class ChatThreads extends s {
983
+ renderChatThreads() {
984
+ if (this.isLoading) {
985
+ return x `<div class="history">
986
+ <p class="title">History</p>
987
+ <load-spinner></load-spinner>
988
+ </div>`;
989
+ }
990
+ return x `
991
+ <div class="history">
992
+ <p class="title">History</p>
993
+ ${this.chatThreads.size
994
+ ? x `<div class="threads">
995
+ ${o(this.chatThreads.values(), (thread) => x `
996
+ <div
997
+ class=${e({
998
+ 'thread-title': true,
999
+ active: this.selectedThreadId === thread.threadId,
1000
+ disabled: this.isTyping,
1001
+ })}
1002
+ @click=${async () => {
1003
+ if (this.isLoading || this.isTyping) {
1004
+ return;
1005
+ }
1006
+ await this.setSelectedThreadId(thread.threadId);
1007
+ }}
1008
+ >
1009
+ ${thread.title || 'New Search'}
1010
+ </div>
1011
+ `)}
1012
+ </div>`
1013
+ : T}
1014
+ </div>
1015
+ `;
1016
+ }
1017
+ getDomain() {
1018
+ var _a;
1019
+ if ((_a = this.merchantUrl) === null || _a === void 0 ? void 0 : _a.startsWith('https://')) {
1020
+ return this.merchantUrl;
1021
+ }
1022
+ return `https://${this.merchantUrl}`;
980
1023
  }
1024
+ render() {
1025
+ return x `
1026
+ <div class="shop-gpt-icon">${shopGPTIcon}</div>
1027
+ <span class="line"></span>
1028
+ <button
1029
+ class="btn-new-search"
1030
+ @click=${() => this.setSelectedThreadId('')}
1031
+ >
1032
+ New Search
1033
+ </button>
1034
+ ${this.renderChatThreads()}
1035
+ ${this.merchantUrl
1036
+ ? x `<div class="footer">
1037
+ Catalog:
1038
+ <a href="${this.getDomain()}" target="_blank">
1039
+ ${this.getDomain().replace('https://', '')}
1040
+ </a>
1041
+ </div>`
1042
+ : T}
1043
+ `;
1044
+ }
1045
+ };
1046
+ ChatThreads.styles = [chatThreadsStyles];
1047
+ __decorate([
1048
+ n({ type: Object }),
1049
+ __metadata("design:type", Map)
1050
+ ], ChatThreads.prototype, "chatThreads", void 0);
1051
+ __decorate([
1052
+ n({ type: String }),
1053
+ __metadata("design:type", Object)
1054
+ ], ChatThreads.prototype, "merchantUrl", void 0);
1055
+ __decorate([
1056
+ n({ type: Boolean }),
1057
+ __metadata("design:type", Boolean)
1058
+ ], ChatThreads.prototype, "isLoading", void 0);
1059
+ __decorate([
1060
+ n({ type: Boolean }),
1061
+ __metadata("design:type", Boolean)
1062
+ ], ChatThreads.prototype, "isTyping", void 0);
1063
+ __decorate([
1064
+ n({ type: String }),
1065
+ __metadata("design:type", String)
1066
+ ], ChatThreads.prototype, "selectedThreadId", void 0);
1067
+ ChatThreads = __decorate([
1068
+ t$1('chat-threads')
1069
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1070
+ ], ChatThreads);
1071
+
1072
+ const productsSectionStyles = i$3 `
1073
+ :host {
1074
+ padding: 24px 16px;
1075
+ background-color: #fff;
1076
+ font-family: 'Inter', sans-serif;
1077
+ font-size: 16px;
1078
+ font-weight: 400;
981
1079
  }
982
1080
 
983
- .more-recommendations {
984
- padding: 15px;
985
-
986
- .products {
987
- display: flex;
988
- overflow: hidden;
989
- justify-content: space-between;
990
- align-items: center;
991
- padding: 0 16px;
1081
+ .top-result,
1082
+ .others {
1083
+ h2 {
1084
+ color: #677c95;
1085
+ font-size: 18px;
1086
+ font-weight: 700px;
1087
+ line-height: 24px;
1088
+ text-transform: uppercase;
1089
+ margin: 0px 0px 16px;
992
1090
  }
1091
+ }
993
1092
 
994
- .product {
995
- max-width: 140px;
1093
+ .line {
1094
+ display: block;
1095
+ height: 1px;
1096
+ background: #dbe2eb;
1097
+ margin: 24px 0;
1098
+ width: 100%;
1099
+ }
996
1100
 
997
- p {
998
- margin: 0;
999
- }
1101
+ .no-products {
1102
+ display: flex;
1103
+ flex-direction: column;
1104
+ align-items: center;
1105
+ justify-content: center;
1106
+ height: 100%;
1107
+ }
1108
+ `;
1000
1109
 
1001
- .product-name,
1002
- .product-variation-details {
1003
- cursor: pointer;
1004
- color: #3f3f46;
1005
- font-size: 16px;
1006
- line-height: 24px;
1007
- white-space: nowrap;
1008
- overflow: hidden;
1009
- text-overflow: ellipsis;
1010
- }
1110
+ const productItemStyles = i$3 `
1111
+ :host {
1112
+ font-family: 'Inter', sans-serif;
1113
+ font-size: 16px;
1114
+ font-weight: 400;
1011
1115
 
1012
- img {
1013
- cursor: pointer;
1014
- width: 140px;
1015
- height: 175px;
1016
- }
1116
+ p {
1117
+ margin: 0;
1017
1118
  }
1018
1119
 
1019
- @media screen and (max-width: 430px) {
1020
- display: none;
1120
+ button {
1121
+ border-style: none;
1122
+ cursor: pointer;
1123
+ }
1124
+ }
1021
1125
 
1022
- .products {
1023
- padding: 0px;
1024
- }
1126
+ .product {
1127
+ display: flex;
1128
+ gap: 16px;
1025
1129
 
1026
- .product {
1027
- max-width: 108px;
1130
+ img {
1131
+ width: 150px;
1132
+ height: 186px;
1133
+ object-position: center;
1134
+ object-fit: contain;
1135
+ cursor: pointer;
1136
+ }
1137
+ }
1028
1138
 
1029
- .product-name,
1030
- .product-variation-details {
1031
- font-size: 12px;
1032
- line-height: 18px;
1033
- letter-spacing: -0.36px;
1034
- margin: 0;
1035
- }
1139
+ .content {
1140
+ display: flex;
1141
+ gap: 8px;
1142
+ flex-direction: column;
1036
1143
 
1037
- img {
1038
- height: 133px;
1039
- width: 108px;
1040
- }
1041
- }
1144
+ *:last-child {
1145
+ margin-top: auto;
1042
1146
  }
1043
1147
  }
1044
1148
 
1045
- @media screen and (max-width: 430px) {
1046
- .show-more-sml {
1047
- display: block;
1048
- }
1149
+ .product-name {
1150
+ display: -webkit-box;
1151
+ color: #3f3f46;
1152
+ line-height: 150%;
1153
+ max-width: 100%;
1154
+ -webkit-line-clamp: 2;
1155
+ -webkit-box-orient: vertical;
1156
+ overflow: hidden;
1157
+ text-overflow: ellipsis;
1158
+ word-break: break-word;
1159
+ white-space: normal;
1160
+ cursor: pointer;
1161
+ }
1162
+
1163
+ .product-variation-details {
1164
+ color: #3f3f46;
1165
+ font-weight: 700;
1166
+ line-height: 150%;
1049
1167
  }
1050
1168
 
1051
- .product-prices {
1169
+ .prices {
1052
1170
  display: flex;
1053
1171
  gap: 0 8px;
1054
- line-height: 24px;
1055
1172
  font-weight: 700;
1056
- font-size: 18px;
1057
- color: #000000;
1173
+ line-height: 24px;
1174
+ color: #000;
1058
1175
 
1059
- .compared-at-price {
1176
+ .price-compared {
1060
1177
  color: #a1a1aa;
1061
1178
  text-decoration: line-through;
1062
1179
  }
1063
-
1064
- @media screen and (max-width: 430px) {
1065
- font-size: 14px;
1066
- line-height: 21px;
1067
- }
1068
- }
1069
-
1070
- .chatbot-section {
1071
- flex: 1;
1072
- flex-direction: column;
1073
- padding: 10px 24px 24px;
1074
- background: #fff;
1075
- display: flex;
1076
- gap: 25px;
1077
- align-self: stretch;
1078
-
1079
- @media screen and (max-width: 430px) {
1080
- padding: 10px 16px 16px;
1081
- gap: 16px;
1082
- }
1083
1180
  }
1084
1181
 
1085
- .chat-header {
1086
- flex: 1;
1087
- display: flex;
1088
- flex-direction: column;
1089
- overflow-y: auto;
1090
- justify-content: flex-end;
1091
- }
1182
+ .btn-view-product {
1183
+ color: #fff;
1184
+ line-height: 150%;
1185
+ text-transform: capitalize;
1186
+ max-width: 200px;
1187
+ padding: 10px;
1188
+ text-align: center;
1092
1189
 
1093
- .chat-window {
1094
- flex: 1;
1095
- display: flex;
1096
- flex-direction: column-reverse;
1097
- overflow-y: auto;
1098
- gap: 28px;
1099
- max-height: calc(100vh - 211px);
1190
+ border-radius: 5px;
1191
+ background: #172a41;
1192
+ box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
1193
+ 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
1100
1194
 
1101
- @media screen and (max-width: 430px) {
1102
- max-height: unset;
1103
- gap: 24px;
1195
+ &:hover {
1196
+ background: #091627;
1104
1197
  }
1105
1198
  }
1106
1199
 
1107
- .chat-header {
1108
- align-items: center;
1109
-
1110
- .chat-header-sub-title {
1111
- margin-bottom: 16px;
1200
+ @container productContainer (max-width: 150px) {
1201
+ .btn-view-product {
1202
+ display: none;
1112
1203
  }
1113
1204
 
1114
- .chat-header-description {
1115
- text-align: center;
1116
- line-height: 24px;
1205
+ .product {
1206
+ flex-direction: column;
1207
+ gap: 0;
1117
1208
  }
1118
- }
1119
-
1120
- .bot-message-container {
1121
- display: flex;
1122
- gap: 0 16px;
1123
- }
1124
1209
 
1125
- .message {
1126
- color: #18181b;
1127
- font-size: 16px;
1128
- }
1210
+ .content {
1211
+ gap: 0;
1212
+ }
1129
1213
 
1130
- .message.user {
1131
- padding: 8px 14px;
1132
- background: #f1f1f1;
1133
- align-self: flex-end;
1134
- max-width: 45%;
1135
- border-radius: 17.5px;
1136
- text-align: right;
1137
- letter-spacing: -0.32px;
1214
+ .product-name {
1215
+ max-width: 150px;
1216
+ font-size: 14px;
1217
+ }
1138
1218
 
1139
- @media screen and (max-width: 430px) {
1140
- max-width: 70%;
1219
+ .product-variation-details {
1220
+ font-size: 14px;
1141
1221
  }
1142
1222
  }
1143
1223
 
1144
- .message.bot {
1145
- align-self: flex-start;
1146
- max-width: 70%;
1224
+ @container productContainer (max-height: 124px) {
1225
+ .btn-view-product {
1226
+ display: none;
1227
+ }
1147
1228
 
1148
- p {
1149
- margin: 0;
1229
+ .content {
1230
+ gap: 0;
1150
1231
  }
1151
1232
 
1152
1233
  .product {
1153
- margin-top: 16px;
1154
- display: flex;
1155
- gap: 12px;
1156
-
1157
- .product-name,
1158
- .product-variation-details {
1159
- cursor: pointer;
1160
- margin-bottom: 8px;
1161
- }
1234
+ gap: 8px;
1162
1235
 
1163
1236
  img {
1164
- cursor: pointer;
1165
- width: 75px;
1166
- height: 93px;
1237
+ width: 100px;
1238
+ height: 124px;
1167
1239
  }
1240
+ }
1168
1241
 
1169
- @media screen and (max-width: 430px) {
1170
- display: none;
1242
+ .product-name {
1243
+ -webkit-line-clamp: 1;
1244
+ color: #172a41;
1245
+ }
1171
1246
 
1172
- .product-name,
1173
- .product-variation-details {
1174
- margin: 0;
1175
- }
1176
- }
1247
+ .product-variation-details {
1248
+ color: #172a41;
1177
1249
  }
1178
1250
  }
1251
+ `;
1179
1252
 
1180
- .predefined-prompts {
1181
- margin: 24px 0;
1253
+ let ProductItem =
1254
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1255
+ class ProductItem extends s {
1256
+ getLocalPrice(price) {
1257
+ if (!this.siteCurrency) {
1258
+ return price;
1259
+ }
1260
+ const localPrice = parseFloat(price) * this.siteCurrency.rate;
1261
+ return formatMoney(localPrice, this.siteCurrency.currency);
1262
+ }
1263
+ redirect(url) {
1264
+ var _a;
1265
+ if (!url) {
1266
+ return;
1267
+ }
1268
+ (_a = open(url, '_blank')) === null || _a === void 0 ? void 0 : _a.focus();
1269
+ }
1270
+ render() {
1271
+ return x `
1272
+ <div class="product">
1273
+ <img
1274
+ src=${this.product.image.url}
1275
+ alt=${this.product.image.alt}
1276
+ @click=${() => { var _a; return this.redirect((_a = this.product) === null || _a === void 0 ? void 0 : _a.url); }}
1277
+ />
1278
+ <div class="content">
1279
+ <p
1280
+ class="product-name"
1281
+ title=${this.product.title}
1282
+ @click=${() => { var _a; return this.redirect((_a = this.product) === null || _a === void 0 ? void 0 : _a.url); }}
1283
+ >
1284
+ ${this.product.title}
1285
+ </p>
1286
+ ${this.product.variants[0].selectedOptions.map((option) => x `
1287
+ <p class="product-variation-details">
1288
+ ${option.name}: ${option.value}
1289
+ </p>
1290
+ `)}
1291
+ <div class="prices">
1292
+ ${this.product.variants[0].comparedAtPrice &&
1293
+ this.product.variants[0].comparedAtPrice !==
1294
+ this.product.variants[0].price
1295
+ ? x `<p class="price-compared">
1296
+ ${this.getLocalPrice(this.product.variants[0].comparedAtPrice)}
1297
+ </p>`
1298
+ : T}
1299
+ <p>${this.getLocalPrice(this.product.variants[0].price)}</p>
1300
+ </div>
1301
+ <button
1302
+ class="btn-view-product"
1303
+ @click=${() => { var _a; return this.redirect((_a = this.product) === null || _a === void 0 ? void 0 : _a.url); }}
1304
+ >
1305
+ View Product
1306
+ </button>
1307
+ </div>
1308
+ </div>
1309
+ `;
1310
+ }
1311
+ };
1312
+ ProductItem.styles = [productItemStyles];
1313
+ __decorate([
1314
+ n({ type: Object }),
1315
+ __metadata("design:type", Object)
1316
+ ], ProductItem.prototype, "product", void 0);
1317
+ __decorate([
1318
+ n({ type: Object }),
1319
+ __metadata("design:type", Object)
1320
+ ], ProductItem.prototype, "siteCurrency", void 0);
1321
+ ProductItem = __decorate([
1322
+ t$1('product-item')
1323
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1324
+ ], ProductItem);
1325
+
1326
+ const productsListStyles = i$3 `
1327
+ .products::-webkit-scrollbar {
1328
+ display: none;
1329
+ }
1330
+
1331
+ .product-container {
1332
+ flex: 0 0 150px;
1333
+ container-type: inline-size;
1334
+ container-name: productContainer;
1335
+ }
1336
+
1337
+ .product-container.modal {
1338
+ padding: 8px;
1339
+ margin-bottom: 4px;
1340
+ border-radius: 10px;
1341
+ background: #fff;
1342
+ box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
1343
+ 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
1344
+ }
1345
+
1346
+ .products {
1347
+ flex: 1;
1182
1348
  display: flex;
1183
- align-items: start;
1184
- flex-wrap: wrap;
1185
- gap: 16px 8px;
1349
+ gap: 24px;
1350
+ overflow-x: auto;
1351
+ scrollbar-width: none;
1352
+ }
1353
+
1354
+ .scroll-btns {
1355
+ display: flex;
1356
+ gap: 16px;
1357
+ height: 150px;
1358
+ flex-direction: column;
1359
+ justify-content: center;
1360
+ align-items: flex-start;
1361
+ flex: 0;
1362
+ user-select: none;
1363
+
1364
+ div {
1365
+ display: flex;
1366
+ padding: 10px;
1367
+ justify-content: center;
1368
+ align-items: center;
1369
+ border-radius: 5px;
1370
+ border: 2px solid #dbe2eb;
1371
+ background: #fff;
1372
+ cursor: pointer;
1373
+ }
1374
+
1375
+ .disabled {
1376
+ opacity: 0.5;
1377
+ }
1378
+ }
1379
+
1380
+ .products-wrapper {
1381
+ display: flex;
1382
+ gap: 24px;
1383
+ }
1384
+ `;
1385
+
1386
+ let ProductsList =
1387
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1388
+ class ProductsList extends s {
1389
+ connectedCallback() {
1390
+ super.connectedCallback();
1391
+ }
1392
+ updateButtonsState() {
1393
+ if (!this.leftBtnEle || !this.productsEle || !this.rightBtnEle) {
1394
+ return;
1395
+ }
1396
+ this.leftBtnEle.classList.toggle('disabled', this.productsEle.scrollLeft === 0);
1397
+ const maxScroll = this.productsEle.scrollWidth - this.productsEle.clientWidth;
1398
+ this.rightBtnEle.classList.toggle('disabled', this.productsEle.scrollLeft >= maxScroll - 1);
1399
+ }
1400
+ scrollToLeft(e) {
1401
+ var _a;
1402
+ e.preventDefault();
1403
+ (_a = this.productsEle) === null || _a === void 0 ? void 0 : _a.scrollBy({ left: -186, behavior: 'smooth' });
1404
+ }
1405
+ scrollToRight(e) {
1406
+ var _a;
1407
+ e.preventDefault();
1408
+ (_a = this.productsEle) === null || _a === void 0 ? void 0 : _a.scrollBy({ left: 186, behavior: 'smooth' });
1409
+ }
1410
+ render() {
1411
+ return x `
1412
+ <div class="products-wrapper">
1413
+ <div class="products" @scroll=${this.updateButtonsState}>
1414
+ ${o(this.products, (product) => x `
1415
+ <div
1416
+ class=${e({
1417
+ 'product-container': true,
1418
+ modal: this.viewType === 'modal',
1419
+ })}
1420
+ >
1421
+ <product-item
1422
+ .product=${product}
1423
+ .siteCurrency=${this.siteCurrency}
1424
+ ></product-item>
1425
+ </div>
1426
+ `)}
1427
+ </div>
1428
+ <div class="scroll-btns">
1429
+ <div class="left-btn disabled" @click=${this.scrollToLeft}>
1430
+ ${leftBtn}
1431
+ </div>
1432
+ <div class="right-btn" @click=${this.scrollToRight}>${rightBtn}</div>
1433
+ </div>
1434
+ </div>
1435
+ `;
1436
+ }
1437
+ };
1438
+ ProductsList.styles = [productsListStyles];
1439
+ __decorate([
1440
+ n({ type: Array }),
1441
+ __metadata("design:type", Array)
1442
+ ], ProductsList.prototype, "products", void 0);
1443
+ __decorate([
1444
+ n({ type: Object }),
1445
+ __metadata("design:type", Object)
1446
+ ], ProductsList.prototype, "siteCurrency", void 0);
1447
+ __decorate([
1448
+ e$2('.left-btn'),
1449
+ __metadata("design:type", Object)
1450
+ ], ProductsList.prototype, "leftBtnEle", void 0);
1451
+ __decorate([
1452
+ e$2('.right-btn'),
1453
+ __metadata("design:type", Object)
1454
+ ], ProductsList.prototype, "rightBtnEle", void 0);
1455
+ __decorate([
1456
+ e$2('.products'),
1457
+ __metadata("design:type", Object)
1458
+ ], ProductsList.prototype, "productsEle", void 0);
1459
+ ProductsList = __decorate([
1460
+ t$1('products-list')
1461
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1462
+ ], ProductsList);
1463
+
1464
+ let ProductsSection =
1465
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1466
+ class ProductsSection extends s {
1467
+ connectedCallback() {
1468
+ super.connectedCallback();
1469
+ }
1470
+ render() {
1471
+ if (this.isLoadingHistory) {
1472
+ return x ` <load-spinner></load-spinner> `;
1473
+ }
1474
+ if (!this.products.length) {
1475
+ return x `
1476
+ <div class="no-products">
1477
+ <div>${searchIcon}</div>
1478
+ <p>
1479
+ Start exploring by typing your query in the search bar on the right.
1480
+ </p>
1481
+ </div>
1482
+ `;
1483
+ }
1484
+ const topResult = this.products[0];
1485
+ const others = this.products.slice(1);
1486
+ return x `
1487
+ <div class="top-result">
1488
+ <h2>Top Result</h2>
1489
+ <product-item
1490
+ .product=${topResult}
1491
+ .siteCurrency=${this.siteCurrency}
1492
+ ></product-item>
1493
+ </div>
1494
+ <span class="line"></span>
1495
+ <div class="others">
1496
+ <h2>Other Recommendations</h2>
1497
+ <products-list
1498
+ .products=${others}
1499
+ .siteCurrency=${this.siteCurrency}
1500
+ .viewType=${'overlay'}
1501
+ ></products-list>
1502
+ </div>
1503
+ `;
1504
+ }
1505
+ };
1506
+ ProductsSection.styles = [productsSectionStyles];
1507
+ __decorate([
1508
+ n({ type: Array }),
1509
+ __metadata("design:type", Array)
1510
+ ], ProductsSection.prototype, "products", void 0);
1511
+ __decorate([
1512
+ n({ type: Boolean }),
1513
+ __metadata("design:type", Boolean)
1514
+ ], ProductsSection.prototype, "isLoadingHistory", void 0);
1515
+ __decorate([
1516
+ n({ type: Object }),
1517
+ __metadata("design:type", Object)
1518
+ ], ProductsSection.prototype, "siteCurrency", void 0);
1519
+ __decorate([
1520
+ e$2('.left-btn'),
1521
+ __metadata("design:type", Object)
1522
+ ], ProductsSection.prototype, "leftBtnEle", void 0);
1523
+ __decorate([
1524
+ e$2('.right-btn'),
1525
+ __metadata("design:type", Object)
1526
+ ], ProductsSection.prototype, "rightBtnEle", void 0);
1527
+ __decorate([
1528
+ e$2('.products'),
1529
+ __metadata("design:type", Object)
1530
+ ], ProductsSection.prototype, "productsEle", void 0);
1531
+ ProductsSection = __decorate([
1532
+ t$1('products-section')
1533
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
1534
+ ], ProductsSection);
1535
+
1536
+ const chatSectionStyles = i$3 `
1537
+ :host {
1538
+ font-family: 'Inter', sans-serif;
1539
+ font-size: 16px;
1540
+ font-weight: 400;
1541
+
1542
+ h2,
1543
+ p {
1544
+ margin: 0;
1545
+ }
1186
1546
 
1187
1547
  button {
1188
- padding: 10px 16px;
1548
+ border-style: none;
1189
1549
  cursor: pointer;
1190
- border-radius: 21px;
1191
- border: 1px solid #d4d4d8;
1192
- color: #8b2822;
1550
+ }
1551
+ }
1552
+
1553
+ .btn {
1554
+ cursor: pointer;
1555
+ }
1556
+
1557
+ .chat-header {
1558
+ padding: 24px 16px;
1559
+ display: flex;
1560
+ justify-content: space-between;
1561
+ align-items: center;
1562
+ border-bottom: 1px solid #dbe2eb;
1563
+ background: #fff;
1564
+ height: 28px;
1565
+ gap: 8px;
1566
+
1567
+ h2 {
1568
+ color: #4e647f;
1569
+ font-size: 18px;
1570
+ font-weight: 600;
1571
+ line-height: 21px;
1572
+ text-transform: capitalize;
1573
+ }
1574
+
1575
+ .btn-context {
1576
+ padding: 8px 10px;
1577
+ border-radius: 5px;
1578
+ line-height: 150%;
1579
+ text-transform: capitalize;
1580
+ color: #8799af;
1581
+ border: 2px solid #dbe2eb;
1193
1582
  background: #fff;
1194
1583
  }
1584
+
1585
+ .btn-context.active {
1586
+ background: #f25c2b;
1587
+ padding: 10px 36px;
1588
+ border: none;
1589
+ color: #fff;
1590
+
1591
+ &:hover {
1592
+ background: #cd4b27;
1593
+ }
1594
+ }
1595
+
1596
+ .btns-wrapper {
1597
+ margin-left: auto;
1598
+ display: flex;
1599
+ gap: 16px;
1600
+
1601
+ .btn-icon {
1602
+ border-radius: 50%;
1603
+ padding: 0;
1604
+ background: #a3b2c6;
1605
+ margin: 0;
1606
+ display: flex;
1607
+ align-items: center;
1608
+ justify-content: center;
1609
+ }
1610
+
1611
+ .threads-btn.active {
1612
+ background: #2b65cf;
1613
+ opacity: 1;
1614
+ }
1615
+
1616
+ .close-btn:hover {
1617
+ background: #dc3545;
1618
+ }
1619
+
1620
+ .threads-btn:hover,
1621
+ .new-search-btn:hover {
1622
+ background: #2b65cf;
1623
+ opacity: 0.8;
1624
+ }
1625
+
1626
+ .threads-btn:active,
1627
+ .new-search-btn:active {
1628
+ background: #2b65cf;
1629
+ opacity: 1;
1630
+ }
1631
+ }
1632
+ }
1633
+
1634
+ .chatbot-section {
1635
+ background: #f7f8fa;
1636
+ height: calc(100% - 113px);
1637
+ padding: 0px 36px 36px;
1638
+
1639
+ flex-direction: column;
1640
+ display: flex;
1641
+ gap: 25px;
1642
+ }
1643
+
1644
+ .chatbot-section.modal-view {
1645
+ height: calc(100% - 121px);
1646
+ padding: 0px 16px 44px;
1647
+ gap: 16px;
1195
1648
  }
1196
1649
 
1197
- .chat-input {
1650
+ .chat-form {
1198
1651
  display: flex;
1199
1652
  align-items: center;
1200
1653
  margin: 0;
1201
1654
 
1202
1655
  input {
1203
1656
  flex: 1;
1204
- height: 48px;
1205
- padding: 11px 50px 11px 16px;
1206
- border-radius: 24px;
1207
- background: #f1f1f1;
1208
- border-style: none;
1209
- border: 0px;
1657
+ height: 55px;
1658
+ padding: 8px 68px 8px 16px;
1210
1659
  font-size: 16px;
1660
+ line-height: 150%;
1661
+ letter-spacing: -0.32px;
1662
+
1663
+ background: #fff;
1664
+ border-radius: 10px;
1665
+ border: 1px solid #dbe2eb;
1666
+ box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
1667
+ 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
1211
1668
 
1212
1669
  &:focus {
1213
1670
  outline-width: 0;
@@ -1215,588 +1672,1552 @@ const shopGPTStyles = () => i$3 `
1215
1672
  }
1216
1673
 
1217
1674
  &::placeholder {
1218
- color: #52525b;
1675
+ color: #677c95;
1676
+ line-height: 150%;
1677
+ letter-spacing: -0.32px;
1219
1678
  }
1220
1679
  }
1221
1680
 
1222
1681
  button {
1223
- cursor: pointer;
1224
1682
  position: absolute;
1225
- right: 36px;
1226
- width: 30px;
1227
- height: 30px;
1683
+ right: 44px;
1684
+ padding: 8px;
1228
1685
  display: flex;
1229
1686
  justify-content: center;
1230
1687
  align-items: center;
1231
1688
  border: 0px solid;
1232
- border-radius: 50%;
1233
- background: #8b2822;
1689
+ border-radius: 5px;
1690
+ background: #172a41;
1234
1691
 
1235
1692
  &:disabled {
1236
1693
  background: #808080;
1694
+ cursor: unset;
1237
1695
  }
1238
1696
  }
1697
+
1698
+ button.modal {
1699
+ right: 26px;
1700
+ }
1701
+ }
1702
+
1703
+ .messages {
1704
+ flex: 1;
1705
+ overflow-y: auto;
1706
+ display: flex;
1707
+ flex-direction: column-reverse;
1708
+ gap: 28px;
1709
+ padding-bottom: 10px;
1710
+ margin-bottom: -10px;
1711
+ }
1712
+
1713
+ .message {
1714
+ padding: 16px;
1715
+ border-radius: 10px;
1716
+ background: #fff;
1717
+ box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1),
1718
+ 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
1719
+ line-height: 21px;
1720
+ }
1721
+
1722
+ .message-wrapper {
1723
+ display: flex;
1724
+ flex-direction: column;
1725
+ gap: 16px;
1726
+ }
1727
+
1728
+ .message.user {
1729
+ background: #f25c2b;
1730
+ color: #fff;
1731
+ max-width: 75%;
1732
+ align-self: flex-end;
1733
+ letter-spacing: -0.32px;
1239
1734
  }
1240
1735
 
1241
- input {
1242
- &:focus {
1243
- outline-width: 0;
1736
+ .message.bot {
1737
+ display: flex;
1738
+ gap: 16px;
1739
+ color: #172a41;
1740
+
1741
+ .product-container {
1742
+ height: 124px;
1743
+ container-type: size;
1744
+ container-name: productContainer;
1745
+ overflow: hidden;
1244
1746
  }
1245
1747
  }
1246
1748
 
1247
- button {
1248
- &:focus {
1249
- outline-style: none;
1749
+ .bot-icon {
1750
+ display: flex;
1751
+ padding: 8px 11px;
1752
+ justify-content: center;
1753
+ align-items: center;
1754
+ border-radius: 5px;
1755
+ border: 1px solid #dbe2eb;
1756
+ background: #fff;
1757
+ }
1758
+
1759
+ .line {
1760
+ display: block;
1761
+ height: 1px;
1762
+ background: #dbe2eb;
1763
+ margin: 12px 0;
1764
+ width: 100%;
1765
+ }
1766
+
1767
+ .context-container {
1768
+ display: none;
1769
+ max-width: 384px;
1770
+ top: 66px;
1771
+ right: 16px;
1772
+ position: absolute;
1773
+ padding: 24px;
1774
+ border-radius: 10px;
1775
+ border: 1px solid #dbe2eb;
1776
+ background: #fff;
1777
+ box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
1778
+ 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
1779
+
1780
+ .context-title {
1781
+ display: flex;
1782
+ justify-content: space-between;
1783
+ height: 24px;
1784
+ align-items: center;
1785
+
1786
+ p {
1787
+ color: #172a41;
1788
+ font-size: 20px;
1789
+ font-weight: 700;
1790
+ line-height: 24px;
1791
+ }
1250
1792
  }
1251
1793
 
1252
- &:focus-visible {
1253
- outline-style: none;
1794
+ .context {
1795
+ span {
1796
+ color: #172a41;
1797
+ font-weight: 600;
1798
+ line-height: 150%;
1799
+ }
1800
+
1801
+ .context-type-value {
1802
+ color: #4e647f;
1803
+ line-height: 24px;
1804
+ text-decoration-line: underline;
1805
+ text-decoration-style: solid;
1806
+ text-decoration-skip-ink: auto;
1807
+ text-decoration-thickness: auto;
1808
+ text-underline-offset: auto;
1809
+ text-underline-position: from-font;
1810
+ font-weight: 400;
1811
+ }
1254
1812
  }
1255
- }
1256
- `;
1257
1813
 
1258
- const sendFilledIcon = () => b `
1259
- <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
1260
- <g id="send--filled 1" clip-path="url(#clip0_11627_1046)">
1261
- <path id="Vector" d="M18.1564 9.44101L4.40636 2.56601C4.29859 2.51211 4.17754 2.49052 4.05778 2.50382C3.93803 2.51713 3.82467 2.56477 3.73136 2.64101C3.64225 2.71569 3.57574 2.81375 3.5393 2.92416C3.50287 3.03457 3.49795 3.15296 3.52511 3.26601L5.18136 9.37226H12.2501V10.6223H5.18136L3.50011 16.7098C3.47463 16.8042 3.47165 16.9032 3.49143 16.999C3.5112 17.0948 3.55317 17.1846 3.61396 17.2612C3.67475 17.3378 3.75267 17.399 3.84144 17.44C3.93022 17.481 4.02738 17.5006 4.12511 17.4973C4.22295 17.4967 4.31928 17.4731 4.40636 17.4285L18.1564 10.5535C18.2587 10.5011 18.3447 10.4214 18.4046 10.3232C18.4646 10.2251 18.4964 10.1123 18.4964 9.99726C18.4964 9.88223 18.4646 9.76943 18.4046 9.67129C18.3447 9.57314 18.2587 9.49346 18.1564 9.44101Z" fill="white"/>
1262
- </g>
1263
- <defs>
1264
- <clip-path id="clip0_11627_1046">
1265
- <rect width="20" height="20" fill="white"/>
1266
- </clip-path>
1267
- </defs>
1268
- </svg>
1269
- `;
1270
- const botIcon = () => b `
1271
- <svg xmlns="http://www.w3.org/2000/svg" width="11" height="14" viewBox="0 0 11 14" fill="none">
1272
- <g clip-path="url(#clip0_12070_2097)">
1273
- <path fill-rule="evenodd" clip-rule="evenodd" d="M0.80568 0.163439C0.778321 0.218288 0.77832 0.29009 0.77832 0.433692V13.4198C0.77832 13.5635 0.778321 13.6352 0.80568 13.6901C0.829747 13.7383 0.868147 13.7776 0.915379 13.8022C0.969076 13.8301 1.03937 13.8301 1.17995 13.8301H2.11452C2.2551 13.8301 2.32539 13.8301 2.37909 13.8022C2.42632 13.7776 2.46473 13.7383 2.48879 13.6901C2.51615 13.6352 2.51615 13.5635 2.51615 13.4198V12.9615C3.30953 13.6111 4.3166 13.9997 5.41254 13.9997C7.97194 13.9997 10.0468 11.8803 10.0468 9.26597C10.0468 6.65162 7.97194 4.53227 5.41254 4.53227C4.3166 4.53227 3.30953 4.92086 2.51615 5.57051V0.433692C2.51615 0.29009 2.51615 0.218288 2.48879 0.163439C2.46473 0.115193 2.42632 0.0759673 2.37909 0.0513845C2.32539 0.0234375 2.2551 0.0234375 2.11452 0.0234375H1.17995C1.03937 0.0234375 0.969076 0.0234375 0.915379 0.0513845C0.868147 0.0759673 0.829747 0.115193 0.80568 0.163439ZM2.51615 9.26597C2.51615 10.9 3.81291 12.2245 5.41254 12.2245C7.01214 12.2245 8.30892 10.9 8.30892 9.26597C8.30892 7.63202 7.01214 6.30741 5.41254 6.30741C3.81291 6.30741 2.51615 7.63202 2.51615 9.26597Z" fill="white"/>
1274
- </g>
1275
- <defs>
1276
- <clipPath id="clip0_12070_2097">
1277
- <rect width="9.33333" height="14" fill="white" transform="translate(0.75)"/>
1278
- </clipPath>
1279
- </defs>
1280
- </svg>
1281
- `;
1282
- const trueClassicIcon = () => b `<svg xmlns="http://www.w3.org/2000/svg" width="83" height="19" viewBox="0 0 83 19" fill="none">
1283
- <g clip-path="url(#clip0_12338_9219)">
1284
- <mask id="mask0_12338_9219" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="0" y="0" width="83" height="19">
1285
- <path d="M0.875 0.5H83V18.5H0.875V0.5Z" fill="white"/>
1286
- </mask>
1287
- <g mask="url(#mask0_12338_9219)">
1288
- <path d="M0.875 3.15127C1.5699 3.17412 2.26481 3.19696 2.95901 3.21704V18.182C3.81746 18.1453 4.67381 18.1106 5.53226 18.0767V3.29388L7.61627 3.35412V1.12142C5.36731 1.03835 3.12045 0.944193 0.875 0.844501V3.15127ZM15.4294 11.4984C15.4294 10.543 15.0145 9.74619 14.0087 9.3315C14.9394 9.03519 15.4294 8.28404 15.4294 7.35081V4.20427C15.4294 2.4285 14.326 1.35196 12.2939 1.28135C11.0431 1.24119 9.79504 1.19827 8.54421 1.15258V17.9618C9.40056 17.9306 10.259 17.9023 11.1182 17.8739V10.3942H11.7548C12.5389 10.3942 12.8589 10.7819 12.8589 11.5642V15.7042C12.8589 16.5322 12.9081 17.3145 13.1264 17.8109C13.9855 17.7853 14.8419 17.7597 15.7003 17.7368C15.4785 17.2197 15.4294 16.4235 15.4294 15.5782V11.4984ZM12.8561 7.33073C12.8561 7.97596 12.5613 8.31865 11.997 8.31588C11.7029 8.31588 11.4088 8.31588 11.1154 8.30965V3.37696C11.4088 3.3825 11.7029 3.39081 11.997 3.39981C12.562 3.41365 12.8561 3.76465 12.8561 4.41058V7.33073ZM20.8475 14.6761C20.8475 15.304 20.5281 15.7125 19.9659 15.7215C19.4009 15.7298 19.1068 15.3331 19.1068 14.699V1.48073C18.2489 1.46073 17.3912 1.43789 16.5335 1.41219V15.0133C16.5335 16.7856 17.9542 17.8593 19.9659 17.8109C22.0008 17.7624 23.4215 16.6464 23.4215 14.9101V1.58181C22.5623 1.5645 21.7067 1.54442 20.8475 1.52435V14.6761ZM24.6491 17.5367C26.4797 17.5056 28.3097 17.4772 30.1396 17.4571V15.3698C29.1597 15.3788 28.177 15.3871 27.1971 15.3989V10.3229H29.7219V8.23488C28.8796 8.23488 28.0387 8.22935 27.1971 8.22658V3.74735C28.177 3.75842 29.1597 3.77019 30.1396 3.7785V1.69258C28.3093 1.67018 26.4792 1.64064 24.6491 1.60396V17.5367ZM38.1204 1.61227C36.1087 1.60396 34.7133 2.65765 34.7133 4.36419V14.8416C34.7133 16.546 36.1115 17.6025 38.1204 17.5942C40.1546 17.5852 41.4286 16.5232 41.4314 14.825V11.3219H38.9298V14.5647C38.9298 15.176 38.6616 15.5671 38.0973 15.5671C37.5357 15.5671 37.2873 15.1787 37.2873 14.5674V4.63281C37.2873 4.02219 37.5322 3.63381 38.0973 3.63381C38.6588 3.63381 38.9298 4.02773 38.9298 4.63835V7.64158H41.4314V4.37873C41.4314 2.67981 40.1581 1.61781 38.1204 1.6095V1.61227ZM45.1839 1.7895C44.3346 1.7895 43.4838 1.79504 42.6338 1.79504V17.4135C44.4897 17.4135 46.3428 17.4225 48.1987 17.4343V15.3615C47.1928 15.356 46.1869 15.3532 45.1839 15.3497V1.7895ZM60.3033 1.43227C58.2916 1.47519 56.972 2.57735 56.9692 4.29842V6.79488C56.9692 8.01058 57.436 8.60458 58.1709 9.20135C58.9465 9.86388 59.7242 10.532 60.4999 11.2C60.9407 11.6223 61.0874 11.8937 61.0874 12.6075V14.7024C61.0874 15.3283 60.8424 15.7021 60.2773 15.6931C59.7158 15.6848 59.468 15.3054 59.468 14.6823V11.4423L56.9664 11.434V14.8997C56.9664 16.6208 58.2397 17.7202 60.2745 17.7631C62.2863 17.806 63.6578 16.7385 63.6578 14.9828V12.0419C63.6578 10.8061 63.1945 10.2003 62.4561 9.59527C61.6822 8.92683 60.9061 8.26082 60.1278 7.59727C59.687 7.17704 59.5396 6.91188 59.5396 6.20088V4.51304C59.5396 3.88996 59.7853 3.51058 60.3496 3.50227C60.9147 3.49396 61.1597 3.86781 61.1597 4.49296V7.48165L63.6585 7.46504V4.2105C63.6585 2.45758 62.3354 1.38935 60.3005 1.43504L60.3033 1.43227ZM67.9269 1.24396C65.918 1.30419 64.5949 2.44027 64.5928 4.19319V6.73673C64.5928 7.97596 65.0588 8.57827 65.7938 9.18958C66.5694 9.86596 67.3471 10.5451 68.1227 11.2333C68.5635 11.6673 68.7103 11.9443 68.7103 12.6719V14.816C68.7103 15.4557 68.4653 15.8385 67.9009 15.8267C67.3394 15.8157 67.0909 15.4245 67.0909 14.7903V11.479C66.2577 11.4735 65.4252 11.47 64.5921 11.4652V14.9987C64.5921 16.7517 65.8661 17.8857 67.9009 17.9424C69.9098 17.9992 71.2842 16.9178 71.2842 15.1185V12.1014C71.2842 10.8338 70.8174 10.2114 70.0825 9.59181C69.3091 8.90714 68.5327 8.22568 67.7535 7.54742C67.3127 7.11958 67.166 6.84819 67.166 6.12335V4.39881C67.166 3.76465 67.411 3.37073 67.976 3.35965C68.5404 3.34788 68.7854 3.72796 68.7854 4.36765V7.42488C69.6185 7.41935 70.4517 7.41104 71.2842 7.40481V4.06442C71.2842 2.2665 69.9611 1.18096 67.9269 1.24396ZM72.4375 17.894C73.3015 17.9216 74.1691 17.9507 75.0339 17.9826V1.1955C74.1691 1.22665 73.3015 1.25781 72.4375 1.28689V17.894ZM83 7.40481V3.76258C83 1.8615 81.726 0.737193 79.6911 0.825116C77.6822 0.913732 76.2847 2.11835 76.2847 3.94812V15.2307C76.2847 17.0611 77.6794 18.2657 79.6911 18.3543C81.726 18.4457 82.9972 17.318 83 15.419V11.5109L80.5012 11.4853V15.0569C80.5012 15.7277 80.2302 16.1507 79.668 16.1327C79.1036 16.1126 78.8615 15.6793 78.8587 15.014V4.16758C78.8587 3.4995 79.1036 3.06819 79.668 3.04812C80.233 3.0315 80.5012 3.45104 80.5012 4.12465V7.43388L83 7.40758V7.40481ZM52.4467 1.39835C50.4125 1.42396 48.9911 2.51435 48.9911 4.23335V17.437C49.8503 17.4426 50.7094 17.4481 51.5651 17.4599V13.6418L53.3058 13.6508V17.4765C54.165 17.4848 55.0234 17.4959 55.8798 17.5104V4.17865C55.8798 2.44027 54.4584 1.37481 52.4474 1.40112L52.4467 1.39835ZM51.5651 11.7103V4.48119C51.5651 3.86227 51.8823 3.46212 52.4474 3.45658C53.0117 3.45104 53.303 3.84773 53.3058 4.46735V11.713C52.7268 11.713 52.1442 11.713 51.5651 11.7075V11.7103Z" fill="#2B2A2A"/>
1289
- </g>
1290
- </g>
1291
- <defs>
1292
- <clipPath id="clip0_12338_9219">
1293
- <rect width="82.125" height="18" fill="white" transform="translate(0.875 0.5)"/>
1294
- </clipPath>
1295
- </defs>
1296
- </svg>`;
1297
- const shopGPTIcon = () => b `<svg xmlns="http://www.w3.org/2000/svg" width="105" height="37" viewBox="0 0 105 37" fill="none">
1298
- <path d="M10.1239 5.27861C10.0338 4.47936 9.66197 3.86022 9.00845 3.4212C8.35493 2.97655 7.53239 2.75422 6.54084 2.75422C5.83099 2.75422 5.2169 2.86679 4.69859 3.09193C4.18028 3.31144 3.77746 3.61538 3.49014 4.00375C3.20845 4.38649 3.06761 4.8227 3.06761 5.31238C3.06761 5.72326 3.16338 6.07786 3.35493 6.37617C3.55211 6.67448 3.80845 6.92495 4.12394 7.12758C4.44507 7.32458 4.78873 7.49062 5.15493 7.6257C5.52113 7.75516 5.87324 7.8621 6.21127 7.94653L7.90141 8.38555C8.45352 8.52064 9.01972 8.70356 9.6 8.93433C10.1803 9.1651 10.7183 9.46904 11.2141 9.84615C11.7099 10.2233 12.1099 10.6904 12.4141 11.2477C12.7239 11.8049 12.8789 12.4719 12.8789 13.2486C12.8789 14.228 12.6254 15.0976 12.1183 15.8574C11.6169 16.6173 10.8873 17.2167 9.92958 17.6557C8.97746 18.0947 7.82535 18.3143 6.47324 18.3143C5.17746 18.3143 4.05634 18.1088 3.10986 17.6979C2.16338 17.2871 1.42254 16.7045 0.887324 15.9503C0.352113 15.1904 0.056338 14.2899 0 13.2486H2.61972C2.67042 13.8734 2.87324 14.394 3.22817 14.8105C3.58873 15.2214 4.04789 15.5281 4.60563 15.7308C5.16901 15.9278 5.78591 16.0263 6.45634 16.0263C7.19437 16.0263 7.8507 15.9109 8.42535 15.6801C9.00563 15.4437 9.46197 15.1173 9.79437 14.7007C10.1268 14.2786 10.293 13.7861 10.293 13.2233C10.293 12.7111 10.1465 12.2917 9.85352 11.9653C9.5662 11.6388 9.17465 11.3687 8.67887 11.1548C8.18873 10.9409 7.6338 10.7523 7.01408 10.5891L4.96901 10.0319C3.5831 9.65478 2.48451 9.10038 1.67324 8.36867C0.867606 7.63696 0.464789 6.66886 0.464789 5.46435C0.464789 4.4681 0.735211 3.5985 1.27606 2.85553C1.8169 2.11257 2.5493 1.53565 3.47324 1.12477C4.39718 0.708255 5.43944 0.5 6.6 0.5C7.77183 0.5 8.80563 0.705441 9.70141 1.11632C10.6028 1.52721 11.3127 2.09287 11.831 2.81332C12.3493 3.52814 12.6197 4.34991 12.6423 5.27861H10.1239Z" fill="#172A41"/>
1299
- <path d="M18.1924 10.3274V18.0272H15.6656V0.736398H18.1586V7.16979H18.3191C18.6233 6.47186 19.0881 5.91745 19.7135 5.50657C20.3388 5.09569 21.1557 4.89024 22.1642 4.89024C23.0543 4.89024 23.8318 5.07317 24.4966 5.43902C25.167 5.80488 25.6853 6.35084 26.0515 7.07692C26.4233 7.79737 26.6093 8.69794 26.6093 9.77861V18.0272H24.0825V10.0826C24.0825 9.13133 23.8374 8.394 23.3473 7.87054C22.8571 7.34146 22.1755 7.07692 21.3022 7.07692C20.705 7.07692 20.1698 7.20356 19.6966 7.45685C19.229 7.71013 18.86 8.08161 18.5895 8.57129C18.3247 9.05535 18.1924 9.64071 18.1924 10.3274Z" fill="#172A41"/>
1300
- <path d="M35.3178 18.2889C34.1009 18.2889 33.0389 18.0103 32.1319 17.4531C31.2248 16.8959 30.5206 16.1163 30.0192 15.1144C29.5178 14.1126 29.2671 12.9418 29.2671 11.6023C29.2671 10.257 29.5178 9.08068 30.0192 8.07317C30.5206 7.06567 31.2248 6.2833 32.1319 5.72608C33.0389 5.16886 34.1009 4.89024 35.3178 4.89024C36.5347 4.89024 37.5967 5.16886 38.5037 5.72608C39.4108 6.2833 40.115 7.06567 40.6164 8.07317C41.1178 9.08068 41.3685 10.257 41.3685 11.6023C41.3685 12.9418 41.1178 14.1126 40.6164 15.1144C40.115 16.1163 39.4108 16.8959 38.5037 17.4531C37.5967 18.0103 36.5347 18.2889 35.3178 18.2889ZM35.3263 16.1698C36.115 16.1698 36.7685 15.9615 37.2868 15.545C37.8051 15.1285 38.1882 14.5741 38.4361 13.8818C38.6896 13.1895 38.8164 12.4268 38.8164 11.5938C38.8164 10.7664 38.6896 10.0066 38.4361 9.31426C38.1882 8.61632 37.8051 8.05629 37.2868 7.63415C36.7685 7.21201 36.115 7.00094 35.3263 7.00094C34.5319 7.00094 33.8727 7.21201 33.3488 7.63415C32.8305 8.05629 32.4446 8.61632 32.191 9.31426C31.9432 10.0066 31.8192 10.7664 31.8192 11.5938C31.8192 12.4268 31.9432 13.1895 32.191 13.8818C32.4446 14.5741 32.8305 15.1285 33.3488 15.545C33.8727 15.9615 34.5319 16.1698 35.3263 16.1698Z" fill="#172A41"/>
1301
- <path d="M44.058 22.8902V5.0591H46.5257V7.16135H46.7369C46.8834 6.89118 47.0947 6.5788 47.3707 6.2242C47.6468 5.86961 48.0299 5.56004 48.52 5.2955C49.0102 5.02533 49.6581 4.89024 50.4637 4.89024C51.5116 4.89024 52.4468 5.15478 53.2693 5.68387C54.0919 6.21295 54.7369 6.97561 55.2045 7.97186C55.6778 8.96811 55.9144 10.167 55.9144 11.5685C55.9144 12.97 55.6806 14.1717 55.213 15.1735C54.7454 16.1698 54.1031 16.9381 53.2862 17.4784C52.4693 18.0131 51.5369 18.2805 50.489 18.2805C49.7003 18.2805 49.0552 18.1482 48.5538 17.8837C48.058 17.6191 47.6693 17.3096 47.3876 16.955C47.1059 16.6004 46.889 16.2852 46.7369 16.0094H46.5848V22.8902H44.058ZM46.5341 11.5432C46.5341 12.455 46.6665 13.2542 46.9313 13.9409C47.1961 14.6276 47.5792 15.1651 48.0806 15.5535C48.582 15.9362 49.1961 16.1276 49.9228 16.1276C50.6778 16.1276 51.3088 15.9278 51.8158 15.5281C52.3228 15.1229 52.7059 14.5741 52.9651 13.8818C53.2299 13.1895 53.3623 12.4099 53.3623 11.5432C53.3623 10.6876 53.2327 9.91932 52.9735 9.23827C52.72 8.55722 52.3369 8.0197 51.8242 7.6257C51.3172 7.23171 50.6834 7.03471 49.9228 7.03471C49.1904 7.03471 48.5707 7.22326 48.0637 7.60038C47.5623 7.97749 47.182 8.50375 46.9228 9.17917C46.6637 9.8546 46.5341 10.6426 46.5341 11.5432Z" fill="#172A41"/>
1302
- <path d="M70.53 6.19887C70.3666 5.68668 70.1469 5.22795 69.8708 4.8227C69.6004 4.41182 69.2765 4.06285 68.899 3.7758C68.5215 3.48311 68.0905 3.26079 67.606 3.10882C67.1272 2.95685 66.6004 2.88086 66.0258 2.88086C65.0511 2.88086 64.1722 3.13133 63.3891 3.63227C62.606 4.13321 61.9863 4.86773 61.53 5.83583C61.0793 6.79831 60.8539 7.97749 60.8539 9.37336C60.8539 10.7749 61.0821 11.9597 61.5384 12.9278C61.9948 13.8959 62.6201 14.6304 63.4145 15.1313C64.2089 15.6323 65.1131 15.8827 66.1272 15.8827C67.068 15.8827 67.8877 15.6914 68.5863 15.3086C69.2905 14.9259 69.8342 14.3856 70.2173 13.6876C70.606 12.9841 70.8004 12.1567 70.8004 11.2054L71.4765 11.3321H66.5243V9.17917H73.3272V11.1463C73.3272 12.5985 73.0173 13.8593 72.3976 14.9287C71.7835 15.9925 70.9328 16.8143 69.8455 17.394C68.7638 17.9737 67.5243 18.2636 66.1272 18.2636C64.561 18.2636 63.1863 17.9034 62.0032 17.1829C60.8258 16.4625 59.9074 15.4409 59.2483 14.1182C58.5891 12.7899 58.2596 11.2139 58.2596 9.39024C58.2596 8.01126 58.4511 6.77298 58.8342 5.67542C59.2173 4.57786 59.7553 3.64634 60.4483 2.88086C61.1469 2.10976 61.9666 1.52158 62.9074 1.11632C63.8539 0.705441 64.8877 0.5 66.0089 0.5C66.9441 0.5 67.8145 0.637899 68.6201 0.913696C69.4314 1.18949 70.1525 1.58068 70.7835 2.08724C71.4201 2.59381 71.9469 3.19606 72.3638 3.894C72.7807 4.5863 73.0624 5.3546 73.2089 6.19887H70.53Z" fill="#172A41"/>
1303
- <path d="M76.5111 18.0272V0.736398H82.6801C84.0266 0.736398 85.1421 0.981238 86.0266 1.47092C86.9111 1.9606 87.573 2.63039 88.0125 3.4803C88.4519 4.32458 88.6716 5.2758 88.6716 6.33396C88.6716 7.39775 88.4491 8.3546 88.004 9.2045C87.5646 10.0488 86.8998 10.7186 86.0097 11.2139C85.1252 11.7036 84.0125 11.9484 82.6716 11.9484H78.4294V9.7364H82.435C83.2857 9.7364 83.9759 9.59006 84.5054 9.29737C85.035 8.99906 85.4237 8.59381 85.6716 8.08161C85.9195 7.56942 86.0435 6.98687 86.0435 6.33396C86.0435 5.68105 85.9195 5.10131 85.6716 4.59475C85.4237 4.08818 85.0322 3.69137 84.497 3.40432C83.9674 3.11726 83.2688 2.97373 82.4012 2.97373H79.1223V18.0272H76.5111Z" fill="#172A41"/>
1304
- <path d="M90.7485 2.98218V0.736398H104.143V2.98218H98.7429V18.0272H96.14V2.98218H90.7485Z" fill="#172A41"/>
1305
- <path d="M0.269894 36.5V28.6989H1.34947V29.6186H1.4419C1.50599 29.5004 1.59842 29.3637 1.71919 29.2086C1.83996 29.0535 2.00757 28.918 2.22201 28.8023C2.43644 28.6841 2.71989 28.625 3.07236 28.625C3.53081 28.625 3.93996 28.7407 4.29982 28.9722C4.65968 29.2037 4.9419 29.5373 5.14648 29.9732C5.35352 30.4091 5.45704 30.9336 5.45704 31.5467C5.45704 32.1599 5.35475 32.6856 5.15018 33.1239C4.9456 33.5598 4.66461 33.8959 4.30722 34.1323C3.94982 34.3663 3.5419 34.4832 3.08345 34.4832C2.73838 34.4832 2.45616 34.4254 2.2368 34.3096C2.01989 34.1939 1.84982 34.0585 1.72658 33.9033C1.60335 33.7482 1.50845 33.6103 1.4419 33.4896H1.37535V36.5H0.269894ZM1.35317 31.5356C1.35317 31.9346 1.41109 32.2842 1.52694 32.5847C1.64278 32.8851 1.81039 33.1203 2.02975 33.2902C2.24912 33.4576 2.51778 33.5413 2.83574 33.5413C3.16602 33.5413 3.44208 33.4539 3.66391 33.2791C3.88574 33.1018 4.05335 32.8617 4.16673 32.5588C4.28257 32.2559 4.34049 31.9149 4.34049 31.5356C4.34049 31.1614 4.2838 30.8252 4.17042 30.5273C4.05951 30.2293 3.8919 29.9941 3.66761 29.8218C3.44577 29.6494 3.16849 29.5632 2.83574 29.5632C2.51532 29.5632 2.24419 29.6457 2.02236 29.8107C1.80299 29.9757 1.63662 30.2059 1.52324 30.5014C1.40986 30.7969 1.35317 31.1417 1.35317 31.5356Z" fill="#4E647F"/>
1306
- <path d="M8.95679 34.4869C8.4244 34.4869 7.95978 34.365 7.56295 34.1212C7.16612 33.8775 6.85802 33.5364 6.63866 33.0981C6.41929 32.6598 6.30961 32.1476 6.30961 31.5615C6.30961 30.973 6.41929 30.4583 6.63866 30.0175C6.85802 29.5767 7.16612 29.2345 7.56295 28.9907C7.95978 28.7469 8.4244 28.625 8.95679 28.625C9.48919 28.625 9.9538 28.7469 10.3506 28.9907C10.7475 29.2345 11.0556 29.5767 11.2749 30.0175C11.4943 30.4583 11.604 30.973 11.604 31.5615C11.604 32.1476 11.4943 32.6598 11.2749 33.0981C11.0556 33.5364 10.7475 33.8775 10.3506 34.1212C9.9538 34.365 9.48919 34.4869 8.95679 34.4869ZM8.96049 33.5598C9.30556 33.5598 9.59147 33.4687 9.81824 33.2865C10.045 33.1042 10.2126 32.8617 10.3211 32.5588C10.432 32.2559 10.4874 31.9223 10.4874 31.5578C10.4874 31.1958 10.432 30.8634 10.3211 30.5605C10.2126 30.2552 10.045 30.0101 9.81824 29.8255C9.59147 29.6408 9.30556 29.5484 8.96049 29.5484C8.61295 29.5484 8.32457 29.6408 8.09535 29.8255C7.86859 30.0101 7.69975 30.2552 7.58883 30.5605C7.48038 30.8634 7.42616 31.1958 7.42616 31.5578C7.42616 31.9223 7.48038 32.2559 7.58883 32.5588C7.69975 32.8617 7.86859 33.1042 8.09535 33.2865C8.32457 33.4687 8.61295 33.5598 8.96049 33.5598Z" fill="#4E647F"/>
1307
- <path d="M13.7653 34.3724L12.0942 28.6989H13.2366L14.3495 32.8654H14.405L15.5215 28.6989H16.6639L17.7731 32.8469H17.8285L18.934 28.6989H20.0764L18.409 34.3724H17.2814L16.1278 30.2761H16.0428L14.8893 34.3724H13.7653Z" fill="#4E647F"/>
1308
- <path d="M23.2693 34.4869C22.7098 34.4869 22.2279 34.3675 21.8237 34.1286C21.422 33.8873 21.1114 33.5487 20.892 33.1129C20.6751 32.6745 20.5667 32.1611 20.5667 31.5726C20.5667 30.9914 20.6751 30.4792 20.892 30.036C21.1114 29.5928 21.417 29.2468 21.8089 28.9981C22.2033 28.7494 22.6642 28.625 23.1917 28.625C23.5121 28.625 23.8227 28.6779 24.1234 28.7838C24.4241 28.8897 24.694 29.0559 24.9331 29.2825C25.1721 29.509 25.3607 29.8033 25.4987 30.1653C25.6367 30.5248 25.7058 30.9619 25.7058 31.4765V31.8681H21.1915V31.0407H24.6225C24.6225 30.7501 24.5633 30.4928 24.445 30.2687C24.3267 30.0422 24.1603 29.8636 23.9459 29.7331C23.7339 29.6026 23.485 29.5373 23.1991 29.5373C22.8885 29.5373 22.6174 29.6137 22.3857 29.7664C22.1565 29.9166 21.979 30.1136 21.8533 30.3574C21.7301 30.5987 21.6684 30.8609 21.6684 31.1441V31.7905C21.6684 32.1697 21.735 32.4923 21.8681 32.7583C22.0036 33.0242 22.1922 33.2274 22.4338 33.3677C22.6753 33.5056 22.9575 33.5746 23.2804 33.5746C23.4899 33.5746 23.6809 33.545 23.8535 33.4859C24.026 33.4244 24.1751 33.3333 24.3008 33.2126C24.4265 33.0919 24.5227 32.943 24.5892 32.7657L25.6355 32.954C25.5517 33.2618 25.4014 33.5315 25.1845 33.763C24.97 33.992 24.7001 34.1705 24.3748 34.2985C24.0519 34.4241 23.6834 34.4869 23.2693 34.4869Z" fill="#4E647F"/>
1309
- <path d="M26.8014 34.3724V28.6989H27.8699V29.6001H27.9291C28.0326 29.2948 28.215 29.0547 28.4762 28.8799C28.74 28.7026 29.0382 28.6139 29.371 28.6139C29.44 28.6139 29.5213 28.6164 29.615 28.6213C29.7111 28.6262 29.7863 28.6324 29.8405 28.6398V29.6962C29.7961 29.6839 29.7173 29.6703 29.6039 29.6555C29.4905 29.6383 29.3771 29.6297 29.2637 29.6297C29.0025 29.6297 28.7696 29.6851 28.565 29.7959C28.3629 29.9043 28.2027 30.0557 28.0843 30.2502C27.966 30.4423 27.9069 30.6615 27.9069 30.9077V34.3724H26.8014Z" fill="#4E647F"/>
1310
- <path d="M32.9104 34.4869C32.3509 34.4869 31.8691 34.3675 31.4649 34.1286C31.0631 33.8873 30.7525 33.5487 30.5332 33.1129C30.3163 32.6745 30.2078 32.1611 30.2078 31.5726C30.2078 30.9914 30.3163 30.4792 30.5332 30.036C30.7525 29.5928 31.0582 29.2468 31.4501 28.9981C31.8444 28.7494 32.3053 28.625 32.8328 28.625C33.1532 28.625 33.4638 28.6779 33.7645 28.7838C34.0652 28.8897 34.3351 29.0559 34.5742 29.2825C34.8133 29.509 35.0018 29.8033 35.1399 30.1653C35.2779 30.5248 35.3469 30.9619 35.3469 31.4765V31.8681H30.8326V31.0407H34.2636C34.2636 30.7501 34.2045 30.4928 34.0862 30.2687C33.9678 30.0422 33.8015 29.8636 33.587 29.7331C33.3751 29.6026 33.1261 29.5373 32.8402 29.5373C32.5296 29.5373 32.2585 29.6137 32.0268 29.7664C31.7976 29.9166 31.6201 30.1136 31.4944 30.3574C31.3712 30.5987 31.3096 30.8609 31.3096 31.1441V31.7905C31.3096 32.1697 31.3761 32.4923 31.5092 32.7583C31.6448 33.0242 31.8333 33.2274 32.0749 33.3677C32.3164 33.5056 32.5987 33.5746 32.9215 33.5746C33.1311 33.5746 33.3221 33.545 33.4946 33.4859C33.6671 33.4244 33.8163 33.3333 33.942 33.2126C34.0677 33.0919 34.1638 32.943 34.2303 32.7657L35.2766 32.954C35.1928 33.2618 35.0425 33.5315 34.8256 33.763C34.6112 33.992 34.3413 34.1705 34.0159 34.2985C33.693 34.4241 33.3245 34.4869 32.9104 34.4869Z" fill="#4E647F"/>
1311
- <path d="M38.5684 34.4832C38.11 34.4832 37.7008 34.3663 37.341 34.1323C36.9836 33.8959 36.7026 33.5598 36.498 33.1239C36.2959 32.6856 36.1948 32.1599 36.1948 31.5467C36.1948 30.9336 36.2971 30.4091 36.5017 29.9732C36.7087 29.5373 36.9922 29.2037 37.3521 28.9722C37.7119 28.7407 38.1198 28.625 38.5758 28.625C38.9283 28.625 39.2117 28.6841 39.4262 28.8023C39.6431 28.918 39.8107 29.0535 39.929 29.2086C40.0498 29.3637 40.1434 29.5004 40.21 29.6186H40.2765V26.8077H41.382V34.3724H40.3024V33.4896H40.21C40.1434 33.6103 40.0473 33.7482 39.9216 33.9033C39.7984 34.0585 39.6283 34.1939 39.4114 34.3096C39.1945 34.4254 38.9135 34.4832 38.5684 34.4832ZM38.8124 33.5413C39.1304 33.5413 39.3991 33.4576 39.6184 33.2902C39.8403 33.1203 40.0079 32.8851 40.1213 32.5847C40.2371 32.2842 40.295 31.9346 40.295 31.5356C40.295 31.1417 40.2383 30.7969 40.1249 30.5014C40.0116 30.2059 39.8452 29.9757 39.6258 29.8107C39.4065 29.6457 39.1353 29.5632 38.8124 29.5632C38.4797 29.5632 38.2024 29.6494 37.9806 29.8218C37.7587 29.9941 37.5911 30.2293 37.4778 30.5273C37.3668 30.8252 37.3114 31.1614 37.3114 31.5356C37.3114 31.9149 37.3681 32.2559 37.4815 32.5588C37.5948 32.8617 37.7624 33.1018 37.9843 33.2791C38.2086 33.4539 38.4846 33.5413 38.8124 33.5413Z" fill="#4E647F"/>
1312
- <path d="M45.542 34.3724V26.8077H46.6475V29.6186H46.7141C46.7781 29.5004 46.8706 29.3637 46.9913 29.2086C47.1121 29.0535 47.2797 28.918 47.4942 28.8023C47.7086 28.6841 47.9921 28.625 48.3445 28.625C48.803 28.625 49.2121 28.7407 49.572 28.9722C49.9318 29.2037 50.2141 29.5373 50.4186 29.9732C50.6257 30.4091 50.7292 30.9336 50.7292 31.5467C50.7292 32.1599 50.6269 32.6856 50.4223 33.1239C50.2178 33.5598 49.9368 33.8959 49.5794 34.1323C49.222 34.3663 48.8141 34.4832 48.3556 34.4832C48.0105 34.4832 47.7283 34.4254 47.509 34.3096C47.292 34.1939 47.122 34.0585 46.9987 33.9033C46.8755 33.7482 46.7806 33.6103 46.7141 33.4896H46.6216V34.3724H45.542ZM46.6253 31.5356C46.6253 31.9346 46.6832 32.2842 46.7991 32.5847C46.9149 32.8851 47.0825 33.1203 47.3019 33.2902C47.5213 33.4576 47.7899 33.5413 48.1079 33.5413C48.4382 33.5413 48.7142 33.4539 48.9361 33.2791C49.1579 33.1018 49.3255 32.8617 49.4389 32.5588C49.5547 32.2559 49.6126 31.9149 49.6126 31.5356C49.6126 31.1614 49.556 30.8252 49.4426 30.5273C49.3317 30.2293 49.1641 29.9941 48.9398 29.8218C48.7179 29.6494 48.4406 29.5632 48.1079 29.5632C47.7875 29.5632 47.5163 29.6457 47.2945 29.8107C47.0751 29.9757 46.9088 30.2059 46.7954 30.5014C46.682 30.7969 46.6253 31.1417 46.6253 31.5356Z" fill="#4E647F"/>
1313
- <path d="M52.3452 36.5C52.1801 36.5 52.0297 36.4865 51.8942 36.4594C51.7586 36.4347 51.6576 36.4077 51.591 36.3781L51.8572 35.4731C52.0593 35.5273 52.2393 35.5507 52.397 35.5433C52.5547 35.5359 52.694 35.4768 52.8148 35.366C52.938 35.2552 53.0465 35.0742 53.1401 34.8231L53.2769 34.4463L51.1991 28.6989H52.3822L53.8204 33.1018H53.8796L55.3178 28.6989H56.5046L54.1642 35.1296C54.0558 35.4251 53.9178 35.6751 53.7502 35.8795C53.5826 36.0863 53.3829 36.2414 53.1512 36.3449C52.9195 36.4483 52.6509 36.5 52.3452 36.5Z" fill="#4E647F"/>
1314
- <path fill-rule="evenodd" clip-rule="evenodd" d="M60.5232 26.2954C60.507 26.3274 60.507 26.3693 60.507 26.4532V34.0339C60.507 34.1178 60.507 34.1597 60.5232 34.1917C60.5374 34.2198 60.56 34.2428 60.5879 34.2571C60.6196 34.2734 60.661 34.2734 60.7439 34.2734H61.2952C61.3781 34.2734 61.4196 34.2734 61.4513 34.2571C61.4791 34.2428 61.5018 34.2198 61.516 34.1917C61.5321 34.1597 61.5321 34.1178 61.5321 34.0339V33.7664C62.0001 34.1456 62.5941 34.3724 63.2406 34.3724C64.7502 34.3724 65.9741 33.1352 65.9741 31.6091C65.9741 30.0829 64.7502 28.8457 63.2406 28.8457C62.5941 28.8457 62.0001 29.0726 61.5321 29.4518V26.4532C61.5321 26.3693 61.5321 26.3274 61.516 26.2954C61.5018 26.2672 61.4791 26.2443 61.4513 26.23C61.4196 26.2137 61.3781 26.2137 61.2952 26.2137H60.7439C60.661 26.2137 60.6196 26.2137 60.5879 26.23C60.56 26.2443 60.5374 26.2672 60.5232 26.2954ZM61.5321 31.6091C61.5321 32.5629 62.297 33.3362 63.2406 33.3362C64.1841 33.3362 64.949 32.5629 64.949 31.6091C64.949 30.6552 64.1841 29.882 63.2406 29.882C62.297 29.882 61.5321 30.6552 61.5321 31.6091Z" fill="#F25C2B"/>
1315
- <path d="M88.2382 29.0703C88.2221 29.1023 88.2221 29.1442 88.2221 29.2281V31.8302C88.2196 32.0036 88.1831 32.175 88.1149 32.3353C88.0442 32.5015 87.9407 32.6525 87.8101 32.7797C87.7732 32.8156 87.7344 32.8494 87.6938 32.881C87.585 32.9797 87.4613 33.0596 87.3276 33.1173C87.1653 33.1873 86.9915 33.2234 86.8158 33.2234C86.6403 33.2234 86.4663 33.1873 86.3041 33.1173C86.1702 33.0595 86.0463 32.9795 85.9374 32.8805C85.897 32.8491 85.8584 32.8154 85.8217 32.7797C85.6911 32.6525 85.5875 32.5015 85.5169 32.3353C85.4487 32.175 85.4124 32.0036 85.41 31.8302L85.4097 29.2282C85.4097 29.1443 85.4096 29.1024 85.3935 29.0704C85.3793 29.0422 85.3567 29.0193 85.3288 29.005C85.2971 28.9887 85.2557 28.9887 85.1727 28.9887H84.6215C84.5386 28.9887 84.4971 28.9887 84.4654 29.005C84.4376 29.0193 84.4149 29.0422 84.4007 29.0704C84.3846 29.1024 84.3846 29.1443 84.3846 29.2282V31.8302C84.3846 32.1628 84.4475 32.4922 84.5697 32.7995C84.5786 32.822 84.5878 32.8443 84.5973 32.8664C84.7182 33.1474 84.8874 33.4033 85.0967 33.6213C85.3224 33.8566 85.5905 34.0431 85.8855 34.1704C86.1804 34.2977 86.4966 34.3633 86.8158 34.3633C87.1351 34.3633 87.4513 34.2977 87.7462 34.1704C88.0412 34.0431 88.3093 33.8566 88.535 33.6213C88.7443 33.4033 88.9135 33.1474 89.0344 32.8664C89.0439 32.8443 89.0531 32.822 89.0621 32.7995C89.1842 32.4922 89.2471 32.1628 89.2471 31.8302V29.2281C89.2471 29.1442 89.2471 29.1023 89.231 29.0703C89.2168 29.0421 89.1941 29.0192 89.1663 29.0049C89.1346 28.9886 89.0931 28.9886 89.0102 28.9886H88.459C88.376 28.9886 88.3346 28.9886 88.3029 29.0049C88.275 29.0192 88.2524 29.0421 88.2382 29.0703Z" fill="#F25C2B"/>
1316
- <path d="M66.8112 26.4393C66.8112 26.3555 66.8112 26.3136 66.8273 26.2815C66.8415 26.2534 66.8642 26.2305 66.8921 26.2161C66.9237 26.1998 66.9652 26.1998 67.0481 26.1998H67.5994C67.6823 26.1998 67.7238 26.1998 67.7554 26.2161C67.7833 26.2305 67.8059 26.2534 67.8201 26.2815C67.8363 26.3136 67.8363 26.3555 67.8363 26.4393V34.0201C67.8363 34.1039 67.8363 34.1458 67.8201 34.1778C67.8059 34.206 67.7833 34.2289 67.7554 34.2433C67.7238 34.2595 67.6823 34.2595 67.5994 34.2595H67.0481C66.9652 34.2595 66.9237 34.2595 66.8921 34.2433C66.8642 34.2289 66.8415 34.206 66.8273 34.1778C66.8112 34.1458 66.8112 34.1039 66.8112 34.0201V26.4393Z" fill="#F25C2B"/>
1317
- <path fill-rule="evenodd" clip-rule="evenodd" d="M71.4069 33.327C72.3504 33.327 73.1154 32.5538 73.1154 31.5999C73.1154 30.6461 72.3504 29.8728 71.4069 29.8728C70.4633 29.8728 69.6984 30.6461 69.6984 31.5999C69.6984 32.5538 70.4633 33.327 71.4069 33.327ZM71.4069 34.3633C72.9166 34.3633 74.1404 33.1261 74.1404 31.5999C74.1404 30.0738 72.9166 28.8366 71.4069 28.8366C69.8972 28.8366 68.6734 30.0738 68.6734 31.5999C68.6734 33.1261 69.8972 34.3633 71.4069 34.3633Z" fill="#F25C2B"/>
1318
- <path fill-rule="evenodd" clip-rule="evenodd" d="M80.8045 33.327C81.748 33.327 82.5129 32.5538 82.5129 31.5999C82.5129 30.6461 81.748 29.8728 80.8045 29.8728C79.8609 29.8728 79.096 30.6461 79.096 31.5999C79.096 32.5538 79.8609 33.327 80.8045 33.327ZM80.8045 34.3633C82.3141 34.3633 83.538 33.1261 83.538 31.5999C83.538 30.0738 82.3141 28.8366 80.8045 28.8366C79.2948 28.8366 78.0709 30.0738 78.0709 31.5999C78.0709 33.1261 79.2948 34.3633 80.8045 34.3633Z" fill="#F25C2B"/>
1319
- <path d="M75.2265 26.1998C75.1436 26.1998 75.1021 26.1998 75.0705 26.2161C75.0426 26.2305 75.02 26.2534 75.0058 26.2815C74.9896 26.3135 74.9896 26.3555 74.9896 26.4393V27.4083H74.6394C74.5593 27.4083 74.5183 27.4086 74.4872 27.4247C74.4593 27.439 74.4367 27.4619 74.4225 27.49C74.4063 27.5221 74.4063 27.564 74.4063 27.6478V28.2051C74.4063 28.2889 74.4063 28.3308 74.4225 28.3628C74.4367 28.391 74.4593 28.4139 74.4872 28.4282C74.5188 28.4446 74.5603 28.4446 74.6432 28.4446H74.9896V32.5994H74.9882C74.9878 32.6063 74.9874 32.6131 74.987 32.62C74.9876 32.6359 74.9885 32.6518 74.9896 32.6676V32.7073L74.9918 32.7072C75.0376 33.5766 75.7476 34.2581 76.6088 34.2595C76.7762 34.2594 76.9423 34.233 77.1013 34.1816C77.1703 34.1593 77.2245 34.0768 77.2243 34.0035L77.2261 33.2371C77.2261 33.2257 77.224 33.2075 77.2211 33.1964C77.2206 33.1945 77.22 33.1924 77.2194 33.1903C77.2148 33.1737 77.2005 33.1492 77.1865 33.1391C77.1828 33.1365 77.1347 33.1088 77.0944 33.1334C77.0512 33.1536 77.0505 33.154 77.0498 33.1543C77.0388 33.1596 77.0016 33.1737 76.9842 33.1839C76.8335 33.2484 76.8109 33.2469 76.7666 33.2532C76.7363 33.2575 76.7058 33.2596 76.6752 33.2596C76.6174 33.2596 76.56 33.252 76.5042 33.2369C76.4485 33.2218 76.3949 33.1993 76.3449 33.1702C76.3181 33.1523 76.2927 33.1326 76.2687 33.1111C76.2546 33.1011 76.241 33.0905 76.2278 33.0793C76.2212 33.0744 76.2146 33.0693 76.2081 33.0641C76.2064 33.0618 76.2047 33.0596 76.203 33.0573C76.0832 32.9441 76.0151 32.7858 76.0147 32.62C76.0151 32.6146 76.0157 32.6092 76.0163 32.6039C76.0157 32.5999 76.0152 32.5959 76.0147 32.592V28.4446H76.9737C77.0566 28.4446 77.0981 28.4446 77.1298 28.4282C77.1576 28.4139 77.1803 28.391 77.1945 28.3628C77.2106 28.3308 77.2106 28.2889 77.2106 28.2051V27.6478C77.2106 27.564 77.2106 27.5221 77.1945 27.49C77.1803 27.4619 77.1576 27.439 77.1298 27.4247C77.0981 27.4083 77.0566 27.4083 76.9737 27.4083H76.0147V26.4393C76.0147 26.3555 76.0147 26.3135 75.9985 26.2815C75.9843 26.2534 75.9617 26.2305 75.9338 26.2161C75.9021 26.1998 75.8607 26.1998 75.7778 26.1998H75.2265Z" fill="#F25C2B"/>
1320
- <path d="M90.323 26.2117C90.2401 26.2117 90.1986 26.2117 90.1669 26.2281C90.1391 26.2424 90.1165 26.2653 90.1022 26.2934C90.0861 26.3255 90.0861 26.3674 90.0861 26.4512V27.4203H89.7359C89.6558 27.4203 89.6148 27.4205 89.5836 27.4366C89.5558 27.4509 89.5331 27.4738 89.5189 27.502C89.5028 27.534 89.5028 27.5759 89.5028 27.6597V28.217C89.5028 28.3008 89.5028 28.3427 89.5189 28.3748C89.5331 28.4029 89.5558 28.4258 89.5836 28.4402C89.6153 28.4565 89.6568 28.4565 89.7397 28.4565H90.0861V32.6113H90.0847C90.0843 32.6182 90.0838 32.6251 90.0835 32.6319C90.0841 32.6478 90.085 32.6637 90.0861 32.6795V32.7192L90.0883 32.7191C90.1341 33.5885 90.844 34.2701 91.7052 34.2715C91.8727 34.2713 92.0388 34.245 92.1978 34.1936C92.2668 34.1713 92.321 34.0887 92.3208 34.0154L92.3225 33.249C92.3226 33.2376 92.3205 33.2194 92.3176 33.2084C92.317 33.2064 92.3165 33.2043 92.3159 33.2022C92.3113 33.1856 92.297 33.1611 92.283 33.151C92.2793 33.1484 92.2311 33.1207 92.1908 33.1453C92.1477 33.1656 92.147 33.1659 92.1463 33.1662C92.1353 33.1715 92.0981 33.1856 92.0807 33.1958C91.9299 33.2603 91.9074 33.2589 91.8631 33.2651C91.8328 33.2694 91.8023 33.2716 91.7716 33.2716C91.7139 33.2716 91.6565 33.2639 91.6007 33.2488C91.5449 33.2337 91.4914 33.2113 91.4414 33.1821C91.4146 33.1643 91.3891 33.1445 91.3652 33.123C91.3511 33.113 91.3375 33.1024 91.3243 33.0912C91.3176 33.0863 91.3111 33.0812 91.3046 33.076C91.3029 33.0738 91.3012 33.0715 91.2995 33.0692C91.1797 32.956 91.1115 32.7977 91.1112 32.6319C91.1116 32.6265 91.1121 32.6212 91.1127 32.6158C91.1122 32.6118 91.1116 32.6079 91.1112 32.6039V28.4565H92.0702C92.1531 28.4565 92.1946 28.4565 92.2262 28.4402C92.2541 28.4258 92.2767 28.4029 92.2909 28.3748C92.3071 28.3427 92.3071 28.3008 92.3071 28.217V27.6597C92.3071 27.5759 92.3071 27.534 92.2909 27.502C92.2767 27.4738 92.2541 27.4509 92.2262 27.4366C92.1946 27.4203 92.1531 27.4203 92.0702 27.4203H91.1112V26.4512C91.1112 26.3674 91.1112 26.3255 91.095 26.2934C91.0808 26.2653 91.0582 26.2424 91.0303 26.2281C90.9986 26.2117 90.9572 26.2117 90.8743 26.2117H90.323Z" fill="#F25C2B"/>
1321
- </svg>`;
1814
+ .user-details {
1815
+ margin-top: 14px;
1816
+ }
1322
1817
 
1323
- const IMAGE_WIDTHS = [165, 360, 533, 720, 940, 1066, 1600];
1324
- const getImageProperties = (src) => {
1325
- if (!src) {
1326
- return;
1818
+ .product-handle.context {
1819
+ padding: 8px 13px;
1820
+ border-radius: 5px;
1821
+ border: 1px solid #dbe2eb;
1822
+ background: #f1f4f8;
1823
+ margin-top: 16px;
1824
+ line-height: 24px;
1825
+ }
1826
+ }
1827
+
1828
+ .context-container.show {
1829
+ display: flex;
1830
+ flex-direction: column;
1831
+ gap: 24px;
1832
+ }
1833
+
1834
+ .typing-dots {
1835
+ display: flex;
1836
+ align-items: center;
1837
+ justify-content: center;
1838
+ gap: 8px;
1839
+ }
1840
+
1841
+ .dot {
1842
+ width: 6px;
1843
+ height: 6px;
1844
+ background-color: #b6b6b6;
1845
+ border-radius: 50%;
1846
+ animation: bounce 1.2s infinite ease-in-out;
1847
+ }
1848
+
1849
+ .dot:nth-child(1) {
1850
+ animation-delay: 0s;
1851
+ }
1852
+
1853
+ .dot:nth-child(2) {
1854
+ animation-delay: 0.2s;
1855
+ }
1856
+
1857
+ .dot:nth-child(3) {
1858
+ animation-delay: 0.4s;
1859
+ }
1860
+
1861
+ @keyframes bounce {
1862
+ 0%,
1863
+ 80%,
1864
+ 100% {
1865
+ transform: translateY(0);
1866
+ background-color: #b6b6b6;
1867
+ }
1868
+ 40% {
1869
+ transform: translateY(-4px);
1870
+ background-color: #8b8b8b;
1871
+ }
1872
+ }
1873
+
1874
+ .prompts {
1875
+ display: flex;
1876
+ justify-content: center;
1877
+ gap: 23px 10px;
1878
+ flex-wrap: wrap;
1879
+
1880
+ .prompt {
1881
+ padding: 10px;
1882
+ border-radius: 10px;
1883
+ border: 1px solid #a3b2c6;
1884
+
1885
+ color: #4e647f;
1886
+ line-height: 21px;
1887
+ letter-spacing: -0.32px;
1888
+
1889
+ &:hover {
1890
+ background: rgb(241, 244, 248);
1891
+ }
1892
+
1893
+ &:active {
1894
+ background: rgb(78, 100, 127);
1895
+ color: rgb(255, 255, 255);
1896
+ }
1897
+ }
1898
+ }
1899
+
1900
+ #modal-chat-threads {
1901
+ .chat-threads {
1902
+ position: absolute;
1903
+ overflow: hidden;
1904
+ z-index: 1;
1905
+ top: 78px;
1906
+ height: 30%;
1907
+ width: 100%;
1908
+ background: #fff;
1909
+ box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.12),
1910
+ 0px 20px 20px 0px rgba(0, 0, 0, 0.08);
1911
+ border-radius: 0px 0px 10px 10px;
1912
+
1913
+ h2 {
1914
+ padding: 10px 16px;
1915
+ color: #172a41;
1916
+ font-size: 16px;
1917
+ font-weight: 700;
1918
+ line-height: 20px;
1919
+ border-bottom: 1px solid #dbe2eb;
1920
+ }
1921
+
1922
+ .thread-titles-wrapper {
1923
+ overflow-y: auto;
1924
+ height: calc(100% - 40px);
1925
+ }
1926
+
1927
+ .thread-title {
1928
+ padding: 10px 16px;
1929
+ color: #4e647f;
1930
+ font-size: 14px;
1931
+ font-weight: 400;
1932
+ line-height: 20px;
1933
+ cursor: pointer;
1934
+
1935
+ &:hover {
1936
+ background: #f1f4f8;
1937
+ }
1938
+ }
1939
+
1940
+ .thread-title.disabled {
1941
+ cursor: not-allowed;
1942
+ }
1943
+ }
1944
+
1945
+ .chat-threads-background {
1946
+ position: absolute;
1947
+ top: 78px;
1948
+ height: 100%;
1949
+ width: 100%;
1950
+ opacity: 0.5;
1951
+ background: #000;
1952
+ z-index: 0;
1953
+ }
1954
+ }
1955
+
1956
+ ${scrollBarStyles}
1957
+ `;
1958
+
1959
+ const capitalizeEachWord = (str) => {
1960
+ return str === null || str === void 0 ? void 0 : str.replace(/^\w/, (char) => char.toUpperCase());
1961
+ };
1962
+
1963
+ const personalizeDialogStyles = i$3 `
1964
+ :host {
1965
+ font-family: 'Inter', sans-serif;
1966
+ font-size: 16px;
1967
+ font-weight: 400;
1968
+
1969
+ h2,
1970
+ p {
1971
+ margin: 0;
1972
+ }
1973
+
1974
+ button {
1975
+ border-style: none;
1976
+ cursor: pointer;
1977
+ }
1978
+ }
1979
+
1980
+ dialog::backdrop {
1981
+ background: rgba(0, 0, 0, 0.5);
1982
+ }
1983
+
1984
+ dialog {
1985
+ padding: 24px;
1986
+ border: 1px solid #dbe2eb;
1987
+ border-radius: 10px;
1988
+ background: #fff;
1989
+ box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1),
1990
+ 0px 4px 6px -2px rgba(0, 0, 0, 0.05);
1991
+ min-width: 35%;
1992
+
1993
+ .btn {
1994
+ cursor: pointer;
1995
+ }
1996
+
1997
+ .dialog-title {
1998
+ margin-bottom: 24px;
1999
+ display: flex;
2000
+ align-items: center;
2001
+ gap: 16px;
2002
+
2003
+ .close-btn {
2004
+ margin-left: auto;
2005
+ }
2006
+
2007
+ h2 {
2008
+ color: #172a41;
2009
+ font-size: 20px;
2010
+ font-weight: 700;
2011
+ line-height: 24px;
2012
+ }
2013
+
2014
+ .back-btn {
2015
+ display: flex;
2016
+ padding: 4px;
2017
+ align-items: center;
2018
+ border-radius: 5px;
2019
+ border: 1px solid #dbe2eb;
2020
+ background: #fff;
2021
+ }
2022
+ }
2023
+
2024
+ .dialog-content {
2025
+ display: flex;
2026
+ flex-direction: column;
2027
+ gap: 12px;
2028
+
2029
+ & > p {
2030
+ line-height: 150%;
2031
+ }
2032
+ }
2033
+ }
2034
+
2035
+ .profile-types,
2036
+ .visitor-types {
2037
+ display: flex;
2038
+ gap: 24px;
2039
+
2040
+ .profile-type,
2041
+ .visitor-type {
2042
+ display: flex;
2043
+ padding: 25px 29px;
2044
+ flex-direction: column;
2045
+ align-items: center;
2046
+ gap: 4px;
2047
+ flex: 1 0 0;
2048
+ align-self: stretch;
2049
+ border-radius: 10px;
2050
+ border: 1px solid #dbe2eb;
2051
+ background: #fff;
2052
+ cursor: pointer;
2053
+
2054
+ p {
2055
+ color: #172a41;
2056
+ text-align: center;
2057
+ line-height: 150%;
2058
+ }
2059
+
2060
+ &:hover {
2061
+ background: #f1f4f8;
2062
+ }
2063
+ }
2064
+ }
2065
+
2066
+ .profiles {
2067
+ width: 100%;
2068
+ border-collapse: collapse;
2069
+ margin-bottom: 16px;
2070
+
2071
+ td {
2072
+ color: #4e647f;
2073
+ line-height: 150%;
2074
+ text-align: left;
2075
+ padding: 8px;
2076
+ border-bottom: 1px solid #ddd;
2077
+ text-transform: capitalize;
2078
+ }
2079
+
2080
+ tr:hover {
2081
+ background-color: #f9f9f9;
2082
+ cursor: pointer;
2083
+ }
2084
+
2085
+ .radio-button {
2086
+ input {
2087
+ position: absolute;
2088
+ opacity: 0;
2089
+
2090
+ + label {
2091
+ &:before {
2092
+ content: '';
2093
+ background: radial-gradient(circle, #dadada00 0%, #ffffff 100%);
2094
+ border-radius: 100%;
2095
+ border: 1px solid #a3b2c6;
2096
+ display: inline-block;
2097
+ width: 16px;
2098
+ height: 16px;
2099
+ position: relative;
2100
+ text-align: center;
2101
+ cursor: pointer;
2102
+ }
2103
+ }
2104
+
2105
+ &:checked {
2106
+ + label {
2107
+ &:before {
2108
+ background-color: #397bf4;
2109
+ box-shadow: inset 0 0 0 4px #fff;
2110
+ }
2111
+ }
2112
+ }
2113
+ }
2114
+ }
2115
+ }
2116
+
2117
+ .product-handle-dropdown {
2118
+ position: relative;
2119
+ min-width: 552px;
2120
+
2121
+ .dropdown-trigger {
2122
+ border-radius: 5px;
2123
+ border: 1px solid #dbe2eb;
2124
+ background: #fff;
2125
+
2126
+ color: #4e647f;
2127
+ padding: 8px 16px;
2128
+ cursor: pointer;
2129
+ }
2130
+
2131
+ .dropdown-trigger::after {
2132
+ position: relative;
2133
+ content: '⌄';
2134
+ float: right;
2135
+ font-size: 22px;
2136
+ color: #4e647f;
2137
+ top: -8px;
2138
+ right: -7px;
2139
+ }
2140
+
2141
+ .dropdown-list {
2142
+ position: fixed;
2143
+ width: 100%;
2144
+ margin: 4px 0 0;
2145
+ padding: 0;
2146
+ list-style: none;
2147
+ border-radius: 5px;
2148
+ border: 1px solid #dbe2eb;
2149
+ background: #fff;
2150
+ display: none;
2151
+ }
2152
+
2153
+ .dropdown-item {
2154
+ padding: 10px;
2155
+ font-size: 14px;
2156
+ color: #333;
2157
+ cursor: pointer;
2158
+ }
2159
+
2160
+ .dropdown-item:hover {
2161
+ background-color: #f0f0f0;
2162
+ box-shadow: 0 0 4px rgba(57, 123, 244, 0.5);
2163
+ }
2164
+
2165
+ .dropdown-list.show {
2166
+ display: block;
2167
+ }
2168
+ }
2169
+
2170
+ .finish-btn {
2171
+ align-self: baseline;
2172
+ margin-top: 12px;
2173
+ padding: 10px 36px;
2174
+ border-radius: 5px;
2175
+ background: #f25c2b;
2176
+ color: #fff;
2177
+ line-height: 150%;
2178
+ text-transform: capitalize;
2179
+
2180
+ &:hover {
2181
+ background-color: #cd4b27;
2182
+ }
2183
+ }
2184
+ `;
2185
+
2186
+ const searchBtn = b `
2187
+ <svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
2188
+ <path d="M50.7494 48.2748L37.5333 35.0586C40.709 31.246 42.2926 26.3558 41.9547 21.4053C41.6167 16.4548 39.3832 11.8252 35.7188 8.47954C32.0544 5.13387 27.2412 3.32975 22.2805 3.44248C17.3197 3.55521 12.5934 5.57611 9.08477 9.08477C5.57611 12.5934 3.55521 17.3197 3.44248 22.2805C3.32975 27.2412 5.13387 32.0544 8.47954 35.7188C11.8252 39.3832 16.4548 41.6167 21.4053 41.9547C26.3558 42.2926 31.246 40.709 35.0586 37.5333L48.2748 50.7494L50.7494 48.2748ZM6.99944 22.7494C6.99944 19.6344 7.92316 16.5893 9.65379 13.9992C11.3844 11.4091 13.8442 9.39042 16.7222 8.19834C19.6001 7.00625 22.7669 6.69435 25.8221 7.30207C28.8773 7.90979 31.6837 9.40983 33.8864 11.6125C36.089 13.8152 37.5891 16.6216 38.1968 19.6768C38.8045 22.732 38.4926 25.8988 37.3005 28.7767C36.1085 31.6546 34.0897 34.1145 31.4997 35.8451C28.9096 37.5757 25.8645 38.4994 22.7494 38.4994C18.5737 38.4948 14.5703 36.834 11.6176 33.8813C8.66493 30.9286 7.00407 26.9252 6.99944 22.7494Z" fill="#172A41"/>
2189
+ </svg>`;
2190
+ const backBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
2191
+ <path d="M10 5H3.90745L5.70115 3.20705L5 2.5L2 5.5L5 8.5L5.70115 7.7927L3.90895 6H10C10.7956 6 11.5587 6.31607 12.1213 6.87868C12.6839 7.44129 13 8.20435 13 9C13 9.79565 12.6839 10.5587 12.1213 11.1213C11.5587 11.6839 10.7956 12 10 12H6V13H10C11.0609 13 12.0783 12.5786 12.8284 11.8284C13.5786 11.0783 14 10.0609 14 9C14 7.93913 13.5786 6.92172 12.8284 6.17157C12.0783 5.42143 11.0609 5 10 5Z" fill="#4E647F"/>
2192
+ </svg>`;
2193
+ const anonymousIcon = b `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
2194
+ <path d="M40.2501 47.0666C44.9122 47.0666 48.7062 43.2744 48.7062 38.6123C48.7062 33.9502 44.9122 30.1562 40.2501 30.1562C37.0516 30.1562 34.2957 31.9628 32.8592 34.5894H23.1404C21.7042 31.9627 18.9486 30.1562 15.7501 30.1562C11.088 30.1562 7.29492 33.9502 7.29492 38.6123C7.29492 43.2744 11.088 47.0666 15.7501 47.0666C20.4122 47.0666 24.2053 43.2744 24.2053 38.6123C24.2053 38.4333 24.1634 38.2657 24.1524 38.0894H31.8469C31.8359 38.2657 31.7941 38.4333 31.7941 38.6123C31.7941 43.2744 35.588 47.0666 40.2501 47.0666ZM40.2501 33.6562C42.9828 33.6562 45.2062 35.8796 45.2062 38.6123C45.2062 41.3449 42.9828 43.5666 40.2501 43.5666C37.5175 43.5666 35.2941 41.3449 35.2941 38.6123C35.2941 35.8796 37.5174 33.6562 40.2501 33.6562ZM15.7501 43.5666C13.0175 43.5666 10.7949 41.345 10.7949 38.6123C10.7949 35.8796 13.0175 33.6562 15.7501 33.6562C18.4828 33.6562 20.7053 35.8796 20.7053 38.6123C20.7053 41.345 18.4828 43.5666 15.7501 43.5666Z" fill="#172A41"/>
2195
+ <path d="M52.9806 25.8736C50.2295 25.0875 47.4504 24.4455 44.6554 23.9242L41.9653 10.3454C41.8603 9.83795 41.5453 9.40045 41.1078 9.15543C40.6528 8.91041 40.1103 8.87548 39.6379 9.05043C32.1303 11.8854 23.8704 11.8854 16.3628 9.05043C15.8904 8.85796 15.3479 8.91039 14.9104 9.15543C14.4554 9.40045 14.1404 9.83795 14.0354 10.3454L11.3453 23.9242C8.54998 24.4455 5.77063 25.0875 3.01928 25.8736C2.09045 26.1402 1.55212 27.1091 1.81787 28.0371C2.08363 28.9668 3.05176 29.4949 3.98145 29.2403C19.6956 24.749 36.306 24.749 52.0201 29.2403C52.1808 29.2847 52.3414 29.3069 52.5004 29.3069C53.2626 29.3069 53.9633 28.8062 54.1837 28.0371C54.4486 27.1092 53.9103 26.1402 52.9806 25.8736ZM15.0285 23.3093L17.0804 13.0054C24.1854 15.2454 31.8153 15.2454 38.9203 13.0054L40.9668 23.3085C32.3632 22.0673 23.6325 22.0676 15.0285 23.3093Z" fill="#172A41"/>
2196
+ </svg>`;
2197
+ const profilePlusIcon = b `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
2198
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M21 7C22.7306 7 24.4223 7.51318 25.8612 8.47464C27.3002 9.4361 28.4217 10.8027 29.084 12.4015C29.7462 14.0004 29.9195 15.7597 29.5819 17.457C29.2443 19.1544 28.4109 20.7135 27.1872 21.9372C25.9635 23.1609 24.4044 23.9942 22.707 24.3319C21.0097 24.6695 19.2504 24.4962 17.6515 23.8339C16.0527 23.1717 14.6861 22.0502 13.7246 20.6112C12.7632 19.1723 12.25 17.4806 12.25 15.75C12.25 13.4294 13.1719 11.2038 14.8128 9.56282C16.4538 7.92187 18.6794 7 21 7ZM21 3.5C18.5772 3.5 16.2088 4.21845 14.1943 5.5645C12.1798 6.91054 10.6097 8.82373 9.68248 11.0621C8.75531 13.3005 8.51272 15.7636 8.98539 18.1399C9.45805 20.5161 10.6248 22.6989 12.3379 24.4121C14.0511 26.1252 16.2339 27.2919 18.6101 27.7646C20.9864 28.2373 23.4495 27.9947 25.6879 27.0675C27.9263 26.1403 29.8395 24.5702 31.1855 22.5557C32.5316 20.5412 33.25 18.1728 33.25 15.75C33.25 12.5011 31.9594 9.38526 29.6621 7.08794C27.3647 4.79062 24.2489 3.5 21 3.5ZM56 24.5H49V17.5H45.5V24.5H38.5V28H45.5V35H49V28H56V24.5ZM35 52.5H38.5V43.75C38.5 40.5011 37.2094 37.3853 34.9121 35.0879C32.6147 32.7906 29.4989 31.5 26.25 31.5H15.75C12.5011 31.5 9.38526 32.7906 7.08794 35.0879C4.79062 37.3853 3.5 40.5011 3.5 43.75V52.5H7V43.75C7 41.4294 7.92187 39.2038 9.56282 37.5628C11.2038 35.9219 13.4294 35 15.75 35H26.25C28.5706 35 30.7962 35.9219 32.4372 37.5628C34.0781 39.2038 35 41.4294 35 43.75V52.5Z" fill="#172A41"/>
2199
+ </svg>`;
2200
+
2201
+ let PersonalizeDialog =
2202
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2203
+ class PersonalizeDialog extends s {
2204
+ constructor() {
2205
+ super(...arguments);
2206
+ this.isLoading = false;
2207
+ this.nextStep = () => this.loadState();
2208
+ this.getContent = () => {
2209
+ if (this.isLoading) {
2210
+ return x ` <load-spinner></load-spinner> `;
2211
+ }
2212
+ switch (this.state) {
2213
+ case 'profile-type': {
2214
+ return this.selectProfileType();
2215
+ }
2216
+ case 'profiles': {
2217
+ return this.selectProfile();
2218
+ }
2219
+ case 'visitor-type': {
2220
+ return this.selectVisitorType();
2221
+ }
2222
+ case 'product-handle': {
2223
+ return this.selectProductHandle();
2224
+ }
2225
+ }
2226
+ return T;
2227
+ };
2228
+ }
2229
+ showModal() {
2230
+ this.loadState();
2231
+ this.dialogModal.showModal();
2232
+ }
2233
+ resetProperties() {
2234
+ this.state = 'profile-type';
2235
+ this.profileType = undefined;
2236
+ this.selectedProfile = undefined;
2237
+ this.visitorType = undefined;
2238
+ this.productHandle = undefined;
2239
+ }
2240
+ async handleSubmit() {
2241
+ var _a, _b;
2242
+ const devContext = {};
2243
+ this.isLoading = true;
2244
+ const profile = (_a = this.defaultProfiles) === null || _a === void 0 ? void 0 : _a.find((profile) => profile.email === this.selectedProfile);
2245
+ if (profile) {
2246
+ devContext.email = profile.email;
2247
+ devContext.firstName = profile.firstName;
2248
+ devContext.city = profile.city;
2249
+ devContext.gender = (_b = profile.gender) === null || _b === void 0 ? void 0 : _b.toLowerCase();
2250
+ }
2251
+ if (this.productHandle) {
2252
+ devContext.productHandle = this.productHandle;
2253
+ }
2254
+ this.resetProperties();
2255
+ await this.createChatThread({
2256
+ title: '',
2257
+ devContext,
2258
+ }, true);
2259
+ this.dialogModal.close();
2260
+ this.isLoading = false;
2261
+ }
2262
+ loadState() {
2263
+ if (!this.profileType) {
2264
+ this.state = 'profile-type';
2265
+ return;
2266
+ }
2267
+ if (this.profileType === 'returning' && !this.selectedProfile) {
2268
+ this.state = 'profiles';
2269
+ return;
2270
+ }
2271
+ if (!this.visitorType) {
2272
+ this.state = 'visitor-type';
2273
+ return;
2274
+ }
2275
+ if (!this.productHandle) {
2276
+ this.state = 'product-handle';
2277
+ return;
2278
+ }
2279
+ }
2280
+ handleBackStep() {
2281
+ if (this.state === 'profile-type') {
2282
+ return;
2283
+ }
2284
+ if (this.state === 'profiles') {
2285
+ this.profileType = undefined;
2286
+ }
2287
+ if (this.state === 'visitor-type') {
2288
+ this.selectedProfile = undefined;
2289
+ if (this.profileType === 'anonymous') {
2290
+ this.profileType = undefined;
2291
+ }
2292
+ }
2293
+ if (this.state === 'product-handle') {
2294
+ this.visitorType = undefined;
2295
+ }
2296
+ this.loadState();
2297
+ }
2298
+ selectProfileType() {
2299
+ return x `
2300
+ <p>Select profile type:</p>
2301
+ <div class="profile-types">
2302
+ <div
2303
+ class="profile-type"
2304
+ @click=${() => {
2305
+ this.profileType = 'anonymous';
2306
+ this.nextStep();
2307
+ }}
2308
+ >
2309
+ ${anonymousIcon}
2310
+ <p>Stay Anonymous</p>
2311
+ </div>
2312
+ <div
2313
+ class="profile-type"
2314
+ @click=${() => {
2315
+ this.profileType = 'returning';
2316
+ this.nextStep();
2317
+ }}
2318
+ >
2319
+ ${profilePlusIcon}
2320
+ <p>Pick your profile</p>
2321
+ </div>
2322
+ </div>
2323
+ `;
2324
+ }
2325
+ selectProfile() {
2326
+ var _a;
2327
+ const handleProfileSelection = (email) => {
2328
+ this.selectedProfile = email;
2329
+ this.nextStep();
2330
+ };
2331
+ return x `
2332
+ <p>Select Profile for a returning customer:</p>
2333
+ <table class="profiles">
2334
+ <tbody>
2335
+ ${(_a = this.defaultProfiles) === null || _a === void 0 ? void 0 : _a.map((profile) => x `
2336
+ <tr @click=${handleProfileSelection.bind(this, profile.email)}>
2337
+ <td class="radio-button btn">
2338
+ <input
2339
+ type="radio"
2340
+ name="profile"
2341
+ ?checked=${this.selectedProfile === profile.email}
2342
+ />
2343
+ <label></label>
2344
+ </td>
2345
+ <td>${profile.firstName}</td>
2346
+ <td>${profile.gender}</td>
2347
+ <td>
2348
+ ${profile.city} ${profile.state ? ` - ${profile.state}` : ''}
2349
+ </td>
2350
+ <td>
2351
+ ${profile.hasOrderHistory
2352
+ ? 'Returning Buyer'
2353
+ : 'Visitor only'}
2354
+ </td>
2355
+ </tr>
2356
+ `)}
2357
+ </tbody>
2358
+ </table>
2359
+ `;
2360
+ }
2361
+ selectVisitorType() {
2362
+ return x `
2363
+ <p>Visitation Context:</p>
2364
+ <div class="visitor-types">
2365
+ <div
2366
+ class="visitor-type"
2367
+ @click=${() => {
2368
+ this.visitorType = 'direct';
2369
+ this.handleSubmit();
2370
+ }}
2371
+ >
2372
+ ${searchBtn}
2373
+ <p>Direct Visit</p>
2374
+ </div>
2375
+ <div
2376
+ class="visitor-type"
2377
+ @click=${() => {
2378
+ this.visitorType = 'ad';
2379
+ this.nextStep();
2380
+ }}
2381
+ >
2382
+ ${cursorBtn}
2383
+ <p>Via Ad</p>
2384
+ </div>
2385
+ </div>
2386
+ `;
2387
+ }
2388
+ selectProductHandle() {
2389
+ var _a;
2390
+ const getProductHandleLabel = (productHandle) => productHandle
2391
+ .replace(/\b[a-z]/g, (char) => char.toUpperCase())
2392
+ .replaceAll('-', ' ');
2393
+ return x `
2394
+ <p>Select Product Handle:</p>
2395
+ <div class="product-handle-dropdown">
2396
+ <div
2397
+ class="dropdown-trigger"
2398
+ @click=${() => {
2399
+ this.dropdownList.classList.toggle('show');
2400
+ // set the width dynamically
2401
+ const { width } = this.dropdownTrigger.getBoundingClientRect();
2402
+ this.dropdownList.style.width = `${width}px`;
2403
+ }}
2404
+ >
2405
+ ${this.productHandle
2406
+ ? getProductHandleLabel(this.productHandle)
2407
+ : 'Select Product'}
2408
+ </div>
2409
+ <ul class="dropdown-list">
2410
+ ${(_a = this.defaultProductHandles) === null || _a === void 0 ? void 0 : _a.map((productHandle) => x `<li
2411
+ class="dropdown-item"
2412
+ @click=${() => {
2413
+ this.productHandle = productHandle;
2414
+ this.dropdownList.classList.remove('show');
2415
+ }}
2416
+ >
2417
+ ${getProductHandleLabel(productHandle)}
2418
+ </li>`)}
2419
+ </ul>
2420
+ </div>
2421
+ ${this.productHandle
2422
+ ? x `<button class="finish-btn" @click=${this.handleSubmit}>
2423
+ Finish
2424
+ </button>`
2425
+ : T}
2426
+ `;
2427
+ }
2428
+ render() {
2429
+ return x `
2430
+ <dialog>
2431
+ <div class="dialog-title">
2432
+ ${this.state !== 'profile-type'
2433
+ ? x `<div class="back-btn btn" @click=${this.handleBackStep}>
2434
+ ${backBtn}
2435
+ </div>`
2436
+ : T}
2437
+ <h2>Personalize your search</h2>
2438
+ <div class="close-btn btn" @click=${() => this.dialogModal.close()}>
2439
+ ${closeBtn}
2440
+ </div>
2441
+ </div>
2442
+ <div class="dialog-content">${this.getContent()}</div>
2443
+ </dialog>
2444
+ `;
2445
+ }
2446
+ };
2447
+ PersonalizeDialog.styles = [personalizeDialogStyles];
2448
+ __decorate([
2449
+ e$2('dialog'),
2450
+ __metadata("design:type", HTMLDialogElement)
2451
+ ], PersonalizeDialog.prototype, "dialogModal", void 0);
2452
+ __decorate([
2453
+ e$2('.dropdown-list'),
2454
+ __metadata("design:type", HTMLUListElement)
2455
+ ], PersonalizeDialog.prototype, "dropdownList", void 0);
2456
+ __decorate([
2457
+ e$2('.dropdown-trigger'),
2458
+ __metadata("design:type", HTMLDivElement)
2459
+ ], PersonalizeDialog.prototype, "dropdownTrigger", void 0);
2460
+ __decorate([
2461
+ n({ type: Array }),
2462
+ __metadata("design:type", Array)
2463
+ ], PersonalizeDialog.prototype, "defaultProductHandles", void 0);
2464
+ __decorate([
2465
+ n({ type: Array }),
2466
+ __metadata("design:type", Array)
2467
+ ], PersonalizeDialog.prototype, "defaultProfiles", void 0);
2468
+ __decorate([
2469
+ n({ type: Boolean }),
2470
+ __metadata("design:type", Boolean)
2471
+ ], PersonalizeDialog.prototype, "isLoading", void 0);
2472
+ __decorate([
2473
+ n({ type: String }),
2474
+ __metadata("design:type", Object)
2475
+ ], PersonalizeDialog.prototype, "state", void 0);
2476
+ __decorate([
2477
+ n({ type: String }),
2478
+ __metadata("design:type", Object)
2479
+ ], PersonalizeDialog.prototype, "profileType", void 0);
2480
+ __decorate([
2481
+ n({ type: String }),
2482
+ __metadata("design:type", Object)
2483
+ ], PersonalizeDialog.prototype, "selectedProfile", void 0);
2484
+ __decorate([
2485
+ n({ type: String }),
2486
+ __metadata("design:type", Object)
2487
+ ], PersonalizeDialog.prototype, "visitorType", void 0);
2488
+ __decorate([
2489
+ n({ type: String }),
2490
+ __metadata("design:type", Object)
2491
+ ], PersonalizeDialog.prototype, "productHandle", void 0);
2492
+ PersonalizeDialog = __decorate([
2493
+ t$1('personalize-dialog')
2494
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2495
+ ], PersonalizeDialog);
2496
+
2497
+ const plusBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
2498
+ <path d="M12.75 11.25V6H11.25V11.25H6V12.75H11.25V18H12.75V12.75H18V11.25H12.75Z" fill="white"/>
2499
+ </svg>`;
2500
+ const timerBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
2501
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M6.16652 20.7304C7.89323 21.8842 9.9233 22.5 12 22.5C14.7848 22.5 17.4555 21.3938 19.4246 19.4246C21.3938 17.4555 22.5 14.7848 22.5 12C22.5 9.9233 21.8842 7.89323 20.7304 6.16652C19.5767 4.4398 17.9368 3.09399 16.0182 2.29927C14.0996 1.50455 11.9884 1.29661 9.95156 1.70176C7.91476 2.1069 6.04383 3.10693 4.57538 4.57538C3.10693 6.04383 2.1069 7.91476 1.70176 9.95156C1.29661 11.9884 1.50455 14.0996 2.29927 16.0182C3.09399 17.9368 4.4398 19.5767 6.16652 20.7304ZM6.99987 4.51678C8.47992 3.52785 10.22 3 12 3C14.387 3 16.6761 3.94822 18.364 5.63604C20.0518 7.32387 21 9.61306 21 12C21 13.78 20.4722 15.5201 19.4832 17.0001C18.4943 18.4802 17.0887 19.6337 15.4442 20.3149C13.7996 20.9961 11.99 21.1743 10.2442 20.8271C8.49836 20.4798 6.89472 19.6226 5.63604 18.364C4.37737 17.1053 3.5202 15.5016 3.17294 13.7558C2.82567 12.01 3.0039 10.2004 3.68509 8.55585C4.36628 6.91132 5.51983 5.50571 6.99987 4.51678ZM11.25 12.3075L15.4425 16.5L16.5 15.4425L12.75 11.685V5.25H11.25V12.3075Z" fill="white"/>
2502
+ </svg>`;
2503
+ const crossBtn = b `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
2504
+ <path d="M18 7.05L16.95 6L12 10.95L7.05 6L6 7.05L10.95 12L6 16.95L7.05 18L12 13.05L16.95 18L18 16.95L13.05 12L18 7.05Z" fill="white"/>
2505
+ </svg>`;
2506
+
2507
+ let ChatSection =
2508
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2509
+ class ChatSection extends s {
2510
+ constructor() {
2511
+ super(...arguments);
2512
+ this.showChatThreads = false;
2513
+ this.userQuery = '';
2514
+ }
2515
+ scrollToBottom() {
2516
+ var _a;
2517
+ (_a = this.chatWindowElement) === null || _a === void 0 ? void 0 : _a.scrollTo({
2518
+ top: this.chatWindowElement.scrollHeight,
2519
+ behavior: 'smooth',
2520
+ });
2521
+ }
2522
+ async processMessage(e, message) {
2523
+ this.scrollToBottom();
2524
+ if (!this.thread) {
2525
+ await this.createChatThread({ title: '' }, false);
2526
+ }
2527
+ await this.sendMessageToServer(e, message);
2528
+ }
2529
+ async onSubmit(e) {
2530
+ var _a;
2531
+ e.preventDefault();
2532
+ const message = (_a = this.userQuery) === null || _a === void 0 ? void 0 : _a.trim();
2533
+ this.userQuery = '';
2534
+ await this.processMessage(e, message);
2535
+ }
2536
+ typingIndicator() {
2537
+ return x `<div class="typing-dots">
2538
+ <div class="dot"></div>
2539
+ <div class="dot"></div>
2540
+ <div class="dot"></div>
2541
+ </div>`;
2542
+ }
2543
+ botMessage(message) {
2544
+ var _a;
2545
+ return x `
2546
+ <div class="message-wrapper">
2547
+ <div class="message bot">
2548
+ <div>
2549
+ <div class="bot-icon">${botIcon}</div>
2550
+ </div>
2551
+ <div>
2552
+ ${message.message ? x `<p>${message.message}</p>` : T}
2553
+ ${this.viewType !== 'modal' && ((_a = message.products) === null || _a === void 0 ? void 0 : _a[0])
2554
+ ? x `
2555
+ <span class="line"></span>
2556
+ <div class="product-container">
2557
+ <product-item
2558
+ .product=${message.products[0]}
2559
+ .siteCurrency=${this.siteCurrency}
2560
+ ></product-item>
2561
+ </div>
2562
+ `
2563
+ : T}
2564
+ </div>
2565
+ </div>
2566
+ ${this.viewType === 'modal' && message.products
2567
+ ? x `<products-list
2568
+ .products=${message.products}
2569
+ .siteCurrency=${this.siteCurrency}
2570
+ .viewType=${this.viewType}
2571
+ ></products-list>`
2572
+ : T}
2573
+ </div>
2574
+ `;
2575
+ }
2576
+ chatWindow() {
2577
+ if (this.isLoadingHistory) {
2578
+ return x ` <load-spinner></load-spinner> `;
2579
+ }
2580
+ return x `
2581
+ <div class="messages">
2582
+ ${this.isTyping
2583
+ ? x `<div class="message bot">
2584
+ <div>
2585
+ <div class="bot-icon">${botIcon}</div>
2586
+ </div>
2587
+ ${this.typingIndicator()}
2588
+ </div>`
2589
+ : ''}
2590
+ ${this.isFailed
2591
+ ? this.botMessage({
2592
+ sender: 'bot',
2593
+ message: "Uh-oh! Looks like I tripped over some alpha-stage wires. Things are still a bit wobbly here, buy hey, that's what testing is for, Let's try that again; or feel free to throw another challenge my way!",
2594
+ })
2595
+ : T}
2596
+ ${this.messages.map((message) => {
2597
+ if (message.sender === 'bot') {
2598
+ return this.botMessage(message);
2599
+ }
2600
+ return x ` <div class="message user">${message.message}</div> `;
2601
+ })}
2602
+ <div class="message bot">
2603
+ <div>
2604
+ <div class="bot-icon">${botIcon}</div>
2605
+ </div>
2606
+ <div>
2607
+ <p>
2608
+ Welcome to the personalized search! How can we help?
2609
+ <br />
2610
+ <br />
2611
+ Type your search query or select one of the prompts to get
2612
+ started:
2613
+ </p>
2614
+ </div>
2615
+ </div>
2616
+ </div>
2617
+ `;
2618
+ }
2619
+ quickPrompts() {
2620
+ var _a;
2621
+ if (((_a = this.thread) === null || _a === void 0 ? void 0 : _a.threadId) || this.messages.length) {
2622
+ return T;
2623
+ }
2624
+ const defaultPrompts = ['Best Selling Items', 'Hot Sales'];
2625
+ return x `
2626
+ <div class="prompts btn">
2627
+ ${defaultPrompts.map((prompt) => x `
2628
+ <div
2629
+ class="prompt"
2630
+ @click=${(e) => this.processMessage(e, prompt)}
2631
+ >
2632
+ ${prompt}
2633
+ </div>
2634
+ `)}
2635
+ </div>
2636
+ `;
2637
+ }
2638
+ showContext() {
2639
+ var _a;
2640
+ if (!((_a = this.thread) === null || _a === void 0 ? void 0 : _a.devContext)) {
2641
+ return x `
2642
+ <div class="context-container">
2643
+ <div class="context-title">
2644
+ <p>Context</p>
2645
+ <div
2646
+ class="btn"
2647
+ @click=${() => {
2648
+ if (!this.contextContainerElement) {
2649
+ return;
2650
+ }
2651
+ this.contextContainerElement.classList.remove('show');
2652
+ }}
2653
+ >
2654
+ ${closeBtn}
2655
+ </div>
2656
+ </div>
2657
+ <p>
2658
+ This search thread has no pre-defined context. Start a new search to
2659
+ personalize.
2660
+ </p>
2661
+ </div>
2662
+ `;
2663
+ }
2664
+ const devContext = this.thread.devContext;
2665
+ const profileType = devContext.email
2666
+ ? 'Pick your profile'
2667
+ : 'Stay Anonymous';
2668
+ const userDetails = devContext.email
2669
+ ? `${capitalizeEachWord(devContext.firstName)} / ${capitalizeEachWord(devContext.gender)} / ${devContext.city} / ${devContext.state ? `- ${capitalizeEachWord(devContext.state)}` : ''} - ${devContext.preferences
2670
+ ? `${devContext.preferences.size},${capitalizeEachWord(devContext.preferences.color)},${capitalizeEachWord(devContext.preferences.material)}`
2671
+ : ''}`
2672
+ : '';
2673
+ const visitationType = devContext.productHandle ? 'Via Ad' : 'Direct Visit';
2674
+ return x `
2675
+ <div class="context-container">
2676
+ <div class="context-title">
2677
+ <p>Context</p>
2678
+ <div
2679
+ class="btn"
2680
+ @click=${() => {
2681
+ var _a;
2682
+ (_a = this.contextContainerElement) === null || _a === void 0 ? void 0 : _a.classList.remove('show');
2683
+ }}
2684
+ >
2685
+ ${closeBtn}
2686
+ </div>
2687
+ </div>
2688
+ <div>
2689
+ <div class="context">
2690
+ <span>Profile Type:</span>${' '}
2691
+ <span class="context-type-value"> ${profileType} </span>
2692
+ </div>
2693
+ ${userDetails
2694
+ ? x `<div class="context user-details">${userDetails}</div>`
2695
+ : T}
2696
+ </div>
2697
+ <div>
2698
+ <div class="context">
2699
+ <span>Visitation Context:</span>${' '}
2700
+ <span class="context-type-value">${visitationType}</span>
2701
+ </div>
2702
+ ${devContext.productHandle
2703
+ ? x `<div class="context product-handle">
2704
+ ${devContext.productHandle}
2705
+ </div>`
2706
+ : T}
2707
+ </div>
2708
+ </div>
2709
+ `;
2710
+ }
2711
+ modalViewHeader() {
2712
+ var _a;
2713
+ return x `
2714
+ <div>${botIcon}</div>
2715
+ <h2>${((_a = this.thread) === null || _a === void 0 ? void 0 : _a.title) || 'New Search'}</h2>
2716
+ <div class="btns-wrapper">
2717
+ <button
2718
+ class="btn btn-icon new-search-btn"
2719
+ title="New chat"
2720
+ @click=${async () => {
2721
+ var _a;
2722
+ await ((_a = this.setSelectedThreadId) === null || _a === void 0 ? void 0 : _a.call(this, ''));
2723
+ }}
2724
+ >
2725
+ ${plusBtn}
2726
+ </button>
2727
+ <button
2728
+ class=${e({
2729
+ btn: true,
2730
+ 'btn-icon': true,
2731
+ 'threads-btn': true,
2732
+ active: this.showChatThreads,
2733
+ })}
2734
+ title="Your Search History"
2735
+ @click=${() => {
2736
+ this.showChatThreads = !this.showChatThreads;
2737
+ }}
2738
+ >
2739
+ ${timerBtn}
2740
+ </button>
2741
+ <button
2742
+ class="btn btn-icon close-btn"
2743
+ title="Close chat"
2744
+ @click=${() => { var _a; return (_a = this.closeModal) === null || _a === void 0 ? void 0 : _a.call(this); }}
2745
+ >
2746
+ ${crossBtn}
2747
+ </button>
2748
+ </div>
2749
+ `;
2750
+ }
2751
+ contextButton() {
2752
+ var _a, _b, _c, _d;
2753
+ if (this.viewType === 'modal') {
2754
+ return this.modalViewHeader();
2755
+ }
2756
+ if (!this.devMode) {
2757
+ return ((_a = this.thread) === null || _a === void 0 ? void 0 : _a.threadId)
2758
+ ? x `<h2>${((_b = this.thread) === null || _b === void 0 ? void 0 : _b.title) || 'New Search'}</h2>`
2759
+ : x `<h2>New Search</h2>`;
2760
+ }
2761
+ if ((_c = this.thread) === null || _c === void 0 ? void 0 : _c.threadId) {
2762
+ return x `
2763
+ <h2>${((_d = this.thread) === null || _d === void 0 ? void 0 : _d.title) || 'New Search'}</h2>
2764
+ <button
2765
+ class="btn-context btn"
2766
+ @click=${() => {
2767
+ if (!this.contextContainerElement) {
2768
+ return;
2769
+ }
2770
+ this.contextContainerElement.classList.toggle('show');
2771
+ }}
2772
+ >
2773
+ SHOW CONTEXT
2774
+ </button>
2775
+ ${this.showContext()}
2776
+ `;
2777
+ }
2778
+ return x `
2779
+ <h2>Click personalize for hyper Contextual</h2>
2780
+ <button
2781
+ class="btn-context active btn"
2782
+ @click=${() => this.personalizeDialogElement.showModal()}
2783
+ >
2784
+ Personalize
2785
+ </button>
2786
+ `;
2787
+ }
2788
+ renderChatThreads() {
2789
+ if (!this.chatThreads || !this.showChatThreads) {
2790
+ return T;
2791
+ }
2792
+ return x `<div id="modal-chat-threads">
2793
+ <div class="chat-threads">
2794
+ <h2>Your Search History</h2>
2795
+ <div class="thread-titles-wrapper">
2796
+ ${o(this.chatThreads.values(), (thread) => x `
2797
+ <p
2798
+ class=${e({
2799
+ 'thread-title': true,
2800
+ disabled: this.isTyping,
2801
+ })}
2802
+ @click=${async () => {
2803
+ var _a;
2804
+ if (this.isTyping) {
2805
+ return;
2806
+ }
2807
+ this.showChatThreads = false;
2808
+ await ((_a = this.setSelectedThreadId) === null || _a === void 0 ? void 0 : _a.call(this, thread.threadId));
2809
+ }}
2810
+ >
2811
+ ${thread.title || 'New Search'}
2812
+ </p>
2813
+ `)}
2814
+ </div>
2815
+ </div>
2816
+ <div
2817
+ class="chat-threads-background"
2818
+ @click=${() => (this.showChatThreads = false)}
2819
+ ></div>
2820
+ </div>`;
2821
+ }
2822
+ render() {
2823
+ return x `
2824
+ <div class="chat-header">${this.contextButton()}</div>
2825
+ <div
2826
+ class=${e({
2827
+ 'chatbot-section': true,
2828
+ 'modal-view': this.viewType === 'modal',
2829
+ })}
2830
+ >
2831
+ ${this.chatWindow()} ${this.quickPrompts()}
2832
+ <form class="chat-form" @submit=${this.onSubmit}>
2833
+ <input
2834
+ type="text"
2835
+ .value=${this.userQuery}
2836
+ @input=${(e) => (this.userQuery = e.target.value)}
2837
+ placeholder="Type your search here..."
2838
+ />
2839
+ <button
2840
+ class=${e({
2841
+ btn: true,
2842
+ modal: this.viewType === 'modal',
2843
+ })}
2844
+ type="submit"
2845
+ ?disabled=${this.isTyping || this.isLoadingHistory}
2846
+ >
2847
+ ${sendFilledIcon}
2848
+ </button>
2849
+ </form>
2850
+ </div>
2851
+ <personalize-dialog
2852
+ .createChatThread=${this.createChatThread.bind(this)}
2853
+ .defaultProductHandles=${this.productHandles}
2854
+ .defaultProfiles=${this.profiles}
2855
+ ></personalize-dialog>
2856
+ ${this.renderChatThreads()}
2857
+ `;
1327
2858
  }
1328
- const image = new URL(src);
1329
- const srcSet = IMAGE_WIDTHS.map((width) => {
1330
- image.searchParams.set('width', width.toString());
1331
- return `${image.toString()} ${width}w`;
1332
- });
1333
- return {
1334
- srcset: srcSet.join(', '),
1335
- sizes: '(min-width: 1200px) 140px, (min-width: 990px) 33%',
1336
- };
1337
2859
  };
2860
+ ChatSection.styles = [chatSectionStyles];
2861
+ __decorate([
2862
+ n({ type: Object }),
2863
+ __metadata("design:type", Map)
2864
+ ], ChatSection.prototype, "chatThreads", void 0);
2865
+ __decorate([
2866
+ n({ type: Boolean }),
2867
+ __metadata("design:type", Boolean)
2868
+ ], ChatSection.prototype, "showChatThreads", void 0);
2869
+ __decorate([
2870
+ n({ type: Boolean }),
2871
+ __metadata("design:type", Boolean)
2872
+ ], ChatSection.prototype, "isLoadingHistory", void 0);
2873
+ __decorate([
2874
+ n({ type: Boolean }),
2875
+ __metadata("design:type", Object)
2876
+ ], ChatSection.prototype, "devMode", void 0);
2877
+ __decorate([
2878
+ n({ type: Boolean }),
2879
+ __metadata("design:type", Boolean)
2880
+ ], ChatSection.prototype, "isTyping", void 0);
2881
+ __decorate([
2882
+ n({ type: Boolean }),
2883
+ __metadata("design:type", Boolean)
2884
+ ], ChatSection.prototype, "isFailed", void 0);
2885
+ __decorate([
2886
+ n({ type: Array }),
2887
+ __metadata("design:type", Array)
2888
+ ], ChatSection.prototype, "messages", void 0);
2889
+ __decorate([
2890
+ n({ type: Array }),
2891
+ __metadata("design:type", Array)
2892
+ ], ChatSection.prototype, "profiles", void 0);
2893
+ __decorate([
2894
+ n({ type: Array }),
2895
+ __metadata("design:type", Array)
2896
+ ], ChatSection.prototype, "productHandles", void 0);
2897
+ __decorate([
2898
+ n({ type: Object }),
2899
+ __metadata("design:type", Object)
2900
+ ], ChatSection.prototype, "thread", void 0);
2901
+ __decorate([
2902
+ n({ type: Object }),
2903
+ __metadata("design:type", Object)
2904
+ ], ChatSection.prototype, "siteCurrency", void 0);
2905
+ __decorate([
2906
+ e$2('.context-container'),
2907
+ __metadata("design:type", Object)
2908
+ ], ChatSection.prototype, "contextContainerElement", void 0);
2909
+ __decorate([
2910
+ e$2('.chat-window'),
2911
+ __metadata("design:type", Object)
2912
+ ], ChatSection.prototype, "chatWindowElement", void 0);
2913
+ __decorate([
2914
+ e$2('personalize-dialog'),
2915
+ __metadata("design:type", Object)
2916
+ ], ChatSection.prototype, "personalizeDialogElement", void 0);
2917
+ __decorate([
2918
+ n({ type: String }),
2919
+ __metadata("design:type", String)
2920
+ ], ChatSection.prototype, "userQuery", void 0);
2921
+ ChatSection = __decorate([
2922
+ t$1('chat-section')
2923
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
2924
+ ], ChatSection);
2925
+
2926
+ const DIALOG_DELAY = 1000;
2927
+ const normalizePath = (path) => path.replace(/\/$/, '');
1338
2928
  let ShopGPT = class ShopGPT extends s {
1339
2929
  constructor() {
1340
2930
  super(...arguments);
1341
- this.moreRecommendations = [];
1342
- this.chatbotMessages = [];
1343
- this.userMessage = '';
2931
+ this.modalState = 'close';
1344
2932
  this.isLoadingHistory = false;
2933
+ this.isLoadingThreads = false;
1345
2934
  this.isTyping = false;
1346
2935
  this.isFailed = false;
1347
- this.showMore = false;
1348
- this.promptSuggestions = [];
2936
+ this.selectedThreadId = '';
2937
+ this.products = [];
2938
+ this.messages = [];
2939
+ this.chatThreads = new Map();
1349
2940
  this.submitQuery = (message) => {
1350
2941
  if (!message) {
1351
2942
  return;
1352
2943
  }
1353
2944
  this.isFailed = false;
1354
- return this.shopGPTAPI.processQuery(message);
1355
- };
1356
- this.onAddToCart = async (ev) => {
1357
- ev.preventDefault();
1358
- ev.stopPropagation();
1359
- await this.storeAPI
1360
- .addToCart({
1361
- quantity: 1,
1362
- productId: this.productId.value,
1363
- variantId: this.variantId.value,
1364
- })
1365
- .catch(logger.error);
2945
+ return this.shopGPTAPI.processQuery(message, this.selectedThreadId);
1366
2946
  };
1367
2947
  }
1368
2948
  connectedCallback() {
1369
2949
  super.connectedCallback();
2950
+ if (this.uiMode === 'overlay') {
2951
+ if (!this.path) {
2952
+ return;
2953
+ }
2954
+ const currentPath = normalizePath(new URL(window.location.href).pathname);
2955
+ const targetPath = normalizePath(this.path);
2956
+ if (currentPath != targetPath) {
2957
+ logger.log(`Target path does not match`);
2958
+ return;
2959
+ }
2960
+ }
2961
+ this.init();
2962
+ }
2963
+ init() {
1370
2964
  window.addEventListener('edgetag-initialized', async () => {
1371
2965
  if (!this.shopGPTAPI) {
1372
2966
  return;
1373
2967
  }
1374
- await this.loadHistory();
2968
+ await this.loadChatThreads();
1375
2969
  await this.loadInitialQuery();
1376
2970
  });
1377
- }
1378
- async loadHistory() {
1379
- var _a, _b, _c, _d;
1380
- try {
1381
- this.isLoadingHistory = true;
1382
- const data = await this.shopGPTAPI.fetchChatHistory();
1383
- this.chatbotMessages = data.map((message) => {
2971
+ if (!this.uiMode || this.uiMode === 'overlay') {
2972
+ delay(DIALOG_DELAY).then(() => {
1384
2973
  var _a;
1385
- return ({
1386
- message: message.message,
1387
- sender: message.sender,
1388
- quantity: 1,
1389
- product: ((_a = message.products) === null || _a === void 0 ? void 0 : _a.length) ? message.products[0] : null,
1390
- });
2974
+ if (document.hidden) {
2975
+ document.addEventListener('visibilitychange', () => { var _a; return (_a = this.shopGPTDialog) === null || _a === void 0 ? void 0 : _a.showModal(); }, {
2976
+ once: true,
2977
+ });
2978
+ }
2979
+ else {
2980
+ (_a = this.shopGPTDialog) === null || _a === void 0 ? void 0 : _a.showModal();
2981
+ }
1391
2982
  });
1392
- if (((_a = data[0]) === null || _a === void 0 ? void 0 : _a.sender) === 'bot' && ((_c = (_b = data[0]) === null || _b === void 0 ? void 0 : _b.products) === null || _c === void 0 ? void 0 : _c.length)) {
1393
- const products = (_d = data[0].products) === null || _d === void 0 ? void 0 : _d.map((product) => ({
1394
- ...product,
1395
- quantity: 1,
1396
- }));
1397
- this.recommendedProduct = products[0];
1398
- this.moreRecommendations = products.slice(1, 4);
1399
- }
1400
- }
1401
- catch (e) {
1402
- logger.error(e);
1403
- }
1404
- finally {
1405
- this.isLoadingHistory = false;
1406
2983
  }
1407
2984
  }
1408
2985
  async loadInitialQuery() {
1409
- var _a, _b, _c, _d;
1410
- const productHandle = this.storeAPI.getCurrentProductHandle();
1411
- if (this.chatbotMessages.length) {
2986
+ var _a;
2987
+ if (!this.selectedThreadId) {
2988
+ return;
2989
+ }
2990
+ if (this.messages.length) {
2991
+ return;
2992
+ }
2993
+ const thread = this.chatThreads.get(this.selectedThreadId);
2994
+ if (!thread) {
1412
2995
  return;
1413
2996
  }
2997
+ const productHandle = this.devMode
2998
+ ? (_a = thread === null || thread === void 0 ? void 0 : thread.devContext) === null || _a === void 0 ? void 0 : _a.productHandle
2999
+ : this.storeAPI.getCurrentProductHandle();
1414
3000
  try {
1415
3001
  this.isTyping = true;
1416
- const reply = await this.shopGPTAPI.processQuery('', productHandle);
1417
- this.chatbotMessages = [
1418
- { sender: 'bot', message: reply.message, product: (_a = reply.products) === null || _a === void 0 ? void 0 : _a[0] },
1419
- ...this.chatbotMessages,
3002
+ const reply = await this.shopGPTAPI.processQuery('', thread.threadId, productHandle);
3003
+ this.messages = [
3004
+ { sender: 'bot', message: reply.message, products: reply.products },
3005
+ ...this.messages,
1420
3006
  ];
1421
- this.recommendedProduct = (_b = reply.products) === null || _b === void 0 ? void 0 : _b[0];
1422
- this.moreRecommendations = (_d = (_c = reply.products) === null || _c === void 0 ? void 0 : _c.slice(1, 4)) !== null && _d !== void 0 ? _d : [];
1423
- this.setChatWindowHeight();
3007
+ this.products = reply.products || [];
1424
3008
  }
1425
3009
  catch (error) {
1426
3010
  logger.error(error);
1427
- this.resetProductRecommendations();
1428
3011
  this.isFailed = true;
1429
3012
  }
1430
3013
  finally {
1431
3014
  this.isTyping = false;
1432
3015
  }
1433
3016
  }
1434
- redirect(url) {
1435
- var _a;
1436
- if (!url) {
1437
- return;
3017
+ async loadChatThreads() {
3018
+ try {
3019
+ this.isLoadingThreads = true;
3020
+ const threads = await this.shopGPTAPI.fetchChatThreads();
3021
+ this.chatThreads = new Map(threads.map((thread) => [thread.threadId, thread]));
3022
+ }
3023
+ catch (e) {
3024
+ logger.error(e);
3025
+ }
3026
+ finally {
3027
+ this.isLoadingThreads = false;
1438
3028
  }
1439
- (_a = open(url, '_blank')) === null || _a === void 0 ? void 0 : _a.focus();
1440
3029
  }
1441
- scrollToBottom() {
1442
- if (!this.chatWindowElement) {
1443
- return;
3030
+ async loadHistory(threadId) {
3031
+ var _a, _b, _c;
3032
+ try {
3033
+ if (!threadId) {
3034
+ this.messages = [];
3035
+ this.products = [];
3036
+ return;
3037
+ }
3038
+ this.isLoadingHistory = true;
3039
+ const data = await this.shopGPTAPI.fetchChatHistory(threadId);
3040
+ this.messages = data.map((message) => {
3041
+ var _a;
3042
+ return ({
3043
+ message: message.message,
3044
+ sender: message.sender,
3045
+ products: (_a = message.products) === null || _a === void 0 ? void 0 : _a.map((product) => ({
3046
+ ...product,
3047
+ quantity: 1,
3048
+ })),
3049
+ });
3050
+ });
3051
+ this.products =
3052
+ (_c = (_b = (_a = data === null || data === void 0 ? void 0 : data[0]) === null || _a === void 0 ? void 0 : _a.products) === null || _b === void 0 ? void 0 : _b.map((product) => ({
3053
+ ...product,
3054
+ quantity: 1,
3055
+ }))) !== null && _c !== void 0 ? _c : [];
1444
3056
  }
1445
- this.chatWindowElement.scrollTo({
1446
- top: this.chatWindowElement.scrollHeight,
1447
- behavior: 'smooth',
1448
- });
3057
+ catch (e) {
3058
+ logger.error(e);
3059
+ }
3060
+ finally {
3061
+ this.isLoadingHistory = false;
3062
+ }
3063
+ }
3064
+ async setSelectedThreadId(threadId) {
3065
+ this.isFailed = false;
3066
+ this.selectedThreadId = threadId;
3067
+ await this.loadHistory(threadId);
1449
3068
  }
1450
- resetProductRecommendations() {
1451
- this.recommendedProduct = undefined;
1452
- this.moreRecommendations = [];
3069
+ async createChatThread(payload, loadInitialQuery) {
3070
+ try {
3071
+ const thread = await this.shopGPTAPI.createChatThread(payload);
3072
+ this.chatThreads = new Map([
3073
+ [thread.threadId, thread],
3074
+ ...this.chatThreads,
3075
+ ]);
3076
+ this.selectedThreadId = thread.threadId;
3077
+ if (loadInitialQuery) {
3078
+ await this.loadInitialQuery();
3079
+ }
3080
+ }
3081
+ catch (e) {
3082
+ logger.error(e);
3083
+ }
1453
3084
  }
1454
3085
  async sendMessageToServer(e, message) {
1455
- var _a, _b, _c, _d;
1456
3086
  e.preventDefault();
1457
3087
  e.stopPropagation();
1458
3088
  if (!message || this.isTyping || this.isLoadingHistory) {
1459
3089
  return;
1460
3090
  }
3091
+ this.isFailed = false;
1461
3092
  try {
1462
- this.chatbotMessages = [
1463
- { sender: 'user', message: message },
1464
- ...this.chatbotMessages,
1465
- ];
3093
+ this.messages = [{ sender: 'user', message }, ...this.messages];
1466
3094
  this.isTyping = true;
1467
- this.userMessage = '';
1468
- this.scrollToBottom();
1469
3095
  const reply = await this.submitQuery(message);
1470
3096
  if (!reply) {
1471
3097
  return;
1472
3098
  }
1473
- this.chatbotMessages = [
1474
- { sender: 'bot', message: reply.message, product: (_a = reply.products) === null || _a === void 0 ? void 0 : _a[0] },
1475
- ...this.chatbotMessages,
3099
+ if (reply.chatTitle) {
3100
+ // Alternatively we can fetch the chatThreads once again which would cost another network request
3101
+ const thread = this.chatThreads.get(this.selectedThreadId);
3102
+ if (thread) {
3103
+ this.chatThreads.set(thread.threadId, {
3104
+ ...thread,
3105
+ title: reply.chatTitle,
3106
+ });
3107
+ this.chatThreads = new Map(this.chatThreads);
3108
+ }
3109
+ }
3110
+ this.messages = [
3111
+ { sender: 'bot', message: reply.message, products: reply.products },
3112
+ ...this.messages,
1476
3113
  ];
1477
- this.recommendedProduct = (_b = reply.products) === null || _b === void 0 ? void 0 : _b[0];
1478
- this.moreRecommendations = (_d = (_c = reply.products) === null || _c === void 0 ? void 0 : _c.slice(1, 4)) !== null && _d !== void 0 ? _d : [];
1479
- this.setChatWindowHeight();
3114
+ this.products = reply.products || [];
1480
3115
  }
1481
- catch (e) {
1482
- logger.error(e);
1483
- this.resetProductRecommendations();
3116
+ catch (err) {
3117
+ logger.error(err);
1484
3118
  this.isFailed = true;
1485
3119
  }
1486
3120
  finally {
1487
3121
  this.isTyping = false;
1488
3122
  }
1489
3123
  }
1490
- getLocalPrice(price) {
1491
- const siteCurrency = this.storeAPI.getSiteCurrency();
1492
- const localPrice = parseFloat(price) * siteCurrency.rate;
1493
- return formatMoney(localPrice, siteCurrency.currency);
1494
- }
1495
- handleShowMore(value) {
1496
- if (!this.chatWindowElement) {
1497
- return;
1498
- }
1499
- this.showMore = value;
1500
- // dynamically add the maximum height when more products are shown
1501
- const height = value ? 'calc(100vh - 580px' : 'calc(100vh - 351px)';
1502
- this.chatWindowElement.style.maxHeight = height;
1503
- }
1504
- setChatWindowHeight() {
1505
- if (!this.chatWindowElement) {
1506
- return;
1507
- }
1508
- if (window.innerWidth < 430) {
1509
- this.chatWindowElement.style.maxHeight = 'calc(100vh - 351px)';
1510
- }
1511
- else {
1512
- this.chatWindowElement.style.maxHeight = 'calc(100vh - 221px)';
1513
- }
1514
- }
1515
- async onSubmit(e) {
1516
- var _a;
1517
- await this.sendMessageToServer(e, (_a = this.userMessage) === null || _a === void 0 ? void 0 : _a.trim());
3124
+ getSiteCurrency() {
3125
+ return this.storeAPI.getSiteCurrency();
1518
3126
  }
1519
3127
  render() {
1520
- return x `
1521
- <div class="mobile-version">
1522
- Please switch to the desktop version for the best experience.
1523
- </div>
1524
- <div class="container">
1525
- <div class="header">
1526
- ${shopGPTIcon()}
1527
- <div class="powered-by-tc">
1528
- <p>Product catalogue powered by</p>
1529
- <a href="https://www.trueclassictees.com" target="_blank">
1530
- ${trueClassicIcon()}
1531
- </a>
1532
- </div>
1533
- </div>
1534
-
1535
- <div class="body">${this.productSection()} ${this.chatSection()}</div>
1536
- </div>
1537
- `;
3128
+ if (this.uiMode === 'modal') {
3129
+ return this.modalMode();
3130
+ }
3131
+ return this.overlayMode();
1538
3132
  }
1539
- productSection() {
1540
- var _a;
3133
+ overlayMode() {
3134
+ const thread = this.chatThreads.get(this.selectedThreadId);
1541
3135
  return x `
1542
- <div
1543
- class=${e$2({
1544
- 'products-section': true,
1545
- 'no-recommended-product': !this.recommendedProduct,
1546
- })}
1547
- >
1548
- <div class="product-section recommended-product">
1549
- <h2>Highly Recommended</h2>
1550
- ${!((_a = this.recommendedProduct) === null || _a === void 0 ? void 0 : _a.id)
1551
- ? x `
1552
- <p class="no-product-text">
1553
- Enter what you’re looking for in the chat to get product
1554
- results.
1555
- </p>
1556
- `
1557
- : x `
1558
- <div class="product">
1559
- <img
1560
- src=${this.recommendedProduct.image.url}
1561
- alt=${this.recommendedProduct.image.alt}
1562
- @click=${() => { var _a; return this.redirect((_a = this.recommendedProduct) === null || _a === void 0 ? void 0 : _a.url); }}
1563
- />
1564
- <div class="product-content">
1565
- <p
1566
- class="product-name"
1567
- title=${this.recommendedProduct.title}
1568
- @click=${() => { var _a; return this.redirect((_a = this.recommendedProduct) === null || _a === void 0 ? void 0 : _a.url); }}
1569
- >
1570
- ${this.recommendedProduct.title}
1571
- </p>
1572
- ${this.recommendedProduct.variants[0].selectedOptions.map((option) => x `
1573
- <p class="product-variation-details">
1574
- ${option.name}: ${option.value}
1575
- </p>
1576
- `)}
1577
- <div class="product-prices">
1578
- ${this.recommendedProduct.variants[0].comparedAtPrice &&
1579
- this.recommendedProduct.variants[0].comparedAtPrice !==
1580
- this.recommendedProduct.variants[0].price
1581
- ? x `<p class="compared-at-price">
1582
- ${this.getLocalPrice(this.recommendedProduct.variants[0]
1583
- .comparedAtPrice)}
1584
- </p>`
1585
- : T}
1586
- <p class="price">
1587
- ${this.getLocalPrice(this.recommendedProduct.variants[0].price)}
1588
- </p>
1589
- </div>
1590
- <button
1591
- class="buy-now-btn"
1592
- @click=${() => { var _a; return this.redirect((_a = this.recommendedProduct) === null || _a === void 0 ? void 0 : _a.url); }}
1593
- >
1594
- Add To Cart
1595
- </button>
1596
- </div>
1597
- </div>
1598
- `}
3136
+ <dialog id="shop-gpt-dialog-overlay">
3137
+ <div class="mobile-version">
3138
+ Please switch to the desktop version for the best experience.
1599
3139
  </div>
1600
-
1601
- <div
1602
- class=${e$2({
1603
- 'product-section': true,
1604
- 'more-recommendations': true,
1605
- 'show-more-sml': this.showMore,
1606
- })}
1607
- >
1608
- <h2>Alternatives</h2>
1609
- ${this.moreRecommendations.length === 0
1610
- ? x `
1611
- <p class="no-product-text">
1612
- Enter what you’re looking for in the chat to get product
1613
- results.
1614
- </p>
1615
- `
1616
- : x `<div class="products">
1617
- ${this.moreRecommendations.map((product) => {
1618
- var _a, _b, _c;
1619
- const imageProperties = getImageProperties((_a = product === null || product === void 0 ? void 0 : product.image) === null || _a === void 0 ? void 0 : _a.url);
1620
- return x `
1621
- <div class="product">
1622
- <img
1623
- srcset=${(_b = imageProperties === null || imageProperties === void 0 ? void 0 : imageProperties.srcset) !== null && _b !== void 0 ? _b : T}
1624
- sizes=${(_c = imageProperties === null || imageProperties === void 0 ? void 0 : imageProperties.sizes) !== null && _c !== void 0 ? _c : T}
1625
- src=${product.image.url}
1626
- alt=${product.image.alt}
1627
- @click=${() => this.redirect(product.url)}
1628
- />
1629
- <p
1630
- class="product-name"
1631
- title=${product.title}
1632
- @click=${() => this.redirect(product.url)}
1633
- >
1634
- ${product.title}
1635
- </p>
1636
- <div class="product-prices">
1637
- ${product.variants[0].comparedAtPrice &&
1638
- product.variants[0].comparedAtPrice !==
1639
- product.variants[0].price
1640
- ? x `<p class="compared-at-price">
1641
- ${this.getLocalPrice(product.variants[0].comparedAtPrice)}
1642
- </p>`
1643
- : T}
1644
- <p class="price">
1645
- ${this.getLocalPrice(product.variants[0].price)}
1646
- </p>
1647
- </div>
1648
- </div>
1649
- `;
1650
- })}
1651
- </div>`}
3140
+ <div class="shopgpt-container">
3141
+ <chat-threads
3142
+ .chatThreads=${this.chatThreads}
3143
+ .selectedThreadId=${this.selectedThreadId}
3144
+ .setSelectedThreadId=${this.setSelectedThreadId.bind(this)}
3145
+ .isLoading=${this.isLoadingThreads}
3146
+ .isTyping=${this.isTyping}
3147
+ .merchantUrl=${this.merchantUrl}
3148
+ ></chat-threads>
3149
+ <products-section
3150
+ .products=${this.products}
3151
+ .isLoadingHistory=${this.isLoadingHistory}
3152
+ .siteCurrency=${this.getSiteCurrency()}
3153
+ ></products-section>
3154
+ <chat-section
3155
+ .isFailed=${this.isFailed}
3156
+ .isLoadingHistory=${this.isLoadingHistory}
3157
+ .isTyping=${this.isTyping}
3158
+ .messages=${this.messages}
3159
+ .siteCurrency=${this.getSiteCurrency()}
3160
+ .sendMessageToServer=${this.sendMessageToServer.bind(this)}
3161
+ .thread=${thread}
3162
+ .createChatThread=${this.createChatThread.bind(this)}
3163
+ .devMode=${this.devMode}
3164
+ .productHandles=${this.productHandles}
3165
+ .profiles=${this.profiles}
3166
+ .viewType=${'overlay'}
3167
+ ></chat-section>
1652
3168
  </div>
1653
-
1654
- ${this.showMore
1655
- ? x `
1656
- <div class="show-less" @click=${() => this.handleShowMore(false)}>
1657
- Show less
1658
- </div>
1659
- `
1660
- : x `
1661
- <div class="show-more" @click=${() => this.handleShowMore(true)}>
1662
- Show more
1663
- </div>
1664
- `}
1665
- </div>
3169
+ </dialog>
1666
3170
  `;
1667
3171
  }
1668
- typingIndicator() {
1669
- return x `<div class="typing-dots">
1670
- <div class="dot"></div>
1671
- <div class="dot"></div>
1672
- <div class="dot"></div>
1673
- </div>`;
1674
- }
1675
- chatWindow() {
1676
- if (this.isLoadingHistory) {
1677
- return x ` <div class="loader"><div class="spinner"></div></div> `;
3172
+ modalMode() {
3173
+ const thread = this.chatThreads.get(this.selectedThreadId);
3174
+ const closeModal = () => {
3175
+ this.modalState = 'close';
3176
+ };
3177
+ if (this.modalState === 'close') {
3178
+ return x `<div class="chatbot-widget">
3179
+ <button
3180
+ @click=${(e) => {
3181
+ e.preventDefault();
3182
+ this.modalState = 'open';
3183
+ }}
3184
+ >
3185
+ ${chatIcon}
3186
+ </button>
3187
+ </div>`;
1678
3188
  }
1679
3189
  return x `
1680
- <div class="chat-window">
1681
- ${this.isTyping
1682
- ? x `<div class="bot-message-container">
1683
- <div class="bot-icon">${botIcon()}</div>
1684
- ${this.typingIndicator()}
1685
- </div>`
1686
- : ''}
1687
- ${this.isFailed
1688
- ? x `<div class="bot-message-container">
1689
- <div class="bot-icon">${botIcon()}</div>
1690
- <div class="message bot">
1691
- Something went wrong please try again!
1692
- </div>
1693
- </div>`
1694
- : ''}
1695
- ${this.chatbotMessages.map((message) => {
1696
- if (message.sender === 'bot') {
1697
- return x `
1698
- <div class="bot-message-container">
1699
- <div class="bot-icon">${botIcon()}</div>
1700
- <div class="message bot">
1701
- ${message.message ? x `<p>${message.message}</p>` : T}
1702
- ${message.product
1703
- ? x `<div class="product">
1704
- <img
1705
- src=${message.product.image.url}
1706
- alt=${message.product.image.alt}
1707
- @click=${() => { var _a; return this.redirect((_a = message.product) === null || _a === void 0 ? void 0 : _a.url); }}
1708
- />
1709
- <div>
1710
- <p
1711
- class="product-name"
1712
- title=${message.product.title}
1713
- @click=${() => { var _a; return this.redirect((_a = message.product) === null || _a === void 0 ? void 0 : _a.url); }}
1714
- >
1715
- ${message.product.title}
1716
- </p>
1717
- <div class="product-prices">
1718
- ${message.product.variants[0].comparedAtPrice &&
1719
- message.product.variants[0].comparedAtPrice !==
1720
- message.product.variants[0].comparedAtPrice
1721
- ? x `<p class="compared-at-price">
1722
- ${this.getLocalPrice(message.product.variants[0].comparedAtPrice)}
1723
- </p>`
1724
- : T}
1725
- <p class="price">
1726
- ${this.getLocalPrice(message.product.variants[0].price)}
1727
- </p>
1728
- </div>
1729
- </div>
1730
- </div>`
1731
- : T}
1732
- </div>
1733
- </div>
1734
- `;
1735
- }
1736
- return x ` <div class="message user">${message.message}</div> `;
1737
- })}
1738
- </div>
1739
- `;
1740
- }
1741
- predefinedPrompts() {
1742
- // TODO: ShopGPT - Handle prompt clicks, should enable this when LLM supports it.
1743
- return x `
1744
- <div class="predefined-prompts" style="display:none;">
1745
- ${this.promptSuggestions.map((prompt) => x ` <button>${prompt}</button> `)}
1746
- </div>
1747
- `;
1748
- }
1749
- chatSection() {
1750
- return x `
1751
- <div class="chatbot-section">
1752
- ${this.chatWindow()} ${this.predefinedPrompts()}
1753
- <form class="chat-input" @submit=${this.onSubmit}>
1754
- <input
1755
- type="text"
1756
- .value=${this.userMessage}
1757
- @input=${(e) => (this.userMessage = e.target.value)}
1758
- placeholder="Type your message here"
1759
- />
1760
- <button
1761
- type="submit"
1762
- ?disabled=${this.isTyping || this.isLoadingHistory}
1763
- >
1764
- ${sendFilledIcon()}
1765
- </button>
1766
- </form>
3190
+ <div id="shop-gpt-modal">
3191
+ <chat-section
3192
+ .isFailed=${this.isFailed}
3193
+ .isLoadingHistory=${this.isLoadingHistory}
3194
+ .isTyping=${this.isTyping}
3195
+ .messages=${this.messages}
3196
+ .siteCurrency=${this.getSiteCurrency()}
3197
+ .sendMessageToServer=${this.sendMessageToServer.bind(this)}
3198
+ .thread=${thread}
3199
+ .createChatThread=${this.createChatThread.bind(this)}
3200
+ .devMode=${this.devMode}
3201
+ .productHandles=${this.productHandles}
3202
+ .profiles=${this.profiles}
3203
+ .viewType=${'modal'}
3204
+ .closeModal=${closeModal}
3205
+ .setSelectedThreadId=${this.setSelectedThreadId.bind(this)}
3206
+ .chatThreads=${this.chatThreads}
3207
+ ></chat-section>
1767
3208
  </div>
1768
3209
  `;
1769
3210
  }
1770
3211
  };
1771
- ShopGPT.styles = [shopGPTStyles()];
1772
- __decorate([
1773
- n({ type: Object }),
1774
- __metadata("design:type", Object)
1775
- ], ShopGPT.prototype, "recommendedProduct", void 0);
1776
- __decorate([
1777
- n({ type: Array }),
1778
- __metadata("design:type", Array)
1779
- ], ShopGPT.prototype, "moreRecommendations", void 0);
3212
+ ShopGPT.styles = [shopGPTStyles];
1780
3213
  __decorate([
1781
- r(),
1782
- __metadata("design:type", Array)
1783
- ], ShopGPT.prototype, "chatbotMessages", void 0);
1784
- __decorate([
1785
- r(),
3214
+ e$2('#shop-gpt-dialog-overlay'),
1786
3215
  __metadata("design:type", Object)
1787
- ], ShopGPT.prototype, "userMessage", void 0);
1788
- __decorate([
1789
- e('input[name=productId]'),
1790
- __metadata("design:type", HTMLInputElement)
1791
- ], ShopGPT.prototype, "productId", void 0);
1792
- __decorate([
1793
- e('input[name=variantId]'),
1794
- __metadata("design:type", HTMLInputElement)
1795
- ], ShopGPT.prototype, "variantId", void 0);
3216
+ ], ShopGPT.prototype, "shopGPTDialog", void 0);
1796
3217
  __decorate([
1797
- e('.chat-window'),
1798
- __metadata("design:type", Object)
1799
- ], ShopGPT.prototype, "chatWindowElement", void 0);
3218
+ n({ type: String }),
3219
+ __metadata("design:type", String)
3220
+ ], ShopGPT.prototype, "modalState", void 0);
1800
3221
  __decorate([
1801
3222
  n({ type: Boolean }),
1802
3223
  __metadata("design:type", Boolean)
@@ -1804,21 +3225,33 @@ __decorate([
1804
3225
  __decorate([
1805
3226
  n({ type: Boolean }),
1806
3227
  __metadata("design:type", Boolean)
1807
- ], ShopGPT.prototype, "isTyping", void 0);
3228
+ ], ShopGPT.prototype, "isLoadingThreads", void 0);
1808
3229
  __decorate([
1809
3230
  n({ type: Boolean }),
1810
3231
  __metadata("design:type", Boolean)
1811
- ], ShopGPT.prototype, "isFailed", void 0);
3232
+ ], ShopGPT.prototype, "isTyping", void 0);
1812
3233
  __decorate([
1813
3234
  n({ type: Boolean }),
1814
3235
  __metadata("design:type", Boolean)
1815
- ], ShopGPT.prototype, "showMore", void 0);
3236
+ ], ShopGPT.prototype, "isFailed", void 0);
3237
+ __decorate([
3238
+ n({ type: String }),
3239
+ __metadata("design:type", String)
3240
+ ], ShopGPT.prototype, "selectedThreadId", void 0);
3241
+ __decorate([
3242
+ n({ type: Array }),
3243
+ __metadata("design:type", Array)
3244
+ ], ShopGPT.prototype, "products", void 0);
1816
3245
  __decorate([
1817
- r(),
3246
+ n({ type: Array }),
1818
3247
  __metadata("design:type", Array)
1819
- ], ShopGPT.prototype, "promptSuggestions", void 0);
3248
+ ], ShopGPT.prototype, "messages", void 0);
3249
+ __decorate([
3250
+ n({ type: Object }),
3251
+ __metadata("design:type", Map)
3252
+ ], ShopGPT.prototype, "chatThreads", void 0);
1820
3253
  ShopGPT = __decorate([
1821
- t('shop-gpt')
3254
+ t$1('shop-gpt')
1822
3255
  ], ShopGPT);
1823
3256
 
1824
3257
  var _a, _b;
@@ -1834,6 +3267,12 @@ if (typeof window != 'undefined' && typeof document != 'undefined') {
1834
3267
  shopGPT = document.createElement('shop-gpt');
1835
3268
  shopGPT.storeAPI = params.storeAPI;
1836
3269
  shopGPT.shopGPTAPI = params.shopGPTAPI;
3270
+ shopGPT.devMode = params.devMode;
3271
+ shopGPT.merchantUrl = params.merchantUrl;
3272
+ shopGPT.profiles = params.profiles;
3273
+ shopGPT.productHandles = params.productHandles;
3274
+ shopGPT.uiMode = params.uiMode;
3275
+ shopGPT.path = params.path;
1837
3276
  document.body.append(shopGPT);
1838
3277
  },
1839
3278
  });