@salla.sa/twilight-components 2.14.392 → 2.14.393

package/dist/components/salla-menu.js

@@ -1,168 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2 } from './salla-products-list2.js';
-
-const sallaMenuCss = ":host{display:block}";
-
-const SallaMenu$1 = /*@__PURE__*/ proxyCustomElement(class SallaMenu extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        /**
-         * The source of the menu, specifying whether it is a header or footer menu.
-         */
-        this.source = "header";
-        /**
-         * Boolean indicating whether to use React Link elements for menu links.
-         */
-        this.useReactLink = false;
-        this.menus = [];
-    }
-    async componentWillLoad() {
-        return salla.onReady(() => {
-            this.displayAllText = salla.lang.get('blocks.home.display_all');
-            if (this.sourceValue && this.source === 'json') {
-                this.menus = typeof this.sourceValue === 'string' ? JSON.parse(this.sourceValue) : this.sourceValue || [];
-            }
-            else {
-                return this.getMenuItems();
-            }
-        });
-    }
-    getMenuItems() {
-        /**
-          * Avoid saving the menu to localStorage (default) when in the development environment
-          * or when modifying the theme in the dashboard
-          */
-        // const isPreview = salla.config.isDebug() || salla.helpers.isPreview()
-        // const cacheKey = `${this.source}_menus_${salla.lang.locale}`
-        // const cachedMenus = salla.storage.getWithTTL(cacheKey, [])
-        // if (cachedMenus.length > 0 && !isPreview) {
-        //   this.menus = cachedMenus
-        //   return;
-        // }
-        return salla.api.component.getMenus(this.source).then(({ data }) => {
-            this.menus = data;
-            // !isPreview && salla.storage.setWithTTL(cacheKey, this.menus)
-        }).catch((error) => {
-            salla.logger.error('salla-menu::Error fetching menus', error);
-        });
-    }
-    hasChildren(menu) {
-        return menu?.children?.length > 0;
-    }
-    hasProducts(menu) {
-        return menu?.products?.length > 0;
-    }
-    /**
-    * Get the classes for desktop menu
-    * @param {Object} menu
-    * @param {Boolean} isRootMenu
-    * @returns {String}
-    */
-    getDesktopClasses(menu, isRootMenu) {
-        return `!hidden lg:!block ${isRootMenu ? 'root-level lg:!inline-block' : 'relative'} ${menu.products ? ' mega-menu' : ''}
-    ${this.hasChildren(menu) ? 'has-children' : ''}`;
-    }
-    getAttributes(attrs) {
-        return attrs.trim().split(' ').reduce((result, attr) => {
-            let [key, value] = attr.split('=');
-            result[key] = value.replace(/"/g, '');
-            return result;
-        }, {});
-    }
-    /**
-       * Get the mobile menu
-       * @param {Object} menu
-       * @param {String} displayAllText
-       * @returns {String}
-       */
-    getMobileMenu(menu, displayAllText) {
-        const menuImage = menu.image ? h("img", { src: menu.image, class: "rounded-full", width: "48", height: "48", alt: menu.title }) : null;
-        return (h("li", { class: "lg:hidden text-sm font-bold", ...this.getAttributes(menu.attrs) }, !this.hasChildren(menu) ?
-            h("a", { href: menu.url, "aria-label": menu.title || 'category', class: `text-gray-500 ${menu.image ? '!py-3' : ''}`, ...this.getAttributes(menu.link_attrs) }, menuImage, h("span", null, menu.title || ''))
-            :
-                h(Fragment, null, h("span", { class: menu.image ? '!py-3' : '' }, menuImage, menu.title), h("ul", null, h("li", { class: "text-sm font-bold" }, h("a", { href: menu.url, class: "text-gray-500" }, displayAllText)), menu.children.map((subMenu) => this.getMobileMenu(subMenu, displayAllText))))));
-    }
-    /**
-       * Get the desktop menu
-       * @param {Object} menu
-       * @param {Boolean} isRootMenu
-       * @returns {String}
-       */
-    getDesktopMenu(menu, isRootMenu) {
-        return h("li", { class: this.getDesktopClasses(menu, isRootMenu), ...this.getAttributes(menu.attrs) }, h("a", { href: menu.url, "aria-label": menu.title || 'category', ...this.getAttributes(menu.link_attrs) }, h("span", null, menu.title)), this.hasChildren(menu) ?
-            h("div", { class: `sub-menu shadow-default ${this.hasProducts(menu) ? 'w-full left-0 flex' : 'w-56'}` }, h("ul", { class: this.hasProducts(menu) ? 'w-56 shrink-0 m-8 rtl:ml-0 ltr:mr-0' : '' }, menu.children.map((subMenu) => this.getDesktopMenu(subMenu, false))), this.hasProducts(menu) ?
-                h("salla-products-list", { source: "selected", "shadow-on-hover": true, "source-value": `[${menu.products}]` }) : null) : null);
-    }
-    /**
-       * Get the footer menu
-       * @param {Array} menus
-       */
-    getFooterMenu(menus) {
-        const Menuitems = (this.topnav || this.limit) ? menus.slice(0, this.limit || 3) : menus;
-        return h("div", null, h("div", { class: {
-                "s-menu-footer-list": !this.topnav,
-                "s-menu-topnav-list": this.topnav
-            } }, Menuitems.map((menu) => {
-            return h("a", { key: menu.id, href: menu.url, target: menu.target, class: {
-                    "s-menu-footer-item": !this.topnav,
-                    "s-menu-topnav-item topnav-link-item right-side": this.topnav
-                } }, menu.title);
-        })));
-    }
-    /**
-  * Get the menus
-  * @param {Array} menus
-  * @returns {String}
-  */
-    getHeaderMenu(menus) {
-        return menus.map((menu) => [
-            this.getMobileMenu(menu, this.displayAllText),
-            this.getDesktopMenu(menu, true)
-        ]);
-    }
-    render() {
-        return this.source === "footer" ?
-            this.getFooterMenu(this.menus)
-            :
-                [
-                    h("nav", { key: "main-nav", id: "mobile-menu", class: "mobile-menu" }, h("ul", { class: "main-menu" }, this.getHeaderMenu(this.menus)), h("button", { class: "btn--close close-mobile-menu sicon-cancel lg:hidden" })),
-                    h("button", { key: "close-btn", class: "btn--close-sm close-mobile-menu sicon-cancel hidden" })
-                ];
-    }
-    static get style() { return sallaMenuCss; }
-}, [0, "salla-menu", {
-        "source": [1],
-        "sourceValue": [1, "source-value"],
-        "topnav": [4],
-        "useReactLink": [4, "use-react-link"],
-        "limit": [2],
-        "menus": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-menu", "salla-products-list"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-menu":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaMenu$1);
-            }
-            break;
-        case "salla-products-list":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const SallaMenu = SallaMenu$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaMenu, defineCustomElement };
+import{transformTag as s,proxyCustomElement as t,HTMLElement as e,h as l,Fragment as n}from"@stencil/core/internal/client";import{d as i}from"./salla-products-list2.js";const a=t(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.source="header",this.useReactLink=!1,this.menus=[]}async componentWillLoad(){return salla.onReady((()=>{if(this.displayAllText=salla.lang.get("blocks.home.display_all"),!this.sourceValue||"json"!==this.source)return this.getMenuItems();this.menus="string"==typeof this.sourceValue?JSON.parse(this.sourceValue):this.sourceValue||[]}))}getMenuItems(){return salla.api.component.getMenus(this.source).then((({data:s})=>{this.menus=s})).catch((s=>{salla.logger.error("salla-menu::Error fetching menus",s)}))}hasChildren(s){return s?.children?.length>0}hasProducts(s){return s?.products?.length>0}getDesktopClasses(s,t){return`!hidden lg:!block ${t?"root-level lg:!inline-block":"relative"} ${s.products?" mega-menu":""}\n    ${this.hasChildren(s)?"has-children":""}`}getAttributes(s){return s.trim().split(" ").reduce(((s,t)=>{let[e,l]=t.split("=");return s[e]=l.replace(/"/g,""),s}),{})}getMobileMenu(s,t){const e=s.image?l("img",{src:s.image,class:"rounded-full",width:"48",height:"48",alt:s.title}):null;return l("li",{class:"lg:hidden text-sm font-bold",...this.getAttributes(s.attrs)},this.hasChildren(s)?l(n,null,l("span",{class:s.image?"!py-3":""},e,s.title),l("ul",null,l("li",{class:"text-sm font-bold"},l("a",{href:s.url,class:"text-gray-500"},t)),s.children.map((s=>this.getMobileMenu(s,t))))):l("a",{href:s.url,"aria-label":s.title||"category",class:"text-gray-500 "+(s.image?"!py-3":""),...this.getAttributes(s.link_attrs)},e,l("span",null,s.title||"")))}getDesktopMenu(s,t){return l("li",{class:this.getDesktopClasses(s,t),...this.getAttributes(s.attrs)},l("a",{href:s.url,"aria-label":s.title||"category",...this.getAttributes(s.link_attrs)},l("span",null,s.title)),this.hasChildren(s)?l("div",{class:"sub-menu shadow-default "+(this.hasProducts(s)?"w-full left-0 flex":"w-56")},l("ul",{class:this.hasProducts(s)?"w-56 shrink-0 m-8 rtl:ml-0 ltr:mr-0":""},s.children.map((s=>this.getDesktopMenu(s,!1)))),this.hasProducts(s)?l("salla-products-list",{source:"selected","shadow-on-hover":!0,"source-value":`[${s.products}]`}):null):null)}getFooterMenu(s){const t=this.topnav||this.limit?s.slice(0,this.limit||3):s;return l("div",null,l("div",{class:{"s-menu-footer-list":!this.topnav,"s-menu-topnav-list":this.topnav}},t.map((s=>l("a",{key:s.id,href:s.url,target:s.target,class:{"s-menu-footer-item":!this.topnav,"s-menu-topnav-item topnav-link-item right-side":this.topnav}},s.title)))))}getHeaderMenu(s){return s.map((s=>[this.getMobileMenu(s,this.displayAllText),this.getDesktopMenu(s,!0)]))}render(){return"footer"===this.source?this.getFooterMenu(this.menus):[l("nav",{key:"main-nav",id:"mobile-menu",class:"mobile-menu"},l("ul",{class:"main-menu"},this.getHeaderMenu(this.menus)),l("button",{class:"btn--close close-mobile-menu sicon-cancel lg:hidden"})),l("button",{key:"close-btn",class:"btn--close-sm close-mobile-menu sicon-cancel hidden"})]}static get style(){return":host{display:block}"}},[0,"salla-menu",{source:[1],sourceValue:[1,"source-value"],topnav:[4],useReactLink:[4,"use-react-link"],limit:[2],menus:[32]}]);function r(){"undefined"!=typeof customElements&&["salla-menu","salla-products-list"].forEach((t=>{switch(t){case"salla-menu":customElements.get(s(t))||customElements.define(s(t),a);break;case"salla-products-list":customElements.get(s(t))||i()}}))}r();const o=a,u=r;export{o as SallaMenu,u as defineCustomElement}

package/dist/components/salla-metadata.js

@@ -1,100 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const sallaMetadataCss = "";
-
-const SallaMetadata$1 = /*@__PURE__*/ proxyCustomElement(class SallaMetadata extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        /**
-         * The entity type.
-         */
-        this.entity = 'product';
-        this.specs = [];
-        this.download = salla.lang.get('pages.thank_you.download');
-        if (this.entityId) {
-            try {
-                this.entityId = Array.isArray(this.entityId)
-                    ? this.entityId
-                    : JSON.parse(this.entityId);
-                return;
-            }
-            catch (e) {
-                salla.log('Bad json passed via entityId prop');
-            }
-        }
-    }
-    getValue(field) {
-        if (field.type === 'file') {
-            return `<a href="${field.value}" class="text-primary" target="_blank"><span class="sicon-download"></span> ${this.download}</a>`;
-        }
-        if (field.type === 'url') {
-            return `<a href="${field.value}" class="text-blue-700 underline" target="_blank">${field.value}</a>`; // classes will be moved to the utilities.json file
-        }
-        if (field.type === 'date') {
-            const date = new Date(field.value);
-            const day = String(date.getDate()).padStart(2, '0');
-            const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are 0-based
-            const year = date.getFullYear();
-            const formattedDate = `${day}/${month}/${year}`;
-            return formattedDate;
-        }
-        return field.value;
-    }
-    async componentWillLoad() {
-        await salla.onReady();
-        if (!salla.config.get('store.features')?.includes('custom-fields')) {
-            return salla.logger.error('feature custom-fields is not activated');
-        }
-        //todo:: remove `product.showNewUrls` after changing it from BE
-        if (!this.entityId && (salla.url.is_page('product.single') || salla.url.is_page("product.showNewUrls"))) {
-            this.entityId = salla.config.get('page.id');
-        }
-        if (!this.entityId) {
-            return salla.logger.error("can't render salla-metadata without enity-id prop!");
-        }
-        await salla.lang.onLoaded();
-        this.download = salla.lang.get('pages.thank_you.download');
-        const response = await Salla.api.metadata.fetchValues(this.entity, this.entityId);
-        this.specs = response.data[0]?.sections;
-    }
-    render() {
-        if (!this.specs.length) {
-            return;
-        }
-        return (h(Host, { class: "s-metadata-wrapper" }, this.specs.map((item) => {
-            return (h("div", { class: "s-metadata-box" }, h("div", { class: "s-metadata-box-header" }, h("i", { class: "sicon-list" }), item.name), item.fields.map((field) => {
-                return (h("div", { class: "s-metadata-row" }, h("p", { class: "s-metadata-row-name" }, field.name), h("p", { class: "s-metadata-row-value", innerHTML: this.getValue(field) })));
-            })));
-        })));
-    }
-    get host() { return this; }
-    static get style() { return sallaMetadataCss; }
-}, [0, "salla-metadata", {
-        "entity": [1],
-        "entityId": [8, "entity-id"],
-        "specs": [32],
-        "download": [32]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-metadata"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-metadata":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaMetadata$1);
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const SallaMetadata = SallaMetadata$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaMetadata, defineCustomElement };
+import{transformTag as a,proxyCustomElement as t,HTMLElement as s,h as e,Host as l}from"@stencil/core/internal/client";const i=t(class extends s{constructor(a){if(super(),!1!==a&&this.__registerHost(),this.entity="product",this.specs=[],this.download=salla.lang.get("pages.thank_you.download"),this.entityId)try{return void(this.entityId=Array.isArray(this.entityId)?this.entityId:JSON.parse(this.entityId))}catch(a){salla.log("Bad json passed via entityId prop")}}getValue(a){if("file"===a.type)return`<a href="${a.value}" class="text-primary" target="_blank"><span class="sicon-download"></span> ${this.download}</a>`;if("url"===a.type)return`<a href="${a.value}" class="text-blue-700 underline" target="_blank">${a.value}</a>`;if("date"===a.type){const t=new Date(a.value);return`${(t.getDate()+"").padStart(2,"0")}/${(t.getMonth()+1+"").padStart(2,"0")}/${t.getFullYear()}`}return a.value}async componentWillLoad(){if(await salla.onReady(),!salla.config.get("store.features")?.includes("custom-fields"))return salla.logger.error("feature custom-fields is not activated");if(this.entityId||!salla.url.is_page("product.single")&&!salla.url.is_page("product.showNewUrls")||(this.entityId=salla.config.get("page.id")),!this.entityId)return salla.logger.error("can't render salla-metadata without enity-id prop!");await salla.lang.onLoaded(),this.download=salla.lang.get("pages.thank_you.download");const a=await Salla.api.metadata.fetchValues(this.entity,this.entityId);this.specs=a.data[0]?.sections}render(){if(this.specs.length)return e(l,{class:"s-metadata-wrapper"},this.specs.map((a=>e("div",{class:"s-metadata-box"},e("div",{class:"s-metadata-box-header"},e("i",{class:"sicon-list"}),a.name),a.fields.map((a=>e("div",{class:"s-metadata-row"},e("p",{class:"s-metadata-row-name"},a.name),e("p",{class:"s-metadata-row-value",innerHTML:this.getValue(a)}))))))))}get host(){return this}static get style(){return""}},[0,"salla-metadata",{entity:[1],entityId:[8,"entity-id"],specs:[32],download:[32]}]);function n(){"undefined"!=typeof customElements&&["salla-metadata"].forEach((t=>{"salla-metadata"===t&&(customElements.get(a(t))||customElements.define(a(t),i))}))}n();const r=i,o=n;export{r as SallaMetadata,o as defineCustomElement}

package/dist/components/salla-modal.js

@@ -1,9 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { S as SallaModal$1, d as defineCustomElement$1 } from './salla-modal2.js';
-
-const SallaModal = SallaModal$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaModal, defineCustomElement };
+import{S as a,d as o}from"./salla-modal2.js";const s=a,l=o;export{s as SallaModal,l as defineCustomElement}

package/dist/components/salla-modal2.js

@@ -1,218 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { C as Cancel } from './cancel.js';
-import { A as AlertEngineIcon, C as CheckCircle2 } from './check-circle2.js';
-import { H as Helper } from './Helper.js';
-import { d as defineCustomElement$1 } from './salla-loading2.js';
-
-const sallaModalCss = "@media screen and (max-width: 470px){.modal-is-open{position:fixed;width:100%}}";
-
-const SallaModal = /*@__PURE__*/ proxyCustomElement(class SallaModal extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.modalVisibilityChanged = createEvent(this, "modalVisibilityChanged", 7);
-        /**
-         * Sets the modal to be closable. Defaults to `true`
-         */
-        this.isClosable = true; //todo::rename unclude. Suggestion => persistent
-        /**
-         * The size of the modal
-         */
-        this.width = 'md';
-        /**
-         * The position of the modal
-         */
-        this.position = 'middle';
-        /**
-         * open the modal on rendering
-         */
-        this.visible = false;
-        /**
-         * open the modal on rendering
-         */
-        this.hasSkeleton = false;
-        /**
-         * Show loading in the middle
-         */
-        this.isLoading = false;
-        /**
-         * Show subtitle before the title or not, defaults to `false` (after the title)
-         */
-        this.subTitleFirst = false; //todo:: choose better name
-        /**
-         * Avoid padding in the modal body or not, defaults to `false`
-         */
-        this.noPadding = false; //todo:: choose better name
-        /**
-         * Set modal sub title.
-         */
-        this.subTitle = '';
-        /**
-         * Align modal content to center, defaults to `false`
-         */
-        this.centered = false;
-        /**
-         * Set the style of the header icon.
-         */
-        this.iconStyle = undefined;
-        salla.event.on('modal::open', target => target == this.host.id && this.open());
-        salla.event.on('modal::close', target => target == this.host.id && this.close());
-        this.modalTitle = this.host.getAttribute('modal-title');
-    }
-    handleVisible(newValue) {
-        if (!newValue) {
-            this.modalVisibilityChanged.emit(false);
-            this.toggleModal(false);
-            return;
-        }
-        this.modalVisibilityChanged.emit(true);
-        this.host.classList.remove('s-hidden');
-        setTimeout(() => this.toggleModal(true)); //small amont of time to running toggle After adding hidden
-    }
-    handleKeyUp(ev) {
-        if (ev.key === "KeyUp") {
-            this.closeModal();
-        }
-    }
-    /**
-     * Open the modal
-     */
-    async open() {
-        this.host.setAttribute('visible', '');
-        this.handleAutoFocus();
-        return this.host;
-    }
-    /**
-     * close the modal
-     */
-    async close() {
-        this.host.removeAttribute('visible');
-        return this.host;
-    }
-    /**
-     * Change the Modal Title
-     * @param {string} modalTitle
-     */
-    async setTitle(modalTitle) {
-        this.modalTitle = modalTitle;
-        return this.host;
-    }
-    /**
-     * Start loading
-     */
-    async loading() {
-        this.isLoading = true;
-        return this.host;
-    }
-    /**
-     * Stop the loading
-     */
-    async stopLoading() {
-        this.isLoading = false;
-        return this.host;
-    }
-    handleAutoFocus() {
-        const firstFocusableElement = this.host.querySelector('input, textarea, select');
-        if (!firstFocusableElement) {
-            return;
-        }
-        setTimeout(() => {
-            firstFocusableElement.focus();
-        }, 100);
-    }
-    toggleModal(isOpen) {
-        const body = this.host.querySelector('.s-modal-body');
-        Helper.toggleElementClassIf(body, 's-modal-entering', 's-modal-leaving', () => isOpen)
-            .toggleElementClassIf(this.overlay, 's-modal-entering', 's-modal-overlay-leaving', () => isOpen)
-            .toggleElementClassIf(document.body, 'modal-is-open', 'modal-is-closed', () => isOpen);
-        if (!isOpen) {
-            setTimeout(() => this.host.classList.add('s-hidden'), 350);
-        }
-    }
-    closeModal(reason) {
-        if (!this.isClosable) {
-            return;
-        }
-        salla.event.dispatch('modal::close', { reason });
-        this.host.removeAttribute('visible');
-    }
-    iconBlockClasses() {
-        return {
-            's-modal-icon': true,
-            's-modal-bg-error': this.iconStyle == 'error',
-            's-modal-bg-success': this.iconStyle == 'success',
-            's-modal-bg-normal': !this.iconStyle,
-            's-modal-bg-primary': this.iconStyle == 'primary'
-        };
-    }
-    getWidth() {
-        return this.isLoading ? (this.hasSkeleton ? 'md' : 'xs') : this.width;
-    }
-    //todo:: pref for each modal
-    render() {
-        this.host.id = this.host.id || 'salla-modal';
-        if (this.isLoading) {
-            return (h(Host, { class: 'salla-modal s-modal s-modal-container s-hidden', "aria-modal": "true", role: "dialog", onKeyUp: e => this.handleKeyUp(e) }, h("div", { class: "s-modal-overlay", ref: el => this.overlay = el, onClick: () => this.closeModal("backdropClick") }), h("div", { class: "s-modal-wrapper" }, h("span", { class: 's-modal-spacer s-modal-align-' + this.position }, "\u200B"), h("div", { class: 's-modal-body ' + 's-modal-align-' + this.position + ' s-modal-' + this.getWidth() + (this.noPadding ? ' s-modal-nopadding' : ' s-modal-padding') }, h("slot", { name: "loading" }, h("salla-loading", null)), h("div", { class: "s-hidden" }, h("slot", null))))));
-        }
-        return (h(Host, { class: 'salla-modal s-modal s-modal-container s-hidden', "aria-modal": "true", role: "dialog" }, h("div", { class: "s-modal-overlay", ref: el => this.overlay = el, onClick: () => this.closeModal("backdropClick") }), h("div", { class: "s-modal-wrapper" }, h("span", { class: 's-modal-spacer s-modal-align-' + this.position }, "\u200B"), h("div", { class: 's-modal-body ' + 's-modal-align-' + this.position + ' s-modal-' + this.getWidth() + (this.noPadding ? ' s-modal-nopadding' : ' s-modal-padding') }, h("div", { class: { 's-modal-header': true, 's-modal-is-center': this.centered } }, this.isClosable ?
-            h("button", { class: "s-modal-close", onClick: () => this.closeModal("closeButtonClick"), type: "button" }, h("span", { innerHTML: Cancel }))
-            : '', this.modalTitle || this.subTitle ?
-            h("div", { class: "s-modal-header-inner" }, h("slot", { name: 'icon' }, !!this.iconStyle ?
-                h("div", { class: this.iconBlockClasses(), innerHTML: this.iconStyle == 'error' ? AlertEngineIcon : CheckCircle2 })
-                : ''), h("div", { class: "s-modal-header-content" }, this.modalTitle ? h("div", { class: { 's-modal-title': true, 's-modal-title-below': this.subTitleFirst }, innerHTML: this.modalTitle }) : '', this.subTitle ? h("p", { class: { 's-modal-sub-title': true }, innerHTML: this.subTitle }) : ''))
-            : ''), h("slot", null), h("slot", { name: "footer" })))));
-    }
-    //move the modal as root dom, because we need the model to be outside the forms
-    componentDidLoad() {
-        document.body.append(this.host);
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "visible": ["handleVisible"]
-    }; }
-    static get style() { return sallaModalCss; }
-}, [4, "salla-modal", {
-        "isClosable": [1028, "is-closable"],
-        "width": [513],
-        "position": [513],
-        "visible": [516],
-        "hasSkeleton": [516, "has-skeleton"],
-        "isLoading": [1540, "is-loading"],
-        "subTitleFirst": [4, "sub-title-first"],
-        "noPadding": [4, "no-padding"],
-        "subTitle": [1, "sub-title"],
-        "centered": [4],
-        "iconStyle": [1, "icon-style"],
-        "modalTitle": [32],
-        "open": [64],
-        "close": [64],
-        "setTitle": [64],
-        "loading": [64],
-        "stopLoading": [64]
-    }, [[0, "keyup", "handleKeyUp"]], {
-        "visible": ["handleVisible"]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-modal", "salla-loading"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-modal":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaModal);
-            }
-            break;
-        case "salla-loading":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { SallaModal as S, defineCustomElement as d };
+import{transformTag as s,proxyCustomElement as i,HTMLElement as l,createEvent as t,h as a,Host as e}from"@stencil/core/internal/client";import{C as o}from"./cancel.js";import{A as d,C as n}from"./check-circle2.js";import{H as h}from"./Helper.js";import{d as r}from"./salla-loading2.js";const m=i(class extends l{constructor(s){super(),!1!==s&&this.__registerHost(),this.modalVisibilityChanged=t(this,"modalVisibilityChanged",7),this.isClosable=!0,this.width="md",this.position="middle",this.visible=!1,this.hasSkeleton=!1,this.isLoading=!1,this.subTitleFirst=!1,this.noPadding=!1,this.subTitle="",this.centered=!1,this.iconStyle=void 0,salla.event.on("modal::open",(s=>s==this.host.id&&this.open())),salla.event.on("modal::close",(s=>s==this.host.id&&this.close())),this.modalTitle=this.host.getAttribute("modal-title")}handleVisible(s){if(!s)return this.modalVisibilityChanged.emit(!1),void this.toggleModal(!1);this.modalVisibilityChanged.emit(!0),this.host.classList.remove("s-hidden"),setTimeout((()=>this.toggleModal(!0)))}handleKeyUp(s){"KeyUp"===s.key&&this.closeModal()}async open(){return this.host.setAttribute("visible",""),this.handleAutoFocus(),this.host}async close(){return this.host.removeAttribute("visible"),this.host}async setTitle(s){return this.modalTitle=s,this.host}async loading(){return this.isLoading=!0,this.host}async stopLoading(){return this.isLoading=!1,this.host}handleAutoFocus(){const s=this.host.querySelector("input, textarea, select");s&&setTimeout((()=>{s.focus()}),100)}toggleModal(s){const i=this.host.querySelector(".s-modal-body");h.toggleElementClassIf(i,"s-modal-entering","s-modal-leaving",(()=>s)).toggleElementClassIf(this.overlay,"s-modal-entering","s-modal-overlay-leaving",(()=>s)).toggleElementClassIf(document.body,"modal-is-open","modal-is-closed",(()=>s)),s||setTimeout((()=>this.host.classList.add("s-hidden")),350)}closeModal(s){this.isClosable&&(salla.event.dispatch("modal::close",{reason:s}),this.host.removeAttribute("visible"))}iconBlockClasses(){return{"s-modal-icon":!0,"s-modal-bg-error":"error"==this.iconStyle,"s-modal-bg-success":"success"==this.iconStyle,"s-modal-bg-normal":!this.iconStyle,"s-modal-bg-primary":"primary"==this.iconStyle}}getWidth(){return this.isLoading?this.hasSkeleton?"md":"xs":this.width}render(){return this.host.id=this.host.id||"salla-modal",this.isLoading?a(e,{class:"salla-modal s-modal s-modal-container s-hidden","aria-modal":"true",role:"dialog",onKeyUp:s=>this.handleKeyUp(s)},a("div",{class:"s-modal-overlay",ref:s=>this.overlay=s,onClick:()=>this.closeModal("backdropClick")}),a("div",{class:"s-modal-wrapper"},a("span",{class:"s-modal-spacer s-modal-align-"+this.position},"​"),a("div",{class:"s-modal-body s-modal-align-"+this.position+" s-modal-"+this.getWidth()+(this.noPadding?" s-modal-nopadding":" s-modal-padding")},a("slot",{name:"loading"},a("salla-loading",null)),a("div",{class:"s-hidden"},a("slot",null))))):a(e,{class:"salla-modal s-modal s-modal-container s-hidden","aria-modal":"true",role:"dialog"},a("div",{class:"s-modal-overlay",ref:s=>this.overlay=s,onClick:()=>this.closeModal("backdropClick")}),a("div",{class:"s-modal-wrapper"},a("span",{class:"s-modal-spacer s-modal-align-"+this.position},"​"),a("div",{class:"s-modal-body s-modal-align-"+this.position+" s-modal-"+this.getWidth()+(this.noPadding?" s-modal-nopadding":" s-modal-padding")},a("div",{class:{"s-modal-header":!0,"s-modal-is-center":this.centered}},this.isClosable?a("button",{class:"s-modal-close",onClick:()=>this.closeModal("closeButtonClick"),type:"button"},a("span",{innerHTML:o})):"",this.modalTitle||this.subTitle?a("div",{class:"s-modal-header-inner"},a("slot",{name:"icon"},this.iconStyle?a("div",{class:this.iconBlockClasses(),innerHTML:"error"==this.iconStyle?d:n}):""),a("div",{class:"s-modal-header-content"},this.modalTitle?a("div",{class:{"s-modal-title":!0,"s-modal-title-below":this.subTitleFirst},innerHTML:this.modalTitle}):"",this.subTitle?a("p",{class:{"s-modal-sub-title":!0},innerHTML:this.subTitle}):"")):""),a("slot",null),a("slot",{name:"footer"}))))}componentDidLoad(){document.body.append(this.host)}get host(){return this}static get watchers(){return{visible:[{handleVisible:0}]}}static get style(){return"@media screen and (max-width: 470px){.modal-is-open{position:fixed;width:100%}}"}},[260,"salla-modal",{isClosable:[1028,"is-closable"],width:[513],position:[513],visible:[516],hasSkeleton:[516,"has-skeleton"],isLoading:[1540,"is-loading"],subTitleFirst:[4,"sub-title-first"],noPadding:[4,"no-padding"],subTitle:[1,"sub-title"],centered:[4],iconStyle:[1,"icon-style"],modalTitle:[32],open:[64],close:[64],setTitle:[64],loading:[64],stopLoading:[64]},[[0,"keyup","handleKeyUp"]],{visible:[{handleVisible:0}]}]);function c(){"undefined"!=typeof customElements&&["salla-modal","salla-loading"].forEach((i=>{switch(i){case"salla-modal":customElements.get(s(i))||customElements.define(s(i),m);break;case"salla-loading":customElements.get(s(i))||r()}}))}c();export{m as S,c as d}

package/dist/components/salla-multiple-bundle-product-cart.js

@@ -1,9 +1,4 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { S as SallaMultipleBundleProductCart$1, d as defineCustomElement$1 } from './salla-multiple-bundle-product-cart2.js';
-
-const SallaMultipleBundleProductCart = SallaMultipleBundleProductCart$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { SallaMultipleBundleProductCart, defineCustomElement };
+import{S as t,d as a}from"./salla-multiple-bundle-product-cart2.js";const l=t,o=a;export{l as SallaMultipleBundleProductCart,o as defineCustomElement}