@wix/design-system
Version:
@wix/design-system
43 lines • 1.87 kB
TypeScript
import { ValuesOf } from '../utils/typeUtils';
import { SIZE } from './InputShell.constants';
type InputShellAsButtonProps<T> = T & {
/** Renders the component as button. */
as: 'button';
/** Specifies whether user interactions are disabled.
* @default false
*/
disabled?: boolean;
/** Indicates that element can be focused and where it participates in sequential keyboard navigation. */
tabIndex?: number;
/** Indicates the element can trigger a popup and what kind of popup will be displayed. */
'aria-haspopup'?: boolean | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog' | 'true' | 'false';
/** Identifies the element whose contents or presence are controlled by the component. */
'aria-controls'?: string;
/** A callback function called on component click. */
onClick?: React.MouseEventHandler<HTMLButtonElement>;
};
type InputShellAsDivProps<T> = T & {
/** Renders the component as div. */
as?: 'div';
/** A callback function called on component click. */
onClick?: React.MouseEventHandler<HTMLDivElement>;
};
type InputShellWithAsProp<T> = InputShellAsButtonProps<T> | InputShellAsDivProps<T>;
export type InputShellProps = InputShellWithAsProp<{
/** Applies a data-hook HTML attribute to be used in the tests. */
dataHook?: string;
/** Allows to render any component as a child item. */
children?: React.ReactNode;
/** Specifies whether input should have a dropdown menu arrow on the right side.
* @default false
*/
menuArrow?: boolean;
/** Controls visual focus state. */
focused?: boolean | 'auto';
/** Controls the size of the input. Default value: `medium` */
size?: ValuesOf<typeof SIZE>;
/** Sets a placeholder message to display */
placeholder?: React.ReactNode;
}>;
export {};
//# sourceMappingURL=InputShell.types.d.ts.map