Welcome UI logo
FOUNDATIONSCOMPONENTSBLOG650+
10.0.0

Menu

    Actions

    • Button
    • ButtonGroup
    • Close Button
    • Link

    Data display

    • Accordion
    • Avatar
    • Badge
    • Card
    • Swiper
    • Table
    • Tag
    • VisuallyHidden

    Feedback

    • Alert
    • StickyNote

      NEW

    • Toast

    Forms

    • Checkbox
    • DatePicker
    • DateTimePicker
    • Field
    • FileDrop
    • FileUpload
    • Hint
    • InputText
    • Label
    • PasswordInput
    • Radio
    • RadioGroup
    • RadioTab
    • Search
    • Select
    • Slider
    • Textarea
    • TimePicker
    • Toggle

    Icons & logo

    • Icon
    • IconStamp

      NEW

    • Logo
    • VariantIcon
    • WelcomeLoader

    Layout

    • AspectRatio
    • Loader
    • Window

      NEW

    Navigation

    • Breadcrumb
    • DropdownMenu
    • Pagination
    • Stepper

      NEW

    • Tabs

    Overlay

    • Drawer
    • Modal
    • Popover
    • Tooltip

    Typography

    • Text

    Utilities

    • Grid background

Overview

Props

InputText

The InputText component is a fundamental UI element that allows users to enter and edit text. It is commonly used in forms, search fields, and data entry interfaces. This component ensures efficient user input handling, offering features like placeholder text, validation, and various input types.

Source
Github
import { InputText } from 'welcome-ui/InputText'
const Example = () => {
return <InputText name="firstName" placeholder="Welcome" />
}
export default Example

Examples

Variants

Use warning, danger, or success properties to add a variant status on your input text.

Github

Disabled

Property disabled can be pass to the component or Field component

Github

Sizes

Use size property with option:

  • sm (25px)
  • md (33px)
  • lg (43px - default)
Github

Icon

Pass an icon through to decorate your InputText.

Use iconPlacement to put on left (default) or right.

Github

Clearable

Use the isClearable prop to add a cross button to remove the content (value) of the TextInput

Github

Transparent

Pass transparent to remove background-color and border-color

Github
HintLabel

On this page

  • Definition
  • Examples
    • Variants
    • Disabled
    • Sizes
    • Icon
    • Clearable
    • Transparent
Made with by
Welcome to the jungle logo

Documentations

  • Foundations
  • Components
  • Source code

Updates

  • Releases
  • Issues

Community

  • Github
  • Twitter
  • Medium
  • Jobs