@kubex/zinc 1.1.184 → 1.1.185

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

@@ -13,17 +13,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-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.",
@@ -64,6 +53,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-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",
@@ -348,7 +348,17 @@
             { "name": "center" }
           ]
         },
-        { "name": "loading", "values": [] }
+        { "name": "loading", "values": [] },
+        {
+          "name": "processing",
+          "description": "Shows a spinner and ignores clicks, e.g. while a request is in flight.",
+          "values": []
+        },
+        {
+          "name": "processing-text",
+          "description": "Replaces the label while processing.",
+          "values": []
+        }
       ],
       "references": [
         {
@@ -1329,63 +1339,6 @@
         }
       ]
     },
-    {
-      "name": "zn-defined-label",
-      "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
-      "attributes": [
-        {
-          "name": "value",
-          "description": "The selected label key. Also acts as the filter while typing.",
-          "values": []
-        },
-        {
-          "name": "inputValue",
-          "description": "The value entered for the selected label. Submitted as `label:value` when present.",
-          "values": []
-        },
-        {
-          "name": "input-size",
-          "description": "The size of the main input.",
-          "values": [
-            { "name": "x-small" },
-            { "name": "small" },
-            { "name": "medium" },
-            { "name": "large" }
-          ]
-        },
-        {
-          "name": "name",
-          "description": "The name of the control. Used for form submission.",
-          "values": []
-        },
-        {
-          "name": "title",
-          "description": "The title of the main input.",
-          "values": []
-        },
-        {
-          "name": "disabled",
-          "description": "Disables the control.",
-          "values": []
-        },
-        {
-          "name": "allow-custom",
-          "description": "Allows labels that aren't in the predefined list.",
-          "values": []
-        },
-        {
-          "name": "predefined-labels",
-          "description": "The predefined labels. Entries are either a string or `{name, options}`.",
-          "values": [{ "name": "(PredefinedLabel" }, { "name": "string)[]" }]
-        }
-      ],
-      "references": [
-        {
-          "name": "Documentation",
-          "url": "https://zinc.style/components/defined-label"
-        }
-      ]
-    },
     {
       "name": "zn-datepicker",
       "description": "A date picker component with calendar popup and input validation.\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the date value changes.\n- **zn-input** - Emitted when the input value changes.\n- **zn-blur** - Emitted when the input loses focus.\n- **zn-focus** - Emitted when the input gains focus.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **checkValidity(): _boolean_** - Checks the 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. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The datepicker's label. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Tooltip content for the label. Alternatively, you can use the `label-tooltip` attribute.\n- **context-note** - Additional context text displayed above the input. Alternatively, you can use the `context-note` attribute.\n- **help-text** - Help text displayed below the input. Alternatively, you can use the `help-text` attribute.\n- **prefix** - Content to display before the input (in addition to the default calendar icon).\n- **suffix** - Content to display after the input.\n\n### **CSS Properties:**\n - **--zn-input-*** - Inherited input component CSS custom properties. _(default: undefined)_\n- **--zn-datepicker-inline-border-color** - Border colour of the calendar in `inline` mode. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-control** - The form control wrapper.\n- **form-control-label** - The label element.\n- **form-control-input** - The input wrapper.\n- **form-control-help-text** - The help text element.",
@@ -1519,6 +1472,63 @@
         }
       ]
     },
+    {
+      "name": "zn-defined-label",
+      "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
+      "attributes": [
+        {
+          "name": "value",
+          "description": "The selected label key. Also acts as the filter while typing.",
+          "values": []
+        },
+        {
+          "name": "inputValue",
+          "description": "The value entered for the selected label. Submitted as `label:value` when present.",
+          "values": []
+        },
+        {
+          "name": "input-size",
+          "description": "The size of the main input.",
+          "values": [
+            { "name": "x-small" },
+            { "name": "small" },
+            { "name": "medium" },
+            { "name": "large" }
+          ]
+        },
+        {
+          "name": "name",
+          "description": "The name of the control. Used for form submission.",
+          "values": []
+        },
+        {
+          "name": "title",
+          "description": "The title of the main input.",
+          "values": []
+        },
+        {
+          "name": "disabled",
+          "description": "Disables the control.",
+          "values": []
+        },
+        {
+          "name": "allow-custom",
+          "description": "Allows labels that aren't in the predefined list.",
+          "values": []
+        },
+        {
+          "name": "predefined-labels",
+          "description": "The predefined labels. Entries are either a string or `{name, options}`.",
+          "values": [{ "name": "(PredefinedLabel" }, { "name": "string)[]" }]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/defined-label"
+        }
+      ]
+    },
     {
       "name": "zn-dialog",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Events:**\n - **zn-show** - Emitted when the dialog is opens.\n- **zn-close** - Emitted when the dialog is closed.\n- **zn-request-close** - Emitted when the user attempts to close the dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The dialog's label. Alternatively you can use the `label` attribute.\n- **header-icon** - Optional icon to add to the left of the dialog's label (title). A color will be applied to the icon depending on the dialog variant.\n- **announcement-intro** - Optional Intro text to display below the icon, when using the variant `announcement`.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **footer** - The dialog's footer. This is typically used for buttons representing various options.\n- **footer-text** - Optional text to include below the footer buttons, when using the variant `announcement`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--header-spacing** - The amount of padding to use for the header. _(default: undefined)_\n- **--body-spacing** - The amount of padding to use for the body. _(default: undefined)_\n- **--footer-spacing** - The amount of padding to use for the footer. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **title** - The dialog's title.\n- **close-button** - The dialog's close button.\n- **close-button__base** - The close buttons exported `base` part.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
@@ -1867,7 +1877,19 @@
     {
       "name": "zn-filter-wrapper",
       "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": [{ "name": "button", "values": [] }],
+      "attributes": [
+        { "name": "button", "values": [] },
+        {
+          "name": "submit-on-enter",
+          "description": "Submits the filters when Enter is pressed in a text field.",
+          "values": []
+        },
+        {
+          "name": "loading-text",
+          "description": "Shown on the submit button while results load.",
+          "values": []
+        }
+      ],
       "references": [
         {
           "name": "Documentation",

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.184",
+  "version": "1.1.185",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -15,28 +15,6 @@
           "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.",
@@ -105,6 +83,28 @@
             ]
           }
         },
+        {
+          "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",
@@ -547,6 +547,16 @@
             {
               "name": "loading",
               "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "processing",
+              "description": "Shows a spinner and ignores clicks, e.g. while a request is in flight.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "processing-text",
+              "description": "Replaces the label while processing.",
+              "value": { "type": "string", "default": "''" }
             }
           ],
           "slots": [
@@ -666,6 +676,16 @@
                 "type": "'left' | 'right' | 'center' | string"
               },
               { "name": "loading", "type": "boolean" },
+              {
+                "name": "processing",
+                "description": "Shows a spinner and ignores clicks, e.g. while a request is in flight.",
+                "type": "boolean"
+              },
+              {
+                "name": "processingText",
+                "description": "Replaces the label while processing.",
+                "type": "string"
+              },
               { "name": "validity" },
               { "name": "validationMessage" },
               { "name": "handleClick" }
@@ -3069,109 +3089,6 @@
             ]
           }
         },
-        {
-          "name": "zn-defined-label",
-          "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
-          "doc-url": "",
-          "attributes": [
-            {
-              "name": "value",
-              "description": "The selected label key. Also acts as the filter while typing.",
-              "value": { "type": "string", "default": "''" }
-            },
-            {
-              "name": "inputValue",
-              "description": "The value entered for the selected label. Submitted as `label:value` when present.",
-              "value": { "type": "string", "default": "''" }
-            },
-            {
-              "name": "input-size",
-              "description": "The size of the main input.",
-              "value": {
-                "type": "'x-small' | 'small' | 'medium' | 'large'",
-                "default": "'medium'"
-              }
-            },
-            {
-              "name": "name",
-              "description": "The name of the control. Used for form submission.",
-              "value": { "type": "string", "default": "'label'" }
-            },
-            {
-              "name": "title",
-              "description": "The title of the main input.",
-              "value": { "type": "string" }
-            },
-            {
-              "name": "disabled",
-              "description": "Disables the control.",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "allow-custom",
-              "description": "Allows labels that aren't in the predefined list.",
-              "value": { "type": "boolean", "default": "false" }
-            },
-            {
-              "name": "predefined-labels",
-              "description": "The predefined labels. Entries are either a string or `{name, options}`.",
-              "value": {
-                "type": "(PredefinedLabel | string)[]",
-                "default": "[]"
-              }
-            }
-          ],
-          "events": [],
-          "js": {
-            "properties": [
-              { "name": "input", "type": "ZnInput" },
-              { "name": "dropdown", "type": "ZnDropdown" },
-              {
-                "name": "value",
-                "description": "The selected label key. Also acts as the filter while typing.",
-                "type": "string"
-              },
-              {
-                "name": "inputValue",
-                "description": "The value entered for the selected label. Submitted as `label:value` when present.",
-                "type": "string"
-              },
-              {
-                "name": "inputSize",
-                "description": "The size of the main input.",
-                "type": "'x-small' | 'small' | 'medium' | 'large'"
-              },
-              {
-                "name": "name",
-                "description": "The name of the control. Used for form submission.",
-                "type": "string"
-              },
-              {
-                "name": "title",
-                "description": "The title of the main input.",
-                "type": "string"
-              },
-              {
-                "name": "disabled",
-                "description": "Disables the control.",
-                "type": "boolean"
-              },
-              {
-                "name": "allowCustom",
-                "description": "Allows labels that aren't in the predefined list.",
-                "type": "boolean"
-              },
-              {
-                "name": "predefinedLabels",
-                "description": "The predefined labels. Entries are either a string or `{name, options}`.",
-                "type": "(PredefinedLabel | string)[]"
-              },
-              { "name": "validationMessage" },
-              { "name": "validity" }
-            ],
-            "events": []
-          }
-        },
         {
           "name": "zn-datepicker",
           "description": "A date picker component with calendar popup and input validation.\n\n---\n\n\n### **Events:**\n - **zn-change** - Emitted when the date value changes.\n- **zn-input** - Emitted when the input value changes.\n- **zn-blur** - Emitted when the input loses focus.\n- **zn-focus** - Emitted when the input gains focus.\n\n### **Methods:**\n - **focus(options: _FocusOptions_)** - Sets focus on the input.\n- **blur()** - Removes focus from the input.\n- **select()** - Selects all the text in the input.\n- **checkValidity(): _boolean_** - Checks the 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. Pass an empty string to restore validity.\n\n### **Slots:**\n - **label** - The datepicker's label. Alternatively, you can use the `label` attribute.\n- **label-tooltip** - Tooltip content for the label. Alternatively, you can use the `label-tooltip` attribute.\n- **context-note** - Additional context text displayed above the input. Alternatively, you can use the `context-note` attribute.\n- **help-text** - Help text displayed below the input. Alternatively, you can use the `help-text` attribute.\n- **prefix** - Content to display before the input (in addition to the default calendar icon).\n- **suffix** - Content to display after the input.\n\n### **CSS Properties:**\n - **--zn-input-*** - Inherited input component CSS custom properties. _(default: undefined)_\n- **--zn-datepicker-inline-border-color** - Border colour of the calendar in `inline` mode. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-control** - The form control wrapper.\n- **form-control-label** - The label element.\n- **form-control-input** - The input wrapper.\n- **form-control-help-text** - The help text element.",
@@ -3506,6 +3423,109 @@
             ]
           }
         },
+        {
+          "name": "zn-defined-label",
+          "description": "This component provides a labeled input with support for predefined and custom labels,\nallowing users to select or enter label-value pairs within a dropdown interface.\n\n---\n\n\n### **CSS Parts:**\n - **input** - The component's main input.\n- **input-value** - The label's value inputs.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "value",
+              "description": "The selected label key. Also acts as the filter while typing.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "inputValue",
+              "description": "The value entered for the selected label. Submitted as `label:value` when present.",
+              "value": { "type": "string", "default": "''" }
+            },
+            {
+              "name": "input-size",
+              "description": "The size of the main input.",
+              "value": {
+                "type": "'x-small' | 'small' | 'medium' | 'large'",
+                "default": "'medium'"
+              }
+            },
+            {
+              "name": "name",
+              "description": "The name of the control. Used for form submission.",
+              "value": { "type": "string", "default": "'label'" }
+            },
+            {
+              "name": "title",
+              "description": "The title of the main input.",
+              "value": { "type": "string" }
+            },
+            {
+              "name": "disabled",
+              "description": "Disables the control.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "allow-custom",
+              "description": "Allows labels that aren't in the predefined list.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "predefined-labels",
+              "description": "The predefined labels. Entries are either a string or `{name, options}`.",
+              "value": {
+                "type": "(PredefinedLabel | string)[]",
+                "default": "[]"
+              }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "input", "type": "ZnInput" },
+              { "name": "dropdown", "type": "ZnDropdown" },
+              {
+                "name": "value",
+                "description": "The selected label key. Also acts as the filter while typing.",
+                "type": "string"
+              },
+              {
+                "name": "inputValue",
+                "description": "The value entered for the selected label. Submitted as `label:value` when present.",
+                "type": "string"
+              },
+              {
+                "name": "inputSize",
+                "description": "The size of the main input.",
+                "type": "'x-small' | 'small' | 'medium' | 'large'"
+              },
+              {
+                "name": "name",
+                "description": "The name of the control. Used for form submission.",
+                "type": "string"
+              },
+              {
+                "name": "title",
+                "description": "The title of the main input.",
+                "type": "string"
+              },
+              {
+                "name": "disabled",
+                "description": "Disables the control.",
+                "type": "boolean"
+              },
+              {
+                "name": "allowCustom",
+                "description": "Allows labels that aren't in the predefined list.",
+                "type": "boolean"
+              },
+              {
+                "name": "predefinedLabels",
+                "description": "The predefined labels. Entries are either a string or `{name, options}`.",
+                "type": "(PredefinedLabel | string)[]"
+              },
+              { "name": "validationMessage" },
+              { "name": "validity" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "zn-dialog",
           "description": "Short summary of the component's intended use.\n\n---\n\n\n### **Events:**\n - **zn-show** - Emitted when the dialog is opens.\n- **zn-close** - Emitted when the dialog is closed.\n- **zn-request-close** - Emitted when the user attempts to close the dialog by clicking the close button, clicking the overlay, or pressing escape. Calling `event.preventDefault()` will keep the dialog open. Avoid using this unless closing the dialog will result in destructive behavior such as data loss.\n\n### **Methods:**\n - **show()** - Shows the dialog.\n- **hide()** - Hides the dialog.\n\n### **Slots:**\n - _default_ - The default slot.\n- **label** - The dialog's label. Alternatively you can use the `label` attribute.\n- **header-icon** - Optional icon to add to the left of the dialog's label (title). A color will be applied to the icon depending on the dialog variant.\n- **announcement-intro** - Optional Intro text to display below the icon, when using the variant `announcement`.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **footer** - The dialog's footer. This is typically used for buttons representing various options.\n- **footer-text** - Optional text to include below the footer buttons, when using the variant `announcement`.\n\n### **CSS Properties:**\n - **--width** - The preferred width of the dialog. Note the dialog will shrink to accommodate smaller screens. _(default: undefined)_\n- **--header-spacing** - The amount of padding to use for the header. _(default: undefined)_\n- **--body-spacing** - The amount of padding to use for the body. _(default: undefined)_\n- **--footer-spacing** - The amount of padding to use for the footer. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **header** - The dialog's header. This element wraps the title and header actions.\n- **header-actions** - Optional actions to add to the header. Works best with `<zn-button>` elements.\n- **title** - The dialog's title.\n- **close-button** - The dialog's close button.\n- **close-button__base** - The close buttons exported `base` part.\n- **body** - The dialog's body.\n- **footer** - The dialog's footer.",
@@ -4354,6 +4374,16 @@
             {
               "name": "button",
               "value": { "type": "string", "default": "'Filter'" }
+            },
+            {
+              "name": "submit-on-enter",
+              "description": "Submits the filters when Enter is pressed in a text field.",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "loading-text",
+              "description": "Shown on the submit button while results load.",
+              "value": { "type": "string", "default": "'Searching...'" }
             }
           ],
           "slots": [
@@ -4366,7 +4396,18 @@
           "js": {
             "properties": [
               { "name": "button", "type": "string" },
-              { "name": "handleSubmit" }
+              {
+                "name": "submitOnEnter",
+                "description": "Submits the filters when Enter is pressed in a text field.",
+                "type": "boolean"
+              },
+              {
+                "name": "loadingText",
+                "description": "Shown on the submit button while results load.",
+                "type": "string"
+              },
+              { "name": "handleSubmit" },
+              { "name": "handleKeyDown" }
             ],
             "events": [
               {

package/dist/zn.d.ts

@@ -1268,6 +1268,10 @@ declare module "components/button/button.component" {
         loadingText: string;
         loadingTextPosition: 'left' | 'right' | 'center' | string;
         loading: boolean;
+        /** Shows a spinner and ignores clicks, e.g. while a request is in flight. */
+        processing: boolean;
+        /** Replaces the label while processing. */
+        processingText: string;
         get validity(): ValidityState;
         get validationMessage(): string;
         firstUpdated(): void;
@@ -4260,7 +4264,7 @@ declare module "components/data-table/data-table.component" {
         private _columnDefaultsApplied;
         private _formatTemplates;
         requestParams: Record<string, any>;
-        refresh(): void;
+        refresh(): Promise<void>;
         private visibleHeaders;
         private selectableHeaders;
         private isColumnVisible;
@@ -4424,8 +4428,8 @@ declare module "components/cols/cols.component" {
         disconnectedCallback(): void;
         protected updated(changed: PropertyValues<this>): void;
         /**
-         * Flags each child that ends its row as laid out, so `divide` only draws between neighbours on the same row
-         * however the columns have wrapped.
+         * Flags each child that ends its row, and each child on the last row, as laid out, so `divide` only draws
+         * between neighbours however the columns have wrapped.
          */
         private markRowEnds;
         /**
@@ -9161,9 +9165,17 @@ declare module "components/filter-wrapper/filter-wrapper.component" {
     export default class ZnFilterWrapper extends ZincElement {
         static styles: CSSResultGroup;
         button: string;
-        private hasSubmitButton;
+        /** Submits the filters when Enter is pressed in a text field. */
+        submitOnEnter: boolean;
+        /** Shown on the submit button while results load. */
+        loadingText: string;
+        private loading;
+        private submitButton;
         handleSubmit: (event: Event) => void;
+        private setLoading;
+        handleKeyDown: (event: KeyboardEvent) => void;
         connectedCallback(): void;
+        disconnectedCallback(): void;
         private renderDefaultButton;
         render(): import("lit-html").TemplateResult<1>;
     }