UNPKG

@wix/design-system

Version:

@wix/design-system

137 lines (134 loc) 5.16 kB
### dataHook - type: string - description: Applies a data-hook HTML attribute that can be used in the tests. ### className - type: string - description: Specifies a CSS class name to be appended to the component's root element. - internal ### ariaControls - type: string - description: Associate a control with the regions that it controls. ### ariaDescribedby - type: string - description: Associate a region with its descriptions. Similar to aria-controls but instead associating descriptions to the region and description identifiers are separated with a space. ### ariaLabel - type: string - description: Define a string that labels the current element in case where a text label is not visible on the screen. ### autoFocus - type: boolean - description: Focus the element on mount (standard React input autoFocus). ### autoSelect - type: boolean - description: Automatically selects the entire input text ### size - type: "small" | "medium" - description: Controls the size of the input. ### defaultValue - type: string - description: Sets a default value for those who want to use this component un-controlled. ### disabled - type: boolean - description: Specifies whether input should be disabled. ### forceFocus - type: boolean - description: USED FOR TESTING. Forces focus state on the input. ### forceHover - type: boolean - description: USED FOR TESTING. Forces hover state on the input. ### hasCounter - type: boolean - description: Specifies whether character count is enabled. ### id - type: string - description: Assigns an unique identifier for the root element. ### name - type: string - description: Reference element data when a form is submitted. ### maxHeight - type: string - description: Sets the maximum height of an area in pixels. ### maxLength - type: number - description: Defines the maximum text length in number of characters. ### minLength - type: number - description: Defines the minimum text length in number of characters. ### menuArrow - type: boolean - description: Specifies whether input should have a dropdown menu arrow on the right side ### minHeight - type: string - description: Sets the minimum height of an area in pixels. ### onBlur - type: FocusEventHandler - description: Defines a standard input onBlur callback ### onChange - type: ChangeEventHandler - description: Defines a standard input onChange callback. ### onEnterPressed - type: KeyboardEventHandler<HTMLTextAreaElement> - description: Defines a callback handler that is called when user presses enter. ### onEscapePressed - type: () => void - description: Defines a callback handler that is called when user presses escape. ### onFocus - type: (e?: FocusEvent<HTMLTextAreaElement, Element> | undefined) => void - description: Defines a standard input onFocus callback. ### onKeyDown - type: KeyboardEventHandler<HTMLTextAreaElement> - description: Defines a standard input onKeyDown callback. ### onKeyUp - type: KeyboardEventHandler<HTMLTextAreaElement> - description: Defines a standard input onKeyUp callback. ### onCompositionStart - type: (event: CompositionEvent<HTMLTextAreaElement>) => void - description: Defines a standard input onCompositionStart callback. ### onCompositionEnd - type: (event: CompositionEvent<HTMLTextAreaElement>) => void - description: Defines a standard input onCompositionEnd callback. ### placeholder - type: string - description: Sets a placeholder message to display. ### readOnly - type: boolean - description: Specifies whether input is read only. ### resizable - type: boolean - description: Specifies whether area can be manually resized by the user. ### rows - type: number - description: Sets initial height of an area to fit a specified number of rows. ### autoGrow - type: boolean - description: Specifies whether area should grow and shrink according to user input. ### minRowsAutoGrow - type: number - description: Sets the minimum amount of rows the component can have in `autoGrow` mode - default: 2 ### maxRowsAutoGrow - type: number - description: Sets the maximum amount of rows the component can have in `autoGrow` mode ### tabIndex - type: number - description: Indicates that element can be focused and where it participates in sequential keyboard navigation. ### tooltipPlacement - type: "right" | "left" | "auto" | "auto-start" | "auto-end" | "top-start" | "top" | "top-end" | "right-start" | "right-end" | "bottom-end" | "bottom" | "bottom-start" | "left-end" | "left-start" - description: Controls placement of a status tooltip. ### value - type: string - description: Defines input value. ### required - type: boolean - description: Specifies whether the input area is a mandatory field. ### dir - type: "auto" | "rtl" | "ltr" - description: Specifies the text direction. Use "auto" to automatically determine direction based on content. ### status - type: "loading" | "error" | "warning" - description: Specifies the status of a field. ### statusMessage - type: ReactNode - description: Defines the message to display on status icon hover. If not given or empty there will be no tooltip. ### children - type: InputAreaChildrenFnArgs - description: Specifies custom textarea render function