[ @sdxc/ui/mixins ]
tabKeys
Delegated arrow-key activation for a Tabs list.
import { tabKeys } from "@sdxc/ui/mixins";Usage
Adds delegated arrow-key activation to a Tabs list, adapting the shared
@remix-run/ui/tabs context instead of tracking tab order itself. Capturing
and stopping handled keys pre-empts a same-key tab() binding per tab.
Signature
tabKeys(options?: TabKeysOptions): MixinDescriptor<HTMLElement>Parameters
| Parameter | Type | Description |
|---|---|---|
options? | TabKeysOptions |
Examples
<tabs.Context defaultActiveTab="overview">
<div role="tablist" mix={tabKeys()}>
<button mix={tabs.tab({ name: "overview" })}>Overview</button>
<button mix={tabs.tab({ name: "activity" })}>Activity</button>
</div>
</tabs.Context>Used with it
The events, constants and types its module publishes, each imported from @sdxc/ui/mixins too.
Interface
TabKeysOptions
Options accepted by tabKeys. Reserved for future configuration; the mixin needs no per-call arguments today.