UNPKG

@aotearoan/neon

Version:

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

1,400 lines (1,399 loc) 68.4 kB
import { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor'; import { NeonBadgeSize } from '@/model/presentation/badge/NeonBadgeSize'; /** * A badge is a small square or circular component for representing user avatars. These can be in the form of an image, an icon or a two character string (e.g. the user's initials). */ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{ /** * The two character <em>initials</em> to display on the badge. */ label: { type: StringConstructor; default: null; }; /** * URL of the image to display on the badge. */ image: { type: StringConstructor; default: null; }; /** * An icon to display on the badge. */ icon: { type: StringConstructor; default: null; }; /** * If true, render the badge as a circle, instead of a square. */ circular: { type: BooleanConstructor; default: boolean; }; /** * The size of the badge - s, m, l, xl, xxl. */ size: { type: () => NeonBadgeSize; default: NeonBadgeSize; }; /** * The color of the badge. This is one of the provided NeonFunctionalColors. */ color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; /** * Alternate color for creating gradient badges. NOTE: can also be the same color as 'color'. */ alternateColor: { type: () => NeonFunctionalColor; default: null; }; /** * Allow editing of the image. This will place an image file lookup button on top of the image allowing the user to * choose a new image to upload. */ editable: { type: BooleanConstructor; default: boolean; }; /** * Accept string for the filetype to support selecting. */ accept: { type: StringConstructor; default: string; }; /** * Display the badge in the disable style */ disabled: { type: BooleanConstructor; default: boolean; }; /** * Apply the generated Jazzicon style based on the unique identified provided (e.g. a wallet address, name, etc) */ jazziconId: { type: StringConstructor; default: null; }; /** * Badge image alt text. */ imageAlt: { type: StringConstructor; default: string; }; /** * Title for the file upload button in edit mode. */ editButtonTitle: { type: StringConstructor; default: string; }; }>, { emit: (event: "change-image", ...args: any[]) => void; svg: import("vue").ComputedRef<string | null>; }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change-image"[], "change-image", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{ /** * The two character <em>initials</em> to display on the badge. */ label: { type: StringConstructor; default: null; }; /** * URL of the image to display on the badge. */ image: { type: StringConstructor; default: null; }; /** * An icon to display on the badge. */ icon: { type: StringConstructor; default: null; }; /** * If true, render the badge as a circle, instead of a square. */ circular: { type: BooleanConstructor; default: boolean; }; /** * The size of the badge - s, m, l, xl, xxl. */ size: { type: () => NeonBadgeSize; default: NeonBadgeSize; }; /** * The color of the badge. This is one of the provided NeonFunctionalColors. */ color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; /** * Alternate color for creating gradient badges. NOTE: can also be the same color as 'color'. */ alternateColor: { type: () => NeonFunctionalColor; default: null; }; /** * Allow editing of the image. This will place an image file lookup button on top of the image allowing the user to * choose a new image to upload. */ editable: { type: BooleanConstructor; default: boolean; }; /** * Accept string for the filetype to support selecting. */ accept: { type: StringConstructor; default: string; }; /** * Display the badge in the disable style */ disabled: { type: BooleanConstructor; default: boolean; }; /** * Apply the generated Jazzicon style based on the unique identified provided (e.g. a wallet address, name, etc) */ jazziconId: { type: StringConstructor; default: null; }; /** * Badge image alt text. */ imageAlt: { type: StringConstructor; default: string; }; /** * Title for the file upload button in edit mode. */ editButtonTitle: { type: StringConstructor; default: string; }; }>> & Readonly<{ "onChange-image"?: ((...args: any[]) => any) | undefined; }>, { color: NeonFunctionalColor; icon: string; label: string; disabled: boolean; image: string; size: NeonBadgeSize; alternateColor: NeonFunctionalColor; circular: boolean; accept: string; editable: boolean; jazziconId: string; imageAlt: string; editButtonTitle: string; }, {}, { NeonFile: import("vue").DefineComponent<import("vue").ExtractPropTypes<{ disabled: { type: BooleanConstructor; default: boolean; }; directUpload: { type: BooleanConstructor; default: boolean; }; multiple: { type: BooleanConstructor; default: boolean; }; accept: { type: StringConstructor; default: null; }; id: { type: StringConstructor; default: null; }; size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").NeonState; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; buttonStyle: { type: () => import("../../../neon").NeonButtonStyle; default: import("../../../neon").NeonButtonStyle; }; circular: { type: BooleanConstructor; default: null; }; /** * Accept string for the filetype to support selecting. */ label: { type: StringConstructor; default: null; }; icon: { type: StringConstructor; default: null; }; 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; /** * An icon to display on the badge. */ }; /** * An icon to display on the badge. */ size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; inputmode: { type: () => import("../../../neon").NeonInputMode; default: import("../../../neon").NeonInputMode; }; autocomplete: { type: StringConstructor; default: string; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: import("../../../neon").NeonSize; placeholder: string; tabindex: number; inputmode: import("../../../neon").NeonInputMode; modelValue: string; state: import("../../../neon").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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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; /** * An icon to display on the badge. */ }; /** * An icon to display on the badge. */ size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; inputmode: { type: () => import("../../../neon").NeonInputMode; default: import("../../../neon").NeonInputMode; }; autocomplete: { type: StringConstructor; default: string; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: import("../../../neon").NeonSize; placeholder: string; tabindex: number; inputmode: import("../../../neon").NeonInputMode; modelValue: string; state: import("../../../neon").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; /** * An icon to display on the badge. */ }; /** * An icon to display on the badge. */ size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; inputmode: { type: () => import("../../../neon").NeonInputMode; default: import("../../../neon").NeonInputMode; }; autocomplete: { type: StringConstructor; default: string; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: import("../../../neon").NeonSize; placeholder: string; tabindex: number; inputmode: import("../../../neon").NeonInputMode; modelValue: string; state: import("../../../neon").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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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; /** * An icon to display on the badge. */ }; /** * An icon to display on the badge. */ size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; inputmode: { type: () => import("../../../neon").NeonInputMode; default: import("../../../neon").NeonInputMode; }; autocomplete: { type: StringConstructor; default: string; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: import("../../../neon").NeonSize; placeholder: string; tabindex: number; inputmode: import("../../../neon").NeonInputMode; modelValue: string; state: import("../../../neon").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<{ disabled: { type: BooleanConstructor; default: boolean; }; directUpload: { type: BooleanConstructor; default: boolean; }; multiple: { type: BooleanConstructor; default: boolean; }; accept: { type: StringConstructor; default: null; }; id: { type: StringConstructor; default: null; }; size: { type: () => import("../../../neon").NeonSize; default: import("../../../neon").NeonSize; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").NeonState; }; color: { type: () => NeonFunctionalColor; default: NeonFunctionalColor; }; buttonStyle: { type: () => import("../../../neon").NeonButtonStyle; default: import("../../../neon").NeonButtonStyle; }; circular: { type: BooleanConstructor; default: null; }; /** * Accept string for the filetype to support selecting. */ label: { type: StringConstructor; default: null; }; icon: { type: StringConstructor; default: null; }; 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: import("../../../neon").NeonSize; buttonStyle: import("../../../neon").NeonButtonStyle; state: import("../../../neon").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: () => import("../../../neon").NeonButtonStyle; default: import("../../../neon").NeonButtonStyle; }; buttonType: { type: () => import("../../../neon").NeonButtonType; default: import("../../../neon").NeonButtonType; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: () => import("../../../neon").NeonButtonStyle; default: import("../../../neon").NeonButtonStyle; }; buttonType: { type: () => import("../../../neon").NeonButtonType; default: import("../../../neon").NeonButtonType; }; state: { type: () => import("../../../neon").NeonState; default: import("../../../neon").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: import("../../../neon").NeonButtonStyle; buttonType: import("../../../neon").NeonButtonType; state: import("../../../neon").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; 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; 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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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 color of the badge. This is one of the provided NeonFunctionalColors. */ }; color: { type: () => NeonFunctionalColor; default: null; }; inverse: { 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 color of the badge. This is one of the provided NeonFunctionalColors.