@aotearoan/neon
Version:
Neon is a lightweight design library of Vue 3 components with minimal dependencies.
197 lines (196 loc) • 5.54 kB
TypeScript
import type { NeonToggleModel } from '@/model/user-input/toggle/NeonToggleModel';
import { NeonSize } from '@/model/common/size/NeonSize';
import { NeonFunctionalColor } from '@/model/common/color/NeonFunctionalColor';
import { NeonToggleStyle } from '@/model/user-input/toggle/NeonToggleStyle';
import { NeonOrientation } from '@/model/common/layout/NeonOrientation';
/**
* <p>A toggle component for selecting one value from a range of options. This is equivalent to a radio button group. It can be styled as a <em>Toggle</em> or as <em>Radio buttons</em>.
*/
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
/**
* The name of the radio button group.
*/
name: {
type: StringConstructor;
required: true;
};
/**
* The key of the selected option.
*/
modelValue: {
type: StringConstructor;
required: true;
};
/**
* The list of options to present to the user.
*/
model: {
type: () => Array<NeonToggleModel>;
required: true;
};
/**
* The style of toggle to display to the user.
*/
toggleStyle: {
type: () => NeonToggleStyle;
default: () => NeonToggleStyle;
};
/**
* The size of the toggle.
*/
size: {
type: () => NeonSize;
default: () => NeonSize;
};
/**
* The orientation of the toggle if the style is a radio button group.
*/
orientation: {
type: () => NeonOrientation;
default: () => NeonOrientation;
};
/**
* The color of the toggle.
*/
color: {
type: () => NeonFunctionalColor;
default: () => NeonFunctionalColor;
};
/**
* Whether the toggle is disabled.
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>, {
selectOption: (option: NeonToggleModel) => void;
onInput: (option: NeonToggleModel) => void;
sanitizedAttributes: import("vue").ComputedRef<{
[x: string]: unknown;
}>;
slots: Readonly<{
[name: string]: import("vue").Slot<any> | undefined;
}>;
NeonToggleStyle: typeof NeonToggleStyle;
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
/**
* The name of the radio button group.
*/
name: {
type: StringConstructor;
required: true;
};
/**
* The key of the selected option.
*/
modelValue: {
type: StringConstructor;
required: true;
};
/**
* The list of options to present to the user.
*/
model: {
type: () => Array<NeonToggleModel>;
required: true;
};
/**
* The style of toggle to display to the user.
*/
toggleStyle: {
type: () => NeonToggleStyle;
default: () => NeonToggleStyle;
};
/**
* The size of the toggle.
*/
size: {
type: () => NeonSize;
default: () => NeonSize;
};
/**
* The orientation of the toggle if the style is a radio button group.
*/
orientation: {
type: () => NeonOrientation;
default: () => NeonOrientation;
};
/**
* The color of the toggle.
*/
color: {
type: () => NeonFunctionalColor;
default: () => NeonFunctionalColor;
};
/**
* Whether the toggle is disabled.
*/
disabled: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
}>, {
color: NeonFunctionalColor;
disabled: boolean;
size: NeonSize;
orientation: NeonOrientation;
toggleStyle: NeonToggleStyle;
}, {}, {
NeonIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
id: {
type: StringConstructor;
default: null;
};
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;
};
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>;
}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export default _default;