PageSourceSearch

https://www.solid-ui.com/_build/assets/tabs-CP3AuxTs.js

js solid-ui.com collected 2026-09-24 10:40:06 UTC 57,163 bytes, 167 lines download raw bytes

1import{M as y}from"./index-CZruN2I3.js";import{b as l,m as F}from"./web-Daoi1TEa.js";function h(r){const e=Object.assign({div:"div",pre:"pre",code:"code",span:"span",h2:"h2"},y(),r.components),{MDXHeader:t,ComponentPreview:a,Tabs:i,TabsList:d,TabsTrigger:s,TabsContent:c,Steps:E,Step:o,ComponentSource:p}=e;return a||n("ComponentPreview"),p||n("ComponentSource"),t||n("MDXHeader"),o||n("Step"),E||n("Steps"),i||n("Tabs"),c||n("TabsContent"),d||n("TabsList"),s||n("TabsTrigger"),[l(t,{title:"Tabs",description:"A set of layered sections of content—known as tab panels—that are displayed one at a time.",docs:"https://kobalte.dev/docs/core/components/tabs"}),`
2`,l(a,{name:"tabs-demo",get children(){return l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"tsx","data-theme":"default",get children(){return l(e.code,{"data-language":"tsx","data-theme":"default",style:{display:"grid"},get children(){return[l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { Button } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/components/ui/button"'})]}}),`
3`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
4`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  Card,"})}}),`
5`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  CardContent,"})}}),`
6`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  CardDescription,"})}}),`
7`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  CardFooter,"})}}),`
8`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  CardHeader,"})}}),`
9`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  CardTitle"})}}),`
10`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"} "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/components/ui/card"'})]}}),`
11`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { Tabs, TabsContent, TabsList, TabsTrigger } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/components/ui/tabs"'})]}}),`
12`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { TextField, TextFieldInput, TextFieldLabel } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/components/ui/text-field"'})]}}),`
13`,l(e.span,{"data-line":"",children:" "}),`
14`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"export"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"function"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsDemo"}),l(e.span,{style:{color:"#E1E4E8"},children:"() {"})]}}),`
15`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"return"}),l(e.span,{style:{color:"#E1E4E8"},children:" ("})]}}),`
16`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"Tabs"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"defaultValue"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"w-[400px]"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
17`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsList"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"grid w-full grid-cols-2"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
18`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Account</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
19`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Password</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
20`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      </"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsList"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
21`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
22`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        <"}),l(e.span,{style:{color:"#79B8FF"},children:"Card"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
23`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardHeader"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
24`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardTitle"}),l(e.span,{style:{color:"#E1E4E8"},children:">Account</"}),l(e.span,{style:{color:"#79B8FF"},children:"CardTitle"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
25`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardDescription"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
26`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"              Make changes to your account here. Click save when you're done."})}}),`
27`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardDescription"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
28`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardHeader"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
29`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-2"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
30`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-1"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
31`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">Name</"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
32`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldInput"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"Pedro Duarte"'}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"type"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"text"'}),l(e.span,{style:{color:"#E1E4E8"},children:" />"})]}}),`
33`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
34`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-1"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
35`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">Username</"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
36`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldInput"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"@peduarte"'}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"type"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"text"'}),l(e.span,{style:{color:"#E1E4E8"},children:" />"})]}}),`
37`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
38`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
39`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardFooter"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
40`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"Button"}),l(e.span,{style:{color:"#E1E4E8"},children:">Save changes</"}),l(e.span,{style:{color:"#79B8FF"},children:"Button"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
41`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardFooter"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
42`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        </"}),l(e.span,{style:{color:"#79B8FF"},children:"Card"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
43`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      </"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
44`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
45`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        <"}),l(e.span,{style:{color:"#79B8FF"},children:"Card"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
46`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardHeader"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
47`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardTitle"}),l(e.span,{style:{color:"#E1E4E8"},children:">Password</"}),l(e.span,{style:{color:"#79B8FF"},children:"CardTitle"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
48`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardDescription"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
49`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"              Change your password here. After saving, you'll be logged out."})}}),`
50`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardDescription"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
51`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardHeader"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
52`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-2"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
53`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-1"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
54`,l(e.span,{"data-l
54ine":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">Current password</"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
55`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldInput"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"type"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:" />"})]}}),`
56`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
57`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"space-y-1"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
58`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">New password</"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldLabel"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
59`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"              <"}),l(e.span,{style:{color:"#79B8FF"},children:"TextFieldInput"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"type"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:" />"})]}}),`
60`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            </"}),l(e.span,{style:{color:"#79B8FF"},children:"TextField"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
61`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
62`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          <"}),l(e.span,{style:{color:"#79B8FF"},children:"CardFooter"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
63`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"            <"}),l(e.span,{style:{color:"#79B8FF"},children:"Button"}),l(e.span,{style:{color:"#E1E4E8"},children:">Save password</"}),l(e.span,{style:{color:"#79B8FF"},children:"Button"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
64`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"          </"}),l(e.span,{style:{color:"#79B8FF"},children:"CardFooter"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
65`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        </"}),l(e.span,{style:{color:"#79B8FF"},children:"Card"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
66`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      </"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
67`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    </"}),l(e.span,{style:{color:"#79B8FF"},children:"Tabs"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
68`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  )"})}}),`
69`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}})]}})}})}})}}),`
70`,l(e.h2,{id:"installation",children:"Installation"}),`
71`,l(i,{defaultValue:"cli",get children(){return[l(d,{get children(){return[l(s,{value:"cli",children:"CLI"}),l(s,{value:"manual",children:"Manual"})]}}),l(c,{value:"cli",get children(){return l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"bash","data-theme":"default",get children(){return l(e.code,{"data-language":"bash","data-theme":"default",style:{display:"grid"},get children(){return l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#B392F0"},children:"npx"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:"solidui-cli@latest"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:"add"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:"tabs"})]}})}})}})}})}}),l(c,{value:"manual",get children(){return l(E,{get children(){return[l(o,{children:"Install the following dependencies: "}),l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"bash","data-theme":"default",get children(){return l(e.code,{"data-language":"bash","data-theme":"default",style:{display:"grid"},get children(){return l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#B392F0"},children:"npm"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:"install"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:"@kobalte/core"})]}})}})}})}}),l(o,{children:"Copy and paste the following code into your project: "}),l(p,{name:"tabs",get children(){return l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"tsx","data-theme":"default",get children(){return l(e.code,{"data-language":"tsx","data-theme":"default",style:{display:"grid"},get children(){return[l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" { ValidComponent } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"solid-js"'})]}}),`
72`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { splitProps } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"solid-js"'})]}}),`
73`,l(e.span,{"data-line":"",children:" "}),`
74`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" { PolymorphicProps } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"@kobalte/core/polymorphic"'})]}}),`
75`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"*"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"as"}),l(e.span,{style:{color:"#E1E4E8"},children:" TabsPrimitive "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"@kobalte/core/tabs"'})]}}),`
76`,l(e.span,{"data-line":"",children:" "}),`
77`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { cn } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/lib/utils"'})]}}),`
78`,l(e.span,{"data-line":"",children:" "}),`
79`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"Tabs"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" TabsPrimitive.Root"})]}}),`
80`,l(e.span,{"data-line":"",children:" "}),`
81`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsListProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsPrimitive"}),l(e.span,{style:{color:"#E1E4E8"},children:"."}),l(e.span,{style:{color:"#B392F0"},children:"TabsListProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"&"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
82`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}
82),l(e.span,{style:{color:"#FFAB70"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"?:"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"string"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"|"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"undefined"})]}}),`
83`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
84`,l(e.span,{"data-line":"",children:" "}),`
85`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsList"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" <"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:">("})]}}),`
86`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#FFAB70"},children:"props"}),l(e.span,{style:{color:"#F97583"},children:":"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"PolymorphicProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#B392F0"},children:"TabsListProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:">>"})]}}),`
87`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:") "}),l(e.span,{style:{color:"#F97583"},children:"=>"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
88`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" ["}),l(e.span,{style:{color:"#79B8FF"},children:"local"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#79B8FF"},children:"others"}),l(e.span,{style:{color:"#E1E4E8"},children:"] "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"splitProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"(props "}),l(e.span,{style:{color:"#F97583"},children:"as"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsListProps"}),l(e.span,{style:{color:"#E1E4E8"},children:", ["}),l(e.span,{style:{color:"#9ECBFF"},children:'"class"'}),l(e.span,{style:{color:"#E1E4E8"},children:"])"})]}}),`
89`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"return"}),l(e.span,{style:{color:"#E1E4E8"},children:" ("})]}}),`
90`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsPrimitive.List"})]}}),`
91`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:"{"}),l(e.span,{style:{color:"#B392F0"},children:"cn"}),l(e.span,{style:{color:"#E1E4E8"},children:"("})]}}),`
92`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        "}),l(e.span,{style:{color:"#9ECBFF"},children:'"inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground"'}),l(e.span,{style:{color:"#E1E4E8"},children:","})]}}),`
93`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"        local.class"})}}),`
94`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"      )}"})}}),`
95`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      {"}),l(e.span,{style:{color:"#F97583"},children:"..."}),l(e.span,{style:{color:"#E1E4E8"},children:"others}"})]}}),`
96`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"    />"})}}),`
97`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  )"})}}),`
98`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
99`,l(e.span,{"data-line":"",children:" "}),`
100`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsTriggerProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"button"'}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsPrimitive"}),l(e.span,{style:{color:"#E1E4E8"},children:"."}),l(e.span,{style:{color:"#B392F0"},children:"TabsTriggerProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"&"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
101`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}
101),l(e.span,{style:{color:"#FFAB70"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"?:"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"string"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"|"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"undefined"})]}}),`
102`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
103`,l(e.span,{"data-line":"",children:" "}),`
104`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" <"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"button"'}),l(e.span,{style:{color:"#E1E4E8"},children:">("})]}}),`
105`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#FFAB70"},children:"props"}),l(e.span,{style:{color:"#F97583"},children:":"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"PolymorphicProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#B392F0"},children:"TabsTriggerProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:">>"})]}}),`
106`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:") "}),l(e.span,{style:{color:"#F97583"},children:"=>"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
107`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" ["}),l(e.span,{style:{color:"#79B8FF"},children:"local"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#79B8FF"},children:"others"}),l(e.span,{style:{color:"#E1E4E8"},children:"] "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"splitProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"(props "}),l(e.span,{style:{color:"#F97583"},children:"as"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsTriggerProps"}),l(e.span,{style:{color:"#E1E4E8"},children:", ["}),l(e.span,{style:{color:"#9ECBFF"},children:'"class"'}),l(e.span,{style:{color:"#E1E4E8"},children:"])"})]}}),`
108`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"return"}),l(e.span,{style:{color:"#E1E4E8"},children:" ("})]}}),`
109`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsPrimitive.Trigger"})]}}),`
110`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:"{"}),l(e.span,{style:{color:"#B392F0"},children:"cn"}),l(e.span,{style:{color:"#E1E4E8"},children:"("})]}}),`
111`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        "}),l(e.span,{style:{color:"#9ECBFF"},children:'"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[selected]:bg-background data-[selected]:text-foreground data-[selected]:sha
111dow-sm"'}),l(e.span,{style:{color:"#E1E4E8"},children:","})]}}),`
112`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"        local.class"})}}),`
113`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"      )}"})}}),`
114`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      {"}),l(e.span,{style:{color:"#F97583"},children:"..."}),l(e.span,{style:{color:"#E1E4E8"},children:"others}"})]}}),`
115`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"    />"})}}),`
116`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  )"})}}),`
117`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
118`,l(e.span,{"data-line":"",children:" "}),`
119`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsContentProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsPrimitive"}),l(e.span,{style:{color:"#E1E4E8"},children:"."}),l(e.span,{style:{color:"#B392F0"},children:"TabsContentProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"&"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
120`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#FFAB70"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"?:"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"string"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"|"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"undefined"})]}}),`
121`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
122`,l(e.span,{"data-line":"",children:" "}),`
123`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" <"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:">("})]}}),`
124`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#FFAB70"},children:"props"}),l(e.span,{style:{color:"#F97583"},children:":"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"PolymorphicProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#B392F0"},children:"TabsContentProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:">>"})]}}),`
125`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:") "}),l(e.span,{style:{color:"#F97583"},children:"=>"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
126`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" ["}),l(e.span,{style:{color:"#79B8FF"},children:"local"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#79B8FF"},children:"others"}),l(e.span,{style:{color:"#E1E4E8"},children:"] "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"splitProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"(props "}),l(e.span,{style:{color:"#F97583"},children:"as"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsContentProps"}),l(e.span,{style:{color:"#E1E4E8"},children:", ["}),l(e.span,{style:{color:"#9ECBFF"},children:'"class"'}),l(e.span,{style:{color:"#E1E4E8"},children:"])"})]}}),`
127`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"return"}),l(e.span,{style:{color:"#E1E4E8"},children:" ("})]}}),`
128`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsPrimitive.Content"})]}}),`
129`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:"{"}),l(e.span,{style:{color:"#B392F0"},children:"cn"}),l(e.span,{style:{color:"#E1E4E8"},children:"("})]}}),`
130`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        "}),l(e.span,{style:{color:"#9ECBFF"},children:'"mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"'}),l(e.span,{style:{color:"#E1E4E8"},children:","})]}}),`
131`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"        local.class"})}}),`
132`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"      )}"})}}),`
133`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      {"}),l(e.span,{style:{color:"#F97583"},children:"..."}),l(e.span,{style:{color:"#E1E4E8"},children:"others}"})]}}),`
134`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"    />"})}}),`
135`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  )"})}}),`
136`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
137`,l(e.span,{"data-line":"",children:" "}),`
138`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"type"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsIndicatorProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsPrimitive"}),l(e.span,{style:{color:"#E1E4E8"},children:"."}),l(e.span,{style:{color:"#B392F0"},children:"TabsIndicatorProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:"> "}),l(e.span,{style:{color:"#F97583"},children:"&"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
139`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}
139),l(e.span,{style:{color:"#FFAB70"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"?:"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"string"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"|"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#79B8FF"},children:"undefined"})]}}),`
140`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
141`,l(e.span,{"data-line":"",children:" "}),`
142`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsIndicator"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" <"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"extends"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"ValidComponent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"div"'}),l(e.span,{style:{color:"#E1E4E8"},children:">("})]}}),`
143`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#FFAB70"},children:"props"}),l(e.span,{style:{color:"#F97583"},children:":"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"PolymorphicProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#B392F0"},children:"TabsIndicatorProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#B392F0"},children:"T"}),l(e.span,{style:{color:"#E1E4E8"},children:">>"})]}}),`
144`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:") "}),l(e.span,{style:{color:"#F97583"},children:"=>"}),l(e.span,{style:{color:"#E1E4E8"},children:" {"})]}}),`
145`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"const"}),l(e.span,{style:{color:"#E1E4E8"},children:" ["}),l(e.span,{style:{color:"#79B8FF"},children:"local"}),l(e.span,{style:{color:"#E1E4E8"},children:", "}),l(e.span,{style:{color:"#79B8FF"},children:"others"}),l(e.span,{style:{color:"#E1E4E8"},children:"] "}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"splitProps"}),l(e.span,{style:{color:"#E1E4E8"},children:"(props "}),l(e.span,{style:{color:"#F97583"},children:"as"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"TabsIndicatorProps"}),l(e.span,{style:{color:"#E1E4E8"},children:", ["}),l(e.span,{style:{color:"#9ECBFF"},children:'"class"'}),l(e.span,{style:{color:"#E1E4E8"},children:"])"})]}}),`
146`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  "}),l(e.span,{style:{color:"#F97583"},children:"return"}),l(e.span,{style:{color:"#E1E4E8"},children:" ("})]}}),`
147`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsPrimitive.Indicator"})]}}),`
148`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#E1E4E8"},children:"{"}),l(e.span,{style:{color:"#B392F0"},children:"cn"}),l(e.span,{style:{color:"#E1E4E8"},children:"("})]}}),`
149`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"        "}),l(e.span,{style:{color:"#9ECBFF"},children:'"duration-250ms absolute transition-all data-[orientation=horizontal]:-bottom-px data-[orientation=vertical]:-right-px data-[orientation=horizontal]:h-[2px] data-[orientation=vertical]:w-[2px]"'}),l(e.span,{style:{color:"#E1E4E8"},children:","})]}}),`
150`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"        local.class"})}}),`
151`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"      )}"})}}),`
152`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"      {"}),l(e.span,{style:{color:"#F97583"},children:"..."}),l(e.span,{style:{color:"#E1E4E8"},children:"others}"})]}}),`
153`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"    />"})}}),`
154`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"  )"})}}),`
155`,l(e.span,{"data-line":"",get children(){return l(e.span,{style:{color:"#E1E4E8"},children:"}"})}}),`
156`,l(e.span,{"data-line":"",children:" "}),`
157`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"export"}),l(e.span,{style:{color:"#E1E4E8"},children:" { Tabs, TabsList, TabsTrigger, TabsContent, TabsIndicator }"})]}})]}})}})}})}})]}})}})]}}),`
158`,l(e.h2,{id:"usage",children:"Usage"}),`
159`,l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"tsx","data-theme":"default",get children(){return l(e.code,{"data-language":"tsx","data-theme":"default",style:{display:"grid"},get children(){return l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#F97583"},children:"import"}),l(e.span,{style:{color:"#E1E4E8"},children:" { Tabs, TabsContent, TabsList, TabsTrigger } "}),l(e.span,{style:{color:"#F97583"},children:"from"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#9ECBFF"},children:'"~/components/ui/tabs"'})]}})}})}})}}),`
160`,l(e.div,{"data-rehype-pretty-code-fragment":"",get children(){return l(e.pre,{style:{backgroundColor:"#24292e"},tabIndex:"0","data-language":"tsx","data-theme":"default",get children(){return l(e.code,{"data-language":"tsx","data-theme":"default",style:{display:"grid"},get children(){return[l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"<"}),l(e.span,{style:{color:"#79B8FF"},children:"Tabs"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"defaultValue"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"w-[400px]"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
161`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsList"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"class"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"grid w-full grid-cols-2"'}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
162`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Account</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
163`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"    <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Password</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsTrigger"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
164`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  </"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsList"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
165`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"account"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Account Tab</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
166`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"  <"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:" "}),l(e.span,{style:{color:"#B392F0"},children:"value"}),l(e.span,{style:{color:"#F97583"},children:"="}),l(e.span,{style:{color:"#9ECBFF"},children:'"password"'}),l(e.span,{style:{color:"#E1E4E8"},children:">Password Tab</"}),l(e.span,{style:{color:"#79B8FF"},children:"TabsContent"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}}),`
167`,l(e.span,{"data-line":"",get children(){return[l(e.span,{style:{color:"#E1E4E8"},children:"</"}),l(e.span,{style:{color:"#79B8FF"},children:"Tabs"}),l(e.span,{style:{color:"#E1E4E8"},children:">"})]}})]}})}})}})]}function B(r={}){const{wrapper:e}=Object.assign({},y(),r.components);return e?l(e,F(r,{get children(){return l(h,r)}})):h(r)}function n(r,e){throw new Error("Expected component `"+r+"` to be defined: you likely forgot to import, pass, or provide it.")}export{B as default};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.