Tabs
ラベル付きパネルを切り替え、キーボードによる自動または手動のアクティブ化に対応します。
デモを読み込み中…
<Tabs.Root value={tab()} onValueChange={setTab}>
<Tabs.List>
<Tabs.Tab value="general" index={0}>General</Tabs.Tab>
<Tabs.Tab value="advanced" index={1}>Advanced</Tabs.Tab>
<Tabs.Indicator />
</Tabs.List>
<Tabs.Panel value="general"><General /></Tabs.Panel>
<Tabs.Panel value="advanced"><Advanced /></Tabs.Panel>
</Tabs.Root>#インポート
@quickgui/solid から Tabs をインポートします。
import { Tabs } from "@quickgui/solid";#使い方
<Tabs.Root value={tab()} onValueChange={setTab}>
<Tabs.List>
<Tabs.Tab value="general" index={0}>General</Tabs.Tab>
<Tabs.Tab value="advanced" index={1}>Advanced</Tabs.Tab>
<Tabs.Indicator />
</Tabs.List>
<Tabs.Panel value="general"><General /></Tabs.Panel>
<Tabs.Panel value="advanced"><Advanced /></Tabs.Panel>
</Tabs.Root>#構成
Tabs.RootTabs.ListTabs.TabTabs.IndicatorTabs.Panel
<Tabs.Root>
<Tabs.List />
<Tabs.Tab />
<Tabs.Indicator />
<Tabs.Panel />
</Tabs.Root>#API リファレンス
項目を展開すると説明と完全なシグネチャが表示されます。ダッシュは宣言に既定値が記載されていないことを示します。
Tabs
ソースを見るTabs(props: JSX.TabsRootProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るvaluestring—
defaultValuestring—
Declares defaultValue (optional). Reactive JSX expressions update this property in place.
stringソースを見るonValueChange(value: string, event: QuickGuiEvent) => void—
Declares onValueChange (optional). Reactive JSX expressions update this property in place.
(value: string, event: QuickGuiEvent) => voidソースを見るorientation"horizontal" | "vertical"—
Declares orientation (optional). Reactive JSX expressions update this property in place.
"horizontal" | "vertical"ソースを見るactivation"manual" | "automatic"—
`"manual"` activates on Enter or Space; `"automatic"` activates on arrow focus.
"manual" | "automatic"ソースを見るloopboolean—
keepMountedboolean—
onTabsStateChange(state: TabsState, event: QuickGuiEvent) => void—
Everything the core decided about the tab set. `activationDirection` is Base UI's `data-activation-direction`, and `indicator` is the active tab's laid-out box published during the paint QuickGUI was already performing.
(state: TabsState, event: QuickGuiEvent) => voidソースを見るTabs.Root
ソースを見るTabs.Root(props: JSX.TabsRootProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るvaluestring—
defaultValuestring—
Declares defaultValue (optional). Reactive JSX expressions update this property in place.
stringソースを見るonValueChange(value: string, event: QuickGuiEvent) => void—
Declares onValueChange (optional). Reactive JSX expressions update this property in place.
(value: string, event: QuickGuiEvent) => voidソースを見るorientation"horizontal" | "vertical"—
Declares orientation (optional). Reactive JSX expressions update this property in place.
"horizontal" | "vertical"ソースを見るactivation"manual" | "automatic"—
`"manual"` activates on Enter or Space; `"automatic"` activates on arrow focus.
"manual" | "automatic"ソースを見るloopboolean—
keepMountedboolean—
onTabsStateChange(state: TabsState, event: QuickGuiEvent) => void—
Everything the core decided about the tab set. `activationDirection` is Base UI's `data-activation-direction`, and `indicator` is the active tab's laid-out box published during the paint QuickGUI was already performing.
(state: TabsState, event: QuickGuiEvent) => voidソースを見るTabs.List
ソースを見るTabs.List(props: JSX.NativeProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るTabs.Tab
ソースを見るTabs.Tab(props: JSX.TabsTabProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るvaluestring—
indexnumber—
Tabs.Indicator
ソースを見るTabs.Indicator(props: JSX.TabsIndicatorProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るvaluestring—
placementPopoverPlacement—
Anchor the indicator to the active tab's edge, and publish that tab's box back. `"bottom"` draws the familiar underline. Without a placement the indicator is a plain part on the active tab and no geometry is reported.
PopoverPlacementソースを見るTabs.Panel
ソースを見るTabs.Panel(props: JSX.TabsPanelProps): NativeNodeaccessibilityLabelstring—
Declares accessibilityLabel (optional). Reactive JSX expressions update this property in place.
stringソースを見るchildrenunknown—
styleStyleProp—
disabledboolean—
invalidboolean—
selectedboolean—
groupboolean | string—
Makes this element the group its descendants' `groupHover` and `groupActive` styles follow, like Tailwind's `group`: `true` opens an unnamed group, and a string names it so a descendant can follow it past a nearer group with `groupHover: { group: "name" }`.
boolean | stringソースを見るrolestring—
tabIndexnumber—
focusOnPointerboolean—
overlayboolean—
focusTrapboolean—
restorePreviousFocusboolean—
autoFocusboolean—
aria-modalboolean—
ariaModalboolean—
dismissOnEscapeboolean—
Declares dismissOnEscape (optional). Reactive JSX expressions update this property in place.
booleanソースを見るdismissOnPointerOutsideboolean—
Declares dismissOnPointerOutside (optional). Reactive JSX expressions update this property in place.
booleanソースを見るtooltipstring—
tooltipPlacementPopoverPlacement—
Declares tooltipPlacement (optional). Reactive JSX expressions update this property in place.
PopoverPlacementソースを見るtooltipDelaynumber—
tooltipGapnumber—
tooltipViewportMarginnumber—
Declares tooltipViewportMargin (optional). Reactive JSX expressions update this property in place.
numberソースを見るhitSlopnumber | string—
Declares hitSlop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopTopnumber | string—
Declares hitSlopTop (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopRightnumber | string—
Declares hitSlopRight (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopBottomnumber | string—
Declares hitSlopBottom (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るhitSlopLeftnumber | string—
Declares hitSlopLeft (optional). Reactive JSX expressions update this property in place.
number | stringソースを見るaria-labelstring—
ariaLabelstring—
ref((node: NativeNode) => void) | NativeNode—
Declares ref (optional). Reactive JSX expressions update this property in place.
((node: NativeNode) => void) | NativeNodeソースを見るonClickEventHandler—
Declares onClick (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseEnterEventHandler—
Declares onMouseEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseLeaveEventHandler—
Declares onMouseLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEnterEventHandler—
Declares onPointerEnter (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerLeaveEventHandler—
Declares onPointerLeave (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPointerEventHandler—
Captured pointer stream from press through release/cancel, including outside the element.
EventHandlerソースを見るonInputEventHandler—
Declares onInput (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonChangeEventHandler—
Declares onChange (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSubmitEventHandler—
Declares onSubmit (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDismissEventHandler—
Declares onDismiss (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonKeyDownEventHandler—
onKeyUpEventHandler—
Declares onKeyUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseDownEventHandler—
Declares onMouseDown (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseUpEventHandler—
Declares onMouseUp (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonMouseMoveEventHandler—
Declares onMouseMove (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDoubleClickEventHandler—
onWheelEventHandler—
Declares onWheel (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonContextMenuEventHandler—
onPinchEventHandler—
Declares onPinch (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonRotateEventHandler—
Declares onRotate (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonSmartMagnifyEventHandler—
Declares onSmartMagnify (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonPressureEventHandler—
Declares onPressure (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFocusEventHandler—
Declares onFocus (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonBlurEventHandler—
Declares onBlur (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るkeymapKeymap—
onActionEventHandler—
draggableboolean | DragSource—
onDragStartEventHandler—
Declares onDragStart (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonDragEndEventHandler—
Declares onDragEnd (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るdropKindsDropKind | readonly DropKind[]—
Payload kinds this element accepts, declared ahead of the native drag.
DropKind | readonly DropKind[]ソースを見るonDropEventHandler—
Declares onDrop (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見るonFilesDroppedEventHandler—
Declares onFilesDropped (optional). Reactive JSX expressions update this property in place.
EventHandlerソースを見る