@zanichelli/albe-web-components 19.2.2 → 19.2.3-RC1

package/dist/components/index8.js

@@ -1,63 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$2 } from './index5.js';
-import { d as defineCustomElement$1 } from './index10.js';
-
-const stylesCss = ":host{position:relative;display:flex;width:100%;height:232px;flex-direction:column;align-items:center;padding:calc(var(--space-unit) * 3);background-color:var(--color-surface02);background-image:repeating-linear-gradient(\n      0deg,\n      var(--color-surface03),\n      var(--color-surface03) 12px,\n      transparent 12px,\n      transparent 20px\n    ),\n    repeating-linear-gradient(\n      90deg,\n      var(--color-surface03),\n      var(--color-surface03) 12px,\n      transparent 12px,\n      transparent 20px\n    ),\n    repeating-linear-gradient(\n      180deg,\n      var(--color-surface03),\n      var(--color-surface03) 12px,\n      transparent 12px,\n      transparent 20px\n    ),\n    repeating-linear-gradient(\n      270deg,\n      var(--color-surface03),\n      var(--color-surface03) 12px,\n      transparent 12px,\n      transparent 20px\n    );background-position:0 0,\n    0 0,\n    100% 0,\n    0 100%;background-repeat:no-repeat;background-size:2px 100%,\n    100% 2px,\n    2px 100%,\n    100% 2px;border-radius:var(--border-radius-small);color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,*{box-sizing:border-box}:host(.dragover) *{pointer-events:none}.dragover-container{position:absolute;z-index:1;top:0;left:0;display:none;width:100%;height:100%;background-color:var(--color-primary03);box-shadow:var(--shadow-focus-primary)}:host(.dragover) .dragover-container{display:flex;align-items:center;justify-content:center}";
-const ZDragdropAreaStyle0 = stylesCss;
-
-const ZDragdropArea = /*@__PURE__*/ proxyCustomElement(class ZDragdropArea extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.fileDropped = createEvent(this, "fileDropped", 7);
-        this.dragAndDropLabel = undefined;
-        this.dragging = false;
-    }
-    onDrop(e) {
-        e.preventDefault();
-        this.dragging = false;
-        if (e.dataTransfer.files.length) {
-            this.fileDropped.emit(e.dataTransfer.files);
-        }
-    }
-    render() {
-        return (h(Host, { key: '32b072c1d8a73bfe406e587c2e9e0c7d43424615', class: { dragover: this.dragging }, onDragOver: (e) => {
-                e.preventDefault();
-                this.dragging = true;
-            }, onDragLeave: () => {
-                this.dragging = false;
-            }, onDrop: this.onDrop.bind(this) }, h("div", { key: '8312cab9a38f7c4258ef705945717fb8b8ef4b92', class: "dragover-container" }, h("z-button", { key: '36bdf4d0361043294b29c5e7a7102344f74c2b67' }, this.dragAndDropLabel)), h("slot", { key: '8e60d77a01a662095594b085656492e96ac3b445' })));
-    }
-    static get style() { return ZDragdropAreaStyle0; }
-}, [1, "z-dragdrop-area", {
-        "dragAndDropLabel": [1, "drag-and-drop-label"],
-        "dragging": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-dragdrop-area", "z-button", "z-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-dragdrop-area":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZDragdropArea);
-            }
-            break;
-        case "z-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-        case "z-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$1();
-            }
-            break;
-    } });
-}
-
-export { ZDragdropArea as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index8.js.map
+import{proxyCustomElement as s,HTMLElement as e,h as t,Host as a,transformTag as o}from"@stencil/core/internal/client";import{d as i}from"./index3.js";const c=s(class extends e{constructor(s){super(),!1!==s&&this.__registerHost(),this.__attachShadow(),this.statusIcons={success:"checkmark-circle",error:"multiply-circled",warning:"exclamation-circle"},this.statusRole={}}onMessageChange(){this.statusRole=this.message&&this.status?{role:"alert"}:{}}componentWillLoad(){this.onMessageChange()}render(){return t(a,Object.assign({key:"993f9d89fa3b3aaf359a203c3d16d5f512081513"},this.statusRole),this.statusIcons[this.status]&&this.message&&t("z-icon",{key:"048a39f0dd23a8343d3fa3f61bf05081d9bb09fa",name:this.statusIcons[this.status]}),t("span",{key:"19809d4c387a0ed73d8af548aa89e40f3dc4831e",innerHTML:this.message}))}static get watchers(){return{message:[{onMessageChange:0}],status:[{onMessageChange:0}]}}static get style(){return':host{display:flex;min-height:calc(var(--space-unit) * 2.5);align-items:start;margin-top:var(--space-unit);color:var(--color-default-text);fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-2);letter-spacing:0.16px}:host(.small),:host(.x-small){margin-top:calc(var(--space-unit) * 0.5);font-size:var(--font-size-1)}:host([status="success"]){color:var(--color-hover-success)}:host([status="error"]){color:var(--color-hover-error)}:host([status="warning"]){color:var(--color-hover-warning)}:host(:focus){outline:none}:host>z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);--z-icon-right-margin:var(--space-unit);margin-top:calc(var(--space-unit) * 0.25)}:host(.small)>z-icon,:host(.x-small)>z-icon{--z-icon-width:14px;--z-icon-height:14px;--z-icon-right-margin:calc(var(--space-unit) * 0.5)}:host([disabled]){color:var(--color-disabled03);fill:var(--color-disabled03)}'}},[1,"z-input-message",{message:[1],status:[513],disabled:[516],statusRole:[32]},void 0,{message:[{onMessageChange:0}],status:[{onMessageChange:0}]}]);function n(){"undefined"!=typeof customElements&&["z-input-message","z-icon"].forEach((s=>{switch(s){case"z-input-message":customElements.get(o(s))||customElements.define(o(s),c);break;case"z-icon":customElements.get(o(s))||i()}}))}export{c as Z,n as d}

package/dist/components/index9.js

@@ -1,33 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-
-const stylesCss = ":host{display:inline-block;overflow:hidden;width:100%;height:100%;background:var(--color-surface02);border-radius:var(--border-radius);transform:translate3d(0, 0, 0)}:host::after{display:block;width:100%;height:100%;animation:progress 1.6s ease-in-out infinite;background-image:linear-gradient(\n    90deg,\n    var(--color-surface02) 0%,\n    var(--color-surface03) 95%,\n    var(--color-surface02) 100%\n  );content:\"\";filter:blur(6px)}@keyframes progress{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}";
-const ZGhostLoadingStyle0 = stylesCss;
-
-const ZGhostLoading = /*@__PURE__*/ proxyCustomElement(class ZGhostLoading extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-    }
-    render() {
-        return h(Host, { key: '597d6715119bb24d4a8427f9cb3ebd3b5a20f5fc' });
-    }
-    static get style() { return ZGhostLoadingStyle0; }
-}, [1, "z-ghost-loading"]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-ghost-loading"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-ghost-loading":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZGhostLoading);
-            }
-            break;
-    } });
-}
-
-export { ZGhostLoading as Z, defineCustomElement as d };
-
-//# sourceMappingURL=index9.js.map
+import{proxyCustomElement as t,HTMLElement as e,h as s,Host as i,transformTag as n}from"@stencil/core/internal/client";import{i as o,m as l}from"./index2.js";const r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.size=o.MEDIUM,this.listType=l.NONE,this.role="list"}setChildrenSizeType(){const t=this.host.children;for(let e=0;e<t.length;e++)t[e].setAttribute("size",this.size),t[e].setAttribute("list-type",this.listType),t[e].setAttribute("list-element-position",(e+1).toString())}componentDidLoad(){this.setChildrenSizeType()}render(){return s(i,{key:"f34729eb14ef690bf0aeb7da4b406e955a66fbf7"},s("slot",{key:"82b4a9c72937797bb8f7e4141f7a4c609908c702"}))}get host(){return this}static get style(){return":host{display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}"}},[257,"z-list",{size:[513],listType:[513,"list-type"],role:[513]}]);function f(){"undefined"!=typeof customElements&&["z-list"].forEach((t=>{"z-list"===t&&(customElements.get(n(t))||customElements.define(n(t),r))}))}export{r as Z,f as d}

package/dist/components/utils.js

@@ -1,246 +1 @@
-import { p as Device, g as KeyboardCode } from './index2.js';
-import { B as Breakpoints } from './breakpoints.js';
-
-/**
- * Return boolean value for passed value if a boolean corresponding value is found
- * Return passed value otherwise
- */
-function boolean(value) {
-    switch (value) {
-        case true:
-        case "true":
-        case 1:
-        case "1":
-        case "on":
-        case "yes":
-            return true;
-        case false:
-        case "false":
-        case 0:
-        case "0":
-        case "off":
-        case "no":
-            return false;
-        default:
-            return value;
-    }
-}
-function randomId() {
-    return Math.random().toString(36).replace("0.", "");
-}
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function handleKeyboardSubmit(ev, callback, ...args) {
-    if (ev.code === KeyboardCode.ENTER || ev.code === KeyboardCode.SPACE) {
-        ev.preventDefault();
-        callback(...args);
-    }
-}
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-function handleEnterKeydSubmit(ev, callback, ...args) {
-    if (ev.code === KeyboardCode.ENTER) {
-        ev.preventDefault();
-        callback(...args);
-    }
-}
-function getClickedElement(elem = null) {
-    if (!elem) {
-        elem = document.activeElement;
-    }
-    if (elem && elem.shadowRoot && elem.shadowRoot.activeElement) {
-        elem = elem.shadowRoot.activeElement;
-        return getClickedElement(elem);
-    }
-    return elem;
-}
-function getElementTree(elem, tree = []) {
-    tree.push(elem);
-    if (elem.parentElement) {
-        elem = elem.parentElement;
-        return getElementTree(elem, tree);
-    }
-    else if (elem.parentNode && elem.parentNode.host) {
-        elem = elem.parentNode.host;
-        return getElementTree(elem, tree);
-    }
-    return tree;
-}
-/**
- * Get the current device type based on the window width.
- * @returns {Device} - The current device type
- */
-function getDevice() {
-    switch (true) {
-        case window.innerWidth <= Breakpoints.MOBILE:
-            return Device.MOBILE;
-        case window.innerWidth <= Breakpoints.TABLET:
-            return Device.TABLET;
-        case window.innerWidth <= Breakpoints.DESKTOP:
-            return Device.DESKTOP;
-        default:
-            return Device.DESKTOP_WIDE;
-    }
-}
-function convertJson(data) {
-    try {
-        return JSON.parse(data);
-    }
-    catch (_a) {
-        return false;
-    }
-}
-function colorFromId(id) {
-    const prefix = "avatar-C"; // prefix for color vars name
-    const colorsCount = 19; // available colors
-    const seed = Math.ceil(2 ** 31 - 1) * parseFloat(`0.${id}`);
-    let color = Math.ceil(colorsCount * (seed % 1));
-    // if result of mc is 0
-    // es.: 3895229
-    if (color === 0) {
-        color = 1;
-    }
-    return `${prefix}${color.toString().padStart(2, "0")}`;
-}
-/**
- * Check if an element contains another element, checking both light and shadow DOM recursively.
- * This function also checks slot assignments, so it correctly handles nested slots across components.
- * @param ancestor Ancestor element
- * @param descendant Descendant element
- */
-function containsElement(ancestor, descendant) {
-    var _a;
-    if (ancestor.contains(descendant) || ((_a = ancestor.shadowRoot) === null || _a === void 0 ? void 0 : _a.contains(descendant))) {
-        return true;
-    }
-    const checkRecursive = (node) => {
-        if (node === descendant) {
-            return true;
-        }
-        const shadowRoot = node.shadowRoot;
-        if (!shadowRoot) {
-            // Check light DOM children only
-            return Array.from(node.childNodes).some(checkRecursive);
-        }
-        if (shadowRoot.contains(descendant)) {
-            return true;
-        }
-        // Check slot assigned nodes
-        const hasDescendantInAssignedNodes = Array.from(shadowRoot.querySelectorAll("slot")).some((slot) => slot
-            .assignedNodes({ flatten: true })
-            .some((assigned) => { var _a, _b; return ((_b = (_a = assigned).contains) === null || _b === void 0 ? void 0 : _b.call(_a, descendant)) || checkRecursive(assigned); }));
-        if (hasDescendantInAssignedNodes) {
-            return true;
-        }
-        // Check shadow and light DOM children
-        return Array.from(shadowRoot.children).some(checkRecursive) || Array.from(node.childNodes).some(checkRecursive);
-    };
-    return checkRecursive(ancestor);
-}
-/** Get the parent of passed element, accounting for shadow DOM.
- * @param element The element whose parent is to be found.
- */
-function getParentElement(element) {
-    // If the element is slotted, the direct rendered parent is the target slot in shadow DOM.
-    if (element.assignedSlot) {
-        return element.assignedSlot;
-    }
-    // If the element is in a shadow root, the parent is the shadow host.
-    if (element.parentNode instanceof ShadowRoot) {
-        return element.parentNode.host;
-    }
-    // Otherwise fall back to standard light DOM parent.
-    return element.parentElement;
-}
-/**
- * Check if the `element` is visible within the `container` or in the viewport.
- * @param element The element to check.
- * @param container The container to check against, which must be the nearest scrollable ancestor.
- */
-function isElementVisibleInContainer(element, container) {
-    const elemRect = element.getBoundingClientRect();
-    const documentWidth = element.ownerDocument.documentElement.clientWidth;
-    const documentHeight = element.ownerDocument.documentElement.clientHeight;
-    // Check if element is visible in viewport
-    const isVisibleInViewport = elemRect.bottom > 0 && elemRect.top < documentHeight && elemRect.right > 0 && elemRect.left < documentWidth;
-    // If container is the document element, only check viewport visibility
-    if (container === element.ownerDocument.documentElement || container === element.ownerDocument.body) {
-        return isVisibleInViewport;
-    }
-    // For other containers, check both container and viewport visibility
-    const containerRect = container.getBoundingClientRect();
-    const isVisibleInContainer = elemRect.bottom > containerRect.top &&
-        elemRect.top < containerRect.bottom &&
-        elemRect.right > containerRect.left &&
-        elemRect.left < containerRect.right;
-    return isVisibleInContainer && isVisibleInViewport;
-}
-/**
- * Find the nearest containing block ancestor of an element.
- * The containing block is determined based on the element's `position` value:
- * - `static`, `sticky` or `relative`: nearest block container or root
- * - `absolute`: nearest ancestor with `position` != `static`
- * - `fixed`: nearest ancestor with properties that create a containing block (`transform`, `filter`, `will-change`, `backdrop-filter`, `perspective`, etc.).
- * An ancestor with these properties will create a containing block for fixed positioned elements, making them behave like absolute positioned elements relative to that ancestor.
- *
- * @link https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Display/Containing_block#identifying_the_containing_block
- * @param element The element for which to find the containing block
- * @returns The containing block element if any, or the `documentElement`
- */
-function findContainingBlockAncestor(element) {
-    let parent = getParentElement(element);
-    const elementPosition = window.getComputedStyle(element).position;
-    while (parent && parent !== element.ownerDocument.documentElement) {
-        const parentStyle = window.getComputedStyle(parent);
-        switch (elementPosition) {
-            case "fixed": {
-                const affectingProperties = [
-                    "filter",
-                    "transform",
-                    "translate",
-                    "perspective",
-                    "scale",
-                    "rotate",
-                    "backdrop-filter",
-                ];
-                if (affectingProperties.some((property) => parentStyle.getPropertyValue(property) !== "none") ||
-                    affectingProperties.some((property) => parentStyle.getPropertyValue("will-change").includes(property))) {
-                    return parent;
-                }
-                break;
-            }
-            case "absolute":
-                if (parentStyle.position !== "static") {
-                    return parent;
-                }
-                break;
-            // Handle position: static, relative, sticky (they all look for the nearest block container or root)
-            case "relative":
-            case "sticky":
-            case "static": {
-                const display = window.getComputedStyle(parent).display;
-                // Block containers: block, flex, grid, table, flow-root
-                if (display === "block" ||
-                    display === "flex" ||
-                    display === "grid" ||
-                    display === "table" ||
-                    display === "flow-root" ||
-                    display === "inline-block" ||
-                    display === "inline-flex" ||
-                    display === "inline-grid") {
-                    return parent;
-                }
-                break;
-            }
-        }
-        parent = getParentElement(parent);
-    }
-    return element.ownerDocument.documentElement;
-}
-/** Convert HTML to plain text */
-const getPlainText = (html) => {
-    const doc = new DOMParser().parseFromString(html, "text/html");
-    return doc.body.textContent || "";
-};
-
-export { containsElement as a, getPlainText as b, colorFromId as c, boolean as d, getElementTree as e, getClickedElement as f, getDevice as g, handleKeyboardSubmit as h, convertJson as i, getParentElement as j, findContainingBlockAncestor as k, isElementVisibleInContainer as l, handleEnterKeydSubmit as m, randomId as r };
-
-//# sourceMappingURL=utils.js.map
+import{p as t,g as n}from"./index2.js";import{B as r}from"./breakpoints.js";function e(t){switch(t){case!0:case"true":case 1:case"1":case"on":case"yes":return!0;case!1:case"false":case 0:case"0":case"off":case"no":return!1;default:return t}}function a(){return Math.random().toString(36).replace("0.","")}function s(t,r,...e){t.code!==n.ENTER&&t.code!==n.SPACE||(t.preventDefault(),r(...e))}function c(t,r,...e){t.code===n.ENTER&&(t.preventDefault(),r(...e))}function o(t=null){return t||(t=document.activeElement),t&&t.shadowRoot&&t.shadowRoot.activeElement?o(t=t.shadowRoot.activeElement):t}function i(t,n=[]){return n.push(t),t.parentElement?i(t=t.parentElement,n):t.parentNode&&t.parentNode.host?i(t=t.parentNode.host,n):n}function u(){switch(!0){case window.innerWidth<=r.MOBILE:return t.MOBILE;case window.innerWidth<=r.TABLET:return t.TABLET;case window.innerWidth<=r.DESKTOP:return t.DESKTOP;default:return t.DESKTOP_WIDE}}function f(t){try{return JSON.parse(t)}catch(t){return!1}}function l(t){const n=Math.ceil(2**31-1)*parseFloat(`0.${t}`);let r=Math.ceil(n%1*19);return 0===r&&(r=1),`avatar-C${r.toString().padStart(2,"0")}`}function d(t,n){var r;if(t.contains(n)||(null===(r=t.shadowRoot)||void 0===r?void 0:r.contains(n)))return!0;const e=t=>{if(t===n)return!0;const r=t.shadowRoot;if(!r)return Array.from(t.childNodes).some(e);if(r.contains(n))return!0;const a=Array.from(r.querySelectorAll("slot")).some((t=>t.assignedNodes({flatten:!0}).some((t=>{var r,a;return(null===(a=(r=t).contains)||void 0===a?void 0:a.call(r,n))||e(t)}))));return!!a||Array.from(r.children).some(e)||Array.from(t.childNodes).some(e)};return e(t)}function w(t){return t.assignedSlot?t.assignedSlot:t.parentNode instanceof ShadowRoot?t.parentNode.host:t.parentElement}function h(t,n){const r=t.getBoundingClientRect(),e=r.bottom>0&&r.top<t.ownerDocument.documentElement.clientHeight&&r.right>0&&r.left<t.ownerDocument.documentElement.clientWidth;if(n===t.ownerDocument.documentElement||n===t.ownerDocument.body)return e;const a=n.getBoundingClientRect();return r.bottom>a.top&&r.top<a.bottom&&r.right>a.left&&r.left<a.right&&e}function b(t){let n=w(t);const r=window.getComputedStyle(t).position;for(;n&&n!==t.ownerDocument.documentElement;){const t=window.getComputedStyle(n);switch(r){case"fixed":{const r=["filter","transform","translate","perspective","scale","rotate","backdrop-filter"];if(r.some((n=>"none"!==t.getPropertyValue(n)))||r.some((n=>t.getPropertyValue("will-change").includes(n))))return n;break}case"absolute":if("static"!==t.position)return n;break;case"relative":case"sticky":case"static":{const t=window.getComputedStyle(n).display;if("block"===t||"flex"===t||"grid"===t||"table"===t||"flow-root"===t||"inline-block"===t||"inline-flex"===t||"inline-grid"===t)return n;break}}n=w(n)}return t.ownerDocument.documentElement}const k=t=>(new DOMParser).parseFromString(t,"text/html").body.textContent||"";export{d as a,k as b,l as c,e as d,o as e,i as f,u as g,s as h,f as i,w as j,b as k,h as l,c as m,a as r}