Skip to content

Input

Input

Wrap over the input elements.

jsx
import Input from 'intergalactic/input';
<Input />;

InputProps

& & & {...}
NameTypeDescription
disabledboolean Sets the input and addons to the disabled state
size Input size
state"normal" | "invalid" | "valid" Sets the input state

Input.Value

This component represents the native tag input and accepts all its properties, such as value and onChange.

jsx
import Input from 'intergalactic/input';
<Input.Value />;

InputValueProps

& & & {...}
NameTypeDescription
valuestring Input value
defaultValuestring Default value if `value` property is not provided
onChange(value: string, event: React.SyntheticEvent<>) => void Handler for changing the value
disabledbooleanDeprecated
readOnlyboolean Sets the input to the read-only state
size Input size
placeholderstring Placeholder for input

Input.Addon

The addon inside the input (most often it is an icon) places the correct indent units depending on the size. The addon can be interactive.

When you click on Addon, the focus shifts to the input. You can cancel this by returning the return false in the onMouseDown handler.

jsx
import Input from 'intergalactic/input';
<Input.Addon />;

InputAddonProps

& & {...}
NameTypeDescription
interactiveboolean Adds styles for interactive icons
disabledboolean Blocks the addon
size Input size

Released under the MIT License.

Released under the MIT License.