legalesign-document-viewer 0.10.4 → 0.10.6

package/dist/components/p-Bu_qPd2i.js

@@ -0,0 +1,280 @@
+import { t as transformTag, p as proxyCustomElement, H, h, c as Host } from './p-DffaAVW4.js';
+import { d as dvI18n } from './p-SDy1UUFt.js';
+import { d as defaultRolePalette } from './p-BKrsDBDB.js';
+import { d as defineCustomElement$4 } from './p-D__F-KI0.js';
+import { d as defineCustomElement$3 } from './p-BT5rCW3w.js';
+import { d as defineCustomElement$2 } from './p-CHg2JLwv.js';
+import { d as defineCustomElement$1 } from './p-CLhWLPwT.js';
+
+const version = "0.10.6";
+
+const lsStatusbarCss = () => `:host{position:fixed;z-index:1000;right:1rem;bottom:1rem;display:flex;flex-direction:row;gap:0.5rem;align-items:end;height:2.25rem;overflow:visible}.ls-dv-controls-bar{display:flex;flex-direction:row;background-color:white;border:1px solid var(--gray-30, #e0e2e5);box-shadow:0px 4px 16px rgba(0, 0, 0, 0.1);border-radius:1.125rem}*{margin:0;padding:0;box-sizing:border-box}.ls-dv-status-bar-section{display:flex;flex-direction:row;align-items:center;gap:0.75rem;padding:0 0.75rem;height:2.25rem}.ls-dv-controls-bar>:not(:nth-child(1)){border-left:1px solid var(--gray-30, #e0e2e5)}button{border:0}button:hover{color:var(--gray-100, #45484d);border-radius:0.625rem}button:disabled{color:var(--gray-40, #d8d9dc);cursor:not-allowed}input[type=range]{-webkit-appearance:none;width:100%;height:0.5rem;background:var(--gray-20, #edeff2);border-radius:0.25rem;outline:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:0.5rem;height:0.5rem;background:var(--gray-70, #939599);border-radius:50%;cursor:pointer}input[type=range]::-moz-range-thumb{width:0.5rem;height:0.5rem;background:var(--gray-70, #939599);border:none;border-radius:50%;cursor:pointer}input[type=range]::-moz-range-track{background:var(--gray-20, #edeff2);height:0.5rem;border-radius:0.25rem}input[type=range]::-webkit-slider-runnable-track{background:var(--gray-20, #edeff2);height:0.5rem;border-radius:0.25rem}p{color:var(--gray-80, #6f7176);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}span{color:var(--gray-80, #6f7176);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-input-wrapper{position:relative;width:fit-content}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}.ls-dv-has-leading-icon{padding-left:2.5rem}button{all:unset;border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--gray-80, #6f7176);text-transform:capitalize}button.ls-dv-tertiary-grey:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip}.ls-dv-button-group button{display:flex;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;min-height:unset;color:var(--gray-80, #6f7176)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}.ls-dv-zoom-level-btn{font-family:var(--font-family);font-size:var(--text-sm);font-weight:400;color:var(--gray-80, #6f7176);padding:0.25rem 0.375rem;border-radius:0.25rem;margin:0 -0.25rem}.ls-dv-zoom-level-btn:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-zoom-menu{position:absolute;width:6rem;bottom:3rem;left:1.5rem;background:white;border:1px solid var(--gray-30, #e0e2e5);border-radius:1rem;box-shadow:0px 4px 24px rgba(0, 0, 0, 0.12);padding:0.25rem;z-index:1001;display:flex;flex-direction:column;gap:0.25rem}.ls-dv-page-menu{left:auto;max-height:60cqh;overflow-y:auto}.ls-dv-zoom-menu-item{position:relative;font-family:var(--font-family);font-size:var(--text-sm);font-weight:400;color:var(--gray-80, #6f7176);padding:0.375rem 0.625rem;border-radius:0.825rem;display:flex;align-items:center;justify-content:space-between}.ls-dv-zoom-menu-item:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-zoom-menu-item.active{font-weight:500;color:var(--primary-70, #2134dc);background:var(--primary-10, #eff4ff)}.ls-dv-thumbnail-popover{position:absolute;bottom:3rem;right:0;background:white;border:1px solid var(--gray-30, #e0e2e5);border-radius:1.75rem;box-shadow:0px 8px 24px rgba(0, 0, 0, 0.15);padding:0.75rem;z-index:1001;max-height:80vh;overflow:hidden;display:flex;flex-direction:column}.ls-dv-thumbnail-grid{background:var(--gray-10, #f7f8fa);padding:0.75rem;border-radius:1rem;border:1px solid var(--gray-30, #e0e2e5);display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:1rem;overflow-y:auto;max-height:100%}.ls-dv-thumbnail-wrapper{display:flex;flex-direction:column;align-items:center;gap:0.25rem;cursor:pointer}.ls-dv-thumbnail-wrapper>span:last-child{font-size:var(--text-xs, 0.75rem);color:var(--gray-80, #6f7176);font-weight:500}.ls-dv-thumbnail{border:1px solid var(--gray-30, #e0e2e5);border-radius:0.5rem;cursor:pointer;transition:border-color 0.15s}.ls-dv-thumbnail:hover{border-color:var(--primary-40, #79adfc);box-shadow:0 0 0 2px rgba(163, 180, 249, 0.3)}.ls-dv-thumbnail.active{border-color:var(--primary-60, #4456f6);outline:0.25rem solid var(--primary-30, #9dc3fc);box-shadow:var(--shadow-md)}.ls-dv-thumbnail-dots{display:flex;gap:3px;justify-content:center;flex-wrap:wrap;margin-top:0.25rem}.ls-dv-thumbnail-dot{width:0.5rem;height:0.5rem;border-radius:50%;display:inline-block;border:2px solid var(--dot-color-60);background-color:var(--dot-color-40);cursor:pointer;transition:background-color 0.15s, border-color 0.15s}.ls-dv-thumbnail-dot:hover{background-color:var(--dot-color-60);border-color:var(--dot-color-70)}.ls-dv-version{position:absolute;bottom:100%;right:0;color:var(--gray-50, #afb0b2);font-size:0.625rem;padding-bottom:0.25rem}`;
+
+const LsStatusbar = /*@__PURE__*/ proxyCustomElement(class LsStatusbar extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    get component() { return this; }
+    /**
+     * The zoom or scale level 100 === 100%.
+     * {number}
+     */
+    zoom;
+    page;
+    pageCount;
+    showThumbnails = false;
+    showZoomMenu = false;
+    showPageMenu = false;
+    /**
+     * The parent editor control.
+     * {LsDocumentViewer}
+     */
+    editor;
+    setZoom(value) {
+        this.editor.setZoom(value);
+        this.zoom = value;
+    }
+    fitWidth() {
+        const wrapper = this.editor.component.shadowRoot.getElementById('document-frame-wrapper');
+        const scale = (wrapper.clientWidth - 396) / this.editor.pageDimensions[this.editor.pageNum - 1].width;
+        this.setZoom(Math.round(scale * 1e2) / 1e2);
+    }
+    fitHeight() {
+        const wrapper = this.editor.component.shadowRoot.getElementById('document-frame-wrapper');
+        const scale = (wrapper.clientHeight - 94) / this.editor.pageDimensions[this.editor.pageNum - 1].height;
+        this.setZoom(Math.round(scale * 1e2) / 1e2);
+    }
+    goToPage(pageNum) {
+        const diff = pageNum - this.editor.pageNum;
+        if (diff > 0) {
+            for (let i = 0; i < diff; i++)
+                this.editor.pageNext();
+        }
+        else {
+            for (let i = 0; i < Math.abs(diff); i++)
+                this.editor.pagePrev();
+        }
+        this.page = pageNum;
+        this.renderThumbnails();
+    }
+    getPageFieldColors(pageNum) {
+        const template = this.editor._template;
+        if (!template?.elementConnection?.templateElements)
+            return [];
+        const fields = template.elementConnection.templateElements.filter(el => el.page === pageNum);
+        const signerCounts = new Map();
+        fields.forEach(el => signerCounts.set(el.signer, (signerCounts.get(el.signer) || 0) + 1));
+        return Array.from(signerCounts.entries())
+            .sort(([a], [b]) => {
+            const baseA = a % 100;
+            const baseB = b % 100;
+            if (baseA !== baseB)
+                return baseA - baseB;
+            return a - b;
+        })
+            .map(([s, count]) => {
+            const role = template.roles?.find(r => r.signerIndex === s);
+            const colorIndex = s % 100;
+            return {
+                s40: defaultRolePalette[colorIndex]?.s40 || defaultRolePalette[0].s40,
+                s60: defaultRolePalette[colorIndex]?.s60 || defaultRolePalette[0].s60,
+                s70: defaultRolePalette[colorIndex]?.s70 || defaultRolePalette[0].s70,
+                name: role?.name || `Participant ${s}`,
+                count,
+            };
+        });
+    }
+    renderThumbnails() {
+        const pdfDoc = this.editor.pdfDocument;
+        if (!pdfDoc)
+            return;
+        const container = this.component.shadowRoot.getElementById('ls-thumbnail-container');
+        if (!container)
+            return;
+        container.innerHTML = '';
+        for (let i = 1; i <= this.pageCount; i++) {
+            pdfDoc.getPage(i).then(page => {
+                const viewport = page.getViewport({ scale: 0.2 });
+                const canvas = document.createElement('canvas');
+                canvas.width = viewport.width;
+                canvas.height = viewport.height;
+                canvas.className = i === this.page ? 'ls-dv-thumbnail active' : 'ls-dv-thumbnail';
+                canvas.addEventListener('click', () => this.goToPage(i));
+                const wrapper = document.createElement('div');
+                wrapper.className = 'ls-dv-thumbnail-wrapper';
+                wrapper.addEventListener('click', () => this.goToPage(i));
+                const dots = document.createElement('div');
+                dots.className = 'ls-dv-thumbnail-dots';
+                this.getPageFieldColors(i).forEach(color => {
+                    const dot = document.createElement('span');
+                    dot.className = 'ls-dv-thumbnail-dot';
+                    dot.setAttribute('data-tooltip-id', 'ls-dv-tooltip');
+                    dot.setAttribute('data-tooltip-content', `${color.name}, ${color.count} Field${color.count !== 1 ? 's' : ''}`);
+                    dot.style.setProperty('--dot-color-40', color.s40);
+                    dot.style.setProperty('--dot-color-60', color.s60);
+                    dot.style.setProperty('--dot-color-70', color.s70);
+                    dots.appendChild(dot);
+                });
+                const label = document.createElement('span');
+                label.textContent = `${i}`;
+                wrapper.appendChild(canvas);
+                wrapper.appendChild(dots);
+                wrapper.appendChild(label);
+                container.appendChild(wrapper);
+                // Render after appending to DOM — Safari requires the canvas to be
+                // in the visible tree before getContext/render produces output.
+                const ctx = canvas.getContext('2d');
+                page.render({ canvasContext: ctx, viewport }).promise.then(() => {
+                    // Force Safari to composit the canvas by toggling a style property
+                    canvas.style.opacity = '0.99';
+                    requestAnimationFrame(() => { canvas.style.opacity = '1'; });
+                });
+            });
+        }
+    }
+    outsideClickHandler = (e) => {
+        const path = e.composedPath();
+        if (!path.includes(this.component)) {
+            this.showThumbnails = false;
+            this.showZoomMenu = false;
+            this.showPageMenu = false;
+            document.removeEventListener('click', this.outsideClickHandler);
+        }
+    };
+    zoomMenuClickHandler = (e) => {
+        const path = e.composedPath();
+        const menu = this.component.shadowRoot.getElementById('ls-zoom-menu');
+        const btn = this.component.shadowRoot.getElementById('zoom-level-btn');
+        if (!path.includes(menu) && !path.includes(btn)) {
+            this.showZoomMenu = false;
+            document.removeEventListener('click', this.zoomMenuClickHandler, true);
+        }
+    };
+    pageMenuClickHandler = (e) => {
+        const path = e.composedPath();
+        const menu = this.component.shadowRoot.getElementById('ls-page-menu');
+        const btn = this.component.shadowRoot.getElementById('page-level-btn');
+        if (!path.includes(menu) && !path.includes(btn)) {
+            this.showPageMenu = false;
+            document.removeEventListener('click', this.pageMenuClickHandler, true);
+        }
+    };
+    componentDidLoad() {
+        this.zoom = this.editor.zoom;
+    }
+    onPageChange() {
+        if (this.showThumbnails) {
+            this.renderThumbnails();
+            requestAnimationFrame(() => {
+                const container = this.component.shadowRoot.getElementById('ls-thumbnail-container');
+                const wrapper = container?.querySelector('.ls-dv-thumbnail.active')?.closest('.ls-dv-thumbnail-wrapper');
+                if (wrapper && container) {
+                    const gap = 12; // 0.75rem
+                    const wrapperTop = wrapper.offsetTop - container.offsetTop;
+                    const wrapperBottom = wrapperTop + wrapper.offsetHeight;
+                    const scrollTop = container.scrollTop;
+                    const viewHeight = container.clientHeight;
+                    if (wrapperTop - gap < scrollTop) {
+                        container.scrollTo({ top: wrapperTop - gap, behavior: 'smooth' });
+                    }
+                    else if (wrapperBottom + gap > scrollTop + viewHeight) {
+                        container.scrollTo({ top: wrapperBottom + gap - viewHeight, behavior: 'smooth' });
+                    }
+                }
+            });
+        }
+    }
+    render() {
+        return (h(Host, { key: '922e3acc8a05f82d35e381d4b7910dffe13f7b3c' }, h("div", { key: '057fa05ca84488b8fe63439cd2acddafb1a9bb89', class: 'ls-dv-controls-bar' }, h("div", { key: 'c94f205f898ef88f7cbe4a65fcc412340df636fe', class: 'ls-dv-status-bar-section' }, h("button", { key: 'f85104b5410d72808ef82c0089c106b7fb3bcd2e', onClick: () => this.setZoom(this.editor.zoom * 0.8), id: "zoom-out-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": dvI18n.t('statusbar.zoomout') }, h("ls-icon", { key: '17187bd9efe05bff05007fc4a3a6d12e83dcac67', name: "zoom-out-icon" })), h("button", { key: 'e3f60b5b62b5db99a5c6897f24aa568ec1aa5be1', id: "zoom-level-btn", class: "ls-dv-zoom-level-btn", onClick: () => {
+                this.showZoomMenu = !this.showZoomMenu;
+                if (this.showZoomMenu) {
+                    requestAnimationFrame(() => document.addEventListener('click', this.zoomMenuClickHandler, true));
+                }
+                else {
+                    document.removeEventListener('click', this.zoomMenuClickHandler, true);
+                }
+            } }, Math.round(this.zoom * 100), "%"), this.showZoomMenu && (h("div", { key: 'f037a8cd3ecc617b5a5113803c0312d24270366e', id: "ls-zoom-menu", class: "ls-dv-zoom-menu" }, [2, 1.75, 1.5, 1.25, 1, 0.75, 0.5, 0.25].map(level => (h("button", { class: { 'ls-dv-zoom-menu-item': true, 'active': Math.round(this.zoom * 100) === Math.round(level * 100) }, onClick: () => { this.setZoom(level); this.showZoomMenu = false; document.removeEventListener('click', this.zoomMenuClickHandler, true); } }, Math.round(level * 100), "%", Math.round(this.zoom * 100) === Math.round(level * 100) && h("ls-icon", { name: "check-icon", size: 14 })))))), h("button", { key: '422e1ca5790f957d7dc27c51b756429176eb9858', onClick: () => this.setZoom(this.editor.zoom / 0.8), id: "zoom-in-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": dvI18n.t('statusbar.zoomin') }, h("ls-icon", { key: 'fa993f97ddb0c2a2ffecef1259a9a092e02d3ea7', name: "zoom-in-icon" }))), h("div", { key: '37d2cc8be8f198ed35b790992fbc1cd3c3244288', class: 'ls-dv-status-bar-section' }, h("button", { key: '9f2abc2e2e8414f1f6db626ac60acfcee632f77c', onClick: () => this.fitWidth(), id: "fit-width-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": dvI18n.t('statusbar.fitwidth') }, h("ls-icon", { key: 'da73abc5323bd23f964bb43531d3e8d085e17628', name: "fit-width-icon" })), h("button", { key: '1275d663ebf86abc7b438e36a421b85ce6411310', onClick: () => this.fitHeight(), id: "fit-height-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": dvI18n.t('statusbar.fitheight') }, h("ls-icon", { key: '8fdb01cf15dea8abd85b0b796e425e9507209be3', name: "fit-height-icon" }))), h("div", { key: '3691e3df06eb42b9239b1042ee46efe45f3e27a0', class: 'ls-dv-status-bar-section', style: this.pageCount === 1 && { display: 'none' } }, h("button", { key: 'f9898e269e799917e79821d96b8ea371e62e5519', onClick: () => {
+                this.editor.pagePrev();
+            }, disabled: this.page === 1, id: "prev-page-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": this.page === 1 ? dvI18n.t('statusbar.nopreviouspage') : dvI18n.t('statusbar.previouspage') }, h("ls-icon", { key: '6a9a0892e93fafd0ba2f9fc6e374fe7ceaf7bcf8', name: "chevron-left-icon" })), h("button", { key: '799d4596133b4de3ea81d0058e965c8cdb78f5ae', id: "page-level-btn", class: "ls-dv-zoom-level-btn", onClick: () => {
+                this.showPageMenu = !this.showPageMenu;
+                if (this.showPageMenu) {
+                    requestAnimationFrame(() => document.addEventListener('click', this.pageMenuClickHandler, true));
+                }
+                else {
+                    document.removeEventListener('click', this.pageMenuClickHandler, true);
+                }
+            } }, this.page, " / ", this.pageCount), this.showPageMenu && (h("div", { key: '08e2e3decde09732589c248d327310ca69d30483', id: "ls-page-menu", class: "ls-dv-zoom-menu ls-dv-page-menu", style: { right: `${this.showThumbnails ? 11.5 : 7}rem` } }, Array.from({ length: this.pageCount }, (_, i) => i + 1).map(p => (h("button", { class: { 'ls-dv-zoom-menu-item': true, 'active': this.page === p }, onClick: () => { this.goToPage(p); this.showPageMenu = false; document.removeEventListener('click', this.pageMenuClickHandler, true); } }, p, this.page === p && h("ls-icon", { name: "check-icon", size: 14 })))))), h("button", { key: '4ffcfd7425d558e50d440f385313c50c83c1a4d2', onClick: () => {
+                this.editor.pageNext();
+            }, disabled: this.page === this.pageCount, id: "next-page-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": this.page === this.pageCount ? dvI18n.t('statusbar.nonextpage') : dvI18n.t('statusbar.nextpage') }, h("ls-icon", { key: 'b525a67bbfbf509059189a6871c2ce91e327ff41', name: "chevron-right-icon" }))), h("div", { key: 'b1f6bf8613ab7cd183244e1e9dec5cd2567393a3', class: 'ls-dv-status-bar-section', style: this.pageCount === 1 ? { display: 'none' } : {} }, h("button", { key: '3636cae5973d769167bff0ef77d9f791ec669884', onClick: () => {
+                this.showThumbnails = !this.showThumbnails;
+                if (this.showThumbnails) {
+                    requestAnimationFrame(() => {
+                        requestAnimationFrame(() => {
+                            this.renderThumbnails();
+                            document.addEventListener('click', this.outsideClickHandler);
+                        });
+                    });
+                }
+                else {
+                    document.removeEventListener('click', this.outsideClickHandler);
+                }
+            }, id: "page-thumbnails-btn", "data-tooltip-id": "ls-dv-tooltip", "data-tooltip-content": dvI18n.t('statusbar.pagethumbnails') }, h("ls-icon", { key: '2809cf031135a38e445b26fb48ef1388bbb6ab45', name: !this.showThumbnails ? 'side-panel-open-right-icon' : 'side-panel-close-right-icon' }))), this.showThumbnails && (h("div", { key: '70d936ebc998d219f0076228b0cf5b65271b8d1b', class: "ls-dv-thumbnail-popover" }, h("div", { key: '953a5ade1c9d4d341d380e45e0580b76a501f878', id: "ls-thumbnail-container", class: "ls-dv-thumbnail-grid" })))), h("ls-helper-bar", { key: '3622da60f2c3a6773b76edf07dbb63c2e1f7538b' }), h("span", { key: '3f9211b0fe75469171b8f16fa8e2cfd75a218a58', class: "ls-dv-version" }, "v", version), h("ls-tooltip", { key: '5c7fad29e07c7b69e67b61fc58b1afcc9849b3af', tooltipId: "ls-dv-tooltip" }), h("slot", { key: '90c80c1ceae433060032c14ffe3e8cf053676e8b' })));
+    }
+    static get watchers() { return {
+        "page": ["onPageChange"]
+    }; }
+    static get style() { return lsStatusbarCss(); }
+}, [769, "ls-statusbar", {
+        "zoom": [1026],
+        "page": [1026],
+        "pageCount": [1026, "page-count"],
+        "editor": [16],
+        "showThumbnails": [32],
+        "showZoomMenu": [32],
+        "showPageMenu": [32]
+    }, undefined, {
+        "page": ["onPageChange"]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ls-statusbar", "ls-helper-bar", "ls-icon", "ls-keyboard-shortcuts", "ls-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ls-statusbar":
+            if (!customElements.get(transformTag(tagName))) {
+                customElements.define(transformTag(tagName), LsStatusbar);
+            }
+            break;
+        case "ls-helper-bar":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$4();
+            }
+            break;
+        case "ls-icon":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ls-keyboard-shortcuts":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$2();
+            }
+            break;
+        case "ls-tooltip":
+            if (!customElements.get(transformTag(tagName))) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { LsStatusbar as L, defineCustomElement as d };
+//# sourceMappingURL=p-Bu_qPd2i.js.map
+
+//# sourceMappingURL=p-Bu_qPd2i.js.map

package/dist/components/p-Bu_qPd2i.js.map

@@ -0,0 +1 @@
+{"file":"p-Bu_qPd2i.js","mappings":";;;;;;;;;;AAAA,MAAM,cAAc,GAAG,MAAM,CAAC,k0LAAk0L,CAAC;;MCWp1L,WAAW,iBAAAA,kBAAA,CAAA,MAAA,WAAA,SAAAC,CAAA,CAAA;;;;;;;;;AAEtB;;;AAGG;AACsB,IAAA,IAAI;AACJ,IAAA,IAAI;AACJ,IAAA,SAAS;IAEzB,cAAc,GAAY,KAAK;IAC/B,YAAY,GAAY,KAAK;IAC7B,YAAY,GAAY,KAAK;AAEtC;;;AAGG;AACK,IAAA,MAAM;AAEd,IAAA,OAAO,CAAC,KAAa,EAAA;AACnB,QAAA,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC;AAC1B,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;;IAGnB,QAAQ,GAAA;AACN,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,wBAAwB,CAAC;QACzF,MAAM,KAAK,GAAG,CAAC,OAAO,CAAC,WAAW,GAAG,GAAG,IAAI,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,KAAK;AACrG,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;;IAG7C,SAAS,GAAA;AACP,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,wBAAwB,CAAC;QACzF,MAAM,KAAK,GAAG,CAAC,OAAO,CAAC,YAAY,GAAG,EAAE,IAAI,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,GAAG,CAAC,CAAC,CAAC,MAAM;AACtG,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;;AAG7C,IAAA,QAAQ,CAAC,OAAe,EAAA;QACtB,MAAM,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO;AAC1C,QAAA,IAAI,IAAI,GAAG,CAAC,EAAE;YACZ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,EAAE;AAAE,gBAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;;aAChD;AACL,YAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE;AAAE,gBAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;;AAEjE,QAAA,IAAI,CAAC,IAAI,GAAG,OAAO;QACnB,IAAI,CAAC,gBAAgB,EAAE;;AAGzB,IAAA,kBAAkB,CAAC,OAAe,EAAA;AAChC,QAAA,MAAM,QAAQ,GAAI,IAAI,CAAC,MAAc,CAAC,SAAS;AAC/C,QAAA,IAAI,CAAC,QAAQ,EAAE,iBAAiB,EAAE,gBAAgB;AAAE,YAAA,OAAO,EAAE;QAC7D,MAAM,MAAM,GAAG,QAAQ,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,IAAI,KAAK,OAAO,CAAC;AAC5F,QAAA,MAAM,YAAY,GAAG,IAAI,GAAG,EAAkB;AAC9C,QAAA,MAAM,CAAC,OAAO,CAAC,EAAE,IAAI,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,YAAY,CAAC,GAAG,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QACzF,OAAO,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE;aACrC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAI;AACjB,YAAA,MAAM,KAAK,GAAG,CAAC,GAAG,GAAG;AACrB,YAAA,MAAM,KAAK,GAAG,CAAC,GAAG,GAAG;YACrB,IAAI,KAAK,KAAK,KAAK;gBAAE,OAAO,KAAK,GAAG,KAAK;YACzC,OAAO,CAAC,GAAG,CAAC;AACd,SAAC;aACA,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,KAAI;AAClB,YAAA,MAAM,IAAI,GAAG,QAAQ,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,WAAW,KAAK,CAAC,CAAC;AAC3D,YAAA,MAAM,UAAU,GAAG,CAAC,GAAG,GAAG;YAC1B,OAAO;AACL,gBAAA,GAAG,EAAE,kBAAkB,CAAC,UAAU,CAAC,EAAE,GAAG,IAAI,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG;AACrE,gBAAA,GAAG,EAAE,kBAAkB,CAAC,UAAU,CAAC,EAAE,GAAG,IAAI,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG;AACrE,gBAAA,GAAG,EAAE,kBAAkB,CAAC,UAAU,CAAC,EAAE,GAAG,IAAI,kBAAkB,CAAC,CAAC,CAAC,CAAC,GAAG;AACrE,gBAAA,IAAI,EAAE,IAAI,EAAE,IAAI,IAAI,CAAA,YAAA,EAAe,CAAC,CAAE,CAAA;gBACtC,KAAK;aACN;AACH,SAAC,CAAC;;IAGN,gBAAgB,GAAA;AACd,QAAA,MAAM,MAAM,GAAI,IAAI,CAAC,MAAc,CAAC,WAAW;AAC/C,QAAA,IAAI,CAAC,MAAM;YAAE;AACb,QAAA,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,wBAAwB,CAAC;AACpF,QAAA,IAAI,CAAC,SAAS;YAAE;AAChB,QAAA,SAAS,CAAC,SAAS,GAAG,EAAE;AAExB,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC,EAAE,EAAE;YACxC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,IAAG;AAC5B,gBAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;gBACjD,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC;AAC/C,gBAAA,MAAM,CAAC,KAAK,GAAG,QAAQ,CAAC,KAAK;AAC7B,gBAAA,MAAM,CAAC,MAAM,GAAG,QAAQ,CAAC,MAAM;AAC/B,gBAAA,MAAM,CAAC,SAAS,GAAG,CAAC,KAAK,IAAI,CAAC,IAAI,GAAG,wBAAwB,GAAG,iBAAiB;AACjF,gBAAA,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBAExD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAC7C,gBAAA,OAAO,CAAC,SAAS,GAAG,yBAAyB;AAC7C,gBAAA,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBAEzD,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;AAC1C,gBAAA,IAAI,CAAC,SAAS,GAAG,sBAAsB;gBACvC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,IAAG;oBACzC,MAAM,GAAG,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;AAC1C,oBAAA,GAAG,CAAC,SAAS,GAAG,qBAAqB;AACrC,oBAAA,GAAG,CAAC,YAAY,CAAC,iBAAiB,EAAE,eAAe,CAAC;AACpD,oBAAA,GAAG,CAAC,YAAY,CAAC,sBAAsB,EAAE,CAAA,EAAG,KAAK,CAAC,IAAI,CAAA,EAAA,EAAK,KAAK,CAAC,KAAK,CAAA,MAAA,EAAS,KAAK,CAAC,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAA,CAAE,CAAC;oBAC9G,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,KAAK,CAAC,GAAG,CAAC;oBAClD,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,KAAK,CAAC,GAAG,CAAC;oBAClD,GAAG,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,EAAE,KAAK,CAAC,GAAG,CAAC;AAClD,oBAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC;AACvB,iBAAC,CAAC;gBAEF,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;AAC5C,gBAAA,KAAK,CAAC,WAAW,GAAG,CAAG,EAAA,CAAC,EAAE;AAC1B,gBAAA,OAAO,CAAC,WAAW,CAAC,MAAM,CAAC;AAC3B,gBAAA,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC;AACzB,gBAAA,OAAO,CAAC,WAAW,CAAC,KAAK,CAAC;AAC1B,gBAAA,SAAS,CAAC,WAAW,CAAC,OAAO,CAAC;;;gBAI9B,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC;AACnC,gBAAA,IAAI,CAAC,MAAM,CAAC,EAAE,aAAa,EAAE,GAAG,EAAE,QAAQ,EAAE,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,MAAK;;AAE9D,oBAAA,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM;AAC7B,oBAAA,qBAAqB,CAAC,MAAK,EAAG,MAAM,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC,EAAE,CAAC;AAC9D,iBAAC,CAAC;AACJ,aAAC,CAAC;;;AAIE,IAAA,mBAAmB,GAAG,CAAC,CAAa,KAAI;AAC9C,QAAA,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE;QAC7B,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,EAAE;AAClC,YAAA,IAAI,CAAC,cAAc,GAAG,KAAK;AAC3B,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;AACzB,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC;;AAEnE,KAAC;AAEO,IAAA,oBAAoB,GAAG,CAAC,CAAa,KAAI;AAC/C,QAAA,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE;AAC7B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,cAAc,CAAC;AACrE,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,gBAAgB,CAAC;AACtE,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AAC/C,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC;;AAE1E,KAAC;AAEO,IAAA,oBAAoB,GAAG,CAAC,CAAa,KAAI;AAC/C,QAAA,MAAM,IAAI,GAAG,CAAC,CAAC,YAAY,EAAE;AAC7B,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,cAAc,CAAC;AACrE,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,gBAAgB,CAAC;AACtE,QAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;AAC/C,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK;YACzB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC;;AAE1E,KAAC;IAED,gBAAgB,GAAA;QACd,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI;;IAI9B,YAAY,GAAA;AACV,QAAA,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,IAAI,CAAC,gBAAgB,EAAE;YACvB,qBAAqB,CAAC,MAAK;AACzB,gBAAA,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAC,UAAU,CAAC,cAAc,CAAC,wBAAwB,CAAC;AACpF,gBAAA,MAAM,OAAO,GAAG,SAAS,EAAE,aAAa,CAAC,yBAAyB,CAAC,EAAE,OAAO,CAAC,0BAA0B,CAAgB;AACvH,gBAAA,IAAI,OAAO,IAAI,SAAS,EAAE;AACxB,oBAAA,MAAM,GAAG,GAAG,EAAE,CAAC;oBACf,MAAM,UAAU,GAAG,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC,SAAS;AAC1D,oBAAA,MAAM,aAAa,GAAG,UAAU,GAAG,OAAO,CAAC,YAAY;AACvD,oBAAA,MAAM,SAAS,GAAG,SAAS,CAAC,SAAS;AACrC,oBAAA,MAAM,UAAU,GAAG,SAAS,CAAC,YAAY;AAEzC,oBAAA,IAAI,UAAU,GAAG,GAAG,GAAG,SAAS,EAAE;AAChC,wBAAA,SAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,UAAU,GAAG,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC;;yBAC5D,IAAI,aAAa,GAAG,GAAG,GAAG,SAAS,GAAG,UAAU,EAAE;AACvD,wBAAA,SAAS,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,aAAa,GAAG,GAAG,GAAG,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC;;;AAGvF,aAAC,CAAC;;;IAIN,MAAM,GAAA;QACJ,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACH,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,oBAAoB,EAAA,EAG9B,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,0BAA0B,EAAA,EACpC,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,EAAE,EAAE,EAAC,cAAc,EAAA,iBAAA,EAAiB,eAAe,EAAA,sBAAA,EAAuB,MAAM,CAAC,CAAC,CAAC,mBAAmB,CAAC,EAAA,EAChK,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,eAAe,EAAA,CAAG,CACzB,EACT,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,sBAAsB,EAC5B,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY;AACtC,gBAAA,IAAI,IAAI,CAAC,YAAY,EAAE;AACrB,oBAAA,qBAAqB,CAAC,MAAM,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC;;qBAC3F;oBACL,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC;;aAEzE,EAAA,EAEA,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,EACrB,GAAA,CAAA,EACR,IAAI,CAAC,YAAY,KAChB,4DAAK,EAAE,EAAC,cAAc,EAAC,KAAK,EAAC,iBAAiB,EAC3C,EAAA,CAAC,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,KAAK,KACjD,CACE,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,EAAE,EAC1G,OAAO,EAAE,MAAK,EAAG,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,CAAC,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC,EAAE,EAAA,EAEzI,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,OACvB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,GAAG,CAAC,IAAI,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAE,EAAE,EAAI,CAAA,CAC5F,CACV,CAAC,CACE,CACP,EACD,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAQ,OAAO,EAAE,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,GAAG,CAAC,EAAE,EAAE,EAAC,aAAa,EAAA,iBAAA,EAAiB,eAAe,EAAA,sBAAA,EAAuB,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,EAAA,EAC9J,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,cAAc,EAAA,CAAG,CACxB,CACL,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,0BAA0B,EAAA,EACpC,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAC,eAAe,qBAAiB,eAAe,EAAA,sBAAA,EAAuB,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,EAAA,EAC7I,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,gBAAgB,EAAA,CAAG,CAC1B,EACT,CAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAM,IAAI,CAAC,SAAS,EAAE,EAAE,EAAE,EAAC,gBAAgB,qBAAiB,eAAe,EAAA,sBAAA,EAAuB,MAAM,CAAC,CAAC,CAAC,qBAAqB,CAAC,EAAA,EAChJ,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,iBAAiB,EAAA,CAAG,CAC3B,CACL,EACN,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,EACxF,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;AACxB,aAAC,EACD,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,CAAC,EACzB,EAAE,EAAC,eAAe,EAAA,iBAAA,EACF,eAAe,EAAA,sBAAA,EAAuB,IAAI,CAAC,IAAI,KAAK,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,0BAA0B,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,wBAAwB,CAAC,EAAA,EAEjJ,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,mBAAmB,EAAA,CAAG,CAC7B,EACT,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,gBAAgB,EACnB,KAAK,EAAC,sBAAsB,EAC5B,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,YAAY,GAAG,CAAC,IAAI,CAAC,YAAY;AACtC,gBAAA,IAAI,IAAI,CAAC,YAAY,EAAE;AACrB,oBAAA,qBAAqB,CAAC,MAAM,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC;;qBAC3F;oBACL,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC;;AAE1E,aAAC,EAAA,EAEA,IAAI,CAAC,IAAI,SAAK,IAAI,CAAC,SAAS,CACtB,EACR,IAAI,CAAC,YAAY,KAChB,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,EAAE,EAAC,cAAc,EAAC,KAAK,EAAC,iCAAiC,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,cAAc,GAAG,IAAI,GAAG,CAAC,CAAA,GAAA,CAAK,EAAE,EACpH,EAAA,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,KAC5D,CACE,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,EAAE,sBAAsB,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,CAAC,EAAE,EAClE,OAAO,EAAE,QAAQ,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,CAAC,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC,EAAE,EAAA,EAEtI,CAAC,EACD,IAAI,CAAC,IAAI,KAAK,CAAC,IAAI,CAAA,CAAA,SAAA,EAAA,EAAS,IAAI,EAAC,YAAY,EAAC,IAAI,EAAE,EAAE,EAAA,CAAI,CACpD,CACV,CAAC,CACE,CACP,EACD,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;aACvB,EACD,QAAQ,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,SAAS,EACtC,EAAE,EAAC,eAAe,qBACF,eAAe,EAAA,sBAAA,EAAuB,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,CAAC,CAAC,sBAAsB,CAAC,GAAG,MAAM,CAAC,CAAC,CAAC,oBAAoB,CAAC,EAAA,EAEtJ,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAC,oBAAoB,EAAA,CAAG,CAC9B,CACL,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,IAAI,CAAC,SAAS,KAAK,CAAC,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,EAAA,EAC5F,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,cAAc,GAAG,CAAC,IAAI,CAAC,cAAc;AAC1C,gBAAA,IAAI,IAAI,CAAC,cAAc,EAAE;oBACvB,qBAAqB,CAAC,MAAK;wBACzB,qBAAqB,CAAC,MAAK;4BACzB,IAAI,CAAC,gBAAgB,EAAE;4BACvB,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC;AAC9D,yBAAC,CAAC;AACJ,qBAAC,CAAC;;qBACG;oBACL,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC;;AAEnE,aAAC,EACD,EAAE,EAAC,qBAAqB,EACR,iBAAA,EAAA,eAAe,EAAuB,sBAAA,EAAA,MAAM,CAAC,CAAC,CAAC,0BAA0B,CAAC,EAAA,EAE1F,CAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAS,IAAI,EAAE,CAAC,IAAI,CAAC,cAAc,GAAG,4BAA4B,GAAG,6BAA6B,EAAA,CAAI,CAC/F,CACL,EACL,IAAI,CAAC,cAAc,KAClB,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,yBAAyB,EAAA,EAClC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,wBAAwB,EAAC,KAAK,EAAC,sBAAsB,EAAA,CAAO,CAChE,CACP,CACG,EACN,CAAiB,CAAA,eAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACjB,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,eAAe,EAAA,OAAG,OAAO,CAAQ,EAC7C,CAAY,CAAA,YAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,SAAS,EAAC,eAAe,EAAG,CAAA,EACxC,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACR;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-statusbar/ls-statusbar.scss?tag=ls-statusbar&encapsulation=shadow","src/components/ls-statusbar/ls-statusbar.tsx"],"sourcesContent":[":host {\n  position: fixed;\n  z-index: 1000;\n  right: 1rem;\n  bottom: 1rem;\n  display: flex;\n  flex-direction: row;\n  gap: 0.5rem;\n  align-items: end;\n  height: 2.25rem;\n  overflow: visible;\n}\n\n.ls-dv-controls-bar {\n  display: flex;\n  flex-direction: row;\n  background-color: white;\n  border: 1px solid $gray-30;\n  box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.1);\n  border-radius: 1.125rem;\n}\n\n* {\n  margin: 0;\n  padding: 0;\n  box-sizing: border-box;\n}\n\n.ls-dv-status-bar-section {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  gap: 0.75rem;\n  padding: 0 0.75rem;\n  height: 2.25rem;\n}\n\n.ls-dv-controls-bar > :not(:nth-child(1)) {\n  border-left: 1px solid $gray-30;\n}\n\nbutton {\n  border: 0;\n}\n\nbutton:hover {\n  color: $gray-100;\n  border-radius: 0.625rem;\n}\n\nbutton:disabled {\n  color: $gray-40;\n  cursor: not-allowed;\n}\n\ninput[type=\"range\"] {\n  -webkit-appearance: none; /* Remove default styling */\n  width: 100%;\n  height: 0.5rem;\n  background: $gray-20;\n  border-radius: 0.25rem;\n  outline: none;\n}\n\n/* Chrome, Safari, Edge */\ninput[type=\"range\"]::-webkit-slider-thumb {\n  -webkit-appearance: none;\n  appearance: none;\n  width: 0.5rem;\n  height: 0.5rem;\n  background: $gray-70; /* Custom thumb color */\n  border-radius: 50%;\n  cursor: pointer;\n}\n\n/* Firefox */\ninput[type=\"range\"]::-moz-range-thumb {\n  width: 0.5rem;\n  height: 0.5rem;\n  background: $gray-70; /* Custom thumb color */\n  border: none;\n  border-radius: 50%;\n  cursor: pointer;\n}\n\n/* Track color for Firefox */\ninput[type=\"range\"]::-moz-range-track {\n  background: $gray-20;\n  height: 0.5rem;\n  border-radius: 0.25rem;\n}\n\n/* Track color for Chrome, Safari, Edge */\ninput[type=\"range\"]::-webkit-slider-runnable-track {\n  background: $gray-20;\n  height: 0.5rem;\n  border-radius: 0.25rem;\n}\n\n\n\n/* Global Styles */\n\np {\n  color: $gray-80;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\nspan {\n  color: $gray-80;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\na {\n  color: $primary-60;\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n  cursor: pointer;\n}\n\na:hover {\n  text-decoration: underline;\n  color: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.ls-dv-input-wrapper {\n  position: relative;\n  width: fit-content;\n}\n\n#selectorIcon {\n  position: absolute;\n  top: 50%;\n  right: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\nbutton {\n  all: unset;\n  border: 0;\n  appearance: button;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  color: $gray-80;\n  text-transform: capitalize;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n}\n\n.ls-dv-button-group button {\n  display: flex;\n  background: transparent;\n  border-radius: unset;\n  padding: 0.25rem 0.75rem;\n  min-width: 2.156rem;\n  min-height: unset;\n  color: $gray-80;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n\n\n.ls-dv-zoom-level-btn {\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-weight: 400;\n  color: $gray-80;\n  padding: 0.25rem 0.375rem;\n  border-radius: 0.25rem;\n  margin: 0 -0.25rem;\n\n  &:hover {\n    background: $gray-10;\n  }\n}\n\n.ls-dv-zoom-menu {\n  position: absolute;\n  width: 6rem;\n  bottom: 3rem;\n  left: 1.5rem;\n  background: white;\n  border: 1px solid $gray-30;\n  border-radius: 1rem;\n  box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.12);\n  padding: 0.25rem;\n  z-index: 1001;\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n\n}\n\n.ls-dv-page-menu {\n  left: auto;\n  max-height: 60cqh;\n  overflow-y: auto;\n}\n\n.ls-dv-zoom-menu-item {\n  position: relative;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-weight: 400;\n  color: $gray-80;\n  padding: 0.375rem 0.625rem;\n  border-radius: 0.825rem;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n\n  &:hover {\n    background: $gray-10;\n  }\n\n  &.active {\n    font-weight: 500;\n    color: $primary-70;\n    background: $primary-10;\n  }\n}\n\n.ls-dv-thumbnail-popover {\n  position: absolute;\n  bottom: 3rem;\n  right: 0;\n  background: white;\n  border: 1px solid $gray-30;\n  border-radius: 1.75rem;\n  box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.15);\n  padding: 0.75rem;\n  z-index: 1001;\n  max-height: 80vh;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n}\n\n.ls-dv-thumbnail-grid {\n  background: $gray-10;\n  padding: 0.75rem;\n  border-radius: 1rem;\n  border: 1px solid $gray-30;\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));\n  gap: 1rem;\n  overflow-y: auto;\n  max-height: 100%;\n}\n\n.ls-dv-thumbnail-wrapper {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 0.25rem;\n  cursor: pointer;\n}\n\n.ls-dv-thumbnail-wrapper > span:last-child {\n  font-size: var(--text-xs, 0.75rem);\n  color: $gray-80;\n  font-weight: 500;\n}\n\n.ls-dv-thumbnail {\n  border: 1px solid $gray-30;\n  border-radius: 0.5rem;\n  cursor: pointer;\n  transition: border-color 0.15s;\n}\n\n.ls-dv-thumbnail:hover {\n  border-color: $primary-40;\n  box-shadow: 0 0 0 2px rgba(163, 180, 249, 0.3);\n}\n\n.ls-dv-thumbnail.active {\n  border-color: $primary-60;\n  outline: 0.25rem solid $primary-30;\n  box-shadow: var(--shadow-md);\n}\n\n.ls-dv-thumbnail-dots {\n  display: flex;\n  gap: 3px;\n  justify-content: center;\n  flex-wrap: wrap;\n  margin-top: 0.25rem;\n}\n\n.ls-dv-thumbnail-dot {\n  width: 0.5rem;\n  height: 0.5rem;\n  border-radius: 50%;\n  display: inline-block;\n  border: 2px solid var(--dot-color-60);\n  background-color: var(--dot-color-40);\n  cursor: pointer;\n  transition: background-color 0.15s, border-color 0.15s;\n\n  &:hover {\n    background-color: var(--dot-color-60);\n    border-color: var(--dot-color-70);\n  }\n}\n\n.ls-dv-version {\n  position: absolute;\n  bottom: 100%;\n  right: 0;\n  color: var(--gray-50, #afb0b2);\n  font-size: 0.625rem;\n  padding-bottom: 0.25rem;\n}\n","import { Component, Host, Prop, State, Watch, h, Element } from '@stencil/core';\nimport { dvI18n } from '../../i18n/i18n';\nimport { LsDocumentViewer } from '../ls-document-viewer/ls-document-viewer';\nimport { defaultRolePalette } from '../ls-document-viewer/defaultPalette';\nimport { version } from '../../../package.json';\n\n@Component({\n  tag: 'ls-statusbar',\n  styleUrl: 'ls-statusbar.scss',\n  shadow: true,\n})\nexport class LsStatusbar {\n  @Element() component: HTMLElement;\n  /**\n   * The zoom or scale level 100 === 100%.\n   * {number}\n   */\n  @Prop({ mutable: true }) zoom: number;\n  @Prop({ mutable: true }) page: number;\n  @Prop({ mutable: true }) pageCount: number;\n\n  @State() showThumbnails: boolean = false;\n  @State() showZoomMenu: boolean = false;\n  @State() showPageMenu: boolean = false;\n\n  /**\n   * The parent editor control.\n   * {LsDocumentViewer}\n   */\n  @Prop() editor: LsDocumentViewer;\n\n  setZoom(value: number) {\n    this.editor.setZoom(value);\n    this.zoom = value;\n  }\n\n  fitWidth() {\n    const wrapper = this.editor.component.shadowRoot.getElementById('document-frame-wrapper');\n    const scale = (wrapper.clientWidth - 396) / this.editor.pageDimensions[this.editor.pageNum - 1].width;\n    this.setZoom(Math.round(scale * 1e2) / 1e2);\n  }\n\n  fitHeight() {\n    const wrapper = this.editor.component.shadowRoot.getElementById('document-frame-wrapper');\n    const scale = (wrapper.clientHeight - 94) / this.editor.pageDimensions[this.editor.pageNum - 1].height;\n    this.setZoom(Math.round(scale * 1e2) / 1e2);\n  }\n\n  goToPage(pageNum: number) {\n    const diff = pageNum - this.editor.pageNum;\n    if (diff > 0) {\n      for (let i = 0; i < diff; i++) this.editor.pageNext();\n    } else {\n      for (let i = 0; i < Math.abs(diff); i++) this.editor.pagePrev();\n    }\n    this.page = pageNum;\n    this.renderThumbnails();\n  }\n\n  getPageFieldColors(pageNum: number): { s40: string; s60: string; s70: string; name: string; count: number }[] {\n    const template = (this.editor as any)._template;\n    if (!template?.elementConnection?.templateElements) return [];\n    const fields = template.elementConnection.templateElements.filter(el => el.page === pageNum);\n    const signerCounts = new Map<number, number>();\n    fields.forEach(el => signerCounts.set(el.signer, (signerCounts.get(el.signer) || 0) + 1));\n    return Array.from(signerCounts.entries())\n      .sort(([a], [b]) => {\n        const baseA = a % 100;\n        const baseB = b % 100;\n        if (baseA !== baseB) return baseA - baseB;\n        return a - b;\n      })\n      .map(([s, count]) => {\n        const role = template.roles?.find(r => r.signerIndex === s);\n        const colorIndex = s % 100;\n        return {\n          s40: defaultRolePalette[colorIndex]?.s40 || defaultRolePalette[0].s40,\n          s60: defaultRolePalette[colorIndex]?.s60 || defaultRolePalette[0].s60,\n          s70: defaultRolePalette[colorIndex]?.s70 || defaultRolePalette[0].s70,\n          name: role?.name || `Participant ${s}`,\n          count,\n        };\n      });\n  }\n\n  renderThumbnails() {\n    const pdfDoc = (this.editor as any).pdfDocument;\n    if (!pdfDoc) return;\n    const container = this.component.shadowRoot.getElementById('ls-thumbnail-container');\n    if (!container) return;\n    container.innerHTML = '';\n\n    for (let i = 1; i <= this.pageCount; i++) {\n      pdfDoc.getPage(i).then(page => {\n        const viewport = page.getViewport({ scale: 0.2 });\n        const canvas = document.createElement('canvas');\n        canvas.width = viewport.width;\n        canvas.height = viewport.height;\n        canvas.className = i === this.page ? 'ls-dv-thumbnail active' : 'ls-dv-thumbnail';\n        canvas.addEventListener('click', () => this.goToPage(i));\n\n        const wrapper = document.createElement('div');\n        wrapper.className = 'ls-dv-thumbnail-wrapper';\n        wrapper.addEventListener('click', () => this.goToPage(i));\n\n        const dots = document.createElement('div');\n        dots.className = 'ls-dv-thumbnail-dots';\n        this.getPageFieldColors(i).forEach(color => {\n          const dot = document.createElement('span');\n          dot.className = 'ls-dv-thumbnail-dot';\n          dot.setAttribute('data-tooltip-id', 'ls-dv-tooltip');\n          dot.setAttribute('data-tooltip-content', `${color.name}, ${color.count} Field${color.count !== 1 ? 's' : ''}`);\n          dot.style.setProperty('--dot-color-40', color.s40);\n          dot.style.setProperty('--dot-color-60', color.s60);\n          dot.style.setProperty('--dot-color-70', color.s70);\n          dots.appendChild(dot);\n        });\n\n        const label = document.createElement('span');\n        label.textContent = `${i}`;\n        wrapper.appendChild(canvas);\n        wrapper.appendChild(dots);\n        wrapper.appendChild(label);\n        container.appendChild(wrapper);\n\n        // Render after appending to DOM — Safari requires the canvas to be\n        // in the visible tree before getContext/render produces output.\n        const ctx = canvas.getContext('2d');\n        page.render({ canvasContext: ctx, viewport }).promise.then(() => {\n          // Force Safari to composit the canvas by toggling a style property\n          canvas.style.opacity = '0.99';\n          requestAnimationFrame(() => { canvas.style.opacity = '1'; });\n        });\n      });\n    }\n  }\n\n  private outsideClickHandler = (e: MouseEvent) => {\n    const path = e.composedPath();\n    if (!path.includes(this.component)) {\n      this.showThumbnails = false;\n      this.showZoomMenu = false;\n      this.showPageMenu = false;\n      document.removeEventListener('click', this.outsideClickHandler);\n    }\n  };\n\n  private zoomMenuClickHandler = (e: MouseEvent) => {\n    const path = e.composedPath();\n    const menu = this.component.shadowRoot.getElementById('ls-zoom-menu');\n    const btn = this.component.shadowRoot.getElementById('zoom-level-btn');\n    if (!path.includes(menu) && !path.includes(btn)) {\n      this.showZoomMenu = false;\n      document.removeEventListener('click', this.zoomMenuClickHandler, true);\n    }\n  };\n\n  private pageMenuClickHandler = (e: MouseEvent) => {\n    const path = e.composedPath();\n    const menu = this.component.shadowRoot.getElementById('ls-page-menu');\n    const btn = this.component.shadowRoot.getElementById('page-level-btn');\n    if (!path.includes(menu) && !path.includes(btn)) {\n      this.showPageMenu = false;\n      document.removeEventListener('click', this.pageMenuClickHandler, true);\n    }\n  };\n\n  componentDidLoad() {\n    this.zoom = this.editor.zoom;\n  }\n\n  @Watch('page')\n  onPageChange() {\n    if (this.showThumbnails) {\n      this.renderThumbnails();\n      requestAnimationFrame(() => {\n        const container = this.component.shadowRoot.getElementById('ls-thumbnail-container');\n        const wrapper = container?.querySelector('.ls-dv-thumbnail.active')?.closest('.ls-dv-thumbnail-wrapper') as HTMLElement;\n        if (wrapper && container) {\n          const gap = 12; // 0.75rem\n          const wrapperTop = wrapper.offsetTop - container.offsetTop;\n          const wrapperBottom = wrapperTop + wrapper.offsetHeight;\n          const scrollTop = container.scrollTop;\n          const viewHeight = container.clientHeight;\n\n          if (wrapperTop - gap < scrollTop) {\n            container.scrollTo({ top: wrapperTop - gap, behavior: 'smooth' });\n          } else if (wrapperBottom + gap > scrollTop + viewHeight) {\n            container.scrollTo({ top: wrapperBottom + gap - viewHeight, behavior: 'smooth' });\n          }\n        }\n      });\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-dv-controls-bar'}>\n          {/* <button onClick={() => this.editor.displayTable = true}><ls-icon name=\"table-icon\" /></button>\n        <button onClick={() => this.editor.displayTable = false}><ls-icon name=\"template-icon\" /></button> */}\n          <div class={'ls-dv-status-bar-section'}>\n            <button onClick={() => this.setZoom(this.editor.zoom * 0.8)} id=\"zoom-out-btn\" data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={dvI18n.t('statusbar.zoomout')}>\n              <ls-icon name=\"zoom-out-icon\" />\n            </button>\n            <button\n              id=\"zoom-level-btn\"\n              class=\"ls-dv-zoom-level-btn\"\n              onClick={() => {\n                this.showZoomMenu = !this.showZoomMenu;\n                if (this.showZoomMenu) {\n                  requestAnimationFrame(() => document.addEventListener('click', this.zoomMenuClickHandler, true));\n                } else {\n                  document.removeEventListener('click', this.zoomMenuClickHandler, true);\n                }\n              }}\n            >\n              {Math.round(this.zoom * 100)}%\n            </button>\n            {this.showZoomMenu && (\n              <div id=\"ls-zoom-menu\" class=\"ls-dv-zoom-menu\">\n                {[2, 1.75, 1.5, 1.25, 1, 0.75, 0.5, 0.25].map(level => (\n                  <button\n                    class={{ 'ls-dv-zoom-menu-item': true, 'active': Math.round(this.zoom * 100) === Math.round(level * 100) }}\n                    onClick={() => { this.setZoom(level); this.showZoomMenu = false; document.removeEventListener('click', this.zoomMenuClickHandler, true); }}\n                  >\n                    {Math.round(level * 100)}%\n                    {Math.round(this.zoom * 100) === Math.round(level * 100) && <ls-icon name=\"check-icon\" size={14} />}\n                  </button>\n                ))}\n              </div>\n            )}\n            <button onClick={() => this.setZoom(this.editor.zoom / 0.8)} id=\"zoom-in-btn\" data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={dvI18n.t('statusbar.zoomin')}>\n              <ls-icon name=\"zoom-in-icon\" />\n            </button>\n          </div>\n          <div class={'ls-dv-status-bar-section'}>\n            <button onClick={() => this.fitWidth()} id=\"fit-width-btn\" data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={dvI18n.t('statusbar.fitwidth')}>\n              <ls-icon name=\"fit-width-icon\" />\n            </button>\n            <button onClick={() => this.fitHeight()} id=\"fit-height-btn\" data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={dvI18n.t('statusbar.fitheight')}>\n              <ls-icon name=\"fit-height-icon\" />\n            </button>\n          </div>\n          <div class={'ls-dv-status-bar-section'} style={this.pageCount === 1 && { display: 'none' }}>\n            <button\n              onClick={() => {\n                this.editor.pagePrev();\n              }}\n              disabled={this.page === 1}\n              id=\"prev-page-btn\"\n              data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={this.page === 1 ? dvI18n.t('statusbar.nopreviouspage') : dvI18n.t('statusbar.previouspage')}\n            >\n              <ls-icon name=\"chevron-left-icon\" />\n            </button>\n            <button\n              id=\"page-level-btn\"\n              class=\"ls-dv-zoom-level-btn\"\n              onClick={() => {\n                this.showPageMenu = !this.showPageMenu;\n                if (this.showPageMenu) {\n                  requestAnimationFrame(() => document.addEventListener('click', this.pageMenuClickHandler, true));\n                } else {\n                  document.removeEventListener('click', this.pageMenuClickHandler, true);\n                }\n              }}\n            >\n              {this.page} / {this.pageCount}\n            </button>\n            {this.showPageMenu && (\n              <div id=\"ls-page-menu\" class=\"ls-dv-zoom-menu ls-dv-page-menu\" style={{ right: `${this.showThumbnails ? 11.5 : 7}rem` }}>\n                {Array.from({ length: this.pageCount }, (_, i) => i + 1).map(p => (\n                  <button\n                    class={{ 'ls-dv-zoom-menu-item': true, 'active': this.page === p }}\n                    onClick={() => { this.goToPage(p); this.showPageMenu = false; document.removeEventListener('click', this.pageMenuClickHandler, true); }}\n                  >\n                    {p}\n                    {this.page === p && <ls-icon name=\"check-icon\" size={14} />}\n                  </button>\n                ))}\n              </div>\n            )}\n            <button\n              onClick={() => {\n                this.editor.pageNext();\n              }}\n              disabled={this.page === this.pageCount}\n              id=\"next-page-btn\"\n              data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={this.page === this.pageCount ? dvI18n.t('statusbar.nonextpage') : dvI18n.t('statusbar.nextpage')}\n            >\n              <ls-icon name=\"chevron-right-icon\" />\n            </button>\n          </div>\n          <div class={'ls-dv-status-bar-section'} style={this.pageCount === 1 ? { display: 'none' } : {}}>\n            <button\n              onClick={() => {\n                this.showThumbnails = !this.showThumbnails;\n                if (this.showThumbnails) {\n                  requestAnimationFrame(() => {\n                    requestAnimationFrame(() => {\n                      this.renderThumbnails();\n                      document.addEventListener('click', this.outsideClickHandler);\n                    });\n                  });\n                } else {\n                  document.removeEventListener('click', this.outsideClickHandler);\n                }\n              }}\n              id=\"page-thumbnails-btn\"\n              data-tooltip-id=\"ls-dv-tooltip\" data-tooltip-content={dvI18n.t('statusbar.pagethumbnails')}\n            >\n              <ls-icon name={!this.showThumbnails ? 'side-panel-open-right-icon' : 'side-panel-close-right-icon'} />\n            </button>\n          </div>\n          {this.showThumbnails && (\n            <div class=\"ls-dv-thumbnail-popover\">\n              <div id=\"ls-thumbnail-container\" class=\"ls-dv-thumbnail-grid\"></div>\n            </div>\n          )}\n        </div>\n        <ls-helper-bar />\n        <span class=\"ls-dv-version\">v{version}</span>\n        <ls-tooltip tooltipId=\"ls-dv-tooltip\" />\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-B4nern9h.js → p-BzEhzu-b.js}

@@ -1,7 +1,7 @@
 import { t as transformTag, p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-DffaAVW4.js';
-import { d as dvI18n } from './p-Bp8hmhrC.js';
+import { d as dvI18n } from './p-SDy1UUFt.js';
 import { d as defineCustomElement$2 } from './p-BT5rCW3w.js';
-import { d as defineCustomElement$1 } from './p-CbaxmrLQ.js';
+import { d as defineCustomElement$1 } from './p-D_qcM56g.js';
 
 const lsFieldPropertiesAdvancedCss = () => `:host,.ls-dv-field-set{display:flex;flex-direction:column;gap:1rem;width:100%;position:relative}*{margin:0;box-sizing:border-box}.ls-dv-expand-fields-row{display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.25rem;cursor:pointer;color:var(--gray-80, #6f7176);font-size:0.875rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-dv-expand-fields-row p{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;}.ls-dv-field-set{display:flex;flex-direction:column;gap:1rem;width:100%}.ls-dv-field-properties-section{display:flex;position:relative;flex-direction:column;gap:0.5rem}.ls-dv-row{flex-direction:row;align-items:center;justify-content:space-between}.ls-dv-multi-button-group-row{display:flex;gap:0.5rem}.ls-dv-field-properties-section-text{display:flex;flex-direction:column;gap:0.25rem;padding:0.25rem}.ls-dv-field-properties-section-title{color:var(--gray-90, #5e6066);font-size:1rem;font-style:normal;font-weight:500;line-height:1.25rem;}.ls-dv-field-properties-section-description{overflow:hidden;color:var(--gray-80, #6f7176);text-overflow:ellipsis;font-size:0.75rem;font-style:normal;font-weight:400;line-height:0.75rem;}.ls-dv-input-row{display:flex;gap:0.5rem}.ls-dv-input-row .ls-dv-input-wrapper input{width:9.313rem;max-width:9.313rem}p{color:var(--gray-80, #6f7176);font-family:var(--font-family);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height)}a{color:var(--primary-60, #4456f6);font-size:var(--text-sm);font-style:normal;font-weight:400;line-height:var(--text-sm-line-height);cursor:pointer}a:hover{text-decoration:underline;color:var(--primary-70, #2134dc)}.ls-dv-button-link,.ls-dv-button-link:hover{all:unset}select{appearance:none;height:2.25rem}.ls-dv-input-wrapper{position:relative;width:100%}#selectorIcon{position:absolute;top:50%;right:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}#selectLeadingIcon{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-80, #6f7176)}#selectLeadingIconDisabled{position:absolute;top:50%;left:0.675rem;transform:translateY(-50%);pointer-events:none;color:var(--gray-50, #c8c9cc)}.ls-dv-has-leading-icon{padding-left:2.5rem}input,select,textarea{border:1px solid var(--gray-40, #d8d9dc);box-shadow:0 1px 0.125rem rgba(0, 0, 0, 0.05);padding:0.5rem 0.75rem;font-family:var(--font-family);font-size:var(--text-sm);border-radius:0.625rem;color:var(--gray-100, #45484d);font-weight:400}input::placeholder,select::placeholder,textarea::placeholder{color:var(--gray-60, #afb0b2)}input:hover:not(:disabled),select:hover:not(:disabled),textarea:hover:not(:disabled){border-color:var(--gray-50, #c8c9cc);background-color:var(--white, #ffffff)}input:focus:not(:disabled),select:focus:not(:disabled),textarea:focus:not(:disabled){outline:none;box-shadow:0 0 0 0.25rem var(--primary-40, #79adfc);border-color:var(--primary-60, #4456f6);background-color:var(--white, #ffffff)}input:active:not(:disabled),select:active:not(:disabled),textarea:active:not(:disabled){border-color:var(--primary-50, #5185ff)}input:disabled,select:disabled,textarea:disabled{cursor:not-allowed;background-color:var(--gray-10, #f7f8fa);color:var(--gray-50, #c8c9cc);box-shadow:none}input[type=checkbox]{appearance:none;position:relative;height:1rem;width:1rem;padding:0.25rem;border-radius:var(--radius-sm);border:1px solid #d1d5db;background-color:#ffffff;cursor:pointer}input[type=checkbox]:checked,input[type=checkbox].ls-dv-indeterminate{background-color:var(--primary-60, #4456f6);border:none}input[type=checkbox]:checked::after{content:"";position:absolute;top:45%;left:50%;transform:translate(-50%, -50%) rotate(-45deg) scale(-1, 1);width:0.5rem;height:0.25rem;border-bottom:0.125rem solid white;border-right:0.125rem solid white}input[type=checkbox].ls-dv-indeterminate::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:0.5rem;height:0.125rem;background-color:white}input[type=checkbox]:checked:hover,input[type=checkbox].ls-dv-indeterminate:hover{background-color:var(--primary-70, #2134dc);border:none}input[type=checkbox]:hover{border:1px solid #9ca3af}input[type=checkbox]:focus,input[type=checkbox]:active{outline:none;box-shadow:0 0 0 0.25rem var(--primary-20, #c7ddff);background-color:#f0f4f8}input[type=checkbox]:disabled{background-color:#f3f4f6;outline:none;cursor:not-allowed}input[type=checkbox]:disabled:checked{background-color:#e5e7eb;border:none;outline:none;cursor:not-allowed}.ls-dv-checkbox-container{display:flex;gap:0.5rem;width:100%}.ls-dv-checkbox-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:400;line-height:1rem}.ls-dv-form-label{color:var(--gray-100, #45484d);font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem}.ls-dv-form-field{display:flex;flex-direction:column;gap:0.25rem;width:100%}.ls-dv-loading-box{display:flex;justify-content:center;align-items:center;width:100%;height:100vh;color:var(--primary-60, #4456f6)}button{border:0;appearance:button;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-lg);background-color:var(--primary-60, #4456f6);color:white;text-transform:capitalize;min-height:2.25rem;min-width:2.25rem}button.ls-dv-tertiary-grey{border:1px solid var(--gray-40, #d8d9dc);background-color:white;color:var(--gray-80, #6f7176)}button.ls-dv-tertiary-grey:hover{border:1px solid var(--gray-50, #c8c9cc);background:var(--gray-10, #f7f8fa)}.ls-dv-button-group{display:flex;border-radius:0.625rem;border:1px solid var(--gray-30, #e0e2e5);background:var(--white, #ffffff);overflow:clip;width:100%}.ls-dv-button-group button{display:flex;width:100%;background:transparent;border-radius:unset;padding:0.25rem 0.75rem;min-width:2.156rem;color:var(--gray-80, #6f7176)}.ls-dv-button-group button:disabled{background:var(--gray-10, #f7f8fa);cursor:not-allowed;color:var(--gray-50, #c8c9cc)}.ls-dv-button-group button:hover{background:var(--gray-10, #f7f8fa)}.ls-dv-button-group>:first-child{border-radius:0.625rem 0 0 0.625rem}.ls-dv-button-group>:last-child{border-radius:0 0.5rem 0.5rem 0}.ls-dv-button-group>:not(:first-child){border-left:1px solid var(--gray-30, #e0e2e5)}`;
 
@@ -67,10 +67,10 @@ const LsFieldPropertiesAdvanced = /*@__PURE__*/ proxyCustomElement(class LsField
         return '';
     }
     render() {
-        return (h(Host, { key: 'eb656c09625879e4d3612c5b4acc1997fe1c8698' }, h("div", { key: 'a297ab7603a5623258a74fa383c93d222f0ca535', class: 'ls-dv-expand-fields-row', onClick: () => (this.expanded = !this.expanded) }, h("ls-icon", { key: 'db6bd74a2f6bb4124bd48d598454e54cc0cf246d', name: this.expanded ? 'expand-icon' : 'collapse-icon', size: 20, solid: true }), h("p", { key: '098a2920b709a1f0681d188fa8f8a865c6cb32d2' }, dvI18n.t('fieldproperties.advancedproperties'))), this.expanded && (h("div", { key: '863ba9fe5b803b3cbb14d181475d0bcddc1dfbdc', class: 'ls-dv-field-set' }, h("ls-props-section", { key: '6d4f705a6cb2aabc6233d214e7e77dc1c9df559f', sectionTitle: dvI18n.t('fieldproperties.fieldorder'), sectionDescription: dvI18n.t('fieldproperties.fieldorderdescription') }, h("input", { key: '15e33574cc10e6e17c63d32b37aeb170f7b3f38b', value: this.getValue('fieldOrder'), type: "number", placeholder: dvI18n.t('fieldproperties.placeholdereg1'), onInput: e => {
+        return (h(Host, { key: '6fea8c73c1f2992cd7e8ef28121a4a98aa99c11c' }, h("div", { key: '2697b37b47fcaa67f71e7d7fceeca7db19d76568', class: 'ls-dv-expand-fields-row', onClick: () => (this.expanded = !this.expanded) }, h("ls-icon", { key: 'b67323c83b14c44863cfa3fbe185f47db1c963b5', name: this.expanded ? 'expand-icon' : 'collapse-icon', size: 20, solid: true }), h("p", { key: '1128ac652a5a187d50762ed87a759b2ef2ec9f10' }, dvI18n.t('fieldproperties.advancedproperties'))), this.expanded && (h("div", { key: '80b4ee75ad17429f7a692fd63048058ea7eedf42', class: 'ls-dv-field-set' }, h("ls-props-section", { key: 'a75d3fd05668488779ef5c21a82363abc5099e70', sectionTitle: dvI18n.t('fieldproperties.fieldorder'), sectionDescription: dvI18n.t('fieldproperties.fieldorderdescription') }, h("input", { key: '8493cf34ec986d5f7457a5f8462e090d98a8be5b', value: this.getValue('fieldOrder'), type: "number", placeholder: dvI18n.t('fieldproperties.placeholdereg1'), onInput: e => {
                 console.log(e);
                 this.alter({ fieldOrder: e.target.value }, 100);
-            }, onChange: () => { console.log('onchange'); }, disabled: this.readonly })), h("ls-props-section", { key: 'c6159d497f2caac1f154553dea7551648e678385', sectionTitle: dvI18n.t('fieldproperties.refname') }, h("input", { key: 'd6d62d47d7adcf3bc0e4fa23ecaafef6f1052f36', value: this.getValue('link'), placeholder: dvI18n.t('fieldproperties.placeholdercheckboxgroup'), onInput: e => this.alter({ link: e.target.value }, 300), disabled: this.readonly })), h("ls-props-section", { key: 'acb93cbe70ee5075cdae8fa4b804221f65093dd3', sectionTitle: dvI18n.t('fieldproperties.linktype'), sectionDescription: dvI18n.t('fieldproperties.linktypedescription') }, h("select", { key: 'e2cf557ed86879e8ee4bcccf147f3688f7aac7a2', onChange: e => this.alter({ linkType: e.target.value }), name: "Link Field", "aria-label": "Link Field", disabled: this.readonly }, h("option", { key: '61bdfe8fa2a3fb0bfaf9dd18c0a4c851ba39fc35', value: "0", selected: this.getValue('linkType') === '0' }, dvI18n.t('fieldproperties.linktypenoption')), h("option", { key: 'a4a972ada49832c83b713fafc75788b081984f7b', value: "1", selected: this.getValue('linkType') === '1' }, dvI18n.t('fieldproperties.linktypeoneofgroup')), h("option", { key: '72778b6f85eec93f15c301e820c04f384caead45', value: "2", selected: this.getValue('linkType') === '2' }, dvI18n.t('fieldproperties.linktypeaddtotal')), h("option", { key: '31fcf1a5098493acb682035e60bee2cc13f291a0', value: "3", selected: this.getValue('linkType') === '3' }, dvI18n.t('fieldproperties.linktypeconditional')))), h("ls-props-section", { key: '3644d32d8db6a2554b666fae6778ccb000e77372', sectionTitle: dvI18n.t('fieldproperties.linkvalue'), sectionDescription: dvI18n.t('fieldproperties.linkvaluedescription') }, h("input", { key: 'd1767d9c30f7143ab6e5c5cfeebc1c98ff1cfed4', value: this.getValue('logicAction'), width: "30", placeholder: dvI18n.t('fieldproperties.placeholdercheckboxgroup'), onChange: e => this.alter({ logicAction: e.target.value }), disabled: this.readonly }))))));
+            }, onChange: () => { console.log('onchange'); }, disabled: this.readonly })), h("ls-props-section", { key: 'a761092fc4575f1ea3bbae2159fbbe7c1e540016', sectionTitle: dvI18n.t('fieldproperties.refname') }, h("input", { key: 'da669f44390aa1d1bafc7141be5bd1f41f9e53d4', value: this.getValue('link'), placeholder: dvI18n.t('fieldproperties.placeholdercheckboxgroup'), onInput: e => this.alter({ link: e.target.value }, 300), disabled: this.readonly })), h("ls-props-section", { key: '2564dcdd7aebfcff0b42fb34a96a719fc182367d', sectionTitle: dvI18n.t('fieldproperties.linktype'), sectionDescription: dvI18n.t('fieldproperties.linktypedescription') }, h("select", { key: '5e4ee8f246d8114e0b7d96b3c2922594edd90a94', onChange: e => this.alter({ linkType: e.target.value }), name: "Link Field", "aria-label": "Link Field", disabled: this.readonly }, h("option", { key: 'd1a167290ac4affa0a6ff5a10553e072375ce35f', value: "0", selected: this.getValue('linkType') === '0' }, dvI18n.t('fieldproperties.linktypenoption')), h("option", { key: '0a802dbb7fd9a653676900c45011b6afa88e7b08', value: "1", selected: this.getValue('linkType') === '1' }, dvI18n.t('fieldproperties.linktypeoneofgroup')), h("option", { key: 'b0d63a55e17aa5b2e348ab029e4585bbc7220a22', value: "2", selected: this.getValue('linkType') === '2' }, dvI18n.t('fieldproperties.linktypeaddtotal')), h("option", { key: 'b58a1049a0ca349111e070bed2f802efda814696', value: "3", selected: this.getValue('linkType') === '3' }, dvI18n.t('fieldproperties.linktypeconditional')))), h("ls-props-section", { key: '4cf14c2e5214e61f2afab245041c54fb78706b6b', sectionTitle: dvI18n.t('fieldproperties.linkvalue'), sectionDescription: dvI18n.t('fieldproperties.linkvaluedescription') }, h("input", { key: '9d700ca37e60984c400a59de19fd0f2cab3cc847', value: this.getValue('logicAction'), width: "30", placeholder: dvI18n.t('fieldproperties.placeholdercheckboxgroup'), onChange: e => this.alter({ logicAction: e.target.value }), disabled: this.readonly }))))));
     }
     static get style() { return lsFieldPropertiesAdvancedCss(); }
 }, [769, "ls-field-properties-advanced", {
@@ -104,6 +104,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { LsFieldPropertiesAdvanced as L, defineCustomElement as d };
-//# sourceMappingURL=p-B4nern9h.js.map
+//# sourceMappingURL=p-BzEhzu-b.js.map
 
-//# sourceMappingURL=p-B4nern9h.js.map
+//# sourceMappingURL=p-BzEhzu-b.js.map

package/dist/components/{p-B4nern9h.js.map → p-BzEhzu-b.js.map}

@@ -1 +1 @@
-{"file":"p-B4nern9h.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-advanced/ls-field-properties-advanced.scss?tag=ls-field-properties-advanced&encapsulation=shadow","src/components/ls-field-properties-advanced/ls-field-properties-advanced.tsx"],"sourcesContent":[":host, .ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n  position: relative;\n}\n\n* {\n  margin: 0;\n  box-sizing: border-box;\n}\n\n.ls-dv-expand-fields-row {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.5rem 0.25rem;\n  cursor: pointer;\n  color: $gray-80;\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-dv-expand-fields-row p {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem; /* 150% */\n}\n\n.ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n}\n\n.ls-dv-field-properties-section {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.ls-dv-row {\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.ls-dv-multi-button-group-row {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.ls-dv-field-properties-section-text {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  padding: 0.25rem;\n}\n\n.ls-dv-field-properties-section-title {\n  color: $gray-90;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-dv-field-properties-section-description {\n  overflow: hidden;\n  color: $gray-80;\n  text-overflow: ellipsis;\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 0.75rem; /* 120% */\n}\n\n.ls-dv-input-row {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.ls-dv-input-row .ls-dv-input-wrapper input {\n  width: 9.313rem;\n  max-width: 9.313rem;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\na {\n  color: $primary-60;\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n  cursor: pointer;\n}\n\na:hover {\n  text-decoration: underline;\n  color: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.ls-dv-input-wrapper {\n  position: relative;\n  width: 100%;\n}\n\n#selectorIcon {\n  position: absolute;\n  top: 50%;\n  right: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n#selectLeadingIconDisabled {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-50;\n}\n\n\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\n  box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n  padding: 0.5rem 0.75rem;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  border-radius: 0.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover:not(:disabled),\nselect:hover:not(:disabled),\ntextarea:hover:not(:disabled) {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus:not(:disabled),\nselect:focus:not(:disabled),\ntextarea:focus:not(:disabled) {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active:not(:disabled),\nselect:active:not(:disabled),\ntextarea:active:not(:disabled) {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\n  color: $gray-50;\n  box-shadow: none;\n}\n\ninput[type='checkbox'] {\n  appearance: none;\n  position: relative;\n  height: 1rem;\n  width: 1rem;\n  padding: 0.25rem;\n  border-radius: var(--radius-sm);\n  border: 1px solid #d1d5db;\n  background-color: #ffffff;\n  cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].ls-dv-indeterminate {\n  background-color: $primary-60;\n  border: none;\n}\n\ninput[type='checkbox']:checked::after {\n  content: '';\n  position: absolute;\n  top: 45%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n  width: 0.5rem;\n  height: 0.25rem;\n  border-bottom: 0.125rem solid white;\n  border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].ls-dv-indeterminate::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 0.5rem;\n  height: 0.125rem;\n  background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\n  border: none;\n}\n\ninput[type='checkbox']:hover {\n  border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-20;\n  background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n  background-color: #f3f4f6;\n  outline: none;\n  cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n  background-color: #e5e7eb;\n  border: none;\n  outline: none;\n  cursor: not-allowed;\n}\n\n.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\n}\n\nbutton {\n  border: 0;\n  appearance: button;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--radius-lg);\n  background-color: $primary-60;\n  color: white;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n  width: 100%;\n}\n\n.ls-dv-button-group button {\n  display: flex;\n  width: 100%;\n  background: transparent;\n  border-radius: unset;\n  padding: 0.25rem 0.75rem;\n  min-width: 2.156rem;\n  color: $gray-80;\n}\n\n.ls-dv-button-group button:disabled {\n  background: $gray-10;\n  cursor: not-allowed;\n  color: $gray-50;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../types/LSApiElement';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { dvI18n } from '../../i18n/i18n';\n\n@Component({\n  tag: 'ls-field-properties-advanced',\n  styleUrl: 'ls-field-properties-advanced.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesAdvanced {\n  @Prop({ mutable: true }) dataItem: LSApiElement | LSApiElement[];\n  @Prop({ mutable: true }) expanded: boolean = false;\n  @Prop() readonly: boolean = false;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n    return (dt as LSApiElement[]).length === undefined;\n  }\n\n  isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n    return typeof (dt as LSApiElement[]).length === 'number';\n  }\n\n  // Send one or more mutations up the chain\n  // The source of the chain fires the mutation\n  // NOTE this alter is debounced to account for typing\n  alter(diff: object, bounceDelay: number = 0) {\n    console.log('Altering advanced props:', diff);\n    let diffs = [];\n    if (this.isMultiple(this.dataItem)) {\n      this.dataItem = this.dataItem.map(di => {\n        return { ...di, ...diff } as LSApiElement;\n      });\n\n      diffs = this.dataItem.map(di => {\n        return { action: 'update', data: { ...di, ...diff } as LSApiElement } as LSMutateEvent;\n      });\n    } else if (this.isSingle(this.dataItem)) {\n      this.dataItem = { ...this.dataItem, ...diff };\n\n      diffs = [{ action: 'update', data: { ...this.dataItem, ...diff } }];\n    }\n\n    if (bounceDelay === 0) {\n      this.mutate.emit(diffs);\n    }\n    else {\n      this.debounce(diffs, bounceDelay);\n    }\n  }\n\n  private titletimer;\n\n  debounce(diffs, delay) {\n    if (this.titletimer) clearTimeout(this.titletimer);\n\n    this.titletimer = setTimeout(() => {\n      this.mutate.emit(diffs);\n    }, delay);\n  }\n\n  getValue(key) {\n    if (this.isMultiple(this.dataItem)) {\n      return '';\n    } else if (this.isSingle(this.dataItem)) {\n      return this.dataItem[key];\n    }\n    return '';\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-dv-expand-fields-row'} onClick={() => (this.expanded = !this.expanded)}>\n          <ls-icon name={this.expanded ? 'expand-icon' : 'collapse-icon'} size={20} solid />\n          <p>{dvI18n.t('fieldproperties.advancedproperties')}</p>\n        </div>\n        {this.expanded && (\n          <div class={'ls-dv-field-set'}>\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.fieldorder')} sectionDescription={dvI18n.t('fieldproperties.fieldorderdescription')}>\n              <input value={this.getValue('fieldOrder')} type=\"number\" placeholder={dvI18n.t('fieldproperties.placeholdereg1')} onInput={e => {\n                console.log(e);\n                this.alter({ fieldOrder: (e.target as HTMLInputElement).value }, 100)\n              }} \n              onChange={() => { console.log('onchange')}}\n              disabled={this.readonly}\n              />\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.refname')}>\n              <input value={this.getValue('link')} placeholder={dvI18n.t('fieldproperties.placeholdercheckboxgroup')} onInput={e => this.alter({ link: (e.target as HTMLInputElement).value }, 300)} disabled={this.readonly} />\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.linktype')} sectionDescription={dvI18n.t('fieldproperties.linktypedescription')}>\n              <select onChange={e => this.alter({ linkType: (e.target as HTMLInputElement).value })} name=\"Link Field\" aria-label=\"Link Field\" disabled={this.readonly}>\n                <option value=\"0\" selected={this.getValue('linkType') === '0'}>\n                  {dvI18n.t('fieldproperties.linktypenoption')}\n                </option>\n                <option value=\"1\" selected={this.getValue('linkType') === '1'}>\n                  {dvI18n.t('fieldproperties.linktypeoneofgroup')}\n                </option>\n                <option value=\"2\" selected={this.getValue('linkType') === '2'}>\n                  {dvI18n.t('fieldproperties.linktypeaddtotal')}\n                </option>\n                <option value=\"3\" selected={this.getValue('linkType') === '3'}>\n                  {dvI18n.t('fieldproperties.linktypeconditional')}\n                </option>\n              </select>\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.linkvalue')} sectionDescription={dvI18n.t('fieldproperties.linkvaluedescription')}>\n              <input\n                value={this.getValue('logicAction')}\n                width=\"30\"\n                placeholder={dvI18n.t('fieldproperties.placeholdercheckboxgroup')}\n                onChange={e => this.alter({ logicAction: (e.target as HTMLInputElement).value })}\n                disabled={this.readonly}\n              />\n            </ls-props-section>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-BzEhzu-b.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ls-field-properties-advanced/ls-field-properties-advanced.scss?tag=ls-field-properties-advanced&encapsulation=shadow","src/components/ls-field-properties-advanced/ls-field-properties-advanced.tsx"],"sourcesContent":[":host, .ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n  position: relative;\n}\n\n* {\n  margin: 0;\n  box-sizing: border-box;\n}\n\n.ls-dv-expand-fields-row {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.5rem 0.25rem;\n  cursor: pointer;\n  color: $gray-80;\n  font-size: 0.875rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-dv-expand-fields-row p {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem; /* 150% */\n}\n\n.ls-dv-field-set {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n  width: 100%;\n}\n\n.ls-dv-field-properties-section {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n\n.ls-dv-row {\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n}\n\n.ls-dv-multi-button-group-row {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.ls-dv-field-properties-section-text {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  padding: 0.25rem;\n}\n\n.ls-dv-field-properties-section-title {\n  color: $gray-90;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.25rem; /* 142.857% */\n}\n\n.ls-dv-field-properties-section-description {\n  overflow: hidden;\n  color: $gray-80;\n  text-overflow: ellipsis;\n  font-size: 0.75rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 0.75rem; /* 120% */\n}\n\n.ls-dv-input-row {\n  display: flex;\n  gap: 0.5rem;\n}\n\n.ls-dv-input-row .ls-dv-input-wrapper input {\n  width: 9.313rem;\n  max-width: 9.313rem;\n}\n\n/* Global Styles */\n\np {\n  color: $gray-80;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n}\n\na {\n  color: $primary-60;\n  font-size: var(--text-sm);\n  font-style: normal;\n  font-weight: 400;\n  line-height: var(--text-sm-line-height);\n  cursor: pointer;\n}\n\na:hover {\n  text-decoration: underline;\n  color: $primary-70;\n}\n\n.ls-dv-button-link,\n.ls-dv-button-link:hover {\n  all: unset;\n}\n\nselect {\n  appearance: none;\n  height: 2.25rem;\n}\n\n.ls-dv-input-wrapper {\n  position: relative;\n  width: 100%;\n}\n\n#selectorIcon {\n  position: absolute;\n  top: 50%;\n  right: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n#selectLeadingIcon {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-80;\n}\n\n#selectLeadingIconDisabled {\n  position: absolute;\n  top: 50%;\n  left: 0.675rem;\n  transform: translateY(-50%);\n  pointer-events: none;\n  color: $gray-50;\n}\n\n\n.ls-dv-has-leading-icon {\n  padding-left: 2.5rem;\n}\n\ninput,\nselect,\ntextarea {\n  border: 1px solid $gray-40;\n  box-shadow: 0 1px 0.125rem rgba(0, 0, 0, 0.05);\n  padding: 0.5rem 0.75rem;\n  font-family: var(--font-family);\n  font-size: var(--text-sm);\n  border-radius: 0.625rem;\n  color: $gray-100;\n  font-weight: 400;\n}\n\ninput::placeholder,\nselect::placeholder,\ntextarea::placeholder {\n  color: $gray-60;\n}\n\ninput:hover:not(:disabled),\nselect:hover:not(:disabled),\ntextarea:hover:not(:disabled) {\n  border-color: $gray-50;\n  background-color: $white;\n}\n\ninput:focus:not(:disabled),\nselect:focus:not(:disabled),\ntextarea:focus:not(:disabled) {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-40;\n  border-color: $primary-60;\n  background-color: $white;\n}\n\ninput:active:not(:disabled),\nselect:active:not(:disabled),\ntextarea:active:not(:disabled) {\n  border-color: $primary-50;\n}\n\ninput:disabled,\nselect:disabled,\ntextarea:disabled {\n  cursor: not-allowed;\n  background-color: $gray-10;\n  color: $gray-50;\n  box-shadow: none;\n}\n\ninput[type='checkbox'] {\n  appearance: none;\n  position: relative;\n  height: 1rem;\n  width: 1rem;\n  padding: 0.25rem;\n  border-radius: var(--radius-sm);\n  border: 1px solid #d1d5db;\n  background-color: #ffffff;\n  cursor: pointer;\n}\n\ninput[type='checkbox']:checked,\ninput[type='checkbox'].ls-dv-indeterminate {\n  background-color: $primary-60;\n  border: none;\n}\n\ninput[type='checkbox']:checked::after {\n  content: '';\n  position: absolute;\n  top: 45%;\n  left: 50%;\n  transform: translate(-50%, -50%) rotate(-45deg) scale(-1, 1);\n  width: 0.5rem;\n  height: 0.25rem;\n  border-bottom: 0.125rem solid white;\n  border-right: 0.125rem solid white;\n}\n\ninput[type='checkbox'].ls-dv-indeterminate::after {\n  content: '';\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 0.5rem;\n  height: 0.125rem;\n  background-color: white;\n}\n\ninput[type='checkbox']:checked:hover,\ninput[type='checkbox'].ls-dv-indeterminate:hover {\n  background-color: $primary-70;\n  border: none;\n}\n\ninput[type='checkbox']:hover {\n  border: 1px solid #9ca3af;\n}\n\ninput[type='checkbox']:focus,\ninput[type='checkbox']:active {\n  outline: none;\n  box-shadow: 0 0 0 0.25rem $primary-20;\n  background-color: #f0f4f8;\n}\n\ninput[type='checkbox']:disabled {\n  background-color: #f3f4f6;\n  outline: none;\n  cursor: not-allowed;\n}\n\ninput[type='checkbox']:disabled:checked {\n  background-color: #e5e7eb;\n  border: none;\n  outline: none;\n  cursor: not-allowed;\n}\n\n.ls-dv-checkbox-container {\n  display: flex;\n  gap: 0.5rem;\n  width: 100%;\n}\n\n.ls-dv-checkbox-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 1rem;\n}\n\n.ls-dv-form-label {\n  color: $gray-100;\n  font-size: 1rem;\n  font-style: normal;\n  font-weight: 500;\n  line-height: 1.5rem;\n}\n\n.ls-dv-form-field {\n  display: flex;\n  flex-direction: column;\n  gap: 0.25rem;\n  width: 100%;\n}\n\n.ls-dv-loading-box {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100vh;\n  color: $primary-60;\n}\n\nbutton {\n  border: 0;\n  appearance: button;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--radius-lg);\n  background-color: $primary-60;\n  color: white;\n  text-transform: capitalize;\n  min-height: 2.25rem;\n  min-width: 2.25rem;\n}\n\nbutton.ls-dv-tertiary-grey {\n  border: 1px solid $gray-40;\n  background-color: white;\n  color: $gray-80;\n}\n\nbutton.ls-dv-tertiary-grey:hover {\n  border: 1px solid $gray-50;\n  background: $gray-10;\n}\n\n.ls-dv-button-group {\n  display: flex;\n  border-radius: 0.625rem;\n  border: 1px solid $gray-30;\n  background: $white;\n  overflow: clip;\n  width: 100%;\n}\n\n.ls-dv-button-group button {\n  display: flex;\n  width: 100%;\n  background: transparent;\n  border-radius: unset;\n  padding: 0.25rem 0.75rem;\n  min-width: 2.156rem;\n  color: $gray-80;\n}\n\n.ls-dv-button-group button:disabled {\n  background: $gray-10;\n  cursor: not-allowed;\n  color: $gray-50;\n}\n\n.ls-dv-button-group button:hover {\n  background: $gray-10;\n}\n\n.ls-dv-button-group > :first-child {\n  border-radius: 0.625rem 0 0 0.625rem;\n}\n\n.ls-dv-button-group > :last-child {\n  border-radius: 0 0.5rem 0.5rem 0;\n}\n\n.ls-dv-button-group > :not(:first-child) {\n  border-left: 1px solid $gray-30;\n}\n","import { Component, Host, Prop, h, Event, EventEmitter } from '@stencil/core';\nimport { LSApiElement } from '../../types/LSApiElement';\nimport { LSMutateEvent } from '../../types/LSMutateEvent';\nimport { dvI18n } from '../../i18n/i18n';\n\n@Component({\n  tag: 'ls-field-properties-advanced',\n  styleUrl: 'ls-field-properties-advanced.scss',\n  shadow: true,\n})\nexport class LsFieldPropertiesAdvanced {\n  @Prop({ mutable: true }) dataItem: LSApiElement | LSApiElement[];\n  @Prop({ mutable: true }) expanded: boolean = false;\n  @Prop() readonly: boolean = false;\n\n  @Event({\n    bubbles: true,\n    cancelable: true,\n    composed: true,\n  })\n  mutate: EventEmitter<LSMutateEvent[]>;\n\n  isSingle(dt: LSApiElement | LSApiElement[]): dt is LSApiElement {\n    return (dt as LSApiElement[]).length === undefined;\n  }\n\n  isMultiple(dt: LSApiElement | LSApiElement[]): dt is LSApiElement[] {\n    return typeof (dt as LSApiElement[]).length === 'number';\n  }\n\n  // Send one or more mutations up the chain\n  // The source of the chain fires the mutation\n  // NOTE this alter is debounced to account for typing\n  alter(diff: object, bounceDelay: number = 0) {\n    console.log('Altering advanced props:', diff);\n    let diffs = [];\n    if (this.isMultiple(this.dataItem)) {\n      this.dataItem = this.dataItem.map(di => {\n        return { ...di, ...diff } as LSApiElement;\n      });\n\n      diffs = this.dataItem.map(di => {\n        return { action: 'update', data: { ...di, ...diff } as LSApiElement } as LSMutateEvent;\n      });\n    } else if (this.isSingle(this.dataItem)) {\n      this.dataItem = { ...this.dataItem, ...diff };\n\n      diffs = [{ action: 'update', data: { ...this.dataItem, ...diff } }];\n    }\n\n    if (bounceDelay === 0) {\n      this.mutate.emit(diffs);\n    }\n    else {\n      this.debounce(diffs, bounceDelay);\n    }\n  }\n\n  private titletimer;\n\n  debounce(diffs, delay) {\n    if (this.titletimer) clearTimeout(this.titletimer);\n\n    this.titletimer = setTimeout(() => {\n      this.mutate.emit(diffs);\n    }, delay);\n  }\n\n  getValue(key) {\n    if (this.isMultiple(this.dataItem)) {\n      return '';\n    } else if (this.isSingle(this.dataItem)) {\n      return this.dataItem[key];\n    }\n    return '';\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={'ls-dv-expand-fields-row'} onClick={() => (this.expanded = !this.expanded)}>\n          <ls-icon name={this.expanded ? 'expand-icon' : 'collapse-icon'} size={20} solid />\n          <p>{dvI18n.t('fieldproperties.advancedproperties')}</p>\n        </div>\n        {this.expanded && (\n          <div class={'ls-dv-field-set'}>\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.fieldorder')} sectionDescription={dvI18n.t('fieldproperties.fieldorderdescription')}>\n              <input value={this.getValue('fieldOrder')} type=\"number\" placeholder={dvI18n.t('fieldproperties.placeholdereg1')} onInput={e => {\n                console.log(e);\n                this.alter({ fieldOrder: (e.target as HTMLInputElement).value }, 100)\n              }} \n              onChange={() => { console.log('onchange')}}\n              disabled={this.readonly}\n              />\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.refname')}>\n              <input value={this.getValue('link')} placeholder={dvI18n.t('fieldproperties.placeholdercheckboxgroup')} onInput={e => this.alter({ link: (e.target as HTMLInputElement).value }, 300)} disabled={this.readonly} />\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.linktype')} sectionDescription={dvI18n.t('fieldproperties.linktypedescription')}>\n              <select onChange={e => this.alter({ linkType: (e.target as HTMLInputElement).value })} name=\"Link Field\" aria-label=\"Link Field\" disabled={this.readonly}>\n                <option value=\"0\" selected={this.getValue('linkType') === '0'}>\n                  {dvI18n.t('fieldproperties.linktypenoption')}\n                </option>\n                <option value=\"1\" selected={this.getValue('linkType') === '1'}>\n                  {dvI18n.t('fieldproperties.linktypeoneofgroup')}\n                </option>\n                <option value=\"2\" selected={this.getValue('linkType') === '2'}>\n                  {dvI18n.t('fieldproperties.linktypeaddtotal')}\n                </option>\n                <option value=\"3\" selected={this.getValue('linkType') === '3'}>\n                  {dvI18n.t('fieldproperties.linktypeconditional')}\n                </option>\n              </select>\n            </ls-props-section>\n\n            <ls-props-section sectionTitle={dvI18n.t('fieldproperties.linkvalue')} sectionDescription={dvI18n.t('fieldproperties.linkvaluedescription')}>\n              <input\n                value={this.getValue('logicAction')}\n                width=\"30\"\n                placeholder={dvI18n.t('fieldproperties.placeholdercheckboxgroup')}\n                onChange={e => this.alter({ logicAction: (e.target as HTMLInputElement).value })}\n                disabled={this.readonly}\n              />\n            </ls-props-section>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}