Adwaveui NPM | npm.io

Components

Input

<adw-input
    placeholder="Put in your name"
></adw-input>

Properties

Property	Description	Default
`disabled`	If the input is disabled or not.	"false"
`form`	The form the input belongs to.
`maxlength`	The maximum length of the input.
`minlength`	The minimum length of the input.
`name`	The name of the input, used when submitting a form.
`placeholder`	Text displayed when the input is empty.
`suggestions`	List of suggested strings to display when the input is focused.
`suggestionsorientation`	Determines whether the list of suggestions appears above or below the input field. `up` or `down`.	"down"
`suggestionsshowall`	Set to "true" to always display all the suggestions.	"false"
`fuzzy`	When set to "true" the suggestions will be filtered using a fuzzy search algorithm as the user types. By default filtering is done using a simple string match.
`type`	The type of the input. (text, password, email, etc.)	"text"
`value`	The current value of the input.

Selector

<adw-selector placeholder="Select option">
    <adw-option value="1" selected="true">
        Option 1
    </adw-option>
    <adw-option value="2">
        Option 2
    </adw-option>
    <adw-option value="3">
        Option 3
    </adw-option>
</adw-selector>

Properties

Property	Description	Default
`disabled`	If the selector is disabled or not.	"false"
`form`	The form the selector belongs to.
`name`	The name of the selector, used when submitting a form.
`orientation`	Determines whether the list of options appears above or below the selector. `up` or `down`.	"down"
`placeholder`	Text displayed when no option is selected.

adw-option properties

Property	Description	Default
`selected`	If the option is selected or not.	"false"
`value`	The value of the option.

Slider

<adw-slider
    min="0"
    max="100"
    value="50"
></adw-slider>

Properties

Property	Description	Default
`disabled`	If the slider is disabled or not.	"false"
`form`	The form the slider belongs to.
`max`	The maximum value on the slider.	100
`min`	The minimum value on the slider.	0
`name`	The name of the slider, used when submitting a form.
`precision`	The number of decimal places to round the value to.	4
`step`	The amount to increment or decrement the value by when moving the slider.	1
`value`	The current value of the slider.

Switch

<adw-switch
    active="true"
></adw-switch>

Properties

Property	Description	Default
`disabled`	If the switch is disabled or not.
`form`	The form the switch belongs to.
`name`	The name of the switch, used when submitting a form.
`active`	If the switch is active or not.	"false"

adwaita libadwaita gnome gtk ui css web components input selector slider switch

adwavecss jsxte jsxte-wc

@everything-registry/sub-chunk-1102

1 month ago

2 months ago

3 months ago

6 months ago

7 months ago