@salla.sa/twilight-components 2.14.467 → 2.14.468

package/dist/components/salla-social-share.js

@@ -1,195 +1,7 @@
 /*!
  * Crafted with ❤ by Salla
  */
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import { a as anime } from './anime.es.js';
-import { f as facebook, t as twitter } from './facebook.js';
-import { M as MailIcon } from './mail.js';
-import { C as Cancel } from './cancel.js';
-import { d as defineCustomElement$2 } from './salla-button2.js';
-
-var copy_link = `<!-- Generated by IcoMoon.io -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<title>link</title>
-<path d="M19.247 23.019l-4.189 4.189c-2.831 2.831-7.435 2.831-10.265 0-1.371-1.372-2.125-3.193-2.125-5.132s0.755-3.761 2.125-5.133l4.189-4.191c0.521-0.521 0.521-1.364 0-1.885s-1.364-0.521-1.885 0l-4.189 4.191c-1.875 1.875-2.907 4.367-2.907 7.019s1.032 5.143 2.907 7.017 4.368 2.907 7.019 2.907 5.143-1.032 7.017-2.908l4.189-4.189c0.521-0.521 0.521-1.364 0-1.885s-1.364-0.52-1.885 0.001zM22.276 9.724c-0.521-0.521-1.364-0.521-1.885 0l-10.667 10.667c-0.521 0.521-0.521 1.364 0 1.885 0.26 0.26 0.601 0.391 0.943 0.391s0.683-0.131 0.943-0.391l10.667-10.667c0.521-0.521 0.521-1.364 0-1.885zM29.093 2.908c-1.875-1.876-4.368-2.908-7.019-2.908s-5.143 1.032-7.017 2.908l-4.189 4.188c-0.521 0.521-0.521 1.364 0 1.885s1.364 0.521 1.885 0l4.189-4.189c2.831-2.831 7.435-2.831 10.265 0 1.371 1.372 2.125 3.193 2.125 5.132s-0.755 3.761-2.125 5.133l-4.189 4.191c-0.521 0.521-0.521 1.364 0 1.885 0.26 0.26 0.601 0.391 0.943 0.391s0.683-0.131 0.943-0.391l4.189-4.191c1.875-1.875 2.907-4.367 2.907-7.019s-1.032-5.143-2.907-7.016z"></path>
-</svg>
-`;
-
-var whatsapp = `<!-- Generated by IcoMoon.io -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<title>whatsapp</title>
-<path d="M16 32c-0.008 0-0.018 0-0.028 0-3.1 0-5.993-0.887-8.439-2.421l0.066 0.039-7.2 2.3 2.336-6.964c-1.713-2.492-2.736-5.575-2.736-8.897 0-0.020 0-0.040 0-0.060v0.003c0.009-8.833 7.167-15.991 15.999-16h0.001c8.837 0 16 7.163 16 16s-7.163 16-16 16v0zM7.906 27.424l0.4 0.264c2.169 1.449 4.837 2.312 7.707 2.312 7.732 0 14-6.268 14-14s-6.268-14-14-14c-0.004 0-0.009 0-0.013 0h0.001c-7.729 0.008-13.992 6.271-14 13.999v0.001c-0 0.010-0 0.021-0 0.032 0 3.072 1 5.909 2.693 8.206l-0.027-0.038 0.304 0.416-1.4 4.2zM20.716 24.958c-1.684-0.131-3.237-0.574-4.641-1.271l0.073 0.033c-3.098-1.456-5.634-3.668-7.438-6.405l-0.042-0.067c-1.102-1.357-1.819-3.067-1.962-4.938l-0.002-0.030c-0.001-0.036-0.001-0.078-0.001-0.12 0-1.575 0.66-2.995 1.719-4l0.002-0.002c0.547-0.52 1.289-0.839 2.105-0.839 0.033 0 0.066 0.001 0.099 0.002l-0.005-0c0.2 0 0.378 0 0.542 0.018 0.016-0.001 0.035-0.001 0.054-0.001 0.815 0 1.502 0.549 1.711 1.298l0.003 0.012 0.324 0.782c0.376 0.906 0.858 2.068 0.942 2.244 0.144 0.251 0.23 0.552 0.23 0.873 0 0.286-0.068 0.557-0.188 0.797l0.005-0.010c-0.149 0.307-0.332 0.57-0.55 0.802l0.002-0.002c-0.148 0.168-0.248 0.274-0.346 0.378s-0.172 0.18-0.26 0.284c0.575 0.92 1.237 1.713 1.992 2.406l0.008 0.008c0.829 0.758 1.802 1.373 2.872 1.8l0.064 0.022c0.369-0.266 0.672-0.6 0.896-0.985l0.008-0.015 0.174-0.232c0.328-0.484 0.875-0.798 1.495-0.798 0.249 0 0.487 0.051 0.703 0.142l-0.012-0.004c0.492 0.168 2.922 1.372 2.946 1.384l0.228 0.11c0.415 0.149 0.758 0.417 0.996 0.763l0.004 0.007c0.107 0.349 0.169 0.75 0.169 1.166 0 0.591-0.125 1.153-0.349 1.661l0.010-0.026c-0.702 1.368-1.983 2.353-3.511 2.637l-0.031 0.005c-0.309 0.071-0.663 0.112-1.028 0.112-0.004 0-0.007 0-0.011 0h0.001zM10.632 9.318c-0.028-0.002-0.062-0.004-0.095-0.004-0.245 0-0.472 0.076-0.659 0.206l0.004-0.002c-0.726 0.651-1.18 1.591-1.18 2.638 0 0.044 0.001 0.087 0.002 0.13l-0-0.006c0.122 1.404 0.662 2.662 1.495 3.671l-0.009-0.011 0.12 0.168c1.627 2.491 3.865 4.46 6.504 5.723l0.096 0.041c3.136 1.288 3.916 1.124 4.426 1.014 0.87-0.159 1.601-0.656 2.067-1.347l0.007-0.011c0.12-0.316 0.204-0.682 0.237-1.063l0.001-0.015-0.040-0.018-0.256-0.124c-0.8-0.4-2.46-1.2-2.734-1.292l-0.058 0.184c-0.346 0.501-0.684 0.934-1.045 1.347l0.015-0.017c-0.344 0.349-0.821 0.565-1.349 0.565-0.28 0-0.546-0.061-0.785-0.17l0.012 0.005c-1.403-0.547-2.609-1.301-3.646-2.239l0.010 0.009c-0.975-0.891-1.81-1.912-2.486-3.039l-0.034-0.061c-0.152-0.244-0.242-0.54-0.242-0.857 0-0.463 0.191-0.88 0.499-1.178l0-0c0.13-0.162 0.264-0.302 0.4-0.444l0.236-0.256c0.091-0.096 0.177-0.201 0.254-0.311l0.006-0.009c-0.158-0.36-0.622-1.472-0.988-2.352l-0.322-0.772-0.038-0.086c-0.188-0.010-0.302-0.016-0.426-0.016zM12.462 12.442v0.012z"></path>
-</svg>
-`;
-
-var Socials;
-(function (Socials) {
-    Socials["FACEBOOK"] = "facebook";
-    Socials["TWITTER"] = "twitter";
-    Socials["WHATSAPP"] = "whatsapp";
-    Socials["EMAIL"] = "email";
-    Socials["COPY_LINK"] = "copy_link";
-})(Socials || (Socials = {}));
-
-var ShareAlt = `<!-- Generated by IcoMoon.io -->
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-<title>share-alt</title>
-<path d="M26.667 21.333c-1.699 0-3.196 0.812-4.173 2.052l-11.912-5.211c0.044-0.276 0.085-0.553 0.085-0.841 0-0.472-0.081-0.923-0.197-1.359l12.361-6.952c0.971 1.009 2.328 1.644 3.836 1.644 2.941 0 5.333-2.392 5.333-5.333s-2.392-5.333-5.333-5.333-5.333 2.392-5.333 5.333c0 0.472 0.081 0.923 0.197 1.359l-12.361 6.952c-0.971-1.009-2.328-1.644-3.836-1.644-2.941 0-5.333 2.392-5.333 5.333s2.392 5.333 5.333 5.333c1.699 0 3.196-0.812 4.173-2.052l11.912 5.211c-0.044 0.276-0.085 0.553-0.085 0.841 0 2.941 2.392 5.333 5.333 5.333s5.333-2.392 5.333-5.333-2.392-5.333-5.333-5.333zM26.667 2.667c1.471 0 2.667 1.196 2.667 2.667s-1.196 2.667-2.667 2.667-2.667-1.196-2.667-2.667 1.196-2.667 2.667-2.667zM5.333 20c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667zM26.667 29.333c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667z"></path>
-</svg>
-`;
-
-const sallaSocialShareCss = "";
-
-const SallaSocialShare$1 = /*@__PURE__*/ proxyCustomElement(class SallaSocialShare extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.opened = false;
-        this.allPlatforms = [Socials.WHATSAPP, Socials.FACEBOOK, Socials.TWITTER, Socials.EMAIL, Socials.COPY_LINK];
-        this.platformIcons = [{ icon: whatsapp, name: Socials.WHATSAPP }, {
-                icon: facebook,
-                name: Socials.FACEBOOK
-            }, { icon: twitter, name: Socials.TWITTER }, { icon: MailIcon, name: Socials.EMAIL }, {
-                icon: copy_link,
-                name: Socials.COPY_LINK
-            }];
-        this.convertedPlatforms = [];
-        /**
-         * page url that will be shared custom | current page url
-         */
-        this.url = "";
-        /**
-         * page url name that will be shared custom | current page url
-         */
-        this.urlName = "";
-        /**
-         * selected platforms to share | all platforms
-         */
-        this.platforms = 'facebook,twitter,whatsapp,email,copy_link';
-    }
-    componentWillLoad() {
-        if (this.host.hasAttribute('aria-label')) {
-            this.host.removeAttribute('aria-label');
-        }
-        if (document.getElementById('a2a-script')) {
-            return;
-        }
-        const script = document.createElement('script');
-        script.src = 'https://static.addtoany.com/menu/page.js';
-        script.setAttribute('id', 'a2a-script');
-        script.async = true;
-        script.onload = function () {
-            window.a2a_config.locale = salla.config.get('user.language_code', salla.lang.getLocale());
-            window.a2a_config.callbacks = window.a2a_config.callbacks || [];
-            window.a2a_config.callbacks.push({
-                share: (data) => {
-                    // Handle share event
-                    const shareData = {
-                        share_via: data.service.toLowerCase(),
-                        url: data.url,
-                        title: data.title
-                    };
-                    // Dispatch the share event
-                    salla.event.emit('share-element', shareData);
-                }
-            });
-        };
-        document.body.appendChild(script);
-    }
-    /**
-     * Activate or open the share menu.
-     */
-    async open() {
-        const animateList = new anime.timeline().add({
-            targets: this.shareMenu,
-            translateY: [-50, 0],
-            opacity: [0, 1],
-            duration: 300,
-            podding: '0',
-            easing: 'easeInOutSine'
-        });
-        animateList.add({
-            targets: this.shareMenu.children,
-            translateZ: 0,
-            translateY: [-30, 0],
-            scaleY: [0, 1],
-            opacity: [0, 1],
-            duration: 1400,
-            delay: anime.stagger(100)
-        }, '-=200');
-        this.opened = !this.opened;
-        if (this.opened) {
-            this.shareMenu.classList.add('opened');
-        }
-        else {
-            animateList.pause();
-            animateList.seek(0);
-            this.shareMenu.classList.remove('opened');
-        }
-    }
-    /**
-     * Asynchronously initializes the "AddToAny" (a2a) social sharing tool on the current page.
-     * If the global object `window.a2a` is available, it initializes the tool with the 'page' mode.
-     * The 'page' mode is typically used to enable sharing of the current webpage.
-     *
-     * @remarks
-     * This function is designed to be used in scenarios where dynamic loading or refreshing of social sharing tools is needed.
-     * Ensure that the AddToAny script is properly included in the HTML document before calling this function.
-     *
-     * @example
-     * // Call the refresh function to initialize AddToAny on the page.
-     * await refresh();
-     *
-     * @throws {Error} Throws an error if the AddToAny script is not properly included or if there are issues during initialization.
-     *
-     * @async
-     * @returns {Promise<void>} A promise that resolves once the initialization is complete.
-     */
-    async refresh() {
-        // Attempt to initialize AddToAny with 'page' mode if the global object `window.a2a` is available.
-        window.a2a?.init('page');
-    }
-    render() {
-        return (h("div", { key: 'e45420682a1b9bf686cbb9d3beff5a208505e1c7', class: "s-social-share-wrapper" }, h("slot", { key: '265102d26da7ce2d297969e1941b9a5785da3971', name: 'widget' }, h("salla-button", { key: '9f36a44dc9487f4956c1d8b73f0fcc41cf8a01b8', "aria-label": "Share", onClick: () => this.open(), class: "s-social-share-btn", shape: "icon", fill: "outline", color: "light" }, h("span", { key: 'b34ed78cd6549bff733de5c542a42ca9aaf805d0', innerHTML: this.opened ? Cancel : ShareAlt }))), h("ul", { key: 'f8eb408030d409880391b7d13b5a701226b0d42a', ref: el => this.shareMenu = el, class: "s-social-share-list a2a_kit share", "data-a2a-url": this.url ? this.url : window.location.href, "data-a2a-title": this.urlName ? this.urlName : document.title }, this.platforms.split(',').map(platform => {
-            return (h("li", null, h("a", { class: `a2a_button_${platform}`, "aria-label": `Share Via ${platform}` }, this.platformIcons.map((icon) => {
-                if (icon.name === platform) {
-                    return h("span", { class: "s-social-share-icon", innerHTML: icon.icon });
-                }
-            }))));
-        }))));
-    }
-    get host() { return this; }
-    static get style() { return sallaSocialShareCss; }
-}, [4, "salla-social-share", {
-        "url": [513],
-        "urlName": [513, "url-name"],
-        "platforms": [513],
-        "opened": [32],
-        "allPlatforms": [32],
-        "platformIcons": [32],
-        "convertedPlatforms": [32],
-        "open": [64],
-        "refresh": [64]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["salla-social-share", "salla-button"];
-    components.forEach(tagName => { switch (tagName) {
-        case "salla-social-share":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, SallaSocialShare$1);
-            }
-            break;
-        case "salla-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
+import { S as SallaSocialShare$1, d as defineCustomElement$1 } from './salla-social-share2.js';
 
 const SallaSocialShare = SallaSocialShare$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/salla-social-share2.js

@@ -0,0 +1,420 @@
+/*!
+ * Crafted with ❤ by Salla
+ */
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { a as anime } from './anime.es.js';
+import { f as facebook, t as twitter } from './facebook.js';
+import { M as MailIcon } from './mail.js';
+import { C as Cancel } from './cancel.js';
+import { d as defineCustomElement$1 } from './salla-button2.js';
+
+var copy_link = `<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>link</title>
+<path d="M19.247 23.019l-4.189 4.189c-2.831 2.831-7.435 2.831-10.265 0-1.371-1.372-2.125-3.193-2.125-5.132s0.755-3.761 2.125-5.133l4.189-4.191c0.521-0.521 0.521-1.364 0-1.885s-1.364-0.521-1.885 0l-4.189 4.191c-1.875 1.875-2.907 4.367-2.907 7.019s1.032 5.143 2.907 7.017 4.368 2.907 7.019 2.907 5.143-1.032 7.017-2.908l4.189-4.189c0.521-0.521 0.521-1.364 0-1.885s-1.364-0.52-1.885 0.001zM22.276 9.724c-0.521-0.521-1.364-0.521-1.885 0l-10.667 10.667c-0.521 0.521-0.521 1.364 0 1.885 0.26 0.26 0.601 0.391 0.943 0.391s0.683-0.131 0.943-0.391l10.667-10.667c0.521-0.521 0.521-1.364 0-1.885zM29.093 2.908c-1.875-1.876-4.368-2.908-7.019-2.908s-5.143 1.032-7.017 2.908l-4.189 4.188c-0.521 0.521-0.521 1.364 0 1.885s1.364 0.521 1.885 0l4.189-4.189c2.831-2.831 7.435-2.831 10.265 0 1.371 1.372 2.125 3.193 2.125 5.132s-0.755 3.761-2.125 5.133l-4.189 4.191c-0.521 0.521-0.521 1.364 0 1.885 0.26 0.26 0.601 0.391 0.943 0.391s0.683-0.131 0.943-0.391l4.189-4.191c1.875-1.875 2.907-4.367 2.907-7.019s-1.032-5.143-2.907-7.016z"></path>
+</svg>
+`;
+
+var whatsapp = `<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>whatsapp</title>
+<path d="M16 32c-0.008 0-0.018 0-0.028 0-3.1 0-5.993-0.887-8.439-2.421l0.066 0.039-7.2 2.3 2.336-6.964c-1.713-2.492-2.736-5.575-2.736-8.897 0-0.020 0-0.040 0-0.060v0.003c0.009-8.833 7.167-15.991 15.999-16h0.001c8.837 0 16 7.163 16 16s-7.163 16-16 16v0zM7.906 27.424l0.4 0.264c2.169 1.449 4.837 2.312 7.707 2.312 7.732 0 14-6.268 14-14s-6.268-14-14-14c-0.004 0-0.009 0-0.013 0h0.001c-7.729 0.008-13.992 6.271-14 13.999v0.001c-0 0.010-0 0.021-0 0.032 0 3.072 1 5.909 2.693 8.206l-0.027-0.038 0.304 0.416-1.4 4.2zM20.716 24.958c-1.684-0.131-3.237-0.574-4.641-1.271l0.073 0.033c-3.098-1.456-5.634-3.668-7.438-6.405l-0.042-0.067c-1.102-1.357-1.819-3.067-1.962-4.938l-0.002-0.030c-0.001-0.036-0.001-0.078-0.001-0.12 0-1.575 0.66-2.995 1.719-4l0.002-0.002c0.547-0.52 1.289-0.839 2.105-0.839 0.033 0 0.066 0.001 0.099 0.002l-0.005-0c0.2 0 0.378 0 0.542 0.018 0.016-0.001 0.035-0.001 0.054-0.001 0.815 0 1.502 0.549 1.711 1.298l0.003 0.012 0.324 0.782c0.376 0.906 0.858 2.068 0.942 2.244 0.144 0.251 0.23 0.552 0.23 0.873 0 0.286-0.068 0.557-0.188 0.797l0.005-0.010c-0.149 0.307-0.332 0.57-0.55 0.802l0.002-0.002c-0.148 0.168-0.248 0.274-0.346 0.378s-0.172 0.18-0.26 0.284c0.575 0.92 1.237 1.713 1.992 2.406l0.008 0.008c0.829 0.758 1.802 1.373 2.872 1.8l0.064 0.022c0.369-0.266 0.672-0.6 0.896-0.985l0.008-0.015 0.174-0.232c0.328-0.484 0.875-0.798 1.495-0.798 0.249 0 0.487 0.051 0.703 0.142l-0.012-0.004c0.492 0.168 2.922 1.372 2.946 1.384l0.228 0.11c0.415 0.149 0.758 0.417 0.996 0.763l0.004 0.007c0.107 0.349 0.169 0.75 0.169 1.166 0 0.591-0.125 1.153-0.349 1.661l0.010-0.026c-0.702 1.368-1.983 2.353-3.511 2.637l-0.031 0.005c-0.309 0.071-0.663 0.112-1.028 0.112-0.004 0-0.007 0-0.011 0h0.001zM10.632 9.318c-0.028-0.002-0.062-0.004-0.095-0.004-0.245 0-0.472 0.076-0.659 0.206l0.004-0.002c-0.726 0.651-1.18 1.591-1.18 2.638 0 0.044 0.001 0.087 0.002 0.13l-0-0.006c0.122 1.404 0.662 2.662 1.495 3.671l-0.009-0.011 0.12 0.168c1.627 2.491 3.865 4.46 6.504 5.723l0.096 0.041c3.136 1.288 3.916 1.124 4.426 1.014 0.87-0.159 1.601-0.656 2.067-1.347l0.007-0.011c0.12-0.316 0.204-0.682 0.237-1.063l0.001-0.015-0.040-0.018-0.256-0.124c-0.8-0.4-2.46-1.2-2.734-1.292l-0.058 0.184c-0.346 0.501-0.684 0.934-1.045 1.347l0.015-0.017c-0.344 0.349-0.821 0.565-1.349 0.565-0.28 0-0.546-0.061-0.785-0.17l0.012 0.005c-1.403-0.547-2.609-1.301-3.646-2.239l0.010 0.009c-0.975-0.891-1.81-1.912-2.486-3.039l-0.034-0.061c-0.152-0.244-0.242-0.54-0.242-0.857 0-0.463 0.191-0.88 0.499-1.178l0-0c0.13-0.162 0.264-0.302 0.4-0.444l0.236-0.256c0.091-0.096 0.177-0.201 0.254-0.311l0.006-0.009c-0.158-0.36-0.622-1.472-0.988-2.352l-0.322-0.772-0.038-0.086c-0.188-0.010-0.302-0.016-0.426-0.016zM12.462 12.442v0.012z"></path>
+</svg>
+`;
+
+var Socials;
+(function (Socials) {
+    Socials["FACEBOOK"] = "facebook";
+    Socials["TWITTER"] = "twitter";
+    Socials["WHATSAPP"] = "whatsapp";
+    Socials["EMAIL"] = "email";
+    Socials["COPY_LINK"] = "copy_link";
+})(Socials || (Socials = {}));
+
+var ShareAlt = `<!-- Generated by IcoMoon.io -->
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
+<title>share-alt</title>
+<path d="M26.667 21.333c-1.699 0-3.196 0.812-4.173 2.052l-11.912-5.211c0.044-0.276 0.085-0.553 0.085-0.841 0-0.472-0.081-0.923-0.197-1.359l12.361-6.952c0.971 1.009 2.328 1.644 3.836 1.644 2.941 0 5.333-2.392 5.333-5.333s-2.392-5.333-5.333-5.333-5.333 2.392-5.333 5.333c0 0.472 0.081 0.923 0.197 1.359l-12.361 6.952c-0.971-1.009-2.328-1.644-3.836-1.644-2.941 0-5.333 2.392-5.333 5.333s2.392 5.333 5.333 5.333c1.699 0 3.196-0.812 4.173-2.052l11.912 5.211c-0.044 0.276-0.085 0.553-0.085 0.841 0 2.941 2.392 5.333 5.333 5.333s5.333-2.392 5.333-5.333-2.392-5.333-5.333-5.333zM26.667 2.667c1.471 0 2.667 1.196 2.667 2.667s-1.196 2.667-2.667 2.667-2.667-1.196-2.667-2.667 1.196-2.667 2.667-2.667zM5.333 20c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667zM26.667 29.333c-1.471 0-2.667-1.196-2.667-2.667s1.196-2.667 2.667-2.667 2.667 1.196 2.667 2.667-1.196 2.667-2.667 2.667z"></path>
+</svg>
+`;
+
+const sallaSocialShareCss = ":global(body.s-social-share-modal-is-open){overflow:hidden}.s-social-share-modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:1rem;background-color:rgba(17, 24, 39, 0.5)}.s-social-share-modal-dialog{position:relative;width:100%;max-width:32rem;padding:1.5rem;background-color:#fff;border-radius:1rem;box-shadow:0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1)}.s-social-share-modal-handle{display:none}.s-social-share-modal-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}.s-social-share-modal-title{font-size:1.125rem;font-weight:700;color:#1f2937}.s-social-share-modal-close{display:inline-flex;align-items:center;justify-content:center;padding:0.25rem;line-height:0;background:transparent;border:0;cursor:pointer}.s-social-share-modal-close-icon svg{width:1.25rem;height:1.25rem;fill:#ef4444}.s-social-share-modal-platforms{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:0.75rem}.s-social-share-modal-card{display:flex;flex-direction:column;align-items:center;gap:0.5rem;padding:0.75rem;border:1px solid #e5e7eb;border-radius:0.75rem;text-decoration:none;cursor:pointer;transition:border-color 0.15s ease, box-shadow 0.15s ease}.s-social-share-modal-card:hover{border-color:#d1d5db;box-shadow:0 1px 3px rgba(0, 0, 0, 0.08)}.s-social-share-modal-icon{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:9999px}.s-social-share-modal-icon svg{width:1.25rem;height:1.25rem;fill:#fff}.s-social-share-modal-card-label{font-size:0.875rem;color:#4b5563}.s-social-share-modal-copy-row{display:flex;align-items:center;gap:0.75rem;margin-top:1rem;padding:0.5rem;background-color:#f3f4f6;border-radius:0.75rem}.s-social-share-modal-url{flex:1 1 auto;min-width:0;padding:0 0.5rem;font-size:0.875rem;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes s-social-share-sheet-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@media (max-width: 640px){.s-social-share-modal{align-items:flex-end;justify-content:center;padding:0}.s-social-share-modal-dialog{max-width:none;padding:0.75rem 1rem calc(1.25rem + env(safe-area-inset-bottom, 0px));border-radius:1rem 1rem 0 0;box-shadow:0 -4px 24px rgba(0, 0, 0, 0.12);animation:s-social-share-sheet-in 0.28s ease-out}.s-social-share-modal-handle{display:block;width:2.5rem;height:0.25rem;margin:0 auto 0.75rem;background-color:#d1d5db;border-radius:9999px}.s-social-share-modal-header{margin-bottom:1rem}.s-social-share-modal-platforms{grid-template-columns:repeat(2, minmax(0, 1fr))}}";
+
+const SallaSocialShare = /*@__PURE__*/ proxyCustomElement(class SallaSocialShare extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.ignoreOutsideClick = false;
+        /** Bilingual defaults for the modal variant; store translations always win. */
+        this.translationDefaults = {
+            'common.social.share': { ar: 'مشاركة', en: 'Share' },
+            'common.social.email': { ar: 'إيميل', en: 'Email' },
+            'common.social.whatsapp': { ar: 'واتساب', en: 'WhatsApp' },
+            'common.social.twitter': { ar: 'أكس', en: 'X' },
+            'common.social.facebook': { ar: 'فيسبوك', en: 'Facebook' },
+            'common.social.copy': { ar: 'نسخ', en: 'Copy' },
+            'common.social.copied': { ar: 'تم النسخ', en: 'Copied' },
+        };
+        this.onDocumentClick = (event) => {
+            if (this.ignoreOutsideClick || !this.opened || this.host.contains(event.target)) {
+                return;
+            }
+            void this.close();
+        };
+        this.opened = false;
+        this.copied = false;
+        this.allPlatforms = [
+            Socials.WHATSAPP,
+            Socials.FACEBOOK,
+            Socials.TWITTER,
+            Socials.EMAIL,
+            Socials.COPY_LINK,
+        ];
+        this.platformIcons = [
+            { icon: whatsapp, name: Socials.WHATSAPP },
+            {
+                icon: facebook,
+                name: Socials.FACEBOOK,
+            },
+            { icon: twitter, name: Socials.TWITTER },
+            { icon: MailIcon, name: Socials.EMAIL },
+            {
+                icon: copy_link,
+                name: Socials.COPY_LINK,
+            },
+        ];
+        this.convertedPlatforms = [];
+        /**
+         * page url that will be shared custom | current page url
+         */
+        this.url = '';
+        /**
+         * page url name that will be shared custom | current page url
+         */
+        this.urlName = '';
+        /**
+         * selected platforms to share | all platforms
+         */
+        this.platforms = 'facebook,twitter,whatsapp,email,copy_link';
+        /**
+         * Share UI variant: `default` dropdown menu or centered `modal` dialog.
+         */
+        this.mode = 'default';
+        /**
+         * Optional title for the modal variant header. Defaults to a localized "Share".
+         */
+        this.modalTitle = '';
+    }
+    componentWillLoad() {
+        this.registerTranslationDefaults();
+        if (this.host.hasAttribute('aria-label')) {
+            this.host.removeAttribute('aria-label');
+        }
+        if (document.getElementById('a2a-script')) {
+            return;
+        }
+        const script = document.createElement('script');
+        script.src = 'https://static.addtoany.com/menu/page.js';
+        script.setAttribute('id', 'a2a-script');
+        script.async = true;
+        script.onload = function () {
+            window.a2a_config.locale = salla.config.get('user.language_code', salla.lang.getLocale());
+            window.a2a_config.callbacks = window.a2a_config.callbacks || [];
+            window.a2a_config.callbacks.push({
+                share: data => {
+                    // Handle share event
+                    const shareData = {
+                        share_via: data.service.toLowerCase(),
+                        url: data.url,
+                        title: data.title,
+                    };
+                    // Dispatch the share event
+                    salla.event.emit('share-element', shareData);
+                },
+            });
+        };
+        document.body.appendChild(script);
+    }
+    componentDidLoad() {
+        document.addEventListener('click', this.onDocumentClick);
+    }
+    disconnectedCallback() {
+        document.removeEventListener('click', this.onDocumentClick);
+        if (this.copiedResetTimeout) {
+            window.clearTimeout(this.copiedResetTimeout);
+        }
+        this.setBodyScrollLocked(false);
+    }
+    /**
+     * Register bilingual (ar/en) defaults without overriding existing translations.
+     */
+    registerTranslationDefaults() {
+        if (!salla?.lang?.addBulk) {
+            return;
+        }
+        const missing = Object.entries(this.translationDefaults).reduce((acc, [key, value]) => {
+            if (salla.lang.get(key) === key) {
+                acc[key] = value;
+            }
+            return acc;
+        }, {});
+        if (Object.keys(missing).length) {
+            salla.lang.addBulk(missing);
+        }
+    }
+    resolveShareKit() {
+        return this.host.querySelector('.a2a_kit');
+    }
+    deferOutsideClickGuard() {
+        this.ignoreOutsideClick = true;
+        requestAnimationFrame(() => {
+            this.ignoreOutsideClick = false;
+        });
+    }
+    /**
+     * Open the share menu.
+     */
+    async open() {
+        if (this.opened) {
+            return;
+        }
+        this.opened = true;
+        this.deferOutsideClickGuard();
+        if (this.mode === 'modal') {
+            this.setBodyScrollLocked(true);
+        }
+        await new Promise(resolve => requestAnimationFrame(() => resolve()));
+        if (!this.opened) {
+            return;
+        }
+        // Wire AddToAny on the freshly rendered anchors (kit only exists once opened).
+        await this.refresh();
+        if (this.mode === 'modal') {
+            return;
+        }
+        const menu = this.resolveShareKit();
+        if (!menu) {
+            this.opened = false;
+            return;
+        }
+        this.openAnimation = new anime.timeline().add({
+            targets: menu,
+            translateY: [-50, 0],
+            opacity: [0, 1],
+            duration: 300,
+            podding: '0',
+            easing: 'easeInOutSine',
+        });
+        this.openAnimation.add({
+            targets: menu.children,
+            translateZ: 0,
+            translateY: [-30, 0],
+            scaleY: [0, 1],
+            opacity: [0, 1],
+            duration: 1400,
+            delay: anime.stagger(100),
+        }, '-=200');
+    }
+    /**
+     * Close the share menu.
+     */
+    async close() {
+        if (!this.opened) {
+            return;
+        }
+        this.openAnimation?.pause();
+        this.openAnimation?.seek(0);
+        this.opened = false;
+        if (this.mode === 'modal') {
+            this.setBodyScrollLocked(false);
+        }
+    }
+    setBodyScrollLocked(locked) {
+        document.body.classList.toggle('s-social-share-modal-is-open', locked);
+    }
+    toggle() {
+        if (this.opened) {
+            return this.close();
+        }
+        this.deferOutsideClickGuard();
+        return this.open();
+    }
+    /**
+     * Asynchronously initializes the "AddToAny" (a2a) social sharing tool on the current page.
+     * If the global object `window.a2a` is available, it initializes the tool with the 'page' mode.
+     * The 'page' mode is typically used to enable sharing of the current webpage.
+     *
+     * @remarks
+     * This function is designed to be used in scenarios where dynamic loading or refreshing of social sharing tools is needed.
+     * Ensure that the AddToAny script is properly included in the HTML document before calling this function.
+     *
+     * @example
+     * // Call the refresh function to initialize AddToAny on the page.
+     * await refresh();
+     *
+     * @throws {Error} Throws an error if the AddToAny script is not properly included or if there are issues during initialization.
+     *
+     * @async
+     * @returns {Promise<void>} A promise that resolves once the initialization is complete.
+     */
+    onUrlChanged(newUrl, oldUrl) {
+        if (newUrl !== oldUrl) {
+            void this.refresh();
+        }
+    }
+    getShareUrl() {
+        return this.url || window.location.href;
+    }
+    getModalTitle() {
+        return this.modalTitle || salla.lang.get('common.social.share');
+    }
+    syncShareAttributes() {
+        const kit = this.resolveShareKit();
+        if (!kit) {
+            return;
+        }
+        kit.setAttribute('data-a2a-url', this.getShareUrl());
+        kit.setAttribute('data-a2a-title', this.urlName || document.title);
+    }
+    async refresh() {
+        this.syncShareAttributes();
+        // Re-scan kits so AddToAny picks up the updated data-a2a-url (init caches the first URL).
+        if (typeof window.a2a?.init_all === 'function') {
+            window.a2a.init_all();
+            return;
+        }
+        window.a2a?.init('page');
+    }
+    async copyLink() {
+        const url = this.getShareUrl();
+        try {
+            await navigator.clipboard.writeText(url);
+        }
+        catch {
+            const textarea = document.createElement('textarea');
+            textarea.value = url;
+            textarea.style.position = 'fixed';
+            textarea.style.opacity = '0';
+            document.body.appendChild(textarea);
+            textarea.select();
+            try {
+                document.execCommand('copy');
+            }
+            catch {
+                /* noop */
+            }
+            textarea.remove();
+        }
+        salla.event.emit('share-element', {
+            share_via: 'copy_link',
+            url,
+            title: this.urlName || document.title,
+        });
+        this.copied = true;
+        if (this.copiedResetTimeout) {
+            window.clearTimeout(this.copiedResetTimeout);
+        }
+        this.copiedResetTimeout = window.setTimeout(() => (this.copied = false), 2000);
+    }
+    modalPlatformMeta(platform) {
+        switch (platform) {
+            case Socials.WHATSAPP:
+                return {
+                    icon: whatsapp,
+                    color: '#25D366',
+                    label: salla.lang.get('common.social.whatsapp'),
+                };
+            case Socials.FACEBOOK:
+                return {
+                    icon: facebook,
+                    color: '#1877F2',
+                    label: salla.lang.get('common.social.facebook'),
+                };
+            case Socials.TWITTER:
+                return { icon: twitter, color: '#000000', label: salla.lang.get('common.social.twitter') };
+            case Socials.EMAIL:
+                return { icon: MailIcon, color: '#2BA6FF', label: salla.lang.get('common.social.email') };
+            default:
+                return { icon: copy_link, color: '#6b7280', label: platform };
+        }
+    }
+    renderModalCard(platform) {
+        const meta = this.modalPlatformMeta(platform);
+        return (h("a", { class: `s-social-share-modal-card a2a_button_${platform}`, "aria-label": `Share Via ${platform}` }, h("span", { class: "s-social-share-modal-icon", style: { backgroundColor: meta.color }, innerHTML: meta.icon }), h("span", { class: "s-social-share-modal-card-label" }, meta.label)));
+    }
+    renderModal() {
+        if (!this.opened) {
+            return null;
+        }
+        const enabled = this.platforms.split(',').map(platform => platform.trim());
+        const order = [Socials.EMAIL, Socials.WHATSAPP, Socials.TWITTER, Socials.FACEBOOK];
+        const platforms = order.filter(platform => enabled.includes(platform));
+        const showCopy = enabled.includes(Socials.COPY_LINK);
+        return (h("div", { class: "s-social-share-modal", onClick: event => {
+                if (event.target === event.currentTarget) {
+                    void this.close();
+                }
+            } }, h("div", { class: "s-social-share-modal-dialog", role: "dialog", "aria-modal": "true" }, h("div", { class: "s-social-share-modal-handle", "aria-hidden": "true" }), h("div", { class: "s-social-share-modal-header" }, h("span", { class: "s-social-share-modal-title" }, this.getModalTitle()), h("button", { type: "button", class: "s-social-share-modal-close", "aria-label": salla.lang.get('common.elements.close'), onClick: () => this.close() }, h("span", { class: "s-social-share-modal-close-icon", innerHTML: Cancel }))), h("div", { class: "s-social-share-modal-platforms a2a_kit", "data-a2a-url": this.getShareUrl(), "data-a2a-title": this.urlName ? this.urlName : document.title }, platforms.map(platform => this.renderModalCard(platform))), showCopy && (h("div", { class: "s-social-share-modal-copy-row" }, h("span", { class: "s-social-share-modal-url", dir: "ltr" }, this.getShareUrl()), h("salla-button", { type: "button", fill: "outline", onClick: () => this.copyLink() }, this.copied
+            ? salla.lang.get('common.social.copied')
+            : salla.lang.get('common.social.copy')))))));
+    }
+    renderPopupList() {
+        return (h("ul", { class: {
+                's-social-share-list': true,
+                a2a_kit: true,
+                share: true,
+                opened: this.opened,
+            }, "data-a2a-url": this.getShareUrl(), "data-a2a-title": this.urlName ? this.urlName : document.title }, this.platforms.split(',').map(platform => {
+            return (h("li", null, h("a", { class: `a2a_button_${platform}`, "aria-label": `Share Via ${platform}` }, this.platformIcons.map((icon) => {
+                if (icon.name === platform) {
+                    return h("span", { class: "s-social-share-icon", innerHTML: icon.icon });
+                }
+            }))));
+        })));
+    }
+    render() {
+        return (h("div", { key: '56f669cd8567efe9f1a73e302d2d85be23dd901b', class: "s-social-share-wrapper" }, h("slot", { key: '2c1848fa62c1ec3b8301d0544cd8098ea647e2e7', name: "widget" }, h("salla-button", { key: '0a7ccac871963382f1c2fc594877b5445e5f8830', "aria-label": "Share", onClick: () => this.toggle(), class: "s-social-share-btn", shape: "icon", fill: "outline", color: "light" }, h("span", { key: '658cd0182e40140a73614ae477b43ff2e388e155', innerHTML: this.opened ? Cancel : ShareAlt }))), this.mode === 'modal' ? this.renderModal() : this.renderPopupList()));
+    }
+    get host() { return this; }
+    static get watchers() { return {
+        "url": ["onUrlChanged"]
+    }; }
+    static get style() { return sallaSocialShareCss; }
+}, [4, "salla-social-share", {
+        "url": [1537],
+        "urlName": [513, "url-name"],
+        "platforms": [513],
+        "mode": [513],
+        "modalTitle": [1, "modal-title"],
+        "opened": [32],
+        "copied": [32],
+        "allPlatforms": [32],
+        "platformIcons": [32],
+        "convertedPlatforms": [32],
+        "open": [64],
+        "close": [64],
+        "refresh": [64]
+    }, undefined, {
+        "url": ["onUrlChanged"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["salla-social-share", "salla-button"];
+    components.forEach(tagName => { switch (tagName) {
+        case "salla-social-share":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SallaSocialShare);
+            }
+            break;
+        case "salla-button":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { SallaSocialShare as S, defineCustomElement as d };

package/dist/components/salla-tab-content2.js

@@ -32,7 +32,7 @@ const SallaTabContent = /*@__PURE__*/ proxyCustomElement(class SallaTabContent e
             's-tabs-content': true,
             's-tabs-content-selected': this.isSelected
         };
-        return (h("div", { key: '8017c442a775f17fe6f5bf3c92dd083c9daa164e', class: classes }, h("slot", { key: '3be5606bf4ff8f3d3332f154333d4101d9dafdb5' })));
+        return (h("div", { key: 'f2deb9c1508aafe3aff5352094cccc97bdcd42ef', class: classes }, h("slot", { key: '460588864047444acdb06e757a7124d28935c24b' })));
     }
     static get style() { return sallaTabContentCss; }
 }, [4, "salla-tab-content", {

package/dist/components/salla-tab-header2.js

@@ -58,7 +58,7 @@ const SallaTabHeader = /*@__PURE__*/ proxyCustomElement(class SallaTabHeader ext
             's-tabs-active': this.isSelected,
         };
         return [
-            h("div", { key: '17847f97d80e9f52f460b7ebcc918736cafd757d', class: classes, onClick: this.onClick.bind(this) }, h("slot", { key: 'e936ad59f8255ec9ad713ecb69735404e741d294' })),
+            h("div", { key: '153247ab5a7c73819ccc506a45e60b9c084c391c', class: classes, onClick: this.onClick.bind(this) }, h("slot", { key: '417a3ae0c0aec8a965b5d3be9a4f917f290d2109' })),
         ];
     }
     static get style() { return sallaTabHeaderCss; }

package/dist/components/salla-tabs2.js

@@ -51,7 +51,7 @@ const SallaTabs = /*@__PURE__*/ proxyCustomElement(class SallaTabs extends HTMLE
     }
     render() {
         return [
-            h("div", { key: '2a76978734a3d8deeabbcfa7517b15a283d3071f', class: "s-tabs" }, h("div", { key: '0c565b46e62ed8fbcae0d9131619dbe83be61546', class: "s-tabs-header" }, h("slot", { key: '27ea98ff742bc51b75b35e0346733fb1c5b9526c', name: "header" })), h("div", { key: '9a76cba0e3c1f7ffb4c9d77d800ebc4d827e877c', class: "s-tabs-content-wrapper" }, h("slot", { key: '49ffe5586016252e8e3439a851c9aab0bf4e4079', name: "content" })))
+            h("div", { key: 'ae50836f68ee92459720fa9bf00d73848d849627', class: "s-tabs" }, h("div", { key: '55e8186e80381902269f9bad5738d9a555f71d37', class: "s-tabs-header" }, h("slot", { key: '46ce3e1ea75f92165b3d5ee7c16f19f8693f6d31', name: "header" })), h("div", { key: '3669e643abb37ed2edca73fc0577822a3f7fbb90', class: "s-tabs-content-wrapper" }, h("slot", { key: '2cf8b79f44630e21103991325ceff2cd3a4019ba', name: "content" })))
         ];
     }
     get host() { return this; }