@nova-design-system/nova-webcomponents 3.0.0-beta.24 → 3.0.0-beta.27

package/dist/docs.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2024-12-18T09:31:28",
+  "timestamp": "2024-12-20T15:58:18",
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.22.1",
+    "version": "4.22.3",
     "typescriptVersion": "5.5.4"
   },
   "components": [
@@ -1804,6 +1804,926 @@
       "dependencies": [],
       "dependencyGraph": {}
     },
+    {
+      "filePath": "src/components/nv-fielddropdown/nv-fielddropdown.tsx",
+      "encapsulation": "none",
+      "tag": "nv-fielddropdown",
+      "readme": "# nv-fielddropdown\n\nThe 'nv-fielddropdown' is a form component that combines a text input field with a dropdown popover. It allows users to select an item from a list of options. Similar to a combobox, the dropdown can be filtered, and the selected item is displayed in the input field. The component can be used in forms, search bars, and more.\n\n",
+      "docs": "The 'nv-fielddropdown' is a form component that combines a text input field with a dropdown popover. It allows users to select an item from a list of options. Similar to a combobox, the dropdown can be filtered, and the selected item is displayed in the input field. The component can be used in forms, search bars, and more.",
+      "docsTags": [
+        {
+          "name": "slot",
+          "text": "content - Use a <ul></ul> tag for the slot, and place <nv-dropdownitem> elements inside."
+        },
+        {
+          "name": "slot",
+          "text": "leading-input - Content to be placed before the input text, within the input container."
+        },
+        {
+          "name": "slot",
+          "text": "before-input - Content to be placed before the input text, outside the input container."
+        },
+        {
+          "name": "slot",
+          "text": "after-input - Content to be placed after the input text, outside the input container."
+        },
+        {
+          "name": "slot",
+          "text": "label - Content to be placed as the label, will override the label prop."
+        },
+        {
+          "name": "slot",
+          "text": "description - Content to be placed as the description, will override the description prop."
+        },
+        {
+          "name": "slot",
+          "text": "error-description - Content to be placed as the error description, will override the errorDescription prop."
+        }
+      ],
+      "usage": {},
+      "props": [
+        {
+          "name": "autocomplete",
+          "type": "\"on\" | \"off\" | \"section-*\" | \"shipping\" | \"billing\" | \"home\" | \"work\" | \"mobile\" | \"fax\" | \"pager\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-area-code\" | \"tel-local\" | \"tel-local-prefix\" | \"tel-local-suffix\" | \"tel-extension\" | \"email\" | \"impp\" | \"name\" | \"honorific-prefix\" | \"given-name\" | \"additional-name\" | \"family-name\" | \"honorific-suffix\" | \"nickname\" | \"username\" | \"new-password\" | \"current-password\" | \"one-time-code\" | \"organization-title\" | \"organization\" | \"street-address\" | \"address-line1\" | \"address-line2\" | \"address-line3\" | \"address-level4\" | \"address-level3\" | \"address-level2\" | \"address-level1\" | \"country\" | \"country-name\" | \"postal-code\" | \"cc-name\" | \"cc-given-name\" | \"cc-additional-name\" | \"cc-family-name\" | \"cc-number\" | \"cc-exp\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-csc\" | \"cc-type\" | \"transaction-currency\" | \"transaction-amount\" | \"language\" | \"bday\" | \"bday-day\" | \"bday-month\" | \"bday-year\" | \"sex\" | \"url\" | \"photo\"",
+          "complexType": {
+            "original": "`${TextInputAutocomplete}`",
+            "resolved": "\"on\" | \"off\" | \"section-*\" | \"shipping\" | \"billing\" | \"home\" | \"work\" | \"mobile\" | \"fax\" | \"pager\" | \"tel\" | \"tel-country-code\" | \"tel-national\" | \"tel-area-code\" | \"tel-local\" | \"tel-local-prefix\" | \"tel-local-suffix\" | \"tel-extension\" | \"email\" | \"impp\" | \"name\" | \"honorific-prefix\" | \"given-name\" | \"additional-name\" | \"family-name\" | \"honorific-suffix\" | \"nickname\" | \"username\" | \"new-password\" | \"current-password\" | \"one-time-code\" | \"organization-title\" | \"organization\" | \"street-address\" | \"address-line1\" | \"address-line2\" | \"address-line3\" | \"address-level4\" | \"address-level3\" | \"address-level2\" | \"address-level1\" | \"country\" | \"country-name\" | \"postal-code\" | \"cc-name\" | \"cc-given-name\" | \"cc-additional-name\" | \"cc-family-name\" | \"cc-number\" | \"cc-exp\" | \"cc-exp-month\" | \"cc-exp-year\" | \"cc-csc\" | \"cc-type\" | \"transaction-currency\" | \"transaction-amount\" | \"language\" | \"bday\" | \"bday-day\" | \"bday-month\" | \"bday-year\" | \"sex\" | \"url\" | \"photo\"",
+            "references": {
+              "TextInputAutocomplete": {
+                "location": "import",
+                "path": "../../utils/constants",
+                "id": "src/utils/constants.ts::TextInputAutocomplete"
+              }
+            }
+          },
+          "mutable": false,
+          "attr": "autocomplete",
+          "reflectToAttr": true,
+          "docs": "The autocomplete prop helps users fill out the input field faster by\nsuggesting entries they’ve used before, like their email or address.\nYou can turn it on to make forms more convenient or off to ensure users\nalways type in fresh data.",
+          "docsTags": [],
+          "default": "'off'",
+          "values": [
+            {
+              "value": "on",
+              "type": "string"
+            },
+            {
+              "value": "off",
+              "type": "string"
+            },
+            {
+              "value": "section-*",
+              "type": "string"
+            },
+            {
+              "value": "shipping",
+              "type": "string"
+            },
+            {
+              "value": "billing",
+              "type": "string"
+            },
+            {
+              "value": "home",
+              "type": "string"
+            },
+            {
+              "value": "work",
+              "type": "string"
+            },
+            {
+              "value": "mobile",
+              "type": "string"
+            },
+            {
+              "value": "fax",
+              "type": "string"
+            },
+            {
+              "value": "pager",
+              "type": "string"
+            },
+            {
+              "value": "tel",
+              "type": "string"
+            },
+            {
+              "value": "tel-country-code",
+              "type": "string"
+            },
+            {
+              "value": "tel-national",
+              "type": "string"
+            },
+            {
+              "value": "tel-area-code",
+              "type": "string"
+            },
+            {
+              "value": "tel-local",
+              "type": "string"
+            },
+            {
+              "value": "tel-local-prefix",
+              "type": "string"
+            },
+            {
+              "value": "tel-local-suffix",
+              "type": "string"
+            },
+            {
+              "value": "tel-extension",
+              "type": "string"
+            },
+            {
+              "value": "email",
+              "type": "string"
+            },
+            {
+              "value": "impp",
+              "type": "string"
+            },
+            {
+              "value": "name",
+              "type": "string"
+            },
+            {
+              "value": "honorific-prefix",
+              "type": "string"
+            },
+            {
+              "value": "given-name",
+              "type": "string"
+            },
+            {
+              "value": "additional-name",
+              "type": "string"
+            },
+            {
+              "value": "family-name",
+              "type": "string"
+            },
+            {
+              "value": "honorific-suffix",
+              "type": "string"
+            },
+            {
+              "value": "nickname",
+              "type": "string"
+            },
+            {
+              "value": "username",
+              "type": "string"
+            },
+            {
+              "value": "new-password",
+              "type": "string"
+            },
+            {
+              "value": "current-password",
+              "type": "string"
+            },
+            {
+              "value": "one-time-code",
+              "type": "string"
+            },
+            {
+              "value": "organization-title",
+              "type": "string"
+            },
+            {
+              "value": "organization",
+              "type": "string"
+            },
+            {
+              "value": "street-address",
+              "type": "string"
+            },
+            {
+              "value": "address-line1",
+              "type": "string"
+            },
+            {
+              "value": "address-line2",
+              "type": "string"
+            },
+            {
+              "value": "address-line3",
+              "type": "string"
+            },
+            {
+              "value": "address-level4",
+              "type": "string"
+            },
+            {
+              "value": "address-level3",
+              "type": "string"
+            },
+            {
+              "value": "address-level2",
+              "type": "string"
+            },
+            {
+              "value": "address-level1",
+              "type": "string"
+            },
+            {
+              "value": "country",
+              "type": "string"
+            },
+            {
+              "value": "country-name",
+              "type": "string"
+            },
+            {
+              "value": "postal-code",
+              "type": "string"
+            },
+            {
+              "value": "cc-name",
+              "type": "string"
+            },
+            {
+              "value": "cc-given-name",
+              "type": "string"
+            },
+            {
+              "value": "cc-additional-name",
+              "type": "string"
+            },
+            {
+              "value": "cc-family-name",
+              "type": "string"
+            },
+            {
+              "value": "cc-number",
+              "type": "string"
+            },
+            {
+              "value": "cc-exp",
+              "type": "string"
+            },
+            {
+              "value": "cc-exp-month",
+              "type": "string"
+            },
+            {
+              "value": "cc-exp-year",
+              "type": "string"
+            },
+            {
+              "value": "cc-csc",
+              "type": "string"
+            },
+            {
+              "value": "cc-type",
+              "type": "string"
+            },
+            {
+              "value": "transaction-currency",
+              "type": "string"
+            },
+            {
+              "value": "transaction-amount",
+              "type": "string"
+            },
+            {
+              "value": "language",
+              "type": "string"
+            },
+            {
+              "value": "bday",
+              "type": "string"
+            },
+            {
+              "value": "bday-day",
+              "type": "string"
+            },
+            {
+              "value": "bday-month",
+              "type": "string"
+            },
+            {
+              "value": "bday-year",
+              "type": "string"
+            },
+            {
+              "value": "sex",
+              "type": "string"
+            },
+            {
+              "value": "url",
+              "type": "string"
+            },
+            {
+              "value": "photo",
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "description",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "description",
+          "reflectToAttr": true,
+          "docs": "Add helpful hints or extra information under the text input field. This is\nwhere you can clarify what users should enter or provide additional\ninstructions, making the form easier to fill out correctly.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "disabled",
+          "reflectToAttr": true,
+          "docs": "The disabled prop lets you turn off the input field so that users can’t\ntype in it. When disabled, the field is grayed out and won’t respond to\nclicks or touches.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "emptyresult",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "emptyresult",
+          "reflectToAttr": true,
+          "docs": "The text to display when no items match the filter.",
+          "docsTags": [],
+          "default": "'No results found'",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "error",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "error",
+          "reflectToAttr": true,
+          "docs": "Alters the input field’s appearance to indicate an error, helping users\nidentify fields that need correction.",
+          "docsTags": [
+            {
+              "name": "validator",
+              "text": "error"
+            }
+          ],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "errorDescription",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "error-description",
+          "reflectToAttr": true,
+          "docs": "A description that appears when there is an error related to the dropdown\nfield.",
+          "docsTags": [
+            {
+              "name": "validator",
+              "text": "message"
+            }
+          ],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "filterable",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": true,
+          "attr": "filterable",
+          "reflectToAttr": true,
+          "docs": "Enables or disables the filtering feature for the dropdown items.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "inputId",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "input-id",
+          "reflectToAttr": true,
+          "docs": "Sets the ID for the input element and the for attribute of the associated\nlabel. If no ID is provided, a random one will be automatically generated\nto ensure unique identification, facilitating proper label association and\naccessibility.",
+          "docsTags": [],
+          "default": "uuidv4()",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "label",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "label",
+          "reflectToAttr": true,
+          "docs": "Lets you define the text that explains what users should enter in the text\ninput field. It’s a crucial element for making forms clear and\nuser-friendly.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "name",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "name",
+          "reflectToAttr": true,
+          "docs": "Defines the name attribute of the input field, which is crucial for form\nsubmission. This value is used as the key in the key-value pair sent to\nthe server, representing the input’s data in form submissions. It should be\nunique within the form to avoid conflicts.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "open",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": true,
+          "attr": "open",
+          "reflectToAttr": true,
+          "docs": "State of the dropdown popover.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "placeholder",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "placeholder",
+          "reflectToAttr": true,
+          "docs": "Display temporary text inside the input field to give users a hint about\nwhat to type. It’s a great way to provide examples or suggestions directly\nin the field before they start typing.\nThe placeholder is displayed only when the filterable option is enabled.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "readonly",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "readonly",
+          "reflectToAttr": true,
+          "docs": "Display the input field’s content without allowing users to change it.\nUsers can still click on it, select, and copy the text, but they won’t be\nable to type or delete anything.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "required",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "required",
+          "reflectToAttr": true,
+          "docs": "Marks the input field as required, ensuring that the user must fill it out\nbefore submitting the form.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "value",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": true,
+          "attr": "value",
+          "reflectToAttr": true,
+          "docs": "Specifies the value of the input field, which determines the text displayed\nwithin the field. This prop is typically used in controlled components\nwhere the input’s value is managed by the component’s state.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        }
+      ],
+      "methods": [
+        {
+          "name": "getFilterText",
+          "returns": {
+            "type": "Promise<string>",
+            "docs": "The filter text."
+          },
+          "complexType": {
+            "signature": "() => Promise<string>",
+            "parameters": [],
+            "references": {
+              "Promise": {
+                "location": "global",
+                "id": "global::Promise"
+              }
+            },
+            "return": "Promise<string>"
+          },
+          "signature": "getFilterText() => Promise<string>",
+          "parameters": [],
+          "docs": "Retrieves the current filter text entered by the user.",
+          "docsTags": [
+            {
+              "name": "returns",
+              "text": "The filter text."
+            }
+          ]
+        }
+      ],
+      "events": [
+        {
+          "event": "dropdownItemSelected",
+          "detail": "DropdownItemSelectedEventDetail",
+          "bubbles": true,
+          "complexType": {
+            "original": "DropdownItemSelectedEventDetail",
+            "resolved": "DropdownItemSelectedEventDetail",
+            "references": {
+              "DropdownItemSelectedEventDetail": {
+                "location": "import",
+                "path": "../nv-fielddropdownitem/DropdownItemSelectedEventDetail",
+                "id": "src/components/nv-fielddropdownitem/DropdownItemSelectedEventDetail.tsx::DropdownItemSelectedEventDetail"
+              }
+            }
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Event emitted when an item is selected.",
+          "docsTags": []
+        },
+        {
+          "event": "valueChanged",
+          "detail": "string",
+          "bubbles": true,
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emitted when the input value changes.",
+          "docsTags": [
+            {
+              "name": "bind",
+              "text": "value"
+            }
+          ]
+        }
+      ],
+      "listeners": [
+        {
+          "event": "itemSelected",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "openChanged",
+          "capture": false,
+          "passive": false
+        },
+        {
+          "event": "keydown",
+          "capture": false,
+          "passive": false
+        }
+      ],
+      "styles": [],
+      "slots": [
+        {
+          "name": "after-input",
+          "docs": "Content to be placed after the input text, outside the input container."
+        },
+        {
+          "name": "before-input",
+          "docs": "Content to be placed before the input text, outside the input container."
+        },
+        {
+          "name": "content",
+          "docs": "Use a <ul></ul> tag for the slot, and place <nv-dropdownitem> elements inside."
+        },
+        {
+          "name": "description",
+          "docs": "Content to be placed as the description, will override the description prop."
+        },
+        {
+          "name": "error-description",
+          "docs": "Content to be placed as the error description, will override the errorDescription prop."
+        },
+        {
+          "name": "label",
+          "docs": "Content to be placed as the label, will override the label prop."
+        },
+        {
+          "name": "leading-input",
+          "docs": "Content to be placed before the input text, within the input container."
+        }
+      ],
+      "parts": [],
+      "dependents": [],
+      "dependencies": [
+        "nv-fielddropdownitem",
+        "nv-popover",
+        "nv-iconbutton"
+      ],
+      "dependencyGraph": {
+        "nv-fielddropdown": [
+          "nv-fielddropdownitem",
+          "nv-popover",
+          "nv-iconbutton"
+        ],
+        "nv-fielddropdownitem": [
+          "nv-icon"
+        ],
+        "nv-iconbutton": [
+          "nv-loader",
+          "nv-icon"
+        ]
+      }
+    },
+    {
+      "filePath": "src/components/nv-fielddropdownitem/nv-fielddropdownitem.tsx",
+      "encapsulation": "none",
+      "tag": "nv-fielddropdownitem",
+      "readme": "# nv-fielddropdownitem\nThe 'nv-fielddropdownitem' is a component designed to be used within the 'nv-fielddropdown' component. Each 'nv-fielddropdownitem' represents a single selectable option in the dropdown list. It allows customization through properties such as 'value', 'label', and 'selected' state, which defines its appearance and behavior.\n\nThe 'nv-fielddropdownitem' can display custom content, making it flexible for use cases where options may require more detailed representation beyond plain text. It is ideal for creating interactive dropdown menus, enabling users to make selections easily and clearly. This component is essential for building intuitive and user-friendly dropdown experiences.\n",
+      "docs": "The 'nv-fielddropdownitem' is a component designed to be used within the 'nv-fielddropdown' component. Each 'nv-fielddropdownitem' represents a single selectable option in the dropdown list. It allows customization through properties such as 'value', 'label', and 'selected' state, which defines its appearance and behavior.\n\nThe 'nv-fielddropdownitem' can display custom content, making it flexible for use cases where options may require more detailed representation beyond plain text. It is ideal for creating interactive dropdown menus, enabling users to make selections easily and clearly. This component is essential for building intuitive and user-friendly dropdown experiences.",
+      "docsTags": [
+        {
+          "name": "slot",
+          "text": "default - The content to be displayed inside the dropdown item."
+        }
+      ],
+      "usage": {},
+      "props": [
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "disabled",
+          "reflectToAttr": true,
+          "docs": "Disables the item, preventing any user interaction.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "label",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "label",
+          "reflectToAttr": true,
+          "docs": "Label used as the value for the default layout.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false
+        },
+        {
+          "name": "selected",
+          "type": "boolean",
+          "complexType": {
+            "original": "boolean",
+            "resolved": "boolean",
+            "references": {}
+          },
+          "mutable": true,
+          "attr": "selected",
+          "reflectToAttr": true,
+          "docs": "Indicates if the item is selected.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
+        {
+          "name": "value",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "value",
+          "reflectToAttr": true,
+          "docs": "Value associated with the item.",
+          "docsTags": [],
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": true,
+          "required": false
+        }
+      ],
+      "methods": [],
+      "events": [
+        {
+          "event": "itemSelected",
+          "detail": "DropdownItemSelectedEventDetail",
+          "bubbles": true,
+          "complexType": {
+            "original": "DropdownItemSelectedEventDetail",
+            "resolved": "DropdownItemSelectedEventDetail",
+            "references": {
+              "DropdownItemSelectedEventDetail": {
+                "location": "import",
+                "path": "./DropdownItemSelectedEventDetail",
+                "id": "src/components/nv-fielddropdownitem/DropdownItemSelectedEventDetail.tsx::DropdownItemSelectedEventDetail"
+              }
+            }
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Event emitted when an item is clicked.",
+          "docsTags": []
+        }
+      ],
+      "listeners": [],
+      "styles": [],
+      "slots": [
+        {
+          "name": "default",
+          "docs": "The content to be displayed inside the dropdown item."
+        }
+      ],
+      "parts": [],
+      "dependents": [
+        "nv-fielddropdown"
+      ],
+      "dependencies": [
+        "nv-icon"
+      ],
+      "dependencyGraph": {
+        "nv-fielddropdownitem": [
+          "nv-icon"
+        ],
+        "nv-fielddropdown": [
+          "nv-fielddropdownitem"
+        ]
+      }
+    },
     {
       "filePath": "src/components/nv-fieldnumber/nv-fieldnumber.tsx",
       "encapsulation": "none",
@@ -4878,6 +5798,28 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "inputId",
+          "type": "string",
+          "complexType": {
+            "original": "string",
+            "resolved": "string",
+            "references": {}
+          },
+          "mutable": false,
+          "attr": "input-id",
+          "reflectToAttr": true,
+          "docs": "Sets the ID for the input element and the for attribute of the associated\nlabel. If no ID is provided, a random one will be automatically generated\nto ensure unique identification, facilitating proper label association and\naccessibility.",
+          "docsTags": [],
+          "default": "uuidv4()",
+          "values": [
+            {
+              "type": "string"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "label",
           "type": "string",
@@ -5133,28 +6075,6 @@
           "optional": false,
           "required": false
         },
-        {
-          "name": "textareaId",
-          "type": "string",
-          "complexType": {
-            "original": "string",
-            "resolved": "string",
-            "references": {}
-          },
-          "mutable": false,
-          "attr": "textarea-id",
-          "reflectToAttr": true,
-          "docs": "Sets the ID for the textarea element and the for attribute of the associated\nlabel. If no ID is provided, a random one will be automatically generated\nto ensure unique identification, facilitating proper label association and\naccessibility.",
-          "docsTags": [],
-          "default": "uuidv4()",
-          "values": [
-            {
-              "type": "string"
-            }
-          ],
-          "optional": false,
-          "required": false
-        },
         {
           "name": "validation",
           "type": "string",
@@ -5814,6 +6734,7 @@
         "nv-alert",
         "nv-avatar",
         "nv-badge",
+        "nv-fielddropdownitem",
         "nv-fieldnumber",
         "nv-fieldpassword",
         "nv-fieldselect",
@@ -5832,6 +6753,9 @@
         "nv-badge": [
           "nv-icon"
         ],
+        "nv-fielddropdownitem": [
+          "nv-icon"
+        ],
         "nv-fieldnumber": [
           "nv-icon"
         ],
@@ -6118,6 +7042,7 @@
       ],
       "parts": [],
       "dependents": [
+        "nv-fielddropdown",
         "nv-fieldpassword"
       ],
       "dependencies": [
@@ -6129,6 +7054,9 @@
           "nv-loader",
           "nv-icon"
         ],
+        "nv-fielddropdown": [
+          "nv-iconbutton"
+        ],
         "nv-fieldpassword": [
           "nv-iconbutton"
         ]
@@ -8835,11 +9763,15 @@
       ],
       "parts": [],
       "dependents": [
+        "nv-fielddropdown",
         "nv-menu",
         "nv-tooltip"
       ],
       "dependencies": [],
       "dependencyGraph": {
+        "nv-fielddropdown": [
+          "nv-popover"
+        ],
         "nv-menu": [
           "nv-popover"
         ],
@@ -9225,6 +10157,11 @@
       "docstring": "",
       "path": "src/utils/constants.ts"
     },
+    "src/components/nv-fielddropdownitem/DropdownItemSelectedEventDetail.tsx::DropdownItemSelectedEventDetail": {
+      "declaration": "export interface DropdownItemSelectedEventDetail {\n  label?: string;\n  value: string;\n  selected: boolean;\n  disabled: boolean;\n}",
+      "docstring": "Interface for the event emitted by the dropdown item.",
+      "path": "src/components/nv-fielddropdownitem/DropdownItemSelectedEventDetail.tsx"
+    },
     "src/utils/constants.ts::LoaderColors": {
       "declaration": "export enum LoaderColors {\n  High = 'brand',\n  Low = 'white',\n}",
       "docstring": "",