@kubex/zinc 1.1.172 → 1.1.174

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",
@@ -4340,171 +4340,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/chat-message-attachment/chat-message-attachment.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "ZnChatMessageAttachment",
-          "cssParts": [
-            {
-              "description": "The attachment link.",
-              "name": "base"
-            },
-            {
-              "description": "The leading icon.",
-              "name": "icon"
-            },
-            {
-              "description": "The attachment label.",
-              "name": "label"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The attachment label. Falls back to the `name` attribute when empty.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "dependencies",
-              "type": {
-                "text": "object"
-              },
-              "static": true,
-              "default": "{ 'zn-icon': ZnIcon }"
-            },
-            {
-              "kind": "field",
-              "name": "href",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The URL the attachment links to.",
-              "attribute": "href"
-            },
-            {
-              "kind": "field",
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
-              "attribute": "name"
-            },
-            {
-              "kind": "field",
-              "name": "icon",
-              "type": {
-                "text": "string"
-              },
-              "default": "'paperclip@lu'",
-              "description": "The leading icon name.",
-              "attribute": "icon"
-            },
-            {
-              "kind": "field",
-              "name": "target",
-              "type": {
-                "text": "string"
-              },
-              "default": "'_blank'",
-              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
-              "attribute": "target",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "download",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Prompt a download rather than navigating to the link.",
-              "attribute": "download"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "href",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The URL the attachment links to.",
-              "fieldName": "href"
-            },
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "default": "''",
-              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
-              "fieldName": "name"
-            },
-            {
-              "name": "icon",
-              "type": {
-                "text": "string"
-              },
-              "default": "'paperclip@lu'",
-              "description": "The leading icon name.",
-              "fieldName": "icon"
-            },
-            {
-              "name": "target",
-              "type": {
-                "text": "string"
-              },
-              "default": "'_blank'",
-              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
-              "fieldName": "target"
-            },
-            {
-              "name": "download",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Prompt a download rather than navigating to the link.",
-              "fieldName": "download"
-            }
-          ],
-          "superclass": {
-            "name": "ZincElement",
-            "module": "/src/internal/zinc-element"
-          },
-          "summary": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.",
-          "tagNameWithoutPrefix": "chat-message-attachment",
-          "tagName": "zn-chat-message-attachment",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\n * Renders an icon and a label as a link, styled to match the message's attachments row. It is\n * intended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\n * placed in that component's `attachments` slot.\n * @documentation https://zinc.style/components/chat-message-attachment\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-icon\n *\n * @slot - The attachment label. Falls back to the `name` attribute when empty.\n *\n * @csspart base - The attachment link.\n * @csspart icon - The leading icon.\n * @csspart label - The attachment label.\n */",
-          "documentation": "https://zinc.style/components/chat-message-attachment",
-          "status": "experimental",
-          "since": "1.0",
-          "dependencies": [
-            "zn-icon"
-          ]
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "ZnChatMessageAttachment",
-            "module": "components/chat-message-attachment/chat-message-attachment.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/checkbox/checkbox.js",
@@ -5382,6 +5217,171 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/chat-message-attachment/chat-message-attachment.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "ZnChatMessageAttachment",
+          "cssParts": [
+            {
+              "description": "The attachment link.",
+              "name": "base"
+            },
+            {
+              "description": "The leading icon.",
+              "name": "icon"
+            },
+            {
+              "description": "The attachment label.",
+              "name": "label"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The attachment label. Falls back to the `name` attribute when empty.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "dependencies",
+              "type": {
+                "text": "object"
+              },
+              "static": true,
+              "default": "{ 'zn-icon': ZnIcon }"
+            },
+            {
+              "kind": "field",
+              "name": "href",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The URL the attachment links to.",
+              "attribute": "href"
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
+              "attribute": "name"
+            },
+            {
+              "kind": "field",
+              "name": "icon",
+              "type": {
+                "text": "string"
+              },
+              "default": "'paperclip@lu'",
+              "description": "The leading icon name.",
+              "attribute": "icon"
+            },
+            {
+              "kind": "field",
+              "name": "target",
+              "type": {
+                "text": "string"
+              },
+              "default": "'_blank'",
+              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
+              "attribute": "target",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "download",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Prompt a download rather than navigating to the link.",
+              "attribute": "download"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "href",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The URL the attachment links to.",
+              "fieldName": "href"
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "''",
+              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
+              "fieldName": "name"
+            },
+            {
+              "name": "icon",
+              "type": {
+                "text": "string"
+              },
+              "default": "'paperclip@lu'",
+              "description": "The leading icon name.",
+              "fieldName": "icon"
+            },
+            {
+              "name": "target",
+              "type": {
+                "text": "string"
+              },
+              "default": "'_blank'",
+              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
+              "fieldName": "target"
+            },
+            {
+              "name": "download",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Prompt a download rather than navigating to the link.",
+              "fieldName": "download"
+            }
+          ],
+          "superclass": {
+            "name": "ZincElement",
+            "module": "/src/internal/zinc-element"
+          },
+          "summary": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.",
+          "tagNameWithoutPrefix": "chat-message-attachment",
+          "tagName": "zn-chat-message-attachment",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\n * Renders an icon and a label as a link, styled to match the message's attachments row. It is\n * intended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\n * placed in that component's `attachments` slot.\n * @documentation https://zinc.style/components/chat-message-attachment\n * @status experimental\n * @since 1.0\n *\n * @dependency zn-icon\n *\n * @slot - The attachment label. Falls back to the `name` attribute when empty.\n *\n * @csspart base - The attachment link.\n * @csspart icon - The leading icon.\n * @csspart label - The attachment label.\n */",
+          "documentation": "https://zinc.style/components/chat-message-attachment",
+          "status": "experimental",
+          "since": "1.0",
+          "dependencies": [
+            "zn-icon"
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "ZnChatMessageAttachment",
+            "module": "components/chat-message-attachment/chat-message-attachment.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/checkbox-group/checkbox-group.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.172",
+    "version": "1.1.174",
     "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",
@@ -598,43 +598,6 @@
         }
       ]
     },
-    {
-      "name": "zn-chat-message-attachment",
-      "description": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.\n---\n\n\n### **Slots:**\n - _default_ - The attachment label. Falls back to the `name` attribute when empty.\n\n### **CSS Parts:**\n - **base** - The attachment link.\n- **icon** - The leading icon.\n- **label** - The attachment label.",
-      "attributes": [
-        {
-          "name": "href",
-          "description": "The URL the attachment links to.",
-          "values": []
-        },
-        {
-          "name": "name",
-          "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
-          "values": []
-        },
-        {
-          "name": "icon",
-          "description": "The leading icon name.",
-          "values": []
-        },
-        {
-          "name": "target",
-          "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
-          "values": []
-        },
-        {
-          "name": "download",
-          "description": "Prompt a download rather than navigating to the link.",
-          "values": []
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://zinc.style/components/chat-message-attachment"
-        }
-      ]
-    },
     {
       "name": "zn-checkbox",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the checkbox loses focus.\n- **zn-change** - Emitted when the checked state changes.\n- **zn-focus** - Emitted when the checkbox gains focus.\n- **zn-input** - Emitted when the checkbox receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n\n### **Slots:**\n - _default_ - The checkbox's label.\n- **image** - Replaces the built-in image used by contained checkboxes.\n- **description** - A description of the checkbox's label. Serves as help text for a checkbox item. Alternatively, you can use the `description` attribute.\n- **selected-content** - Use to nest rich content (like an input) inside a selected checkbox item. Use only with the contained style.\n\n### **CSS Properties:**\n - **--zn-selection-card-image-width** - Width of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-image-height** - Height of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-min-height** - Minimum height of a contained checkbox with an image. _(default: undefined)_\n- **--zn-selection-card-content-min-width** - Width the card text keeps before it wraps below the image. _(default: undefined)_\n- **--zn-selection-card-title-font-size** - Font size of a selection card title. _(default: undefined)_\n- **--zn-selection-card-padding** - Equal inset around the contents of a selection card. _(default: undefined)_\n- **--zn-selection-card-gap** - Space between the image, title, and indicator gutter. _(default: undefined)_\n- **--zn-selection-card-control-offset** - Distance between a positioned control and the card edge. _(default: undefined)_\n- **--zn-selection-card-border-radius** - Corner radius of a contained container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<zn-icon>` element.\n- **unchecked-icon** - The unchecked icon, an `<zn-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<svg>` element.\n- **image-container** - The wrapper around the built-in image or image slot.\n- **image** - The built-in image.\n- **card-title** - The title inside a selection card.\n- **label** - The container that wraps the checkbox's label.\n- **description** - The container that wraps the checkbox's description.\n- **selected-content** - The container that wraps optional content that appears when a checkbox is checked.",
@@ -779,6 +742,43 @@
         }
       ]
     },
+    {
+      "name": "zn-chat-message-attachment",
+      "description": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.\n---\n\n\n### **Slots:**\n - _default_ - The attachment label. Falls back to the `name` attribute when empty.\n\n### **CSS Parts:**\n - **base** - The attachment link.\n- **icon** - The leading icon.\n- **label** - The attachment label.",
+      "attributes": [
+        {
+          "name": "href",
+          "description": "The URL the attachment links to.",
+          "values": []
+        },
+        {
+          "name": "name",
+          "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
+          "values": []
+        },
+        {
+          "name": "icon",
+          "description": "The leading icon name.",
+          "values": []
+        },
+        {
+          "name": "target",
+          "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
+          "values": []
+        },
+        {
+          "name": "download",
+          "description": "Prompt a download rather than navigating to the link.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/chat-message-attachment"
+        }
+      ]
+    },
     {
       "name": "zn-checkbox-group",
       "description": "Shotrt summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the checkbox group's selected value changes.\n- **zn-input** - Emitted when the checkbox group receives user input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot where `<zn-checkbox>` elements are placed.\n- **label** - The checkbox group's label. Required for proper accessibility. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n- **help-text** - Text that describes how to use the checkbox group. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-checkbox-group-column-width** - Minimum column width used by the horizontal contained grid, or the card basis when `wrap` is set. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.",

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.172",
+  "version": "1.1.174",
   "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",
@@ -1251,75 +1251,6 @@
             "events": []
           }
         },
-        {
-          "name": "zn-chat-message-attachment",
-          "description": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.\n\n---\n\n\n### **Slots:**\n - _default_ - The attachment label. Falls back to the `name` attribute when empty.\n\n### **CSS Parts:**\n - **base** - The attachment link.\n- **icon** - The leading icon.\n- **label** - The attachment label.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "href",
-              "description": "The URL the attachment links to.",
-              "value": { "type": "string", "default": "''" }
-            },
-            {
-              "name": "name",
-              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
-              "value": { "type": "string", "default": "''" }
-            },
-            {
-              "name": "icon",
-              "description": "The leading icon name.",
-              "value": { "type": "string", "default": "'paperclip@lu'" }
-            },
-            {
-              "name": "target",
-              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
-              "value": { "type": "string", "default": "'_blank'" }
-            },
-            {
-              "name": "download",
-              "description": "Prompt a download rather than navigating to the link.",
-              "value": { "type": "boolean", "default": "false" }
-            }
-          ],
-          "slots": [
-            {
-              "name": "",
-              "description": "The attachment label. Falls back to the `name` attribute when empty."
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              {
-                "name": "href",
-                "description": "The URL the attachment links to.",
-                "type": "string"
-              },
-              {
-                "name": "name",
-                "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
-                "type": "string"
-              },
-              {
-                "name": "icon",
-                "description": "The leading icon name.",
-                "type": "string"
-              },
-              {
-                "name": "target",
-                "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
-                "type": "string"
-              },
-              {
-                "name": "download",
-                "description": "Prompt a download rather than navigating to the link.",
-                "type": "boolean"
-              }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "zn-checkbox",
           "description": "Short summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-blur** - Emitted when the checkbox loses focus.\n- **zn-change** - Emitted when the checked state changes.\n- **zn-focus** - Emitted when the checkbox gains focus.\n- **zn-input** - Emitted when the checkbox receives input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **click()** - Simulates a click on the checkbox.\n- **focus(options: _FocusOptions_)** - Sets focus on the checkbox.\n- **blur()** - Removes focus from the checkbox.\n- **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity()** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message: _string_)** - Sets a custom validation message. The value provided will be shown to the user when the form is submitted. To clear\nthe custom validation message, call this method with an empty string.\n\n### **Slots:**\n - _default_ - The checkbox's label.\n- **image** - Replaces the built-in image used by contained checkboxes.\n- **description** - A description of the checkbox's label. Serves as help text for a checkbox item. Alternatively, you can use the `description` attribute.\n- **selected-content** - Use to nest rich content (like an input) inside a selected checkbox item. Use only with the contained style.\n\n### **CSS Properties:**\n - **--zn-selection-card-image-width** - Width of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-image-height** - Height of the built-in card image. _(default: undefined)_\n- **--zn-selection-card-min-height** - Minimum height of a contained checkbox with an image. _(default: undefined)_\n- **--zn-selection-card-content-min-width** - Width the card text keeps before it wraps below the image. _(default: undefined)_\n- **--zn-selection-card-title-font-size** - Font size of a selection card title. _(default: undefined)_\n- **--zn-selection-card-padding** - Equal inset around the contents of a selection card. _(default: undefined)_\n- **--zn-selection-card-gap** - Space between the image, title, and indicator gutter. _(default: undefined)_\n- **--zn-selection-card-control-offset** - Distance between a positioned control and the card edge. _(default: undefined)_\n- **--zn-selection-card-border-radius** - Corner radius of a contained container. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **control** - The square container that wraps the checkbox's checked state.\n- **control--checked** - Matches the control part when the checkbox is checked.\n- **control--indeterminate** - Matches the control part when the checkbox is indeterminate.\n- **checked-icon** - The checked icon, an `<zn-icon>` element.\n- **unchecked-icon** - The unchecked icon, an `<zn-icon>` element.\n- **indeterminate-icon** - The indeterminate icon, an `<svg>` element.\n- **image-container** - The wrapper around the built-in image or image slot.\n- **image** - The built-in image.\n- **card-title** - The title inside a selection card.\n- **label** - The container that wraps the checkbox's label.\n- **description** - The container that wraps the checkbox's description.\n- **selected-content** - The container that wraps optional content that appears when a checkbox is checked.",
@@ -1670,6 +1601,75 @@
             ]
           }
         },
+        {
+          "name": "zn-chat-message-attachment",
+          "description": "A single file or link attachment for a `zn-chat-message` or `zn-content-block`.\nRenders an icon and a label as a link, styled to match the message's attachments row. It is\nintended to be used only inside a `zn-chat-message` or `zn-content-block` and is automatically\nplaced in that component's `attachments` slot.\n\n---\n\n\n### **Slots:**\n - _default_ - The attachment label. Falls back to the `name` attribute when empty.\n\n### **CSS Parts:**\n - **base** - The attachment link.\n- **icon** - The leading icon.\n- **label** - The attachment label.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "href",
+              "description": "The URL the attachment links to.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "name",
+              "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "icon",
+              "description": "The leading icon name.",
+              "value": { "type": "string", "default": "'paperclip@lu'" }
+            },
+            {
+              "name": "target",
+              "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
+              "value": { "type": "string", "default": "'_blank'" }
+            },
+            {
+              "name": "download",
+              "description": "Prompt a download rather than navigating to the link.",
+              "value": { "type": "boolean", "default": "false" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "The attachment label. Falls back to the `name` attribute when empty."
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              {
+                "name": "href",
+                "description": "The URL the attachment links to.",
+                "type": "string"
+              },
+              {
+                "name": "name",
+                "description": "The attachment label (e.g. the file name). Used when the default slot is empty.",
+                "type": "string"
+              },
+              {
+                "name": "icon",
+                "description": "The leading icon name.",
+                "type": "string"
+              },
+              {
+                "name": "target",
+                "description": "Where to open the link. Defaults to a new tab. Reflected so the console's\npagelet link interception (`[href]:not([target])`) skips the host and the\nbrowser handles the click natively (download / new tab) instead of\nloading the file URL as a pagelet.",
+                "type": "string"
+              },
+              {
+                "name": "download",
+                "description": "Prompt a download rather than navigating to the link.",
+                "type": "boolean"
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "zn-checkbox-group",
           "description": "Shotrt summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the checkbox group's selected value changes.\n- **zn-input** - Emitted when the checkbox group receives user input.\n- **zn-invalid** - Emitted when the form control has been checked for validity and its constraints aren't satisfied.\n\n### **Methods:**\n - **checkValidity()** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(message)** - Sets a custom validation message. Pass an empty string to restore validity.\n\n### **Slots:**\n - _default_ - The default slot where `<zn-checkbox>` elements are placed.\n- **label** - The checkbox group's label. Required for proper accessibility. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Used to add text that is displayed in a tooltip next to the label. Alternatively, you can use the `label-tooltip` attribute.\n- **help-text** - Text that describes how to use the checkbox group. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Properties:**\n - **--zn-checkbox-group-column-width** - Minimum column width used by the horizontal contained grid, or the card basis when `wrap` is set. _(default: undefined)_\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input's wrapper.\n- **form-control-help-text** - The help text's wrapper.",

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`
@@ -2542,7 +2542,7 @@ import{a as Hn,b as e5,c as kr,d as c,e as V}from"./chunks/zn.UBLZO6CI.js";var s
       ${this._header}
       <div class="${M({pane__content:!0,"pane__content--flush":this.flush})}">
         <slot></slot>
-      </div>`}};To.styles=_(j1),c([p({type:Boolean})],To.prototype,"flush",2);var V8=To;To.define("zn-pane");function pp(o,i,t,r){function n(a){let s=a.composedPath?.()||a.path||[a.target];for(let l of s){if(l instanceof Element&&l.matches(t))return a.selectedTarget=l,r(a);if(l===o)break}return!1}return o.addEventListener(i,n),()=>o.removeEventListener(i,n)}var G1=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([gap]){gap:0 calc(var(--zn-base-gap) / 2)}::slotted(*){display:flex;flex-direction:column;height:100%;overflow-y:auto}:host{display:flex;height:100%;max-height:100%;min-height:100%;width:100%;flex:1;min-width:350px;container-type:inline-size;position:relative}:host #primary-pane{flex:0 1 var(--initial-size,50%);min-width:0;min-height:0}:host #secondary-pane{flex:1 1 0;min-width:0;min-height:0;overflow:hidden}:host slot{overflow:auto}:host #resizer{position:relative}:host #resizer:after{content:"";position:absolute;z-index:500}:host #resizer:before{content:"";display:block;position:absolute;z-index:1;transition:background-color 200ms ease-in-out}:host #resizer{cursor:col-resize}:host #resizer:hover:before{background-color:rgb(var(--zn-blue))}:host(:not([vertical])) #split-nav,zn-split-pane:not([vertical]) #split-nav{display:none}@container (min-width:0px) and (max-width:767px){:host(:not([vertical])) #split-nav,zn-split-pane:not([vertical]) #split-nav{position:absolute;top:0;left:0;right:0;background-color:rgba(var(--zn-panel),var(--zn-panel-opacity));padding:0;margin:0;list-style-type:none;display:flex;flex-direction:row;justify-content:space-between;align-items:center;border-bottom:1px solid rgb(var(--zn-border-color))}:host(:not([vertical])) #split-nav li,zn-split-pane:not([vertical]) #split-nav li{line-height:39px;flex:1 1 0;min-width:0;text-align:center;position:relative;cursor:pointer}:host(:not([vertical])) #split-nav li::before,zn-split-pane:not([vertical]) #split-nav li::before{content:"";left:50%;right:50%;bottom:-1px;position:absolute;background-color:rgb(var(--zn-accent));transition:all 300ms ease-in-out;height:var(--zn-spacing-2x-small)}:host(:not([vertical])) #split-nav li:hover:before,zn-split-pane:not([vertical]) #split-nav li:hover:before{left:20%;right:20%}:host(:not([vertical])) #split-nav li.active::before,zn-split-pane:not([vertical]) #split-nav li.active::before{left:0;right:0}:host(:not([vertical])) #resizer,:host(:not([vertical])) #primary-pane,:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #resizer,zn-split-pane:not([vertical]) #primary-pane,zn-split-pane:not([vertical]) #secondary-pane{display:none}:host(:not([vertical])) #primary-pane,:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #primary-pane,zn-split-pane:not([vertical]) #secondary-pane{flex:1 1 100%;max-width:100% !important;width:100%;padding-top:40px}}:host(:not([vertical])) #primary-pane,zn-split-pane:not([vertical]) #primary-pane{min-width:var(--min-panel-size,15%)}:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #secondary-pane{min-width:var(--min-secondary-panel-size,var(--min-panel-size,15%))}:host(:not([vertical])) #primary-pane,zn-split-pane:not([vertical]) #primary-pane{max-width:var(--max-panel-size,none);overflow:hidden}:host(:not([vertical])) #resizer,zn-split-pane:not([vertical]) #resizer{min-width:1px;padding-top:0;padding-bottom:0}:host(:not([vertical])) #resizer:after,zn-split-pane:not([vertical]) #resizer:after{inset:0 -10px;width:20px}:host(:not([vertical])) #resizer:before,zn-split-pane:not([vertical]) #resizer:before{height:100%;width:1px;top:0;left:50%;transform:translateX(-50%)}@container (min-width:0px) and (max-width:767px){:host([merged-navigation]:not([vertical])){padding-top:0}:host([merged-navigation]:not([vertical])) #split-nav{display:none}:host([merged-navigation]:not([vertical])) #primary-pane,:host([merged-navigation]:not([vertical])) #secondary-pane{padding-top:0}}:host([hide=primary]),:host([hide=secondary]){padding-top:0}:host([hide=primary]) #split-nav,:host([hide=primary]) #resizer,:host([hide=secondary]) #split-nav,:host([hide=secondary]) #resizer{display:none}:host([hide=primary]) #primary-pane{flex:0 0 0;height:0;max-height:0 !important;max-width:0 !important;min-height:0 !important;min-width:0 !important;overflow:hidden;pointer-events:none;visibility:hidden;width:0}:host([hide=primary]) #secondary-pane{flex:1 1 100%;height:100%;max-height:100% !important;max-width:100% !important;width:100%}:host([hide=secondary]) #primary-pane{flex:1 1 100%;height:100%;max-height:100% !important;max-width:100% !important;width:100%}:host([hide=secondary]) #secondary-pane{flex:0 0 0;height:0;max-height:0 !important;max-width:0 !important;min-height:0 !important;min-width:0 !important;overflow:hidden;pointer-events:none;visibility:hidden;width:0}:host([focus-pane="0"]) #primary-pane{display:block}:host([focus-pane="1"]) #secondary-pane{display:block}:host([vertical]){flex-direction:column}:host([vertical]) #split-nav{display:none}:host([vertical]) #primary-pane{min-height:var(--min-panel-size,15%)}:host([vertical]) #secondary-pane{min-height:var(--min-secondary-panel-size,var(--min-panel-size,15%));z-index:1}:host([vertical]) #primary-pane{max-height:var(--max-panel-size,none);overflow:hidden}:host([vertical]) #resizer{min-height:1px;padding-left:0;padding-right:0;cursor:row-resize}:host([vertical]) #resizer:after{inset:-10px 0;height:20px}:host([vertical]) #resizer:before{width:100%;height:1px;left:0;top:50%;transform:translateY(-50%)}:host(.resizing){cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host(.resizing) #primary-pane{min-width:1%}:host(.resizing) #primary-pane,:host(.resizing) #secondary-pane{pointer-events:none}@container (max-width:767px){:host([padded]){padding-left:8px;overflow:hidden}:host([padded]) #primary-pane{border-left:1px solid rgb(var(--zn-border-color))}:host([padded]) #split-nav{left:8px;border-radius:10px 0 0 0;border-left:1px solid rgb(var(--zn-border-color));border-top:1px solid rgb(var(--zn-border-color))}}@container (min-width:768px){:host([padded]) #primary-pane{padding:0 8px}:host([padded]) #primary-pane ::slotted(*){border-radius:10px 10px 0 0;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded]) #resizer{margin-right:8px}:host([padded]) #secondary-pane{overflow:hidden;border-radius:10px 0 0 0;background-color:#fbfbfb;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded-right]) #primary-pane{padding-right:8px}:host([padded-right]) #primary-pane ::slotted(*){border-radius:0 10px 0 0;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded-right]) #resizer::before{background-color:transparent !important}}:host([padded]:not(.resizing)) #resizer::before,:host([padded-right]:not(.resizing)) #resizer::before{background-color:transparent}:host([padded]:not(.resizing)) #resizer:hover::before,:host([padded-right]:not(.resizing)) #resizer:hover::before{background-color:rgb(var(--zn-blue)) !important}:host([bordered]) #resizer:before{background-color:rgb(var(--zn-border-color))}`;var U8=768,Qe=class extends S{constructor(){super(...arguments);this.mouseMoveHandler=null;this.mouseUpHandler=null;this.currentPixelSize=0;this.currentPercentSize=0;this.currentContainerSize=0;this.focusChangeHandler=()=>this.requestUpdate();this.resizeObserver=null;this.parentIsNarrow=!1;this.calculatePixels=!1;this.preferSecondarySize=!1;this.minimumPaneSize=10;this.initialSize=50;this.storeKey="";this.border=!1;this.vertical=!1;this.primaryCaption="Primary";this.secondaryCaption="Secondary";this._focusPane=0;this.padded=!1;this.paddedRight=!1;this.gap=!1;this.hide="";this.mergedNavigation=!1;this.storeTtl=0}connectedCallback(){super.connectedCallback(),this._store=new Sr(this.localStorage?window.localStorage:window.sessionStorage,"znsp:",this.storeTtl),this.primaryFull=this.calculatePixels?this.initialSize+"px":this.initialSize+"%",pp(this,"click","[split-pane-focus]",t=>{t.preventDefault(),t.stopPropagation(),this._setFocusPane(parseInt(t.selectedTarget.getAttribute("split-pane-focus")))}),this.addEventListener("zn-split-pane-focus-change",this.focusChangeHandler),this.resizeObserver=new ResizeObserver(()=>this.refreshNarrowState()),this.resizeObserver.observe(this)}disconnectedCallback(){this.removeEventListener("zn-split-pane-focus-change",this.focusChangeHandler),this.resizeObserver?.disconnect(),this.resizeObserver=null,super.disconnectedCallback()}refreshNarrowState(){let t=this.getBoundingClientRect().width<U8;t!==this.parentIsNarrow&&(this.parentIsNarrow=t,this.updateNestedNavigationMerging(),this.requestUpdate())}firstUpdated(t){setTimeout(this.applyStoredSize.bind(this),100),this.refreshNarrowState(),super.firstUpdated(t)}applyStoredSize(){this.currentContainerSize=this.vertical?this.getBoundingClientRect().height:this.getBoundingClientRect().width;let t=this.preferSecondarySize?this.currentContainerSize-this.initialSize:this.initialSize,r=this.preferSecondarySize?100-this.initialSize:this.initialSize,n=this._store.get(this.storeKey);if(n!==null){let a=n.split(",");if(a.length>=3){t=parseInt(a[0]),r=parseInt(a[1]);let s=parseInt(a[2]);this.preferSecondarySize&&this.calculatePixels&&(t*=this.currentContainerSize/s)}}this.setSize(this.calculatePixels?t:this.currentContainerSize/100*r)}resize(t){if(this.hide==="primary"||this.hide==="secondary")return;this.mouseUpHandler!==null&&this.mouseUpHandler(t),this.classList.add("resizing"),this.currentContainerSize=this.vertical?this.getBoundingClientRect().height:this.getBoundingClientRect().width;let r=this.vertical?this.getBoundingClientRect().top:this.getBoundingClientRect().left;this.mouseMoveHandler=function(n){let a=this.vertical?n.y:n.x;"touches"in n&&n instanceof TouchEvent&&(a=this.vertical?n.touches[0].clientY:n.touches[0].clientX),this.setSize(a-r)}.bind(this),this.mouseUpHandler=function(){this._store.set(this.storeKey,Math.round(this.currentPixelSize)+","+Math.round(this.currentPercentSize)+","+this.currentContainerSize),this.classList.remove("resizing"),window.removeEventListener("touchmove",this.mouseMoveHandler),window.removeEventListener("mousemove",this.mouseMoveHandler),window.removeEventListener("touchend",this.mouseUpHandler),window.removeEventListener("mouseup",this.mouseUpHandler)}.bind(this),window.addEventListener("touchmove",this.mouseMoveHandler),window.addEventListener("touchend",this.mouseUpHandler),window.addEventListener("mousemove",this.mouseMoveHandler),window.addEventListener("mouseup",this.mouseUpHandler)}setSize(t){let r=Number.isFinite(this.minimumSecondaryPaneSize),n=r?this.currentContainerSize-(this.calculatePixels?this.minimumSecondaryPaneSize:this.currentContainerSize/100*this.minimumSecondaryPaneSize):void 0,a=n===void 0?t:Math.min(t,n),s=a/this.currentContainerSize*100;if(this.calculatePixels){let l=n===void 0?this.minimumPaneSize:Math.min(this.minimumPaneSize,n);this.maximumPaneSize||n!==void 0?a=Math.max(l,Math.min(this.maximumPaneSize??1/0,n??1/0,a)):a=Math.max(l,a),s=a/this.currentContainerSize*100,this.initialSize=a}else{let l=r?100-this.minimumSecondaryPaneSize:void 0,d=l===void 0?this.minimumPaneSize:Math.min(this.minimumPaneSize,l);this.maximumPaneSize||l!==void 0?s=Math.max(d,Math.min(this.maximumPaneSize??1/0,l??1/0,s)):s=Math.max(d,s),a=this.currentContainerSize/100*s,this.initialSize=s}this.currentPixelSize=a,this.currentPercentSize=s,this.primaryFull=this.calculatePixels?this.currentPixelSize+"px":this.currentPercentSize+"%"}_setFocusPane(t){this._focusPane=t,this.dispatchEvent(new CustomEvent("zn-split-pane-focus-change",{bubbles:!0,composed:!0}))}getDirectNestedSplitPanes(){return Array.from(this.querySelectorAll("zn-split-pane")).filter(t=>t.parentElement?.closest("zn-split-pane")===this&&!t.vertical)}updateNestedNavigationMerging(){let t=!this.vertical&&this.parentIsNarrow;this.getDirectNestedSplitPanes().forEach(r=>{r.mergedNavigation=t})}getPaneIndexForNestedSplitPane(t){let r=t;for(;r&&r.parentElement!==this;)r=r.parentElement;return r?.getAttribute("slot")==="secondary"?1:0}getNestedNavigationItems(t){return this.getDirectNestedSplitPanesForPane(t).flatMap(r=>r.getNavigationItems().map(n=>({caption:n.caption,active:this._focusPane===t&&n.active,select:()=>{this._setFocusPane(t),n.select()}})))}getDirectNestedSplitPanesForPane(t){return this.getDirectNestedSplitPanes().filter(r=>this.getPaneIndexForNestedSplitPane(r)===t)}getNavigationItems(){this.updateNestedNavigationMerging();let t=this.getNestedNavigationItems(0),r=this.getNestedNavigationItems(1),n=t.length>0?t:[{caption:this.primaryCaption,active:this._focusPane===0,select:()=>this._setFocusPane(0)}],a=r.length>0?r:[{caption:this.secondaryCaption,active:this._focusPane===1,select:()=>this._setFocusPane(1)}];return[...n,...a]}render(){let n=Number.isFinite(this.minimumSecondaryPaneSize)?this.minimumSecondaryPaneSize+(this.calculatePixels?"px":"%"):"var(--min-panel-size)";return u`
+      </div>`}};To.styles=_(j1),c([p({type:Boolean})],To.prototype,"flush",2);var V8=To;To.define("zn-pane");function pp(o,i,t,r){function n(a){let s=a.composedPath?.()||a.path||[a.target];for(let l of s){if(l instanceof Element&&l.matches(t))return a.selectedTarget=l,r(a);if(l===o)break}return!1}return o.addEventListener(i,n),()=>o.removeEventListener(i,n)}var G1=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([gap]){gap:0 calc(var(--zn-base-gap) / 2)}::slotted(*){display:flex;flex-direction:column;height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(var(--inverse-base),0.2) transparent}:host ::-webkit-scrollbar{width:5px;height:5px}:host{}:host ::-webkit-scrollbar-track{background:transparent}:host{}:host ::-webkit-scrollbar-thumb{background:rgba(var(--inverse-base),0.2);border-radius:5px}:host{}:host ::-webkit-scrollbar-thumb:hover{background:rgba(var(--inverse-base),0.6)}:host{display:flex;height:100%;max-height:100%;min-height:100%;width:100%;flex:1;min-width:350px;container-type:inline-size;position:relative}:host #primary-pane{flex:0 1 var(--initial-size,50%);min-width:0;min-height:0}:host #secondary-pane{flex:1 1 0;min-width:0;min-height:0;overflow:hidden}:host slot{overflow:auto}:host #resizer{position:relative}:host #resizer:after{content:"";position:absolute;z-index:500}:host #resizer:before{content:"";display:block;position:absolute;z-index:1;transition:background-color 200ms ease-in-out}:host #resizer{cursor:col-resize}:host #resizer:hover:before{background-color:rgb(var(--zn-blue))}:host(:not([vertical])) #split-nav,zn-split-pane:not([vertical]) #split-nav{display:none}@container (min-width:0px) and (max-width:767px){:host(:not([vertical])) #split-nav,zn-split-pane:not([vertical]) #split-nav{position:absolute;top:0;left:0;right:0;background-color:rgba(var(--zn-panel),var(--zn-panel-opacity));padding:0;margin:0;list-style-type:none;display:flex;flex-direction:row;justify-content:space-between;align-items:center;border-bottom:1px solid rgb(var(--zn-border-color))}:host(:not([vertical])) #split-nav li,zn-split-pane:not([vertical]) #split-nav li{line-height:39px;flex:1 1 0;min-width:0;text-align:center;position:relative;cursor:pointer}:host(:not([vertical])) #split-nav li::before,zn-split-pane:not([vertical]) #split-nav li::before{content:"";left:50%;right:50%;bottom:-1px;position:absolute;background-color:rgb(var(--zn-accent));transition:all 300ms ease-in-out;height:var(--zn-spacing-2x-small)}:host(:not([vertical])) #split-nav li:hover:before,zn-split-pane:not([vertical]) #split-nav li:hover:before{left:20%;right:20%}:host(:not([vertical])) #split-nav li.active::before,zn-split-pane:not([vertical]) #split-nav li.active::before{left:0;right:0}:host(:not([vertical])) #resizer,:host(:not([vertical])) #primary-pane,:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #resizer,zn-split-pane:not([vertical]) #primary-pane,zn-split-pane:not([vertical]) #secondary-pane{display:none}:host(:not([vertical])) #primary-pane,:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #primary-pane,zn-split-pane:not([vertical]) #secondary-pane{flex:1 1 100%;max-width:100% !important;width:100%;padding-top:40px}}:host(:not([vertical])) #primary-pane,zn-split-pane:not([vertical]) #primary-pane{min-width:var(--min-panel-size,15%)}:host(:not([vertical])) #secondary-pane,zn-split-pane:not([vertical]) #secondary-pane{min-width:var(--min-secondary-panel-size,var(--min-panel-size,15%))}:host(:not([vertical])) #primary-pane,zn-split-pane:not([vertical]) #primary-pane{max-width:var(--max-panel-size,none);overflow:hidden}:host(:not([vertical])) #resizer,zn-split-pane:not([vertical]) #resizer{min-width:1px;padding-top:0;padding-bottom:0}:host(:not([vertical])) #resizer:after,zn-split-pane:not([vertical]) #resizer:after{inset:0 -10px;width:20px}:host(:not([vertical])) #resizer:before,zn-split-pane:not([vertical]) #resizer:before{height:100%;width:1px;top:0;left:50%;transform:translateX(-50%)}@container (min-width:0px) and (max-width:767px){:host([merged-navigation]:not([vertical])){padding-top:0}:host([merged-navigation]:not([vertical])) #split-nav{display:none}:host([merged-navigation]:not([vertical])) #primary-pane,:host([merged-navigation]:not([vertical])) #secondary-pane{padding-top:0}}:host([hide=primary]),:host([hide=secondary]){padding-top:0}:host([hide=primary]) #split-nav,:host([hide=primary]) #resizer,:host([hide=secondary]) #split-nav,:host([hide=secondary]) #resizer{display:none}:host([hide=primary]) #primary-pane{flex:0 0 0;height:0;max-height:0 !important;max-width:0 !important;min-height:0 !important;min-width:0 !important;overflow:hidden;pointer-events:none;visibility:hidden;width:0}:host([hide=primary]) #secondary-pane{flex:1 1 100%;height:100%;max-height:100% !important;max-width:100% !important;width:100%}:host([hide=secondary]) #primary-pane{flex:1 1 100%;height:100%;max-height:100% !important;max-width:100% !important;width:100%}:host([hide=secondary]) #secondary-pane{flex:0 0 0;height:0;max-height:0 !important;max-width:0 !important;min-height:0 !important;min-width:0 !important;overflow:hidden;pointer-events:none;visibility:hidden;width:0}:host([focus-pane="0"]) #primary-pane{display:block}:host([focus-pane="1"]) #secondary-pane{display:block}:host([vertical]){flex-direction:column}:host([vertical]) #split-nav{display:none}:host([vertical]) #primary-pane{min-height:var(--min-panel-size,15%)}:host([vertical]) #secondary-pane{min-height:var(--min-secondary-panel-size,var(--min-panel-size,15%));z-index:1}:host([vertical]) #primary-pane{max-height:var(--max-panel-size,none);overflow:hidden}:host([vertical]) #resizer{min-height:1px;padding-left:0;padding-right:0;cursor:row-resize}:host([vertical]) #resizer:after{inset:-10px 0;height:20px}:host([vertical]) #resizer:before{width:100%;height:1px;left:0;top:50%;transform:translateY(-50%)}:host(.resizing){cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none}:host(.resizing) #primary-pane{min-width:1%}:host(.resizing) #primary-pane,:host(.resizing) #secondary-pane{pointer-events:none}@container (max-width:767px){:host([padded]){padding-left:8px;overflow:hidden}:host([padded]) #primary-pane{border-left:1px solid rgb(var(--zn-border-color))}:host([padded]) #split-nav{left:8px;border-radius:10px 0 0 0;border-left:1px solid rgb(var(--zn-border-color));border-top:1px solid rgb(var(--zn-border-color))}}@container (min-width:768px){:host([padded]) #primary-pane{padding:0 8px}:host([padded]) #primary-pane ::slotted(*){border-radius:10px 10px 0 0;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded]) #resizer{margin-right:8px}:host([padded]) #secondary-pane{overflow:hidden;border-radius:10px 0 0 0;background-color:#fbfbfb;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded-right]) #primary-pane{padding-right:8px}:host([padded-right]) #primary-pane ::slotted(*){border-radius:0 10px 0 0;border:1px solid rgb(var(--zn-border-color)) !important;border-bottom-width:0 !important}:host([padded-right]) #resizer::before{background-color:transparent !important}}:host([padded]:not(.resizing)) #resizer::before,:host([padded-right]:not(.resizing)) #resizer::before{background-color:transparent}:host([padded]:not(.resizing)) #resizer:hover::before,:host([padded-right]:not(.resizing)) #resizer:hover::before{background-color:rgb(var(--zn-blue)) !important}:host([bordered]) #resizer:before{background-color:rgb(var(--zn-border-color))}`;var U8=768,Qe=class extends S{constructor(){super(...arguments);this.mouseMoveHandler=null;this.mouseUpHandler=null;this.currentPixelSize=0;this.currentPercentSize=0;this.currentContainerSize=0;this.focusChangeHandler=()=>this.requestUpdate();this.resizeObserver=null;this.parentIsNarrow=!1;this.calculatePixels=!1;this.preferSecondarySize=!1;this.minimumPaneSize=10;this.initialSize=50;this.storeKey="";this.border=!1;this.vertical=!1;this.primaryCaption="Primary";this.secondaryCaption="Secondary";this._focusPane=0;this.padded=!1;this.paddedRight=!1;this.gap=!1;this.hide="";this.mergedNavigation=!1;this.storeTtl=0}connectedCallback(){super.connectedCallback(),this._store=new Sr(this.localStorage?window.localStorage:window.sessionStorage,"znsp:",this.storeTtl),this.primaryFull=this.calculatePixels?this.initialSize+"px":this.initialSize+"%",pp(this,"click","[split-pane-focus]",t=>{t.preventDefault(),t.stopPropagation(),this._setFocusPane(parseInt(t.selectedTarget.getAttribute("split-pane-focus")))}),this.addEventListener("zn-split-pane-focus-change",this.focusChangeHandler),this.resizeObserver=new ResizeObserver(()=>this.refreshNarrowState()),this.resizeObserver.observe(this)}disconnectedCallback(){this.removeEventListener("zn-split-pane-focus-change",this.focusChangeHandler),this.resizeObserver?.disconnect(),this.resizeObserver=null,super.disconnectedCallback()}refreshNarrowState(){let t=this.getBoundingClientRect().width<U8;t!==this.parentIsNarrow&&(this.parentIsNarrow=t,this.updateNestedNavigationMerging(),this.requestUpdate())}firstUpdated(t){setTimeout(this.applyStoredSize.bind(this),100),this.refreshNarrowState(),super.firstUpdated(t)}applyStoredSize(){this.currentContainerSize=this.vertical?this.getBoundingClientRect().height:this.getBoundingClientRect().width;let t=this.preferSecondarySize?this.currentContainerSize-this.initialSize:this.initialSize,r=this.preferSecondarySize?100-this.initialSize:this.initialSize,n=this._store.get(this.storeKey);if(n!==null){let a=n.split(",");if(a.length>=3){t=parseInt(a[0]),r=parseInt(a[1]);let s=parseInt(a[2]);this.preferSecondarySize&&this.calculatePixels&&(t*=this.currentContainerSize/s)}}this.setSize(this.calculatePixels?t:this.currentContainerSize/100*r)}resize(t){if(this.hide==="primary"||this.hide==="secondary")return;this.mouseUpHandler!==null&&this.mouseUpHandler(t),this.classList.add("resizing"),this.currentContainerSize=this.vertical?this.getBoundingClientRect().height:this.getBoundingClientRect().width;let r=this.vertical?this.getBoundingClientRect().top:this.getBoundingClientRect().left;this.mouseMoveHandler=function(n){let a=this.vertical?n.y:n.x;"touches"in n&&n instanceof TouchEvent&&(a=this.vertical?n.touches[0].clientY:n.touches[0].clientX),this.setSize(a-r)}.bind(this),this.mouseUpHandler=function(){this._store.set(this.storeKey,Math.round(this.currentPixelSize)+","+Math.round(this.currentPercentSize)+","+this.currentContainerSize),this.classList.remove("resizing"),window.removeEventListener("touchmove",this.mouseMoveHandler),window.removeEventListener("mousemove",this.mouseMoveHandler),window.removeEventListener("touchend",this.mouseUpHandler),window.removeEventListener("mouseup",this.mouseUpHandler)}.bind(this),window.addEventListener("touchmove",this.mouseMoveHandler),window.addEventListener("touchend",this.mouseUpHandler),window.addEventListener("mousemove",this.mouseMoveHandler),window.addEventListener("mouseup",this.mouseUpHandler)}setSize(t){let r=Number.isFinite(this.minimumSecondaryPaneSize),n=r?this.currentContainerSize-(this.calculatePixels?this.minimumSecondaryPaneSize:this.currentContainerSize/100*this.minimumSecondaryPaneSize):void 0,a=n===void 0?t:Math.min(t,n),s=a/this.currentContainerSize*100;if(this.calculatePixels){let l=n===void 0?this.minimumPaneSize:Math.min(this.minimumPaneSize,n);this.maximumPaneSize||n!==void 0?a=Math.max(l,Math.min(this.maximumPaneSize??1/0,n??1/0,a)):a=Math.max(l,a),s=a/this.currentContainerSize*100,this.initialSize=a}else{let l=r?100-this.minimumSecondaryPaneSize:void 0,d=l===void 0?this.minimumPaneSize:Math.min(this.minimumPaneSize,l);this.maximumPaneSize||l!==void 0?s=Math.max(d,Math.min(this.maximumPaneSize??1/0,l??1/0,s)):s=Math.max(d,s),a=this.currentContainerSize/100*s,this.initialSize=s}this.currentPixelSize=a,this.currentPercentSize=s,this.primaryFull=this.calculatePixels?this.currentPixelSize+"px":this.currentPercentSize+"%"}_setFocusPane(t){this._focusPane=t,this.dispatchEvent(new CustomEvent("zn-split-pane-focus-change",{bubbles:!0,composed:!0}))}getDirectNestedSplitPanes(){return Array.from(this.querySelectorAll("zn-split-pane")).filter(t=>t.parentElement?.closest("zn-split-pane")===this&&!t.vertical)}updateNestedNavigationMerging(){let t=!this.vertical&&this.parentIsNarrow;this.getDirectNestedSplitPanes().forEach(r=>{r.mergedNavigation=t})}getPaneIndexForNestedSplitPane(t){let r=t;for(;r&&r.parentElement!==this;)r=r.parentElement;return r?.getAttribute("slot")==="secondary"?1:0}getNestedNavigationItems(t){return this.getDirectNestedSplitPanesForPane(t).flatMap(r=>r.getNavigationItems().map(n=>({caption:n.caption,active:this._focusPane===t&&n.active,select:()=>{this._setFocusPane(t),n.select()}})))}getDirectNestedSplitPanesForPane(t){return this.getDirectNestedSplitPanes().filter(r=>this.getPaneIndexForNestedSplitPane(r)===t)}getNavigationItems(){this.updateNestedNavigationMerging();let t=this.getNestedNavigationItems(0),r=this.getNestedNavigationItems(1),n=t.length>0?t:[{caption:this.primaryCaption,active:this._focusPane===0,select:()=>this._setFocusPane(0)}],a=r.length>0?r:[{caption:this.secondaryCaption,active:this._focusPane===1,select:()=>this._setFocusPane(1)}];return[...n,...a]}render(){let n=Number.isFinite(this.minimumSecondaryPaneSize)?this.minimumSecondaryPaneSize+(this.calculatePixels?"px":"%"):"var(--min-panel-size)";return u`
       <style>:host {
         --min-panel-size: ${this.minimumPaneSize}${this.calculatePixels?"px":"%"};
         --min-secondary-panel-size: ${n};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubex/zinc",
-  "version": "1.1.172",
+  "version": "1.1.174",
   "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/split-pane/split-pane.scss

@@ -6,14 +6,18 @@
   gap: 0 calc(var(--zn-base-gap) / 2);
 }
 
+// Slotted panes are light DOM, which ::-webkit-scrollbar rules here cannot reach, so they take the standard properties.
 ::slotted(*) {
   display: flex;
   flex-direction: column;
   height: 100%;
   overflow-y: auto;
+  scrollbar-width: thin;
+  scrollbar-color: mixins.$scrollbar-thumb transparent;
 }
 
 :host {
+  @include wc.scrollbars;
   display: flex;
   height: 100%;
   max-height: 100%;