@nova-design-system/nova-webcomponents 3.0.0-beta.30 → 3.0.0-beta.33

package/dist/collection/components/nv-datagridcolumn/nv-datagridcolumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-datagridcolumn.js","sourceRoot":"","sources":["../../../src/components/nv-datagridcolumn/nv-datagridcolumn.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,gBAAgB;;;;;IAgB3B,uBAAuB;IACvB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,8DAAa,CACV,CACA,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n/**\n * @slot default - Use this slot to insert HTML into the data grid column.\n */\n@Component({\n  tag: 'nv-datagridcolumn',\n  styleUrl: 'nv-datagridcolumn.scss',\n  shadow: false,\n})\nexport class NvDatagridcolumn {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Defines the header of the column.\n   */\n  @Prop()\n  readonly header: string;\n\n  /**\n   * Defines the accessor of the column.\n   */\n  @Prop()\n  readonly accessor: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <th>\n          <slot></slot>\n        </th>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n  /****************************************************************************/\n}\n"]}
+{"version":3,"file":"nv-datagridcolumn.js","sourceRoot":"","sources":["../../../src/components/nv-datagridcolumn/nv-datagridcolumn.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,gBAAgB;IAgB3B,uBAAuB;IACvB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,8DAAa,CACV,CACA,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n/**\n * @slot default - Use this slot to insert HTML into the data grid column.\n */\n@Component({\n  tag: 'nv-datagridcolumn',\n  styleUrl: 'nv-datagridcolumn.scss',\n  shadow: false,\n})\nexport class NvDatagridcolumn {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Defines the header of the column.\n   */\n  @Prop()\n  readonly header: string;\n\n  /**\n   * Defines the accessor of the column.\n   */\n  @Prop()\n  readonly accessor: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <th>\n          <slot></slot>\n        </th>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n  /****************************************************************************/\n}\n"]}

package/dist/collection/components/nv-datagriddatacell/nv-datagriddatacell.js

@@ -3,14 +3,11 @@ import { Host, h } from "@stencil/core";
  * @slot default - Use this slot to insert HTML into the data grid data cell.
  */
 export class NvDatagriddatacell {
-    constructor() {
-        this.accessor = undefined;
-    }
     //#endregion PROPERTIES
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'bf3caf31ee31fdba6254c1907883474a84610dda' }, h("td", { key: '709febb6ab666afd3841c7d0086f889309f31fbd' }, h("slot", { key: 'c309eda6f57527a3ca1bba68983521121944a156' }))));
+        return (h(Host, { key: 'dbdf7fa0353e84e702ddd082fe466f89492f48e1' }, h("td", { key: '3d3d8ae038cb5a6bf3404fe7178003529790fc10' }, h("slot", { key: 'b8585f6517d053f90be59fe7e492771114911496' }))));
     }
     static get is() { return "nv-datagriddatacell"; }
     static get originalStyleUrls() {
@@ -42,6 +39,8 @@ export class NvDatagriddatacell {
                         }],
                     "text": "Contains a string that identifies a cell in a table. It is used with the\nheaders attribute to associate data cells with header cells in complex tables."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "accessor",
                 "reflect": false
             }

package/dist/collection/components/nv-datagriddatacell/nv-datagriddatacell.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-datagriddatacell.js","sourceRoot":"","sources":["../../../src/components/nv-datagriddatacell/nv-datagriddatacell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,kBAAkB;;;;IAY7B,uBAAuB;IACvB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,8DAAa,CACV,CACA,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n/**\n * @slot default - Use this slot to insert HTML into the data grid data cell.\n */\n@Component({\n  tag: 'nv-datagriddatacell',\n  styleUrl: 'nv-datagriddatacell.scss',\n  shadow: false,\n})\nexport class NvDatagriddatacell {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Contains a string that identifies a cell in a table. It is used with the\n   * headers attribute to associate data cells with header cells in complex tables.\n   * @example 'col1'\n   */\n  @Prop()\n  readonly accessor: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <td>\n          <slot></slot>\n        </td>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n  /****************************************************************************/\n}\n"]}
+{"version":3,"file":"nv-datagriddatacell.js","sourceRoot":"","sources":["../../../src/components/nv-datagriddatacell/nv-datagriddatacell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAEzD;;GAEG;AAMH,MAAM,OAAO,kBAAkB;IAY7B,uBAAuB;IACvB,8EAA8E;IAC9E,gBAAgB;IAEhB,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH;gBACE,8DAAa,CACV,CACA,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n/**\n * @slot default - Use this slot to insert HTML into the data grid data cell.\n */\n@Component({\n  tag: 'nv-datagriddatacell',\n  styleUrl: 'nv-datagriddatacell.scss',\n  shadow: false,\n})\nexport class NvDatagriddatacell {\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Contains a string that identifies a cell in a table. It is used with the\n   * headers attribute to associate data cells with header cells in complex tables.\n   * @example 'col1'\n   */\n  @Prop()\n  readonly accessor: string;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host>\n        <td>\n          <slot></slot>\n        </td>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n  /****************************************************************************/\n}\n"]}

package/dist/collection/components/nv-datagridhead/nv-datagridhead.js

@@ -6,7 +6,7 @@ export class NvDatagridhead {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: '272ab6e598f1edfc53fd99372acd64c3834c0fd0' }, h("thead", { key: '66d5e24d5d0757be7b0190bc4c156e476e0f748e' }, h("slot", { key: 'b41ac2580003d1df53595d66837ed51d597bee8c' }))));
+        return (h(Host, { key: 'e56a8e78a9034ce2cd2eda97ee074662b533ace9' }, h("thead", { key: '0a32742beaf23f214bbf3f03f9de5bab748573cd' }, h("slot", { key: '0beabbfbadee2af0caa07f31fb681d24fe6da240' }))));
     }
     static get is() { return "nv-datagridhead"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-datagridrow/nv-datagridrow.js

@@ -6,7 +6,7 @@ export class NvDatagridrow {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'f136ccd96f48d5743cc1c08c26029421af4ab2c0' }, h("tr", { key: '21787f1823a778ab6433cbcc5bff0596e2257485' }, h("slot", { key: 'edfc2d36e247097eaddfd694bf9de44f001a8219' }))));
+        return (h(Host, { key: '99a83706b411732ff2d2443794ab61bdc0a95c7e' }, h("tr", { key: 'd64ab8c5d39236cdbe4950c7d891f3aca9c696dc' }, h("slot", { key: '696117c1e59fe60e0d3de5928658ba479cfeb472' }))));
     }
     static get is() { return "nv-datagridrow"; }
     static get originalStyleUrls() {

package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.js

@@ -10,22 +10,53 @@ import { v4 as uuidv4 } from "uuid";
  */
 export class NvFieldcheckbox {
     constructor() {
-        this.message = undefined;
-        this.validation = undefined;
+        /**
+         * When true, the label will be placed before the checkbox.
+         * @deprecated Use `labelPlacement = end` instead.
+         * */
         this.labelBefore = false;
+        //#endregion DEPRECATED
+        /****************************************************************************/
+        //#region PROPERTIES
+        /**
+         * Sets the ID for the radio button’s input element and the for attribute of
+         * the associated label. If no ID is provided, a random one will be
+         * automatically generated to ensure unique identification, facilitating
+         * proper label association and accessibility.
+         */
         this.inputId = uuidv4();
-        this.name = undefined;
-        this.value = undefined;
-        this.label = undefined;
-        this.labelPlacement = undefined;
+        /**
+         * Hides the label visually while still keeping it available for screen
+         * readers.
+         */
         this.hideLabel = false;
-        this.description = undefined;
+        /**
+         * Signals that there is an error associated with the checkbox, which can
+         * trigger visual cues.
+         */
         this.error = false;
-        this.errorDescription = undefined;
+        /**
+         * Indicates whether the checkbox is checked or not.
+         */
         this.checked = false;
+        /**
+         * Indicates whether the checkbox is in an indeterminate state, typically used
+         * for hierarchical checkboxes.
+         */
         this.indeterminate = false;
+        /**
+         * Disables the checkbox, preventing user interaction.
+         */
         this.disabled = false;
+        /**
+         * Sets the checkbox to read-only, preventing user changes but still allowing
+         * focus and selection of text.
+         */
         this.readonly = false;
+        /**
+         * Marks the checkbox as required, indicating that it must be checked for
+         * form submission.
+         */
         this.required = false;
     }
     componentWillRender() {
@@ -71,13 +102,13 @@ export class NvFieldcheckbox {
     /****************************************************************************/
     //#region RENDER
     render() {
-        return (h(Host, { key: 'c87c2b3e3a4b81c9d6eb6c3784919a5fcb78e38b', class: clsx(this.labelPlacement === 'before' && 'label-placement-before', this.error && 'error') }, h("div", { key: '8e43a91fec01b02dfa6b27408e1c1fd252558014', class: "input-container" }, h("input", { key: 'bffbfc1ac879fb70e1c7b436c3a9845150b78bca', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly && !this.required, required: this.required, indeterminate: this.indeterminate, ref: el => {
+        return (h(Host, { key: 'dee6fd99a2e97591189c8a6bdce3c8909b4ceb97', class: clsx(this.labelPlacement === 'before' && 'label-placement-before', this.error && 'error') }, h("div", { key: 'dd6ab7f4cddd11c89cc15249290fe43d83a669ab', class: "input-container" }, h("input", { key: '1132052e8f369f16d3a0ce4698b72644975886f8', type: "checkbox", id: this.inputId, name: this.name, autocomplete: "off", value: this.value, checked: Boolean(this.checked), disabled: this.disabled || this.readonly, readonly: this.readonly && !this.required, required: this.required, indeterminate: this.indeterminate, ref: el => {
                 if (el) {
                     el.indeterminate = this.indeterminate;
                 }
-            } }), h("span", { key: 'b100feee33694f72c59496f09f5ecbbf9358d7c6', class: "icon" }, this.checked && !this.indeterminate && (h("slot", { key: 'a5f5159aff04c111e4b944123686f00f817ecb1e', name: "checked-icon" }, h("svg", { key: '26a750b600fa0857ec9adf17f9d4dcd9ce0e2aad', xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" }, h("path", { key: 'ddf0155de05297d7ec966bdaf9633ceb1ee413d7', d: "M11.6667 3.5L5.25004 9.91667L2.33337 7", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.indeterminate && (h("slot", { key: 'e64681ce70326348083402f7996eaf6134aaca3e', name: "indeterminate-icon" }, h("svg", { key: '9cfcd8118bb6f208278614711fd726fe29c9070a', class: "indeterminate-svg", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none" }, h("path", { key: '8d88be8c4bd195982bf0024e4f67f30601ddfb80', d: "M2.9165 7H11.0832", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: '061d18d589ef2a8efd0fb73f70d5c0a6013c497d', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: '129013f8e60d1aaae82b97321c4cc26ab6229bbb', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: 'e134c0683e4c4c410c78d45f3537d8ed1491c67e', name: "label" }, this.label))), (this.description ||
-            this.el.querySelector('[slot="description"]')) && (h("div", { key: '78166f4fb7d1e5dc20f13ce5b4ca567a90862493', class: "description" }, h("slot", { key: '6bced15913e4a22371520818343de5598c5a5e6d', name: "description" }, this.description))), (this.errorDescription ||
-            this.el.querySelector('[slot="error-description"]')) && (h("div", { key: '88f4ceaef2412ce5f4bb08b19485fc27d9842792', hidden: !this.error, class: "error-description" }, h("slot", { key: '96a581ce5d0e66416d24bf52219a87d3c39457d8', name: "error-description" }, this.errorDescription))))));
+            } }), h("span", { key: 'ac87b7d83e5731da6ce8f9990a1d55bd247cb750', class: "icon" }, this.checked && !this.indeterminate && (h("slot", { key: '911e69045129dc8755fea438570858f338a18ad3', name: "checked-icon" }, h("svg", { key: 'de2e547ac9ab00c52ee9c924fdb4e24cf0321158', xmlns: "http://www.w3.org/2000/svg", width: "14", height: "14", viewBox: "0 0 14 14", fill: "none" }, h("path", { key: '10dc26b32951b18a6bd29482349894bf1ca87bd8', d: "M11.6667 3.5L5.25004 9.91667L2.33337 7", "stroke-linecap": "round", "stroke-linejoin": "round" })))), this.indeterminate && (h("slot", { key: '7e957be646aa6a96f94e0cf70b5ef88b8037e07e', name: "indeterminate-icon" }, h("svg", { key: 'd132aabc77f0dcf5c67377a60004b72307cf61ba', class: "indeterminate-svg", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none" }, h("path", { key: '353c950a9d8d14c32e276e393c9314374d10337f', d: "M2.9165 7H11.0832", "stroke-linecap": "round", "stroke-linejoin": "round" })))))), h("div", { key: 'a14fc39e16a9dcee74e722a361fcc8df63fad5d6', class: "text-container" }, (this.label || this.el.querySelector('[slot="label"]')) && (h("label", { key: '13a9fee6f1c4aea8735eca27f36944d6c26cf7f2', htmlFor: this.inputId, class: clsx(this.hideLabel && 'visually-hidden') }, h("slot", { key: 'dbbce25b8f65d2b12d10e419f94ae56ef2d0c355', name: "label" }, this.label))), (this.description ||
+            this.el.querySelector('[slot="description"]')) && (h("div", { key: '3647cdaa6a4ec2cacab7b2c1fe731e3454746648', class: "description" }, h("slot", { key: '19dff40045f22c6403029731a0a628455b831c5c', name: "description" }, this.description))), (this.errorDescription ||
+            this.el.querySelector('[slot="error-description"]')) && (h("div", { key: 'dd78ae62d1a1cd6c2a9b41d32740321cb1f36f2a', hidden: !this.error, class: "error-description" }, h("slot", { key: '1e4d1c10387aaea37c87111c43c84cd204ca1619', name: "error-description" }, this.errorDescription))))));
     }
     static get is() { return "nv-fieldcheckbox"; }
     static get originalStyleUrls() {
@@ -109,6 +140,8 @@ export class NvFieldcheckbox {
                         }],
                     "text": "Message define a 'hint ' message for the Field."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "message",
                 "reflect": false
             },
@@ -129,6 +162,8 @@ export class NvFieldcheckbox {
                         }],
                     "text": "The text for the validation message."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "validation",
                 "reflect": false
             },
@@ -149,6 +184,8 @@ export class NvFieldcheckbox {
                         }],
                     "text": "When true, the label will be placed before the checkbox."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "label-before",
                 "reflect": false,
                 "defaultValue": "false"
@@ -167,6 +204,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Sets the ID for the radio button\u2019s input element and the for attribute of\nthe associated label. If no ID is provided, a random one will be\nautomatically generated to ensure unique identification, facilitating\nproper label association and accessibility."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "input-id",
                 "reflect": true,
                 "defaultValue": "uuidv4()"
@@ -185,6 +224,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "The name attribute for the checkbox input, used to reference the form data\nafter submission."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "name",
                 "reflect": true
             },
@@ -202,6 +243,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "The value attribute of the checkbox input, representing the value sent on\nform submission when the checkbox is checked. When the form is submitted,\nthe data will consist of a name=value pair."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "value",
                 "reflect": true
             },
@@ -219,6 +262,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "The label displayed next to the checkbox."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "label",
                 "reflect": true
             },
@@ -242,6 +287,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Determines the position of the label relative to the checkbox, either\n'start' (before) or 'end' (after)."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "label-placement",
                 "reflect": true
             },
@@ -259,6 +306,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Hides the label visually while still keeping it available for screen\nreaders."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "hide-label",
                 "reflect": true,
                 "defaultValue": "false"
@@ -277,6 +326,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "A description providing additional context or information about the\ncheckbox."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "description",
                 "reflect": true
             },
@@ -294,6 +345,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Signals that there is an error associated with the checkbox, which can\ntrigger visual cues."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "error",
                 "reflect": true,
                 "defaultValue": "false"
@@ -312,6 +365,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "A description that appears when there is an error related to the checkbox."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "error-description",
                 "reflect": true
             },
@@ -329,6 +384,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Indicates whether the checkbox is checked or not."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "checked",
                 "reflect": true,
                 "defaultValue": "false"
@@ -347,6 +404,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Indicates whether the checkbox is in an indeterminate state, typically used\nfor hierarchical checkboxes."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "indeterminate",
                 "reflect": true,
                 "defaultValue": "false"
@@ -365,6 +424,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Disables the checkbox, preventing user interaction."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "disabled",
                 "reflect": true,
                 "defaultValue": "false"
@@ -383,6 +444,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Sets the checkbox to read-only, preventing user changes but still allowing\nfocus and selection of text."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "readonly",
                 "reflect": true,
                 "defaultValue": "false"
@@ -401,6 +464,8 @@ export class NvFieldcheckbox {
                     "tags": [],
                     "text": "Marks the checkbox as required, indicating that it must be checked for\nform submission."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "required",
                 "reflect": true,
                 "defaultValue": "false"

package/dist/collection/components/nv-fieldcheckbox/nv-fieldcheckbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-fieldcheckbox.js","sourceRoot":"","sources":["../../../src/components/nv-fieldcheckbox/nv-fieldcheckbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type FieldLabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n * @slot checked-icon - Content to be placed as the checked icon, will override the checkedIcon prop.\n * @slot indeterminate-icon - Content to be placed as the indeterminate icon, will override the indeterminateIcon prop.\n */\n@Component({\n  tag: 'nv-fieldcheckbox',\n  styleUrl: 'nv-fieldcheckbox.scss',\n  shadow: false,\n})\nexport class NvFieldcheckbox {\n  @Element() el!: HTMLNvFieldcheckboxElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message define a 'hint ' message for the Field.\n   * @deprecated Use `description` instead.\n   * */\n  @Prop()\n  readonly message?: string;\n\n  /**\n   * The text for the validation message.\n   * @deprecated Use `errorDescription` instead.\n   * */\n  @Prop()\n  readonly validation?: string;\n\n  /**\n   * When true, the label will be placed before the checkbox.\n   * @deprecated Use `labelPlacement = end` instead.\n   * */\n  @Prop()\n  readonly labelBefore?: boolean = false;\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.labelBefore) {\n      this.labelPlacement = 'before';\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n    }\n  }\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the checkbox input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the checkbox input, representing the value sent on\n   * form submission when the checkbox is checked. When the form is submitted,\n   * the data will consist of a name=value pair.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed next to the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the checkbox, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true, mutable: true })\n  labelPlacement: `${FieldLabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description?: string;\n\n  /**\n   * Signals that there is an error associated with the checkbox, which can\n   * trigger visual cues.\n   */\n  @Prop({ reflect: true })\n  readonly error: boolean = false;\n\n  /**\n   * A description that appears when there is an error related to the checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription?: string;\n\n  /**\n   * Indicates whether the checkbox is checked or not.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * Indicates whether the checkbox is in an indeterminate state, typically used\n   * for hierarchical checkboxes.\n   */\n  @Prop({ reflect: true, mutable: true })\n  indeterminate: boolean = false;\n\n  /**\n   * Disables the checkbox, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the checkbox to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the checkbox as required, indicating that it must be checked for\n   * form submission.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the checkbox input element and updates the\n   * checked state.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      if (this.indeterminate) {\n        this.indeterminate = false;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n          this.error && 'error',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly && !this.required}\n            required={this.required}\n            indeterminate={this.indeterminate}\n            ref={el => {\n              if (el) {\n                el.indeterminate = this.indeterminate;\n              }\n            }}\n          />\n          <span class=\"icon\">\n            {this.checked && !this.indeterminate && (\n              <slot name=\"checked-icon\">\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"14\"\n                  height=\"14\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M11.6667 3.5L5.25004 9.91667L2.33337 7\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n            {this.indeterminate && (\n              <slot name=\"indeterminate-icon\">\n                <svg\n                  class=\"indeterminate-svg\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M2.9165 7H11.0832\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n          </span>\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\n\n          {(this.description ||\n            this.el.querySelector('[slot=\"description\"]')) && (\n            <div class=\"description\">\n              <slot name=\"description\">{this.description}</slot>\n            </div>\n          )}\n\n          {(this.errorDescription ||\n            this.el.querySelector('[slot=\"error-description\"]')) && (\n            <div hidden={!this.error} class=\"error-description\">\n              <slot name=\"error-description\">{this.errorDescription}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}
+{"version":3,"file":"nv-fieldcheckbox.js","sourceRoot":"","sources":["../../../src/components/nv-fieldcheckbox/nv-fieldcheckbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Watch,\n  Event,\n  EventEmitter,\n  Listen,\n} from '@stencil/core';\nimport clsx from 'clsx';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { type FieldLabelPlacement } from '../../utils/constants';\n\n/**\n * @slot label - Content to be placed as the label, will override the label prop.\n * @slot description - Content to be placed as the description, will override the description prop.\n * @slot error-description - Content to be placed as the error description, will override the errorDescription prop.\n * @slot checked-icon - Content to be placed as the checked icon, will override the checkedIcon prop.\n * @slot indeterminate-icon - Content to be placed as the indeterminate icon, will override the indeterminateIcon prop.\n */\n@Component({\n  tag: 'nv-fieldcheckbox',\n  styleUrl: 'nv-fieldcheckbox.scss',\n  shadow: false,\n})\nexport class NvFieldcheckbox {\n  @Element() el!: HTMLNvFieldcheckboxElement;\n\n  /****************************************************************************/\n  //#region DEPRECATED\n\n  /**\n   * Message define a 'hint ' message for the Field.\n   * @deprecated Use `description` instead.\n   * */\n  @Prop()\n  readonly message?: string;\n\n  /**\n   * The text for the validation message.\n   * @deprecated Use `errorDescription` instead.\n   * */\n  @Prop()\n  readonly validation?: string;\n\n  /**\n   * When true, the label will be placed before the checkbox.\n   * @deprecated Use `labelPlacement = end` instead.\n   * */\n  @Prop()\n  readonly labelBefore?: boolean = false;\n\n  componentWillRender() {\n    if (this.message) {\n      this.description = this.message;\n    }\n\n    if (this.labelBefore) {\n      this.labelPlacement = 'before';\n    }\n\n    if (this.validation) {\n      this.errorDescription = this.validation;\n    }\n  }\n\n  //#endregion DEPRECATED\n  /****************************************************************************/\n  //#region PROPERTIES\n\n  /**\n   * Sets the ID for the radio button’s input element and the for attribute of\n   * the associated label. If no ID is provided, a random one will be\n   * automatically generated to ensure unique identification, facilitating\n   * proper label association and accessibility.\n   */\n  @Prop({ reflect: true })\n  readonly inputId: string = uuidv4();\n\n  /**\n   * The name attribute for the checkbox input, used to reference the form data\n   * after submission.\n   */\n  @Prop({ reflect: true })\n  readonly name?: string;\n\n  /**\n   * The value attribute of the checkbox input, representing the value sent on\n   * form submission when the checkbox is checked. When the form is submitted,\n   * the data will consist of a name=value pair.\n   */\n  @Prop({ reflect: true })\n  readonly value?: string;\n\n  /**\n   * The label displayed next to the checkbox.\n   */\n  @Prop({ reflect: true })\n  readonly label?: string;\n\n  /**\n   * Determines the position of the label relative to the checkbox, either\n   * 'start' (before) or 'end' (after).\n   */\n  @Prop({ reflect: true, mutable: true })\n  labelPlacement: `${FieldLabelPlacement}`;\n\n  /**\n   * Hides the label visually while still keeping it available for screen\n   * readers.\n   */\n  @Prop({ reflect: true })\n  readonly hideLabel: boolean = false;\n\n  /**\n   * A description providing additional context or information about the\n   * checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  description?: string;\n\n  /**\n   * Signals that there is an error associated with the checkbox, which can\n   * trigger visual cues.\n   */\n  @Prop({ reflect: true })\n  readonly error: boolean = false;\n\n  /**\n   * A description that appears when there is an error related to the checkbox.\n   */\n  @Prop({ reflect: true, mutable: true })\n  errorDescription?: string;\n\n  /**\n   * Indicates whether the checkbox is checked or not.\n   */\n  @Prop({ reflect: true, mutable: true })\n  checked: boolean = false;\n\n  /**\n   * Indicates whether the checkbox is in an indeterminate state, typically used\n   * for hierarchical checkboxes.\n   */\n  @Prop({ reflect: true, mutable: true })\n  indeterminate: boolean = false;\n\n  /**\n   * Disables the checkbox, preventing user interaction.\n   */\n  @Prop({ reflect: true })\n  readonly disabled: boolean = false;\n\n  /**\n   * Sets the checkbox to read-only, preventing user changes but still allowing\n   * focus and selection of text.\n   */\n  @Prop({ reflect: true })\n  readonly readonly: boolean = false;\n\n  /**\n   * Marks the checkbox as required, indicating that it must be checked for\n   * form submission.\n   */\n  @Prop({ reflect: true })\n  readonly required: boolean = false;\n\n  //#endregion PROPERTIES\n  /****************************************************************************/\n  //#region EVENTS\n\n  /**\n   * Emits when the checked state changes.\n   * @bind checked\n   */\n  @Event()\n  checkedChanged: EventEmitter<boolean>;\n\n  //#endregion EVENTS\n  /****************************************************************************/\n  //#region WATCHERS\n\n  /**\n   * Watches for changes to the checked state and emits the new value.\n   * @param {boolean} checked - The new value of the checked state.\n   */\n  @Watch('checked')\n  onCheckedChanged(checked: boolean) {\n    this.checkedChanged.emit(checked);\n  }\n\n  /**\n   * Listens for the change event on the checkbox input element and updates the\n   * checked state.\n   * @param {Event} event - The change event.\n   */\n  @Listen('change')\n  handleChange(event: Event) {\n    const target = event.target as HTMLInputElement;\n\n    if (target.type === 'checkbox' && target.id === this.inputId) {\n      if (this.readonly || this.disabled) {\n        event.preventDefault();\n        return;\n      }\n\n      if (this.indeterminate) {\n        this.indeterminate = false;\n      }\n\n      this.checked = target.checked;\n    }\n  }\n\n  //#endregion WATCHERS\n  /****************************************************************************/\n  //#region RENDER\n\n  render() {\n    return (\n      <Host\n        class={clsx(\n          this.labelPlacement === 'before' && 'label-placement-before',\n          this.error && 'error',\n        )}\n      >\n        <div class=\"input-container\">\n          <input\n            type=\"checkbox\"\n            id={this.inputId}\n            name={this.name}\n            autocomplete=\"off\"\n            value={this.value}\n            checked={Boolean(this.checked)}\n            disabled={this.disabled || this.readonly}\n            readonly={this.readonly && !this.required}\n            required={this.required}\n            indeterminate={this.indeterminate}\n            ref={el => {\n              if (el) {\n                el.indeterminate = this.indeterminate;\n              }\n            }}\n          />\n          <span class=\"icon\">\n            {this.checked && !this.indeterminate && (\n              <slot name=\"checked-icon\">\n                <svg\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  width=\"14\"\n                  height=\"14\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M11.6667 3.5L5.25004 9.91667L2.33337 7\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n            {this.indeterminate && (\n              <slot name=\"indeterminate-icon\">\n                <svg\n                  class=\"indeterminate-svg\"\n                  xmlns=\"http://www.w3.org/2000/svg\"\n                  viewBox=\"0 0 14 14\"\n                  fill=\"none\"\n                >\n                  <path\n                    d=\"M2.9165 7H11.0832\"\n                    stroke-linecap=\"round\"\n                    stroke-linejoin=\"round\"\n                  />\n                </svg>\n              </slot>\n            )}\n          </span>\n        </div>\n\n        <div class=\"text-container\">\n          {(this.label || this.el.querySelector('[slot=\"label\"]')) && (\n            <label\n              htmlFor={this.inputId}\n              class={clsx(this.hideLabel && 'visually-hidden')}\n            >\n              <slot name=\"label\">{this.label}</slot>\n            </label>\n          )}\n\n          {(this.description ||\n            this.el.querySelector('[slot=\"description\"]')) && (\n            <div class=\"description\">\n              <slot name=\"description\">{this.description}</slot>\n            </div>\n          )}\n\n          {(this.errorDescription ||\n            this.el.querySelector('[slot=\"error-description\"]')) && (\n            <div hidden={!this.error} class=\"error-description\">\n              <slot name=\"error-description\">{this.errorDescription}</slot>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n\n  //#endregion RENDER\n}\n"]}

package/dist/collection/components/nv-fielddropdown/nv-fielddropdown.css

@@ -49,6 +49,20 @@ nv-fielddropdown nv-popover {
   width: 100%;
   display: block;
 }
+nv-fielddropdown nv-popover [data-scope=popover] {
+  padding: var(--list-custom-padding);
+  background-color: var(--components-list-custom-background);
+  border: 1px solid var(--components-list-custom-border);
+  width: 100%;
+}
+nv-fielddropdown nv-popover [data-scope=popover] hr {
+  color: var(--components-list-custom-separator);
+}
+nv-fielddropdown nv-popover [slot=content] {
+  gap: var(--list-custom-gap-y);
+  display: flex;
+  flex-direction: column;
+}
 nv-fielddropdown .input-wrapper {
   display: flex;
   flex-wrap: wrap;
@@ -184,8 +198,9 @@ nv-fielddropdown .error-description {
 }
 nv-fielddropdown hr {
   border: none;
-  border-top: 1px solid var(--dropdown-divider-color, #ccc);
-  margin: 0.5rem 0;
+  height: 1px;
+  background-color: var(--components-list-custom-separator);
+  margin: 0;
 }
 
 .input-container.focus-within,

package/dist/collection/components/nv-fielddropdown/nv-fielddropdown.docs.js

@@ -81,25 +81,14 @@ const NvFielddropdownDocs = {
             },
             template: (h("nv-fielddropdown", { "data-storybook-args": true }, h("ul", { slot: "content" }, h("nv-fielddropdownitem", { label: "Item 1" })))),
         },
-        // {
-        //   name: 'PreSelected',
-        //   template: (
-        //     <nv-fielddropdown data-storybook-args filterable>
-        //       <ul slot="content">
-        //         <nv-fielddropdownitem
-        //           label="Item 1"
-        //           selected
-        //         ></nv-fielddropdownitem>
-        //         <nv-fielddropdownitem label="Item 2"></nv-fielddropdownitem>
-        //         <nv-fielddropdownitem label="Item 3"></nv-fielddropdownitem>
-        //         <nv-fielddropdownitem
-        //           label="Item disabled"
-        //           disabled
-        //         ></nv-fielddropdownitem>
-        //       </ul>
-        //     </nv-fielddropdown>
-        //   ),
-        // },
+        {
+            name: 'PreSelected',
+            args: {
+                label: 'Dropdown with Pre-selected Value',
+                value: 'Item 2',
+            },
+            template: (h("nv-fielddropdown", { "data-storybook-args": true, filterable: true }, h("ul", { slot: "content" }, h("nv-fielddropdownitem", { label: "Item 1", selected: true }), h("nv-fielddropdownitem", { label: "Item 2" }), h("nv-fielddropdownitem", { label: "Item 3" }), h("nv-fielddropdownitem", { label: "Item disabled", disabled: true })))),
+        },
         {
             name: 'DefaultSlot',
             args: {

package/dist/collection/components/nv-fielddropdown/nv-fielddropdown.docs.js.map

@@ -1 +1 @@
-{"version":3,"file":"nv-fielddropdown.docs.js","sourceRoot":"","sources":["../../../src/components/nv-fielddropdown/nv-fielddropdown.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\nimport { nameof } from '../../utils/class.utils';\n\nconst NvFielddropdownDocs: NovaDocs<Components.NvFielddropdown> = {\n  component: 'nv-fielddropdown',\n  subcomponents: ['nv-fielddropdownitem', 'nv-avatar', 'nv-icon'],\n  stories: [\n    {\n      name: 'Default',\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.filterable),\n      args: {\n        label: 'Dropdown Label',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.label),\n      args: {\n        label: 'filterable Dropdown',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.description),\n      args: {\n        label: 'Dropdown with Description',\n        description: 'Description will show here',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.placeholder),\n      args: {\n        label: 'Dropdown with Placeholder',\n        placeholder: 'Select an option...',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.disabled),\n      args: {\n        label: 'Disabled Dropdown',\n        disabled: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.required),\n      args: {\n        label: 'Required Dropdown',\n        required: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'Dividers',\n      args: {\n        label: 'Dropdown with dividers',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <hr />\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <hr />\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.error),\n      args: {\n        label: 'Dropdown with Error',\n        error: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.errorDescription),\n      args: {\n        label: 'Dropdown with Error Description',\n        description: 'Ensure you select an option.',\n        error: true,\n        errorDescription: 'This dropdown has an error.',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    // {\n    //   name: 'PreSelected',\n    //   template: (\n    //     <nv-fielddropdown data-storybook-args filterable>\n    //       <ul slot=\"content\">\n    //         <nv-fielddropdownitem\n    //           label=\"Item 1\"\n    //           selected\n    //         ></nv-fielddropdownitem>\n    //         <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n    //         <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n    //         <nv-fielddropdownitem\n    //           label=\"Item disabled\"\n    //           disabled\n    //         ></nv-fielddropdownitem>\n    //       </ul>\n    //     </nv-fielddropdown>\n    //   ),\n    // },\n    {\n      name: 'DefaultSlot',\n      args: {\n        label: 'DefaultSlot Dropdown',\n        description: 'This is a DefaultSlot dropdown.',\n        placeholder: 'Select an option...',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"AB\">\n              <nv-avatar initials=\"AB\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"CD\">\n              <nv-avatar initials=\"CD\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"EF\">\n              <nv-avatar initials=\"EF\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'DefaultSlotFiltereable',\n      args: {\n        label: 'Default Slot Filtereable Dropdown',\n        description: 'This is a Default Slot Filtereable dropdown.',\n        placeholder: 'Select an option...',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"AB\">\n              <nv-avatar initials=\"AB\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"CD\">\n              <nv-avatar initials=\"CD\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"EF\">\n              <nv-avatar initials=\"EF\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.open),\n      args: {\n        label: 'Dropdown Opened',\n        open: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.value),\n      args: {\n        label: 'Dropdown with Pre-selected Value',\n        value: 'Item 2',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.readonly),\n      args: {\n        label: 'Readonly Dropdown',\n        readonly: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.emptyresult),\n      args: {\n        label: 'Dropdown with Empty Result Text',\n        filterable: true,\n        open: true,\n        value: 'search for a inexistent item',\n        emptyresult: 'No items found',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n  ],\n};\n\nexport default NvFielddropdownDocs;\n"]}
+{"version":3,"file":"nv-fielddropdown.docs.js","sourceRoot":"","sources":["../../../src/components/nv-fielddropdown/nv-fielddropdown.docs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { h } from '@stencil/core';\nimport type { NovaDocs } from '../../nova-docs';\nimport { Components } from '../../components';\nimport { nameof } from '../../utils/class.utils';\n\nconst NvFielddropdownDocs: NovaDocs<Components.NvFielddropdown> = {\n  component: 'nv-fielddropdown',\n  subcomponents: ['nv-fielddropdownitem', 'nv-avatar', 'nv-icon'],\n  stories: [\n    {\n      name: 'Default',\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.filterable),\n      args: {\n        label: 'Dropdown Label',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.label),\n      args: {\n        label: 'filterable Dropdown',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.description),\n      args: {\n        label: 'Dropdown with Description',\n        description: 'Description will show here',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.placeholder),\n      args: {\n        label: 'Dropdown with Placeholder',\n        placeholder: 'Select an option...',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.disabled),\n      args: {\n        label: 'Disabled Dropdown',\n        disabled: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.required),\n      args: {\n        label: 'Required Dropdown',\n        required: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'Dividers',\n      args: {\n        label: 'Dropdown with dividers',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <hr />\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <hr />\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.error),\n      args: {\n        label: 'Dropdown with Error',\n        error: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.errorDescription),\n      args: {\n        label: 'Dropdown with Error Description',\n        description: 'Ensure you select an option.',\n        error: true,\n        errorDescription: 'This dropdown has an error.',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'PreSelected',\n      args: {\n        label: 'Dropdown with Pre-selected Value',\n        value: 'Item 2',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args filterable>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem\n              label=\"Item 1\"\n              selected\n            ></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'DefaultSlot',\n      args: {\n        label: 'DefaultSlot Dropdown',\n        description: 'This is a DefaultSlot dropdown.',\n        placeholder: 'Select an option...',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"AB\">\n              <nv-avatar initials=\"AB\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"CD\">\n              <nv-avatar initials=\"CD\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"EF\">\n              <nv-avatar initials=\"EF\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: 'DefaultSlotFiltereable',\n      args: {\n        label: 'Default Slot Filtereable Dropdown',\n        description: 'This is a Default Slot Filtereable dropdown.',\n        placeholder: 'Select an option...',\n        filterable: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"AB\">\n              <nv-avatar initials=\"AB\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"CD\">\n              <nv-avatar initials=\"CD\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n            <nv-fielddropdownitem class=\"flex gap-2\" value=\"EF\">\n              <nv-avatar initials=\"EF\" size=\"xs\"></nv-avatar>\n              <span>Custom Item Text</span>\n            </nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.open),\n      args: {\n        label: 'Dropdown Opened',\n        open: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.value),\n      args: {\n        label: 'Dropdown with Pre-selected Value',\n        value: 'Item 2',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem\n              label=\"Item disabled\"\n              disabled\n            ></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.readonly),\n      args: {\n        label: 'Readonly Dropdown',\n        readonly: true,\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 2\"></nv-fielddropdownitem>\n            <nv-fielddropdownitem label=\"Item 3\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n    {\n      name: nameof<Components.NvFielddropdown>(x => x.emptyresult),\n      args: {\n        label: 'Dropdown with Empty Result Text',\n        filterable: true,\n        open: true,\n        value: 'search for a inexistent item',\n        emptyresult: 'No items found',\n      },\n      template: (\n        <nv-fielddropdown data-storybook-args>\n          <ul slot=\"content\">\n            <nv-fielddropdownitem label=\"Item 1\"></nv-fielddropdownitem>\n          </ul>\n        </nv-fielddropdown>\n      ),\n    },\n  ],\n};\n\nexport default NvFielddropdownDocs;\n"]}