Volue logo
Volue logomark
Wave Core
Show Hide
    v1.15.5 • 16-10-2025
    Jump to section

    Layout

    Flex row or grid component allow for a lot of flexibility when building form layouts. Use dB and other micro-layout helpers to stack form elements.

    Select day

    Custom field combinations

    Files

    Validation states

    To notify the user of validation errors, add .is-invalid class to each form control that has not passed validation and show an error message below. If a form is in an error state, you can also show large notification block.

    Work time is required.
    Small input is required.
    Please provide a valid e-mail address.
    Files
    Please select some file.
    Select day
    Set status

    In rare cases you may want to visually highlight sucessfull/valid input by adding .is-valid class to the form control. Likewise, you can communicate a warning by adding .has-warning class.

    Provided password is weak.
    Url looks good!

    Date & time

    Select start date and time
    Must be a valid date in format dd.mm.yyyy
    Must be a valid time in format hh:mm
    Select end date and time
    Must be a valid date in format dd.mm.yyyy
    Must be a valid time in format hh:mm
    Announcement

    This is the technical documentation of Wave Core library, the foundational part of Wave Design System.

    We are excited to announce brand new design system site and a set of polished React components that aim to work out of the box, be accessible and deliver superior developer and user experience. Browse the new Wave Design System site and Wave React components docs at https://wave.volue.com.