Yamada UIにスターをあげる
スターSliderは、ユーザーが値の範囲から選択するために使用されるコンポーネントです。
説明
The visual color appearance of the component.
タイプ
"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"デフォルト
"primary"説明
The initial value of the slider.
タイプ
number説明
The CSS color property. Used in color of filled track element.
タイプ
UIValue<"border" | ({} & string) | Color | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | ... 318 more ... | "yellow.950">説明
Props for slider filled track element.
タイプ
SliderFilledTrackProps説明
If false, the slider handle will not capture focus when value changes.
タイプ
booleanデフォルト
true説明
The base id to use for the slider.
タイプ
string説明
Props for slider input element.
タイプ
HTMLUIProps<"input">説明
If true, the form control will be disabled.
タイプ
booleanデフォルト
false説明
If true, the form control will be invalid.
タイプ
booleanデフォルト
false説明
If true, the form control will be readonly.
タイプ
booleanデフォルト
false説明
If true, the form control will be required.
タイプ
booleanデフォルト
false説明
If true, the value will be incremented or decremented in reverse.
タイプ
boolean説明
The maximum allowed value of the slider. Cannot be less than min.
タイプ
numberデフォルト
100説明
The minimum allowed value of the slider. Cannot be greater than max.
タイプ
numberデフォルト
0説明
The name attribute of the hidden input field.
This is particularly useful in forms.
タイプ
string説明
Function called whenever the slider value changes.
タイプ
(value: number) => void説明
Function called when the user is done selecting a new value.
タイプ
(value: number) => void説明
Function called when the user starts selecting a new value.
タイプ
(value: number) => void説明
The orientation of the slider.
タイプ
"horizontal" | "vertical"デフォルト
'horizontal'説明
The size of the Slider.
タイプ
"sm" | "md" | "lg"デフォルト
"md"説明
The step in which increments or decrements have to be made.
タイプ
numberデフォルト
1説明
The CSS background property. Used in background of thumb element.
タイプ
UIValue<"border" | ({} & string) | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | "amber.950" | ... 318 more ... | Background<...>>説明
Props for slider thumb element.
タイプ
SliderThumbProps説明
The CSS box-size property.
Used for calculating the width, height, and percentage of the container element.
タイプ
UIValue<number | "px" | "max" | "min" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "-moz-max-content" | "-moz-min-content" | "-webkit-fit-content" | ... 75 more ... | "xs">説明
The CSS color property. Used in color of track element.
タイプ
UIValue<"border" | ({} & string) | Color | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | ... 318 more ... | "yellow.950">説明
Props for slider track element.
タイプ
SliderTrackProps説明
The CSS height property. Used in height of track element.
タイプ
UIValue<number | "px" | "max" | "min" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "-moz-max-content" | "-moz-min-content" | "-webkit-fit-content" | ... 71 more ... | "xs">説明
The value of the slider.
タイプ
number説明
The variant of the Slider.
タイプ
stringGitHubでこのページを編集する