@getflip/swirl-components 0.230.1 → 0.233.0

package/dist/esm/swirl-tree-view.entry.js

@@ -0,0 +1,208 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-2d054a87.js';
+
+const swirlTreeViewCss = ":host{display:block}:host *{box-sizing:border-box}.tree-view{display:flex;margin:0;padding:0;flex-direction:column;gap:var(--s-space-2)}";
+const SwirlTreeViewStyle0 = swirlTreeViewCss;
+
+const SwirlTreeView = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.expandedItemsChanged = createEvent(this, "expandedItemsChanged", 7);
+        this.onSlotChange = () => {
+            this.init();
+        };
+        this.initiallyExpandedItemIds = undefined;
+        this.label = undefined;
+    }
+    componentDidLoad() {
+        if (Boolean(this.initiallyExpandedItemIds)) {
+            this.expandItems(this.initiallyExpandedItemIds);
+        }
+        this.init();
+    }
+    async expandItems(itemIds) {
+        const items = this.getItems().filter((item) => itemIds.includes(item.id));
+        items.forEach((item) => item.expand());
+    }
+    onKeyDown(event) {
+        if (event.key === "ArrowDown") {
+            event.preventDefault();
+            this.selectNextItem();
+        }
+        else if (event.key === "ArrowUp") {
+            event.preventDefault();
+            this.selectPreviousItem();
+        }
+        else if (event.key === "ArrowRight") {
+            event.preventDefault();
+            this.expandSelectedItem();
+        }
+        else if (event.key === "ArrowLeft") {
+            event.preventDefault();
+            this.collapseSelectedItem();
+        }
+        else if (event.key === "Home") {
+            event.preventDefault();
+            this.selectFirstItem();
+        }
+        else if (event.key === "End") {
+            event.preventDefault();
+            this.selectLastItem();
+        }
+    }
+    onItemSelected(event) {
+        this.getItems().forEach((item) => {
+            if (item !== event.target) {
+                item.unselect();
+            }
+        });
+    }
+    onExpandedChange(event) {
+        const expandedItemIds = this.getItems()
+            .filter((item) => this.isItemExpanded(item))
+            .map((item) => item.id);
+        const changedItemGotExpanded = !Boolean(event.target.querySelector(':scope > li > [aria-expanded="true"]'));
+        if (changedItemGotExpanded) {
+            expandedItemIds.push(event.target.id);
+        }
+        else {
+            expandedItemIds.splice(expandedItemIds.indexOf(event.target.id), 1);
+        }
+        this.expandedItemsChanged.emit(expandedItemIds);
+    }
+    init() {
+        const selectedItem = this.getSelectedItem();
+        const allItems = this.getItems();
+        allItems.forEach((item) => item.unselect());
+        if (Boolean(selectedItem)) {
+            selectedItem.select();
+        }
+        else {
+            allItems[0]?.select();
+        }
+    }
+    selectFirstItem() {
+        this.unselectAllItems();
+        this.getItems()[0]?.select(true);
+    }
+    selectLastItem() {
+        const allItems = this.getItems();
+        const lastVisibleItem = allItems
+            .filter((item) => item.parentElement
+            .closest("swirl-tree-view-item")
+            ?.querySelector(':scope > li > [aria-expanded="true"]') ||
+            !Boolean(item.parentElement.closest("swirl-tree-view-item")))
+            .pop();
+        this.unselectAllItems();
+        lastVisibleItem?.select(true);
+    }
+    expandSelectedItem() {
+        const selectedItem = this.getSelectedItem();
+        if (!Boolean(selectedItem)) {
+            return;
+        }
+        const isExpanded = this.isItemExpanded(selectedItem);
+        if (isExpanded) {
+            this.selectNextItem();
+        }
+        else {
+            selectedItem.expand();
+        }
+    }
+    collapseSelectedItem() {
+        const selectedItem = this.getSelectedItem();
+        if (!Boolean(selectedItem)) {
+            return;
+        }
+        const isExpanded = this.isItemExpanded(selectedItem);
+        if (isExpanded) {
+            selectedItem.collapse();
+        }
+        else {
+            const parent = selectedItem.parentElement.closest("swirl-tree-view-item");
+            if (!Boolean(parent)) {
+                return;
+            }
+            this.unselectAllItems();
+            parent.select(true);
+        }
+    }
+    selectNextItem() {
+        const selectedItem = this.getSelectedItem();
+        const selectedItemExpanded = this.isItemExpanded(selectedItem);
+        const nextSibling = this.getNextSibling(selectedItem);
+        let parent = selectedItem.parentElement.closest("swirl-tree-view-item");
+        let nextSiblingOfParent = this.getNextSibling(parent);
+        while (Boolean(parent) && !Boolean(nextSiblingOfParent)) {
+            parent = parent?.parentElement.closest("swirl-tree-view-item, swirl-tree-view");
+            nextSiblingOfParent = this.getNextSibling(parent);
+        }
+        const firstChild = selectedItem.querySelector("swirl-tree-view-item");
+        const nextItem = selectedItemExpanded
+            ? firstChild
+            : nextSibling || nextSiblingOfParent;
+        if (!Boolean(nextItem)) {
+            return;
+        }
+        this.unselectAllItems();
+        nextItem.select?.(true);
+    }
+    selectPreviousItem() {
+        const allItems = this.getItems();
+        const selectedItem = this.getSelectedItem();
+        const previousSibling = this.getPreviousSibling(selectedItem);
+        const previousSiblingExpanded = Boolean(previousSibling?.querySelector('[aria-expanded="true"]'));
+        // find the last child of the nested previous sibling
+        if (previousSiblingExpanded) {
+            let lastChildOfNestedPreviousSibling = previousSibling?.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item");
+            let lastChildOfNestedPreviousSiblingExpanded = Boolean(lastChildOfNestedPreviousSibling?.querySelector('[aria-expanded="true"]'));
+            while (lastChildOfNestedPreviousSiblingExpanded) {
+                lastChildOfNestedPreviousSibling =
+                    lastChildOfNestedPreviousSibling?.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item");
+                lastChildOfNestedPreviousSiblingExpanded = Boolean(lastChildOfNestedPreviousSibling?.querySelector('[aria-expanded="true"]'));
+            }
+            allItems.forEach((item) => item.unselect());
+            lastChildOfNestedPreviousSibling.select?.(true);
+            return;
+        }
+        const parent = selectedItem.parentElement.closest("swirl-tree-view-item");
+        const previousItem = previousSibling || parent;
+        if (!Boolean(previousItem)) {
+            return;
+        }
+        allItems.forEach((item) => item.unselect());
+        previousItem.select?.(true);
+    }
+    unselectAllItems() {
+        this.getItems().forEach((item) => item.unselect());
+    }
+    getItems() {
+        return Array.from(this.el.querySelectorAll("swirl-tree-view-item"));
+    }
+    getSelectedItem() {
+        return this.getItems().find((item) => item.querySelector("a")?.getAttribute("aria-selected") === "true");
+    }
+    isItemExpanded(item) {
+        return Boolean(item.querySelector(':scope > li > [aria-expanded="true"]'));
+    }
+    getNextSibling(item) {
+        if (item?.nextElementSibling?.tagName === "SWIRL-TREE-VIEW-ITEM") {
+            return item.nextElementSibling;
+        }
+        const nestedSibling = item?.parentElement?.nextElementSibling?.querySelector("swirl-tree-view-item");
+        return nestedSibling ?? undefined;
+    }
+    getPreviousSibling(item) {
+        if (item?.previousElementSibling?.tagName === "SWIRL-TREE-VIEW-ITEM") {
+            return item.previousElementSibling;
+        }
+        const nestedSibling = item?.parentElement?.previousElementSibling?.querySelector("swirl-tree-view-item");
+        return nestedSibling ?? undefined;
+    }
+    render() {
+        return (h(Host, { key: '339267c7110db49dfa92d4e36ea7359666969819' }, h("ul", { key: '730cceb516e83f1ef72c8552fc26a510d225f069', "aria-label": this.label, class: "tree-view", role: "tree" }, h("slot", { key: 'dcde56962d621cfc40a170b80f9b8137809bf59e', onSlotchange: this.onSlotChange }))));
+    }
+    get el() { return getElement(this); }
+};
+SwirlTreeView.style = SwirlTreeViewStyle0;
+
+export { SwirlTreeView as swirl_tree_view };

package/dist/esm/swirl-video-thumbnail.entry.js

@@ -12,7 +12,7 @@ const SwirlVideoThumbnail = class {
         this.src = undefined;
     }
     render() {
-        return (h(Host, { key: '5bd9a490f2c97390886321c280a2988a4ef698d0' }, h("button", { key: '8364b72dcbfc56d66fd2e7cbd30c8579b64e3e7e', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '9007cc6e6dbd634e93fe995b19f559eacd00574a', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '31cd361f021f5863e0143ccee2cb6ae72d6ac213', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: 'd517d30b34ecbcaf255e6c335e663bebeac93df2' }, this.durationLabel), this.duration)), h("svg", { key: '45028d168793277f212e86c887879ca50d7f1b69', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'c7675ecd1bca43fad3ae2bd6ac3e4198ef0ec2b0', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
+        return (h(Host, { key: '684edd972d557cc5802faf12d68a39c840d34031' }, h("button", { key: '65eb5646d91cd405b87c932b92b00365501c4974', "aria-describedby": this.duration !== undefined ? "duration" : undefined, "aria-label": this.label, class: "video-thumbnail", type: "button" }, h("img", { key: '08cfb230f06c5ff59e66a0a0889dfc42ebfa7173', alt: "", class: "video-thumbnail__image", loading: "lazy", src: this.src }), this.duration && (h("span", { key: '47e734e3eb8502484ff75b70b40bc898e86a5d0b', class: "video-thumbnail__duration", id: "duration" }, h("swirl-visually-hidden", { key: '072d38dae3171d13d3f3659a56bd81c68ca857db' }, this.durationLabel), this.duration)), h("svg", { key: 'b2101678bd8ff47ccc11cb807d863599129ff018', class: "video-thumbnail__play-icon", fill: "none", viewBox: "0 0 40 40", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '7d4ad04198b7c65616acd6e89288cc51baa5c99c', d: "M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z", fill: "white", "fill-opacity": "0.95" })))));
     }
 };
 SwirlVideoThumbnail.style = SwirlVideoThumbnailStyle0;

package/dist/esm/swirl-visually-hidden.entry.js

@@ -8,7 +8,7 @@ const SwirlVisuallyHidden = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: '9b198c65730026a5e11513ff742104234ff0c1a7' }, h("slot", { key: '9873becced8ea85ffccdfc032163bbbe53df8fc6' })));
+        return (h(Host, { key: '85adc71e753de16a93f0110be0b49a9eb8be1ea6' }, h("slot", { key: '491582dfecab0bcf9dbb4821d346db75b9e2f8ca' })));
     }
 };
 SwirlVisuallyHidden.style = SwirlVisuallyHiddenStyle0;

package/dist/swirl-components/{p-587a0bab.entry.js → p-06335e41.entry.js}

@@ -1 +1 @@
-import{r as n,h as i,H as e}from"./p-e212b5b7.js";const a=class{constructor(i){n(this,i),this.durationLabel="Duration",this.duration=void 0,this.label=void 0,this.src=void 0}render(){return i(e,{key:"5bd9a490f2c97390886321c280a2988a4ef698d0"},i("button",{key:"8364b72dcbfc56d66fd2e7cbd30c8579b64e3e7e","aria-describedby":void 0!==this.duration?"duration":void 0,"aria-label":this.label,class:"video-thumbnail",type:"button"},i("img",{key:"9007cc6e6dbd634e93fe995b19f559eacd00574a",alt:"",class:"video-thumbnail__image",loading:"lazy",src:this.src}),this.duration&&i("span",{key:"31cd361f021f5863e0143ccee2cb6ae72d6ac213",class:"video-thumbnail__duration",id:"duration"},i("swirl-visually-hidden",{key:"d517d30b34ecbcaf255e6c335e663bebeac93df2"},this.durationLabel),this.duration),i("svg",{key:"45028d168793277f212e86c887879ca50d7f1b69",class:"video-thumbnail__play-icon",fill:"none",viewBox:"0 0 40 40",xmlns:"http://www.w3.org/2000/svg"},i("path",{key:"c7675ecd1bca43fad3ae2bd6ac3e4198ef0ec2b0",d:"M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z",fill:"white","fill-opacity":"0.95"}))))}};a.style=':host {\n  display: flex;\n  width: 100%;\n}\n\n  :host * {\n    box-sizing: border-box;\n  }\n\n.video-thumbnail {\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  container-type: inline-size;\n  container-name: video-thumbnail;\n}\n\n.video-thumbnail:after {\n    position: absolute;\n    background-color: rgba(0, 0, 0, 0.05);\n    content: "";\n    inset: 0;\n  }\n\n.video-thumbnail:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n.video-thumbnail:focus-visible {\n    outline-color: var(--s-focus-default);\n    outline-offset: var(--s-space-4);\n  }\n\n.video-thumbnail__image {\n  width: 100%;\n}\n\n.video-thumbnail__duration {\n  position: absolute;\n  bottom: var(--s-space-8);\n  left: var(--s-space-8);\n  padding: var(--s-space-2) var(--s-space-8);\n  border-radius: var(--s-border-radius-sm);\n  color: var(--s-text-on-image);\n  background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n    rgba(255, 255, 255, 0.1);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  letter-spacing: var(--s-letter-spacing-tighter);\n}\n\n.video-thumbnail__play-icon {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  left: 50%;\n  width: 2.5rem;\n  height: 2.5rem;\n  transform: translate3d(-50%, -50%, 0);\n}\n\n@container video-thumbnail (min-width: 448px) {\n  .video-thumbnail__play-icon {\n    width: 3.5rem;\n    height: 4.5rem;\n  }\n}\n';export{a as swirl_video_thumbnail}
+import{r as n,h as i,H as e}from"./p-e212b5b7.js";const a=class{constructor(i){n(this,i),this.durationLabel="Duration",this.duration=void 0,this.label=void 0,this.src=void 0}render(){return i(e,{key:"684edd972d557cc5802faf12d68a39c840d34031"},i("button",{key:"65eb5646d91cd405b87c932b92b00365501c4974","aria-describedby":void 0!==this.duration?"duration":void 0,"aria-label":this.label,class:"video-thumbnail",type:"button"},i("img",{key:"08cfb230f06c5ff59e66a0a0889dfc42ebfa7173",alt:"",class:"video-thumbnail__image",loading:"lazy",src:this.src}),this.duration&&i("span",{key:"47e734e3eb8502484ff75b70b40bc898e86a5d0b",class:"video-thumbnail__duration",id:"duration"},i("swirl-visually-hidden",{key:"072d38dae3171d13d3f3659a56bd81c68ca857db"},this.durationLabel),this.duration),i("svg",{key:"b2101678bd8ff47ccc11cb807d863599129ff018",class:"video-thumbnail__play-icon",fill:"none",viewBox:"0 0 40 40",xmlns:"http://www.w3.org/2000/svg"},i("path",{key:"7d4ad04198b7c65616acd6e89288cc51baa5c99c",d:"M15 14.65V25.35C15 26.1167 15.35 26.7 16.05 27.1C16.75 27.5 17.4333 27.4667 18.1 27L26.4 21.7C27.0333 21.3 27.35 20.7333 27.35 20C27.35 19.2667 27.0333 18.7 26.4 18.3L18.1 13C17.4333 12.5333 16.75 12.5 16.05 12.9C15.35 13.3 15 13.8833 15 14.65ZM20 40C17.2333 40 14.6333 39.4747 12.2 38.424C9.76667 37.3747 7.65 35.95 5.85 34.15C4.05 32.35 2.62533 30.2333 1.576 27.8C0.525334 25.3667 0 22.7667 0 20C0 17.2333 0.525334 14.6333 1.576 12.2C2.62533 9.76667 4.05 7.65 5.85 5.85C7.65 4.05 9.76667 2.62467 12.2 1.574C14.6333 0.524667 17.2333 0 20 0C22.7667 0 25.3667 0.524667 27.8 1.574C30.2333 2.62467 32.35 4.05 34.15 5.85C35.95 7.65 37.3747 9.76667 38.424 12.2C39.4747 14.6333 40 17.2333 40 20C40 22.7667 39.4747 25.3667 38.424 27.8C37.3747 30.2333 35.95 32.35 34.15 34.15C32.35 35.95 30.2333 37.3747 27.8 38.424C25.3667 39.4747 22.7667 40 20 40Z",fill:"white","fill-opacity":"0.95"}))))}};a.style=':host {\n  display: flex;\n  width: 100%;\n}\n\n  :host * {\n    box-sizing: border-box;\n  }\n\n.video-thumbnail {\n  position: relative;\n  display: inline-flex;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  container-type: inline-size;\n  container-name: video-thumbnail;\n}\n\n.video-thumbnail:after {\n    position: absolute;\n    background-color: rgba(0, 0, 0, 0.05);\n    content: "";\n    inset: 0;\n  }\n\n.video-thumbnail:focus:not(:focus-visible) {\n    outline: none;\n  }\n\n.video-thumbnail:focus-visible {\n    outline-color: var(--s-focus-default);\n    outline-offset: var(--s-space-4);\n  }\n\n.video-thumbnail__image {\n  width: 100%;\n}\n\n.video-thumbnail__duration {\n  position: absolute;\n  bottom: var(--s-space-8);\n  left: var(--s-space-8);\n  padding: var(--s-space-2) var(--s-space-8);\n  border-radius: var(--s-border-radius-sm);\n  color: var(--s-text-on-image);\n  background: linear-gradient(0deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),\n    rgba(255, 255, 255, 0.1);\n  font-size: var(--s-font-size-sm);\n  font-weight: var(--s-font-weight-medium);\n  line-height: var(--s-line-height-sm);\n  letter-spacing: var(--s-letter-spacing-tighter);\n}\n\n.video-thumbnail__play-icon {\n  position: absolute;\n  z-index: 1;\n  top: 50%;\n  left: 50%;\n  width: 2.5rem;\n  height: 2.5rem;\n  transform: translate3d(-50%, -50%, 0);\n}\n\n@container video-thumbnail (min-width: 448px) {\n  .video-thumbnail__play-icon {\n    width: 3.5rem;\n    height: 4.5rem;\n  }\n}\n';export{a as swirl_video_thumbnail}

package/dist/swirl-components/p-77357e84.entry.js

@@ -0,0 +1 @@
+import{r as e,c as t,h as i,H as s,g as r}from"./p-e212b5b7.js";const o=class{constructor(i){e(this,i),this.expandedItemsChanged=t(this,"expandedItemsChanged",7),this.onSlotChange=()=>{this.init()},this.initiallyExpandedItemIds=void 0,this.label=void 0}componentDidLoad(){Boolean(this.initiallyExpandedItemIds)&&this.expandItems(this.initiallyExpandedItemIds),this.init()}async expandItems(e){this.getItems().filter((t=>e.includes(t.id))).forEach((e=>e.expand()))}onKeyDown(e){"ArrowDown"===e.key?(e.preventDefault(),this.selectNextItem()):"ArrowUp"===e.key?(e.preventDefault(),this.selectPreviousItem()):"ArrowRight"===e.key?(e.preventDefault(),this.expandSelectedItem()):"ArrowLeft"===e.key?(e.preventDefault(),this.collapseSelectedItem()):"Home"===e.key?(e.preventDefault(),this.selectFirstItem()):"End"===e.key&&(e.preventDefault(),this.selectLastItem())}onItemSelected(e){this.getItems().forEach((t=>{t!==e.target&&t.unselect()}))}onExpandedChange(e){const t=this.getItems().filter((e=>this.isItemExpanded(e))).map((e=>e.id));Boolean(e.target.querySelector(':scope > li > [aria-expanded="true"]'))?t.splice(t.indexOf(e.target.id),1):t.push(e.target.id),this.expandedItemsChanged.emit(t)}init(){const e=this.getSelectedItem(),t=this.getItems();t.forEach((e=>e.unselect())),Boolean(e)?e.select():t[0]?.select()}selectFirstItem(){this.unselectAllItems(),this.getItems()[0]?.select(!0)}selectLastItem(){const e=this.getItems().filter((e=>e.parentElement.closest("swirl-tree-view-item")?.querySelector(':scope > li > [aria-expanded="true"]')||!Boolean(e.parentElement.closest("swirl-tree-view-item")))).pop();this.unselectAllItems(),e?.select(!0)}expandSelectedItem(){const e=this.getSelectedItem();Boolean(e)&&(this.isItemExpanded(e)?this.selectNextItem():e.expand())}collapseSelectedItem(){const e=this.getSelectedItem();if(Boolean(e))if(this.isItemExpanded(e))e.collapse();else{const t=e.parentElement.closest("swirl-tree-view-item");if(!Boolean(t))return;this.unselectAllItems(),t.select(!0)}}selectNextItem(){const e=this.getSelectedItem(),t=this.isItemExpanded(e),i=this.getNextSibling(e);let s=e.parentElement.closest("swirl-tree-view-item"),r=this.getNextSibling(s);for(;Boolean(s)&&!Boolean(r);)s=s?.parentElement.closest("swirl-tree-view-item, swirl-tree-view"),r=this.getNextSibling(s);const o=e.querySelector("swirl-tree-view-item"),l=t?o:i||r;Boolean(l)&&(this.unselectAllItems(),l.select?.(!0))}selectPreviousItem(){const e=this.getItems(),t=this.getSelectedItem(),i=this.getPreviousSibling(t);if(Boolean(i?.querySelector('[aria-expanded="true"]'))){let t=i?.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item"),s=Boolean(t?.querySelector('[aria-expanded="true"]'));for(;s;)t=t?.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item"),s=Boolean(t?.querySelector('[aria-expanded="true"]'));return e.forEach((e=>e.unselect())),void t.select?.(!0)}const s=t.parentElement.closest("swirl-tree-view-item"),r=i||s;Boolean(r)&&(e.forEach((e=>e.unselect())),r.select?.(!0))}unselectAllItems(){this.getItems().forEach((e=>e.unselect()))}getItems(){return Array.from(this.el.querySelectorAll("swirl-tree-view-item"))}getSelectedItem(){return this.getItems().find((e=>"true"===e.querySelector("a")?.getAttribute("aria-selected")))}isItemExpanded(e){return Boolean(e.querySelector(':scope > li > [aria-expanded="true"]'))}getNextSibling(e){if("SWIRL-TREE-VIEW-ITEM"===e?.nextElementSibling?.tagName)return e.nextElementSibling;const t=e?.parentElement?.nextElementSibling?.querySelector("swirl-tree-view-item");return t??void 0}getPreviousSibling(e){if("SWIRL-TREE-VIEW-ITEM"===e?.previousElementSibling?.tagName)return e.previousElementSibling;const t=e?.parentElement?.previousElementSibling?.querySelector("swirl-tree-view-item");return t??void 0}render(){return i(s,{key:"339267c7110db49dfa92d4e36ea7359666969819"},i("ul",{key:"730cceb516e83f1ef72c8552fc26a510d225f069","aria-label":this.label,class:"tree-view",role:"tree"},i("slot",{key:"dcde56962d621cfc40a170b80f9b8137809bf59e",onSlotchange:this.onSlotChange})))}get el(){return r(this)}};o.style=":host{display:block}:host *{box-sizing:border-box}.tree-view{display:flex;margin:0;padding:0;flex-direction:column;gap:var(--s-space-2)}";export{o as swirl_tree_view}

package/dist/swirl-components/{p-d2cf7884.entry.js → p-a6d1f15d.entry.js}

@@ -1 +1 @@
-import{r as e,h as i,H as a}from"./p-e212b5b7.js";const t={directories:[{name:"Development",description:"Updated 2 days ago.",children:[{description:"1.02 MB, updated 2 days ago.",name:"sample.pdf",type:"application/pdf",url:"/sample.pdf"},{description:"124 KB, updated a month ago.",name:"sample.jpg",type:"image/jpeg",url:"/sample.jpg"}]},{name:"People",description:"Updated just now.",children:[]}]},s=class{constructor(i){e(this,i),this.selectItem=e=>{"type"in e?(this.selectedFile=e,this.layout.changeMobileView("body")):this.selectedDirectory=e},this.resetSelectedDirectory=()=>{this.selectedDirectory=void 0},this.toggleSidebar=()=>{this.layout?.toggleSidebar()},this.selectedDirectory=void 0,this.selectedFile=void 0,this.sortMenu=void 0}renderNavigation(){const e=Boolean(this.selectedDirectory)?this.selectedDirectory.children:t.directories;return e.length>0?e.map((e=>i("swirl-resource-list-item",{description:e.description,key:e.name,label:e.name,onClick:()=>this.selectItem(e)},i("type"in e?"swirl-icon-file":"swirl-icon-folder-shared",{slot:"media"})))):i("swirl-box",{padding:"16"},i("swirl-text",{color:"subdued",weight:"medium"},"This directory is empty."))}render(){return i(a,{key:"c0eb98fdfc638cc1dcb06483b59c34073ba54552"},i("swirl-app-layout",{key:"556761b8d4f4d437ae0985c790a22e60c9315f1d",appName:"Documents",backToNavigationViewButtonLabel:"Back to documents list",ctaIcon:"<swirl-icon-add></swirl-icon-add>",ctaLabel:"Upload file",navigationLabel:"Documents",onNavigationBackButtonClick:this.resetSelectedDirectory,ref:e=>this.layout=e,sidebarCloseButtonLabel:"Close file info",sidebarHeading:"File info",showNavigationBackButton:Boolean(this.selectedDirectory),transitionStyle:"dialog"},i("swirl-resource-list",{key:"39885e858c41e429cab968112aa7b984f9705ea2",label:"Documents",slot:"navigation"},this.renderNavigation()),i("swirl-popover-trigger",{key:"77c6ea5fe1b94028a5695e9d9ee632c36531fa0d",swirlPopover:this.sortMenu,slot:"navigation-controls"},i("swirl-button",{key:"44c5aaa2536049f775c618dce507b3958e7cdd2a",label:"Sort items"})),i("swirl-stack",{key:"f67fa0a23d84b5d8ee934abc92ca510d566a9ca8",orientation:"horizontal",slot:"app-bar"},i("swirl-stack",{key:"6db42bf7b5f71cf829392ad4a0c93d8dd715180f"},i("swirl-heading",{key:"8f78f58b16624d768574ca3cf210c8caae1207fa",as:"h2",level:4,text:this.selectedFile?.name}),i("swirl-text",{key:"8a08ec5e7ebbcf1b186a74782efe4e2255fe36ee",color:"subdued",truncate:!0},this.selectedFile?.description))),Boolean(this.selectedFile)?i("swirl-file-viewer",{file:this.selectedFile.url,slot:"content",type:this.selectedFile.type}):i("swirl-box",{cover:!0,centerBlock:!0,centerInline:!0,padding:"16",slot:"content"},i("swirl-empty-state",{heading:"Nothing to see here.",illustration:"/images/empty-state-1.svg"},"Please select a file from the list.")),i("div",{key:"6c6e485139d39df02ededf75d8a8e6b010df2bb9",slot:"app-bar-controls"},this.selectedFile&&i("swirl-button",{key:"dae62a4ba25cae3853b62d81a000fed470e1ff2d","hide-label":!0,class:"info-button",icon:"<swirl-icon-info></swirl-icon-info>",label:"Open file info",onClick:this.toggleSidebar})),i("swirl-box",{key:"815594196ba28b9e8e434201d88dbf5a6dd85a87",padding:"16",slot:"sidebar"},i("swirl-text",{key:"3afe3f3e24a5b5462e9f6881c61522e1478c849f",color:"subdued",weight:"medium"},"File info goes here …"))),i("swirl-popover",{key:"9f2e84faef9a03e396c1dc668f330d2622c7697e",label:"Sort items",ref:e=>this.sortMenu=e},i("swirl-option-list",{key:"bc6a5c70fe046c88bab5464e7df49d3a20b3feb9",value:["ascending"]},i("swirl-option-list-item",{key:"ec52b57885f7c33ca477ef8f6a505f57b31a6683",icon:"<swirl-icon-expand-less></swirl-icon-expand-less>",label:"Ascending",value:"ascending"}),i("swirl-option-list-item",{key:"56e2c341fe923eb943777655d687a6410224a1d3",icon:"<swirl-icon-expand-more></swirl-icon-expand-more>",label:"Descending",value:"descending"}),i("swirl-option-list-item",{key:"d51a2dbf1785bc86823b72c36facc0c2427b987b",icon:"<swirl-icon-time-outlined></swirl-icon-time-outlined>",label:"By date",value:"date"}))))}};export{s as file_manager}
+import{r as e,h as i,H as t}from"./p-e212b5b7.js";const a={directories:[{name:"Development",description:"Updated 2 days ago.",children:[{description:"1.02 MB, updated 2 days ago.",name:"sample.pdf",type:"application/pdf",url:"/sample.pdf"},{description:"124 KB, updated a month ago.",name:"sample.jpg",type:"image/jpeg",url:"/sample.jpg"}]},{name:"People",description:"Updated just now.",children:[]}]},s=class{constructor(i){e(this,i),this.selectItem=e=>{"type"in e?(this.selectedFile=e,this.layout.changeMobileView("body")):this.selectedDirectory=e},this.resetSelectedDirectory=()=>{this.selectedDirectory=void 0},this.toggleSidebar=()=>{this.layout?.toggleSidebar()},this.selectedDirectory=void 0,this.selectedFile=void 0,this.sortMenu=void 0}renderNavigation(){const e=Boolean(this.selectedDirectory)?this.selectedDirectory.children:a.directories;return e.length>0?e.map((e=>i("swirl-resource-list-item",{description:e.description,key:e.name,label:e.name,onClick:()=>this.selectItem(e)},i("type"in e?"swirl-icon-file":"swirl-icon-folder-shared",{slot:"media"})))):i("swirl-box",{padding:"16"},i("swirl-text",{color:"subdued",weight:"medium"},"This directory is empty."))}render(){return i(t,{key:"3eff9c0bba9c10b143916cb3d00cedbc5bcfe050"},i("swirl-app-layout",{key:"85f69e777a24d3362bc5eed4d724c54e1326c845",appName:"Documents",backToNavigationViewButtonLabel:"Back to documents list",ctaIcon:"<swirl-icon-add></swirl-icon-add>",ctaLabel:"Upload file",navigationLabel:"Documents",onNavigationBackButtonClick:this.resetSelectedDirectory,ref:e=>this.layout=e,sidebarCloseButtonLabel:"Close file info",sidebarHeading:"File info",showNavigationBackButton:Boolean(this.selectedDirectory),transitionStyle:"dialog"},i("swirl-resource-list",{key:"98d7da7702fdd4c4accb0e8249f2ccc5ecf55e29",label:"Documents",slot:"navigation"},this.renderNavigation()),i("swirl-popover-trigger",{key:"16eb5271929830c6715f18b63b63588df73c11fe",swirlPopover:this.sortMenu,slot:"navigation-controls"},i("swirl-button",{key:"59b711996f00146f8759376e8b8cabafcc76920c",label:"Sort items"})),i("swirl-stack",{key:"c282643701ea09f60ec3eb79a703e9e4d098fbbd",orientation:"horizontal",slot:"app-bar"},i("swirl-stack",{key:"bb0a446b2eb61a634ea0d791a87ce5d9f3ba6e0a"},i("swirl-heading",{key:"41445130a7b9024c35db0df369c9ad5985c23a46",as:"h2",level:4,text:this.selectedFile?.name}),i("swirl-text",{key:"e159850b75591af14e56cdfcebbb270acb545add",color:"subdued",truncate:!0},this.selectedFile?.description))),Boolean(this.selectedFile)?i("swirl-file-viewer",{file:this.selectedFile.url,slot:"content",type:this.selectedFile.type}):i("swirl-box",{cover:!0,centerBlock:!0,centerInline:!0,padding:"16",slot:"content"},i("swirl-empty-state",{heading:"Nothing to see here.",illustration:"/images/empty-state-1.svg"},"Please select a file from the list.")),i("div",{key:"56527b6068e3e6af690b851c1ee405f2e6561ed3",slot:"app-bar-controls"},this.selectedFile&&i("swirl-button",{key:"91be84a2271698f308c09b8dbfcfa9fdb0c67d41","hide-label":!0,class:"info-button",icon:"<swirl-icon-info></swirl-icon-info>",label:"Open file info",onClick:this.toggleSidebar})),i("swirl-box",{key:"8d9dcb8e0b2fa44fa7a57892edbe262150f0750b",padding:"16",slot:"sidebar"},i("swirl-text",{key:"9958d84992b0dcf5a079d924b6e3e02bb2b8f544",color:"subdued",weight:"medium"},"File info goes here …"))),i("swirl-popover",{key:"f5ceccc29d6488b528b32d363511731a38688a80",label:"Sort items",ref:e=>this.sortMenu=e},i("swirl-option-list",{key:"736355e26ee48634d7a6005b235fc9c5e0940746",value:["ascending"]},i("swirl-option-list-item",{key:"8f256bc83e158f1eb51b5e0d749a85fbba94eff1",icon:"<swirl-icon-expand-less></swirl-icon-expand-less>",label:"Ascending",value:"ascending"}),i("swirl-option-list-item",{key:"03092be4c5bf6c3363b95b06304a834c991d7cf5",icon:"<swirl-icon-expand-more></swirl-icon-expand-more>",label:"Descending",value:"descending"}),i("swirl-option-list-item",{key:"21a718300bbc7ec8092a0c2c97844e56493f44cd",icon:"<swirl-icon-time-outlined></swirl-icon-time-outlined>",label:"By date",value:"date"}))))}};export{s as file_manager}

package/dist/swirl-components/p-e1aab223.entry.js

@@ -0,0 +1 @@
+import{r as e,h as r,H as a}from"./p-e212b5b7.js";const i=class{constructor(r){e(this,r)}render(){return r(a,{key:"85adc71e753de16a93f0110be0b49a9eb8be1ea6"},r("slot",{key:"491582dfecab0bcf9dbb4821d346db75b9e2f8ca"}))}};i.style=".sc-swirl-visually-hidden-h{position:absolute;display:inline;overflow:hidden;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;word-wrap:normal;clip:rect(0, 0, 0, 0)}";export{i as swirl_visually_hidden}

package/dist/swirl-components/p-fb443d8f.entry.js

@@ -0,0 +1 @@
+import{r as e,c as i,h as t,F as s,H as r,g as a}from"./p-e212b5b7.js";import{c}from"./p-a5dce9e6.js";const o=class{constructor(t){e(this,t),this.expandedChange=i(this,"expandedChange",7),this.itemSelected=i(this,"itemSelected",7),this.onFocus=()=>{this.selected||this.select()},this.onClickCollapse=e=>{e.preventDefault(),e.stopPropagation(),this.collapse()},this.onClickExpand=e=>{e.preventDefault(),e.stopPropagation(),this.expand()},this.active=void 0,this.href=void 0,this.icon=void 0,this.itemId=void 0,this.label=void 0,this.expanded=!1,this.hasChildren=!1,this.level=0,this.selected=!1}componentWillLoad(){this.updateLevel(),this.hasChildren=Boolean(this.el.querySelector("swirl-tree-view-item"))}async expand(){this.expanded=!0,this.expandedChange.emit(this.expanded)}async collapse(){this.expanded=!1,this.expandedChange.emit(this.expanded)}async select(e){this.selected=!0,e&&this.link?.focus(),this.itemSelected.emit(this.el)}async unselect(){this.selected=!1}updateLevel(){let e=this.el.parentElement?.closest("swirl-tree-view-item");for(;Boolean(e);)this.level+=1,e=e.parentElement?.closest("swirl-tree-view-item")}render(){const e=Boolean(this.el.querySelector('[slot="tags"]')),i=Boolean(this.icon)&&/\p{Extended_Pictographic}/u.test(this.icon),a=c("tree-view-item",{"tree-view-item--active":this.active,"tree-view-item--has-tags":e});return t(r,{key:"177446baadd42d3508d8c3fead6b179e26feedde",id:this.itemId,role:"none"},t("li",{key:"72d29bdca3bbb72f398e4d481bdce1f2ce70b0a1",class:a,role:"none"},t("a",{key:"6eb8a17c4b7982dd3445b9c7f24ecbc80a621ec6","aria-current":this.active?"page":void 0,"aria-expanded":this.hasChildren?String(this.expanded):void 0,"aria-level":this.level+1,"aria-owns":this.hasChildren?`${this.itemId}-children`:void 0,"aria-selected":String(this.selected),class:"tree-view-item__link",href:this.href,onFocus:this.onFocus,style:{paddingLeft:`calc(${this.level} * var(--s-space-12) + var(--s-space-4))`},ref:e=>this.link=e,role:"treeitem",tabIndex:this.selected?0:-1},t("span",{key:"72ab5ef8765690990f04bb76d7dc610b4ae18f3b",class:"tree-view-item__toggle-icon"},this.hasChildren&&t(s,{key:"b6809cfdd91b53eb4d37c94ce899933daeb85020"},this.expanded?t("swirl-icon-expand-more",{onClick:this.onClickCollapse,size:24}):t("swirl-icon-chevron-right",{onClick:this.onClickExpand,size:24}))),Boolean(this.icon)&&t(s,{key:"040fccdd39595e4988b515257cd0a7fdb62a74e1"},t("span",{key:"9a8121ef9e3b7e5a508345259550216ed02e6337",class:"tree-view-item__icon"},i?this.icon:t("swirl-icon",{glyph:this.icon,size:24}))),t("span",{key:"113f4b3cd34284bd6c0b022f8ca3d0fc8e28a5a1",class:"tree-view-item__label"},this.label),t("span",{key:"b3b1efebbaf2b6e254d90570fba4ce61c5bd979b",class:"tree-view-item__tags"},t("slot",{key:"f27e893394cd489ff21a36651b5cac353fbdf78e",name:"tags"}))),t("ul",{key:"3618fcdd7471c7642ed5d1aa566d9ca7615b9a6b","aria-label":this.label,class:"tree-view-item__children",id:`${this.itemId}-children`,role:"group",style:{display:this.expanded&&this.hasChildren?void 0:"none"}},t("slot",{key:"caa44b704e4de4d2dbd6a297830d2d3d9453038e"}))))}get el(){return a(this)}};o.style=".sc-swirl-tree-view-item-h{display:block;flex-grow:1}.sc-swirl-tree-view-item-h *.sc-swirl-tree-view-item{box-sizing:border-box}.tree-view-item.sc-swirl-tree-view-item{list-style:none}.tree-view-item--active.sc-swirl-tree-view-item>.tree-view-item__link.sc-swirl-tree-view-item{background-color:var(--s-background-hovered)}.tree-view-item--has-tags.sc-swirl-tree-view-item .tree-view-item__tags.sc-swirl-tree-view-item{display:flex}.tree-view-item__children.sc-swirl-tree-view-item{display:flex;margin:0;padding:0;flex-direction:column;gap:var(--s-space-2)}.tree-view-item__link.sc-swirl-tree-view-item{display:flex;height:2.25rem;padding:var(--s-space-4) var(--s-space-8) var(--s-space-4) var(--s-space-4);align-items:center;border-radius:var(--s-border-radius-sm);color:var(--s-text-default);background-color:var(--s-background-default);font-size:var(--s-font-size-base);font-weight:var(--s-font-weight-medium);text-decoration:none;gap:var(--s-space-4)}.tree-view-item__link.sc-swirl-tree-view-item:hover{background-color:var(--s-background-hovered)}.tree-view-item__link.sc-swirl-tree-view-item:active{background-color:var(--s-background-pressed)}.tree-view-item__link.sc-swirl-tree-view-item:focus:not(:focus-visible){outline:none}.tree-view-item__link.sc-swirl-tree-view-item:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tree-view-item__link.sc-swirl-tree-view-item{font-size:var(--s-font-size-sm)}}.tree-view-item__icon.sc-swirl-tree-view-item{display:block;width:1.5rem;height:1.5rem;margin-right:var(--s-space-4);flex-grow:0;flex-shrink:0;color:var(--s-icon-default);font-size:var(--s-font-size-lg)}.tree-view-item__icon.sc-swirl-tree-view-item .sc-swirl-tree-view-item::part(icon){width:100%;height:100%}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tree-view-item__icon.sc-swirl-tree-view-item{width:1.25rem;height:1.25rem;font-size:var(--s-font-size-base)}}.tree-view-item__toggle-icon.sc-swirl-tree-view-item{display:block;width:1.5rem;height:1.5rem;flex-grow:0;flex-shrink:0;color:var(--s-icon-default)}.tree-view-item__toggle-icon.sc-swirl-tree-view-item .sc-swirl-tree-view-item::part(icon){width:100%;height:100%}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.tree-view-item__toggle-icon.sc-swirl-tree-view-item{width:1.25rem;height:1.25rem}}.tree-view-item__label.sc-swirl-tree-view-item{overflow:hidden;min-width:5rem;flex-grow:1;white-space:nowrap;text-overflow:ellipsis}.tree-view-item__tags.sc-swirl-tree-view-item{display:none;padding-left:var(--s-space-4);align-items:center;gap:var(--s-space-4)}";export{o as swirl_tree_view_item}