@kubex/zinc 1.1.173 → 1.1.175

package/dist/custom-elements.json

@@ -56,6 +56,79 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/action-bar/action-bar.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ZnActionBar",
+          "cssProperties": [
+            {
+              "description": "An example CSS custom property.",
+              "name": "--example"
+            }
+          ],
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The default slot.",
+              "name": ""
+            },
+            {
+              "description": "An example slot.",
+              "name": "example"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            }
+          ],
+          "events": [
+            {
+              "description": "Emitted as an example.",
+              "name": "zn-event-name"
+            }
+          ],
+          "superclass": {
+            "name": "ZincElement",
+            "module": "/src/internal/zinc-element"
+          },
+          "summary": "Short summary of the component's intended use.",
+          "tagNameWithoutPrefix": "action-bar",
+          "tagName": "zn-action-bar",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
+          "documentation": "https://zinc.style/components/action-bar",
+          "status": "experimental",
+          "since": "1.0",
+          "dependencies": [
+            "zn-example"
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ZnActionBar",
+            "module": "components/action-bar/action-bar.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/alert/alert.js",
@@ -250,79 +323,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/action-bar/action-bar.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ZnActionBar",
-          "cssProperties": [
-            {
-              "description": "An example CSS custom property.",
-              "name": "--example"
-            }
-          ],
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The default slot.",
-              "name": ""
-            },
-            {
-              "description": "An example slot.",
-              "name": "example"
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
-            }
-          ],
-          "events": [
-            {
-              "description": "Emitted as an example.",
-              "name": "zn-event-name"
-            }
-          ],
-          "superclass": {
-            "name": "ZincElement",
-            "module": "/src/internal/zinc-element"
-          },
-          "summary": "Short summary of the component's intended use.",
-          "tagNameWithoutPrefix": "action-bar",
-          "tagName": "zn-action-bar",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Short summary of the component's intended use.\n * @documentation https://zinc.style/components/action-bar\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-example\n *\n * @event zn-event-name - Emitted as an example.\n *\n * @slot - The default slot.\n * @slot example - An example slot.\n *\n * @csspart base - The component's base wrapper.\n *\n * @cssproperty --example - An example CSS custom property.\n */",
-          "documentation": "https://zinc.style/components/action-bar",
-          "status": "experimental",
-          "since": "1.0",
-          "dependencies": [
-            "zn-example"
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "ZnActionBar",
-            "module": "components/action-bar/action-bar.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/animated-button/animated-button.js",
@@ -9330,7 +9330,7 @@
               "kind": "method",
               "name": "_populateSharableFields",
               "privacy": "private",
-              "description": "Push the shared state back into the actual DOM fields so the UI reflects it. The search value\nlives on the slotted <zn-data-table-search>, the filter on <zn-data-table-filter>, and extra\nfield params on the search/inputs fields (all light-DOM descendants)."
+              "description": "Push the shared state back into the actual DOM fields so the UI reflects it. The search value\nlives on the slotted <zn-data-table-search> and extra field params on the search/inputs fields\n(all light-DOM descendants)."
             },
             {
               "kind": "method",
@@ -53936,7 +53936,7 @@
   "package": {
     "name": "@kubex/zinc",
     "description": "A collection of web components for building web applications based off of @shoelace-style/Shoelace",
-    "version": "1.1.173",
+    "version": "1.1.175",
     "author": "",
     "license": "MIT"
   }

package/dist/vscode.html-custom-data.json

@@ -13,6 +13,17 @@
         }
       ]
     },
+    {
+      "name": "zn-action-bar",
+      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+      "attributes": [],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/action-bar"
+        }
+      ]
+    },
     {
       "name": "zn-alert",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -53,17 +64,6 @@
         }
       ]
     },
-    {
-      "name": "zn-action-bar",
-      "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-      "attributes": [],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://zinc.style/components/action-bar"
-        }
-      ]
-    },
     {
       "name": "zn-animated-button",
       "description": "\n---\n\n\n### **Methods:**\n - **purchase(): _void_** - Programmatically trigger the purchase flow\n- **setSuccess(): _void_** - Set the button to success state manually\n- **setFailure(message): _void_** - Set the button to failure state manually with optional error message\n- **reset(): _void_** - Reset the button to idle state",

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@kubex/zinc",
-  "version": "1.1.173",
+  "version": "1.1.175",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -15,6 +15,28 @@
           "events": [],
           "js": { "properties": [], "events": [] }
         },
+        {
+          "name": "zn-action-bar",
+          "description": "Short summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
+          "doc-url": "",
+          "attributes": [],
+          "slots": [
+            { "name": "", "description": "The default slot." },
+            { "name": "example", "description": "An example slot." }
+          ],
+          "events": [
+            { "name": "zn-event-name", "description": "Emitted as an example." }
+          ],
+          "js": {
+            "properties": [],
+            "events": [
+              {
+                "name": "zn-event-name",
+                "description": "Emitted as an example."
+              }
+            ]
+          }
+        },
         {
           "name": "zn-alert",
           "description": "Short summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -83,28 +105,6 @@
             ]
           }
         },
-        {
-          "name": "zn-action-bar",
-          "description": "Short summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-event-name** - Emitted as an example.\n\n### **Slots:**\n - _default_ - The default slot.\n- **example** - An example slot.\n\n### **CSS Properties:**\n - **--example** - An example CSS custom property. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
-          "doc-url": "",
-          "attributes": [],
-          "slots": [
-            { "name": "", "description": "The default slot." },
-            { "name": "example", "description": "An example slot." }
-          ],
-          "events": [
-            { "name": "zn-event-name", "description": "Emitted as an example." }
-          ],
-          "js": {
-            "properties": [],
-            "events": [
-              {
-                "name": "zn-event-name",
-                "description": "Emitted as an example."
-              }
-            ]
-          }
-        },
         {
           "name": "zn-animated-button",
           "description": "\n\n---\n\n\n### **Methods:**\n - **purchase(): _void_** - Programmatically trigger the purchase flow\n- **setSuccess(): _void_** - Set the button to success state manually\n- **setFailure(message): _void_** - Set the button to failure state manually with optional error message\n- **reset(): _void_** - Reset the button to idle state",

package/dist/zn.d.ts

@@ -4262,8 +4262,8 @@ declare module "components/data-table/data-table.component" {
         private _readSharableState;
         /**
          * Push the shared state back into the actual DOM fields so the UI reflects it. The search value
-         * lives on the slotted <zn-data-table-search>, the filter on <zn-data-table-filter>, and extra
-         * field params on the search/inputs fields (all light-DOM descendants).
+         * lives on the slotted <zn-data-table-search> and extra field params on the search/inputs fields
+         * (all light-DOM descendants).
          */
         private _populateSharableFields;
         private _hasFieldNamed;

package/dist/zn.min.js

@@ -1201,7 +1201,7 @@ import{a as Hn,b as e5,c as kr,d as c,e as V}from"./chunks/zn.UBLZO6CI.js";var s
       <div class="table__collum--datetime" title="${O(o.title)}">
         <span><strong>${i.slice(0,10)}</strong></span>
         <zn-style size="s" muted>${i.slice(11)}</zn-style>
-      </div>`})},be=class be extends S{constructor(){super(...arguments);this.data=[];this.sortDirection="asc";this.localSort=!1;this.filter="";this.search="";this.key="id";this.headers={};this.displayTemplates={};this.hiddenHeaders="{}";this.hiddenColumns="{}";this.unsortableHeaders="{}";this.unsortable=!1;this.hideColumnSelect=!1;this.hideRefresh=!1;this.standalone=!1;this.emptyStateIcon="data_alert";this.filters=[];this.method="POST";this.noInitialLoad=!1;this.sharable=!1;this.wrapSearchFields=!1;this.groupBy="";this.groups="";this.itemsPerPage=fm;this._initialLoad=!0;this._hasLoadedData=!1;this._lastLoadHadRows=!1;this._lastTableContent=u``;this._sharableInitialised=!1;this._sharableDefaults=null;this._urlManagedKeys=new Set(["search","filter","sortColumn","sortDirection","page","perPage"]);this.resizeObserver=new ut(this,{target:null,callback:()=>{this.tableContainer&&this.tableContainer.scrollIntoView({behavior:"smooth",block:"nearest"})}});this.page=e1;this._totalRows=0;this._rows=[];this._suggestionsKey="";this.numberOfRowsSelected=0;this.selectedRows=[];this.hasSlotController=new Y(this,"[default]","search".valueOf(),"delete-action".valueOf(),"modify-action".valueOf(),"actions".valueOf(),"create-action".valueOf(),"filter".valueOf(),"sort".valueOf(),"inputs".valueOf(),"empty-state","no-results");this._dataTask=new Kl(this,{task:async([t,r],{signal:n})=>{if(this._updateSharableUrl(),t===void 0||this.noInitialLoad&&this._initialLoad)return{rows:[],page:1,perPage:this.itemsPerPage,total:0};this.groupBy&&(this.itemsPerPage=1e3);let a={page:this.page,perPage:this.itemsPerPage,sortColumn:this.sortColumn,sortDirection:this.sortDirection,filter:this.filter,search:this.search},s=this.hasSlotController.getSlots("inputs".valueOf()),l={};s&&(s.forEach(m=>{if(["zn-input","zn-select","zn-query-builder","zn-multiselect","zn-params-select","zn-datepicker","input","select","textarea"].includes(m.tagName.toLowerCase())){let b=m.value||m.getAttribute("value"),g=m.name||m.getAttribute("name");g&&(l[g]=b)}}),Object.assign(a,l));let d=r&&typeof r=="object"?r:{};if(this.wrapSearchFields){let m={};for(let[f,b]of Object.entries(d))b!=null&&b!==""&&(m[f]=b);(this.search||Object.keys(m).length>0)&&(m.q=this.search),a.searchFields=Object.keys(m).length>0?m:null}else Object.assign(a,d);let h=await fetch(t,{method:this.method,headers:{"x-kx-fetch-style":"zn-data-table"},signal:n,credentials:"same-origin",body:this.method==="POST"?JSON.stringify(a):void 0});if(!h.ok)throw new Error(h.statusText);return h.json()},args:()=>[this.dataUri,this.requestParams]});this.rowHasActions=!1;this._expandedRows=new Set;this._hiddenCells=new Map;this._deselectedColumns=new Set;this._filtersOpen=!1;this._columnDefaultsApplied=!1;this._formatTemplates=m8;this.requestParams={};this.filterClearListener=t=>{t.target instanceof Zd&&(this._filtersOpen=!1)};this.filterChangeListener=t=>{t.target instanceof Zd&&(this.filter=t.target.value,this._dataTask.run().then(r=>r))};this.searchChangeListener=t=>{let r=t.target;if(r&&r.tagName==="ZN-DATA-TABLE-SEARCH"){if(this.search=r.value,t.detail){let{formData:n,searchUri:a}=t.detail;if(n&&typeof n=="object"&&(this.requestParams={...this.requestParams,...n}),a){let s=this.dataUri;this.dataUri=a,this._dataTask.run().then(()=>{this.dataUri=s});return}}this._dataTask.run().then(n=>n)}};this.toggleFilters=()=>{this._filtersOpen=!this._filtersOpen};this.handleColumnSelect=t=>{let r=Object.values(this.headers).find(n=>n.key===t.detail.value);r&&this.toggleColumn(r)}}refresh(){this._initialLoad=!1,this._dataTask.run().then(t=>t)}visibleHeaders(){return this.selectableHeaders().filter(t=>this.isColumnVisible(t))}selectableHeaders(){return Object.values(this.headers).filter(t=>t.hideHeader||t.hideColumn||t.secondary?!1:!Object.values(this.hiddenColumns).includes(t.key))}isColumnVisible(t){return t.required===!0||!this._deselectedColumns.has(t.key)}applyColumnDefaults(){if(this._columnDefaultsApplied)return;let t=Object.values(this.headers);if(t.length===0)return;this._columnDefaultsApplied=!0;let r=new Set(this._deselectedColumns);t.forEach(n=>{n.default===!1&&n.required!==!0&&r.add(n.key)}),this._deselectedColumns=r}toggleColumn(t){if(t.required===!0)return;let r=new Set(this._deselectedColumns);if(!r.delete(t.key)){if(this.visibleHeaders().length<=1)return;r.add(t.key)}this._deselectedColumns=r}_captureSharableDefaults(){this._sharableDefaults||(this._sharableDefaults={search:this.search||"",filter:this.filter||"",sortColumn:this.sortColumn||"",sortDirection:this.sortDirection||"",page:String(this.page),perPage:String(this.itemsPerPage)})}_readSharableState(){if(!this.sharable||this._sharableInitialised||typeof window>"u")return;this._sharableInitialised=!0;let t=new URLSearchParams(window.location.search),r=!1;if(t.has("search")&&(this.search=t.get("search"),r=!0),t.has("filter")&&(this.filter=t.get("filter"),r=!0),t.has("sortColumn")&&(this.sortColumn=t.get("sortColumn"),r=!0),t.has("sortDirection")&&(this.sortDirection=t.get("sortDirection"),r=!0),t.has("page")){let s=parseInt(t.get("page"),10);!isNaN(s)&&s>0&&(this.page=s),r=!0}if(t.has("perPage")){let s=parseInt(t.get("perPage"),10);!isNaN(s)&&s>0&&(this.itemsPerPage=s),r=!0}let n=new Set(be._sharableKnownKeys),a={};t.forEach((s,l)=>{n.has(l)||!this._hasFieldNamed(l)||(r=!0,this._urlManagedKeys.add(l),a[l]=s)}),Object.keys(a).length>0&&(this.requestParams={...this.requestParams,...a}),r&&this.noInitialLoad&&(this._initialLoad=!1)}_populateSharableFields(){if(this.search){let r=this.querySelector("zn-data-table-search");r&&(r.value=this.search)}if(this.filter){let r=this.querySelector("zn-data-table-filter");r&&(r.value=this.filter)}let t=new Set(be._sharableKnownKeys);Object.entries(this.requestParams).forEach(([r,n])=>{t.has(r)||r==="searchUri"||n===void 0||n===null||this._setSharableFieldValue(r,String(n))})}_hasFieldNamed(t){try{let r=`[name="${window.CSS&&CSS.escape?CSS.escape(t):t}"]`;return this.querySelector(r)!==null}catch{return!1}}_setSharableFieldValue(t,r){let n;try{n=`[name="${window.CSS&&CSS.escape?CSS.escape(t):t}"]`}catch{n=`[name="${t}"]`}this.querySelectorAll(n).forEach(a=>{a.value=r,a.tagName.includes("-")&&a.setAttribute("value",r)})}_updateSharableUrl(){if(!this.sharable||!window?.history)return;let t=this._sharableDefaults??{},r=new URLSearchParams(window.location.search);this._urlManagedKeys.forEach(d=>r.delete(d));let n=(d,h)=>{this._urlManagedKeys.add(d);let m=h==null?"":String(h);m===""||m===(t[d]||"")||r.set(d,m)},a=new Set(be._sharableKnownKeys);Object.entries(this.requestParams).forEach(([d,h])=>{a.has(d)||d==="searchUri"||n(d,h)}),n("search",this.search),n("filter",this.filter),n("sortColumn",this.sortColumn),n("sortDirection",this.sortDirection),n("page",this.page),n("perPage",this.itemsPerPage);let s=r.toString(),l=`${window.location.pathname}${s?`?${s}`:""}${window.location.hash}`;window.history.replaceState(window.history.state,"",l)}render(){this.applyColumnDefaults();let t=u``,r=!1;if(this.noInitialLoad&&this._initialLoad)t=u`
+      </div>`})},be=class be extends S{constructor(){super(...arguments);this.data=[];this.sortDirection="asc";this.localSort=!1;this.filter="";this.search="";this.key="id";this.headers={};this.displayTemplates={};this.hiddenHeaders="{}";this.hiddenColumns="{}";this.unsortableHeaders="{}";this.unsortable=!1;this.hideColumnSelect=!1;this.hideRefresh=!1;this.standalone=!1;this.emptyStateIcon="data_alert";this.filters=[];this.method="POST";this.noInitialLoad=!1;this.sharable=!1;this.wrapSearchFields=!1;this.groupBy="";this.groups="";this.itemsPerPage=fm;this._initialLoad=!0;this._hasLoadedData=!1;this._lastLoadHadRows=!1;this._lastTableContent=u``;this._sharableInitialised=!1;this._sharableDefaults=null;this._urlManagedKeys=new Set(["search","filter","sortColumn","sortDirection","page","perPage"]);this.resizeObserver=new ut(this,{target:null,callback:()=>{this.tableContainer&&this.tableContainer.scrollIntoView({behavior:"smooth",block:"nearest"})}});this.page=e1;this._totalRows=0;this._rows=[];this._suggestionsKey="";this.numberOfRowsSelected=0;this.selectedRows=[];this.hasSlotController=new Y(this,"[default]","search".valueOf(),"delete-action".valueOf(),"modify-action".valueOf(),"actions".valueOf(),"create-action".valueOf(),"filter".valueOf(),"sort".valueOf(),"inputs".valueOf(),"empty-state","no-results");this._dataTask=new Kl(this,{task:async([t,r],{signal:n})=>{if(this._updateSharableUrl(),t===void 0||this.noInitialLoad&&this._initialLoad)return{rows:[],page:1,perPage:this.itemsPerPage,total:0};this.groupBy&&(this.itemsPerPage=1e3);let a={page:this.page,perPage:this.itemsPerPage,sortColumn:this.sortColumn,sortDirection:this.sortDirection,filter:this.filter,search:this.search},s=this.hasSlotController.getSlots("inputs".valueOf()),l={};s&&(s.forEach(m=>{if(["zn-input","zn-select","zn-query-builder","zn-multiselect","zn-params-select","zn-datepicker","input","select","textarea"].includes(m.tagName.toLowerCase())){let b=m.value||m.getAttribute("value"),g=m.name||m.getAttribute("name");g&&(l[g]=b)}}),Object.assign(a,l));let d=r&&typeof r=="object"?r:{};if(this.wrapSearchFields){let m={};for(let[f,b]of Object.entries(d))b!=null&&b!==""&&(m[f]=b);(this.search||Object.keys(m).length>0)&&(m.q=this.search),a.searchFields=Object.keys(m).length>0?m:null}else Object.assign(a,d);let h=await fetch(t,{method:this.method,headers:{"x-kx-fetch-style":"zn-data-table"},signal:n,credentials:"same-origin",body:this.method==="POST"?JSON.stringify(a):void 0});if(!h.ok)throw new Error(h.statusText);return h.json()},args:()=>[this.dataUri,this.requestParams]});this.rowHasActions=!1;this._expandedRows=new Set;this._hiddenCells=new Map;this._deselectedColumns=new Set;this._filtersOpen=!1;this._columnDefaultsApplied=!1;this._formatTemplates=m8;this.requestParams={};this.filterClearListener=t=>{t.target instanceof Zd&&(this._filtersOpen=!1)};this.filterChangeListener=t=>{t.target instanceof Zd&&(this.filter=t.target.value,this._dataTask.run().then(r=>r))};this.searchChangeListener=t=>{let r=t.target;if(r&&r.tagName==="ZN-DATA-TABLE-SEARCH"){if(this.search=r.value,t.detail){let{formData:n,searchUri:a}=t.detail;if(n&&typeof n=="object"&&(this.requestParams={...this.requestParams,...n}),a){let s=this.dataUri;this.dataUri=a,this._dataTask.run().then(()=>{this.dataUri=s});return}}this._dataTask.run().then(n=>n)}};this.toggleFilters=()=>{this._filtersOpen=!this._filtersOpen};this.handleColumnSelect=t=>{let r=Object.values(this.headers).find(n=>n.key===t.detail.value);r&&this.toggleColumn(r)}}refresh(){this._initialLoad=!1,this._dataTask.run().then(t=>t)}visibleHeaders(){return this.selectableHeaders().filter(t=>this.isColumnVisible(t))}selectableHeaders(){return Object.values(this.headers).filter(t=>t.hideHeader||t.hideColumn||t.secondary?!1:!Object.values(this.hiddenColumns).includes(t.key))}isColumnVisible(t){return t.required===!0||!this._deselectedColumns.has(t.key)}applyColumnDefaults(){if(this._columnDefaultsApplied)return;let t=Object.values(this.headers);if(t.length===0)return;this._columnDefaultsApplied=!0;let r=new Set(this._deselectedColumns);t.forEach(n=>{n.default===!1&&n.required!==!0&&r.add(n.key)}),this._deselectedColumns=r}toggleColumn(t){if(t.required===!0)return;let r=new Set(this._deselectedColumns);if(!r.delete(t.key)){if(this.visibleHeaders().length<=1)return;r.add(t.key)}this._deselectedColumns=r}_captureSharableDefaults(){this._sharableDefaults||(this._sharableDefaults={search:this.search||"",filter:this.filter||"",sortColumn:this.sortColumn||"",sortDirection:this.sortDirection||"",page:String(this.page),perPage:String(this.itemsPerPage)})}_readSharableState(){if(!this.sharable||this._sharableInitialised||typeof window>"u")return;this._sharableInitialised=!0;let t=new URLSearchParams(window.location.search),r=!1;if(t.has("search")&&(this.search=t.get("search"),r=!0),t.has("filter")&&(this.filter=t.get("filter"),r=!0),t.has("sortColumn")&&(this.sortColumn=t.get("sortColumn"),r=!0),t.has("sortDirection")&&(this.sortDirection=t.get("sortDirection"),r=!0),t.has("page")){let s=parseInt(t.get("page"),10);!isNaN(s)&&s>0&&(this.page=s),r=!0}if(t.has("perPage")){let s=parseInt(t.get("perPage"),10);!isNaN(s)&&s>0&&(this.itemsPerPage=s),r=!0}let n=new Set(be._sharableKnownKeys),a={};t.forEach((s,l)=>{n.has(l)||!this._hasFieldNamed(l)||(r=!0,this._urlManagedKeys.add(l),a[l]=s)}),Object.keys(a).length>0&&(this.requestParams={...this.requestParams,...a}),r&&this.noInitialLoad&&(this._initialLoad=!1)}_populateSharableFields(){if(this.search){let r=this.querySelector("zn-data-table-search");r&&(r.value=this.search)}let t=new Set(be._sharableKnownKeys);Object.entries(this.requestParams).forEach(([r,n])=>{t.has(r)||r==="searchUri"||n===void 0||n===null||this._setSharableFieldValue(r,String(n))})}_hasFieldNamed(t){try{let r=`[name="${window.CSS&&CSS.escape?CSS.escape(t):t}"]`;return this.querySelector(r)!==null}catch{return!1}}_setSharableFieldValue(t,r){let n;try{n=`[name="${window.CSS&&CSS.escape?CSS.escape(t):t}"]`}catch{n=`[name="${t}"]`}this.querySelectorAll(n).forEach(a=>{a.value=r,a.tagName.includes("-")&&a.setAttribute("value",r)})}_updateSharableUrl(){if(!this.sharable||!window?.history)return;let t=this._sharableDefaults??{},r=new URLSearchParams(window.location.search);this._urlManagedKeys.forEach(d=>r.delete(d));let n=(d,h)=>{this._urlManagedKeys.add(d);let m=h==null?"":String(h);m===""||m===(t[d]||"")||r.set(d,m)},a=new Set(be._sharableKnownKeys);Object.entries(this.requestParams).forEach(([d,h])=>{a.has(d)||d==="searchUri"||n(d,h)}),n("search",this.search),n("filter",this.filter),n("sortColumn",this.sortColumn),n("sortDirection",this.sortDirection),n("page",this.page),n("perPage",this.itemsPerPage);let s=r.toString(),l=`${window.location.pathname}${s?`?${s}`:""}${window.location.hash}`;window.history.replaceState(window.history.state,"",l)}render(){this.applyColumnDefaults();let t=u``,r=!1;if(this.noInitialLoad&&this._initialLoad)t=u`
         <slot name="empty-state"></slot>`,r=!0;else if(this.dataUri)t=this._dataTask.render({pending:()=>this._initialLoad||!this._hasLoadedData||!this._lastLoadHadRows?u`
               <div>${this.loadingTable()}</div>`:this.tableContent(this._lastTableContent,!0),complete:h=>(this._initialLoad=!1,this._hasLoadedData=!0,this._lastLoadHadRows=(h?.rows?.length??0)>0,r=!this._lastLoadHadRows,this._lastTableContent=u`
             <div>${this.renderTable(h)}</div>`,this.tableContent(this._lastTableContent,!1)),error:h=>{if(h instanceof Error){if(h.name==="SyntaxError")return console.debug(h.message),u`
@@ -1233,7 +1233,7 @@ import{a as Hn,b as e5,c as kr,d as c,e as V}from"./chunks/zn.UBLZO6CI.js";var s
             ${t}
             ${this.getTableFooter()}`}
       </div>
-    `}connectedCallback(){super.connectedCallback(),this.addEventListener("zn-filter-change",this.filterChangeListener),this.addEventListener("zn-clear",this.filterClearListener),this.addEventListener("zn-search-change",this.searchChangeListener),this._captureSharableDefaults(),this._readSharableState()}firstUpdated(){this.sharable&&this._populateSharableFields()}updated(t){super.updated(t),this.publishFilterSuggestions()}publishFilterSuggestions(){let t=this.querySelector("zn-data-table-filter");if(!t||this._rows.length===0)return;let r={};this._rows.forEach(a=>a.cells.forEach(s=>{let l=s.text?.trim();if(!l)return;let d=r[s.column]??(r[s.column]=[]);d.length<u8&&!d.includes(l)&&d.push(l)}));let n=JSON.stringify(r);n!==this._suggestionsKey&&(this._suggestionsKey=n,t.suggestions=r)}getTemplate(t){return this.displayTemplates[t]??this._formatTemplates[t]}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("zn-filter-change",this.filterChangeListener),this.removeEventListener("zn-clear",this.filterClearListener),this.removeEventListener("zn-search-change",this.searchChangeListener)}get isNarrowed(){return this.search.length>0||this.filter.length>0}emptyState(){return this.isNarrowed||this.noInitialLoad&&!this._initialLoad?u`
+    `}connectedCallback(){super.connectedCallback(),this.addEventListener("zn-filter-change",this.filterChangeListener),this.addEventListener("zn-clear",this.filterClearListener),this.addEventListener("zn-search-change",this.searchChangeListener),this._captureSharableDefaults(),this._readSharableState()}firstUpdated(){if(this.filter){let t=this.querySelector("zn-data-table-filter");t&&(t.value=this.filter)}this.sharable&&this._populateSharableFields()}updated(t){super.updated(t),this.publishFilterSuggestions()}publishFilterSuggestions(){let t=this.querySelector("zn-data-table-filter");if(!t||this._rows.length===0)return;let r={};this._rows.forEach(a=>a.cells.forEach(s=>{let l=s.text?.trim();if(!l)return;let d=r[s.column]??(r[s.column]=[]);d.length<u8&&!d.includes(l)&&d.push(l)}));let n=JSON.stringify(r);n!==this._suggestionsKey&&(this._suggestionsKey=n,t.suggestions=r)}getTemplate(t){return this.displayTemplates[t]??this._formatTemplates[t]}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("zn-filter-change",this.filterChangeListener),this.removeEventListener("zn-clear",this.filterClearListener),this.removeEventListener("zn-search-change",this.searchChangeListener)}get isNarrowed(){return this.search.length>0||this.filter.length>0}emptyState(){return this.isNarrowed||this.noInitialLoad&&!this._initialLoad?u`
         <div class="table--empty">
           <slot name="no-results">
             <zn-empty-state caption="No Results Found" icon="search">
@@ -1836,7 +1836,7 @@ import{a as Hn,b as e5,c as kr,d as c,e as V}from"./chunks/zn.UBLZO6CI.js";var s
                    gaid=${this.acceptGaid}
                    no-hover>
         </zn-button>
-      </slot>`}};it.styles=_(l1),c([p({type:Boolean,reflect:!0})],it.prototype,"available",2),c([p({type:Boolean,reflect:!0})],it.prototype,"incoming",2),c([p({reflect:!0})],it.prototype,"variant",2),c([p()],it.prototype,"header",2),c([p()],it.prototype,"icon",2),c([p({reflect:!0})],it.prototype,"color",2),c([p()],it.prototype,"title",2),c([p()],it.prototype,"subtitle",2),c([p({type:Number})],it.prototype,"progress",2),c([p({attribute:"progress-color"})],it.prototype,"progressColor",2),c([p({attribute:"item-id"})],it.prototype,"itemId",2),c([p({attribute:"accept-uri"})],it.prototype,"acceptUri",2),c([p({type:Number,attribute:"reserved-until"})],it.prototype,"reservedUntil",2),c([p({type:Number,attribute:"auto-accept-delay"})],it.prototype,"autoAcceptDelay",2),c([p({type:Boolean,reflect:!0})],it.prototype,"rejectable",2),c([p({attribute:"accept-icon"})],it.prototype,"acceptIcon",2),c([p({attribute:"accept-gaid"})],it.prototype,"acceptGaid",2),c([p({attribute:"reject-icon"})],it.prototype,"rejectIcon",2),c([p({attribute:"reject-label"})],it.prototype,"rejectLabel",2);var _8=it;it.define("zn-channel-tile");function Co(o,i){let t=o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)",r=o.textColor??t,n=o.enableAnimations!==!1&&o.enableAnimations!==0,a=typeof o.enableAnimations=="number"?o.enableAnimations:1500;return{animation:n,animationDuration:a,animationEasing:"cubicOut",...o.colors?{color:o.colors}:{},textStyle:{color:r},tooltip:{trigger:i,appendTo:"body",valueFormatter:o.yAxisAppend?s=>`${s}${o.yAxisAppend}`:void 0},legend:{top:0,right:0,icon:"circle",textStyle:{color:r}}}}function ep(o){return{...Co(o,"axis"),grid:{left:40,right:20,top:40,bottom:30}}}function k8(o){return o.length===0||o.every(i=>!i.data||i.data.length===0)}function tp(o){let i=k8(o.data)?{min:0,max:6}:{},t=o.scale?{scale:!0,...typeof o.scale=="number"?{boundaryGap:[`${o.scale}%`,`${o.scale}%`]}:{}}:{};return{type:"value",...o.borderColor?{splitLine:{lineStyle:{color:o.borderColor}}}:{},...i,...t,axisLabel:o.yAxisAppend?{formatter:n=>`${n}${o.yAxisAppend}`}:{}}}function rp(o,i=!1){let t=o.borderColor?{axisLine:{lineStyle:{color:o.borderColor}}}:{};return o.xAxisType==="datetime"?{type:"time",...t}:o.xAxisType==="numeric"?{type:"value",...t}:{type:"category",data:o.categories,...i?{boundaryGap:!1}:{},...t}}function d1(o){return o.map(i=>i&&typeof i=="object"&&!Array.isArray(i)&&"x"in i&&"y"in i?[i.x,i.y]:i)}function ip(o,i,t=()=>({})){return o.data.map(r=>({type:i,name:r.name,data:d1(r.data),...r.color?{itemStyle:{color:r.color}}:{},...o.stacked?{stack:"total"}:{},...o.enableAnimations!==!1&&o.enableAnimations!==0&&i==="bar"?{animationDelay:n=>n*50}:{},...t(r)}))}function gm(o){return{...ep(o),xAxis:rp(o),yAxis:tp(o),series:ip(o,"bar")}}function p1(o){return{...ep(o),xAxis:rp(o,!0),yAxis:tp(o),series:ip(o,"line",()=>({symbolSize:o.datapointSize,smooth:o.smooth}))}}function h1(o){return{...ep(o),xAxis:rp(o,!0),yAxis:tp(o),series:ip(o,"line",()=>({symbolSize:o.datapointSize,smooth:o.smooth,areaStyle:{opacity:.1}}))}}function u1(o){return{...ep(o),xAxis:rp({...o,xAxisType:o.xAxisType??"numeric"}),yAxis:tp(o),series:ip(o,"scatter",()=>({symbolSize:o.datapointSize}))}}function bm(o,i){return o.map((t,r)=>{if(typeof t=="number")return{name:i[r]??`${r+1}`,value:t};let{color:n,itemStyle:a,...s}=t;return{...s,name:t.name??i[r]??`${r+1}`,...n?{itemStyle:{...a,color:n}}:a?{itemStyle:a}:{}}})}function m1(o){let i=o.data[0]??{name:"",data:[]},t=o.textColor??(o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)"),r=o.type==="donut"?o.innerRadius??"50%":0,n=o.outerRadius??"70%";return{...Co(o,"item"),series:[{type:"pie",name:i.name,data:bm(i.data??[],o.categories),radius:[r,n],center:["50%","55%"],avoidLabelOverlap:!0,label:{show:o.showLabels??!1,color:t},labelLine:{show:o.showLabels??!1,...o.borderColor?{lineStyle:{color:o.borderColor}}:{}},emphasis:{label:{show:o.showLabels??!1}}}]}}function f1(o){let i=o.indicators?.length?o.indicators:o.categories.map(t=>({name:t}));return{...Co(o,"item"),radar:{indicator:i},series:[{type:"radar",data:o.data.map(t=>({name:t.name,value:d1(t.data),...t.color?{itemStyle:{color:t.color},lineStyle:{color:t.color}}:{}}))}]}}function g1(o){let i=o.data[0]??{name:"",data:[]},[t]=i.data,r=typeof t=="number"?[{name:i.name,value:t}]:bm(i.data??[],o.categories);return{...Co(o,"item"),series:[{type:"gauge",name:i.name,min:o.minValue??0,max:o.maxValue??100,data:r,progress:{show:!0},detail:{valueAnimation:o.enableAnimations!==!1&&o.enableAnimations!==0,formatter:o.yAxisAppend?n=>`${n}${o.yAxisAppend}`:"{value}"}}]}}function b1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"funnel",name:i.name,min:o.minValue,max:o.maxValue,data:bm(i.data??[],o.categories),label:{show:o.showLabels??!0},emphasis:{label:{fontWeight:"bold"}}}]}}function S8(o){return Array.isArray(o)?typeof o[2]=="number":!1}function c1(o,i,t){let r=o.filter(S8).map(n=>n[2]);return r.length?Math[i](...r):t}function v1(o){let i=o.data[0]??{name:"",data:[]},t=i.data??[];return{...Co(o,"item"),grid:{left:60,right:20,top:40,bottom:70},xAxis:{type:"category",data:o.categories,splitArea:{show:!0}},yAxis:{type:"category",data:o.yCategories??[],splitArea:{show:!0}},visualMap:{min:o.minValue??c1(t,"min",0),max:o.maxValue??c1(t,"max",100),calculable:!0,orient:"horizontal",left:"center",bottom:0},series:[{type:"heatmap",name:i.name,data:t,label:{show:o.showLabels??!1},emphasis:{itemStyle:{shadowBlur:10,shadowColor:"rgba(0, 0, 0, 0.35)"}}}]}}function y1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"treemap",name:i.name,data:i.data??[],label:{show:o.showLabels??!0},upperLabel:{show:o.showLabels??!0}}]}}function x1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"sunburst",name:i.name,data:i.data??[],radius:[o.innerRadius??0,o.outerRadius??"90%"],label:{show:o.showLabels??!0},emphasis:{focus:"ancestor"}}]}}function C8(o){let i=new Set,t=[];for(let r of o)i.has(r.source)||(i.add(r.source),t.push({name:r.source})),i.has(r.target)||(i.add(r.target),t.push({name:r.target}));return t}function w1(o){let i=o.data[0]??{name:"",data:[]},t=i.data??[],n=i.nodes??C8(t),a=o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)",s=o.textColor??a,l=o.enableAnimations!==!1&&o.enableAnimations!==0,d=typeof o.enableAnimations=="number"?o.enableAnimations:1500;return{animation:l,animationDuration:d,animationEasing:"cubicOut",...o.colors?{color:o.colors}:{},textStyle:{color:s},tooltip:{trigger:"item",appendTo:"body"},series:[{type:"sankey",name:i.name,data:n,links:t,label:{color:s,textBorderWidth:0},lineStyle:{color:"source",opacity:o.theme==="dark"?.4:.3},emphasis:{focus:"adjacency"}}]}}var z1;function np(){return z1??(z1=(async()=>{let[o,i,t,r]=await Promise.all([import("./chunks/zn.AI3T35DX.js"),import("./chunks/zn.EHO4QQOL.js"),import("./chunks/zn.6RARZYEJ.js"),import("./chunks/zn.S4ZVBYAS.js")]);return o.use([i.BarChart,i.FunnelChart,i.GaugeChart,i.HeatmapChart,i.LineChart,i.PieChart,i.RadarChart,i.SankeyChart,i.ScatterChart,i.SunburstChart,i.TreemapChart,t.GridComponent,t.TooltipComponent,t.LegendComponent,t.TitleComponent,t.DataZoomComponent,t.RadarComponent,t.VisualMapComponent,r.CanvasRenderer]),o})()),z1}var _1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host{display:inline-block;width:100%}.chart{position:relative}`;var Fe=class extends S{constructor(){super(...arguments);this.type="bar";this.data=[];this.categories=[];this.yCategories=[];this.indicators=[];this.datapointSize=1;this.stacked=!1;this.live=!1;this.dataUrl="";this.liveInterval=1e3;this.height=300;this.enableAnimations=!1;this.smooth=!1;this.scale=!1;this.resizeObserver=new ut(this,{target:null,skipInitial:!0,callback:()=>this.chart?.resize()})}firstUpdated(t){this.initPromise=this.initChart().catch(()=>{}),super.firstUpdated(t)}async getUpdateComplete(){let t=await super.getUpdateComplete();return await this.initPromise,t}getTheme(){return this.getAttribute("m")==="dark"?"dark":this.getAttribute("m")==="light"?"light":this.getAttribute("t")==="dark"?"dark":"light"}getTextColor(){let t=getComputedStyle(this),r=t.getPropertyValue("--zn-text").trim();if(!r)return;let n=t.getPropertyValue("--zn-text-opacity").trim()||"1";return`rgba(${r}, ${n})`}getBorderColor(){let t=getComputedStyle(this).getPropertyValue("--zn-border-color").trim();return t?`rgb(${t})`:void 0}buildOption(){let t={type:this.type,data:this.data??[],categories:Array.isArray(this.categories)?this.categories:[],xAxisType:this.xAxis,yAxisAppend:this.yAxisAppend,stacked:this.stacked,enableAnimations:this.enableAnimations,datapointSize:this.datapointSize,colors:this.colors,theme:this.getTheme(),smooth:this.smooth,scale:this.scale,textColor:this.getTextColor(),borderColor:this.getBorderColor(),innerRadius:this.innerRadius,outerRadius:this.outerRadius,showLabels:this.showLabels,yCategories:Array.isArray(this.yCategories)?this.yCategories:[],indicators:Array.isArray(this.indicators)?this.indicators:[],minValue:this.minValue,maxValue:this.maxValue};switch(this.type){case"bar":return gm(t);case"line":return p1(t);case"area":return h1(t);case"funnel":return b1(t);case"gauge":return g1(t);case"heatmap":return v1(t);case"donut":case"pie":return m1(t);case"radar":return f1(t);case"sankey":return w1(t);case"scatter":return u1(t);case"sunburst":return x1(t);case"treemap":return y1(t);default:return gm(t)}}async initChart(){let t=this.shadowRoot?.getElementById("chart");if(!t)return;t.style.height=`${this.height}px`;let r=await np();!this.isConnected||this.chart||(this.echarts=r,this.chart=r.init(t),this.chart.setOption(this.buildOption()),this.syncGroup&&(this.chart.group=this.syncGroup,r.connect(this.syncGroup)),this.resizeObserver.observe(t),this.live&&this.dataUrl&&this.startLive())}startLive(){this.liveTimer=window.setInterval(async()=>{try{let r=await(await fetch(this.dataUrl)).json();this.data=r,this.chart?.setOption({...this.buildOption()})}catch{}},this.liveInterval)}reinit(){this.chart?.dispose(),this.chart=void 0,this.initPromise=this.initChart().catch(()=>{})}attributeChangedCallback(t,r,n){if(super.attributeChangedCallback(t,r,n),!!this.chart){if(t==="t"){this.reinit();return}if(t==="type"){this.reinit();return}if(t==="height"){let a=this.shadowRoot?.getElementById("chart");a&&(a.style.height=`${this.height}px`),this.chart.resize();return}if(t==="sync-group"){n?(this.chart.group=n,this.echarts?.connect(n)):this.chart.group="";return}this.chart.setOption({...this.buildOption()})}}disconnectedCallback(){super.disconnectedCallback(),this.liveTimer&&clearInterval(this.liveTimer),this.chart?.dispose(),this.chart=void 0}render(){return u`<div class="chart"><div id="chart"></div></div>`}};Fe.styles=_(_1),c([p()],Fe.prototype,"type",2),c([p({type:Array})],Fe.prototype,"data",2),c([p({type:Array})],Fe.prototype,"categories",2),c([p({attribute:"y-categories",type:Array})],Fe.prototype,"yCategories",2),c([p({type:Array})],Fe.prototype,"indicators",2),c([p({attribute:"xaxis"})],Fe.prototype,"xAxis",2),c([p({type:Number,attribute:"d-size"})],Fe.prototype,"datapointSize",2),c([p({type:Boolean})],Fe.prototype,"stacked",2),c([p({type:Boolean})],Fe.prototype,"live",2),c([p({attribute:"data-url"})],Fe.prototype,"dataUrl",2),c([p({attribute:"live-interval",type:Number})],Fe.prototype,"liveInterval",2),c([p({type:Number,reflect:!0})],Fe.prototype,"height",2),c([p({attribute:"enable-animations",converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Fe.prototype,"enableAnimations",2),c([p({attribute:"y-axis-append"})],Fe.prototype,"yAxisAppend",2),c([p({type:Array})],Fe.prototype,"colors",2),c([p({attribute:"sync-group"})],Fe.prototype,"syncGroup",2),c([p({type:Boolean})],Fe.prototype,"smooth",2),c([p({attribute:"inner-radius"})],Fe.prototype,"innerRadius",2),c([p({attribute:"outer-radius"})],Fe.prototype,"outerRadius",2),c([p({attribute:"show-labels",type:Boolean})],Fe.prototype,"showLabels",2),c([p({attribute:"min-value",type:Number})],Fe.prototype,"minValue",2),c([p({attribute:"max-value",type:Number})],Fe.prototype,"maxValue",2),c([p({converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Fe.prototype,"scale",2);var E8=Fe;Fe.define("zn-chart");var k1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host>div,zn-simplechart>div{width:115px;height:50px;cursor:pointer}`;var T8=["Jun 2016","Jul 2016","Aug 2016","Sep 2016","Oct 2016","Nov 2016","Dec 2016","Jan 2017","Feb 2017","Mar 2017","Apr 2017","May 2017"],$8=[56.4,39.8,66.8,66.4,40.6,55.2,77.4,69.8,57.8,76,110.8,142.6],Tn=class extends S{constructor(){super(...arguments);this.enableAnimations=!1;this.resizeObserver=new ut(this,{target:null,skipInitial:!0,callback:()=>this.chart?.resize()})}firstUpdated(){this.initPromise=this.initChart().catch(()=>{})}async getUpdateComplete(){let t=await super.getUpdateComplete();return await this.initPromise,t}async initChart(){let t=this.shadowRoot?.getElementById("chart");if(!t)return;let r=await np();if(!this.isConnected||this.chart)return;this.chart=r.init(t);let n=this.datasets?.[0]?.data??$8,a=this.labels??T8,s=this.enableAnimations!==!1&&this.enableAnimations!==0,l=typeof this.enableAnimations=="number"?this.enableAnimations:1500;this.chart.setOption({animation:s,animationDuration:l,animationEasing:"cubicOut",tooltip:{trigger:"axis",appendTo:"body",backgroundColor:"rgba(0,0,0,0.7)",borderWidth:0,textStyle:{color:"#fff"}},xAxis:{type:"category",data:a,show:!1},yAxis:{type:"value",show:!1},grid:{left:0,right:0,top:0,bottom:0},series:[{type:"bar",data:n,barWidth:7,itemStyle:{color:"#29C1BC",borderRadius:10},emphasis:{itemStyle:{color:"#19837f"}}}]}),this.resizeObserver.observe(t)}disconnectedCallback(){super.disconnectedCallback(),this.chart?.dispose()}render(){return u`<div id="chart"></div>`}};Tn.styles=_(k1),c([p({attribute:"datasets",type:Array})],Tn.prototype,"datasets",2),c([p({attribute:"labels",type:Array})],Tn.prototype,"labels",2),c([p({attribute:"enable-animations",converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Tn.prototype,"enableAnimations",2);var A8=Tn;Tn.define("zn-simple-chart");var S1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host{display:block}.header{flex-grow:1}.header .caption{justify-content:space-between;gap:var(--zn-base-gap);max-width:100%}.header__caption{font-weight:var(--zn-text-h1-font-weight);font-size:var(--zn-text-h1-font-size);text-transform:var(--zn-text-h1-transform,none);letter-spacing:var(--zn-text-h1-letter-spacing,normal);color:rgba(var(--zn-text-panel-title),100%);line-height:var(--zn-icon-size,20px);margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;gap:var(--zn-spacing-2x-small);align-items:center;text-wrap:auto}.caption__back{display:flex;justify-content:center;align-items:center;color:inherit}:host([transparent])>div{background-color:transparent}:host([with-closer]) .content{padding-right:40px}:host([navigation])>div h1{padding-bottom:0}:host #nav-container{gap:0;border-bottom:1px solid rgb(var(--zn-border-color));margin:0 3px}.alt-overlay{display:none}:host(.alt-pressed) .alt-overlay:empty{display:none !important}:host(.alt-pressed) .alt-overlay{display:flex;gap:10px;align-items:flex-end;position:absolute;left:0;top:10px;padding:6px 15px;background:rgba(var(--zn-panel),0.95);z-index:10}:host(.alt-pressed) .alt-overlay a{display:flex}:host(.alt-pressed) .alt-overlay zn-icon:hover{color:rgb(var(--zn-primary));cursor:pointer}:host([transparent]) .header{margin:0}.header{display:flex;flex-direction:column;margin:0;overflow:hidden}.header .content{display:flex;flex-wrap:wrap;width:100%;max-width:100%;height:-moz-fit-content;height:fit-content;min-height:var(--zn-input-height-medium,36px);gap:10px;margin:0 auto;padding:var(--zn-base-gap)}.header__left{display:flex;justify-content:center;flex-direction:column;gap:1px;flex-shrink:1;max-width:100%}.header__right{flex-grow:1;flex-shrink:1;overflow-x:clip;overflow-clip-margin:var(--zn-focus-ring-outset);overflow-y:visible;min-width:20px}.header .navless{min-height:10px}.header .content{position:relative;gap:10px}.header .breadcrumb{display:inline-flex;align-items:center;gap:var(--zn-spacing-2x-small);font:inherit;color:inherit}.header .breadcrumb::slotted(a){font:inherit;color:inherit;text-decoration:inherit}.header .breadcrumb::slotted(a:hover){color:rgb(var(--zn-primary))}.header .breadcrumb::slotted(a)::after{content:">";margin-left:var(--zn-spacing-2x-small);color:rgb(var(--zn-text-muted));font-weight:var(--zn-font-weight-normal)}.header .caption{flex-grow:1;display:flex;align-items:center;gap:10px;max-width:100%;line-height:var(--zn-icon-size,20px)}.header .caption a{display:flex;align-items:center;color:inherit;text-decoration:none}.header .caption a zn-icon{cursor:pointer}.header .caption a zn-icon:hover{color:rgb(var(--zn-primary))}.header h1{flex-grow:1;overflow:hidden;text-overflow:ellipsis;color:rgb(var(--zn-text-page-title));margin:0;font-size:var(--zn-font-size-medium);font-weight:var(--zn-font-weight-medium)}@media screen and (min-width:var(--zn-container-lg)){.header h1{font-size:var(--zn-font-size-large)}}.header h1:empty{display:none}.header slot{display:flex;align-items:center;flex-wrap:wrap;gap:var(--zn-spacing-small);word-break:break-word}.header slot[name=nav]{flex-basis:100%}.header slot[name=actions]{justify-content:end;flex-wrap:nowrap}.header slot[name=actions]::slotted(zn-button-menu){flex-grow:1;flex-shrink:1}.header .actions{display:flex}:host([baseless]) .header{border-bottom:none !important}`;var Wt=class extends S{constructor(){super(...arguments);this.hasSlotController=new Y(this,"[default]","nav","breadcrumb");this.transparent=!1;this.navigation=[];this.hideBreadcrumb=!1;this.handleAltPress=()=>{this.classList.toggle("alt-pressed",!0)};this.handleAltUp=()=>{this.classList.toggle("alt-pressed",!1)}}connectedCallback(){super.connectedCallback(),window.addEventListener("alt-press",this.handleAltPress),window.addEventListener("alt-up",this.handleAltUp)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("alt-press",this.handleAltPress),window.removeEventListener("alt-up",this.handleAltUp)}firstUpdated(t){super.firstUpdated(t),this.navbar=this.querySelector("zn-navbar"),this.updateNav()}updateNav(){if(!this.navbar&&this.navigation&&this.navigation.length>0){this.navbar=document.createElement("zn-navbar");let t=this.shadowRoot?.querySelector("#nav-container");t&&t.appendChild(this.navbar)}this.navbar&&(this.navbar.navigation=this.navigation,this.navbar.setAttribute("baseless",""))}render(){let t=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("nav"),n=this.navigation&&this.navigation.length>0||r,a=this.previousPath,s=this.entityId,l=this.fullLocation,d=!this.hideBreadcrumb&&this.hasSlotController.test("breadcrumb"),h=u`
+      </slot>`}};it.styles=_(l1),c([p({type:Boolean,reflect:!0})],it.prototype,"available",2),c([p({type:Boolean,reflect:!0})],it.prototype,"incoming",2),c([p({reflect:!0})],it.prototype,"variant",2),c([p()],it.prototype,"header",2),c([p()],it.prototype,"icon",2),c([p({reflect:!0})],it.prototype,"color",2),c([p()],it.prototype,"title",2),c([p()],it.prototype,"subtitle",2),c([p({type:Number})],it.prototype,"progress",2),c([p({attribute:"progress-color"})],it.prototype,"progressColor",2),c([p({attribute:"item-id"})],it.prototype,"itemId",2),c([p({attribute:"accept-uri"})],it.prototype,"acceptUri",2),c([p({type:Number,attribute:"reserved-until"})],it.prototype,"reservedUntil",2),c([p({type:Number,attribute:"auto-accept-delay"})],it.prototype,"autoAcceptDelay",2),c([p({type:Boolean,reflect:!0})],it.prototype,"rejectable",2),c([p({attribute:"accept-icon"})],it.prototype,"acceptIcon",2),c([p({attribute:"accept-gaid"})],it.prototype,"acceptGaid",2),c([p({attribute:"reject-icon"})],it.prototype,"rejectIcon",2),c([p({attribute:"reject-label"})],it.prototype,"rejectLabel",2);var _8=it;it.define("zn-channel-tile");function Co(o,i){let t=o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)",r=o.textColor??t,n=o.enableAnimations!==!1&&o.enableAnimations!==0,a=typeof o.enableAnimations=="number"?o.enableAnimations:1500;return{animation:n,animationDuration:a,animationEasing:"cubicOut",...o.colors?{color:o.colors}:{},textStyle:{color:r},tooltip:{trigger:i,appendTo:"body",valueFormatter:o.yAxisAppend?s=>`${s}${o.yAxisAppend}`:void 0},legend:{top:0,right:0,icon:"circle",textStyle:{color:r}}}}function ep(o){return{...Co(o,"axis"),grid:{left:40,right:20,top:40,bottom:30}}}function k8(o){return o.length===0||o.every(i=>!i.data||i.data.length===0)}function tp(o){let i=k8(o.data)?{min:0,max:6}:{},t=o.scale?{scale:!0,...typeof o.scale=="number"?{boundaryGap:[`${o.scale}%`,`${o.scale}%`]}:{}}:{};return{type:"value",...o.borderColor?{splitLine:{lineStyle:{color:o.borderColor}}}:{},...i,...t,axisLabel:o.yAxisAppend?{formatter:n=>`${n}${o.yAxisAppend}`}:{}}}function rp(o,i=!1){let t=o.borderColor?{axisLine:{lineStyle:{color:o.borderColor}}}:{};return o.xAxisType==="datetime"?{type:"time",...t}:o.xAxisType==="numeric"?{type:"value",...t}:{type:"category",data:o.categories,...i?{boundaryGap:!1}:{},...t}}function d1(o){return o.map(i=>i&&typeof i=="object"&&!Array.isArray(i)&&"x"in i&&"y"in i?[i.x,i.y]:i)}function ip(o,i,t=()=>({})){return o.data.map(r=>({type:i,name:r.name,data:d1(r.data),...r.color?{itemStyle:{color:r.color}}:{},...o.stacked?{stack:"total"}:{},...o.enableAnimations!==!1&&o.enableAnimations!==0&&i==="bar"?{animationDelay:n=>n*50}:{},...t(r)}))}function gm(o){return{...ep(o),xAxis:rp(o),yAxis:tp(o),series:ip(o,"bar")}}function p1(o){return{...ep(o),xAxis:rp(o,!0),yAxis:tp(o),series:ip(o,"line",()=>({symbolSize:o.datapointSize,smooth:o.smooth}))}}function h1(o){return{...ep(o),xAxis:rp(o,!0),yAxis:tp(o),series:ip(o,"line",()=>({symbolSize:o.datapointSize,smooth:o.smooth,areaStyle:{opacity:.1}}))}}function u1(o){return{...ep(o),xAxis:rp({...o,xAxisType:o.xAxisType??"numeric"}),yAxis:tp(o),series:ip(o,"scatter",()=>({symbolSize:o.datapointSize}))}}function bm(o,i){return o.map((t,r)=>{if(typeof t=="number")return{name:i[r]??`${r+1}`,value:t};let{color:n,itemStyle:a,...s}=t;return{...s,name:t.name??i[r]??`${r+1}`,...n?{itemStyle:{...a,color:n}}:a?{itemStyle:a}:{}}})}function m1(o){let i=o.data[0]??{name:"",data:[]},t=o.textColor??(o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)"),r=o.type==="donut"?o.innerRadius??"50%":0,n=o.outerRadius??"70%";return{...Co(o,"item"),series:[{type:"pie",name:i.name,data:bm(i.data??[],o.categories),radius:[r,n],center:["50%","55%"],avoidLabelOverlap:!0,label:{show:o.showLabels??!1,color:t},labelLine:{show:o.showLabels??!1,...o.borderColor?{lineStyle:{color:o.borderColor}}:{}},emphasis:{label:{show:o.showLabels??!1}}}]}}function f1(o){let i=o.indicators?.length?o.indicators:o.categories.map(t=>({name:t}));return{...Co(o,"item"),radar:{indicator:i},series:[{type:"radar",data:o.data.map(t=>({name:t.name,value:d1(t.data),...t.color?{itemStyle:{color:t.color},lineStyle:{color:t.color}}:{}}))}]}}function g1(o){let i=o.data[0]??{name:"",data:[]},[t]=i.data,r=typeof t=="number"?[{name:i.name,value:t}]:bm(i.data??[],o.categories);return{...Co(o,"item"),series:[{type:"gauge",name:i.name,min:o.minValue??0,max:o.maxValue??100,data:r,progress:{show:!0},detail:{valueAnimation:o.enableAnimations!==!1&&o.enableAnimations!==0,formatter:o.yAxisAppend?n=>`${n}${o.yAxisAppend}`:"{value}"}}]}}function b1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"funnel",name:i.name,min:o.minValue,max:o.maxValue,data:bm(i.data??[],o.categories),label:{show:o.showLabels??!0},emphasis:{label:{fontWeight:"bold"}}}]}}function S8(o){return Array.isArray(o)?typeof o[2]=="number":!1}function c1(o,i,t){let r=o.filter(S8).map(n=>n[2]);return r.length?Math[i](...r):t}function v1(o){let i=o.data[0]??{name:"",data:[]},t=i.data??[];return{...Co(o,"item"),grid:{left:60,right:20,top:40,bottom:70},xAxis:{type:"category",data:o.categories,splitArea:{show:!0}},yAxis:{type:"category",data:o.yCategories??[],splitArea:{show:!0}},visualMap:{min:o.minValue??c1(t,"min",0),max:o.maxValue??c1(t,"max",100),calculable:!0,orient:"horizontal",left:"center",bottom:0},series:[{type:"heatmap",name:i.name,data:t,label:{show:o.showLabels??!1},emphasis:{itemStyle:{shadowBlur:10,shadowColor:"rgba(0, 0, 0, 0.35)"}}}]}}function y1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"treemap",name:i.name,data:i.data??[],label:{show:o.showLabels??!0},upperLabel:{show:o.showLabels??!0}}]}}function x1(o){let i=o.data[0]??{name:"",data:[]};return{...Co(o,"item"),series:[{type:"sunburst",name:i.name,data:i.data??[],radius:[o.innerRadius??0,o.outerRadius??"90%"],label:{show:o.showLabels??!0},emphasis:{focus:"ancestor"}}]}}function C8(o){let i=new Set,t=[];for(let r of o)i.has(r.source)||(i.add(r.source),t.push({name:r.source})),i.has(r.target)||(i.add(r.target),t.push({name:r.target}));return t}function w1(o){let i=o.data[0]??{name:"",data:[]},t=i.data??[],n=i.nodes??C8(t),a=o.theme==="dark"?"rgb(161, 161, 170)":"rgb(113, 113, 122)",s=o.textColor??a,l=o.enableAnimations!==!1&&o.enableAnimations!==0,d=typeof o.enableAnimations=="number"?o.enableAnimations:1500;return{animation:l,animationDuration:d,animationEasing:"cubicOut",...o.colors?{color:o.colors}:{},textStyle:{color:s},tooltip:{trigger:"item",appendTo:"body"},series:[{type:"sankey",name:i.name,data:n,links:t,label:{color:s,textBorderWidth:0},lineStyle:{color:"source",opacity:o.theme==="dark"?.4:.3},emphasis:{focus:"adjacency"}}]}}var z1;function np(){return z1??(z1=(async()=>{let[o,i,t,r]=await Promise.all([import("./chunks/zn.AI3T35DX.js"),import("./chunks/zn.EHO4QQOL.js"),import("./chunks/zn.6RARZYEJ.js"),import("./chunks/zn.S4ZVBYAS.js")]);return o.use([i.BarChart,i.FunnelChart,i.GaugeChart,i.HeatmapChart,i.LineChart,i.PieChart,i.RadarChart,i.SankeyChart,i.ScatterChart,i.SunburstChart,i.TreemapChart,t.GridComponent,t.TooltipComponent,t.LegendComponent,t.TitleComponent,t.DataZoomComponent,t.RadarComponent,t.VisualMapComponent,r.CanvasRenderer]),o})()),z1}var _1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host{display:inline-block;width:100%}.chart{position:relative}`;var Fe=class extends S{constructor(){super(...arguments);this.type="bar";this.data=[];this.categories=[];this.yCategories=[];this.indicators=[];this.datapointSize=1;this.stacked=!1;this.live=!1;this.dataUrl="";this.liveInterval=1e3;this.height=300;this.enableAnimations=!1;this.smooth=!1;this.scale=!1;this.resizeObserver=new ut(this,{target:null,skipInitial:!0,callback:()=>this.chart?.resize()})}firstUpdated(t){this.initPromise=this.initChart().catch(()=>{}),super.firstUpdated(t)}async getUpdateComplete(){let t=await super.getUpdateComplete();return await this.initPromise,t}getTheme(){return this.getAttribute("m")==="dark"?"dark":this.getAttribute("m")==="light"?"light":this.getAttribute("t")==="dark"?"dark":"light"}getTextColor(){let t=getComputedStyle(this),r=t.getPropertyValue("--zn-text").trim();if(!r)return;let n=t.getPropertyValue("--zn-text-opacity").trim()||"1";return`rgba(${r}, ${n})`}getBorderColor(){let t=getComputedStyle(this).getPropertyValue("--zn-border-color").trim();return t?`rgb(${t})`:void 0}buildOption(){let t={type:this.type,data:this.data??[],categories:Array.isArray(this.categories)?this.categories:[],xAxisType:this.xAxis,yAxisAppend:this.yAxisAppend,stacked:this.stacked,enableAnimations:this.enableAnimations,datapointSize:this.datapointSize,colors:this.colors,theme:this.getTheme(),smooth:this.smooth,scale:this.scale,textColor:this.getTextColor(),borderColor:this.getBorderColor(),innerRadius:this.innerRadius,outerRadius:this.outerRadius,showLabels:this.showLabels,yCategories:Array.isArray(this.yCategories)?this.yCategories:[],indicators:Array.isArray(this.indicators)?this.indicators:[],minValue:this.minValue,maxValue:this.maxValue};switch(this.type){case"bar":return gm(t);case"line":return p1(t);case"area":return h1(t);case"funnel":return b1(t);case"gauge":return g1(t);case"heatmap":return v1(t);case"donut":case"pie":return m1(t);case"radar":return f1(t);case"sankey":return w1(t);case"scatter":return u1(t);case"sunburst":return x1(t);case"treemap":return y1(t);default:return gm(t)}}async initChart(){let t=this.shadowRoot?.getElementById("chart");if(!t)return;t.style.height=`${this.height}px`;let r=await np();!this.isConnected||this.chart||(this.echarts=r,this.chart=r.init(t),this.chart.setOption(this.buildOption()),this.syncGroup&&(this.chart.group=this.syncGroup,r.connect(this.syncGroup)),this.resizeObserver.observe(t),this.live&&this.dataUrl&&this.startLive())}startLive(){this.liveTimer=window.setInterval(async()=>{try{let r=await(await fetch(this.dataUrl)).json();this.data=r,this.chart?.setOption({...this.buildOption()})}catch{}},this.liveInterval)}reinit(){this.chart?.dispose(),this.chart=void 0,this.initPromise=this.initChart().catch(()=>{})}attributeChangedCallback(t,r,n){if(super.attributeChangedCallback(t,r,n),!!this.chart){if(t==="t"){this.reinit();return}if(t==="type"){this.reinit();return}if(t==="height"){let a=this.shadowRoot?.getElementById("chart");a&&(a.style.height=`${this.height}px`),this.chart.resize();return}if(t==="sync-group"){n?(this.chart.group=n,this.echarts?.connect(n)):this.chart.group="";return}this.chart.setOption({...this.buildOption()})}}disconnectedCallback(){super.disconnectedCallback(),this.liveTimer&&clearInterval(this.liveTimer),this.chart?.dispose(),this.chart=void 0}render(){return u`<div class="chart"><div id="chart"></div></div>`}};Fe.styles=_(_1),c([p()],Fe.prototype,"type",2),c([p({type:Array})],Fe.prototype,"data",2),c([p({type:Array})],Fe.prototype,"categories",2),c([p({attribute:"y-categories",type:Array})],Fe.prototype,"yCategories",2),c([p({type:Array})],Fe.prototype,"indicators",2),c([p({attribute:"xaxis"})],Fe.prototype,"xAxis",2),c([p({type:Number,attribute:"d-size"})],Fe.prototype,"datapointSize",2),c([p({type:Boolean})],Fe.prototype,"stacked",2),c([p({type:Boolean})],Fe.prototype,"live",2),c([p({attribute:"data-url"})],Fe.prototype,"dataUrl",2),c([p({attribute:"live-interval",type:Number})],Fe.prototype,"liveInterval",2),c([p({type:Number,reflect:!0})],Fe.prototype,"height",2),c([p({attribute:"enable-animations",converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Fe.prototype,"enableAnimations",2),c([p({attribute:"y-axis-append"})],Fe.prototype,"yAxisAppend",2),c([p({type:Array})],Fe.prototype,"colors",2),c([p({attribute:"sync-group"})],Fe.prototype,"syncGroup",2),c([p({type:Boolean})],Fe.prototype,"smooth",2),c([p({attribute:"inner-radius"})],Fe.prototype,"innerRadius",2),c([p({attribute:"outer-radius"})],Fe.prototype,"outerRadius",2),c([p({attribute:"show-labels",type:Boolean})],Fe.prototype,"showLabels",2),c([p({attribute:"min-value",type:Number})],Fe.prototype,"minValue",2),c([p({attribute:"max-value",type:Number})],Fe.prototype,"maxValue",2),c([p({converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Fe.prototype,"scale",2);var E8=Fe;Fe.define("zn-chart");var k1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host>div,zn-simplechart>div{width:115px;height:50px;cursor:pointer}`;var T8=["Jun 2016","Jul 2016","Aug 2016","Sep 2016","Oct 2016","Nov 2016","Dec 2016","Jan 2017","Feb 2017","Mar 2017","Apr 2017","May 2017"],$8=[56.4,39.8,66.8,66.4,40.6,55.2,77.4,69.8,57.8,76,110.8,142.6],Tn=class extends S{constructor(){super(...arguments);this.enableAnimations=!1;this.resizeObserver=new ut(this,{target:null,skipInitial:!0,callback:()=>this.chart?.resize()})}firstUpdated(){this.initPromise=this.initChart().catch(()=>{})}async getUpdateComplete(){let t=await super.getUpdateComplete();return await this.initPromise,t}async initChart(){let t=this.shadowRoot?.getElementById("chart");if(!t)return;let r=await np();if(!this.isConnected||this.chart)return;this.chart=r.init(t);let n=this.datasets?.[0]?.data??$8,a=this.labels??T8,s=this.enableAnimations!==!1&&this.enableAnimations!==0,l=typeof this.enableAnimations=="number"?this.enableAnimations:1500;this.chart.setOption({animation:s,animationDuration:l,animationEasing:"cubicOut",tooltip:{trigger:"axis",appendTo:"body",backgroundColor:"rgba(0,0,0,0.7)",borderWidth:0,textStyle:{color:"#fff"}},xAxis:{type:"category",data:a,show:!1},yAxis:{type:"value",show:!1},grid:{left:0,right:0,top:0,bottom:0},series:[{type:"bar",data:n,barWidth:7,itemStyle:{color:"#29C1BC",borderRadius:10},emphasis:{itemStyle:{color:"#19837f"}}}]}),this.resizeObserver.observe(t)}disconnectedCallback(){super.disconnectedCallback(),this.chart?.dispose()}render(){return u`<div id="chart"></div>`}};Tn.styles=_(k1),c([p({attribute:"datasets",type:Array})],Tn.prototype,"datasets",2),c([p({attribute:"labels",type:Array})],Tn.prototype,"labels",2),c([p({attribute:"enable-animations",converter:{fromAttribute:t=>{if(t===null)return!1;if(t===""||t==="true")return!0;let r=parseFloat(t);return Number.isNaN(r)?!0:r}}})],Tn.prototype,"enableAnimations",2);var A8=Tn;Tn.define("zn-simple-chart");var S1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}:host{display:block}.header{flex-grow:1}.header .caption{justify-content:space-between;gap:var(--zn-base-gap);max-width:100%}.header__caption{font-weight:var(--zn-text-h1-font-weight);font-size:var(--zn-text-h1-font-size);text-transform:var(--zn-text-h1-transform,none);letter-spacing:var(--zn-text-h1-letter-spacing,normal);color:rgba(var(--zn-text-panel-title),100%);line-height:var(--zn-icon-size,20px);margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;gap:var(--zn-spacing-2x-small);align-items:center;text-wrap:auto}.caption__back{display:flex;justify-content:center;align-items:center;color:inherit}:host([transparent])>div{background-color:transparent}:host([with-closer]) .content{padding-right:40px}:host([navigation])>div h1{padding-bottom:0}:host #nav-container{gap:0;border-bottom:1px solid rgb(var(--zn-border-color));margin:0 3px}.alt-overlay{display:none}:host(.alt-pressed) .alt-overlay:empty{display:none !important}:host(.alt-pressed) .alt-overlay{display:flex;gap:10px;align-items:flex-end;position:absolute;left:0;top:10px;padding:6px 15px;background:rgba(var(--zn-panel),0.95);z-index:10}:host(.alt-pressed) .alt-overlay a{display:flex}:host(.alt-pressed) .alt-overlay zn-icon:hover{color:rgb(var(--zn-primary));cursor:pointer}:host([transparent]) .header{margin:0}.header{display:flex;flex-direction:column;margin:0;overflow:hidden}.header .content{display:flex;flex-wrap:wrap;width:100%;max-width:100%;height:-moz-fit-content;height:fit-content;min-height:var(--zn-input-height-medium,36px);gap:10px;margin:0 auto;padding:var(--zn-base-gap)}.header__left{display:flex;justify-content:center;flex-direction:column;gap:1px;flex-shrink:1;max-width:100%}.header__right{flex-grow:1;flex-shrink:1;overflow:clip;overflow-clip-margin:var(--zn-focus-ring-outset);min-width:20px}.header .navless{min-height:10px}.header .content{position:relative;gap:10px}.header .breadcrumb{display:inline-flex;align-items:center;gap:var(--zn-spacing-2x-small);font:inherit;color:inherit}.header .breadcrumb::slotted(a){font:inherit;color:inherit;text-decoration:inherit}.header .breadcrumb::slotted(a:hover){color:rgb(var(--zn-primary))}.header .breadcrumb::slotted(a)::after{content:">";margin-left:var(--zn-spacing-2x-small);color:rgb(var(--zn-text-muted));font-weight:var(--zn-font-weight-normal)}.header .caption{flex-grow:1;display:flex;align-items:center;gap:10px;max-width:100%;line-height:var(--zn-icon-size,20px)}.header .caption a{display:flex;align-items:center;color:inherit;text-decoration:none}.header .caption a zn-icon{cursor:pointer}.header .caption a zn-icon:hover{color:rgb(var(--zn-primary))}.header h1{flex-grow:1;overflow:hidden;text-overflow:ellipsis;color:rgb(var(--zn-text-page-title));margin:0;font-size:var(--zn-font-size-medium);font-weight:var(--zn-font-weight-medium)}@media screen and (min-width:var(--zn-container-lg)){.header h1{font-size:var(--zn-font-size-large)}}.header h1:empty{display:none}.header slot{display:flex;align-items:center;flex-wrap:wrap;gap:var(--zn-spacing-small);word-break:break-word}.header slot[name=nav]{flex-basis:100%}.header slot[name=actions]{justify-content:end;flex-wrap:nowrap}.header slot[name=actions]::slotted(zn-button-menu){flex-grow:1;flex-shrink:1}.header .actions{display:flex}:host([baseless]) .header{border-bottom:none !important}`;var Wt=class extends S{constructor(){super(...arguments);this.hasSlotController=new Y(this,"[default]","nav","breadcrumb");this.transparent=!1;this.navigation=[];this.hideBreadcrumb=!1;this.handleAltPress=()=>{this.classList.toggle("alt-pressed",!0)};this.handleAltUp=()=>{this.classList.toggle("alt-pressed",!1)}}connectedCallback(){super.connectedCallback(),window.addEventListener("alt-press",this.handleAltPress),window.addEventListener("alt-up",this.handleAltUp)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("alt-press",this.handleAltPress),window.removeEventListener("alt-up",this.handleAltUp)}firstUpdated(t){super.firstUpdated(t),this.navbar=this.querySelector("zn-navbar"),this.updateNav()}updateNav(){if(!this.navbar&&this.navigation&&this.navigation.length>0){this.navbar=document.createElement("zn-navbar");let t=this.shadowRoot?.querySelector("#nav-container");t&&t.appendChild(this.navbar)}this.navbar&&(this.navbar.navigation=this.navigation,this.navbar.setAttribute("baseless",""))}render(){let t=this.hasSlotController.test("[default]"),r=this.hasSlotController.test("nav"),n=this.navigation&&this.navigation.length>0||r,a=this.previousPath,s=this.entityId,l=this.fullLocation,d=!this.hideBreadcrumb&&this.hasSlotController.test("breadcrumb"),h=u`
       <div class="${M({header:!0,"header--transparent":this.transparent,"header--full-width":this.fullWidth,"header--has-nav":n,"header--has-breadcrumb":d,"header--has-previous":a,"header--has-entity-id":s,"header--has-full-location":l})}" part="base">
 
         ${l||s?u`
@@ -2478,7 +2478,7 @@ import{a as Hn,b as e5,c as kr,d as c,e as V}from"./chunks/zn.UBLZO6CI.js";var s
         ${l}
         ${n}
       </div>
-    `}};cn.styles=_(F1),c([p({attribute:"limit",type:Number,reflect:!0})],cn.prototype,"limit",2),c([p({attribute:"total",type:Number,reflect:!0})],cn.prototype,"total",2),c([p({attribute:"page",type:Number,reflect:!0})],cn.prototype,"page",2),c([p({attribute:"uri",type:String,reflect:!0})],cn.prototype,"uri",2);var P8=cn;cn.define("zn-pagination");var B1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}.vs{display:flex;flex-direction:row;flex-wrap:nowrap;width:100%}.vs__left{flex-shrink:1;flex-grow:0;display:flex;flex-direction:column;align-items:center;margin:0 var(--zn-spacing-small)}.vs__icon{width:var(--zn-spacing-large);height:var(--zn-spacing-large);background-color:rgb(var(--zn-input-bg));border-width:1px;border-radius:100%}.vs__line{min-height:50px;width:4px;border-width:1px;border-top:none;border-bottom:none;background-color:rgba(var(--zn-input-bg));flex-grow:1}.vs__right{display:flex;flex-direction:column;gap:var(--zn-spacing-x-small);flex-grow:1;margin-bottom:50px}.vs__right:last-of-type{margin-bottom:0}.vs__caption{font-size:14px;color:rgb(var(--zn-text-heading));line-height:20px;font-weight:600}.vs__description{font-size:12px;font-weight:500;line-height:18px;color:rgb(var(--zn-text))}:host([last]) .vs__line{display:none}:host([first]) .vs{margin-top:10px}:host([active]) .vs__icon{background-color:rgb(var(--zn-primary))}:host([active]) .vs__line{background-color:rgb(var(--zn-primary))}`;var Di=class extends S{constructor(){super(...arguments);this.last=!1;this.first=!1;this.active=!1}render(){return u`
+    `}};cn.styles=_(F1),c([p({attribute:"limit",type:Number,reflect:!0})],cn.prototype,"limit",2),c([p({attribute:"total",type:Number,reflect:!0})],cn.prototype,"total",2),c([p({attribute:"page",type:Number,reflect:!0})],cn.prototype,"page",2),c([p({attribute:"uri",type:String,reflect:!0})],cn.prototype,"uri",2);var P8=cn;cn.define("zn-pagination");var B1=k`@keyframes rotate-gradient{from{--rotate:0deg}to{--rotate:360deg}}:host{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-transform:none}*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:rgb(var(--zn-border-color))}[hidden]{display:none !important}.width-container,.form-container,.wide-form-container{height:100%;width:100%;margin:var(--zn-default-margin,0 auto)}.width-container{max-width:var(--zn-container)}.form-container{max-width:var(--zn-container-ph)}.wide-form-container{max-width:var(--zn-container-lg)}.vs{display:flex;flex-direction:row;flex-wrap:nowrap;width:100%}.vs__left{flex-shrink:1;flex-grow:0;display:flex;flex-direction:column;align-items:center;margin:0 var(--zn-spacing-small)}.vs__icon{width:var(--zn-spacing-large);height:var(--zn-spacing-large);display:flex;flex-shrink:0;align-items:center;justify-content:center;background-color:rgb(var(--zn-input-bg));border-width:1px;border-radius:100%}.vs__line{min-height:50px;width:4px;border-width:1px;border-top:none;border-bottom:none;background-color:rgba(var(--zn-input-bg));flex-grow:1}.vs__right{display:flex;flex-direction:column;gap:var(--zn-spacing-x-small);flex-grow:1;margin-bottom:50px}.vs__right:last-of-type{margin-bottom:0}.vs__caption{font-size:14px;color:rgb(var(--zn-text-heading));line-height:20px;font-weight:600}.vs__description{font-size:12px;font-weight:500;line-height:18px;color:rgb(var(--zn-text))}:host([last]) .vs__line{display:none}:host([first]) .vs{margin-top:10px}:host([active]) .vs__icon{background-color:rgb(var(--zn-primary))}:host([active]) .vs__line{background-color:rgb(var(--zn-primary))}`;var Di=class extends S{constructor(){super(...arguments);this.last=!1;this.first=!1;this.active=!1}render(){return u`
       <div class="vs">
         <div class="vs__left">
           <div class="vs__icon">

package/docs/pages/components/vertical-stepper.md

@@ -35,7 +35,7 @@ Use the `active` attribute to highlight the current step in the process. The act
 
 ### With Custom Icons
 
-Use the `icon` slot to add custom icons or indicators for each step.
+Use the `icon` slot to add custom icons or indicators for each step. The icon is centred in the step's 32px circle, so keep it at the default 24px size or smaller.
 
 ```html:preview
 <zn-vertical-stepper caption="Personal Details" description="Enter your name and contact information" first active>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubex/zinc",
-  "version": "1.1.173",
+  "version": "1.1.175",
   "description": "A collection of web components for building web applications based off of @shoelace-style/Shoelace",
   "keywords": [
     "web components",

package/src/components/data-table/data-table.component.ts

@@ -562,8 +562,8 @@ export default class ZnDataTable extends ZincElement {
 
   /**
    * Push the shared state back into the actual DOM fields so the UI reflects it. The search value
-   * lives on the slotted <zn-data-table-search>, the filter on <zn-data-table-filter>, and extra
-   * field params on the search/inputs fields (all light-DOM descendants).
+   * lives on the slotted <zn-data-table-search> and extra field params on the search/inputs fields
+   * (all light-DOM descendants).
    */
   private _populateSharableFields() {
     if (this.search) {
@@ -571,11 +571,6 @@ export default class ZnDataTable extends ZincElement {
       if (searchEl) searchEl.value = this.search;
     }
 
-    if (this.filter) {
-      const filterEl = this.querySelector('zn-data-table-filter') as (Element & { value?: unknown }) | null;
-      if (filterEl) filterEl.value = this.filter;
-    }
-
     const known = new Set(ZnDataTable._sharableKnownKeys);
     Object.entries(this.requestParams).forEach(([name, value]) => {
       if (known.has(name) || name === 'searchUri' || value === undefined || value === null) return;
@@ -775,7 +770,12 @@ export default class ZnDataTable extends ZincElement {
   }
 
   protected firstUpdated() {
-    // Push the shared state back into the slotted fields once they exist in the DOM.
+    // The filter may come from the URL or straight from a server-rendered attribute
+    if (this.filter) {
+      const filterEl = this.querySelector('zn-data-table-filter') as (Element & { value?: unknown }) | null;
+      if (filterEl) filterEl.value = this.filter;
+    }
+
     if (this.sharable) {
       this._populateSharableFields();
     }

package/src/components/data-table/data-table.test.ts

@@ -612,4 +612,34 @@ describe('<zn-data-table>', () => {
       }
     });
   });
+
+  it('shows a server-rendered filter as pills in the slotted filter bar', async () => {
+    const originalFetch = window.fetch;
+    window.fetch = () => Promise.resolve(new Response(JSON.stringify({
+      rows: [{id: '1', cells: [{text: 'Row', column: 'name'}]}], page: 1, perPage: 10, total: 1,
+    }), {status: 200, headers: {'Content-Type': 'application/json'}}));
+
+    const filter = btoa(JSON.stringify([
+      {key: 'status', comparator: 'in', value: [0, 10]},
+      {key: 'departmentFid', comparator: 'eq', value: ''},
+    ]));
+    const filters = JSON.stringify([
+      {id: 'status', name: 'status', operators: ['in'], options: {0: 'Pending Reply', 10: 'Open', 20: 'Closed'}},
+      {id: 'departmentFid', name: 'department', operators: ['eq']},
+    ]);
+
+    try {
+      const el = await fixture<ZnDataTable>(html`
+        <zn-data-table filter="${filter}" data-uri="/test-data" headers='{"name": {"key": "name", "label": "Name"}}'>
+          <zn-data-table-filter slot="filter" filters="${filters}"></zn-data-table-filter>
+        </zn-data-table>`);
+      const bar = el.querySelector('zn-data-table-filter') as HTMLElement & { updateComplete: Promise<unknown> };
+      await bar.updateComplete;
+
+      const pills = [...bar.shadowRoot!.querySelectorAll('.filter-bar__pill')].map(p => p.textContent!.trim());
+      expect(pills).to.deep.equal(['Status (2)', 'Department']);
+    } finally {
+      window.fetch = originalFetch;
+    }
+  });
 });

package/src/components/header/header.scss

@@ -130,9 +130,9 @@
   &__right {
     flex-grow: 1;
     flex-shrink: 1;
-    overflow-x: clip;
+    // Chrome ignores overflow-clip-margin unless both axes clip
+    overflow: clip;
     overflow-clip-margin: var(--zn-focus-ring-outset);
-    overflow-y: visible;
     min-width: 20px;
   }
 

package/src/components/vertical-stepper/vertical-stepper.scss

@@ -18,6 +18,10 @@
   &__icon {
     width: var(--zn-spacing-large);
     height: var(--zn-spacing-large);
+    display: flex;
+    flex-shrink: 0;
+    align-items: center;
+    justify-content: center;
     background-color: rgb(var(--zn-input-bg));
     border-width: 1px;
     border-radius: 100%;