npm - @aotearoan/neon - Versions diffs - 22.5.0 → 22.5.2 - Mend

@aotearoan/neon 22.5.0 → 22.5.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (106) hide show

package/dist/src/components/user-input/search/NeonSearch.d.ts CHANGED Viewed

@@ -413,7 +413,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -429,10 +429,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -445,9 +441,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -462,6 +456,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -481,12 +479,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -501,19 +500,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -527,15 +531,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -551,6 +559,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -590,7 +599,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -606,10 +615,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -622,9 +627,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -639,6 +642,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -658,12 +665,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -678,13 +686,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null, import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
                     id: {
                         type: StringConstructor;
@@ -715,7 +724,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -731,10 +740,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -747,9 +752,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -764,6 +767,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -783,12 +790,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -803,19 +811,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -829,15 +842,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -853,6 +870,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -892,7 +910,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -908,10 +926,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -924,9 +938,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -941,6 +953,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -960,12 +976,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -980,13 +997,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null>;
                 files: import("vue").Ref<{
                     readonly lastModified: number;
@@ -1335,6 +1353,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1348,15 +1370,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1372,6 +1398,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -1434,6 +1461,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -1447,15 +1478,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 default: boolean;
                             };
                         }>, {
-                            attrs: {
+                            sanitizedAttributes: import("vue").ComputedRef<{
                                 [x: string]: unknown;
-                            };
-                            icon: import("vue").ComputedRef<string>;
+                            }>;
+                            icon: import("vue").ComputedRef<string | undefined>;
                         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                             name: {
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -1471,6 +1506,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         }>> & Readonly<{}>, {
                             disabled: boolean;
                             color: NeonFunctionalColor;
+                            id: string;
                             inverse: boolean;
                         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -1505,7 +1541,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -1521,10 +1557,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -1537,9 +1569,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -1554,6 +1584,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -1568,12 +1602,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], "update:modelValue" | "focus" | "blur" | "icon-click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     id: {
@@ -1605,7 +1640,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -1621,10 +1656,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -1637,9 +1668,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -1654,6 +1683,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -1676,19 +1709,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1702,15 +1740,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1726,6 +1768,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -1778,6 +1821,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1791,15 +1838,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -1815,6 +1866,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -1824,6 +1876,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -1837,15 +1893,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -1861,6 +1921,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
         }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -2116,6 +2177,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -2129,15 +2194,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -2153,6 +2222,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -2215,6 +2285,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -2228,15 +2302,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: boolean;
                     };
                 }>, {
-                    attrs: {
+                    sanitizedAttributes: import("vue").ComputedRef<{
                         [x: string]: unknown;
-                    };
-                    icon: import("vue").ComputedRef<string>;
+                    }>;
+                    icon: import("vue").ComputedRef<string | undefined>;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     name: {
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -2252,6 +2330,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 }>> & Readonly<{}>, {
                     disabled: boolean;
                     color: NeonFunctionalColor;
+                    id: string;
                     inverse: boolean;
                 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -2744,7 +2823,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -2760,10 +2839,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -2776,9 +2851,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -2793,6 +2866,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -2812,12 +2889,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -2832,19 +2910,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -2858,15 +2941,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -2882,6 +2969,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -2921,7 +3009,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -2937,10 +3025,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -2953,9 +3037,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -2970,6 +3052,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -2989,12 +3075,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -3009,13 +3096,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null, import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
                     id: {
                         type: StringConstructor;
@@ -3046,7 +3134,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -3062,10 +3150,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -3078,9 +3162,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -3095,6 +3177,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -3114,12 +3200,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -3134,19 +3221,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -3160,15 +3252,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -3184,6 +3280,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -3223,7 +3320,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -3239,10 +3336,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -3255,9 +3348,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -3272,6 +3363,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -3291,12 +3386,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -3311,13 +3407,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null>;
                 files: import("vue").Ref<{
                     readonly lastModified: number;
@@ -3666,6 +3763,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -3679,15 +3780,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -3703,6 +3808,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -3765,6 +3871,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -3778,15 +3888,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 default: boolean;
                             };
                         }>, {
-                            attrs: {
+                            sanitizedAttributes: import("vue").ComputedRef<{
                                 [x: string]: unknown;
-                            };
-                            icon: import("vue").ComputedRef<string>;
+                            }>;
+                            icon: import("vue").ComputedRef<string | undefined>;
                         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                             name: {
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -3802,6 +3916,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         }>> & Readonly<{}>, {
                             disabled: boolean;
                             color: NeonFunctionalColor;
+                            id: string;
                             inverse: boolean;
                         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -3836,7 +3951,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -3852,10 +3967,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -3868,9 +3979,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -3885,6 +3994,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -3899,12 +4012,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], "update:modelValue" | "focus" | "blur" | "icon-click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     id: {
@@ -3936,7 +4050,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -3952,10 +4066,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -3968,9 +4078,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -3985,6 +4093,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -4007,19 +4119,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -4033,15 +4150,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -4057,6 +4178,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -4109,6 +4231,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -4122,15 +4248,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -4146,6 +4276,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -4155,6 +4286,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -4168,15 +4303,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -4192,6 +4331,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
         }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -4447,6 +4587,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -4460,15 +4604,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -4484,6 +4632,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -4546,6 +4695,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -4559,15 +4712,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: boolean;
                     };
                 }>, {
-                    attrs: {
+                    sanitizedAttributes: import("vue").ComputedRef<{
                         [x: string]: unknown;
-                    };
-                    icon: import("vue").ComputedRef<string>;
+                    }>;
+                    icon: import("vue").ComputedRef<string | undefined>;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     name: {
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -4583,6 +4740,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 }>> & Readonly<{}>, {
                     disabled: boolean;
                     color: NeonFunctionalColor;
+                    id: string;
                     inverse: boolean;
                 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -4779,7 +4937,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -4795,10 +4953,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -4811,9 +4965,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -4828,6 +4980,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -4847,12 +5003,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconName: import("vue").ComputedRef<string | undefined>;
         iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
         computedPlaceholder: import("vue").ComputedRef<string>;
+        counterLabel: import("vue").ComputedRef<string | null>;
         focus: () => void;
         click: () => void;
         onFocus: () => void;
         onBlur: () => void;
         iconClicked: ($event: Event) => void;
-        changeValue: (event: Event) => void;
+        changeValue: (event: InputEvent) => void;
         onKeyDown: (event: KeyboardEvent) => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
         disabled: boolean;
@@ -4867,19 +5024,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputmode: NeonInputMode;
         modelValue: string;
         state: import("../../../neon").NeonState;
-        autocomplete: string;
+        autocomplete: NeonInputMode;
         rows: number;
         iconReadonly: boolean;
         hideIcon: boolean;
         stateHighlight: boolean;
         stateIcon: boolean;
         maxlength: number;
+        maxlengthLabel: string;
     }, true, {}, {}, {
         NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -4893,15 +5055,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -4917,6 +5083,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -4956,7 +5123,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -4972,10 +5139,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -4988,9 +5151,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -5005,6 +5166,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -5024,12 +5189,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconName: import("vue").ComputedRef<string | undefined>;
         iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
         computedPlaceholder: import("vue").ComputedRef<string>;
+        counterLabel: import("vue").ComputedRef<string | null>;
         focus: () => void;
         click: () => void;
         onFocus: () => void;
         onBlur: () => void;
         iconClicked: ($event: Event) => void;
-        changeValue: (event: Event) => void;
+        changeValue: (event: InputEvent) => void;
         onKeyDown: (event: KeyboardEvent) => void;
     }, {}, {}, {}, {
         disabled: boolean;
@@ -5044,13 +5210,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputmode: NeonInputMode;
         modelValue: string;
         state: import("../../../neon").NeonState;
-        autocomplete: string;
+        autocomplete: NeonInputMode;
         rows: number;
         iconReadonly: boolean;
         hideIcon: boolean;
         stateHighlight: boolean;
         stateIcon: boolean;
         maxlength: number;
+        maxlengthLabel: string;
     }> | null, import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
         id: {
             type: StringConstructor;
@@ -5081,7 +5248,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -5097,10 +5264,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -5113,9 +5276,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -5130,6 +5291,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -5149,12 +5314,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconName: import("vue").ComputedRef<string | undefined>;
         iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
         computedPlaceholder: import("vue").ComputedRef<string>;
+        counterLabel: import("vue").ComputedRef<string | null>;
         focus: () => void;
         click: () => void;
         onFocus: () => void;
         onBlur: () => void;
         iconClicked: ($event: Event) => void;
-        changeValue: (event: Event) => void;
+        changeValue: (event: InputEvent) => void;
         onKeyDown: (event: KeyboardEvent) => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
         disabled: boolean;
@@ -5169,19 +5335,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputmode: NeonInputMode;
         modelValue: string;
         state: import("../../../neon").NeonState;
-        autocomplete: string;
+        autocomplete: NeonInputMode;
         rows: number;
         iconReadonly: boolean;
         hideIcon: boolean;
         stateHighlight: boolean;
         stateIcon: boolean;
         maxlength: number;
+        maxlengthLabel: string;
     }, true, {}, {}, {
         NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -5195,15 +5366,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -5219,6 +5394,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -5258,7 +5434,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -5274,10 +5450,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -5290,9 +5462,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -5307,6 +5477,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -5326,12 +5500,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconName: import("vue").ComputedRef<string | undefined>;
         iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
         computedPlaceholder: import("vue").ComputedRef<string>;
+        counterLabel: import("vue").ComputedRef<string | null>;
         focus: () => void;
         click: () => void;
         onFocus: () => void;
         onBlur: () => void;
         iconClicked: ($event: Event) => void;
-        changeValue: (event: Event) => void;
+        changeValue: (event: InputEvent) => void;
         onKeyDown: (event: KeyboardEvent) => void;
     }, {}, {}, {}, {
         disabled: boolean;
@@ -5346,13 +5521,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputmode: NeonInputMode;
         modelValue: string;
         state: import("../../../neon").NeonState;
-        autocomplete: string;
+        autocomplete: NeonInputMode;
         rows: number;
         iconReadonly: boolean;
         hideIcon: boolean;
         stateHighlight: boolean;
         stateIcon: boolean;
         maxlength: number;
+        maxlengthLabel: string;
     }> | null>;
     open: import("vue").Ref<boolean, boolean>;
     highlightedKey: import("vue").Ref<string | null, string | null>;
@@ -5531,6 +5707,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -5544,15 +5724,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -5568,6 +5752,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -5972,7 +6157,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -5988,10 +6173,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -6004,9 +6185,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -6021,6 +6200,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -6040,12 +6223,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -6060,19 +6244,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6086,15 +6275,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6110,6 +6303,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -6149,7 +6343,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -6165,10 +6359,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -6181,9 +6371,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -6198,6 +6386,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -6217,12 +6409,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -6237,13 +6430,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null, import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
                     id: {
                         type: StringConstructor;
@@ -6274,7 +6468,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -6290,10 +6484,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -6306,9 +6496,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -6323,6 +6511,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -6342,12 +6534,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
                     disabled: boolean;
@@ -6362,19 +6555,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, true, {}, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6388,15 +6586,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6412,6 +6614,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
@@ -6451,7 +6654,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -6467,10 +6670,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -6483,9 +6682,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -6500,6 +6697,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -6519,12 +6720,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, {
                     disabled: boolean;
@@ -6539,13 +6741,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }> | null>;
                 files: import("vue").Ref<{
                     readonly lastModified: number;
@@ -6894,6 +7097,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6907,15 +7114,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -6931,6 +7142,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -6993,6 +7205,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -7006,15 +7222,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                                 default: boolean;
                             };
                         }>, {
-                            attrs: {
+                            sanitizedAttributes: import("vue").ComputedRef<{
                                 [x: string]: unknown;
-                            };
-                            icon: import("vue").ComputedRef<string>;
+                            }>;
+                            icon: import("vue").ComputedRef<string | undefined>;
                         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                             name: {
                                 type: StringConstructor;
                                 required: true;
                             };
+                            id: {
+                                type: StringConstructor;
+                                default: null;
+                            };
                             color: {
                                 type: () => NeonFunctionalColor;
                                 default: null;
@@ -7030,6 +7250,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         }>> & Readonly<{}>, {
                             disabled: boolean;
                             color: NeonFunctionalColor;
+                            id: string;
                             inverse: boolean;
                         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -7064,7 +7285,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -7080,10 +7301,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -7096,9 +7313,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -7113,6 +7328,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -7127,12 +7346,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     iconName: import("vue").ComputedRef<string | undefined>;
                     iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
                     computedPlaceholder: import("vue").ComputedRef<string>;
+                    counterLabel: import("vue").ComputedRef<string | null>;
                     focus: () => void;
                     click: () => void;
                     onFocus: () => void;
                     onBlur: () => void;
                     iconClicked: ($event: Event) => void;
-                    changeValue: (event: Event) => void;
+                    changeValue: (event: InputEvent) => void;
                     onKeyDown: (event: KeyboardEvent) => void;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], "update:modelValue" | "focus" | "blur" | "icon-click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     id: {
@@ -7164,7 +7384,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: NeonInputMode;
                     };
                     autocomplete: {
-                        type: StringConstructor;
+                        type: () => NeonInputMode;
                         default: string;
                     };
                     state: {
@@ -7180,10 +7400,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: null;
                     };
                     iconReadonly: {
-                        /**
-                         * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-                         * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-                         */
                         type: BooleanConstructor;
                         default: boolean;
                     };
@@ -7196,9 +7412,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: number;
                     };
                     disabled: {
-                        type: BooleanConstructor; /**
-                         * Placement of the dropdown contents.
-                         */
+                        type: BooleanConstructor;
                         default: boolean;
                     };
                     stateHighlight: {
@@ -7213,6 +7427,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: NumberConstructor;
                         default: null;
                     };
+                    maxlengthLabel: {
+                        type: StringConstructor;
+                        default: string;
+                    };
                     debounce: {
                         type: NumberConstructor;
                         default: undefined;
@@ -7235,19 +7453,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     inputmode: NeonInputMode;
                     modelValue: string;
                     state: import("../../../neon").NeonState;
-                    autocomplete: string;
+                    autocomplete: NeonInputMode;
                     rows: number;
                     iconReadonly: boolean;
                     hideIcon: boolean;
                     stateHighlight: boolean;
                     stateIcon: boolean;
                     maxlength: number;
+                    maxlengthLabel: string;
                 }, {}, {
                     NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -7261,15 +7484,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -7285,6 +7512,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -7337,6 +7565,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -7350,15 +7582,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                             default: boolean;
                         };
                     }>, {
-                        attrs: {
+                        sanitizedAttributes: import("vue").ComputedRef<{
                             [x: string]: unknown;
-                        };
-                        icon: import("vue").ComputedRef<string>;
+                        }>;
+                        icon: import("vue").ComputedRef<string | undefined>;
                     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                         name: {
                             type: StringConstructor;
                             required: true;
                         };
+                        id: {
+                            type: StringConstructor;
+                            default: null;
+                        };
                         color: {
                             type: () => NeonFunctionalColor;
                             default: null;
@@ -7374,6 +7610,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     }>> & Readonly<{}>, {
                         disabled: boolean;
                         color: NeonFunctionalColor;
+                        id: string;
                         inverse: boolean;
                     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
                 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -7383,6 +7620,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -7396,15 +7637,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -7420,6 +7665,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
         }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -7675,6 +7921,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -7688,15 +7938,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                     default: boolean;
                 };
             }>, {
-                attrs: {
+                sanitizedAttributes: import("vue").ComputedRef<{
                     [x: string]: unknown;
-                };
-                icon: import("vue").ComputedRef<string>;
+                }>;
+                icon: import("vue").ComputedRef<string | undefined>;
             }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                 name: {
                     type: StringConstructor;
                     required: true;
                 };
+                id: {
+                    type: StringConstructor;
+                    default: null;
+                };
                 color: {
                     type: () => NeonFunctionalColor;
                     default: null;
@@ -7712,6 +7966,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             }>> & Readonly<{}>, {
                 disabled: boolean;
                 color: NeonFunctionalColor;
+                id: string;
                 inverse: boolean;
             }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -7774,6 +8029,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -7787,15 +8046,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                         default: boolean;
                     };
                 }>, {
-                    attrs: {
+                    sanitizedAttributes: import("vue").ComputedRef<{
                         [x: string]: unknown;
-                    };
-                    icon: import("vue").ComputedRef<string>;
+                    }>;
+                    icon: import("vue").ComputedRef<string | undefined>;
                 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
                     name: {
                         type: StringConstructor;
                         required: true;
                     };
+                    id: {
+                        type: StringConstructor;
+                        default: null;
+                    };
                     color: {
                         type: () => NeonFunctionalColor;
                         default: null;
@@ -7811,6 +8074,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 }>> & Readonly<{}>, {
                     disabled: boolean;
                     color: NeonFunctionalColor;
+                    id: string;
                     inverse: boolean;
                 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
             }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
@@ -7861,6 +8125,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -7874,15 +8142,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: boolean;
         };
     }>, {
-        attrs: {
+        sanitizedAttributes: import("vue").ComputedRef<{
             [x: string]: unknown;
-        };
-        icon: import("vue").ComputedRef<string>;
+        }>;
+        icon: import("vue").ComputedRef<string | undefined>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         name: {
             type: StringConstructor;
             required: true;
         };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
         color: {
             type: () => NeonFunctionalColor;
             default: null;
@@ -7898,6 +8170,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }>> & Readonly<{}>, {
         disabled: boolean;
         color: NeonFunctionalColor;
+        id: string;
         inverse: boolean;
     }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     NeonInput: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
@@ -7930,7 +8203,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -7946,10 +8219,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -7962,9 +8231,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -7979,6 +8246,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -7993,12 +8264,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         iconName: import("vue").ComputedRef<string | undefined>;
         iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
         computedPlaceholder: import("vue").ComputedRef<string>;
+        counterLabel: import("vue").ComputedRef<string | null>;
         focus: () => void;
         click: () => void;
         onFocus: () => void;
         onBlur: () => void;
         iconClicked: ($event: Event) => void;
-        changeValue: (event: Event) => void;
+        changeValue: (event: InputEvent) => void;
         onKeyDown: (event: KeyboardEvent) => void;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], "update:modelValue" | "focus" | "blur" | "icon-click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         id: {
@@ -8030,7 +8302,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: NeonInputMode;
         };
         autocomplete: {
-            type: StringConstructor;
+            type: () => NeonInputMode;
             default: string;
         };
         state: {
@@ -8046,10 +8318,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconReadonly: {
-            /**
-             * The HTML input mode as specified <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">here</a>.
-             * This can be used to simplify populating the filter field, e.g. providing the user's country from their address.
-             */
             type: BooleanConstructor;
             default: boolean;
         };
@@ -8062,9 +8330,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: number;
         };
         disabled: {
-            type: BooleanConstructor; /**
-             * Placement of the dropdown contents.
-             */
+            type: BooleanConstructor;
             default: boolean;
         };
         stateHighlight: {
@@ -8079,6 +8345,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             type: NumberConstructor;
             default: null;
         };
+        maxlengthLabel: {
+            type: StringConstructor;
+            default: string;
+        };
         debounce: {
             type: NumberConstructor;
             default: undefined;
@@ -8101,19 +8371,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputmode: NeonInputMode;
         modelValue: string;
         state: import("../../../neon").NeonState;
-        autocomplete: string;
+        autocomplete: NeonInputMode;
         rows: number;
         iconReadonly: boolean;
         hideIcon: boolean;
         stateHighlight: boolean;
         stateIcon: boolean;
         maxlength: number;
+        maxlengthLabel: string;
     }, {}, {
         NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -8127,15 +8402,19 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 default: boolean;
             };
         }>, {
-            attrs: {
+            sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
-            };
-            icon: import("vue").ComputedRef<string>;
+            }>;
+            icon: import("vue").ComputedRef<string | undefined>;
         }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
             name: {
                 type: StringConstructor;
                 required: true;
             };
+            id: {
+                type: StringConstructor;
+                default: null;
+            };
             color: {
                 type: () => NeonFunctionalColor;
                 default: null;
@@ -8151,6 +8430,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }>> & Readonly<{}>, {
             disabled: boolean;
             color: NeonFunctionalColor;
+            id: string;
             inverse: boolean;
         }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;