@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
1,536 lines (1,535 loc) • 57.1 kB
TypeScript
import { NeonSize } from '@/model/common/size/NeonSize';
import { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';
import { NeonState } from '@/model/common/state/NeonState';
import { NeonButtonStyle } from '@/model/user-input/button/NeonButtonStyle';
/**
* A file upload component. This is a wrapper around an HTML file input. It can display multiple files as well as
* providing a convenient UI for removing/clearing files from the list.
*/
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
/**
* The disabled state of the component
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
/**
* Files are uploaded directly once added, there is no waiting to click a confirmation button
*/
directUpload: {
type: BooleanConstructor;
default: boolean;
};
/**
* Support multiple files.
*/
multiple: {
type: BooleanConstructor;
default: boolean;
};
/**
* HTML file input accept property for filtering the files the user is allowed to select. This is a mime type,
* e.g. 'application/pdf'.
*/
accept: {
type: StringConstructor;
default: null;
};
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
id: {
type: StringConstructor;
default: null;
};
/**
* The file component size
*/
size: {
type: () => NeonSize;
default: NeonSize;
};
/**
* The state of the input, used to indicate loading, success and error states
*/
state: {
type: () => NeonState;
default: NeonState;
};
/**
* The file component color
*/
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
/**
* The style of button to use for the upload
*/
buttonStyle: {
type: () => NeonButtonStyle;
default: NeonButtonStyle;
};
/**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
circular: {
type: BooleanConstructor;
default: null;
};
/**
* The label of the file component button
*/
label: {
type: StringConstructor;
default: null;
};
/**
* The icon of the file component button
*/
icon: {
type: StringConstructor;
default: null;
};
/**
* Title for the file upload button.
*/
title: {
type: StringConstructor;
default: string;
};
}>, {
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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
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>;
counterLabel: import("vue").ComputedRef<string | null>;
focus: () => void;
click: () => void;
onFocus: () => void;
onBlur: () => void;
iconClicked: ($event: Event) => void;
changeValue: (event: InputEvent) => void;
onKeyDown: (event: KeyboardEvent) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "blur" | "focus" | "icon-click")[], import("vue").PublicProps, {
color: NeonFunctionalColor;
icon: string;
type: import("../../../neon").NeonInputType;
id: string;
disabled: boolean;
size: NeonSize;
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;
maxlengthLabel: string;
debounce: number;
}, true, {}, {}, {
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
id: {
type: StringConstructor;
default: null; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>, {
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
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; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{}>, {
color: NeonFunctionalColor;
id: string;
inverse: boolean;
disabled: 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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
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>;
counterLabel: import("vue").ComputedRef<string | null>;
focus: () => void;
click: () => void;
onFocus: () => void;
onBlur: () => void;
iconClicked: ($event: Event) => void;
changeValue: (event: InputEvent) => void;
onKeyDown: (event: KeyboardEvent) => void;
}, {}, {}, {}, {
color: NeonFunctionalColor;
icon: string;
type: import("../../../neon").NeonInputType;
id: string;
disabled: boolean;
size: NeonSize;
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;
maxlengthLabel: string;
debounce: 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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
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>;
counterLabel: import("vue").ComputedRef<string | null>;
focus: () => void;
click: () => void;
onFocus: () => void;
onBlur: () => void;
iconClicked: ($event: Event) => void;
changeValue: (event: InputEvent) => void;
onKeyDown: (event: KeyboardEvent) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "blur" | "focus" | "icon-click")[], import("vue").PublicProps, {
color: NeonFunctionalColor;
icon: string;
type: import("../../../neon").NeonInputType;
id: string;
disabled: boolean;
size: NeonSize;
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;
maxlengthLabel: string;
debounce: number;
}, true, {}, {}, {
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
id: {
type: StringConstructor;
default: null; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>, {
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
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; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{}>, {
color: NeonFunctionalColor;
id: string;
inverse: boolean;
disabled: 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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
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>;
counterLabel: import("vue").ComputedRef<string | null>;
focus: () => void;
click: () => void;
onFocus: () => void;
onBlur: () => void;
iconClicked: ($event: Event) => void;
changeValue: (event: InputEvent) => void;
onKeyDown: (event: KeyboardEvent) => void;
}, {}, {}, {}, {
color: NeonFunctionalColor;
icon: string;
type: import("../../../neon").NeonInputType;
id: string;
disabled: boolean;
size: NeonSize;
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;
maxlengthLabel: string;
debounce: number;
}> | null>;
files: import("vue").Ref<{
readonly lastModified: number;
readonly name: string;
readonly webkitRelativePath: string;
readonly size: number;
readonly type: string;
arrayBuffer: () => Promise<ArrayBuffer>;
slice: (start?: number | undefined, end?: number | undefined, contentType?: string | undefined) => Blob;
stream: () => ReadableStream<Uint8Array>;
text: () => Promise<string>;
}[], File[] | {
readonly lastModified: number;
readonly name: string;
readonly webkitRelativePath: string;
readonly size: number;
readonly type: string;
arrayBuffer: () => Promise<ArrayBuffer>;
slice: (start?: number | undefined, end?: number | undefined, contentType?: string | undefined) => Blob;
stream: () => ReadableStream<Uint8Array>;
text: () => Promise<string>;
}[]>;
fileList: import("vue").ComputedRef<{
key: string;
label: string;
}[]>;
fileInputModel: import("vue").Ref<string, string>;
remove: (filename: string) => void;
clearAll: () => void;
openFileDialog: () => void;
onInput: (event: Event) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
/**
* The disabled state of the component
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
/**
* Files are uploaded directly once added, there is no waiting to click a confirmation button
*/
directUpload: {
type: BooleanConstructor;
default: boolean;
};
/**
* Support multiple files.
*/
multiple: {
type: BooleanConstructor;
default: boolean;
};
/**
* HTML file input accept property for filtering the files the user is allowed to select. This is a mime type,
* e.g. 'application/pdf'.
*/
accept: {
type: StringConstructor;
default: null;
};
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
id: {
type: StringConstructor;
default: null;
};
/**
* The file component size
*/
size: {
type: () => NeonSize;
default: NeonSize;
};
/**
* The state of the input, used to indicate loading, success and error states
*/
state: {
type: () => NeonState;
default: NeonState;
};
/**
* The file component color
*/
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
/**
* The style of button to use for the upload
*/
buttonStyle: {
type: () => NeonButtonStyle;
default: NeonButtonStyle;
};
/**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
circular: {
type: BooleanConstructor;
default: null;
};
/**
* The label of the file component button
*/
label: {
type: StringConstructor;
default: null;
};
/**
* The icon of the file component button
*/
icon: {
type: StringConstructor;
default: null;
};
/**
* Title for the file upload button.
*/
title: {
type: StringConstructor;
default: string;
};
}>> & Readonly<{
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
}>, {
color: NeonFunctionalColor;
icon: string;
label: string;
id: string;
disabled: boolean;
title: string;
size: NeonSize;
buttonStyle: NeonButtonStyle;
state: NeonState;
circular: boolean;
directUpload: boolean;
multiple: boolean;
accept: string;
}, {}, {
NeonButton: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
href: {
type: StringConstructor;
default: null;
};
label: {
type: StringConstructor;
default: null;
};
size: {
type: () => import("../../../neon").NeonButtonSize;
default: import("../../../neon").NeonButtonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inverse: {
type: BooleanConstructor;
default: boolean;
};
alternateColor: {
type: () => NeonFunctionalColor;
default: null;
};
icon: {
type: StringConstructor;
default: null;
};
iconAriaLabel: {
type: StringConstructor;
};
iconPosition: {
type: () => import("../../../neon").NeonHorizontalPosition;
default: import("../../../neon").NeonHorizontalPosition;
};
buttonStyle: {
type: () => NeonButtonStyle;
default: NeonButtonStyle;
};
buttonType: {
type: () => import("../../../neon").NeonButtonType;
default: import("../../../neon").NeonButtonType;
};
state: {
type: () => NeonState;
default: NeonState;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
transparent: {
type: BooleanConstructor;
default: boolean;
};
outline: {
type: BooleanConstructor;
default: boolean;
};
circular: {
type: BooleanConstructor;
default: null;
};
fullWidth: {
type: BooleanConstructor;
default: null;
};
indicator: {
type: BooleanConstructor;
default: boolean;
};
indicatorExpanded: {
type: BooleanConstructor;
default: null;
};
}>, {
iconName: import("vue").ComputedRef<string>;
classes: import("vue").ComputedRef<(string | false | {
[x: string]: boolean | "" | NeonFunctionalColor;
'neon-button--text-transparent': boolean;
'neon-button--disabled': boolean;
'neon-button--inverse': boolean;
'neon-button--circular': boolean;
'neon-button--no-outline': boolean;
'neon-button--full-width': boolean;
'neon-button--with-icon neon-button--icon-only': boolean | "";
'neon-button--with-icon neon-button--icon-left': boolean | "";
'neon-button--with-icon neon-button--icon-right': boolean | "";
})[]>;
button: import("vue").Ref<HTMLElement | null, HTMLElement | null>;
attrs: {
[x: string]: unknown;
};
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
clickLink: () => void | undefined;
clickButton: () => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
href: {
type: StringConstructor;
default: null;
};
label: {
type: StringConstructor;
default: null;
};
size: {
type: () => import("../../../neon").NeonButtonSize;
default: import("../../../neon").NeonButtonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inverse: {
type: BooleanConstructor;
default: boolean;
};
alternateColor: {
type: () => NeonFunctionalColor;
default: null;
};
icon: {
type: StringConstructor;
default: null;
};
iconAriaLabel: {
type: StringConstructor;
};
iconPosition: {
type: () => import("../../../neon").NeonHorizontalPosition;
default: import("../../../neon").NeonHorizontalPosition;
};
buttonStyle: {
type: () => NeonButtonStyle;
default: NeonButtonStyle;
};
buttonType: {
type: () => import("../../../neon").NeonButtonType;
default: import("../../../neon").NeonButtonType;
};
state: {
type: () => NeonState;
default: NeonState;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
transparent: {
type: BooleanConstructor;
default: boolean;
};
outline: {
type: BooleanConstructor;
default: boolean;
};
circular: {
type: BooleanConstructor;
default: null;
};
fullWidth: {
type: BooleanConstructor;
default: null;
};
indicator: {
type: BooleanConstructor;
default: boolean;
};
indicatorExpanded: {
type: BooleanConstructor;
default: null;
};
}>> & Readonly<{
onClick?: ((...args: any[]) => any) | undefined;
}>, {
color: NeonFunctionalColor;
icon: string;
label: string;
inverse: boolean;
disabled: boolean;
href: string;
size: import("../../../neon").NeonButtonSize;
alternateColor: NeonFunctionalColor;
outline: boolean;
iconPosition: import("../../../neon").NeonHorizontalPosition;
buttonStyle: NeonButtonStyle;
buttonType: import("../../../neon").NeonButtonType;
state: NeonState;
transparent: boolean;
circular: boolean;
fullWidth: boolean;
indicator: boolean;
indicatorExpanded: boolean;
}, {}, {
NeonExpansionIndicator: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
expanded: {
type: BooleanConstructor;
default: boolean;
};
inverse: {
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
color: {
type: () => NeonFunctionalColor; /**
* The disabled state of the component
*/
default: null;
};
}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
expanded: {
type: BooleanConstructor;
default: boolean;
};
inverse: {
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
color: {
type: () => NeonFunctionalColor; /**
* The disabled state of the component
*/
default: null;
};
}>> & Readonly<{}>, {
color: NeonFunctionalColor;
inverse: boolean;
disabled: boolean;
expanded: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
id: {
type: StringConstructor;
default: null; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>, {
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
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; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{}>, {
color: NeonFunctionalColor;
id: string;
inverse: boolean;
disabled: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
NeonLink: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
href: {
type: StringConstructor;
default: null;
};
noStyle: {
type: BooleanConstructor;
default: boolean;
};
outlineStyle: {
type: () => import("../../../neon").NeonOutlineStyle;
default: import("../../../neon").NeonOutlineStyle;
};
externalIndicator: {
type: BooleanConstructor;
default: boolean;
};
}>, {
neonLink: import("vue").Ref<HTMLAnchorElement | null, HTMLAnchorElement | null>;
routerUrl: import("vue").ComputedRef<string | undefined>;
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
activeRoute: import("vue").ComputedRef<boolean | "" | undefined>;
exactRoute: import("vue").ComputedRef<boolean | "" | undefined>;
onClick: () => void;
onSpace: () => Promise<void>;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
href: {
type: StringConstructor;
default: null;
};
noStyle: {
type: BooleanConstructor;
default: boolean;
};
outlineStyle: {
type: () => import("../../../neon").NeonOutlineStyle;
default: import("../../../neon").NeonOutlineStyle;
};
externalIndicator: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{
onClick?: ((...args: any[]) => any) | undefined;
}>, {
href: string;
noStyle: boolean;
outlineStyle: import("../../../neon").NeonOutlineStyle;
externalIndicator: boolean;
}, {}, {
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
id: {
type: StringConstructor;
default: null; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>, {
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
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; /**
* The state of the input, used to indicate loading, success and error states
*/
};
color: {
type: () => NeonFunctionalColor;
default: null;
};
inverse: {
/**
* The style of button to use for the upload
*/
type: BooleanConstructor;
default: boolean;
};
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{}>, {
color: NeonFunctionalColor;
id: string;
inverse: boolean;
disabled: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
NeonInput: import("vue").DefineComponent<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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
debounce: {
type: NumberConstructor;
default: 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>;
counterLabel: import("vue").ComputedRef<string | null>;
focus: () => void;
click: () => void;
onFocus: () => void;
onBlur: () => void;
iconClicked: ($event: Event) => void;
changeValue: (event: InputEvent) => void;
onKeyDown: (event: KeyboardEvent) => void;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "blur" | "focus" | "icon-click")[], "update:modelValue" | "blur" | "focus" | "icon-click", import("vue").PublicProps, 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: {
/**
* Provide an id to attach to the internal HTML input[file] (also adds an aria-controls link between the button and
* the hidden input).
*/
type: () => NeonSize;
default: NeonSize;
};
color: {
type: () => NeonFunctionalColor;
default: NeonFunctionalColor;
};
inputmode: {
type: () => import("../../../neon").NeonInputMode;
default: import("../../../neon").NeonInputMode;
};
autocomplete: {
type: StringConstructor;
default: string; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
}; /**
* Make the button circular. NOTE: This is only for icon only buttons.
*/
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;
};
maxlengthLabel: {
type: StringConstructor;
default: string;
};
debounce: {
type: NumberConstructor;
default: undefined;