How do I install the Stacked Tabs Shell block?

Install the free SDK with `bun add @otfdashkit/ui` (or npm/pnpm) and import { StackedLayoutTabs }. Copy-paste distribution is also supported.

Is the Stacked Tabs Shell block free to use?

Yes. Stacked Tabs Shell ships in @otfdashkit/ui, part of the free MIT-licensed OTF SDK on npm — use it in personal and commercial projects.

Which platform does this Stacked Tabs Shell page cover?

This page documents the web version (@otfdashkit/ui); the OTF SDK's web and native packages share component names and design tokens where a counterpart exists, but props differ per platform.

Stacked Tabs Shell

App shellsMIT

View in Storybook

App shell variant with horizontal top-tab navigation instead of a sidebar.

bun add @otfdashkit/ui

Preview

Stacked Tabs ShellApp shells

Code

@otfdashkit/ui

import { StackedLayoutTabs } from '@otfdashkit/ui'

export function Example() {
  return (
    <StackedLayoutTabs />
  )
}

Free with the SDK. This block ships in @otfdashkit/ui under the MIT license.

Props

Props declared in the StackedLayoutTabs source. Inherited HTML attributes are not listed.

Prop	Type	Default
brandName	string	'Acme Inc'
children	ReactNode
className	string

Preview

Code

Props

Related