@aotearoan/neon 22.1.2 → 22.3.0

package/dist/src/components/user-input/file/NeonFile.d.ts

@@ -64,6 +64,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: () => NeonFunctionalColor;
         default: NeonFunctionalColor;
     };
+    /**
+     * Make the button circular. NOTE: This is only for icon only buttons.
+     */
+    circular: {
+        type: BooleanConstructor;
+        default: null;
+    };
     /**
      * The label of the file component button
      */
@@ -78,8 +85,603 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         default: null;
     };
+    /**
+     * Title for the file upload button.
+     */
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
 }>, {
-    fileInput: import("vue").Ref<HTMLInputElement | null, HTMLInputElement | null>;
+    fileInput: import("vue").Ref<import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        modelValue: {
+            type: StringConstructor;
+            default: null;
+        };
+        type: {
+            type: () => import("../../../neon").NeonInputType;
+            default: import("../../../neon").NeonInputType;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => NeonSize;
+            default: NeonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor; /**
+             * The file component size
+             */
+            default: NeonFunctionalColor;
+        };
+        inputmode: {
+            type: () => import("../../../neon").NeonInputMode;
+            default: import("../../../neon").NeonInputMode;
+        };
+        autocomplete: {
+            type: StringConstructor;
+            default: string;
+        };
+        state: {
+            type: () => NeonState;
+            default: NeonState;
+        };
+        rows: {
+            type: NumberConstructor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconReadonly: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        hideIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        tabindex: {
+            type: NumberConstructor;
+            default: number;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateHighlight: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maxlength: {
+            type: NumberConstructor;
+            default: null;
+        };
+        debounce: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+    }>> & Readonly<{
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        "onIcon-click"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        neonInput: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+        focused: import("vue").Ref<boolean, boolean>;
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        iconVisible: import("vue").ComputedRef<string | boolean | undefined>;
+        iconName: import("vue").ComputedRef<string | undefined>;
+        iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
+        computedPlaceholder: import("vue").ComputedRef<string>;
+        focus: () => void;
+        click: () => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        iconClicked: ($event: Event) => void;
+        changeValue: (event: Event) => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
+        disabled: boolean;
+        icon: string;
+        type: import("../../../neon").NeonInputType;
+        debounce: number;
+        size: NeonSize;
+        color: NeonFunctionalColor;
+        id: string;
+        placeholder: string;
+        tabindex: number;
+        inputmode: import("../../../neon").NeonInputMode;
+        modelValue: string;
+        state: NeonState;
+        autocomplete: string;
+        rows: number;
+        iconReadonly: boolean;
+        hideIcon: boolean;
+        stateHighlight: boolean;
+        stateIcon: boolean;
+        maxlength: number;
+    }, true, {}, {}, {
+        NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>, {
+            attrs: {
+                [x: string]: unknown;
+            };
+            icon: import("vue").ComputedRef<string>;
+        }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{}>, {
+            disabled: boolean;
+            color: NeonFunctionalColor;
+            inverse: boolean;
+        }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("vue").ExtractPropTypes<{
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        modelValue: {
+            type: StringConstructor;
+            default: null;
+        };
+        type: {
+            type: () => import("../../../neon").NeonInputType;
+            default: import("../../../neon").NeonInputType;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => NeonSize;
+            default: NeonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor; /**
+             * The file component size
+             */
+            default: NeonFunctionalColor;
+        };
+        inputmode: {
+            type: () => import("../../../neon").NeonInputMode;
+            default: import("../../../neon").NeonInputMode;
+        };
+        autocomplete: {
+            type: StringConstructor;
+            default: string;
+        };
+        state: {
+            type: () => NeonState;
+            default: NeonState;
+        };
+        rows: {
+            type: NumberConstructor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconReadonly: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        hideIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        tabindex: {
+            type: NumberConstructor;
+            default: number;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateHighlight: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maxlength: {
+            type: NumberConstructor;
+            default: null;
+        };
+        debounce: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+    }>> & Readonly<{
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        "onIcon-click"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        neonInput: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+        focused: import("vue").Ref<boolean, boolean>;
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        iconVisible: import("vue").ComputedRef<string | boolean | undefined>;
+        iconName: import("vue").ComputedRef<string | undefined>;
+        iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
+        computedPlaceholder: import("vue").ComputedRef<string>;
+        focus: () => void;
+        click: () => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        iconClicked: ($event: Event) => void;
+        changeValue: (event: Event) => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+    }, {}, {}, {}, {
+        disabled: boolean;
+        icon: string;
+        type: import("../../../neon").NeonInputType;
+        debounce: number;
+        size: NeonSize;
+        color: NeonFunctionalColor;
+        id: string;
+        placeholder: string;
+        tabindex: number;
+        inputmode: import("../../../neon").NeonInputMode;
+        modelValue: string;
+        state: NeonState;
+        autocomplete: string;
+        rows: number;
+        iconReadonly: boolean;
+        hideIcon: boolean;
+        stateHighlight: boolean;
+        stateIcon: boolean;
+        maxlength: number;
+    }> | null, import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        modelValue: {
+            type: StringConstructor;
+            default: null;
+        };
+        type: {
+            type: () => import("../../../neon").NeonInputType;
+            default: import("../../../neon").NeonInputType;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => NeonSize;
+            default: NeonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor; /**
+             * The file component size
+             */
+            default: NeonFunctionalColor;
+        };
+        inputmode: {
+            type: () => import("../../../neon").NeonInputMode;
+            default: import("../../../neon").NeonInputMode;
+        };
+        autocomplete: {
+            type: StringConstructor;
+            default: string;
+        };
+        state: {
+            type: () => NeonState;
+            default: NeonState;
+        };
+        rows: {
+            type: NumberConstructor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconReadonly: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        hideIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        tabindex: {
+            type: NumberConstructor;
+            default: number;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateHighlight: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maxlength: {
+            type: NumberConstructor;
+            default: null;
+        };
+        debounce: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+    }>> & Readonly<{
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        "onIcon-click"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        neonInput: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+        focused: import("vue").Ref<boolean, boolean>;
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        iconVisible: import("vue").ComputedRef<string | boolean | undefined>;
+        iconName: import("vue").ComputedRef<string | undefined>;
+        iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
+        computedPlaceholder: import("vue").ComputedRef<string>;
+        focus: () => void;
+        click: () => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        iconClicked: ($event: Event) => void;
+        changeValue: (event: Event) => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "focus" | "blur" | "icon-click")[], import("vue").PublicProps, {
+        disabled: boolean;
+        icon: string;
+        type: import("../../../neon").NeonInputType;
+        debounce: number;
+        size: NeonSize;
+        color: NeonFunctionalColor;
+        id: string;
+        placeholder: string;
+        tabindex: number;
+        inputmode: import("../../../neon").NeonInputMode;
+        modelValue: string;
+        state: NeonState;
+        autocomplete: string;
+        rows: number;
+        iconReadonly: boolean;
+        hideIcon: boolean;
+        stateHighlight: boolean;
+        stateIcon: boolean;
+        maxlength: number;
+    }, true, {}, {}, {
+        NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>, {
+            attrs: {
+                [x: string]: unknown;
+            };
+            icon: import("vue").ComputedRef<string>;
+        }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+            name: {
+                type: StringConstructor;
+                required: true;
+            };
+            color: {
+                type: () => NeonFunctionalColor;
+                default: null;
+            };
+            inverse: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{}>, {
+            disabled: boolean;
+            color: NeonFunctionalColor;
+            inverse: boolean;
+        }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    } & import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("vue").ExtractPropTypes<{
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        modelValue: {
+            type: StringConstructor;
+            default: null;
+        };
+        type: {
+            type: () => import("../../../neon").NeonInputType;
+            default: import("../../../neon").NeonInputType;
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: null;
+        };
+        size: {
+            type: () => NeonSize;
+            default: NeonSize;
+        };
+        color: {
+            type: () => NeonFunctionalColor; /**
+             * The file component size
+             */
+            default: NeonFunctionalColor;
+        };
+        inputmode: {
+            type: () => import("../../../neon").NeonInputMode;
+            default: import("../../../neon").NeonInputMode;
+        };
+        autocomplete: {
+            type: StringConstructor;
+            default: string;
+        };
+        state: {
+            type: () => NeonState;
+            default: NeonState;
+        };
+        rows: {
+            type: NumberConstructor;
+            default: null;
+        };
+        icon: {
+            type: StringConstructor;
+            default: null;
+        };
+        iconReadonly: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        hideIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        tabindex: {
+            type: NumberConstructor;
+            default: number;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateHighlight: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        stateIcon: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        maxlength: {
+            type: NumberConstructor;
+            default: null;
+        };
+        debounce: {
+            type: NumberConstructor;
+            default: undefined;
+        };
+    }>> & Readonly<{
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        "onIcon-click"?: ((...args: any[]) => any) | undefined;
+    }>, {
+        neonInput: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
+        focused: import("vue").Ref<boolean, boolean>;
+        sanitizedAttributes: import("vue").ComputedRef<{
+            [x: string]: unknown;
+        }>;
+        iconVisible: import("vue").ComputedRef<string | boolean | undefined>;
+        iconName: import("vue").ComputedRef<string | undefined>;
+        iconColor: import("vue").ComputedRef<NeonFunctionalColor>;
+        computedPlaceholder: import("vue").ComputedRef<string>;
+        focus: () => void;
+        click: () => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        iconClicked: ($event: Event) => void;
+        changeValue: (event: Event) => void;
+        onKeyDown: (event: KeyboardEvent) => void;
+    }, {}, {}, {}, {
+        disabled: boolean;
+        icon: string;
+        type: import("../../../neon").NeonInputType;
+        debounce: number;
+        size: NeonSize;
+        color: NeonFunctionalColor;
+        id: string;
+        placeholder: string;
+        tabindex: number;
+        inputmode: import("../../../neon").NeonInputMode;
+        modelValue: string;
+        state: NeonState;
+        autocomplete: string;
+        rows: number;
+        iconReadonly: boolean;
+        hideIcon: boolean;
+        stateHighlight: boolean;
+        stateIcon: boolean;
+        maxlength: number;
+    }> | null>;
     files: import("vue").Ref<{
         readonly lastModified: number;
         readonly name: string;
@@ -169,6 +771,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: () => NeonFunctionalColor;
         default: NeonFunctionalColor;
     };
+    /**
+     * Make the button circular. NOTE: This is only for icon only buttons.
+     */
+    circular: {
+        type: BooleanConstructor;
+        default: null;
+    };
     /**
      * The label of the file component button
      */
@@ -183,16 +792,25 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         default: null;
     };
+    /**
+     * Title for the file upload button.
+     */
+    title: {
+        type: StringConstructor;
+        default: string;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }>, {
     disabled: boolean;
     label: string;
+    title: string;
     icon: string;
     size: NeonSize;
     color: NeonFunctionalColor;
     id: string;
     state: NeonState;
+    circular: boolean;
     directUpload: boolean;
     multiple: boolean;
     accept: string;
@@ -227,8 +845,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconAriaLabel: {
-            type: StringConstructor;
-        };
+            type: StringConstructor; /**
+             * The icon of the file component button
+             */
+        }; /**
+         * The icon of the file component button
+         */
         iconPosition: {
             type: () => import("../../../neon").NeonHorizontalPosition;
             default: import("../../../neon").NeonHorizontalPosition;
@@ -326,8 +948,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             default: null;
         };
         iconAriaLabel: {
-            type: StringConstructor;
-        };
+            type: StringConstructor; /**
+             * The icon of the file component button
+             */
+        }; /**
+         * The icon of the file component button
+         */
         iconPosition: {
             type: () => import("../../../neon").NeonHorizontalPosition;
             default: import("../../../neon").NeonHorizontalPosition;
@@ -383,13 +1009,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         size: import("../../../neon").NeonButtonSize;
         color: NeonFunctionalColor;
         inverse: boolean;
-        circular: boolean;
         alternateColor: NeonFunctionalColor;
         iconPosition: import("../../../neon").NeonHorizontalPosition;
         buttonStyle: import("../../../neon").NeonButtonStyle;
         buttonType: import("../../../neon").NeonButtonType;
         state: NeonState;
         transparent: boolean;
+        circular: boolean;
         fullWidth: boolean;
         indicator: boolean;
         indicatorExpanded: boolean;
@@ -500,7 +1126,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             sanitizedAttributes: import("vue").ComputedRef<{
                 [x: string]: unknown;
             }>;
-            activeRoute: import("vue").ComputedRef<boolean | "">;
+            activeRoute: import("vue").ComputedRef<boolean | "">; /**
+             * Emitted when files are selected and uploaded
+             * @type {File | File[]} either a single File (multiple = false) or a list of File objects (multiple = true)
+             */
             exactRoute: import("vue").ComputedRef<boolean | "">;
             onClick: () => void;
             onSpace: () => Promise<void>;