@ppg_pl/tinting 0.0.5 → 0.0.8

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.
Files changed (79) hide show
  1. package/dist/cjs/{index-0a139db0.js → index-b6962659.js} +51 -4
  2. package/dist/cjs/index-b6962659.js.map +1 -0
  3. package/dist/cjs/loader.cjs.js +2 -2
  4. package/dist/cjs/modal-header_9.cjs.entry.js +165 -41
  5. package/dist/cjs/modal-header_9.cjs.entry.js.map +1 -1
  6. package/dist/cjs/tinting.cjs.js +2 -2
  7. package/dist/collection/components/colorbox/index.js +18 -1
  8. package/dist/collection/components/colorbox/index.js.map +1 -1
  9. package/dist/collection/components/colorinfo/index.js +128 -1
  10. package/dist/collection/components/colorinfo/index.js.map +1 -1
  11. package/dist/collection/components/component/index.js +64 -1
  12. package/dist/collection/components/component/index.js.map +1 -1
  13. package/dist/collection/components/modal/index.css +176 -1
  14. package/dist/collection/components/modal/index.js +50 -2
  15. package/dist/collection/components/modal/index.js.map +1 -1
  16. package/dist/collection/components/slider/index.css +24 -6
  17. package/dist/collection/components/slider/index.js +32 -21
  18. package/dist/collection/components/slider/index.js.map +1 -1
  19. package/dist/collection/types.js.map +1 -1
  20. package/dist/collection/utils/index.js +17 -0
  21. package/dist/collection/utils/index.js.map +1 -1
  22. package/dist/components/index10.js +4934 -3598
  23. package/dist/components/index10.js.map +1 -1
  24. package/dist/components/index11.js +3989 -0
  25. package/dist/components/index11.js.map +1 -0
  26. package/dist/components/index4.js +2 -13
  27. package/dist/components/index4.js.map +1 -1
  28. package/dist/components/index6.js +28 -27
  29. package/dist/components/index6.js.map +1 -1
  30. package/dist/components/index7.js +9 -53
  31. package/dist/components/index7.js.map +1 -1
  32. package/dist/components/index8.js +57 -52
  33. package/dist/components/index8.js.map +1 -1
  34. package/dist/components/index9.js +124 -5272
  35. package/dist/components/index9.js.map +1 -1
  36. package/dist/components/my-backdrop.js +1 -1
  37. package/dist/components/my-colorbox.js +1 -1
  38. package/dist/components/my-colorinfo.js +1 -1
  39. package/dist/components/my-component.js +18 -7
  40. package/dist/components/my-component.js.map +1 -1
  41. package/dist/components/my-modal.js +1 -1
  42. package/dist/components/my-slider.js +1 -1
  43. package/dist/esm/{index-f3be6531.js → index-cb79645d.js} +51 -4
  44. package/dist/esm/index-cb79645d.js.map +1 -0
  45. package/dist/esm/loader.js +3 -3
  46. package/dist/esm/modal-header_9.entry.js +165 -41
  47. package/dist/esm/modal-header_9.entry.js.map +1 -1
  48. package/dist/esm/tinting.js +3 -3
  49. package/dist/tinting/p-2730a042.entry.js +15 -0
  50. package/dist/tinting/p-2730a042.entry.js.map +1 -0
  51. package/dist/tinting/p-5b9dc044.js +3 -0
  52. package/dist/tinting/p-5b9dc044.js.map +1 -0
  53. package/dist/tinting/tinting.esm.js +1 -1
  54. package/dist/tinting/tinting.esm.js.map +1 -1
  55. package/dist/types/components/colorbox/index.d.ts +3 -0
  56. package/dist/types/components/colorinfo/index.d.ts +17 -1
  57. package/dist/types/components/component/index.d.ts +8 -0
  58. package/dist/types/components/modal/index.d.ts +6 -1
  59. package/dist/types/components.d.ts +16 -2
  60. package/dist/types/types.d.ts +4 -0
  61. package/dist/types/utils/index.d.ts +6 -0
  62. package/package.json +3 -2
  63. package/www/build/p-2730a042.entry.js +15 -0
  64. package/www/build/p-2730a042.entry.js.map +1 -0
  65. package/www/build/p-5b9dc044.js +3 -0
  66. package/www/build/p-5b9dc044.js.map +1 -0
  67. package/www/build/tinting.esm.js +1 -1
  68. package/www/build/tinting.esm.js.map +1 -1
  69. package/www/index.html +76 -12
  70. package/dist/cjs/index-0a139db0.js.map +0 -1
  71. package/dist/esm/index-f3be6531.js.map +0 -1
  72. package/dist/tinting/p-398633de.entry.js +0 -15
  73. package/dist/tinting/p-398633de.entry.js.map +0 -1
  74. package/dist/tinting/p-b135c76f.js +0 -3
  75. package/dist/tinting/p-b135c76f.js.map +0 -1
  76. package/www/build/p-398633de.entry.js +0 -15
  77. package/www/build/p-398633de.entry.js.map +0 -1
  78. package/www/build/p-b135c76f.js +0 -3
  79. package/www/build/p-b135c76f.js.map +0 -1
@@ -168,12 +168,15 @@
168
168
  }
169
169
  .my-modal__wrapper .boxes__box-content__info__value {
170
170
  display: flex;
171
- flex-direction: row;
171
+ flex-direction: column;
172
172
  justify-content: flex-start;
173
+ align-items: flex-start;
174
+ gap: 20px;
173
175
  }
174
176
  @media (max-width: 1024px) {
175
177
  .my-modal__wrapper .boxes__box-content__info__value {
176
178
  justify-content: flex-start;
179
+ margin-top: 30px;
177
180
  }
178
181
  }
179
182
  @media (max-width: 768px) {
@@ -242,6 +245,39 @@
242
245
  flex-direction: column;
243
246
  }
244
247
  }
248
+ .my-modal__wrapper .boxes__box-content__info__tester {
249
+ display: flex;
250
+ flex-direction: column;
251
+ gap: 15px;
252
+ width: 100%;
253
+ }
254
+ .my-modal__wrapper .boxes__box-content__info__tester .tester-text h2 {
255
+ margin: 0 0 10px;
256
+ font-size: 18px;
257
+ font-weight: 700;
258
+ }
259
+ .my-modal__wrapper .boxes__box-content__info__tester .tester-text p {
260
+ margin: 0;
261
+ font-size: 14px;
262
+ }
263
+ .my-modal__wrapper .boxes__box-content__info__tester .tester-buy {
264
+ display: flex;
265
+ align-items: center;
266
+ gap: 15px;
267
+ width: 100%;
268
+ flex-wrap: nowrap;
269
+ min-width: 0;
270
+ }
271
+ @media (max-width: 1024px) {
272
+ .my-modal__wrapper .boxes__box-content__info__tester .tester-buy {
273
+ flex-direction: column;
274
+ align-items: flex-start;
275
+ }
276
+ }
277
+ .my-modal__wrapper .boxes__box-content__info .price {
278
+ font-size: 20px;
279
+ font-weight: 600;
280
+ }
245
281
  .my-modal__wrapper .boxes__box-content__slider {
246
282
  width: 60%;
247
283
  min-width: 60%;
@@ -341,6 +377,28 @@
341
377
  transition: all 0.7s ease-in-out;
342
378
  border: none;
343
379
  cursor: pointer;
380
+ display: flex;
381
+ align-items: center;
382
+ gap: 5px;
383
+ }
384
+ .my-modal .button .shape-icon,
385
+ .my-modal a .shape-icon {
386
+ display: inline-flex;
387
+ }
388
+ .my-modal .button .shape-icon svg,
389
+ .my-modal a .shape-icon svg {
390
+ display: block;
391
+ }
392
+ .my-modal .button .shape-icon path,
393
+ .my-modal .button .shape-icon .shape-icon__path,
394
+ .my-modal a .shape-icon path,
395
+ .my-modal a .shape-icon .shape-icon__path {
396
+ fill: currentColor;
397
+ transition: fill 0.7s ease-in-out;
398
+ }
399
+ .my-modal .button.fit,
400
+ .my-modal a.fit {
401
+ padding: 10px 15px;
344
402
  }
345
403
  .my-modal .button:hover,
346
404
  .my-modal a:hover {
@@ -367,6 +425,50 @@
367
425
  color: #232323;
368
426
  background-color: #fff;
369
427
  }
428
+ .my-modal .button.inverse svg path,
429
+ .my-modal a.inverse svg path {
430
+ fill: #fff;
431
+ }
432
+ .my-modal .button:disabled, .my-modal .button.disabled,
433
+ .my-modal a:disabled,
434
+ .my-modal a.disabled {
435
+ cursor: not-allowed;
436
+ opacity: 0.5;
437
+ }
438
+ .my-modal .button.is-loading,
439
+ .my-modal a.is-loading {
440
+ position: relative;
441
+ cursor: wait;
442
+ }
443
+ .my-modal .button.is-loading:hover,
444
+ .my-modal a.is-loading:hover {
445
+ background-color: inherit;
446
+ color: inherit;
447
+ }
448
+ .my-modal .button.is-loading .button-content,
449
+ .my-modal a.is-loading .button-content {
450
+ visibility: hidden;
451
+ }
452
+ .my-modal .button.is-loading .spinner,
453
+ .my-modal a.is-loading .spinner {
454
+ position: absolute;
455
+ inset: 0;
456
+ display: flex;
457
+ align-items: center;
458
+ justify-content: center;
459
+ animation: basket-spin 0.9s linear infinite;
460
+ color: currentColor;
461
+ }
462
+ .my-modal .button.is-loading .spinner svg,
463
+ .my-modal a.is-loading .spinner svg {
464
+ display: block;
465
+ }
466
+ .my-modal .button .button-content,
467
+ .my-modal a .button-content {
468
+ display: inline-flex;
469
+ align-items: center;
470
+ gap: 5px;
471
+ }
370
472
  @media (max-width: 1024px) {
371
473
  .my-modal .button,
372
474
  .my-modal a {
@@ -383,4 +485,77 @@
383
485
  }
384
486
  .my-modal > .button {
385
487
  margin: 10px auto;
488
+ }
489
+ .my-modal .basket-status {
490
+ cursor: default;
491
+ pointer-events: none;
492
+ max-width: 100%;
493
+ min-width: 0;
494
+ }
495
+ .my-modal .basket-status--success {
496
+ display: inline-flex;
497
+ align-items: center;
498
+ gap: 10px;
499
+ padding: 12px 18px;
500
+ background-color: #fff;
501
+ color: #232323;
502
+ border-radius: 28px 28px 28px 0;
503
+ box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
504
+ font-size: 14px;
505
+ white-space: nowrap;
506
+ animation: basket-success-in 0.25s ease-out;
507
+ max-width: 100%;
508
+ min-width: 0;
509
+ flex: 1 1 auto;
510
+ }
511
+ .my-modal .basket-status--success > span:last-child {
512
+ min-width: 0;
513
+ overflow: hidden;
514
+ text-overflow: ellipsis;
515
+ }
516
+ .my-modal .basket-status--success .check-icon {
517
+ display: inline-flex;
518
+ color: #2bb673;
519
+ }
520
+ .my-modal .basket-status--success .check-icon svg {
521
+ display: block;
522
+ width: 20px;
523
+ height: 20px;
524
+ }
525
+ .my-modal .basket-status--success strong {
526
+ font-weight: 700;
527
+ }
528
+ .my-modal .basket-status--success.inverse {
529
+ background-color: #232323;
530
+ color: #fff;
531
+ }
532
+ .my-modal .basket-status--success.brown {
533
+ background-color: #3c2114;
534
+ color: #fff;
535
+ }
536
+ @media (max-width: 1024px) {
537
+ .my-modal .basket-status--success {
538
+ font-size: 13px;
539
+ padding: 12px 22px;
540
+ border-radius: 22px 22px 22px 0;
541
+ white-space: normal;
542
+ width: 100%;
543
+ justify-content: center;
544
+ }
545
+ }
546
+
547
+ @keyframes basket-spin {
548
+ to {
549
+ transform: rotate(360deg);
550
+ }
551
+ }
552
+ @keyframes basket-success-in {
553
+ from {
554
+ opacity: 0;
555
+ transform: translateX(-8px);
556
+ }
557
+ to {
558
+ opacity: 1;
559
+ transform: translateX(0);
560
+ }
386
561
  }
@@ -65,6 +65,8 @@ export class Modal {
65
65
  this.shop = undefined;
66
66
  this.product = undefined;
67
67
  this.baselink = undefined;
68
+ this.available_testers = undefined;
69
+ this.price = undefined;
68
70
  this.selectedcolor = undefined;
69
71
  this.arrowDown = 'arrow_down.png';
70
72
  this.chunksNum = 12;
@@ -119,6 +121,9 @@ export class Modal {
119
121
  handleEmitColor(event) {
120
122
  this.onSelectedColorEmit.emit(event.detail);
121
123
  }
124
+ addToBasketHandler(event) {
125
+ return event.detail.id;
126
+ }
122
127
  handleResize() {
123
128
  this.calculateBoxCount();
124
129
  this.displayForMobile();
@@ -399,7 +404,7 @@ export class Modal {
399
404
  var _a;
400
405
  return (h("div", { class: `my-modal`, onMouseEnter: () => this.handleReadyToClose(false), onMouseLeave: () => this.handleReadyToClose(true) }, this.preloader && (h("div", { class: 'loader' }, h("my-loader", null))), !this.preloader && this.data && (h("modal-header", { modalName: this.data.modalName, modalLogo: this.data.modalLogo ? `${APIURL}/assets/${this.data.modalLogo}?access_token=${accessToken}` : null, modalDescription: this.data.modalDescription, shop: this.shop, productName: this.data.name, productSamples: this.data.productSamples, selectedColorFamily: this.filters.colorFamily, isMobile: this.isMobile, onCloseModal: () => this.closeModalHandler(), onSampleSelected: event => this.handleSampleSelect(event.detail), onOnLogoClick: () => this.resetAllFilters(), onOnResetCategory: () => this.resetSelectedCategory() })), h("div", { class: 'my-modal__wrapper' }, !this.preloader && (h("div", { class: 'container_boxes' }, !this.loading && this.colorsList.length === 0 && (h("div", { class: "not-found" }, h("p", null, "Nie zaleziono wynik\u00F3w wyszukiwania pod danym has\u0142em."), h("p", null, " Wpisz inn\u0105 nazw\u0119 b\u0105d\u017A numer koloru lub skorzystaj z kolekcji kolorystycznych."))), ((_a = this.colorsList) === null || _a === void 0 ? void 0 : _a.length) > 0 &&
401
406
  this.chunks(this.colorsList).map((color, index) => {
402
- var _a;
407
+ var _a, _b;
403
408
  return (h("div", { key: index, class: "boxes" }, h("div", { class: "boxes__list" }, color.map((c) => {
404
409
  var _a;
405
410
  return (h("my-colorbox", { key: c.id, onClick: () => {
@@ -422,7 +427,7 @@ export class Modal {
422
427
  isImageInsteadHex: c.imageInsteadHex,
423
428
  bigImage: c.bigImage,
424
429
  } }));
425
- })), ((_a = this.currentColor) === null || _a === void 0 ? void 0 : _a.id) && index === this.currentIndex && (h("my-colorinfo", { currentColor: this.currentColor, shop: this.shop, product: this.product, data: this.data, isMobile: this.isMobile, infoBoxWidth: this.infoBoxWidth, baselink: this.baselink }))));
430
+ })), ((_a = this.currentColor) === null || _a === void 0 ? void 0 : _a.id) && index === this.currentIndex && (h("my-colorinfo", { currentColor: this.currentColor, shop: this.shop, product: this.product, data: this.data, isMobile: this.isMobile, infoBoxWidth: this.infoBoxWidth, baselink: this.baselink, availableTesters: (_b = this.available_testers) === null || _b === void 0 ? void 0 : _b.find((tester) => { var _a, _b, _c; return ((_a = tester.color_name) === null || _a === void 0 ? void 0 : _a.trim().toLowerCase()) === ((_c = (_b = this.currentColor) === null || _b === void 0 ? void 0 : _b.name) === null || _c === void 0 ? void 0 : _c.trim().toLowerCase()); }), price: this.price }))));
426
431
  }))), this.loading && h("my-loader", null)), !this.preloader && this.isMobile && (h("button", { class: "button", onClick: () => this.closeModalHandler() }, "Zamknij"))));
427
432
  }
428
433
  static get is() { return "my-modal"; }
@@ -490,6 +495,43 @@ export class Modal {
490
495
  "attribute": "baselink",
491
496
  "reflect": false
492
497
  },
498
+ "available_testers": {
499
+ "type": "unknown",
500
+ "mutable": false,
501
+ "complexType": {
502
+ "original": "AvailableTester[] | null",
503
+ "resolved": "AvailableTester[] | null",
504
+ "references": {
505
+ "AvailableTester": {
506
+ "location": "import",
507
+ "path": "../../types"
508
+ }
509
+ }
510
+ },
511
+ "required": false,
512
+ "optional": false,
513
+ "docs": {
514
+ "tags": [],
515
+ "text": ""
516
+ }
517
+ },
518
+ "price": {
519
+ "type": "number",
520
+ "mutable": false,
521
+ "complexType": {
522
+ "original": "number | null",
523
+ "resolved": "null | number",
524
+ "references": {}
525
+ },
526
+ "required": false,
527
+ "optional": false,
528
+ "docs": {
529
+ "tags": [],
530
+ "text": ""
531
+ },
532
+ "attribute": "price",
533
+ "reflect": false
534
+ },
493
535
  "selectedcolor": {
494
536
  "type": "string",
495
537
  "mutable": false,
@@ -660,6 +702,12 @@ export class Modal {
660
702
  "target": undefined,
661
703
  "capture": false,
662
704
  "passive": false
705
+ }, {
706
+ "name": "addToBasket",
707
+ "method": "addToBasketHandler",
708
+ "target": undefined,
709
+ "capture": false,
710
+ "passive": false
663
711
  }, {
664
712
  "name": "resize",
665
713
  "method": "handleResize",
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/modal/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Method, Element, Prop, Event, EventEmitter, h, State, Listen, Watch } from '@stencil/core';\nimport { APIURL, accessToken } from '../api';\nimport { setDataLayer } from '../../gtmUtils';\nimport { Color, Product } from '../../types';\nimport { fetchColors, fetchProductData, limit, updateFilters } from '../api/services';\nimport { debounce } from '../../utils';\nimport chroma from 'chroma-js';\n\ndeclare global {\n interface Window {\n dataLayer: Record<string, any>[];\n }\n}\n\n@Component({\n tag: 'my-modal',\n styleUrl: 'index.scss',\n assetsDirs: ['assets'],\n})\nexport class Modal {\n private boxDesktopWidth = 130;\n private boxMobileWidth = 70;\n private desktopPadding = 75;\n private mobilePadding = 35;\n private mediumBreakpoint = 1024;\n private colorTimerInterval: ReturnType<typeof setInterval> | undefined;\n\n @Event({ bubbles: true, composed: true }) onSelectedColorEmit: EventEmitter<Color>;\n\n @Event({ bubbles: true, composed: true }) clearSearchText: EventEmitter;\n @Element() modalEl: HTMLElement;\n\n @Prop() shop: string;\n @Prop() product: string;\n @Prop() baselink: string;\n @Prop() selectedcolor: string | null;\n @Prop() arrowDown = 'arrow_down.png';\n\n @State() chunksNum = 12;\n @State() data: Product | null = null;\n @State() preloader = false;\n @State() loading = false;\n @State() currentColor: Color | null = null;\n @State() currentIndex: number | null = null;\n @State() infoBoxWidth: number | null = null;\n @State() boxWidth: number = this.boxDesktopWidth; // box width with gap\n @State() padding: number = this.desktopPadding;\n @State() isMobile: boolean = false;\n @State() showRange: boolean = false;\n @State() colorCategories: string[] | null = null;\n @State() selectedCategory: any = null;\n @State() page = 1;\n @State() colorIsSelected = false;\n @State() colorsList: Color[] = [];\n @State() hasMore = true;\n @State() filters: any = {\n type: 'product' as 'product' | 'sample' | 'number' | 'name' | 'sampleInProduct',\n id: '',\n productId: '',\n page: 1,\n colorNumber: '',\n colorName: '',\n };\n\n debouncedSearchColorsHandler: (event: CustomEvent) => void;\n\n constructor() {\n this.debouncedSearchColorsHandler = debounce(this.searchColor.bind(this), 300);\n }\n\n @Watch('chunksNum')\n setInfoBoxWidth(newValue: number) {\n this.infoBoxWidth = newValue * this.boxWidth;\n }\n\n @Watch('data')\n watchPropHandler(newValue: Product) {\n if (newValue) {\n this.filters = updateFilters(this.filters, { id: newValue.id, type: 'product' });\n this.fetchColorsData();\n }\n }\n\n private clearInterval = () => {\n this.colorTimerInterval && clearInterval(this.colorTimerInterval);\n this.colorTimerInterval = undefined;\n };\n\n private colorTimer = () => {\n if (this.currentColor && this.currentColor.id) {\n this.colorTimerInterval = setInterval(() => {\n this.currentColor?.name &&\n setDataLayer({\n event: 'ColorTimer',\n shop: this.shop,\n product: this.product,\n color: this.currentColor?.name,\n timer: '10',\n });\n }, 10000);\n } else {\n this.clearInterval();\n }\n };\n\n @Method()\n async open() {\n this.modalEl.style.display = 'block';\n }\n @Event() close: EventEmitter;\n closeModalHandler() {\n this.close.emit();\n }\n\n @Event() readyToCLose: EventEmitter;\n handleReadyToClose(value: boolean) {\n this.readyToCLose.emit({ observable: value });\n }\n\n @Listen('closeInfoBox')\n closeInfoBoxHandler() {\n this.currentColor = null;\n this.currentIndex = null;\n }\n\n @Listen('onCurrentColor')\n handleEmitColor(event: CustomEvent<Color>) {\n this.onSelectedColorEmit.emit(event.detail);\n }\n\n private chunks = (xs: Color[], y: Color[][] = []): Color[][] => {\n return xs?.length === 0 ? y : this.chunks(xs?.slice(this.chunksNum), y.concat([xs?.slice(0, this.chunksNum)]));\n };\n\n private calculateBoxCount = () => {\n const modalWidth = this.modalEl.children && this.modalEl.children[0] && this.modalEl.children[0]?.clientWidth - this.padding;\n const boxWidth = this.boxWidth;\n\n const calc = Math.floor(modalWidth / boxWidth);\n\n const boxesCount = calc;\n\n if (!this.preloader) this.chunksNum = boxesCount;\n };\n\n private displayForMobile = () => {\n if (window.innerWidth < this.mediumBreakpoint) {\n this.boxWidth = this.boxMobileWidth;\n this.padding = this.mobilePadding;\n this.isMobile = true;\n } else {\n this.isMobile = false;\n this.boxWidth = this.boxDesktopWidth;\n this.padding = this.desktopPadding;\n }\n };\n\n @Listen('resize', { target: 'window' })\n handleResize() {\n this.calculateBoxCount();\n this.displayForMobile();\n }\n\n private sortColorsBySimilarity(colors: Color[]): Color[] {\n if (colors?.length <= 1) return colors;\n\n const sortedColors: Color[] = [];\n const remainingColors = [...colors];\n\n // Start with the first color\n sortedColors.push(remainingColors.shift()!);\n\n while (remainingColors?.length > 0) {\n // Find the most similar color to the last color in sortedColors\n const lastColor = sortedColors[sortedColors?.length - 1];\n let mostSimilarIndex = 0;\n let minDistance = Infinity;\n\n remainingColors.forEach((color, index) => {\n try {\n // Validate hex colors before calculating distance\n if (!color.hex || !lastColor.hex) {\n return;\n }\n\n const distance = chroma.distance(lastColor.hex, color.hex, 'lab');\n if (distance < minDistance) {\n minDistance = distance;\n mostSimilarIndex = index;\n }\n } catch (error) {\n console.warn(`Error calculating color distance for ${color.hex}:`, error);\n // Skip this color if it causes an error\n }\n });\n\n // Move the most similar color to sortedColors\n sortedColors.push(remainingColors.splice(mostSimilarIndex, 1)[0]);\n }\n\n return sortedColors;\n }\n\n private getColorHueGroup(hex: string): string {\n try {\n // Validate hex format and handle invalid colors\n if (!hex || typeof hex !== 'string') {\n return 'other';\n }\n\n // Basic hex validation\n const cleanHex = hex.startsWith('#') ? hex : `#${hex}`;\n if (!/^#[0-9A-Fa-f]{6}$/.test(cleanHex)) {\n console.warn(`Invalid hex color format: ${hex}`);\n return 'other';\n }\n\n const color = chroma(cleanHex);\n const hue = color.get('hsl.h');\n const saturation = color.get('hsl.s');\n const lightness = color.get('hsl.l');\n\n // Handle grayscale colors\n if (saturation < 0.1) {\n if (lightness < 0.2) return 'black';\n if (lightness > 0.8) return 'white';\n return 'gray';\n }\n\n // Group colors by hue ranges\n if (hue >= 330 || hue < 30) return 'red';\n if (hue >= 30 && hue < 90) return 'yellow';\n if (hue >= 90 && hue < 150) return 'green';\n if (hue >= 150 && hue < 210) return 'cyan';\n if (hue >= 210 && hue < 270) return 'blue';\n if (hue >= 270 && hue < 330) return 'magenta';\n\n return 'other';\n } catch (error) {\n console.warn(`Error parsing color \"${hex}\":`, error);\n return 'other';\n }\n }\n\n private sortColorsByHueAndSimilarity(colors: Color[]): Color[] {\n if (colors?.length <= 1) return colors;\n\n // Filter out colors with invalid hex values\n const validColors = colors.filter(color => {\n if (!color.hex || typeof color.hex !== 'string') {\n console.warn(`Color missing hex value:`, color);\n return false;\n }\n\n const cleanHex = color.hex.startsWith('#') ? color.hex : `#${color.hex}`;\n const isValid = /^#[0-9A-Fa-f]{6}$/.test(cleanHex);\n\n if (!isValid) {\n console.warn(`Invalid hex color format: ${color.hex} for color:`, color);\n }\n\n return isValid;\n });\n\n // Group valid colors by their hue family\n const colorGroups: Record<string, Color[]> = {\n red: [],\n yellow: [],\n green: [],\n cyan: [],\n blue: [],\n magenta: [],\n gray: [],\n black: [],\n white: [],\n other: [],\n };\n\n validColors.forEach(color => {\n const group = this.getColorHueGroup(color.hex);\n colorGroups[group].push(color);\n });\n\n // Sort each group by similarity\n const sortedGroups: Color[][] = [];\n const groupOrder = ['red', 'magenta', 'blue', 'cyan', 'green', 'yellow', 'gray', 'black', 'white', 'other'];\n\n groupOrder.forEach(groupName => {\n if (colorGroups[groupName].length > 0) {\n sortedGroups.push(this.sortColorsBySimilarity(colorGroups[groupName]));\n }\n });\n\n // Combine all sorted groups\n return sortedGroups.flat();\n }\n\n private async fetchColorsData({ reset = false } = {}) {\n if (this.loading && !reset) return;\n this.loading = true;\n\n try {\n const colors = await fetchColors(this.filters);\n\n if (reset) {\n // For new searches, sort all colors by hue and similarity\n this.colorsList = this.sortColorsByHueAndSimilarity(colors);\n } else {\n // For pagination, combine and sort all colors\n this.colorsList = this.sortColorsByHueAndSimilarity([...this.colorsList, ...colors]);\n }\n\n this.hasMore = colors.length >= limit;\n } catch (error) {\n console.error('Error fetching colors:', error);\n } finally {\n this.loading = false;\n }\n }\n\n private async loadProductData() {\n this.preloader = true;\n\n const product = await fetchProductData({ shopName: this.shop, productName: this.product });\n\n if (product) {\n this.data = product;\n this.filters = updateFilters(this.filters, { type: 'product', id: product.id });\n\n // Fetch initial colors\n await this.fetchColorsData();\n }\n\n this.preloader = false;\n }\n\n private async loadMoreColors() {\n if (this.loading || !this.hasMore) return; // Prevent spam loading\n\n this.filters = { ...this.filters, page: this.filters.page + 1 }; // Increase page for lazy loading\n\n await this.fetchColorsData({ reset: false }); // Append results\n }\n\n private updateFilterAndFetch(newFilters: Partial<typeof this.filters>) {\n if (!this.data?.id) return;\n\n this.loading = true;\n\n this.filters = updateFilters(this.filters, {\n id: this.data.id,\n sampleId: this.filters.sampleId,\n colorName: this.filters.colorName,\n ...newFilters,\n page: 1,\n });\n\n this.fetchColorsData({ reset: true }).finally(() => {\n this.loading = false;\n });\n }\n\n async searchColor(event: CustomEvent) {\n const query = event.detail?.trim();\n\n this.updateFilterAndFetch({ colorName: query });\n }\n\n @Listen('colorFamilySelected')\n handleColorFamilySelected(event: CustomEvent) {\n this.currentColor = null;\n if (event.detail === this.filters.colorFamily) {\n this.filters = updateFilters(this.filters, { colorFamily: '' });\n this.updateFilterAndFetch({ colorFamily: '' });\n } else {\n this.filters = updateFilters(this.filters, { colorFamily: event.detail });\n this.updateFilterAndFetch({ colorFamily: event.detail });\n }\n }\n\n @Listen('searchColors')\n searchColorsHandler(event: CustomEvent) {\n this.loading = true;\n this.currentColor = null;\n this.debouncedSearchColorsHandler(event);\n }\n\n private handleSampleSelect = (selectedSample?: any) => {\n this.currentColor = null;\n this.selectedCategory = selectedSample.value;\n\n this.updateFilterAndFetch({ sampleId: selectedSample.value, colorFamily: '' });\n };\n\n handleScroll(_event: Event, modalContent: HTMLElement) {\n if (this.loading || !this.hasMore) return;\n\n const scrollTop = modalContent.scrollTop;\n const scrollHeight = modalContent.scrollHeight;\n const clientHeight = modalContent.clientHeight;\n\n // Check if user scrolled to the bottom of the modal\n if (scrollTop + clientHeight >= scrollHeight - 50) {\n this.loadMoreColors();\n }\n }\n\n private openSeletedColor() {\n if (!this.colorsList || !this.selectedcolor) return;\n\n if (!this.colorIsSelected) {\n const result = this.chunks(this.colorsList)\n .map((innerArray, arrayIndex) => {\n const foundColor = innerArray.find(color => color.name.trim()?.toUpperCase() === this.selectedcolor?.trim()?.toUpperCase());\n\n return foundColor ? { color: foundColor, index: arrayIndex } : null;\n })\n .filter(item => item !== null);\n\n this.currentColor = result[0]?.color as any;\n this.currentIndex = result[0]?.index as any;\n this.colorIsSelected = true;\n }\n }\n\n componentWillLoad() {\n this.preloader = true;\n setDataLayer({\n shop: this.shop,\n product: this.product,\n });\n\n this.loadProductData();\n }\n\n componentWillRender() {\n this.displayForMobile();\n this.calculateBoxCount();\n this.colorTimer();\n this.openSeletedColor();\n\n const modalContent = this.modalEl.querySelector('.my-modal') as HTMLElement;\n if (modalContent) {\n modalContent.addEventListener('scroll', event => this.handleScroll(event, modalContent));\n }\n }\n\n private resetColors() {\n this.currentColor = null;\n this.currentIndex = null;\n this.colorIsSelected = false;\n }\n\n private resetAllFilters() {\n // Reset current color selection\n this.resetColors();\n\n // Reset filters to initial state\n this.filters = {\n type: 'product',\n id: this.data?.id || '',\n productId: '',\n page: 1,\n colorNumber: '',\n colorName: '',\n colorFamily: '',\n sampleId: '',\n };\n\n // Reset selected category\n this.selectedCategory = null;\n\n // Clear search text\n this.clearSearchText.emit();\n\n // Fetch colors with reset filters\n this.fetchColorsData({ reset: true });\n }\n\n private resetSelectedCategory() {\n this.resetColors();\n this.colorIsSelected = false;\n this.selectedCategory = null;\n this.filters = updateFilters(this.filters, { sampleId: '' });\n this.fetchColorsData({ reset: true });\n }\n\n render() {\n return (\n <div class={`my-modal`} onMouseEnter={() => this.handleReadyToClose(false)} onMouseLeave={() => this.handleReadyToClose(true)}>\n {this.preloader && (\n <div class={'loader'}>\n <my-loader></my-loader>\n </div>\n )}\n {!this.preloader && this.data && (\n <modal-header\n modalName={this.data.modalName}\n modalLogo={this.data.modalLogo ? `${APIURL}/assets/${this.data.modalLogo}?access_token=${accessToken}` : null}\n modalDescription={this.data.modalDescription}\n shop={this.shop}\n productName={this.data.name}\n productSamples={this.data.productSamples}\n selectedColorFamily={this.filters.colorFamily}\n isMobile={this.isMobile}\n onCloseModal={() => this.closeModalHandler()}\n onSampleSelected={event => this.handleSampleSelect(event.detail)}\n onOnLogoClick={() => this.resetAllFilters()}\n onOnResetCategory={() => this.resetSelectedCategory()}\n ></modal-header>\n )}\n\n <div class={'my-modal__wrapper'}>\n {!this.preloader && (\n <div class={'container_boxes'}>\n {!this.loading && this.colorsList.length === 0 && (\n <div class=\"not-found\">\n <p>Nie zaleziono wyników wyszukiwania pod danym hasłem.</p>\n <p> Wpisz inną nazwę bądź numer koloru lub skorzystaj z kolekcji kolorystycznych.</p>\n </div>\n )}\n {this.colorsList?.length > 0 &&\n this.chunks(this.colorsList).map((color: Color[], index: number) => {\n return (\n <div key={index} class=\"boxes\">\n <div class=\"boxes__list\">\n {color.map((c: Color) => (\n <my-colorbox\n key={c.id}\n onClick={() => {\n if (this.currentColor?.id === c.id) {\n this.currentColor = null;\n } else {\n this.currentColor = c;\n }\n this.currentIndex = index;\n setDataLayer({\n event: 'ColorClick',\n shop: this.shop,\n product: this.product,\n color: c.name,\n });\n this.clearInterval();\n }}\n color={c.hex}\n name={c.name}\n isActive={this.currentColor?.id === c.id}\n shop={this.shop}\n product={this.product}\n isImageInsteadHex={{\n isImageInsteadHex: c.imageInsteadHex,\n bigImage: c.bigImage,\n }}\n ></my-colorbox>\n ))}\n </div>\n\n {this.currentColor?.id && index === this.currentIndex && (\n <my-colorinfo\n currentColor={this.currentColor}\n shop={this.shop}\n product={this.product}\n data={this.data}\n isMobile={this.isMobile}\n infoBoxWidth={this.infoBoxWidth}\n baselink={this.baselink}\n ></my-colorinfo>\n )}\n </div>\n );\n })}\n </div>\n )}\n {this.loading && <my-loader></my-loader>}\n </div>\n {!this.preloader && this.isMobile && (\n <button class=\"button\" onClick={() => this.closeModalHandler()}>\n Zamknij\n </button>\n )}\n </div>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/modal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAgB,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAC/G,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,MAAM,MAAM,WAAW,CAAC;AAa/B,MAAM,OAAO,KAAK;EAiDhB;IAhDQ,oBAAe,GAAG,GAAG,CAAC;IACtB,mBAAc,GAAG,EAAE,CAAC;IACpB,mBAAc,GAAG,EAAE,CAAC;IACpB,kBAAa,GAAG,EAAE,CAAC;IACnB,qBAAgB,GAAG,IAAI,CAAC;IA6DxB,kBAAa,GAAG,GAAG,EAAE;MAC3B,IAAI,CAAC,kBAAkB,IAAI,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;MAClE,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;IACtC,CAAC,CAAC;IAEM,eAAU,GAAG,GAAG,EAAE;MACxB,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,CAAC,EAAE,EAAE;QAC7C,IAAI,CAAC,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;;UACzC,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI;YACrB,YAAY,CAAC;cACX,KAAK,EAAE,YAAY;cACnB,IAAI,EAAE,IAAI,CAAC,IAAI;cACf,OAAO,EAAE,IAAI,CAAC,OAAO;cACrB,KAAK,EAAE,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI;cAC9B,KAAK,EAAE,IAAI;aACZ,CAAC,CAAC;QACP,CAAC,EAAE,KAAK,CAAC,CAAC;OACX;WAAM;QACL,IAAI,CAAC,aAAa,EAAE,CAAC;OACtB;IACH,CAAC,CAAC;IAgCM,WAAM,GAAG,CAAC,EAAW,EAAE,IAAe,EAAE,EAAa,EAAE;MAC7D,OAAO,CAAA,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,MAAM,MAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,EAAE,aAAF,EAAE,uBAAF,EAAE,CAAE,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;IACjH,CAAC,CAAC;IAEM,sBAAiB,GAAG,GAAG,EAAE;;MAC/B,MAAM,UAAU,GAAG,IAAI,CAAC,OAAO,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA,MAAA,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,0CAAE,WAAW,IAAG,IAAI,CAAC,OAAO,CAAC;MAC7H,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;MAE/B,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,CAAC,CAAC;MAE/C,MAAM,UAAU,GAAG,IAAI,CAAC;MAExB,IAAI,CAAC,IAAI,CAAC,SAAS;QAAE,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC;IACnD,CAAC,CAAC;IAEM,qBAAgB,GAAG,GAAG,EAAE;MAC9B,IAAI,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,gBAAgB,EAAE;QAC7C,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,cAAc,CAAC;QACpC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAC;QAClC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;OACtB;WAAM;QACL,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,eAAe,CAAC;QACrC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,cAAc,CAAC;OACpC;IACH,CAAC,CAAC;IAwOM,uBAAkB,GAAG,CAAC,cAAoB,EAAE,EAAE;MACpD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;MACzB,IAAI,CAAC,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC;MAE7C,IAAI,CAAC,oBAAoB,CAAC,EAAE,QAAQ,EAAE,cAAc,CAAC,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC;IACjF,CAAC,CAAC;;;;;;;qBAzWkB,gBAAgB;qBAEf,EAAE;gBACS,IAAI;qBACf,KAAK;mBACP,KAAK;wBACc,IAAI;wBACH,IAAI;wBACJ,IAAI;oBACf,IAAI,CAAC,eAAe;mBACrB,IAAI,CAAC,cAAc;oBACjB,KAAK;qBACJ,KAAK;2BACS,IAAI;4BACf,IAAI;gBACrB,CAAC;2BACU,KAAK;sBACD,EAAE;mBACd,IAAI;mBACC;MACtB,IAAI,EAAE,SAAyE;MAC/E,EAAE,EAAE,EAAE;MACN,SAAS,EAAE,EAAE;MACb,IAAI,EAAE,CAAC;MACP,WAAW,EAAE,EAAE;MACf,SAAS,EAAE,EAAE;KACd;IAKC,IAAI,CAAC,4BAA4B,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;GAChF;EAGD,eAAe,CAAC,QAAgB;IAC9B,IAAI,CAAC,YAAY,GAAG,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC;EAC/C,CAAC;EAGD,gBAAgB,CAAC,QAAiB;IAChC,IAAI,QAAQ,EAAE;MACZ,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,EAAE,EAAE,QAAQ,CAAC,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC;MACjF,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;EACH,CAAC;EAyBD,KAAK,CAAC,IAAI;IACR,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,GAAG,OAAO,CAAC;EACvC,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;EACpB,CAAC;EAGD,kBAAkB,CAAC,KAAc;IAC/B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC,CAAC;EAChD,CAAC;EAGD,mBAAmB;IACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;EAC3B,CAAC;EAGD,eAAe,CAAC,KAAyB;IACvC,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;EAC9C,CAAC;EAGD,kBAAkB,CAAC,KAAkC;IACnD,OAAO,KAAK,CAAC,MAAM,CAAC,EAAE,CAAC;EACzB,CAAC;EA8BD,YAAY;IACV,IAAI,CAAC,iBAAiB,EAAE,CAAC;IACzB,IAAI,CAAC,gBAAgB,EAAE,CAAC;EAC1B,CAAC;EAEO,sBAAsB,CAAC,MAAe;IAC5C,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,KAAI,CAAC;MAAE,OAAO,MAAM,CAAC;IAEvC,MAAM,YAAY,GAAY,EAAE,CAAC;IACjC,MAAM,eAAe,GAAG,CAAC,GAAG,MAAM,CAAC,CAAC;IAEpC,6BAA6B;IAC7B,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,EAAG,CAAC,CAAC;IAE5C,OAAO,CAAA,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,MAAM,IAAG,CAAC,EAAE;MAClC,gEAAgE;MAChE,MAAM,SAAS,GAAG,YAAY,CAAC,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,MAAM,IAAG,CAAC,CAAC,CAAC;MACzD,IAAI,gBAAgB,GAAG,CAAC,CAAC;MACzB,IAAI,WAAW,GAAG,QAAQ,CAAC;MAE3B,eAAe,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE;QACvC,IAAI;UACF,kDAAkD;UAClD,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,EAAE;YAChC,OAAO;WACR;UAED,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;UAClE,IAAI,QAAQ,GAAG,WAAW,EAAE;YAC1B,WAAW,GAAG,QAAQ,CAAC;YACvB,gBAAgB,GAAG,KAAK,CAAC;WAC1B;SACF;QAAC,OAAO,KAAK,EAAE;UACd,OAAO,CAAC,IAAI,CAAC,wCAAwC,KAAK,CAAC,GAAG,GAAG,EAAE,KAAK,CAAC,CAAC;UAC1E,wCAAwC;SACzC;MACH,CAAC,CAAC,CAAC;MAEH,8CAA8C;MAC9C,YAAY,CAAC,IAAI,CAAC,eAAe,CAAC,MAAM,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;KACnE;IAED,OAAO,YAAY,CAAC;EACtB,CAAC;EAEO,gBAAgB,CAAC,GAAW;IAClC,IAAI;MACF,gDAAgD;MAChD,IAAI,CAAC,GAAG,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;QACnC,OAAO,OAAO,CAAC;OAChB;MAED,uBAAuB;MACvB,MAAM,QAAQ,GAAG,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,GAAG,EAAE,CAAC;MACvD,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;QACvC,OAAO,CAAC,IAAI,CAAC,6BAA6B,GAAG,EAAE,CAAC,CAAC;QACjD,OAAO,OAAO,CAAC;OAChB;MAED,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;MAC/B,MAAM,GAAG,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;MAC/B,MAAM,UAAU,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;MACtC,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;MAErC,0BAA0B;MAC1B,IAAI,UAAU,GAAG,GAAG,EAAE;QACpB,IAAI,SAAS,GAAG,GAAG;UAAE,OAAO,OAAO,CAAC;QACpC,IAAI,SAAS,GAAG,GAAG;UAAE,OAAO,OAAO,CAAC;QACpC,OAAO,MAAM,CAAC;OACf;MAED,6BAA6B;MAC7B,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,EAAE;QAAE,OAAO,KAAK,CAAC;MACzC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,GAAG,EAAE;QAAE,OAAO,QAAQ,CAAC;MAC3C,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,GAAG,GAAG;QAAE,OAAO,OAAO,CAAC;MAC3C,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG;QAAE,OAAO,MAAM,CAAC;MAC3C,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG;QAAE,OAAO,MAAM,CAAC;MAC3C,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG;QAAE,OAAO,SAAS,CAAC;MAE9C,OAAO,OAAO,CAAC;KAChB;IAAC,OAAO,KAAK,EAAE;MACd,OAAO,CAAC,IAAI,CAAC,wBAAwB,GAAG,IAAI,EAAE,KAAK,CAAC,CAAC;MACrD,OAAO,OAAO,CAAC;KAChB;EACH,CAAC;EAEO,4BAA4B,CAAC,MAAe;IAClD,IAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,KAAI,CAAC;MAAE,OAAO,MAAM,CAAC;IAEvC,4CAA4C;IAC5C,MAAM,WAAW,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE;MACxC,IAAI,CAAC,KAAK,CAAC,GAAG,IAAI,OAAO,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;QAC/C,OAAO,CAAC,IAAI,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;QAChD,OAAO,KAAK,CAAC;OACd;MAED,MAAM,QAAQ,GAAG,KAAK,CAAC,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,GAAG,EAAE,CAAC;MACzE,MAAM,OAAO,GAAG,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;MAEnD,IAAI,CAAC,OAAO,EAAE;QACZ,OAAO,CAAC,IAAI,CAAC,6BAA6B,KAAK,CAAC,GAAG,aAAa,EAAE,KAAK,CAAC,CAAC;OAC1E;MAED,OAAO,OAAO,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,yCAAyC;IACzC,MAAM,WAAW,GAA4B;MAC3C,GAAG,EAAE,EAAE;MACP,MAAM,EAAE,EAAE;MACV,KAAK,EAAE,EAAE;MACT,IAAI,EAAE,EAAE;MACR,IAAI,EAAE,EAAE;MACR,OAAO,EAAE,EAAE;MACX,IAAI,EAAE,EAAE;MACR,KAAK,EAAE,EAAE;MACT,KAAK,EAAE,EAAE;MACT,KAAK,EAAE,EAAE;KACV,CAAC;IAEF,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;MAC1B,MAAM,KAAK,GAAG,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;MAC/C,WAAW,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,gCAAgC;IAChC,MAAM,YAAY,GAAc,EAAE,CAAC;IACnC,MAAM,UAAU,GAAG,CAAC,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC;IAE5G,UAAU,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE;MAC7B,IAAI,WAAW,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE;QACrC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,sBAAsB,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;OACxE;IACH,CAAC,CAAC,CAAC;IAEH,4BAA4B;IAC5B,OAAO,YAAY,CAAC,IAAI,EAAE,CAAC;EAC7B,CAAC;EAEO,KAAK,CAAC,eAAe,CAAC,EAAE,KAAK,GAAG,KAAK,EAAE,GAAG,EAAE;IAClD,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;MAAE,OAAO;IACnC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IAEpB,IAAI;MACF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;MAE/C,IAAI,KAAK,EAAE;QACT,0DAA0D;QAC1D,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,4BAA4B,CAAC,MAAM,CAAC,CAAC;OAC7D;WAAM;QACL,8CAA8C;QAC9C,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,4BAA4B,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,CAAC,CAAC;OACtF;MAED,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC,MAAM,IAAI,KAAK,CAAC;KACvC;IAAC,OAAO,KAAK,EAAE;MACd,OAAO,CAAC,KAAK,CAAC,wBAAwB,EAAE,KAAK,CAAC,CAAC;KAChD;YAAS;MACR,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;KACtB;EACH,CAAC;EAEO,KAAK,CAAC,eAAe;IAC3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IAEtB,MAAM,OAAO,GAAG,MAAM,gBAAgB,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,EAAE,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;IAE3F,IAAI,OAAO,EAAE;MACX,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC;MACpB,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;MAEhF,uBAAuB;MACvB,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;KAC9B;IAED,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;EACzB,CAAC;EAEO,KAAK,CAAC,cAAc;IAC1B,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO,CAAC,uBAAuB;IAElE,IAAI,CAAC,OAAO,mCAAQ,IAAI,CAAC,OAAO,KAAE,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,GAAG,CAAC,GAAE,CAAC,CAAC,iCAAiC;IAElG,MAAM,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,iBAAiB;EACjE,CAAC;EAEO,oBAAoB,CAAC,UAAwC;;IACnE,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,EAAE,CAAA;MAAE,OAAO;IAE3B,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IAEpB,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,gCACvC,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,EAChB,QAAQ,EAAE,IAAI,CAAC,OAAO,CAAC,QAAQ,EAC/B,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,SAAS,IAC9B,UAAU,KACb,IAAI,EAAE,CAAC,IACP,CAAC;IAEH,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,GAAG,EAAE;MACjD,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;IACvB,CAAC,CAAC,CAAC;EACL,CAAC;EAED,KAAK,CAAC,WAAW,CAAC,KAAkB;;IAClC,MAAM,KAAK,GAAG,MAAA,KAAK,CAAC,MAAM,0CAAE,IAAI,EAAE,CAAC;IAEnC,IAAI,CAAC,oBAAoB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;EAClD,CAAC;EAGD,yBAAyB,CAAC,KAAkB;IAC1C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,KAAK,CAAC,MAAM,KAAK,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE;MAC7C,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC;MAChE,IAAI,CAAC,oBAAoB,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC;KAChD;SAAM;MACL,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC;MAC1E,IAAI,CAAC,oBAAoB,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC;KAC1D;EACH,CAAC;EAGD,mBAAmB,CAAC,KAAkB;IACpC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;IACpB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAC;EAC3C,CAAC;EASD,YAAY,CAAC,MAAa,EAAE,YAAyB;IACnD,IAAI,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO;IAE1C,MAAM,SAAS,GAAG,YAAY,CAAC,SAAS,CAAC;IACzC,MAAM,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC;IAC/C,MAAM,YAAY,GAAG,YAAY,CAAC,YAAY,CAAC;IAE/C,oDAAoD;IACpD,IAAI,SAAS,GAAG,YAAY,IAAI,YAAY,GAAG,EAAE,EAAE;MACjD,IAAI,CAAC,cAAc,EAAE,CAAC;KACvB;EACH,CAAC;EAEO,gBAAgB;;IACtB,IAAI,CAAC,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,aAAa;MAAE,OAAO;IAEpD,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE;MACzB,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;SACxC,GAAG,CAAC,CAAC,UAAU,EAAE,UAAU,EAAE,EAAE;QAC9B,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,mBAAC,OAAA,CAAA,MAAA,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,0CAAE,WAAW,EAAE,OAAK,MAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,IAAI,EAAE,0CAAE,WAAW,EAAE,CAAA,CAAA,EAAA,CAAC,CAAC;QAE5H,OAAO,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;MACtE,CAAC,CAAC;SACD,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC;MAEjC,IAAI,CAAC,YAAY,GAAG,MAAA,MAAM,CAAC,CAAC,CAAC,0CAAE,KAAY,CAAC;MAC5C,IAAI,CAAC,YAAY,GAAG,MAAA,MAAM,CAAC,CAAC,CAAC,0CAAE,KAAY,CAAC;MAC5C,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;KAC7B;EACH,CAAC;EAED,iBAAiB;IACf,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;IACtB,YAAY,CAAC;MACX,IAAI,EAAE,IAAI,CAAC,IAAI;MACf,OAAO,EAAE,IAAI,CAAC,OAAO;KACtB,CAAC,CAAC;IAEH,IAAI,CAAC,eAAe,EAAE,CAAC;EACzB,CAAC;EAED,mBAAmB;IACjB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IACxB,IAAI,CAAC,iBAAiB,EAAE,CAAC;IACzB,IAAI,CAAC,UAAU,EAAE,CAAC;IAClB,IAAI,CAAC,gBAAgB,EAAE,CAAC;IAExB,MAAM,YAAY,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,WAAW,CAAgB,CAAC;IAC5E,IAAI,YAAY,EAAE;MAChB,YAAY,CAAC,gBAAgB,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;KAC1F;EACH,CAAC;EAEO,WAAW;IACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;IACzB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;EAC/B,CAAC;EAEO,eAAe;;IACrB,gCAAgC;IAChC,IAAI,CAAC,WAAW,EAAE,CAAC;IAEnB,iCAAiC;IACjC,IAAI,CAAC,OAAO,GAAG;MACb,IAAI,EAAE,SAAS;MACf,EAAE,EAAE,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,EAAE,KAAI,EAAE;MACvB,SAAS,EAAE,EAAE;MACb,IAAI,EAAE,CAAC;MACP,WAAW,EAAE,EAAE;MACf,SAAS,EAAE,EAAE;MACb,WAAW,EAAE,EAAE;MACf,QAAQ,EAAE,EAAE;KACb,CAAC;IAEF,0BAA0B;IAC1B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAE7B,oBAAoB;IACpB,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC;IAE5B,kCAAkC;IAClC,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;EACxC,CAAC;EAEO,qBAAqB;IAC3B,IAAI,CAAC,WAAW,EAAE,CAAC;IACnB,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;IAC7B,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC;IAC7B,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,IAAI,CAAC,OAAO,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;IAC7D,IAAI,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;EACxC,CAAC;EAED,MAAM;;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC;MAC1H,IAAI,CAAC,SAAS,IAAI,CACjB,WAAK,KAAK,EAAE,QAAQ;QAClB,oBAAuB,CACnB,CACP;MACA,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,IAAI,IAAI,CAC/B,oBACE,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAC9B,SAAS,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,MAAM,WAAW,IAAI,CAAC,IAAI,CAAC,SAAS,iBAAiB,WAAW,EAAE,CAAC,CAAC,CAAC,IAAI,EAC7G,gBAAgB,EAAE,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAC5C,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,WAAW,EAAE,IAAI,CAAC,IAAI,CAAC,IAAI,EAC3B,cAAc,EAAE,IAAI,CAAC,IAAI,CAAC,cAAc,EACxC,mBAAmB,EAAE,IAAI,CAAC,OAAO,CAAC,WAAW,EAC7C,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,YAAY,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,EAC5C,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,KAAK,CAAC,MAAM,CAAC,EAChE,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,EAC3C,iBAAiB,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,qBAAqB,EAAE,GACvC,CACjB;MAED,WAAK,KAAK,EAAE,mBAAmB;QAC5B,CAAC,IAAI,CAAC,SAAS,IAAI,CAClB,WAAK,KAAK,EAAE,iBAAiB;UAC1B,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,CAChD,WAAK,KAAK,EAAC,WAAW;YACpB,8EAA2D;YAC3D,kHAAqF,CACjF,CACP;UACA,CAAA,MAAA,IAAI,CAAC,UAAU,0CAAE,MAAM,IAAG,CAAC;YAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,KAAc,EAAE,KAAa,EAAE,EAAE;;cACjE,OAAO,CACL,WAAK,GAAG,EAAE,KAAK,EAAE,KAAK,EAAC,OAAO;gBAC5B,WAAK,KAAK,EAAC,aAAa,IACrB,KAAK,CAAC,GAAG,CAAC,CAAC,CAAQ,EAAE,EAAE;;kBAAC,OAAA,CACvB,mBACE,GAAG,EAAE,CAAC,CAAC,EAAE,EACT,OAAO,EAAE,GAAG,EAAE;;sBACZ,IAAI,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,EAAE,MAAK,CAAC,CAAC,EAAE,EAAE;wBAClC,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;uBAC1B;2BAAM;wBACL,IAAI,CAAC,YAAY,GAAG,CAAC,CAAC;uBACvB;sBACD,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC;sBAC1B,YAAY,CAAC;wBACX,KAAK,EAAE,YAAY;wBACnB,IAAI,EAAE,IAAI,CAAC,IAAI;wBACf,OAAO,EAAE,IAAI,CAAC,OAAO;wBACrB,KAAK,EAAE,CAAC,CAAC,IAAI;uBACd,CAAC,CAAC;sBACH,IAAI,CAAC,aAAa,EAAE,CAAC;oBACvB,CAAC,EACD,KAAK,EAAE,CAAC,CAAC,GAAG,EACZ,IAAI,EAAE,CAAC,CAAC,IAAI,EACZ,QAAQ,EAAE,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,EAAE,MAAK,CAAC,CAAC,EAAE,EACxC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,iBAAiB,EAAE;sBACjB,iBAAiB,EAAE,CAAC,CAAC,eAAe;sBACpC,QAAQ,EAAE,CAAC,CAAC,QAAQ;qBACrB,GACY,CAChB,CAAA;iBAAA,CAAC,CACE;gBAEL,CAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,EAAE,KAAI,KAAK,KAAK,IAAI,CAAC,YAAY,IAAI,CACvD,oBACE,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,YAAY,EAAE,IAAI,CAAC,YAAY,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,gBAAgB,EAAE,MAAA,IAAI,CAAC,iBAAiB,0CAAE,IAAI,CAC5C,CAAC,MAAuB,EAAE,EAAE,mBAAC,OAAA,CAAA,MAAA,MAAM,CAAC,UAAU,0CAAE,IAAI,GAAG,WAAW,EAAE,OAAK,MAAA,MAAA,IAAI,CAAC,YAAY,0CAAE,IAAI,0CAAE,IAAI,GAAG,WAAW,EAAE,CAAA,CAAA,EAAA,CACvH,EACD,KAAK,EAAE,IAAI,CAAC,KAAK,GACH,CACjB,CACG,CACP,CAAC;YACJ,CAAC,CAAC,CACA,CACP;QACA,IAAI,CAAC,OAAO,IAAI,oBAAuB,CACpC;MACL,CAAC,IAAI,CAAC,SAAS,IAAI,IAAI,CAAC,QAAQ,IAAI,CACnC,cAAQ,KAAK,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,iBAAiB,EAAE,cAErD,CACV,CACG,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Method, Element, Prop, Event, EventEmitter, h, State, Listen, Watch } from '@stencil/core';\nimport { APIURL, accessToken } from '../api';\nimport { setDataLayer } from '../../gtmUtils';\nimport { AvailableTester, Color, Product } from '../../types';\nimport { fetchColors, fetchProductData, limit, updateFilters } from '../api/services';\nimport { debounce } from '../../utils';\nimport chroma from 'chroma-js';\n\ndeclare global {\n interface Window {\n dataLayer: Record<string, any>[];\n }\n}\n\n@Component({\n tag: 'my-modal',\n styleUrl: 'index.scss',\n assetsDirs: ['assets'],\n})\nexport class Modal {\n private boxDesktopWidth = 130;\n private boxMobileWidth = 70;\n private desktopPadding = 75;\n private mobilePadding = 35;\n private mediumBreakpoint = 1024;\n private colorTimerInterval: ReturnType<typeof setInterval> | undefined;\n\n @Event({ bubbles: true, composed: true }) onSelectedColorEmit: EventEmitter<Color>;\n\n @Event({ bubbles: true, composed: true }) clearSearchText: EventEmitter;\n @Element() modalEl: HTMLElement;\n\n @Prop() shop: string;\n @Prop() product: string;\n @Prop() baselink: string;\n @Prop() available_testers: AvailableTester[] | null;\n @Prop() price: number | null;\n @Prop() selectedcolor: string | null;\n @Prop() arrowDown = 'arrow_down.png';\n\n @State() chunksNum = 12;\n @State() data: Product | null = null;\n @State() preloader = false;\n @State() loading = false;\n @State() currentColor: Color | null = null;\n @State() currentIndex: number | null = null;\n @State() infoBoxWidth: number | null = null;\n @State() boxWidth: number = this.boxDesktopWidth; // box width with gap\n @State() padding: number = this.desktopPadding;\n @State() isMobile: boolean = false;\n @State() showRange: boolean = false;\n @State() colorCategories: string[] | null = null;\n @State() selectedCategory: any = null;\n @State() page = 1;\n @State() colorIsSelected = false;\n @State() colorsList: Color[] = [];\n @State() hasMore = true;\n @State() filters: any = {\n type: 'product' as 'product' | 'sample' | 'number' | 'name' | 'sampleInProduct',\n id: '',\n productId: '',\n page: 1,\n colorNumber: '',\n colorName: '',\n };\n\n debouncedSearchColorsHandler: (event: CustomEvent) => void;\n\n constructor() {\n this.debouncedSearchColorsHandler = debounce(this.searchColor.bind(this), 300);\n }\n\n @Watch('chunksNum')\n setInfoBoxWidth(newValue: number) {\n this.infoBoxWidth = newValue * this.boxWidth;\n }\n\n @Watch('data')\n watchPropHandler(newValue: Product) {\n if (newValue) {\n this.filters = updateFilters(this.filters, { id: newValue.id, type: 'product' });\n this.fetchColorsData();\n }\n }\n\n private clearInterval = () => {\n this.colorTimerInterval && clearInterval(this.colorTimerInterval);\n this.colorTimerInterval = undefined;\n };\n\n private colorTimer = () => {\n if (this.currentColor && this.currentColor.id) {\n this.colorTimerInterval = setInterval(() => {\n this.currentColor?.name &&\n setDataLayer({\n event: 'ColorTimer',\n shop: this.shop,\n product: this.product,\n color: this.currentColor?.name,\n timer: '10',\n });\n }, 10000);\n } else {\n this.clearInterval();\n }\n };\n\n @Method()\n async open() {\n this.modalEl.style.display = 'block';\n }\n @Event() close: EventEmitter;\n closeModalHandler() {\n this.close.emit();\n }\n\n @Event() readyToCLose: EventEmitter;\n handleReadyToClose(value: boolean) {\n this.readyToCLose.emit({ observable: value });\n }\n\n @Listen('closeInfoBox')\n closeInfoBoxHandler() {\n this.currentColor = null;\n this.currentIndex = null;\n }\n\n @Listen('onCurrentColor')\n handleEmitColor(event: CustomEvent<Color>) {\n this.onSelectedColorEmit.emit(event.detail);\n }\n\n @Listen('addToBasket')\n addToBasketHandler(event: CustomEvent<{ id: number }>) {\n return event.detail.id;\n }\n\n private chunks = (xs: Color[], y: Color[][] = []): Color[][] => {\n return xs?.length === 0 ? y : this.chunks(xs?.slice(this.chunksNum), y.concat([xs?.slice(0, this.chunksNum)]));\n };\n\n private calculateBoxCount = () => {\n const modalWidth = this.modalEl.children && this.modalEl.children[0] && this.modalEl.children[0]?.clientWidth - this.padding;\n const boxWidth = this.boxWidth;\n\n const calc = Math.floor(modalWidth / boxWidth);\n\n const boxesCount = calc;\n\n if (!this.preloader) this.chunksNum = boxesCount;\n };\n\n private displayForMobile = () => {\n if (window.innerWidth < this.mediumBreakpoint) {\n this.boxWidth = this.boxMobileWidth;\n this.padding = this.mobilePadding;\n this.isMobile = true;\n } else {\n this.isMobile = false;\n this.boxWidth = this.boxDesktopWidth;\n this.padding = this.desktopPadding;\n }\n };\n\n @Listen('resize', { target: 'window' })\n handleResize() {\n this.calculateBoxCount();\n this.displayForMobile();\n }\n\n private sortColorsBySimilarity(colors: Color[]): Color[] {\n if (colors?.length <= 1) return colors;\n\n const sortedColors: Color[] = [];\n const remainingColors = [...colors];\n\n // Start with the first color\n sortedColors.push(remainingColors.shift()!);\n\n while (remainingColors?.length > 0) {\n // Find the most similar color to the last color in sortedColors\n const lastColor = sortedColors[sortedColors?.length - 1];\n let mostSimilarIndex = 0;\n let minDistance = Infinity;\n\n remainingColors.forEach((color, index) => {\n try {\n // Validate hex colors before calculating distance\n if (!color.hex || !lastColor.hex) {\n return;\n }\n\n const distance = chroma.distance(lastColor.hex, color.hex, 'lab');\n if (distance < minDistance) {\n minDistance = distance;\n mostSimilarIndex = index;\n }\n } catch (error) {\n console.warn(`Error calculating color distance for ${color.hex}:`, error);\n // Skip this color if it causes an error\n }\n });\n\n // Move the most similar color to sortedColors\n sortedColors.push(remainingColors.splice(mostSimilarIndex, 1)[0]);\n }\n\n return sortedColors;\n }\n\n private getColorHueGroup(hex: string): string {\n try {\n // Validate hex format and handle invalid colors\n if (!hex || typeof hex !== 'string') {\n return 'other';\n }\n\n // Basic hex validation\n const cleanHex = hex.startsWith('#') ? hex : `#${hex}`;\n if (!/^#[0-9A-Fa-f]{6}$/.test(cleanHex)) {\n console.warn(`Invalid hex color format: ${hex}`);\n return 'other';\n }\n\n const color = chroma(cleanHex);\n const hue = color.get('hsl.h');\n const saturation = color.get('hsl.s');\n const lightness = color.get('hsl.l');\n\n // Handle grayscale colors\n if (saturation < 0.1) {\n if (lightness < 0.2) return 'black';\n if (lightness > 0.8) return 'white';\n return 'gray';\n }\n\n // Group colors by hue ranges\n if (hue >= 330 || hue < 30) return 'red';\n if (hue >= 30 && hue < 90) return 'yellow';\n if (hue >= 90 && hue < 150) return 'green';\n if (hue >= 150 && hue < 210) return 'cyan';\n if (hue >= 210 && hue < 270) return 'blue';\n if (hue >= 270 && hue < 330) return 'magenta';\n\n return 'other';\n } catch (error) {\n console.warn(`Error parsing color \"${hex}\":`, error);\n return 'other';\n }\n }\n\n private sortColorsByHueAndSimilarity(colors: Color[]): Color[] {\n if (colors?.length <= 1) return colors;\n\n // Filter out colors with invalid hex values\n const validColors = colors.filter(color => {\n if (!color.hex || typeof color.hex !== 'string') {\n console.warn(`Color missing hex value:`, color);\n return false;\n }\n\n const cleanHex = color.hex.startsWith('#') ? color.hex : `#${color.hex}`;\n const isValid = /^#[0-9A-Fa-f]{6}$/.test(cleanHex);\n\n if (!isValid) {\n console.warn(`Invalid hex color format: ${color.hex} for color:`, color);\n }\n\n return isValid;\n });\n\n // Group valid colors by their hue family\n const colorGroups: Record<string, Color[]> = {\n red: [],\n yellow: [],\n green: [],\n cyan: [],\n blue: [],\n magenta: [],\n gray: [],\n black: [],\n white: [],\n other: [],\n };\n\n validColors.forEach(color => {\n const group = this.getColorHueGroup(color.hex);\n colorGroups[group].push(color);\n });\n\n // Sort each group by similarity\n const sortedGroups: Color[][] = [];\n const groupOrder = ['red', 'magenta', 'blue', 'cyan', 'green', 'yellow', 'gray', 'black', 'white', 'other'];\n\n groupOrder.forEach(groupName => {\n if (colorGroups[groupName].length > 0) {\n sortedGroups.push(this.sortColorsBySimilarity(colorGroups[groupName]));\n }\n });\n\n // Combine all sorted groups\n return sortedGroups.flat();\n }\n\n private async fetchColorsData({ reset = false } = {}) {\n if (this.loading && !reset) return;\n this.loading = true;\n\n try {\n const colors = await fetchColors(this.filters);\n\n if (reset) {\n // For new searches, sort all colors by hue and similarity\n this.colorsList = this.sortColorsByHueAndSimilarity(colors);\n } else {\n // For pagination, combine and sort all colors\n this.colorsList = this.sortColorsByHueAndSimilarity([...this.colorsList, ...colors]);\n }\n\n this.hasMore = colors.length >= limit;\n } catch (error) {\n console.error('Error fetching colors:', error);\n } finally {\n this.loading = false;\n }\n }\n\n private async loadProductData() {\n this.preloader = true;\n\n const product = await fetchProductData({ shopName: this.shop, productName: this.product });\n\n if (product) {\n this.data = product;\n this.filters = updateFilters(this.filters, { type: 'product', id: product.id });\n\n // Fetch initial colors\n await this.fetchColorsData();\n }\n\n this.preloader = false;\n }\n\n private async loadMoreColors() {\n if (this.loading || !this.hasMore) return; // Prevent spam loading\n\n this.filters = { ...this.filters, page: this.filters.page + 1 }; // Increase page for lazy loading\n\n await this.fetchColorsData({ reset: false }); // Append results\n }\n\n private updateFilterAndFetch(newFilters: Partial<typeof this.filters>) {\n if (!this.data?.id) return;\n\n this.loading = true;\n\n this.filters = updateFilters(this.filters, {\n id: this.data.id,\n sampleId: this.filters.sampleId,\n colorName: this.filters.colorName,\n ...newFilters,\n page: 1,\n });\n\n this.fetchColorsData({ reset: true }).finally(() => {\n this.loading = false;\n });\n }\n\n async searchColor(event: CustomEvent) {\n const query = event.detail?.trim();\n\n this.updateFilterAndFetch({ colorName: query });\n }\n\n @Listen('colorFamilySelected')\n handleColorFamilySelected(event: CustomEvent) {\n this.currentColor = null;\n if (event.detail === this.filters.colorFamily) {\n this.filters = updateFilters(this.filters, { colorFamily: '' });\n this.updateFilterAndFetch({ colorFamily: '' });\n } else {\n this.filters = updateFilters(this.filters, { colorFamily: event.detail });\n this.updateFilterAndFetch({ colorFamily: event.detail });\n }\n }\n\n @Listen('searchColors')\n searchColorsHandler(event: CustomEvent) {\n this.loading = true;\n this.currentColor = null;\n this.debouncedSearchColorsHandler(event);\n }\n\n private handleSampleSelect = (selectedSample?: any) => {\n this.currentColor = null;\n this.selectedCategory = selectedSample.value;\n\n this.updateFilterAndFetch({ sampleId: selectedSample.value, colorFamily: '' });\n };\n\n handleScroll(_event: Event, modalContent: HTMLElement) {\n if (this.loading || !this.hasMore) return;\n\n const scrollTop = modalContent.scrollTop;\n const scrollHeight = modalContent.scrollHeight;\n const clientHeight = modalContent.clientHeight;\n\n // Check if user scrolled to the bottom of the modal\n if (scrollTop + clientHeight >= scrollHeight - 50) {\n this.loadMoreColors();\n }\n }\n\n private openSeletedColor() {\n if (!this.colorsList || !this.selectedcolor) return;\n\n if (!this.colorIsSelected) {\n const result = this.chunks(this.colorsList)\n .map((innerArray, arrayIndex) => {\n const foundColor = innerArray.find(color => color.name.trim()?.toUpperCase() === this.selectedcolor?.trim()?.toUpperCase());\n\n return foundColor ? { color: foundColor, index: arrayIndex } : null;\n })\n .filter(item => item !== null);\n\n this.currentColor = result[0]?.color as any;\n this.currentIndex = result[0]?.index as any;\n this.colorIsSelected = true;\n }\n }\n\n componentWillLoad() {\n this.preloader = true;\n setDataLayer({\n shop: this.shop,\n product: this.product,\n });\n\n this.loadProductData();\n }\n\n componentWillRender() {\n this.displayForMobile();\n this.calculateBoxCount();\n this.colorTimer();\n this.openSeletedColor();\n\n const modalContent = this.modalEl.querySelector('.my-modal') as HTMLElement;\n if (modalContent) {\n modalContent.addEventListener('scroll', event => this.handleScroll(event, modalContent));\n }\n }\n\n private resetColors() {\n this.currentColor = null;\n this.currentIndex = null;\n this.colorIsSelected = false;\n }\n\n private resetAllFilters() {\n // Reset current color selection\n this.resetColors();\n\n // Reset filters to initial state\n this.filters = {\n type: 'product',\n id: this.data?.id || '',\n productId: '',\n page: 1,\n colorNumber: '',\n colorName: '',\n colorFamily: '',\n sampleId: '',\n };\n\n // Reset selected category\n this.selectedCategory = null;\n\n // Clear search text\n this.clearSearchText.emit();\n\n // Fetch colors with reset filters\n this.fetchColorsData({ reset: true });\n }\n\n private resetSelectedCategory() {\n this.resetColors();\n this.colorIsSelected = false;\n this.selectedCategory = null;\n this.filters = updateFilters(this.filters, { sampleId: '' });\n this.fetchColorsData({ reset: true });\n }\n\n render() {\n return (\n <div class={`my-modal`} onMouseEnter={() => this.handleReadyToClose(false)} onMouseLeave={() => this.handleReadyToClose(true)}>\n {this.preloader && (\n <div class={'loader'}>\n <my-loader></my-loader>\n </div>\n )}\n {!this.preloader && this.data && (\n <modal-header\n modalName={this.data.modalName}\n modalLogo={this.data.modalLogo ? `${APIURL}/assets/${this.data.modalLogo}?access_token=${accessToken}` : null}\n modalDescription={this.data.modalDescription}\n shop={this.shop}\n productName={this.data.name}\n productSamples={this.data.productSamples}\n selectedColorFamily={this.filters.colorFamily}\n isMobile={this.isMobile}\n onCloseModal={() => this.closeModalHandler()}\n onSampleSelected={event => this.handleSampleSelect(event.detail)}\n onOnLogoClick={() => this.resetAllFilters()}\n onOnResetCategory={() => this.resetSelectedCategory()}\n ></modal-header>\n )}\n\n <div class={'my-modal__wrapper'}>\n {!this.preloader && (\n <div class={'container_boxes'}>\n {!this.loading && this.colorsList.length === 0 && (\n <div class=\"not-found\">\n <p>Nie zaleziono wyników wyszukiwania pod danym hasłem.</p>\n <p> Wpisz inną nazwę bądź numer koloru lub skorzystaj z kolekcji kolorystycznych.</p>\n </div>\n )}\n {this.colorsList?.length > 0 &&\n this.chunks(this.colorsList).map((color: Color[], index: number) => {\n return (\n <div key={index} class=\"boxes\">\n <div class=\"boxes__list\">\n {color.map((c: Color) => (\n <my-colorbox\n key={c.id}\n onClick={() => {\n if (this.currentColor?.id === c.id) {\n this.currentColor = null;\n } else {\n this.currentColor = c;\n }\n this.currentIndex = index;\n setDataLayer({\n event: 'ColorClick',\n shop: this.shop,\n product: this.product,\n color: c.name,\n });\n this.clearInterval();\n }}\n color={c.hex}\n name={c.name}\n isActive={this.currentColor?.id === c.id}\n shop={this.shop}\n product={this.product}\n isImageInsteadHex={{\n isImageInsteadHex: c.imageInsteadHex,\n bigImage: c.bigImage,\n }}\n ></my-colorbox>\n ))}\n </div>\n\n {this.currentColor?.id && index === this.currentIndex && (\n <my-colorinfo\n currentColor={this.currentColor}\n shop={this.shop}\n product={this.product}\n data={this.data}\n isMobile={this.isMobile}\n infoBoxWidth={this.infoBoxWidth}\n baselink={this.baselink}\n availableTesters={this.available_testers?.find(\n (tester: AvailableTester) => tester.color_name?.trim().toLowerCase() === this.currentColor?.name?.trim().toLowerCase(),\n )}\n price={this.price}\n ></my-colorinfo>\n )}\n </div>\n );\n })}\n </div>\n )}\n {this.loading && <my-loader></my-loader>}\n </div>\n {!this.preloader && this.isMobile && (\n <button class=\"button\" onClick={() => this.closeModalHandler()}>\n Zamknij\n </button>\n )}\n </div>\n );\n }\n}\n"]}
@@ -16,6 +16,11 @@
16
16
  font-family: "Poppins", sans-serif;
17
17
  }
18
18
 
19
+ :host {
20
+ --swiper-theme-color: #007aff;
21
+ --swiper-navigation-size: 44px;
22
+ }
23
+
19
24
  .slider-wrapper {
20
25
  width: 100%;
21
26
  position: relative;
@@ -42,7 +47,7 @@
42
47
  }
43
48
  .slider-wrapper .mySwiper2 {
44
49
  height: 100%;
45
- width: 80%;
50
+ width: 100%;
46
51
  position: relative;
47
52
  }
48
53
  @media (max-width: 1024px) {
@@ -62,13 +67,26 @@
62
67
  }
63
68
  .slider-wrapper .mySwiper2 .swiper-button-prev::after,
64
69
  .slider-wrapper .mySwiper2 .swiper-button-next::after {
65
- font-size: 11px;
66
- color: #232323;
67
- font-weight: bold;
70
+ content: "" !important;
71
+ font-family: initial !important;
72
+ font-size: 0 !important;
73
+ width: 8px;
74
+ height: 8px;
75
+ border-right: 2px solid #232323;
76
+ border-bottom: 2px solid #232323;
77
+ display: block;
78
+ }
79
+ .slider-wrapper .mySwiper2 .swiper-button-next {
80
+ right: 45%;
81
+ }
82
+ .slider-wrapper .mySwiper2 .swiper-button-next::after {
83
+ transform: rotate(-45deg);
68
84
  }
69
85
  .slider-wrapper .mySwiper2 .swiper-button-prev {
70
- right: 40px;
71
- left: initial;
86
+ left: 45%;
87
+ }
88
+ .slider-wrapper .mySwiper2 .swiper-button-prev::after {
89
+ transform: rotate(135deg);
72
90
  }
73
91
  .slider-wrapper .mySwiper {
74
92
  width: 20%;
@@ -18,43 +18,54 @@ export class JcSwiper {
18
18
  this.color = undefined;
19
19
  }
20
20
  initSwiper() {
21
- this.thumbs = new Swiper('.mySwiper', {
21
+ const root = this.modalEl.shadowRoot;
22
+ if (!root)
23
+ return;
24
+ const thumbsEl = root.querySelector('.mySwiper');
25
+ const sliderEl = root.querySelector('.mySwiper2');
26
+ const nextEl = root.querySelector('.swiper-button-next');
27
+ const prevEl = root.querySelector('.swiper-button-prev');
28
+ if (thumbsEl) {
29
+ this.thumbs = new Swiper(thumbsEl, {
30
+ modules: [Navigation, Controller],
31
+ slideToClickedSlide: true,
32
+ loop: true,
33
+ freeMode: true,
34
+ spaceBetween: 5,
35
+ slidesPerView: 3,
36
+ direction: 'vertical',
37
+ touchRatio: 0.2,
38
+ });
39
+ }
40
+ if (!sliderEl)
41
+ return;
42
+ this.swiper2 = new Swiper(sliderEl, {
22
43
  modules: [Navigation, Controller],
44
+ navigation: nextEl && prevEl ? { nextEl, prevEl } : undefined,
23
45
  slideToClickedSlide: true,
24
46
  loop: true,
25
47
  freeMode: true,
26
- spaceBetween: 5,
27
- slidesPerView: 3,
28
- direction: 'vertical',
29
- touchRatio: 0.2,
30
- });
31
- this.swiper2 = new Swiper('.mySwiper2', {
32
- modules: [Navigation, Controller],
33
- navigation: {
34
- nextEl: '.swiper-button-next',
35
- prevEl: '.swiper-button-prev',
36
- },
37
- loop: true,
38
- loopedSlides: 3,
48
+ slidesPerView: 1,
39
49
  });
40
- this.swiper2.controller.control = this.thumbs;
41
- this.thumbs.controller.control = this.swiper2;
50
+ if (this.swiper2) {
51
+ this.swiper2.controller.control = this.swiper2;
52
+ }
42
53
  }
43
54
  componentDidLoad() {
44
55
  this.initSwiper();
45
56
  }
46
57
  update() {
47
- this.thumbs.update();
48
- this.swiper2.update();
58
+ var _a, _b;
59
+ (_a = this.thumbs) === null || _a === void 0 ? void 0 : _a.update();
60
+ (_b = this.swiper2) === null || _b === void 0 ? void 0 : _b.update();
49
61
  }
50
62
  render() {
51
63
  return (h("div", { class: "slider-wrapper" }, h("div", { class: "swiper mySwiper2" }, h("div", { class: "swiper-wrapper" }, this.slides &&
52
64
  this.slides.length > 0 &&
53
- this.slides.map((slide) => (h("div", { key: slide.id, class: "swiper-slide" }, h("img", { src: `${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`, alt: "room_image" }))))), this.slides && this.slides.length >= 2 && (h("div", null, h("div", { onClick: this.colorInteraction, class: "swiper-button-next" }), h("div", { onClick: this.colorInteraction, class: "swiper-button-prev" })))), h("div", { class: "swiper mySwiper" }, h("div", { class: "swiper-wrapper" }, this.slides &&
54
- this.slides.length > 0 &&
55
- this.slides.map((slide) => (h("div", { key: slide.id, class: "swiper-slide" }, h("img", { src: `${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`, alt: "room_image" }))))))));
65
+ this.slides.map((slide) => (h("div", { key: slide.id, class: "swiper-slide" }, h("img", { src: `${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`, alt: "room_image" }))))), this.slides && this.slides.length >= 2 && (h("div", null, h("div", { onClick: this.colorInteraction, class: "swiper-button-next" }), h("div", { onClick: this.colorInteraction, class: "swiper-button-prev" }))))));
56
66
  }
57
67
  static get is() { return "my-slider"; }
68
+ static get encapsulation() { return "shadow"; }
58
69
  static get originalStyleUrls() {
59
70
  return {
60
71
  "$": ["index.scss"]
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/slider/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, h } from '@stencil/core';\nimport Swiper, { Navigation, Controller } from 'swiper';\nimport { setDataLayer } from '../../gtmUtils';\nimport { Image } from '../../types';\nimport { APIURL, accessToken } from '../api';\n\n@Component({\n tag: 'my-slider',\n styleUrl: 'index.scss',\n})\nexport class JcSwiper {\n @Element() modalEl: HTMLElement;\n @Prop() slides: Image[];\n @Prop() shop: string;\n @Prop() product: string;\n @Prop() color: string;\n\n private thumbs: any;\n private swiper2: any;\n\n initSwiper() {\n this.thumbs = new Swiper('.mySwiper', {\n modules: [Navigation, Controller],\n slideToClickedSlide: true,\n loop: true,\n freeMode: true,\n spaceBetween: 5,\n slidesPerView: 3,\n direction: 'vertical',\n touchRatio: 0.2,\n });\n\n this.swiper2 = new Swiper('.mySwiper2', {\n modules: [Navigation, Controller],\n navigation: {\n nextEl: '.swiper-button-next',\n prevEl: '.swiper-button-prev',\n },\n loop: true,\n loopedSlides: 3,\n });\n\n this.swiper2.controller.control = this.thumbs;\n this.thumbs.controller.control = this.swiper2;\n }\n\n componentDidLoad() {\n this.initSwiper();\n }\n\n update() {\n this.thumbs.update();\n this.swiper2.update();\n }\n\n colorInteraction = () => {\n setDataLayer({\n event: 'ColorInteraction',\n shop: this.shop,\n product: this.product,\n color: this.color,\n });\n };\n\n render() {\n return (\n <div class=\"slider-wrapper\">\n <div class=\"swiper mySwiper2\">\n <div class=\"swiper-wrapper\">\n {this.slides &&\n this.slides.length > 0 &&\n this.slides.map((slide: Image) => (\n <div key={slide.id} class=\"swiper-slide\">\n <img src={`${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`} alt=\"room_image\" />\n </div>\n ))}\n </div>\n {this.slides && this.slides.length >= 2 && (\n <div>\n <div onClick={this.colorInteraction} class=\"swiper-button-next\"></div>\n <div onClick={this.colorInteraction} class=\"swiper-button-prev\"></div>\n </div>\n )}\n </div>\n <div class=\"swiper mySwiper\">\n <div class=\"swiper-wrapper\">\n {this.slides &&\n this.slides.length > 0 &&\n this.slides.map((slide: Image) => (\n <div key={slide.id} class=\"swiper-slide\">\n <img src={`${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`} alt=\"room_image\" />\n </div>\n ))}\n </div>\n </div>\n </div>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/slider/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAC5D,OAAO,MAAM,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AAO7C,MAAM,OAAO,QAAQ;;IA0DnB,qBAAgB,GAAG,GAAG,EAAE;MACtB,YAAY,CAAC;QACX,KAAK,EAAE,kBAAkB;QACzB,IAAI,EAAE,IAAI,CAAC,IAAI;QACf,OAAO,EAAE,IAAI,CAAC,OAAO;QACrB,KAAK,EAAE,IAAI,CAAC,KAAK;OAClB,CAAC,CAAC;IACL,CAAC,CAAC;;;;;;EAvDF,UAAU;IACR,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC;IACrC,IAAI,CAAC,IAAI;MAAE,OAAO;IAElB,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW,CAAuB,CAAC;IACvE,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,YAAY,CAAuB,CAAC;IACxE,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAuB,CAAC;IAC/E,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAuB,CAAC;IAE/E,IAAI,QAAQ,EAAE;MACZ,IAAI,CAAC,MAAM,GAAG,IAAI,MAAM,CAAC,QAAQ,EAAE;QACjC,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC;QACjC,mBAAmB,EAAE,IAAI;QACzB,IAAI,EAAE,IAAI;QACV,QAAQ,EAAE,IAAI;QACd,YAAY,EAAE,CAAC;QACf,aAAa,EAAE,CAAC;QAChB,SAAS,EAAE,UAAU;QACrB,UAAU,EAAE,GAAG;OAChB,CAAC,CAAC;KACJ;IAED,IAAI,CAAC,QAAQ;MAAE,OAAO;IAEtB,IAAI,CAAC,OAAO,GAAG,IAAI,MAAM,CAAC,QAAQ,EAAE;MAClC,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,CAAC;MACjC,UAAU,EAAE,MAAM,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS;MAC7D,mBAAmB,EAAE,IAAI;MACzB,IAAI,EAAE,IAAI;MACV,QAAQ,EAAE,IAAI;MAEd,aAAa,EAAE,CAAC;KACjB,CAAC,CAAC;IAEH,IAAI,IAAI,CAAC,OAAO,EAAE;MAChB,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;KAChD;EACH,CAAC;EAED,gBAAgB;IACd,IAAI,CAAC,UAAU,EAAE,CAAC;EACpB,CAAC;EAED,MAAM;;IACJ,MAAA,IAAI,CAAC,MAAM,0CAAE,MAAM,EAAE,CAAC;IACtB,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,EAAE,CAAC;EACzB,CAAC;EAWD,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAC,gBAAgB;MACzB,WAAK,KAAK,EAAC,kBAAkB;QAC3B,WAAK,KAAK,EAAC,gBAAgB,IACxB,IAAI,CAAC,MAAM;UACV,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC;UACtB,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAY,EAAE,EAAE,CAAC,CAChC,WAAK,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,KAAK,EAAC,cAAc;YACtC,WAAK,GAAG,EAAE,GAAG,MAAM,WAAW,KAAK,CAAC,iBAAiB,iBAAiB,WAAW,EAAE,EAAE,GAAG,EAAC,YAAY,GAAG,CACpG,CACP,CAAC,CACA;QACL,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,IAAI,CACzC;UACE,WAAK,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAC,oBAAoB,GAAO;UACtE,WAAK,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAAE,KAAK,EAAC,oBAAoB,GAAO,CAClE,CACP,CACG,CAYF,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, Element, h } from '@stencil/core';\nimport Swiper, { Navigation, Controller } from 'swiper';\nimport { setDataLayer } from '../../gtmUtils';\nimport { Image } from '../../types';\nimport { APIURL, accessToken } from '../api';\n\n@Component({\n tag: 'my-slider',\n styleUrl: 'index.scss',\n shadow: true,\n})\nexport class JcSwiper {\n @Element() modalEl: HTMLElement;\n @Prop() slides: Image[];\n @Prop() shop: string;\n @Prop() product: string;\n @Prop() color: string;\n\n private thumbs: any;\n private swiper2: any;\n\n initSwiper() {\n const root = this.modalEl.shadowRoot;\n if (!root) return;\n\n const thumbsEl = root.querySelector('.mySwiper') as HTMLElement | null;\n const sliderEl = root.querySelector('.mySwiper2') as HTMLElement | null;\n const nextEl = root.querySelector('.swiper-button-next') as HTMLElement | null;\n const prevEl = root.querySelector('.swiper-button-prev') as HTMLElement | null;\n\n if (thumbsEl) {\n this.thumbs = new Swiper(thumbsEl, {\n modules: [Navigation, Controller],\n slideToClickedSlide: true,\n loop: true,\n freeMode: true,\n spaceBetween: 5,\n slidesPerView: 3,\n direction: 'vertical',\n touchRatio: 0.2,\n });\n }\n\n if (!sliderEl) return;\n\n this.swiper2 = new Swiper(sliderEl, {\n modules: [Navigation, Controller],\n navigation: nextEl && prevEl ? { nextEl, prevEl } : undefined,\n slideToClickedSlide: true,\n loop: true,\n freeMode: true,\n\n slidesPerView: 1,\n });\n\n if (this.swiper2) {\n this.swiper2.controller.control = this.swiper2;\n }\n }\n\n componentDidLoad() {\n this.initSwiper();\n }\n\n update() {\n this.thumbs?.update();\n this.swiper2?.update();\n }\n\n colorInteraction = () => {\n setDataLayer({\n event: 'ColorInteraction',\n shop: this.shop,\n product: this.product,\n color: this.color,\n });\n };\n\n render() {\n return (\n <div class=\"slider-wrapper\">\n <div class=\"swiper mySwiper2\">\n <div class=\"swiper-wrapper\">\n {this.slides &&\n this.slides.length > 0 &&\n this.slides.map((slide: Image) => (\n <div key={slide.id} class=\"swiper-slide\">\n <img src={`${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`} alt=\"room_image\" />\n </div>\n ))}\n </div>\n {this.slides && this.slides.length >= 2 && (\n <div>\n <div onClick={this.colorInteraction} class=\"swiper-button-next\"></div>\n <div onClick={this.colorInteraction} class=\"swiper-button-prev\"></div>\n </div>\n )}\n </div>\n {/* <div class=\"swiper mySwiper\">\n <div class=\"swiper-wrapper\">\n {this.slides &&\n this.slides.length > 0 &&\n this.slides.map((slide: Image) => (\n <div key={slide.id} class=\"swiper-slide\">\n <img src={`${APIURL}/assets/${slide.directus_files_id}?access_token=${accessToken}`} alt=\"room_image\" />\n </div>\n ))}\n </div>\n </div> */}\n </div>\n );\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"","sourcesContent":["export type Shop = {\n name: string;\n date_created: string;\n date_updated: string;\n id: number;\n products: number[];\n sort: null;\n status: string;\n};\n\nexport type ProductShopRelation = {\n Product_id: number;\n Shop_id: number;\n id: number;\n};\n\nexport type ProductCategoryRelation = {\n Category_id: Category;\n Product_id: Product;\n id: number;\n imageInsteadHex?: boolean;\n bigImage?: string;\n};\n\nexport type Color = {\n hex: string;\n image: Record<string, Image>;\n links: Link[];\n name: string;\n position: number;\n buttonInverse: boolean;\n textWhite: boolean;\n id?: number;\n category?: Partial<Color>;\n number?: string;\n Category_id: Color;\n imageInsteadHex: boolean;\n bigImage: string;\n};\n\nexport type Category = {\n category_name: string;\n hex: string;\n id: number;\n name: string;\n};\n\nexport type Product = {\n colors?: Color[];\n modalDescription: string;\n modalLogo: string;\n modalName: string;\n name: string;\n Shop: ProductShopRelation[];\n useColorImage: boolean;\n images: any;\n id?: string;\n Category: ProductCategoryRelation[];\n productSamples: any[];\n};\n\nexport type Image = {\n id: number;\n directus_files_id: string;\n};\n\nexport type Link = {\n id: number;\n path: string;\n shop: string;\n};\n\nexport type ColorBoxyIsImageInsteadHex = {\n isImageInsteadHex: boolean;\n bigImage: string;\n};\n"]}
1
+ {"version":3,"file":"types.js","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"","sourcesContent":["export type Shop = {\n name: string;\n date_created: string;\n date_updated: string;\n id: number;\n products: number[];\n sort: null;\n status: string;\n};\n\nexport type ProductShopRelation = {\n Product_id: number;\n Shop_id: number;\n id: number;\n};\n\nexport type ProductCategoryRelation = {\n Category_id: Category;\n Product_id: Product;\n id: number;\n imageInsteadHex?: boolean;\n bigImage?: string;\n};\n\nexport type Color = {\n hex: string;\n image: Record<string, Image>;\n links: Link[];\n name: string;\n position: number;\n buttonInverse: boolean;\n textWhite: boolean;\n id?: number;\n category?: Partial<Color>;\n number?: string;\n Category_id: Color;\n imageInsteadHex: boolean;\n bigImage: string;\n};\n\nexport type Category = {\n category_name: string;\n hex: string;\n id: number;\n name: string;\n};\n\nexport type Product = {\n colors?: Color[];\n modalDescription: string;\n modalLogo: string;\n modalName: string;\n name: string;\n Shop: ProductShopRelation[];\n useColorImage: boolean;\n images: any;\n id?: string;\n Category: ProductCategoryRelation[];\n productSamples: any[];\n};\n\nexport type Image = {\n id: number;\n directus_files_id: string;\n};\n\nexport type Link = {\n id: number;\n path: string;\n shop: string;\n};\n\nexport type ColorBoxyIsImageInsteadHex = {\n isImageInsteadHex: boolean;\n bigImage: string;\n};\n\nexport type AvailableTester = {\n id_product_attribute: number;\n color_name: string;\n};\n"]}