@salla.sa/twilight-components 2.14.272 → 2.14.273
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{filepond-EG2Mf8a1.js → filepond-B6LUaQ9F.js} +1 -1
- package/dist/cjs/{filepond-plugin-file-poster-DjNsnxTw.js → filepond-plugin-file-poster-DlB67Vv3.js} +1 -1
- package/dist/cjs/{filepond-plugin-file-validate-size-BlM1btNO.js → filepond-plugin-file-validate-size-D7kuqaEC.js} +1 -1
- package/dist/cjs/{filepond-plugin-file-validate-type-DhymSoh9.js → filepond-plugin-file-validate-type-CliXp1Qt.js} +1 -1
- package/dist/cjs/{filepond-plugin-image-edit-BQfvfpQ1.js → filepond-plugin-image-edit-BRIZbIyN.js} +1 -1
- package/dist/cjs/{filepond-plugin-image-exif-orientation-DOi06s13.js → filepond-plugin-image-exif-orientation-bFbWHyQs.js} +1 -1
- package/dist/cjs/{filepond-plugin-image-preview-Rfix7Xbt.js → filepond-plugin-image-preview-24nxaVX6.js} +1 -1
- package/dist/cjs/{index-DS7mXxWq.js → index-BpUrZ_-D.js} +136 -26
- package/dist/cjs/{index-vIV5iX-W.js → index-xI-pRoDr.js} +1 -1
- package/dist/cjs/loader.cjs.js +3 -4
- package/dist/cjs/{salla-add-product-button_51.cjs.entry.js → salla-accordion_62.cjs.entry.js} +2104 -120
- package/dist/cjs/salla-advertisement.cjs.entry.js +1 -1
- package/dist/cjs/salla-app-install-alert.cjs.entry.js +1 -1
- package/dist/cjs/salla-apps-icons.cjs.entry.js +1 -1
- package/dist/cjs/salla-cart-item-offers.cjs.entry.js +1 -1
- package/dist/cjs/salla-conditional-offer.cjs.entry.js +1 -1
- package/dist/cjs/salla-contacts.cjs.entry.js +1 -1
- package/dist/cjs/salla-filters-widget.cjs.entry.js +1 -1
- package/dist/cjs/salla-filters.cjs.entry.js +1 -1
- package/dist/cjs/salla-installment.cjs.entry.js +1 -1
- package/dist/cjs/salla-loyalty-prize-item.cjs.entry.js +1 -1
- package/dist/cjs/salla-loyalty-program.cjs.entry.js +1 -1
- package/dist/cjs/salla-metadata.cjs.entry.js +1 -1
- package/dist/cjs/salla-notification-item.cjs.entry.js +2 -2
- package/dist/cjs/salla-notifications.cjs.entry.js +1 -1
- package/dist/cjs/salla-offer.cjs.entry.js +1 -1
- package/dist/cjs/salla-order-details-multiple-bundle-product.cjs.entry.js +1 -1
- package/dist/cjs/{salla-accordion_4.cjs.entry.js → salla-order-details-options.cjs.entry.js} +1 -100
- package/dist/cjs/salla-order-details.cjs.entry.js +2 -2
- package/dist/cjs/salla-order-summary.cjs.entry.js +2 -2
- package/dist/cjs/salla-orders.cjs.entry.js +1 -1
- package/dist/cjs/salla-payments.cjs.entry.js +3 -3
- package/dist/cjs/salla-price-range.cjs.entry.js +3 -3
- package/dist/cjs/salla-review-card.cjs.entry.js +2 -2
- package/dist/cjs/salla-reviews-page.cjs.entry.js +2 -2
- package/dist/cjs/salla-reviews.cjs.entry.js +2 -2
- package/dist/cjs/salla-social.cjs.entry.js +2 -2
- package/dist/cjs/salla-tiered-offer.cjs.entry.js +1 -1
- package/dist/cjs/salla-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/salla-verify.cjs.entry.js +1 -1
- package/dist/cjs/salla-wallet.cjs.entry.js +1 -1
- package/dist/cjs/twilight.cjs.js +3 -4
- package/dist/collection/collection-manifest.json +5 -0
- package/dist/collection/components/salla-accordion/salla-accordion-head.js +8 -2
- package/dist/collection/components/salla-comments/salla-comments.js +20 -1
- package/dist/collection/components/salla-conditional-fields/salla-conditional-fields.js +33 -5
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-cart.css +0 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-cart.js +89 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-details.css +0 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-details.js +195 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-options-modal.css +3 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-options-modal.js +595 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-slider.css +0 -0
- package/dist/collection/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-slider.js +174 -0
- package/dist/collection/components/salla-multiple-bundle-product/interfaces.js +1 -0
- package/dist/collection/components/salla-multiple-bundle-product/salla-multiple-bundle-product.css +3 -0
- package/dist/collection/components/salla-multiple-bundle-product/salla-multiple-bundle-product.js +132 -0
- package/dist/collection/components/salla-notifications/salla-notification-item.js +1 -1
- package/dist/collection/components/salla-offer-modal/salla-offer-modal.js +1 -1
- package/dist/collection/components/salla-order-details/salla-order-details.js +1 -1
- package/dist/collection/components/salla-order-summary/salla-order-summary.js +1 -1
- package/dist/collection/components/salla-payments/salla-payments.js +2 -2
- package/dist/collection/components/salla-placeholder/salla-placeholder.js +1 -1
- package/dist/collection/components/salla-price-range/salla-price-range.js +2 -2
- package/dist/collection/components/salla-product-availability/salla-product-availability.js +1 -1
- package/dist/collection/components/salla-product-card/salla-product-card.js +5 -5
- package/dist/collection/components/salla-product-options/salla-product-options.js +105 -22
- package/dist/collection/components/salla-product-size-guide/salla-product-size-guide.js +2 -2
- package/dist/collection/components/salla-quantity-input/salla-quantity-input.js +1 -1
- package/dist/collection/components/salla-quick-buy/salla-quick-buy.js +1 -1
- package/dist/collection/components/salla-review-card/salla-review-card.js +1 -1
- package/dist/collection/components/salla-reviews/salla-reviews.js +1 -1
- package/dist/collection/components/salla-reviews-page/salla-reviews-page.js +1 -1
- package/dist/collection/components/salla-scopes/salla-scopes.js +1 -1
- package/dist/collection/components/salla-search/salla-search.js +3 -3
- package/dist/collection/components/salla-skeleton/salla-skeleton.js +1 -1
- package/dist/collection/components/salla-slider/salla-slider.js +2 -2
- package/dist/collection/components/salla-social/salla-social.js +1 -1
- package/dist/collection/components/salla-social-share/salla-social-share.js +1 -1
- package/dist/collection/components/salla-tabs/salla-tab-content.js +1 -1
- package/dist/collection/components/salla-tabs/salla-tab-header.js +1 -1
- package/dist/collection/components/salla-tabs/salla-tabs.js +1 -1
- package/dist/collection/components/salla-tel-input/salla-tel-input.js +1 -1
- package/dist/collection/components/salla-tooltip/salla-tooltip.js +1 -1
- package/dist/collection/components/salla-user-settings/salla-user-settings.js +1 -1
- package/dist/components/index.js +2 -2
- package/dist/components/salla-accordion-head2.js +2 -2
- package/dist/components/salla-comments.js +20 -1
- package/dist/components/salla-conditional-fields2.js +28 -6
- package/dist/components/salla-multiple-bundle-product-cart.d.ts +11 -0
- package/dist/components/salla-multiple-bundle-product-cart.js +9 -0
- package/dist/components/salla-multiple-bundle-product-cart2.js +153 -0
- package/dist/components/salla-multiple-bundle-product-details.d.ts +11 -0
- package/dist/components/salla-multiple-bundle-product-details.js +9 -0
- package/dist/components/salla-multiple-bundle-product-details2.js +283 -0
- package/dist/components/salla-multiple-bundle-product-options-modal.d.ts +11 -0
- package/dist/components/salla-multiple-bundle-product-options-modal.js +9 -0
- package/dist/components/salla-multiple-bundle-product-options-modal2.js +585 -0
- package/dist/components/salla-multiple-bundle-product-slider.d.ts +11 -0
- package/dist/components/salla-multiple-bundle-product-slider.js +9 -0
- package/dist/components/salla-multiple-bundle-product-slider2.js +81 -0
- package/dist/components/salla-multiple-bundle-product.d.ts +11 -0
- package/dist/components/salla-multiple-bundle-product.js +210 -0
- package/dist/components/salla-notification-item2.js +1 -1
- package/dist/components/salla-offer-modal.js +1 -1
- package/dist/components/salla-order-details.js +1 -1
- package/dist/components/salla-order-summary.js +1 -1
- package/dist/components/salla-payments.js +2 -2
- package/dist/components/salla-placeholder2.js +1 -1
- package/dist/components/salla-price-range2.js +2 -2
- package/dist/components/salla-product-availability2.js +1 -1
- package/dist/components/salla-product-card2.js +5 -5
- package/dist/components/salla-product-options.js +1 -810
- package/dist/{esm/salla-product-options.entry.js → components/salla-product-options2.js} +197 -30
- package/dist/components/salla-product-size-guide.js +2 -2
- package/dist/components/salla-quantity-input.js +1 -1
- package/dist/components/salla-quick-buy2.js +1 -1
- package/dist/components/salla-review-card2.js +1 -1
- package/dist/components/salla-reviews-page.js +1 -1
- package/dist/components/salla-reviews.js +1 -1
- package/dist/components/salla-scopes.js +1 -1
- package/dist/components/salla-search.js +3 -3
- package/dist/components/salla-skeleton2.js +1 -1
- package/dist/components/salla-slider2.js +2 -2
- package/dist/components/salla-social-share.js +1 -1
- package/dist/components/salla-social.js +1 -1
- package/dist/components/salla-tab-content2.js +1 -1
- package/dist/components/salla-tab-header2.js +1 -1
- package/dist/components/salla-tabs2.js +1 -1
- package/dist/components/salla-tel-input2.js +1 -1
- package/dist/components/salla-tooltip2.js +1 -1
- package/dist/components/salla-user-settings.js +1 -1
- package/dist/esm/{filepond-DbR8YXoW.js → filepond-C8M-qAIs.js} +1 -1
- package/dist/esm/{filepond-plugin-file-poster-DEj3O3wZ.js → filepond-plugin-file-poster-UfHq-uvl.js} +1 -1
- package/dist/esm/{filepond-plugin-file-validate-size-DYnIp5yF.js → filepond-plugin-file-validate-size-DZ15xnJZ.js} +1 -1
- package/dist/esm/{filepond-plugin-file-validate-type-Cx_PD8SU.js → filepond-plugin-file-validate-type-CWR9opI0.js} +1 -1
- package/dist/esm/{filepond-plugin-image-edit-BwmXRkmP.js → filepond-plugin-image-edit-XbR1h-bg.js} +1 -1
- package/dist/esm/{filepond-plugin-image-exif-orientation-BtsMS4U-.js → filepond-plugin-image-exif-orientation-cSRDvvXQ.js} +1 -1
- package/dist/esm/{filepond-plugin-image-preview-DQ0c3hIt.js → filepond-plugin-image-preview-B-SvzNFg.js} +1 -1
- package/dist/esm/{index-xiIpq8fU.js → index-Q_DltBmK.js} +1 -1
- package/dist/esm/{index-D5PGwR59.js → index-gLeBNvS1.js} +136 -26
- package/dist/esm/loader.js +3 -4
- package/dist/esm/{salla-add-product-button_51.entry.js → salla-accordion_62.entry.js} +2084 -111
- package/dist/esm/salla-advertisement.entry.js +1 -1
- package/dist/esm/salla-app-install-alert.entry.js +1 -1
- package/dist/esm/salla-apps-icons.entry.js +1 -1
- package/dist/esm/salla-cart-item-offers.entry.js +1 -1
- package/dist/esm/salla-conditional-offer.entry.js +1 -1
- package/dist/esm/salla-contacts.entry.js +1 -1
- package/dist/esm/salla-filters-widget.entry.js +1 -1
- package/dist/esm/salla-filters.entry.js +1 -1
- package/dist/esm/salla-installment.entry.js +1 -1
- package/dist/esm/salla-loyalty-prize-item.entry.js +1 -1
- package/dist/esm/salla-loyalty-program.entry.js +1 -1
- package/dist/esm/salla-metadata.entry.js +1 -1
- package/dist/esm/salla-notification-item.entry.js +2 -2
- package/dist/esm/salla-notifications.entry.js +1 -1
- package/dist/esm/salla-offer.entry.js +1 -1
- package/dist/esm/salla-order-details-multiple-bundle-product.entry.js +1 -1
- package/dist/esm/{salla-accordion_4.entry.js → salla-order-details-options.entry.js} +2 -98
- package/dist/esm/salla-order-details.entry.js +2 -2
- package/dist/esm/salla-order-summary.entry.js +2 -2
- package/dist/esm/salla-orders.entry.js +1 -1
- package/dist/esm/salla-payments.entry.js +3 -3
- package/dist/esm/salla-price-range.entry.js +3 -3
- package/dist/esm/salla-review-card.entry.js +2 -2
- package/dist/esm/salla-reviews-page.entry.js +2 -2
- package/dist/esm/salla-reviews.entry.js +2 -2
- package/dist/esm/salla-social.entry.js +2 -2
- package/dist/esm/salla-tiered-offer.entry.js +1 -1
- package/dist/esm/salla-tooltip.entry.js +2 -2
- package/dist/esm/salla-verify.entry.js +1 -1
- package/dist/esm/salla-wallet.entry.js +1 -1
- package/dist/esm/twilight.js +3 -4
- package/dist/twilight/{p-4611a11b.entry.js → p-00d8544c.entry.js} +1 -1
- package/dist/twilight/{p-b40d5871.entry.js → p-06d126b6.entry.js} +1 -1
- package/dist/twilight/{p-2bf21126.entry.js → p-1cc68ef5.entry.js} +1 -1
- package/dist/twilight/{p-BsHa_73h.js → p-1ekWkYOJ.js} +1 -1
- package/dist/twilight/p-21b37923.entry.js +4 -0
- package/dist/twilight/{p-bcab2639.entry.js → p-263b9b06.entry.js} +1 -1
- package/dist/twilight/{p-8ba8efe1.entry.js → p-2787ff9f.entry.js} +1 -1
- package/dist/twilight/p-3c1484b9.entry.js +11 -0
- package/dist/twilight/{p-c15928d5.entry.js → p-5057b400.entry.js} +1 -1
- package/dist/twilight/{p-280c1f64.entry.js → p-5278b873.entry.js} +1 -1
- package/dist/twilight/{p-e3b0a71f.entry.js → p-56f7a2ba.entry.js} +1 -1
- package/dist/twilight/{p-65b1fcea.entry.js → p-697db5c6.entry.js} +1 -1
- package/dist/twilight/{p-b94ebbd9.entry.js → p-73a8296a.entry.js} +1 -1
- package/dist/twilight/{p-eae51196.entry.js → p-7603a820.entry.js} +1 -1
- package/dist/twilight/{p-56fa3b9c.entry.js → p-7c8d7ca3.entry.js} +1 -1
- package/dist/twilight/{p-e95284d7.entry.js → p-80a07063.entry.js} +1 -1
- package/dist/twilight/{p-eaad31d1.entry.js → p-82c156ab.entry.js} +1 -1
- package/dist/twilight/{p-7df916fc.entry.js → p-8380c411.entry.js} +1 -1
- package/dist/twilight/{p-a61e2b8e.entry.js → p-946e5649.entry.js} +1 -1
- package/dist/twilight/{p-f3c29342.entry.js → p-9bcd9c87.entry.js} +1 -1
- package/dist/twilight/p-9c477fdf.entry.js +4 -0
- package/dist/twilight/{p-DV_VEuIe.js → p-B-nQtFTN.js} +1 -1
- package/dist/twilight/{p-DEUne75O.js → p-BI2zk2yo.js} +1 -1
- package/dist/twilight/{p-C4wd-bXb.js → p-BRD27esZ.js} +1 -1
- package/dist/twilight/{p-Bvez5luh.js → p-CUYEEJ4c.js} +1 -1
- package/dist/twilight/{p-CH8-uKSN.js → p-DUvdNUoC.js} +1 -1
- package/dist/twilight/{p-D0ZZ4jO5.js → p-DhR67rwu.js} +1 -1
- package/dist/twilight/p-a01dd6b7.entry.js +4 -0
- package/dist/twilight/{p-9e3f55be.entry.js → p-a3e000ef.entry.js} +1 -1
- package/dist/twilight/{p-3f412ab2.entry.js → p-a6c14a64.entry.js} +1 -1
- package/dist/twilight/p-b0b79820.entry.js +4 -0
- package/dist/twilight/{p-10856491.entry.js → p-b5581886.entry.js} +1 -1
- package/dist/twilight/p-b81437f4.entry.js +4 -0
- package/dist/twilight/{p-de200512.entry.js → p-bf010154.entry.js} +1 -1
- package/dist/twilight/{p-0ffafdea.entry.js → p-c0388251.entry.js} +1 -1
- package/dist/twilight/{p-2613f6dc.entry.js → p-c9ab361e.entry.js} +1 -1
- package/dist/twilight/{p-92848d53.entry.js → p-ed85bc00.entry.js} +1 -1
- package/dist/twilight/p-f7863a58.entry.js +4 -0
- package/dist/twilight/{p-D5PGwR59.js → p-gLeBNvS1.js} +2 -2
- package/dist/twilight/{p-D5p2t_CX.js → p-j4lbZMJ0.js} +1 -1
- package/dist/twilight/twilight.esm.js +1 -1
- package/dist/types/components/salla-accordion/salla-accordion-head.d.ts +6 -0
- package/dist/types/components/salla-conditional-fields/salla-conditional-fields.d.ts +2 -0
- package/dist/types/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-cart.d.ts +10 -0
- package/dist/types/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-details.d.ts +20 -0
- package/dist/types/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-options-modal.d.ts +46 -0
- package/dist/types/components/salla-multiple-bundle-product/components/salla-multiple-bundle-product-slider.d.ts +22 -0
- package/dist/types/components/salla-multiple-bundle-product/interfaces.d.ts +101 -0
- package/dist/types/components/salla-multiple-bundle-product/salla-multiple-bundle-product.d.ts +42 -0
- package/dist/types/components/salla-product-options/salla-product-options.d.ts +21 -1
- package/dist/types/components.d.ts +298 -2
- package/package.json +5 -5
- package/dist/cjs/app-globals-OVEmNa5W.js +0 -38
- package/dist/cjs/camera-DytepEoK.js +0 -13
- package/dist/cjs/minus-CCryh1qf.js +0 -21
- package/dist/cjs/salla-booking-field_2.cjs.entry.js +0 -280
- package/dist/cjs/salla-product-options.cjs.entry.js +0 -715
- package/dist/esm/app-globals-BKgAyoNJ.js +0 -36
- package/dist/esm/camera-C6jIkM-X.js +0 -11
- package/dist/esm/minus-DfeagqF1.js +0 -18
- package/dist/esm/salla-booking-field_2.entry.js +0 -277
- package/dist/twilight/p-19c38b4a.entry.js +0 -11
- package/dist/twilight/p-8272b58f.entry.js +0 -4
- package/dist/twilight/p-989fcbb4.entry.js +0 -4
- package/dist/twilight/p-9f47b72b.entry.js +0 -4
- package/dist/twilight/p-C6jIkM-X.js +0 -4
- package/dist/twilight/p-DfeagqF1.js +0 -4
- package/dist/twilight/p-KHt1Smzh.js +0 -4
- package/dist/twilight/p-b8d41065.entry.js +0 -4
- package/dist/twilight/p-dd9695d6.entry.js +0 -4
- package/dist/twilight/p-e2ebb686.entry.js +0 -4
- package/dist/twilight/p-e30f7c20.entry.js +0 -4
- package/dist/twilight/p-fcb3e719.entry.js +0 -4
|
@@ -0,0 +1,585 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Crafted with ❤ by Salla
|
|
3
|
+
*/
|
|
4
|
+
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
5
|
+
import { d as defineCustomElement$d } from './salla-booking-field2.js';
|
|
6
|
+
import { d as defineCustomElement$c } from './salla-button2.js';
|
|
7
|
+
import { d as defineCustomElement$b } from './salla-color-picker2.js';
|
|
8
|
+
import { d as defineCustomElement$a } from './salla-conditional-fields2.js';
|
|
9
|
+
import { d as defineCustomElement$9 } from './salla-datetime-picker2.js';
|
|
10
|
+
import { d as defineCustomElement$8 } from './salla-file-upload2.js';
|
|
11
|
+
import { d as defineCustomElement$7 } from './salla-loading2.js';
|
|
12
|
+
import { d as defineCustomElement$6 } from './salla-map2.js';
|
|
13
|
+
import { d as defineCustomElement$5 } from './salla-modal2.js';
|
|
14
|
+
import { d as defineCustomElement$4 } from './salla-product-options2.js';
|
|
15
|
+
import { d as defineCustomElement$3 } from './salla-progress-bar2.js';
|
|
16
|
+
import { d as defineCustomElement$2 } from './salla-skeleton2.js';
|
|
17
|
+
import { d as defineCustomElement$1 } from './salla-slider2.js';
|
|
18
|
+
|
|
19
|
+
const sallaMultipleBundleProductOptionsModalCss = ":host{display:block}";
|
|
20
|
+
|
|
21
|
+
const SallaMultipleBundleProductOptionsModal = /*@__PURE__*/ proxyCustomElement(class SallaMultipleBundleProductOptionsModal extends HTMLElement {
|
|
22
|
+
constructor() {
|
|
23
|
+
super();
|
|
24
|
+
this.__registerHost();
|
|
25
|
+
this.__attachShadow();
|
|
26
|
+
this.optionsSaved = createEvent(this, "optionsSaved", 7);
|
|
27
|
+
this.productSelected = createEvent(this, "productSelected", 7);
|
|
28
|
+
this.product = null;
|
|
29
|
+
this.sectionId = null;
|
|
30
|
+
this.sectionIndex = 0;
|
|
31
|
+
this.productIndex = 0;
|
|
32
|
+
this.selectedOptions = {};
|
|
33
|
+
this.isLoading = false;
|
|
34
|
+
this.hasUnsavedChanges = false;
|
|
35
|
+
this.validationErrors = [];
|
|
36
|
+
}
|
|
37
|
+
/**
|
|
38
|
+
* Generate a unique cache key for selected options using section ID, product index, and product ID
|
|
39
|
+
*/
|
|
40
|
+
generateCacheKey(sectionId, productIndex, productId) {
|
|
41
|
+
return `${sectionId || 'unknown'}-${productIndex || 0}-${productId || 'unknown'}`;
|
|
42
|
+
}
|
|
43
|
+
handleProductChange(newValue) {
|
|
44
|
+
// Use setTimeout to ensure modal is ready
|
|
45
|
+
setTimeout(() => {
|
|
46
|
+
if (this.modal && newValue) {
|
|
47
|
+
const title = newValue.name || '';
|
|
48
|
+
this.modal.setTitle(title);
|
|
49
|
+
}
|
|
50
|
+
}, 100);
|
|
51
|
+
// Reset validation errors when product changes
|
|
52
|
+
this.validationErrors = [];
|
|
53
|
+
this.hasUnsavedChanges = false;
|
|
54
|
+
}
|
|
55
|
+
async open() {
|
|
56
|
+
if (!this.modal) {
|
|
57
|
+
requestAnimationFrame(() => this.open());
|
|
58
|
+
return;
|
|
59
|
+
}
|
|
60
|
+
this.isLoading = true;
|
|
61
|
+
// Set the title before opening
|
|
62
|
+
if (this.product?.name) {
|
|
63
|
+
this.modal.setTitle(this.product.name);
|
|
64
|
+
}
|
|
65
|
+
this.modal.open();
|
|
66
|
+
// Initialize selectedOptions with current selections from the component
|
|
67
|
+
setTimeout(async () => {
|
|
68
|
+
if (this.product?.id) {
|
|
69
|
+
await this.initializeSelectedOptions();
|
|
70
|
+
}
|
|
71
|
+
// Set title again after modal is fully loaded
|
|
72
|
+
if (this.product?.name) {
|
|
73
|
+
this.modal.setTitle(this.product.name);
|
|
74
|
+
}
|
|
75
|
+
this.modal.stopLoading();
|
|
76
|
+
this.isLoading = false;
|
|
77
|
+
}, 300);
|
|
78
|
+
}
|
|
79
|
+
async close() {
|
|
80
|
+
if (this.modal) {
|
|
81
|
+
this.modal.close();
|
|
82
|
+
}
|
|
83
|
+
}
|
|
84
|
+
async refreshOptionsState() {
|
|
85
|
+
// Force re-render by updating the component state
|
|
86
|
+
this.selectedOptions = { ...this.selectedOptions };
|
|
87
|
+
}
|
|
88
|
+
componentDidLoad() {
|
|
89
|
+
salla.event.on('multiple-bundle-product-modal::open', (data) => {
|
|
90
|
+
this.product = data.product;
|
|
91
|
+
this.sectionId = data.sectionId || null;
|
|
92
|
+
this.sectionIndex = data.sectionIndex || 0;
|
|
93
|
+
this.productIndex = data.productIndex || 0;
|
|
94
|
+
this.open();
|
|
95
|
+
});
|
|
96
|
+
// Listen for clear-options event when a product is deselected
|
|
97
|
+
salla.event.on('multiple-bundle-product-modal::clear-options', (data) => {
|
|
98
|
+
this.clearProductOptions(data.productId);
|
|
99
|
+
});
|
|
100
|
+
// Create and store the option change listener for proper cleanup
|
|
101
|
+
this.optionChangeListener = (e) => {
|
|
102
|
+
const { productId, option, detail } = e.detail;
|
|
103
|
+
// Convert productId to the same type as our product ID
|
|
104
|
+
const normalizedProductId = this.product?.id ? String(this.product.id) : null;
|
|
105
|
+
const normalizedEventProductId = productId ? String(productId) : null;
|
|
106
|
+
// Only handle events for the current product
|
|
107
|
+
if (normalizedProductId &&
|
|
108
|
+
normalizedEventProductId &&
|
|
109
|
+
normalizedProductId === normalizedEventProductId &&
|
|
110
|
+
option &&
|
|
111
|
+
detail) {
|
|
112
|
+
this.handleOptionChange(Number(normalizedProductId), option, detail);
|
|
113
|
+
}
|
|
114
|
+
};
|
|
115
|
+
salla.event.on('product-options::change', this.optionChangeListener);
|
|
116
|
+
// Create and store the checkbox change listener for proper cleanup
|
|
117
|
+
this.checkboxChangeListener = (e) => {
|
|
118
|
+
const target = e.target;
|
|
119
|
+
// Check if this is a product selection checkbox
|
|
120
|
+
if (target && target.type === 'checkbox' && target.name && target.name.includes('bundle[') && target.name.includes('][id]')) {
|
|
121
|
+
// Extract section info from the checkbox name: bundle[sectionId][productIndex][id]
|
|
122
|
+
const nameMatch = target.name.match(/^bundle\[([^\]]+)\]\[([^\]]+)\]\[id\]$/);
|
|
123
|
+
if (nameMatch && !target.checked) {
|
|
124
|
+
// Product was deselected, clear its cached options
|
|
125
|
+
const [, sectionId, productIndex] = nameMatch;
|
|
126
|
+
const productId = target.value;
|
|
127
|
+
// Prevent the immediate event to ensure cleanup happens first
|
|
128
|
+
e.preventDefault();
|
|
129
|
+
e.stopPropagation();
|
|
130
|
+
// Ensure the checkbox is actually unchecked
|
|
131
|
+
target.checked = false;
|
|
132
|
+
// Generate the same cache key used by the modal
|
|
133
|
+
const cacheKey = this.generateCacheKey(sectionId, parseInt(productIndex), productId);
|
|
134
|
+
// Clear the cached options for this product
|
|
135
|
+
const updatedSelectedOptions = { ...this.selectedOptions };
|
|
136
|
+
delete updatedSelectedOptions[cacheKey];
|
|
137
|
+
this.selectedOptions = updatedSelectedOptions;
|
|
138
|
+
// Force re-render of the modal if it's currently open for this product
|
|
139
|
+
if (this.product && this.product.id == productId) {
|
|
140
|
+
this.selectedOptions = { ...this.selectedOptions };
|
|
141
|
+
}
|
|
142
|
+
const form = this.host.closest('form');
|
|
143
|
+
if (form) {
|
|
144
|
+
const productInputPattern = `bundle[${sectionId}][${productIndex}]`;
|
|
145
|
+
// Get all form inputs and filter manually
|
|
146
|
+
const allInputs = Array.from(form.querySelectorAll('input'));
|
|
147
|
+
const matchingInputs = allInputs.filter(input => input.name && input.name.startsWith(productInputPattern));
|
|
148
|
+
// Process matching inputs for removal
|
|
149
|
+
matchingInputs.forEach(el => {
|
|
150
|
+
// Don't remove the visible checkbox that was just unchecked
|
|
151
|
+
if (el !== target && (el.type === 'hidden' || el.hasAttribute('data-product-id'))) {
|
|
152
|
+
el.remove();
|
|
153
|
+
}
|
|
154
|
+
});
|
|
155
|
+
// Method 2: Find inputs by data-product-id BUT only within the same section/productIndex
|
|
156
|
+
const dataProductInputs = allInputs.filter(input => {
|
|
157
|
+
// Must have data-product-id matching the productId
|
|
158
|
+
if (input.getAttribute('data-product-id') !== String(productId)) {
|
|
159
|
+
return false;
|
|
160
|
+
}
|
|
161
|
+
// Must also be within the same section/productIndex pattern
|
|
162
|
+
return input.name && input.name.startsWith(productInputPattern);
|
|
163
|
+
});
|
|
164
|
+
// Process inputs with matching section/productIndex and productId for removal
|
|
165
|
+
dataProductInputs.forEach(el => {
|
|
166
|
+
if (el !== target) {
|
|
167
|
+
el.remove();
|
|
168
|
+
}
|
|
169
|
+
});
|
|
170
|
+
// Method 3: Removed broader search to prevent removing inputs from other products
|
|
171
|
+
// The cleanup is now more precise and only removes inputs for the specific product
|
|
172
|
+
// Trigger form change event after cleanup is complete
|
|
173
|
+
setTimeout(() => {
|
|
174
|
+
const changeEvent = new window.Event('change', { bubbles: true });
|
|
175
|
+
form.dispatchEvent(changeEvent);
|
|
176
|
+
}, 50); // Small delay to ensure cleanup is complete
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
}
|
|
180
|
+
};
|
|
181
|
+
// Listen for product checkbox changes to reset options when product is deselected
|
|
182
|
+
document.addEventListener('change', this.checkboxChangeListener);
|
|
183
|
+
}
|
|
184
|
+
disconnectedCallback() {
|
|
185
|
+
// Clean up event listeners to prevent memory leaks
|
|
186
|
+
if (this.checkboxChangeListener) {
|
|
187
|
+
document.removeEventListener('change', this.checkboxChangeListener);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
generateFormInputName(sectionId, productIndex, optionParentId) {
|
|
191
|
+
return `bundle[${sectionId}][${productIndex}][options][${optionParentId}]`;
|
|
192
|
+
}
|
|
193
|
+
async initializeSelectedOptions() {
|
|
194
|
+
if (!this.product?.id)
|
|
195
|
+
return;
|
|
196
|
+
const productId = this.product.id;
|
|
197
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
|
|
198
|
+
const optionsEl = document.querySelector(`salla-product-options[product-id="${productId}"]`);
|
|
199
|
+
if (optionsEl) {
|
|
200
|
+
try {
|
|
201
|
+
const selectedOptions = await optionsEl.getSelectedOptions();
|
|
202
|
+
if (selectedOptions && selectedOptions.length > 0) {
|
|
203
|
+
this.selectedOptions = {
|
|
204
|
+
...this.selectedOptions,
|
|
205
|
+
[cacheKey]: selectedOptions,
|
|
206
|
+
};
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
catch (e) {
|
|
210
|
+
console.warn('Could not initialize selected options:', e);
|
|
211
|
+
}
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
// Clear options state for a specific product
|
|
215
|
+
clearProductOptions(productId) {
|
|
216
|
+
// Generate cache key for this specific product in current section context
|
|
217
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
|
|
218
|
+
// Remove the product from selectedOptions using the cache key
|
|
219
|
+
const updatedSelectedOptions = { ...this.selectedOptions };
|
|
220
|
+
delete updatedSelectedOptions[cacheKey];
|
|
221
|
+
this.selectedOptions = updatedSelectedOptions;
|
|
222
|
+
// Reset validation errors and unsaved changes
|
|
223
|
+
this.validationErrors = [];
|
|
224
|
+
this.hasUnsavedChanges = false;
|
|
225
|
+
}
|
|
226
|
+
async handleOptionChange(productId, option, detail) {
|
|
227
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
|
|
228
|
+
// Get the current state from the component to ensure we have the latest selections
|
|
229
|
+
const optionsEl = document.querySelector(`salla-product-options[product-id="${productId}"]`);
|
|
230
|
+
let currentComponentSelections = [];
|
|
231
|
+
if (optionsEl) {
|
|
232
|
+
try {
|
|
233
|
+
currentComponentSelections = (await optionsEl.getSelectedOptions()) || [];
|
|
234
|
+
}
|
|
235
|
+
catch (e) {
|
|
236
|
+
console.warn('Could not get current selections from component:', e);
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
// If component returns data, use it; otherwise, fall back to manual tracking
|
|
240
|
+
if (currentComponentSelections.length > 0) {
|
|
241
|
+
// Component returned data, use it
|
|
242
|
+
this.selectedOptions = {
|
|
243
|
+
...this.selectedOptions,
|
|
244
|
+
[cacheKey]: currentComponentSelections,
|
|
245
|
+
};
|
|
246
|
+
}
|
|
247
|
+
else {
|
|
248
|
+
// If we have existing selections in internal state and component returns empty,
|
|
249
|
+
// it might be a deselection, so we should use manual tracking
|
|
250
|
+
if (this.selectedOptions[cacheKey] && this.selectedOptions[cacheKey].length > 0) {
|
|
251
|
+
// Component didn't return data, use manual tracking
|
|
252
|
+
const currentSelected = this.selectedOptions[cacheKey] || [];
|
|
253
|
+
const updatedSelected = [...currentSelected];
|
|
254
|
+
// Find existing selection for this specific option (by option_id)
|
|
255
|
+
const existingIndex = updatedSelected.findIndex(opt => opt.option_id === option.id);
|
|
256
|
+
if (existingIndex > -1) {
|
|
257
|
+
// Check if this is a deselection (detail might be null or undefined)
|
|
258
|
+
if (!detail || detail.id === null || detail.id === undefined) {
|
|
259
|
+
// Remove the option (deselection)
|
|
260
|
+
updatedSelected.splice(existingIndex, 1);
|
|
261
|
+
}
|
|
262
|
+
else {
|
|
263
|
+
// Replace existing selection for this option
|
|
264
|
+
updatedSelected[existingIndex] = { ...detail, option_id: option.id };
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
else {
|
|
268
|
+
// Only add if detail exists (not a deselection)
|
|
269
|
+
if (detail && detail.id !== null && detail.id !== undefined) {
|
|
270
|
+
updatedSelected.push({ ...detail, option_id: option.id });
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
this.selectedOptions = {
|
|
274
|
+
...this.selectedOptions,
|
|
275
|
+
[cacheKey]: updatedSelected,
|
|
276
|
+
};
|
|
277
|
+
}
|
|
278
|
+
else {
|
|
279
|
+
// No existing selections, component returned empty, and we're trying to add
|
|
280
|
+
// This might be the first selection, so add it manually
|
|
281
|
+
if (detail && detail.id !== null && detail.id !== undefined) {
|
|
282
|
+
this.selectedOptions = {
|
|
283
|
+
...this.selectedOptions,
|
|
284
|
+
[cacheKey]: [{ ...detail, option_id: option.id }],
|
|
285
|
+
};
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
}
|
|
289
|
+
this.hasUnsavedChanges = true;
|
|
290
|
+
this.validationErrors = []; // Clear validation errors when user makes changes
|
|
291
|
+
}
|
|
292
|
+
async validateOptions() {
|
|
293
|
+
if (!this.product?.options)
|
|
294
|
+
return true;
|
|
295
|
+
const errors = [];
|
|
296
|
+
const productId = this.product.id;
|
|
297
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
|
|
298
|
+
// Get the actual selected options from the component
|
|
299
|
+
const optionsEl = document.querySelector(`salla-product-options[product-id="${productId}"]`);
|
|
300
|
+
let currentSelected = [];
|
|
301
|
+
if (optionsEl) {
|
|
302
|
+
try {
|
|
303
|
+
currentSelected = (await optionsEl.getSelectedOptions()) || [];
|
|
304
|
+
// Also check our internal state as fallback
|
|
305
|
+
const internalSelected = this.selectedOptions[cacheKey] || [];
|
|
306
|
+
// Use whichever has more selections, or if component returns empty but internal has data, use internal
|
|
307
|
+
if (internalSelected.length > currentSelected.length ||
|
|
308
|
+
(currentSelected.length === 0 && internalSelected.length > 0)) {
|
|
309
|
+
currentSelected = internalSelected;
|
|
310
|
+
}
|
|
311
|
+
}
|
|
312
|
+
catch (e) {
|
|
313
|
+
// Fallback to internal state
|
|
314
|
+
currentSelected = this.selectedOptions[cacheKey] || [];
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
else {
|
|
318
|
+
// Fallback to internal state
|
|
319
|
+
currentSelected = this.selectedOptions[cacheKey] || [];
|
|
320
|
+
}
|
|
321
|
+
// Check if any options are selected at all
|
|
322
|
+
if (currentSelected.length === 0) {
|
|
323
|
+
errors.push(salla.lang.get('pages.products.no_options_selected'));
|
|
324
|
+
}
|
|
325
|
+
// Check required options
|
|
326
|
+
this.product.options.forEach(option => {
|
|
327
|
+
if (option.required) {
|
|
328
|
+
const hasSelection = currentSelected.some(selected => {
|
|
329
|
+
return selected.option_id == option.id; // Use == instead of === for type flexibility
|
|
330
|
+
});
|
|
331
|
+
if (!hasSelection) {
|
|
332
|
+
errors.push(salla.lang.get('pages.products.required_option_missing', {
|
|
333
|
+
option: option.name,
|
|
334
|
+
}));
|
|
335
|
+
}
|
|
336
|
+
}
|
|
337
|
+
});
|
|
338
|
+
this.validationErrors = errors;
|
|
339
|
+
return errors.length === 0;
|
|
340
|
+
}
|
|
341
|
+
async onSave(e) {
|
|
342
|
+
e.preventDefault();
|
|
343
|
+
const productId = this.product?.id;
|
|
344
|
+
if (!productId)
|
|
345
|
+
return;
|
|
346
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, productId);
|
|
347
|
+
// Small delay to ensure component state is updated
|
|
348
|
+
await new Promise(resolve => setTimeout(resolve, 100));
|
|
349
|
+
// Validate options before saving
|
|
350
|
+
const isValid = await this.validateOptions();
|
|
351
|
+
if (!isValid) {
|
|
352
|
+
salla.notify.error(this.validationErrors.join(', '));
|
|
353
|
+
return;
|
|
354
|
+
}
|
|
355
|
+
this.isLoading = true;
|
|
356
|
+
try {
|
|
357
|
+
// please don't change this with this.host.querySelector it will return null
|
|
358
|
+
const optionsEl = document.querySelector(`salla-product-options[product-id="${productId}"]`);
|
|
359
|
+
let selectedOptions = await optionsEl?.getSelectedOptions();
|
|
360
|
+
// If component returns empty but we have internal state, use internal state
|
|
361
|
+
if ((!selectedOptions || selectedOptions.length === 0) &&
|
|
362
|
+
this.selectedOptions[cacheKey]?.length > 0) {
|
|
363
|
+
selectedOptions = this.selectedOptions[cacheKey];
|
|
364
|
+
}
|
|
365
|
+
if (!selectedOptions || selectedOptions.length === 0) {
|
|
366
|
+
this.isLoading = false;
|
|
367
|
+
return;
|
|
368
|
+
}
|
|
369
|
+
// Store the selected options for this product using cache key
|
|
370
|
+
this.selectedOptions = {
|
|
371
|
+
...this.selectedOptions,
|
|
372
|
+
[cacheKey]: selectedOptions,
|
|
373
|
+
};
|
|
374
|
+
const form = this.host.closest('form');
|
|
375
|
+
if (!form) {
|
|
376
|
+
this.isLoading = false;
|
|
377
|
+
return;
|
|
378
|
+
}
|
|
379
|
+
// remove old inputs for this specific product in this specific section/index only
|
|
380
|
+
const productInputPattern = `bundle[${this.sectionId}][${this.productIndex}]`;
|
|
381
|
+
// Remove only hidden inputs and inputs with data-product-id, but preserve visible checkboxes
|
|
382
|
+
Array.from(form.querySelectorAll(`input[name^="${productInputPattern}"][type="hidden"]`)).forEach(el => el.remove());
|
|
383
|
+
// Also remove any inputs with data-product-id that match this specific pattern
|
|
384
|
+
Array.from(form.querySelectorAll(`[data-product-id="${productId}"][name^="${productInputPattern}"]`)).forEach(el => el.remove());
|
|
385
|
+
// Ensure the actual checkbox in the UI is checked to reflect the selection visually
|
|
386
|
+
const checkboxId = `bundle[${this.sectionId}][${this.productIndex}][id]`;
|
|
387
|
+
const checkbox = document.getElementById(checkboxId);
|
|
388
|
+
if (checkbox) {
|
|
389
|
+
checkbox.checked = true;
|
|
390
|
+
// Don't dispatch change event here to avoid double API calls
|
|
391
|
+
}
|
|
392
|
+
else {
|
|
393
|
+
// If checkbox doesn't exist, create a hidden input as fallback
|
|
394
|
+
const productSelectionInput = document.createElement('input');
|
|
395
|
+
productSelectionInput.type = 'hidden';
|
|
396
|
+
productSelectionInput.name = `bundle[${this.sectionId}][${this.productIndex}][id]`;
|
|
397
|
+
productSelectionInput.value = String(productId);
|
|
398
|
+
productSelectionInput.dataset.productId = String(productId);
|
|
399
|
+
form.appendChild(productSelectionInput);
|
|
400
|
+
}
|
|
401
|
+
// append new hidden inputs for options
|
|
402
|
+
selectedOptions.forEach((option) => {
|
|
403
|
+
// how to get option parent id?
|
|
404
|
+
const optionParentId = option.option_id;
|
|
405
|
+
const hidden = document.createElement('input');
|
|
406
|
+
hidden.type = 'hidden';
|
|
407
|
+
// Use productIndex for the form input name
|
|
408
|
+
hidden.name = this.generateFormInputName(this.sectionId, this.productIndex ?? 0, optionParentId);
|
|
409
|
+
hidden.value = String(option.id);
|
|
410
|
+
hidden.dataset.productId = String(productId);
|
|
411
|
+
form.appendChild(hidden);
|
|
412
|
+
});
|
|
413
|
+
// Trigger single form change event with all updates (product selection + options)
|
|
414
|
+
const changeEvent = new window.Event('change', { bubbles: true });
|
|
415
|
+
form.dispatchEvent(changeEvent);
|
|
416
|
+
// Emit custom event
|
|
417
|
+
this.optionsSaved.emit({
|
|
418
|
+
productId: Number(productId),
|
|
419
|
+
selectedOptions,
|
|
420
|
+
});
|
|
421
|
+
// Emit product selected event to check the card
|
|
422
|
+
if (this.sectionId) {
|
|
423
|
+
this.productSelected.emit({
|
|
424
|
+
productId: Number(productId),
|
|
425
|
+
sectionId: this.sectionId,
|
|
426
|
+
product: this.product,
|
|
427
|
+
fromModal: true,
|
|
428
|
+
});
|
|
429
|
+
}
|
|
430
|
+
// Show success message
|
|
431
|
+
salla.notify.success(salla.lang.get('pages.products.options_saved'));
|
|
432
|
+
this.hasUnsavedChanges = false;
|
|
433
|
+
this.validationErrors = [];
|
|
434
|
+
// close modal
|
|
435
|
+
this.modal.close();
|
|
436
|
+
}
|
|
437
|
+
catch (error) {
|
|
438
|
+
salla.notify.error(salla.lang.get('pages.products.options_save_error'));
|
|
439
|
+
}
|
|
440
|
+
finally {
|
|
441
|
+
this.isLoading = false;
|
|
442
|
+
}
|
|
443
|
+
}
|
|
444
|
+
// Method to get options with selected state preserved
|
|
445
|
+
getOptionsWithSelectedState() {
|
|
446
|
+
if (!this.product?.options)
|
|
447
|
+
return [];
|
|
448
|
+
const cacheKey = this.generateCacheKey(this.sectionId, this.productIndex, this.product.id);
|
|
449
|
+
const savedOptions = this.selectedOptions[cacheKey] || [];
|
|
450
|
+
return this.product.options.map(option => ({
|
|
451
|
+
...option,
|
|
452
|
+
details: option.details.map(detail => {
|
|
453
|
+
const isSelected = savedOptions.some(saved => {
|
|
454
|
+
return saved.id === detail.id;
|
|
455
|
+
});
|
|
456
|
+
return {
|
|
457
|
+
...detail,
|
|
458
|
+
is_selected: isSelected,
|
|
459
|
+
};
|
|
460
|
+
}),
|
|
461
|
+
}));
|
|
462
|
+
}
|
|
463
|
+
render() {
|
|
464
|
+
const productId = this.product?.id;
|
|
465
|
+
const optionsWithSelectedState = this.getOptionsWithSelectedState();
|
|
466
|
+
return (h(Host, { key: '52efc988e52036a0be8c5dfe7d9375aed2072b55' }, h("salla-modal", { key: 'e07dd856effc65a718528c6836884cd82520e94e', isLoading: this.isLoading, ref: el => (this.modal = el), width: "md", centered: false, id: `s-multiple-bundle-product-options-modal-options-${productId}`, class: "s-multiple-bundle-product-options-modal-wrapper" }, h("div", { key: '5365b7d796d48759a8cd0e7bb7e6cd755382afc8', slot: "loading" }, h("salla-skeleton", { key: 'deb66b5f95587584ade5581da3c891a95d3750af', height: "100%", width: "100%" })), this.product?.images && this.product?.images.length > 0 && (h("salla-slider", { key: 'e79b63e49ba9c29ef9d625ca99ffd17bbf282f79', id: `details-slider-${this.product?.id}`, type: "thumbs", loop: false, "auto-height": true, "listen-to-thumbnails-option": true, showThumbsControls: false, controlsOuter: false, showControls: false, class: "s-multiple-bundle-product-options-modal-slider", verticalThumbs: true, thumbsConfig: {
|
|
467
|
+
centeredSlides: true,
|
|
468
|
+
centeredSlidesBounds: true,
|
|
469
|
+
slidesPerView: Math.min(5, Math.max(1, this.product?.images.length)),
|
|
470
|
+
watchOverflow: true,
|
|
471
|
+
watchSlidesVisibility: true,
|
|
472
|
+
watchSlidesProgress: true,
|
|
473
|
+
direction: 'vertical',
|
|
474
|
+
spaceBetween: 10,
|
|
475
|
+
} }, h("div", { key: '3c3f3d2a1de4869a0d2d15583630d04a400097d7', slot: "items" }, this.product?.images &&
|
|
476
|
+
this.product?.images.map((image, index) => (h("div", { key: index, class: "swiper-slide" }, h("img", { src: image.url, alt: image.alt || `${this.product?.name} - Image ${index + 1}`, loading: "lazy", onError: e => {
|
|
477
|
+
e.target.style.display = 'none';
|
|
478
|
+
} }))))), this.product?.images && this.product?.images.length > 1 && (h("div", { key: '5d0f67677595c442d76f0fb3a42dacb1996e58db', slot: "thumbs" }, this.product?.images &&
|
|
479
|
+
this.product?.images.map((image, index) => (h("div", { key: index, "data-caption": `${this.product?.name} - Image ${index + 1}` }, h("img", { src: image.url, loading: "eager", class: "s-multiple-bundle-product-options-modal-slider-thumb", title: `${this.product?.name} - ${index + 1}`, alt: image.alt || `${this.product?.name} - ${index + 1}`, onError: e => {
|
|
480
|
+
e.target.style.display = 'none';
|
|
481
|
+
} })))))))), h("salla-product-options", { options: JSON.stringify(optionsWithSelectedState), key: `${this.sectionId}-${this.sectionIndex}-${productId}-persistent`, "product-id": productId }), h("div", { key: '1f166bdaf78a78b99aeecc141e6f99b9fa1e50b1', slot: "footer" }, h("div", { key: 'e4ea869eaf9690ee3aba7319f976a82f8187767e', class: "s-multiple-bundle-product-options-modal-footer" }, h("salla-button", { key: '17e4f97284528019b25bd640ff3843dbbefb5dae', onClick: e => this.onSave(e), loading: this.isLoading, disabled: this.isLoading }, this.isLoading
|
|
482
|
+
? salla.lang.get('common.elements.saving')
|
|
483
|
+
: salla.lang.get('common.elements.save')))))));
|
|
484
|
+
}
|
|
485
|
+
get host() { return this; }
|
|
486
|
+
static get watchers() { return {
|
|
487
|
+
"product": ["handleProductChange"]
|
|
488
|
+
}; }
|
|
489
|
+
static get style() { return sallaMultipleBundleProductOptionsModalCss; }
|
|
490
|
+
}, [1, "salla-multiple-bundle-product-options-modal", {
|
|
491
|
+
"product": [32],
|
|
492
|
+
"sectionId": [32],
|
|
493
|
+
"sectionIndex": [32],
|
|
494
|
+
"productIndex": [32],
|
|
495
|
+
"selectedOptions": [32],
|
|
496
|
+
"isLoading": [32],
|
|
497
|
+
"hasUnsavedChanges": [32],
|
|
498
|
+
"validationErrors": [32],
|
|
499
|
+
"open": [64],
|
|
500
|
+
"close": [64],
|
|
501
|
+
"refreshOptionsState": [64]
|
|
502
|
+
}, undefined, {
|
|
503
|
+
"product": ["handleProductChange"]
|
|
504
|
+
}]);
|
|
505
|
+
function defineCustomElement() {
|
|
506
|
+
if (typeof customElements === "undefined") {
|
|
507
|
+
return;
|
|
508
|
+
}
|
|
509
|
+
const components = ["salla-multiple-bundle-product-options-modal", "salla-booking-field", "salla-button", "salla-color-picker", "salla-conditional-fields", "salla-datetime-picker", "salla-file-upload", "salla-loading", "salla-map", "salla-modal", "salla-product-options", "salla-progress-bar", "salla-skeleton", "salla-slider"];
|
|
510
|
+
components.forEach(tagName => { switch (tagName) {
|
|
511
|
+
case "salla-multiple-bundle-product-options-modal":
|
|
512
|
+
if (!customElements.get(tagName)) {
|
|
513
|
+
customElements.define(tagName, SallaMultipleBundleProductOptionsModal);
|
|
514
|
+
}
|
|
515
|
+
break;
|
|
516
|
+
case "salla-booking-field":
|
|
517
|
+
if (!customElements.get(tagName)) {
|
|
518
|
+
defineCustomElement$d();
|
|
519
|
+
}
|
|
520
|
+
break;
|
|
521
|
+
case "salla-button":
|
|
522
|
+
if (!customElements.get(tagName)) {
|
|
523
|
+
defineCustomElement$c();
|
|
524
|
+
}
|
|
525
|
+
break;
|
|
526
|
+
case "salla-color-picker":
|
|
527
|
+
if (!customElements.get(tagName)) {
|
|
528
|
+
defineCustomElement$b();
|
|
529
|
+
}
|
|
530
|
+
break;
|
|
531
|
+
case "salla-conditional-fields":
|
|
532
|
+
if (!customElements.get(tagName)) {
|
|
533
|
+
defineCustomElement$a();
|
|
534
|
+
}
|
|
535
|
+
break;
|
|
536
|
+
case "salla-datetime-picker":
|
|
537
|
+
if (!customElements.get(tagName)) {
|
|
538
|
+
defineCustomElement$9();
|
|
539
|
+
}
|
|
540
|
+
break;
|
|
541
|
+
case "salla-file-upload":
|
|
542
|
+
if (!customElements.get(tagName)) {
|
|
543
|
+
defineCustomElement$8();
|
|
544
|
+
}
|
|
545
|
+
break;
|
|
546
|
+
case "salla-loading":
|
|
547
|
+
if (!customElements.get(tagName)) {
|
|
548
|
+
defineCustomElement$7();
|
|
549
|
+
}
|
|
550
|
+
break;
|
|
551
|
+
case "salla-map":
|
|
552
|
+
if (!customElements.get(tagName)) {
|
|
553
|
+
defineCustomElement$6();
|
|
554
|
+
}
|
|
555
|
+
break;
|
|
556
|
+
case "salla-modal":
|
|
557
|
+
if (!customElements.get(tagName)) {
|
|
558
|
+
defineCustomElement$5();
|
|
559
|
+
}
|
|
560
|
+
break;
|
|
561
|
+
case "salla-product-options":
|
|
562
|
+
if (!customElements.get(tagName)) {
|
|
563
|
+
defineCustomElement$4();
|
|
564
|
+
}
|
|
565
|
+
break;
|
|
566
|
+
case "salla-progress-bar":
|
|
567
|
+
if (!customElements.get(tagName)) {
|
|
568
|
+
defineCustomElement$3();
|
|
569
|
+
}
|
|
570
|
+
break;
|
|
571
|
+
case "salla-skeleton":
|
|
572
|
+
if (!customElements.get(tagName)) {
|
|
573
|
+
defineCustomElement$2();
|
|
574
|
+
}
|
|
575
|
+
break;
|
|
576
|
+
case "salla-slider":
|
|
577
|
+
if (!customElements.get(tagName)) {
|
|
578
|
+
defineCustomElement$1();
|
|
579
|
+
}
|
|
580
|
+
break;
|
|
581
|
+
} });
|
|
582
|
+
}
|
|
583
|
+
defineCustomElement();
|
|
584
|
+
|
|
585
|
+
export { SallaMultipleBundleProductOptionsModal as S, defineCustomElement as d };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Components, JSX } from "../types/components";
|
|
2
|
+
|
|
3
|
+
interface SallaMultipleBundleProductSlider extends Components.SallaMultipleBundleProductSlider, HTMLElement {}
|
|
4
|
+
export const SallaMultipleBundleProductSlider: {
|
|
5
|
+
prototype: SallaMultipleBundleProductSlider;
|
|
6
|
+
new (): SallaMultipleBundleProductSlider;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Used to define this component and all nested components recursively.
|
|
10
|
+
*/
|
|
11
|
+
export const defineCustomElement: () => void;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Crafted with ❤ by Salla
|
|
3
|
+
*/
|
|
4
|
+
import { S as SallaMultipleBundleProductSlider$1, d as defineCustomElement$1 } from './salla-multiple-bundle-product-slider2.js';
|
|
5
|
+
|
|
6
|
+
const SallaMultipleBundleProductSlider = SallaMultipleBundleProductSlider$1;
|
|
7
|
+
const defineCustomElement = defineCustomElement$1;
|
|
8
|
+
|
|
9
|
+
export { SallaMultipleBundleProductSlider, defineCustomElement };
|