Skip to content

Input Group

@astryxdesign/core v0.7.1 · InputGroup

InputGroup Props ​

NameTypeDefaultDescription
size'sm' | 'md' | 'lg''md'Size of the group, passed through to the controls inside it.
labelstring—Accessible name. When set, the group shows a label, description, optional or required mark, and status.
isLabelHiddenbooleanfalseHides the label visually. Screen readers still read it.
descriptionstring—Help text between the label and the control.
disabledbooleanfalseDisables the group and the selectors inside it.
isOptionalbooleanfalseMarks the label as optional.
isRequiredbooleanfalseMarks the label as required.
statusFieldStatusInput—Status on the group border and under the control.
labelTooltipstring—Tooltip at the end of the label.

InputGroup slots ​

NameDescription
defaultThe input control in the middle.
beforeText, icon, or button shown before the input.
afterText, icon, or button shown after the input.

InputGroupText ​

Fixed text inside an addon. It has no props of its own. Put the text in the default slot.