@ownclouders/design-system
Version:
ownCloud Design System is based on VueDesign Systems and is used to design ownCloud UI components
64 lines (63 loc) • 2.56 kB
TypeScript
/**
* @component OcTextarea
* @description A customizable textarea component that supports validation states,
* accessibility features, and various user interactions.
*
* @example
* <OcTextarea
* v-model="textContent"
* label="Description"
* description-message="description"
* />
*
* <OcTextarea
* v-model="comment"
* label="Comment"
* error-message="This field is required"
* @change="submitComment"
* />
* </template>
*
* @prop {string} [id] - Unique identifier for the textarea. Auto-generated if not provided.
* @prop {string} [modelValue] - The value of the textarea (for v-model binding).
* @prop {string} [label] - Label text displayed above the textarea.
* @prop {string} [warningMessage] - Warning message to display below the textarea.
* @prop {string} [errorMessage] - Error message to display below the textarea.
* @prop {string} [descriptionMessage] - Description message to display below the textarea.
* @prop {boolean} [fixMessageLine=false] - Whether to always show the message line, even without a message.
* @prop {boolean} [submitOnEnter=true] - Whether to emit change event when Enter is pressed.
*
* @event {string} update:modelValue - Emitted when the input value changes.
* @event {boolean} focus - Emitted when the textarea is focused.
* @event {string} change - Emitted when Enter is pressed and submitOnEnter is true.
* @event {KeyboardEvent} keydown - Emitted when any key is pressed.
*
* @method focus() - Programmatically focus the textarea.
*/
interface Props {
id?: string;
modelValue?: string;
label?: string;
warningMessage?: string;
errorMessage?: string;
descriptionMessage?: string;
fixMessageLine?: boolean;
submitOnEnter?: boolean;
}
declare function focus(): void;
declare const _default: import('vue').DefineComponent<Props, {
focus: typeof focus;
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
focus: (value: boolean) => any;
keydown: (value: KeyboardEvent) => any;
change: (value: string) => any;
"update:modelValue": (value: string) => any;
}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
onFocus?: (value: boolean) => any;
onKeydown?: (value: KeyboardEvent) => any;
onChange?: (value: string) => any;
"onUpdate:modelValue"?: (value: string) => any;
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {
textAreaRef: HTMLTextAreaElement;
}, HTMLDivElement>;
export default _default;