@kubex/zinc 1.0.19 → 1.0.21

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

@@ -63,6 +63,7 @@
       "name": "zn-audio-select",
       "description": "Short summary of the component's intended use.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.\n- **actions** - The actions slot.\n- **footer** - The footer 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": "value", "values": [] },
         { "name": "label", "values": [] },
         { "name": "placeholder", "values": [] },
         { "name": "files", "values": [{ "name": "AudioFile[]" }] }
@@ -302,6 +303,11 @@
           "description": "The current value of the checkbox, submitted as a name/value pair with form data.",
           "values": []
         },
+        {
+          "name": "unchecked-value",
+          "description": "The unchecked value of the checkbox, submitted as a name/value pair with form data.",
+          "values": []
+        },
         {
           "name": "size",
           "description": "The checkbox's size.",
@@ -346,6 +352,11 @@
           "description": "Makes the checkbox a required field.",
           "values": []
         },
+        {
+          "name": "submit-on-click",
+          "description": "Submits the form when checkbox is clicked.",
+          "values": []
+        },
         {
           "name": "description",
           "description": "The checkbox's help text. If you need to display HTML, use the `description` slot instead.",
@@ -1606,6 +1617,23 @@
         }
       ]
     },
+    {
+      "name": "zn-input-group",
+      "description": "A wrapper component that groups inputs and selects visually.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for inputs and selects.\n- **label** - The input group's label. Alternatively, you can use the `label` attribute.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-control** - The form control wrapper.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input group container.",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "The input group's label. If you need to display HTML, use the `label` slot.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/input-group"
+        }
+      ]
+    },
     {
       "name": "zn-item",
       "description": "Used for listing items in a description list. Caption on the right, content on the left.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Can either be slotted or use the value attribute\n- **actions** - Used for adding actions to a zn-item.\n\n### **CSS Parts:**\n - **base** - The items base wrapper\n- **caption** - The items caption\n- **icon** - The items icon",
@@ -1627,7 +1655,8 @@
         { "name": "inline", "values": [] },
         { "name": "grid", "values": [] },
         { "name": "no-padding", "values": [] },
-        { "name": "align-end", "values": [] }
+        { "name": "align-end", "values": [] },
+        { "name": "align-center", "values": [] }
       ],
       "references": [
         { "name": "Documentation", "url": "https://zinc.style/components/item" }
@@ -1734,6 +1763,8 @@
         { "name": "stacked", "values": [] },
         { "name": "dropdown", "values": [{ "name": "array" }] },
         { "name": "no-pad", "values": [{ "name": "false" }] },
+        { "name": "manual-add-items", "values": [] },
+        { "name": "isolated", "values": [] },
         { "name": "_appended", "values": [{ "name": "Element[]" }] }
       ],
       "references": [
@@ -2973,6 +3004,31 @@
         }
       ]
     },
+    {
+      "name": "zn-translations",
+      "description": "\n---\n",
+      "attributes": [
+        { "name": "name", "values": [] },
+        { "name": "value", "values": [] },
+        { "name": "label", "values": [] },
+        { "name": "disabled", "values": [] },
+        { "name": "required", "values": [] },
+        {
+          "name": "languages",
+          "values": [{ "name": "Record<string" }, { "name": "string>" }]
+        },
+        {
+          "name": "values",
+          "values": [{ "name": "Record<string" }, { "name": "string>" }]
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://zinc.style/components/translations"
+        }
+      ]
+    },
     {
       "name": "zn-vertical-stepper",
       "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.",

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.0.19",
+  "version": "1.0.21",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -97,12 +97,16 @@
           "description": "Short summary of the component's intended use.\n---\n\n\n### **Slots:**\n - _default_ - The default slot.\n- **actions** - The actions slot.\n- **footer** - The footer 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": [
+            { "name": "value", "value": { "type": "string", "default": "''" } },
             { "name": "label", "value": { "type": "string", "default": "''" } },
             {
               "name": "placeholder",
               "value": { "type": "string", "default": "''" }
             },
-            { "name": "files", "value": { "type": "AudioFile[]" } }
+            {
+              "name": "files",
+              "value": { "type": "AudioFile[]", "default": "[]" }
+            }
           ],
           "slots": [
             { "name": "", "description": "The default slot." },
@@ -112,6 +116,7 @@
           "events": [],
           "js": {
             "properties": [
+              { "name": "value", "type": "string" },
               { "name": "label", "type": "string" },
               { "name": "placeholder", "type": "string" },
               { "name": "files", "type": "AudioFile[]" }
@@ -574,6 +579,11 @@
               "description": "The current value of the checkbox, submitted as a name/value pair with form data.",
               "value": { "type": "string" }
             },
+            {
+              "name": "unchecked-value",
+              "description": "The unchecked value of the checkbox, submitted as a name/value pair with form data.",
+              "value": { "type": "string" }
+            },
             {
               "name": "size",
               "description": "The checkbox's size.",
@@ -617,6 +627,11 @@
               "description": "Makes the checkbox a required field.",
               "value": { "type": "boolean", "default": "false" }
             },
+            {
+              "name": "submit-on-click",
+              "description": "Submits the form when checkbox is clicked.",
+              "value": { "type": "boolean", "default": "false" }
+            },
             {
               "name": "description",
               "description": "The checkbox's help text. If you need to display HTML, use the `description` slot instead.",
@@ -697,6 +712,11 @@
                 "description": "The current value of the checkbox, submitted as a name/value pair with form data.",
                 "type": "string"
               },
+              {
+                "name": "uncheckedValue",
+                "description": "The unchecked value of the checkbox, submitted as a name/value pair with form data.",
+                "type": "string"
+              },
               {
                 "name": "size",
                 "description": "The checkbox's size.",
@@ -742,6 +762,11 @@
                 "description": "Makes the checkbox a required field.",
                 "type": "boolean"
               },
+              {
+                "name": "submitOnClick",
+                "description": "Submits the form when checkbox is clicked.",
+                "type": "boolean"
+              },
               {
                 "name": "description",
                 "description": "The checkbox's help text. If you need to display HTML, use the `description` slot instead.",
@@ -3609,6 +3634,40 @@
             ]
           }
         },
+        {
+          "name": "zn-input-group",
+          "description": "A wrapper component that groups inputs and selects visually.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for inputs and selects.\n- **label** - The input group's label. Alternatively, you can use the `label` attribute.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **form-control** - The form control wrapper.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The input group container.",
+          "doc-url": "",
+          "attributes": [
+            {
+              "name": "label",
+              "description": "The input group's label. If you need to display HTML, use the `label` slot.",
+              "value": { "type": "string", "default": "''" }
+            }
+          ],
+          "slots": [
+            {
+              "name": "",
+              "description": "The default slot for inputs and selects."
+            },
+            {
+              "name": "label",
+              "description": "The input group's label. Alternatively, you can use the `label` attribute."
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "defaultSlot", "type": "HTMLSlotElement" },
+              {
+                "name": "label",
+                "description": "The input group's label. If you need to display HTML, use the `label` slot.",
+                "type": "string"
+              }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "zn-item",
           "description": "Used for listing items in a description list. Caption on the right, content on the left.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Can either be slotted or use the value attribute\n- **actions** - Used for adding actions to a zn-item.\n\n### **CSS Parts:**\n - **base** - The items base wrapper\n- **caption** - The items caption\n- **icon** - The items icon",
@@ -3630,7 +3689,8 @@
             { "name": "inline", "value": { "type": "boolean" } },
             { "name": "grid", "value": { "type": "boolean" } },
             { "name": "no-padding", "value": { "type": "boolean" } },
-            { "name": "align-end", "value": { "type": "boolean" } }
+            { "name": "align-end", "value": { "type": "boolean" } },
+            { "name": "align-center", "value": { "type": "boolean" } }
           ],
           "slots": [
             {
@@ -3655,7 +3715,8 @@
               { "name": "inline", "type": "boolean" },
               { "name": "grid", "type": "boolean" },
               { "name": "noPadding", "type": "boolean" },
-              { "name": "alignEnd", "type": "boolean" }
+              { "name": "alignEnd", "type": "boolean" },
+              { "name": "alignCenter", "type": "boolean" }
             ],
             "events": []
           }
@@ -3887,6 +3948,14 @@
               "value": { "type": "array", "default": "[]" }
             },
             { "name": "no-pad", "value": { "type": "false" } },
+            {
+              "name": "manual-add-items",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "isolated",
+              "value": { "type": "boolean", "default": "false" }
+            },
             { "name": "_appended", "value": { "type": "Element[]" } }
           ],
           "slots": [
@@ -3908,6 +3977,8 @@
               { "name": "stacked", "type": "boolean" },
               { "name": "dropdown", "type": "array" },
               { "name": "noPad", "type": "false" },
+              { "name": "manualAddItems", "type": "boolean" },
+              { "name": "isolated", "type": "boolean" },
               { "name": "handleResize" }
             ],
             "events": [
@@ -6900,6 +6971,53 @@
             ]
           }
         },
+        {
+          "name": "zn-translations",
+          "description": "\n---\n",
+          "doc-url": "",
+          "attributes": [
+            { "name": "name", "value": { "type": "string", "default": "''" } },
+            {
+              "name": "value",
+              "value": { "type": "string", "default": "'{\"en\":\"\"}'" }
+            },
+            { "name": "label", "value": { "type": "string", "default": "''" } },
+            {
+              "name": "disabled",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "required",
+              "value": { "type": "boolean", "default": "false" }
+            },
+            {
+              "name": "languages",
+              "value": {
+                "type": "Record<string, string>",
+                "default": "{ 'en': 'English' }"
+              }
+            },
+            {
+              "name": "values",
+              "value": { "type": "Record<string, string>", "default": "{}" }
+            }
+          ],
+          "events": [],
+          "js": {
+            "properties": [
+              { "name": "name", "type": "string" },
+              { "name": "value", "type": "string" },
+              { "name": "label", "type": "string" },
+              { "name": "disabled", "type": "boolean" },
+              { "name": "required", "type": "boolean" },
+              { "name": "languages", "type": "Record<string, string>" },
+              { "name": "values", "type": "Record<string, string>" },
+              { "name": "validity", "type": "ValidityState" },
+              { "name": "validationMessage" }
+            ],
+            "events": []
+          }
+        },
         {
           "name": "zn-vertical-stepper",
           "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.",

package/dist/zn.d.ts

@@ -622,7 +622,7 @@ declare module "components/menu-item/index" {
 declare module "events/zn-select" {
     import type ZnMenuItem from "components/menu-item/index";
     export type ZnSelectEvent = CustomEvent<{
-        item: ZnMenuItem;
+        item: ZnMenuItem | HTMLElement;
     }>;
     global {
         interface GlobalEventHandlersEventMap {
@@ -2639,6 +2639,7 @@ declare module "components/data-table/data-table.component" {
         sortValue?: string;
         uri?: string;
         target?: string;
+        copyable?: boolean;
     }
     interface Row {
         id: string;
@@ -3198,6 +3199,8 @@ declare module "components/navbar/navbar.component" {
         stacked: boolean;
         dropdown: never[];
         noPad: false;
+        manualAddItems: boolean;
+        isolated: boolean;
         private _preItems;
         private _postItems;
         private _appended;
@@ -3213,9 +3216,10 @@ declare module "components/navbar/navbar.component" {
         appendItem(item: Element): void;
         connectedCallback(): void;
         handleResize: () => void;
-        addItem(item: any): any;
+        addItem(item: Element): void;
         protected firstUpdated(_changedProperties: PropertyValues): void;
         showMore(): void;
+        private handleClick;
         render(): import("lit").TemplateResult<1>;
     }
 }
@@ -4995,6 +4999,8 @@ declare module "components/checkbox/checkbox.component" {
         name: string;
         /** The current value of the checkbox, submitted as a name/value pair with form data. */
         value: string;
+        /** The unchecked value of the checkbox, submitted as a name/value pair with form data. */
+        uncheckedValue: string;
         /** The checkbox's size. */
         size: 'small' | 'medium' | 'large';
         /** Disables the checkbox. */
@@ -5020,6 +5026,8 @@ declare module "components/checkbox/checkbox.component" {
         form: string;
         /** Makes the checkbox a required field. */
         required: boolean;
+        /** Submits the form when checkbox is clicked. */
+        submitOnClick: boolean;
         /** The checkbox's help text. If you need to display HTML, use the `description` slot instead. */
         description: string;
         label: string;
@@ -5228,6 +5236,43 @@ declare module "components/form-group/index" {
         }
     }
 }
+declare module "components/input-group/input-group.component" {
+    import { type CSSResultGroup } from 'lit';
+    import ZincElement from "internal/zinc-element";
+    /**
+     * @summary A wrapper component that groups inputs and selects visually.
+     * @documentation https://zinc.style/components/input-group
+     * @status experimental
+     * @since 1.0
+     *
+     * @slot - The default slot for inputs and selects.
+     * @slot label - The input group's label. Alternatively, you can use the `label` attribute.
+     *
+     * @csspart base - The component's base wrapper.
+     * @csspart form-control - The form control wrapper.
+     * @csspart form-control-label - The label's wrapper.
+     * @csspart form-control-input - The input group container.
+     */
+    export default class ZnInputGroup extends ZincElement {
+        static styles: CSSResultGroup;
+        private readonly hasSlotController;
+        defaultSlot: HTMLSlotElement;
+        /** The input group's label. If you need to display HTML, use the `label` slot. */
+        label: string;
+        private handleSlotChange;
+        render(): import("lit").TemplateResult<1>;
+    }
+}
+declare module "components/input-group/index" {
+    import ZnInputGroup from "components/input-group/input-group.component";
+    export * from "components/input-group/input-group.component";
+    export default ZnInputGroup;
+    global {
+        interface HTMLElementTagNameMap {
+            'zn-input-group': ZnInputGroup;
+        }
+    }
+}
 declare module "components/linked-select/linked-select.component" {
     import { type CSSResultGroup, type PropertyValues } from 'lit';
     import ZincElement from "internal/zinc-element";
@@ -5921,6 +5966,7 @@ declare module "components/item/item.component" {
         grid: boolean;
         noPadding: boolean;
         alignEnd: boolean;
+        alignCenter: boolean;
         connectedCallback(): void;
         protected updated(_changedProperties: PropertyValues): void;
         protected _hasContent(): boolean;
@@ -6593,7 +6639,7 @@ declare module "components/reveal/index" {
     }
 }
 declare module "components/audio-select/audio-select.component" {
-    import { type CSSResultGroup } from 'lit';
+    import { type CSSResultGroup, type PropertyValues } from 'lit';
     import ZincElement from "internal/zinc-element";
     import type { ZnChangeEvent } from "events/zn-change";
     interface AudioFile {
@@ -6616,15 +6662,16 @@ declare module "components/audio-select/audio-select.component" {
      */
     export default class ZnAudioSelect extends ZincElement {
         static styles: CSSResultGroup;
-        private _selectedUrl;
         private _isPlaying;
         private readonly _audio;
+        value: string;
         label: string;
         placeholder: string;
         files: AudioFile[];
         constructor();
         disconnectedCallback(): void;
-        _stopAudio(): void;
+        updated(changedProperties: PropertyValues): void;
+        stopAudio(): void;
         handleSelectChange(e: ZnChangeEvent): void;
         togglePreview(e: CustomEvent): void;
         render(): import("lit").TemplateResult<1>;
@@ -6640,6 +6687,52 @@ declare module "components/audio-select/index" {
         }
     }
 }
+declare module "components/translations/translations.component" {
+    import ZincElement from "internal/zinc-element";
+    import ZnInlineEdit from "components/inline-edit/index";
+    import ZnInput from "components/input/index";
+    import ZnNavbar from "components/navbar/index";
+    import type { PropertyValues } from 'lit';
+    import type { ZincFormControl } from "internal/zinc-element";
+    export default class ZnTranslations extends ZincElement implements ZincFormControl {
+        static styles: import("lit").CSSResult;
+        static dependencies: {
+            'zn-navbar': typeof ZnNavbar;
+            'zn-input': typeof ZnInput;
+            'zn-inline-edit': typeof ZnInlineEdit;
+        };
+        private readonly formControlController;
+        private readonly hasSlotController;
+        name: string;
+        value: string;
+        label: string;
+        disabled: boolean;
+        required: boolean;
+        languages: Record<string, string>;
+        values: Record<string, string>;
+        private _activeLanguage;
+        get validity(): ValidityState;
+        get validationMessage(): string;
+        checkValidity(): boolean;
+        getForm(): HTMLFormElement | null;
+        reportValidity(): boolean;
+        setCustomValidity(): void;
+        protected firstUpdated(): void;
+        willUpdate(changedProperties: PropertyValues): void;
+        private handleLanguageAdd;
+        private handleNavbarClick;
+        private handleValueUpdate;
+        private updateValue;
+        private handleKeyDown;
+        private handleSubmit;
+        render(): import("lit").TemplateResult<1>;
+    }
+}
+declare module "components/translations/index" {
+    import ZnTranslations from "components/translations/translations.component";
+    export * from "components/translations/translations.component";
+    export default ZnTranslations;
+}
 declare module "events/zn-after-hide" {
     export type ZnAfterHideEvent = CustomEvent<Record<PropertyKey, never>>;
     global {
@@ -6756,6 +6849,7 @@ declare module "zinc" {
     export { default as Checkbox } from "components/checkbox/index";
     export { default as Datepicker } from "components/datepicker/index";
     export { default as FormGroup } from "components/form-group/index";
+    export { default as InputGroup } from "components/input-group/index";
     export { default as LinkedSelect } from "components/linked-select/index";
     export { default as Radio } from "components/radio/index";
     export { default as Rating } from "components/rating/index";
@@ -6782,6 +6876,7 @@ declare module "zinc" {
     export { default as FilterContainer } from "components/filter-container/index";
     export { default as Reveal } from "components/reveal/index";
     export { default as AudioSelect } from "components/audio-select/index";
+    export { default as Translations } from "components/translations/index";
     export { default as ZincElement } from "internal/zinc-element";
     export * from "utilities/on";
     export * from "utilities/query";