31:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardFrame"] 32:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardFrameHeader"] 33:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardFrameTitle"] 34:I[37322,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"DocsActions"] 35:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardFrameDescription"] 36:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"Card"] 37:I[27638,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"ScrollArea"] 38:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardPanel"] 39:I[73290,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"CardTitle"] 3a:I[64375,["/_next/static/immutable/chunks/3x7h0ttewt9ia.js","/_next/static/immutable/chunks/2mass52kqdrjx.js","/_next/static/immutable/chunks/1sclmqj6-jrep.js","/_next/static/immutable/chunks/0ml4d8kwmv_e4.js","/_next/static/immutable/chunks/0qds_ctlsjubu.js","/_next/static/immutable/chunks/3kb9yd9awwslo.js","/_next/static/immutable/chunks/0sk0u4l0j2tq6.js","/_next/static/immutable/chunks/26fq_7nmdes-5.js","/_next/static/immutable/chunks/3ser92we4t697.js","/_next/static/immutable/chunks/3fmbhfa0k47ht.js","/_next/static/immutable/chunks/1o9os4mn41acw.js","/_next/static/immutable/chunks/44xbqrgtrh42-.js","/_next/static/immutable/chunks/2i9bc6r7-79_a.js","/_next/static/immutable/chunks/3tado710-lydy.js","/_next/static/immutable/chunks/0c62aiueyqqq1.js","/_next/static/immutable/chunks/2s6ksse228_m4.js","/_next/static/immutable/chunks/2oar49tq76lwt.js","/_next/static/immutable/chunks/120bdgvtae9kp.js","/_next/static/immutable/chunks/3_ygk_cd-8nhe.js","/_next/static/immutable/chunks/3gri9ga9ywfem.js","/_next/static/immutable/chunks/1on7f-39apld8.js","/_next/static/immutable/chunks/2fh68me-jw2rg.js","/_next/static/immutable/chunks/1yk268ooxs2u4.js","/_next/static/immutable/chunks/3tq_ql7br_1ds.js","/_next/static/immutable/chunks/0rr1ndeuzy3f_.js","/_next/static/immutable/chunks/1wmpv47j59ufq.js","/_next/static/immutable/chunks/21f8owwaykjkr.js","/_next/static/immutable/chunks/3ih6m30-zuzu5.js"],"ComponentPreview",1] 21:["$","$L31",null,{"className":"after:inset-[-5px] after:-z-1 w-full h-full flex-1 after:pointer-events-none after:absolute after:rounded-[calc(var(--radius-xl)+4px)] after:border after:border-border/64","children":[["$","$L32",null,{"className":"static grid grid-rows-[auto_1fr] px-4 py-2 pt-0 z-10","children":["$","div",null,{"className":"flex mt-2 flex-col items-start justify-between w-full","children":[["$","div",null,{"className":"flex flex-col md:flex-row space-y-1 md:space-y-0 md:space-x-5 justify-between items-center w-full","children":[["$","$L33",null,{"className":"font-heading text-3xl font-bold tracking-tight","render":["$","h1",null,{"children":"Kbd"}]}],["$","$L34",null,{"name":"Kbd","description":"Keyboard key component.","slug":"kbd"}]]}],["$","div",null,{"children":["$","$L35",null,{"className":"text-lg text-muted-foreground","render":["$","p",null,{}],"children":"Keyboard key component."}]}]]}]}],["$","$L36",null,{"className":"pointer-events-none h-full flex-1 flex-col flex-wrap overflow-y-auto bg-[color-mix(in_srgb,var(--color-card),var(--color-sidebar))] dark:bg-background","children":["$","$L37",null,{"children":["$","$L38",null,{"className":"flex flex-col gap-12 flex-1 p-4 lg:px-6 pointer-events-auto","children":[["$","div",null,{"className":"space-y-4","children":[["$","$L39",null,{"className":"text-xl","render":["$","h2",null,{"id":"preview"}],"children":"Preview"}],["$","$L3a",null,{"name":"kbd","code":"import { Kbd, KbdGroup } from \"xiod-ui/kbd\";\n\nexport default function KbdExample() {\n return (\n

Single keys:

\n K\n ⌘\n ⌃\n ⇧\n

Key combinations:

\n ⌘ + K\n\n \n ⌘\n Shift\n P\n \n \n Ctrl\n Alt\n Delete\n \n

\n );\n}\n","children":["$","div",null,{"className":"flex flex-col gap-4","children":[["$","div",null,{"children":[["$","p",null,{"className":"mb-2 text-muted-foreground text-sm","children":"Single keys:"}],["$","div",null,{"className":"flex gap-2","children":[["$","kbd",null,{"className":"pointer-events-none relative inline-flex h-5 min-w-5 select-none items-center justify-center gap-1 rounded-sm border border-input border-b-2 bg-popover px-1.5 font-medium font-sans text-muted-foreground text-[10px] shadow-xs/5 before:absolute before:inset-0 before:pointer-events-none before:rounded-[inherit] before:shadow-[0_1px_var(--border)] [&_svg:not([class*='size-'])]:size-3","data-slot":"kbd","children":"K"}],["$","kbd",null,{"className":"pointer-events-none relative inline-flex h-5 min-w-5 select-none items-center justify-center gap-1 rounded-sm border border-input border-b-2 bg-popover px-1.5 font-medium font-sans text-muted-foreground text-[10px] shadow-xs/5 before:absolute before:inset-0 before:pointer-events-none before:rounded-[inherit] before:shadow-[0_1px_var(--border)] [&_svg:not([class*='size-'])]:size-3","data-slot":"kbd","children":"⌘"}],["$","kbd",null,{"className":"pointer-events-none relative inline-flex h-5 min-w-5 select-none items-center justify-center gap-1 rounded-sm border border-input border-b-2 bg-popover px-1.5 font-medium font-sans text-muted-foreground text-[10px] shadow-xs/5 before:absolute before:inset-0 before:pointer-events-none before:rounded-[inherit] before:shadow-[0_1px_var(--border)] [&_svg:not([class*='size-'])]:size-3","data-slot":"kbd","children":"⌃"}],"$L3b"]}]]}],"$L3c"]}]}]]}],"$L3d","$L3e","$L3f","$L40"]}]}]}]]}]

Loading...

Preview Skeleton

Installation Skeleton

Usage Skeleton

API Reference Skeleton

Kbd

Preview

Installation

Usage

Imports

Anatomy

API Reference