[{"data":1,"prerenderedAt":1595},["ShallowReactive",2],{"selaras-docs-navigation":3,"selaras-docs:\u002Foverview\u002Finstallation":682},[4,11,128,525,584,626],{"title":5,"path":6,"stem":7,"order":8,"icon":9,"collapse":10,"navBadges":9},"Selaras","\u002F","index",1,null,false,{"title":12,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":14,"stem":15,"children":16,"page":10},"Overview",10,"\u002Foverview","overview",[17,70,107],{"title":18,"order":13,"icon":9,"collapse":10,"navBadges":9,"path":19,"stem":20,"children":21,"page":10},"Getting Started","\u002Foverview\u002Fgetting-started","overview\u002Fgetting-started",[22,26,31,36,41,46,51,56,61,66],{"title":23,"path":24,"stem":25,"order":13,"icon":9,"collapse":10,"navBadges":9},"Introduction","\u002Foverview\u002Fgetting-started\u002Fintroduction","overview\u002Fgetting-started\u002Fintroduction",{"title":27,"path":28,"stem":29,"order":30,"icon":9,"collapse":10,"navBadges":9},"Installation","\u002Foverview\u002Fgetting-started\u002Finstallation","overview\u002Fgetting-started\u002Finstallation",20,{"title":32,"path":33,"stem":34,"order":35,"icon":9,"collapse":10,"navBadges":9},"Component usage","\u002Foverview\u002Fgetting-started\u002Fcomponent-usage","overview\u002Fgetting-started\u002Fcomponent-usage",30,{"title":37,"path":38,"stem":39,"order":40,"icon":9,"collapse":10,"navBadges":9},"Nuxt configuration","\u002Foverview\u002Fgetting-started\u002Fnuxt-configuration","overview\u002Fgetting-started\u002Fnuxt-configuration",40,{"title":42,"path":43,"stem":44,"order":45,"icon":9,"collapse":10,"navBadges":9},"Icons","\u002Foverview\u002Fgetting-started\u002Ficons","overview\u002Fgetting-started\u002Ficons",50,{"title":47,"path":48,"stem":49,"order":50,"icon":9,"collapse":10,"navBadges":9},"Messages and localization","\u002Foverview\u002Fgetting-started\u002Fmessages","overview\u002Fgetting-started\u002Fmessages",60,{"title":52,"path":53,"stem":54,"order":55,"icon":9,"collapse":10,"navBadges":9},"Adaptive interfaces","\u002Foverview\u002Fgetting-started\u002Fadaptive-interfaces","overview\u002Fgetting-started\u002Fadaptive-interfaces",70,{"title":57,"path":58,"stem":59,"order":60,"icon":9,"collapse":10,"navBadges":9},"TypeScript","\u002Foverview\u002Fgetting-started\u002Ftypescript","overview\u002Fgetting-started\u002Ftypescript",80,{"title":62,"path":63,"stem":64,"order":65,"icon":9,"collapse":10,"navBadges":9},"Accessibility","\u002Foverview\u002Fgetting-started\u002Faccessibility","overview\u002Fgetting-started\u002Faccessibility",90,{"title":67,"path":68,"stem":69,"order":65,"icon":9,"collapse":10,"navBadges":9},"Migrating to 1.0","\u002Foverview\u002Fgetting-started\u002Fmigrating-to-1","overview\u002Fgetting-started\u002Fmigrating-to-1",{"title":71,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":72,"stem":73,"children":74,"page":10},"Theming","\u002Foverview\u002Ftheming","overview\u002Ftheming",[75,78,82,86,90,94,99,103],{"title":71,"path":76,"stem":77,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Foverview\u002Ftheming\u002Foverview","overview\u002Ftheming\u002Foverview",{"title":79,"path":80,"stem":81,"order":30,"icon":9,"collapse":10,"navBadges":9},"CSS tokens","\u002Foverview\u002Ftheming\u002Fcss-tokens","overview\u002Ftheming\u002Fcss-tokens",{"title":83,"path":84,"stem":85,"order":35,"icon":9,"collapse":10,"navBadges":9},"Color roles","\u002Foverview\u002Ftheming\u002Fcolor-roles","overview\u002Ftheming\u002Fcolor-roles",{"title":87,"path":88,"stem":89,"order":40,"icon":9,"collapse":10,"navBadges":9},"Color modes","\u002Foverview\u002Ftheming\u002Fcolor-modes","overview\u002Ftheming\u002Fcolor-modes",{"title":91,"path":92,"stem":93,"order":45,"icon":9,"collapse":10,"navBadges":9},"Component styling","\u002Foverview\u002Ftheming\u002Fcomponent-styling","overview\u002Ftheming\u002Fcomponent-styling",{"title":95,"path":96,"stem":97,"order":98,"icon":9,"collapse":10,"navBadges":9},"Global configuration","\u002Foverview\u002Ftheming\u002Fglobal-configuration","overview\u002Ftheming\u002Fglobal-configuration",55,{"title":100,"path":101,"stem":102,"order":50,"icon":9,"collapse":10,"navBadges":9},"Scoped themes","\u002Foverview\u002Ftheming\u002Fscoped-themes","overview\u002Ftheming\u002Fscoped-themes",{"title":104,"path":105,"stem":106,"order":55,"icon":9,"collapse":10,"navBadges":9},"Complete themes","\u002Foverview\u002Ftheming\u002Fcomplete-themes","overview\u002Ftheming\u002Fcomplete-themes",{"title":108,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":109,"stem":110,"children":111,"page":10},"Agent Support","\u002Foverview\u002Fagent-support","overview\u002Fagent-support",[112,116,120,124],{"title":113,"path":114,"stem":115,"order":13,"icon":9,"collapse":10,"navBadges":9},"Agent support","\u002Foverview\u002Fagent-support\u002Foverview","overview\u002Fagent-support\u002Foverview",{"title":117,"path":118,"stem":119,"order":30,"icon":9,"collapse":10,"navBadges":9},"Documentation exports","\u002Foverview\u002Fagent-support\u002Fdocumentation","overview\u002Fagent-support\u002Fdocumentation",{"title":121,"path":122,"stem":123,"order":35,"icon":9,"collapse":10,"navBadges":9},"Skills","\u002Foverview\u002Fagent-support\u002Fskills","overview\u002Fagent-support\u002Fskills",{"title":125,"path":126,"stem":127,"order":40,"icon":9,"collapse":10,"navBadges":9},"MCP","\u002Foverview\u002Fagent-support\u002Fmcp","overview\u002Fagent-support\u002Fmcp",{"title":129,"order":30,"icon":9,"collapse":10,"navBadges":9,"path":130,"stem":131,"children":132,"page":10},"Components","\u002Fcomponents","components",[133,210,313,336,380,433,486],{"title":134,"path":135,"stem":136,"children":137,"page":10},"Elements","\u002Fcomponents\u002Felements","components\u002Felements",[138,142,147,152,157,162,166,171,176,181,186,191,196,201,205],{"title":139,"path":140,"stem":141,"order":13,"icon":9,"collapse":10,"navBadges":9},"Button","\u002Fcomponents\u002Felements\u002Fbutton","components\u002Felements\u002Fbutton",{"title":143,"path":144,"stem":145,"order":146,"icon":9,"collapse":10,"navBadges":9},"ButtonGroup","\u002Fcomponents\u002Felements\u002Fbutton-group","components\u002Felements\u002Fbutton-group",10.5,{"title":148,"path":149,"stem":150,"order":151,"icon":9,"collapse":10,"navBadges":9},"Badge","\u002Fcomponents\u002Felements\u002Fbadge","components\u002Felements\u002Fbadge",11,{"title":153,"path":154,"stem":155,"order":156,"icon":9,"collapse":10,"navBadges":9},"Avatar","\u002Fcomponents\u002Felements\u002Favatar","components\u002Felements\u002Favatar",11.25,{"title":158,"path":159,"stem":160,"order":161,"icon":9,"collapse":10,"navBadges":9},"AvatarGroup","\u002Fcomponents\u002Felements\u002Favatar-group","components\u002Felements\u002Favatar-group",11.5,{"title":163,"path":164,"stem":165,"order":161,"icon":9,"collapse":10,"navBadges":9},"Chip","\u002Fcomponents\u002Felements\u002Fchip","components\u002Felements\u002Fchip",{"title":167,"path":168,"stem":169,"order":170,"icon":9,"collapse":10,"navBadges":9},"Icon","\u002Fcomponents\u002Felements\u002Ficon","components\u002Felements\u002Ficon",12,{"title":172,"path":173,"stem":174,"order":175,"icon":9,"collapse":10,"navBadges":9},"Skeleton","\u002Fcomponents\u002Felements\u002Fskeleton","components\u002Felements\u002Fskeleton",12.5,{"title":177,"path":178,"stem":179,"order":180,"icon":9,"collapse":10,"navBadges":9},"Separator","\u002Fcomponents\u002Felements\u002Fseparator","components\u002Felements\u002Fseparator",12.75,{"title":182,"path":183,"stem":184,"order":185,"icon":9,"collapse":10,"navBadges":9},"Alert","\u002Fcomponents\u002Felements\u002Falert","components\u002Felements\u002Falert",12.9,{"title":187,"path":188,"stem":189,"order":190,"icon":9,"collapse":10,"navBadges":9},"Toggle","\u002Fcomponents\u002Felements\u002Ftoggle","components\u002Felements\u002Ftoggle",12.92,{"title":192,"path":193,"stem":194,"order":195,"icon":9,"collapse":10,"navBadges":9},"Toggle Group","\u002Fcomponents\u002Felements\u002Ftoggle-group","components\u002Felements\u002Ftoggle-group",12.94,{"title":197,"path":198,"stem":199,"order":200,"icon":9,"collapse":10,"navBadges":9},"Kbd","\u002Fcomponents\u002Felements\u002Fkbd","components\u002Felements\u002Fkbd",12.95,{"title":202,"path":203,"stem":204,"order":200,"icon":9,"collapse":10,"navBadges":9},"Toolbar","\u002Fcomponents\u002Felements\u002Ftoolbar","components\u002Felements\u002Ftoolbar",{"title":206,"path":207,"stem":208,"order":209,"icon":9,"collapse":10,"navBadges":9},"Progress","\u002Fcomponents\u002Felements\u002Fprogress","components\u002Felements\u002Fprogress",12.97,{"title":211,"path":212,"stem":213,"children":214,"page":10},"Forms","\u002Fcomponents\u002Fforms","components\u002Fforms",[215,219,224,229,233,238,243,248,253,258,263,268,273,278,283,288,293,298,303,308],{"title":216,"path":217,"stem":218,"order":30,"icon":9,"collapse":10,"navBadges":9},"Input","\u002Fcomponents\u002Fforms\u002Finput","components\u002Fforms\u002Finput",{"title":220,"path":221,"stem":222,"order":223,"icon":9,"collapse":10,"navBadges":9},"InputGroup","\u002Fcomponents\u002Fforms\u002Finput-group","components\u002Fforms\u002Finput-group",20.25,{"title":225,"path":226,"stem":227,"order":228,"icon":9,"collapse":10,"navBadges":9},"Editable","\u002Fcomponents\u002Fforms\u002Feditable","components\u002Fforms\u002Feditable",20.5,{"title":230,"path":231,"stem":232,"order":228,"icon":9,"collapse":10,"navBadges":9},"InputNumber","\u002Fcomponents\u002Fforms\u002Finput-number","components\u002Fforms\u002Finput-number",{"title":234,"path":235,"stem":236,"order":237,"icon":9,"collapse":10,"navBadges":9},"Slider","\u002Fcomponents\u002Fforms\u002Fslider","components\u002Fforms\u002Fslider",20.75,{"title":239,"path":240,"stem":241,"order":242,"icon":9,"collapse":10,"navBadges":9},"PinInput","\u002Fcomponents\u002Fforms\u002Fpin-input","components\u002Fforms\u002Fpin-input",20.9,{"title":244,"path":245,"stem":246,"order":247,"icon":9,"collapse":10,"navBadges":9},"Textarea","\u002Fcomponents\u002Fforms\u002Ftextarea","components\u002Fforms\u002Ftextarea",21,{"title":249,"path":250,"stem":251,"order":252,"icon":9,"collapse":10,"navBadges":9},"FileUpload","\u002Fcomponents\u002Fforms\u002Ffile-upload","components\u002Fforms\u002Ffile-upload",21.5,{"title":254,"path":255,"stem":256,"order":257,"icon":9,"collapse":10,"navBadges":9},"Select","\u002Fcomponents\u002Fforms\u002Fselect","components\u002Fforms\u002Fselect",22,{"title":259,"path":260,"stem":261,"order":262,"icon":9,"collapse":10,"navBadges":9},"Listbox","\u002Fcomponents\u002Fforms\u002Flistbox","components\u002Fforms\u002Flistbox",22.5,{"title":264,"path":265,"stem":266,"order":267,"icon":9,"collapse":10,"navBadges":9},"TransferList","\u002Fcomponents\u002Fforms\u002Ftransfer-list","components\u002Fforms\u002Ftransfer-list",22.75,{"title":269,"path":270,"stem":271,"order":272,"icon":9,"collapse":10,"navBadges":9},"Autocomplete","\u002Fcomponents\u002Fforms\u002Fautocomplete","components\u002Fforms\u002Fautocomplete",23,{"title":274,"path":275,"stem":276,"order":277,"icon":9,"collapse":10,"navBadges":9},"DatePicker","\u002Fcomponents\u002Fforms\u002Fdate-picker","components\u002Fforms\u002Fdate-picker",23.5,{"title":279,"path":280,"stem":281,"order":282,"icon":9,"collapse":10,"navBadges":9},"ColorPicker","\u002Fcomponents\u002Fforms\u002Fcolor-picker","components\u002Fforms\u002Fcolor-picker",23.75,{"title":284,"path":285,"stem":286,"order":287,"icon":9,"collapse":10,"navBadges":9},"Checkbox","\u002Fcomponents\u002Fforms\u002Fcheckbox","components\u002Fforms\u002Fcheckbox",24,{"title":289,"path":290,"stem":291,"order":292,"icon":9,"collapse":10,"navBadges":9},"RadioGroup","\u002Fcomponents\u002Fforms\u002Fradio-group","components\u002Fforms\u002Fradio-group",25,{"title":294,"path":295,"stem":296,"order":297,"icon":9,"collapse":10,"navBadges":9},"Rating","\u002Fcomponents\u002Fforms\u002Frating","components\u002Fforms\u002Frating",25.5,{"title":299,"path":300,"stem":301,"order":302,"icon":9,"collapse":10,"navBadges":9},"Switch","\u002Fcomponents\u002Fforms\u002Fswitch","components\u002Fforms\u002Fswitch",26,{"title":304,"path":305,"stem":306,"order":307,"icon":9,"collapse":10,"navBadges":9},"FormField","\u002Fcomponents\u002Fforms\u002Fform-field","components\u002Fforms\u002Fform-field",27,{"title":309,"path":310,"stem":311,"order":312,"icon":9,"collapse":10,"navBadges":9},"Form Validation","\u002Fcomponents\u002Fforms\u002Fvalidation","components\u002Fforms\u002Fvalidation",28,{"title":314,"path":315,"stem":316,"children":317,"page":10},"Data","\u002Fcomponents\u002Fdata","components\u002Fdata",[318,322,327,331],{"title":319,"path":320,"stem":321,"order":312,"icon":9,"collapse":10,"navBadges":9},"EmptyState","\u002Fcomponents\u002Fdata\u002Fempty-state","components\u002Fdata\u002Fempty-state",{"title":323,"path":324,"stem":325,"order":326,"icon":9,"collapse":10,"navBadges":9},"Calendar","\u002Fcomponents\u002Fdata\u002Fcalendar","components\u002Fdata\u002Fcalendar",29,{"title":328,"path":329,"stem":330,"order":35,"icon":9,"collapse":10,"navBadges":9},"Table","\u002Fcomponents\u002Fdata\u002Ftable","components\u002Fdata\u002Ftable",{"title":332,"path":333,"stem":334,"order":335,"icon":9,"collapse":10,"navBadges":9},"Timeline","\u002Fcomponents\u002Fdata\u002Ftimeline","components\u002Fdata\u002Ftimeline",31,{"title":337,"path":338,"stem":339,"children":340,"page":10},"Navigation","\u002Fcomponents\u002Fnavigation","components\u002Fnavigation",[341,346,350,355,360,365,370,375],{"title":342,"path":343,"stem":344,"order":345,"icon":9,"collapse":10,"navBadges":9},"Breadcrumb","\u002Fcomponents\u002Fnavigation\u002Fbreadcrumb","components\u002Fnavigation\u002Fbreadcrumb",39,{"title":347,"path":348,"stem":349,"order":40,"icon":9,"collapse":10,"navBadges":9},"Tabs","\u002Fcomponents\u002Fnavigation\u002Ftabs","components\u002Fnavigation\u002Ftabs",{"title":351,"path":352,"stem":353,"order":354,"icon":9,"collapse":10,"navBadges":9},"Stepper","\u002Fcomponents\u002Fnavigation\u002Fstepper","components\u002Fnavigation\u002Fstepper",40.5,{"title":356,"path":357,"stem":358,"order":359,"icon":9,"collapse":10,"navBadges":9},"Accordion","\u002Fcomponents\u002Fnavigation\u002Faccordion","components\u002Fnavigation\u002Faccordion",41,{"title":361,"path":362,"stem":363,"order":364,"icon":9,"collapse":10,"navBadges":9},"Collapsible","\u002Fcomponents\u002Fnavigation\u002Fcollapsible","components\u002Fnavigation\u002Fcollapsible",41.5,{"title":366,"path":367,"stem":368,"order":369,"icon":9,"collapse":10,"navBadges":9},"Tree","\u002Fcomponents\u002Fnavigation\u002Ftree","components\u002Fnavigation\u002Ftree",41.75,{"title":371,"path":372,"stem":373,"order":374,"icon":9,"collapse":10,"navBadges":9},"Pagination","\u002Fcomponents\u002Fnavigation\u002Fpagination","components\u002Fnavigation\u002Fpagination",44,{"title":376,"path":377,"stem":378,"order":379,"icon":9,"collapse":10,"navBadges":9},"NavigationMenu","\u002Fcomponents\u002Fnavigation\u002Fnavigation-menu","components\u002Fnavigation\u002Fnavigation-menu",45,{"title":381,"path":382,"stem":383,"children":384,"page":10},"Overlays","\u002Fcomponents\u002Foverlays","components\u002Foverlays",[385,389,394,399,404,409,414,419,424,428],{"title":386,"path":387,"stem":388,"order":45,"icon":9,"collapse":10,"navBadges":9},"Modal","\u002Fcomponents\u002Foverlays\u002Fmodal","components\u002Foverlays\u002Fmodal",{"title":390,"path":391,"stem":392,"order":393,"icon":9,"collapse":10,"navBadges":9},"AlertDialog","\u002Fcomponents\u002Foverlays\u002Falert-dialog","components\u002Foverlays\u002Falert-dialog",50.5,{"title":395,"path":396,"stem":397,"order":398,"icon":9,"collapse":10,"navBadges":9},"Dropdown","\u002Fcomponents\u002Foverlays\u002Fdropdown","components\u002Foverlays\u002Fdropdown",51,{"title":400,"path":401,"stem":402,"order":403,"icon":9,"collapse":10,"navBadges":9},"Context Menu","\u002Fcomponents\u002Foverlays\u002Fcontext-menu","components\u002Foverlays\u002Fcontext-menu",51.5,{"title":405,"path":406,"stem":407,"order":408,"icon":9,"collapse":10,"navBadges":9},"Tooltip","\u002Fcomponents\u002Foverlays\u002Ftooltip","components\u002Foverlays\u002Ftooltip",52,{"title":410,"path":411,"stem":412,"order":413,"icon":9,"collapse":10,"navBadges":9},"Toast","\u002Fcomponents\u002Foverlays\u002Ftoast","components\u002Foverlays\u002Ftoast",53,{"title":415,"path":416,"stem":417,"order":418,"icon":9,"collapse":10,"navBadges":9},"Slideover","\u002Fcomponents\u002Foverlays\u002Fslideover","components\u002Foverlays\u002Fslideover",54,{"title":420,"path":421,"stem":422,"order":423,"icon":9,"collapse":10,"navBadges":9},"Command Palette","\u002Fcomponents\u002Foverlays\u002Fcommand-palette","components\u002Foverlays\u002Fcommand-palette",54.5,{"title":425,"path":426,"stem":427,"order":98,"icon":9,"collapse":10,"navBadges":9},"Popover","\u002Fcomponents\u002Foverlays\u002Fpopover","components\u002Foverlays\u002Fpopover",{"title":429,"path":430,"stem":431,"order":432,"icon":9,"collapse":10,"navBadges":9},"Drawer","\u002Fcomponents\u002Foverlays\u002Fdrawer","components\u002Foverlays\u002Fdrawer",56,{"title":434,"path":435,"stem":436,"children":437,"page":10},"Layout","\u002Fcomponents\u002Flayout","components\u002Flayout",[438,443,447,452,457,462,466,471,476,481],{"title":439,"path":440,"stem":441,"order":442,"icon":9,"collapse":10,"navBadges":9},"App","\u002Fcomponents\u002Flayout\u002Fapp","components\u002Flayout\u002Fapp",59,{"title":444,"path":445,"stem":446,"order":50,"icon":9,"collapse":10,"navBadges":9},"Container","\u002Fcomponents\u002Flayout\u002Fcontainer","components\u002Flayout\u002Fcontainer",{"title":448,"path":449,"stem":450,"order":451,"icon":9,"collapse":10,"navBadges":9},"Header","\u002Fcomponents\u002Flayout\u002Fheader","components\u002Flayout\u002Fheader",63,{"title":453,"path":454,"stem":455,"order":456,"icon":9,"collapse":10,"navBadges":9},"ColorModeToggle","\u002Fcomponents\u002Flayout\u002Fcolor-mode-toggle","components\u002Flayout\u002Fcolor-mode-toggle",64,{"title":458,"path":459,"stem":460,"order":461,"icon":9,"collapse":10,"navBadges":9},"ColorModeSwitch","\u002Fcomponents\u002Flayout\u002Fcolor-mode-switch","components\u002Flayout\u002Fcolor-mode-switch",65,{"title":463,"path":464,"stem":465,"order":461,"icon":9,"collapse":10,"navBadges":9},"ScrollArea","\u002Fcomponents\u002Flayout\u002Fscroll-area","components\u002Flayout\u002Fscroll-area",{"title":467,"path":468,"stem":469,"order":470,"icon":9,"collapse":10,"navBadges":9},"Card","\u002Fcomponents\u002Flayout\u002Fcard","components\u002Flayout\u002Fcard",66,{"title":472,"path":473,"stem":474,"order":475,"icon":9,"collapse":10,"navBadges":9},"CardGroup","\u002Fcomponents\u002Flayout\u002Fcard-group","components\u002Flayout\u002Fcard-group",67,{"title":477,"path":478,"stem":479,"order":480,"icon":9,"collapse":10,"navBadges":9},"Splitter","\u002Fcomponents\u002Flayout\u002Fsplitter","components\u002Flayout\u002Fsplitter",68,{"title":482,"path":483,"stem":484,"order":485,"icon":9,"collapse":10,"navBadges":9},"Theme","\u002Fcomponents\u002Flayout\u002Ftheme","components\u002Flayout\u002Ftheme",69,{"title":487,"path":488,"stem":489,"children":490,"page":10},"Typography","\u002Fcomponents\u002Ftypography","components\u002Ftypography",[491,495,500,505,510,515,520],{"title":492,"path":493,"stem":494,"order":55,"icon":9,"collapse":10,"navBadges":9},"Prose","\u002Fcomponents\u002Ftypography\u002Fprose","components\u002Ftypography\u002Fprose",{"title":496,"path":497,"stem":498,"order":499,"icon":9,"collapse":10,"navBadges":9},"CodeGroup","\u002Fcomponents\u002Ftypography\u002Fcode-group","components\u002Ftypography\u002Fcode-group",71,{"title":501,"path":502,"stem":503,"order":504,"icon":9,"collapse":10,"navBadges":9},"Callout","\u002Fcomponents\u002Ftypography\u002Fcallout","components\u002Ftypography\u002Fcallout",72,{"title":506,"path":507,"stem":508,"order":509,"icon":9,"collapse":10,"navBadges":9},"CodeButton","\u002Fcomponents\u002Ftypography\u002Fcode-button","components\u002Ftypography\u002Fcode-button",73,{"title":511,"path":512,"stem":513,"order":514,"icon":9,"collapse":10,"navBadges":9},"ReadMore","\u002Fcomponents\u002Ftypography\u002Fread-more","components\u002Ftypography\u002Fread-more",74,{"title":516,"path":517,"stem":518,"order":519,"icon":9,"collapse":10,"navBadges":9},"FileTree","\u002Fcomponents\u002Ftypography\u002Ffile-tree","components\u002Ftypography\u002Ffile-tree",75,{"title":521,"path":522,"stem":523,"order":524,"icon":9,"collapse":10,"navBadges":9},"CodeTree","\u002Fcomponents\u002Ftypography\u002Fcode-tree","components\u002Ftypography\u002Fcode-tree",76,{"title":526,"order":35,"icon":9,"collapse":10,"navBadges":9,"path":527,"stem":528,"children":529,"page":10},"Composites","\u002Fcomposites","composites",[530,559],{"title":531,"path":532,"stem":533,"children":534,"page":10},"Dashboard","\u002Fcomposites\u002Fdashboard","composites\u002Fdashboard",[535,539,543,547,551,555],{"title":536,"path":537,"stem":538,"order":13,"icon":9,"collapse":10,"navBadges":9},"DashboardGroup","\u002Fcomposites\u002Fdashboard\u002Fdashboard-group","composites\u002Fdashboard\u002Fdashboard-group",{"title":540,"path":541,"stem":542,"order":30,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar","composites\u002Fdashboard\u002Fdashboard-sidebar",{"title":544,"path":545,"stem":546,"order":35,"icon":9,"collapse":10,"navBadges":9},"DashboardPanel","\u002Fcomposites\u002Fdashboard\u002Fdashboard-panel","composites\u002Fdashboard\u002Fdashboard-panel",{"title":548,"path":549,"stem":550,"order":40,"icon":9,"collapse":10,"navBadges":9},"DashboardResizeHandle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-resize-handle","composites\u002Fdashboard\u002Fdashboard-resize-handle",{"title":552,"path":553,"stem":554,"order":45,"icon":9,"collapse":10,"navBadges":9},"DashboardNavbar","\u002Fcomposites\u002Fdashboard\u002Fdashboard-navbar","composites\u002Fdashboard\u002Fdashboard-navbar",{"title":556,"path":557,"stem":558,"order":50,"icon":9,"collapse":10,"navBadges":9},"DashboardSidebarToggle","\u002Fcomposites\u002Fdashboard\u002Fdashboard-sidebar-toggle","composites\u002Fdashboard\u002Fdashboard-sidebar-toggle",{"title":560,"path":561,"stem":562,"children":563,"page":10},"Documentation","\u002Fcomposites\u002Fdocumentation","composites\u002Fdocumentation",[564,568,572,576,580],{"title":565,"path":566,"stem":567,"order":13,"icon":9,"collapse":10,"navBadges":9},"PageHeader","\u002Fcomposites\u002Fdocumentation\u002Fpage-header","composites\u002Fdocumentation\u002Fpage-header",{"title":569,"path":570,"stem":571,"order":30,"icon":9,"collapse":10,"navBadges":9},"PageAside","\u002Fcomposites\u002Fdocumentation\u002Fpage-aside","composites\u002Fdocumentation\u002Fpage-aside",{"title":573,"path":574,"stem":575,"order":35,"icon":9,"collapse":10,"navBadges":9},"ContentNavigation","\u002Fcomposites\u002Fdocumentation\u002Fcontent-navigation","composites\u002Fdocumentation\u002Fcontent-navigation",{"title":577,"path":578,"stem":579,"order":40,"icon":9,"collapse":10,"navBadges":9},"ContentToc","\u002Fcomposites\u002Fdocumentation\u002Fcontent-toc","composites\u002Fdocumentation\u002Fcontent-toc",{"title":581,"path":582,"stem":583,"order":45,"icon":9,"collapse":10,"navBadges":9},"ContentSurround","\u002Fcomposites\u002Fdocumentation\u002Fcontent-surround","composites\u002Fdocumentation\u002Fcontent-surround",{"title":585,"order":586,"icon":9,"collapse":10,"navBadges":9,"path":587,"stem":588,"children":589,"page":10},"Blocks",35,"\u002Fblocks","blocks",[590,593,597,601,605,609],{"title":585,"path":591,"stem":592,"order":13,"icon":9,"collapse":10,"navBadges":9},"\u002Fblocks\u002Foverview","blocks\u002Foverview",{"title":594,"path":595,"stem":596,"order":30,"icon":9,"collapse":10,"navBadges":9},"Sign in","\u002Fblocks\u002Fsign-in","blocks\u002Fsign-in",{"title":598,"path":599,"stem":600,"order":35,"icon":9,"collapse":10,"navBadges":9},"Dashboard overview","\u002Fblocks\u002Fdashboard-overview","blocks\u002Fdashboard-overview",{"title":602,"path":603,"stem":604,"order":40,"icon":9,"collapse":10,"navBadges":9},"Profile settings","\u002Fblocks\u002Fprofile-settings","blocks\u002Fprofile-settings",{"title":606,"path":607,"stem":608,"order":45,"icon":9,"collapse":10,"navBadges":9},"Data management","\u002Fblocks\u002Fdata-management","blocks\u002Fdata-management",{"title":610,"order":50,"icon":9,"collapse":10,"navBadges":9,"path":611,"stem":612,"children":613,"page":10},"Editors","\u002Fblocks\u002Feditors","blocks\u002Feditors",[614,618,622],{"title":615,"path":616,"stem":617,"order":13,"icon":9,"collapse":10,"navBadges":9},"Tiptap editor","\u002Fblocks\u002Feditors\u002Ftiptap","blocks\u002Feditors\u002Ftiptap",{"title":619,"path":620,"stem":621,"order":30,"icon":9,"collapse":10,"navBadges":9},"Lexical editor","\u002Fblocks\u002Feditors\u002Flexical","blocks\u002Feditors\u002Flexical",{"title":623,"path":624,"stem":625,"order":35,"icon":9,"collapse":10,"navBadges":9},"Quill editor","\u002Fblocks\u002Feditors\u002Fquill","blocks\u002Feditors\u002Fquill",{"title":627,"order":40,"icon":9,"collapse":10,"navBadges":9,"path":628,"stem":629,"children":630,"page":10},"Utilities","\u002Futilities","utilities",[631,665],{"title":632,"path":633,"stem":634,"children":635,"page":10},"Composables","\u002Futilities\u002Fcomposables","utilities\u002Fcomposables",[636,640,644,649,653,657,661],{"title":637,"path":638,"stem":639,"order":13,"icon":9,"collapse":10,"navBadges":9},"useModal","\u002Futilities\u002Fcomposables\u002Fuse-modal","utilities\u002Fcomposables\u002Fuse-modal",{"title":641,"path":642,"stem":643,"order":170,"icon":9,"collapse":10,"navBadges":9},"useConfirm","\u002Futilities\u002Fcomposables\u002Fuse-confirm","utilities\u002Fcomposables\u002Fuse-confirm",{"title":645,"path":646,"stem":647,"order":648,"icon":9,"collapse":10,"navBadges":9},"useDrawer","\u002Futilities\u002Fcomposables\u002Fuse-drawer","utilities\u002Fcomposables\u002Fuse-drawer",15,{"title":650,"path":651,"stem":652,"order":30,"icon":9,"collapse":10,"navBadges":9},"useSlideover","\u002Futilities\u002Fcomposables\u002Fuse-slideover","utilities\u002Fcomposables\u002Fuse-slideover",{"title":654,"path":655,"stem":656,"order":35,"icon":9,"collapse":10,"navBadges":9},"useIcons","\u002Futilities\u002Fcomposables\u002Fuse-icons","utilities\u002Fcomposables\u002Fuse-icons",{"title":658,"path":659,"stem":660,"order":40,"icon":9,"collapse":10,"navBadges":9},"useMessages","\u002Futilities\u002Fcomposables\u002Fuse-messages","utilities\u002Fcomposables\u002Fuse-messages",{"title":662,"path":663,"stem":664,"order":45,"icon":9,"collapse":10,"navBadges":9},"useLocale","\u002Futilities\u002Fcomposables\u002Fuse-locale","utilities\u002Fcomposables\u002Fuse-locale",{"title":666,"path":667,"stem":668,"children":669,"page":10},"Directives","\u002Futilities\u002Fdirectives","utilities\u002Fdirectives",[670,674,678],{"title":671,"path":672,"stem":673,"order":13,"icon":9,"collapse":10,"navBadges":9},"v-ripple","\u002Futilities\u002Fdirectives\u002Fripple","utilities\u002Fdirectives\u002Fripple",{"title":675,"path":676,"stem":677,"order":648,"icon":9,"collapse":10,"navBadges":9},"v-hotkey","\u002Futilities\u002Fdirectives\u002Fhotkey","utilities\u002Fdirectives\u002Fhotkey",{"title":679,"path":680,"stem":681,"order":30,"icon":9,"collapse":10,"navBadges":9},"v-mask","\u002Futilities\u002Fdirectives\u002Fmask","utilities\u002Fdirectives\u002Fmask",{"byLocale":683,"defaultPath":1591},{"en":684,"id":9},{"id":685,"title":27,"aside":686,"body":687,"collapse":10,"description":1588,"editLink":686,"extension":1589,"icon":9,"issueLink":686,"meta":1590,"navBadges":9,"navigation":10,"order":30,"path":1591,"prevNext":686,"seo":1592,"stem":1593,"toc":686,"__hash__":1594},"docs\u002Foverview\u002Finstallation.md",true,{"type":688,"value":689,"toc":1574},"minimark",[690,695,716,720,723,786,790,805,846,857,864,874,961,989,993,996,1033,1036,1073,1086,1091,1094,1124,1135,1173,1177,1184,1239,1261,1268,1307,1311,1314,1337,1363,1369,1373,1396,1441,1454,1477,1494,1535,1545,1549,1570],[691,692,694],"h2",{"id":693},"requirements","Requirements",[696,697,698,699,703,704,707,708,711,712,715],"p",{},"Selaras supports Nuxt ",[700,701,702],"code",{},"^4.5.2",", Tailwind CSS ",[700,705,706],{},"^4.3.0",", and Node.js\n",[700,709,710],{},"^22.19.0 || ^24.11.0 || >=26.0.0",". Nuxt provides the Vue runtime and SFC\ncompiler, so they are not installed or versioned separately. Type checking is\nverified with TypeScript ",[700,713,714],{},">=5.9.3","; TypeScript is a build-time tool, not a\nSelaras runtime dependency.",[691,717,719],{"id":718},"install-the-package","Install the package",[696,721,722],{},"Nuxt and Tailwind CSS are peer dependencies - install Selaras in an existing\nNuxt project and keep Tailwind under your project's direct control:",[724,725,726,753,770],"code-group",{},[727,728,734],"pre",{"className":729,"code":730,"filename":731,"language":732,"meta":733,"style":733},"language-bash shiki shiki-themes github-light github-dark","bun add @sewadah\u002Fselaras tailwindcss\n","bun","bash","",[700,735,736],{"__ignoreMap":733},[737,738,740,743,747,750],"span",{"class":739,"line":8},"line",[737,741,731],{"class":742},"sScJk",[737,744,746],{"class":745},"sZZnC"," add",[737,748,749],{"class":745}," @sewadah\u002Fselaras",[737,751,752],{"class":745}," tailwindcss\n",[727,754,757],{"className":729,"code":755,"filename":756,"language":732,"meta":733,"style":733},"npm install @sewadah\u002Fselaras tailwindcss\n","npm",[700,758,759],{"__ignoreMap":733},[737,760,761,763,766,768],{"class":739,"line":8},[737,762,756],{"class":742},[737,764,765],{"class":745}," install",[737,767,749],{"class":745},[737,769,752],{"class":745},[727,771,774],{"className":729,"code":772,"filename":773,"language":732,"meta":733,"style":733},"pnpm add @sewadah\u002Fselaras tailwindcss\n","pnpm",[700,775,776],{"__ignoreMap":733},[737,777,778,780,782,784],{"class":739,"line":8},[737,779,773],{"class":742},[737,781,746],{"class":745},[737,783,749],{"class":745},[737,785,752],{"class":745},[691,787,789],{"id":788},"register-the-module","Register the module",[696,791,792,793,796,797,800,801,804],{},"Add ",[700,794,795],{},"@sewadah\u002Fselaras"," to ",[700,798,799],{},"modules"," in ",[700,802,803],{},"nuxt.config.ts",":",[727,806,810],{"className":807,"code":808,"language":809,"meta":733,"style":733},"language-ts shiki shiki-themes github-light github-dark","export default defineNuxtConfig({\n  modules: ['@sewadah\u002Fselaras'],\n})\n","ts",[700,811,812,828,840],{"__ignoreMap":733},[737,813,814,818,821,824],{"class":739,"line":8},[737,815,817],{"class":816},"szBVR","export",[737,819,820],{"class":816}," default",[737,822,823],{"class":742}," defineNuxtConfig",[737,825,827],{"class":826},"sVt8B","({\n",[737,829,831,834,837],{"class":739,"line":830},2,[737,832,833],{"class":826},"  modules: [",[737,835,836],{"class":745},"'@sewadah\u002Fselaras'",[737,838,839],{"class":826},"],\n",[737,841,843],{"class":739,"line":842},3,[737,844,845],{"class":826},"})\n",[696,847,848,849,852,853,856],{},"Components are now auto-imported, and the module pulls in its own\ndependencies (",[700,850,851],{},"@nuxt\u002Ficon",", ",[700,854,855],{},"@nuxtjs\u002Fcolor-mode",") automatically.",[691,858,860,861],{"id":859},"wrap-your-app-in-sapp","Wrap your app in ",[700,862,863],{},"SApp",[696,865,866,867,800,870,873],{},"Wrap your root ",[700,868,869],{},"app.vue",[700,871,872],{},"\u003CSApp>",", once:",[727,875,879],{"className":876,"code":877,"language":878,"meta":733,"style":733},"language-vue-html shiki shiki-themes github-light github-dark","\u003C!-- app.vue -->\n\u003Ctemplate>\n  \u003CSApp>\n    \u003CNuxtLayout>\n      \u003CNuxtPage \u002F>\n    \u003C\u002FNuxtLayout>\n  \u003C\u002FSApp>\n\u003C\u002Ftemplate>\n","vue-html",[700,880,881,887,899,908,919,931,941,951],{"__ignoreMap":733},[737,882,883],{"class":739,"line":8},[737,884,886],{"class":885},"sJ8bj","\u003C!-- app.vue -->\n",[737,888,889,892,896],{"class":739,"line":830},[737,890,891],{"class":826},"\u003C",[737,893,895],{"class":894},"s9eBZ","template",[737,897,898],{"class":826},">\n",[737,900,901,904,906],{"class":739,"line":842},[737,902,903],{"class":826},"  \u003C",[737,905,863],{"class":894},[737,907,898],{"class":826},[737,909,911,914,917],{"class":739,"line":910},4,[737,912,913],{"class":826},"    \u003C",[737,915,916],{"class":894},"NuxtLayout",[737,918,898],{"class":826},[737,920,922,925,928],{"class":739,"line":921},5,[737,923,924],{"class":826},"      \u003C",[737,926,927],{"class":894},"NuxtPage",[737,929,930],{"class":826}," \u002F>\n",[737,932,934,937,939],{"class":739,"line":933},6,[737,935,936],{"class":826},"    \u003C\u002F",[737,938,916],{"class":894},[737,940,898],{"class":826},[737,942,944,947,949],{"class":739,"line":943},7,[737,945,946],{"class":826},"  \u003C\u002F",[737,948,863],{"class":894},[737,950,898],{"class":826},[737,952,954,957,959],{"class":739,"line":953},8,[737,955,956],{"class":826},"\u003C\u002F",[737,958,895],{"class":894},[737,960,898],{"class":826},[696,962,963,964,6,967,6,970,973,974,977,978,981,982,985,986,988],{},"This isn't optional - without it, Tooltip loses its shared hover-delay\nbehavior, and ",[700,965,966],{},"useModal()",[700,968,969],{},"useDrawer()",[700,971,972],{},"useSlideover()"," (the \"open from\nanywhere\" APIs) have nothing to render into. See ",[975,976,439],"a",{"href":440},"\nfor the full picture, including the two components (",[700,979,980],{},"SToast",",\n",[700,983,984],{},"SCommandPalette",") that still need to be placed yourself even with ",[700,987,863],{},"\nalready wrapping everything.",[691,990,992],{"id":991},"import-the-css","Import the CSS",[696,994,995],{},"Selaras doesn't inject its own CSS for you - import it explicitly in your\nown stylesheet, after Tailwind itself:",[727,997,1002],{"className":998,"code":999,"filename":1000,"language":1001,"meta":733,"style":733},"language-css shiki shiki-themes github-light github-dark","@import \"tailwindcss\";\n@import \"@sewadah\u002Fselaras\";\n@import \"#selaras\u002Ftailwind.css\";\n","assets\u002Fcss\u002Fmain.css","css",[700,1003,1004,1015,1024],{"__ignoreMap":733},[737,1005,1006,1009,1012],{"class":739,"line":8},[737,1007,1008],{"class":816},"@import",[737,1010,1011],{"class":745}," \"tailwindcss\"",[737,1013,1014],{"class":826},";\n",[737,1016,1017,1019,1022],{"class":739,"line":830},[737,1018,1008],{"class":816},[737,1020,1021],{"class":745}," \"@sewadah\u002Fselaras\"",[737,1023,1014],{"class":826},[737,1025,1026,1028,1031],{"class":739,"line":842},[737,1027,1008],{"class":816},[737,1029,1030],{"class":745}," \"#selaras\u002Ftailwind.css\"",[737,1032,1014],{"class":826},[696,1034,1035],{},"Then point Nuxt at that file:",[727,1037,1039],{"className":807,"code":1038,"language":809,"meta":733,"style":733},"export default defineNuxtConfig({\n  modules: ['@sewadah\u002Fselaras'],\n  css: ['~\u002Fassets\u002Fcss\u002Fmain.css'],\n})\n",[700,1040,1041,1051,1059,1069],{"__ignoreMap":733},[737,1042,1043,1045,1047,1049],{"class":739,"line":8},[737,1044,817],{"class":816},[737,1046,820],{"class":816},[737,1048,823],{"class":742},[737,1050,827],{"class":826},[737,1052,1053,1055,1057],{"class":739,"line":830},[737,1054,833],{"class":826},[737,1056,836],{"class":745},[737,1058,839],{"class":826},[737,1060,1061,1064,1067],{"class":739,"line":842},[737,1062,1063],{"class":826},"  css: [",[737,1065,1066],{"class":745},"'~\u002Fassets\u002Fcss\u002Fmain.css'",[737,1068,839],{"class":826},[737,1070,1071],{"class":739,"line":910},[737,1072,845],{"class":826},[696,1074,1075,1078,1079,1081,1082,1085],{},[700,1076,1077],{},"@import \"@sewadah\u002Fselaras\";"," brings in the default theme and component base\nstyles - see ",[975,1080,71],{"href":72},". ",[700,1083,1084],{},"#selaras\u002Ftailwind.css"," is generated\nby the Nuxt module. Import it in this same entry so library class candidates\nand adaptive presentation use your app's final Tailwind theme.",[1087,1088,1090],"h3",{"id":1089},"complete-explicit-theme","Complete explicit theme",[696,1092,1093],{},"Applications with a complete existing semantic theme can import Selaras's\nstructural entry instead of its owned default foundations:",[727,1095,1097],{"className":998,"code":1096,"filename":1000,"language":1001,"meta":733,"style":733},"@import \"tailwindcss\";\n@import \"@sewadah\u002Fselaras\u002Fstructural.css\";\n@import \"#selaras\u002Ftailwind.css\";\n",[700,1098,1099,1107,1116],{"__ignoreMap":733},[737,1100,1101,1103,1105],{"class":739,"line":8},[737,1102,1008],{"class":816},[737,1104,1011],{"class":745},[737,1106,1014],{"class":826},[737,1108,1109,1111,1114],{"class":739,"line":830},[737,1110,1008],{"class":816},[737,1112,1113],{"class":745}," \"@sewadah\u002Fselaras\u002Fstructural.css\"",[737,1115,1014],{"class":826},[737,1117,1118,1120,1122],{"class":739,"line":842},[737,1119,1008],{"class":816},[737,1121,1030],{"class":745},[737,1123,1014],{"class":826},[696,1125,1126,1127,1130,1131,1134],{},"This entry retains source discovery, variants, motion and semantic bindings.\nProvide a light and dark recipe for every role your components can render,\nincluding any built-in role you keep and each custom role you register. Provide\nthe functional ",[700,1128,1129],{},"--selaras-*"," inputs required by your design system as well.\nIt is not an unthemed zero-configuration mode: incomplete structural themes\nhave no Selaras fallback palette or runtime completeness diagnostic. Use the\naggregate import unless you provide that complete contract.\nIf your project also renders long-form markdown\u002FCMS content, add\n",[975,1132,1133],{"href":493},"prose.css"," the same way:",[727,1136,1138],{"className":998,"code":1137,"filename":1000,"language":1001,"meta":733,"style":733},"@import \"tailwindcss\";\n@import \"@sewadah\u002Fselaras\";\n@import \"#selaras\u002Ftailwind.css\";\n@import \"@sewadah\u002Fselaras\u002Fprose.css\";\n",[700,1139,1140,1148,1156,1164],{"__ignoreMap":733},[737,1141,1142,1144,1146],{"class":739,"line":8},[737,1143,1008],{"class":816},[737,1145,1011],{"class":745},[737,1147,1014],{"class":826},[737,1149,1150,1152,1154],{"class":739,"line":830},[737,1151,1008],{"class":816},[737,1153,1021],{"class":745},[737,1155,1014],{"class":826},[737,1157,1158,1160,1162],{"class":739,"line":842},[737,1159,1008],{"class":816},[737,1161,1030],{"class":745},[737,1163,1014],{"class":826},[737,1165,1166,1168,1171],{"class":739,"line":910},[737,1167,1008],{"class":816},[737,1169,1170],{"class":745}," \"@sewadah\u002Fselaras\u002Fprose.css\"",[737,1172,1014],{"class":826},[691,1174,1176],{"id":1175},"options","Options",[696,1178,1179,1180,1183],{},"Configure the module under the ",[700,1181,1182],{},"selaras"," key:",[727,1185,1187],{"className":807,"code":1186,"language":809,"meta":733,"style":733},"export default defineNuxtConfig({\n  modules: ['@sewadah\u002Fselaras'],\n  selaras: {\n    \u002F\u002F Prefix used for auto-imported components.\n    prefix: 'S', \u002F\u002F default\n  },\n})\n",[700,1188,1189,1199,1207,1212,1217,1230,1235],{"__ignoreMap":733},[737,1190,1191,1193,1195,1197],{"class":739,"line":8},[737,1192,817],{"class":816},[737,1194,820],{"class":816},[737,1196,823],{"class":742},[737,1198,827],{"class":826},[737,1200,1201,1203,1205],{"class":739,"line":830},[737,1202,833],{"class":826},[737,1204,836],{"class":745},[737,1206,839],{"class":826},[737,1208,1209],{"class":739,"line":842},[737,1210,1211],{"class":826},"  selaras: {\n",[737,1213,1214],{"class":739,"line":910},[737,1215,1216],{"class":885},"    \u002F\u002F Prefix used for auto-imported components.\n",[737,1218,1219,1222,1225,1227],{"class":739,"line":921},[737,1220,1221],{"class":826},"    prefix: ",[737,1223,1224],{"class":745},"'S'",[737,1226,852],{"class":826},[737,1228,1229],{"class":885},"\u002F\u002F default\n",[737,1231,1232],{"class":739,"line":933},[737,1233,1234],{"class":826},"  },\n",[737,1236,1237],{"class":739,"line":943},[737,1238,845],{"class":826},[1240,1241,1242],"table",{},[1243,1244,1245],"thead",{},[1246,1247,1248,1252,1255,1258],"tr",{},[1249,1250,1251],"th",{},"Option",[1249,1253,1254],{},"Type",[1249,1256,1257],{},"Default",[1249,1259,1260],{},"Description",[696,1262,1263,1264,1267],{},"This guide has moved to ",[975,1265,1266],{"href":28},"the updated documentation",". Existing examples and anchors remain available below.",[696,1269,1270,1271,1274,1275,1274,1278,1280,1281,852,1284,1287,1288,1274,1291,1293,1294,1274,1297,1274,1299,1302,1303,1306],{},"|\n| ",[700,1272,1273],{},"prefix"," | ",[700,1276,1277],{},"string",[700,1279,1224],{}," | Prefix used for auto-imported components (",[700,1282,1283],{},"SButton",[700,1285,1286],{},"SModal",", ...). |\n| ",[700,1289,1290],{},"classPrefix",[700,1292,1277],{}," | none | Namespaces every class Selaras's own components render - see below. |\n| ",[700,1295,1296],{},"adaptive.breakpoint",[700,1298,1277],{},[700,1300,1301],{},"'md'"," | Selects a Tailwind ",[700,1304,1305],{},"--breakpoint-*"," token for adaptive presentation. |",[691,1308,1310],{"id":1309},"adaptive-breakpoint","Adaptive breakpoint",[696,1312,1313],{},"CSS owns breakpoint values. Override the default condition in your stylesheet:",[727,1315,1317],{"className":998,"code":1316,"language":1001,"meta":733,"style":733},"@theme {\n  --breakpoint-md: 60rem;\n}\n",[700,1318,1319,1327,1332],{"__ignoreMap":733},[737,1320,1321,1324],{"class":739,"line":8},[737,1322,1323],{"class":816},"@theme",[737,1325,1326],{"class":826}," {\n",[737,1328,1329],{"class":739,"line":830},[737,1330,1331],{"class":826},"  --breakpoint-md: 60rem;\n",[737,1333,1334],{"class":739,"line":842},[737,1335,1336],{"class":826},"}\n",[696,1338,1339,1340,1343,1344,1347,1348,852,1351,1354,1355,1358,1359,1362],{},"Or define your own ",[700,1341,1342],{},"--breakpoint-tablet"," token and select it with\n",[700,1345,1346],{},"selaras: { adaptive: { breakpoint: 'tablet' } }",". Supported values are simple\nlengths in ",[700,1349,1350],{},"px",[700,1352,1353],{},"rem"," or ",[700,1356,1357],{},"em",". Keep breakpoint units consistent with your other\nTailwind conditions. Selaras reads the resolved length after mount and uses the\nnative ",[700,1360,1361],{},"(width \u003C …)"," media query, including under a class prefix. Its initial\nSSR render uses desktop presentation; the existing adaptive controls hold their\nchosen presentation until they close.",[696,1364,1365,1366,1368],{},"These are build-time ",[700,1367,1323],{}," conditions. Changing a breakpoint CSS variable at\nruntime does not rewrite Tailwind's compiled responsive rules. A missing or\nunsupported binding produces a console diagnostic and disables mobile\npresentation; there is no implicit 768px fallback.",[691,1370,1372],{"id":1371},"class-prefix","Class prefix",[696,1374,1375,1376,1379,1380,1383,1384,1387,1388,1390,1391,1393,1394,804],{},"Tailwind v4 supports namespacing every one of its own utilities behind a\nprefix (",[700,1377,1378],{},"@import \"tailwindcss\" prefix(tw);",", which turns ",[700,1381,1382],{},"px-4"," into\n",[700,1385,1386],{},"tw:px-4",") - typically to avoid collisions with another CSS framework or a\nsecond, differently-configured Tailwind build in the same project. Selaras\ncan match that prefix in the classes its own components render, via\n",[700,1389,1290],{}," under the ",[700,1392,1182],{}," key in ",[700,1395,803],{},[727,1397,1399],{"className":807,"code":1398,"language":809,"meta":733,"style":733},"export default defineNuxtConfig({\n  modules: ['@sewadah\u002Fselaras'],\n  selaras: {\n    classPrefix: 'tw',\n  },\n})\n",[700,1400,1401,1411,1419,1423,1433,1437],{"__ignoreMap":733},[737,1402,1403,1405,1407,1409],{"class":739,"line":8},[737,1404,817],{"class":816},[737,1406,820],{"class":816},[737,1408,823],{"class":742},[737,1410,827],{"class":826},[737,1412,1413,1415,1417],{"class":739,"line":830},[737,1414,833],{"class":826},[737,1416,836],{"class":745},[737,1418,839],{"class":826},[737,1420,1421],{"class":739,"line":842},[737,1422,1211],{"class":826},[737,1424,1425,1428,1431],{"class":739,"line":910},[737,1426,1427],{"class":826},"    classPrefix: ",[737,1429,1430],{"class":745},"'tw'",[737,1432,981],{"class":826},[737,1434,1435],{"class":739,"line":921},[737,1436,1234],{"class":826},[737,1438,1439],{"class":739,"line":933},[737,1440,845],{"class":826},[696,1442,1443,1444,1447,1448,1450,1451,1453],{},"This is a module option, not an ",[700,1445,1446],{},"app.config.ts"," value - Tailwind CSS\ngeneration happens at build time, so Selaras needs to know the prefix\nearly enough to generate the class candidates imported through\n",[700,1449,1084],{},". Your own Tailwind entry produces the matching CSS\n(Tailwind never generates CSS for a class it can't find as literal text\nanywhere, whether that's your own templates or a safelist - an\n",[700,1452,1446],{}," value alone, read only at render time, could never\nproduce that).",[696,1455,1456,1460,1461,1464,1465,1468,1469,1472,1473,1476],{},[1457,1458,1459],"strong",{},"This value must match your own Tailwind prefix exactly."," Selaras has\nno way to detect your Tailwind configuration, so if the two ever drift -\n",[700,1462,1463],{},"classPrefix: 'tw'"," here while your CSS still says ",[700,1466,1467],{},"prefix(ui)",", or one\nset and not the other - every component renders classes your Tailwind\nbuild never generated CSS for, and the entire UI comes out unstyled. No\nerror is raised either way; it silently looks like a blank stylesheet.\nOnly set this if you've already added ",[700,1470,1471],{},"prefix(...)"," to your own\n",[700,1474,1475],{},"@import \"tailwindcss\"",".",[696,1478,1479,1482,1483,1486,1487,6,1490,1493],{},[1457,1480,1481],{},"Your own classes need the same prefix, written by hand."," Selaras's\nautomatic handling only covers classes baked into its own shipped\ncomponents - it has no way to see a string you write yourself, so a\n",[700,1484,1485],{},":ui"," override (or your own custom component built the same way, on\n",[700,1488,1489],{},"resolveSlot",[700,1491,1492],{},"tv()",") needs the prefix written directly into the string:",[727,1495,1497],{"className":876,"code":1496,"language":878,"meta":733,"style":733},"\u003C!-- classPrefix: 'tw' -->\n\u003CSButton :ui=\"{ base: 'tw:bg-purple-700' }\" \u002F>\n",[700,1498,1499,1504],{"__ignoreMap":733},[737,1500,1501],{"class":739,"line":8},[737,1502,1503],{"class":885},"\u003C!-- classPrefix: 'tw' -->\n",[737,1505,1506,1508,1510,1513,1516,1519,1522,1525,1528,1531,1533],{"class":739,"line":830},[737,1507,891],{"class":826},[737,1509,1283],{"class":894},[737,1511,1512],{"class":826}," :",[737,1514,1515],{"class":742},"ui",[737,1517,1518],{"class":826},"=",[737,1520,1521],{"class":745},"\"",[737,1523,1524],{"class":826},"{ base: ",[737,1526,1527],{"class":745},"'tw:bg-purple-700'",[737,1529,1530],{"class":826}," }",[737,1532,1521],{"class":745},[737,1534,930],{"class":826},[696,1536,1537,1538,1541,1542,1544],{},"This isn't a Selaras-specific gotcha - it's the same rule Tailwind's\nprefix feature already applies to every other class in your project once\nyou've adopted it (a plain ",[700,1539,1540],{},"\u003Cdiv class=\"tw:flex\">"," needs the same\nliteral prefix). See ",[975,1543,71],{"href":72}," for the other ways to\ncustomize a component.",[691,1546,1548],{"id":1547},"dark-mode","Dark mode",[696,1550,1551,1552,1555,1556,1559,1560,1562,1563,1566,1567,1569],{},"Selaras ships both a light and a dark palette, toggled by a plain ",[700,1553,1554],{},".dark","\nclass on ",[700,1557,1558],{},"\u003Chtml>"," (via ",[700,1561,855],{},", installed automatically). The\nbuilt-in ",[700,1564,1565],{},"SColorModeToggle"," component flips it for you - see\n",[975,1568,71],{"href":72}," for how the underlying tokens work.",[1571,1572,1573],"style",{},"html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}",{"title":733,"searchDepth":842,"depth":842,"links":1575},[1576,1577,1578,1579,1581,1584,1585,1586,1587],{"id":693,"depth":830,"text":694},{"id":718,"depth":830,"text":719},{"id":788,"depth":830,"text":789},{"id":859,"depth":830,"text":1580},"Wrap your app in SApp",{"id":991,"depth":830,"text":992,"children":1582},[1583],{"id":1089,"depth":842,"text":1090},{"id":1175,"depth":830,"text":1176},{"id":1309,"depth":830,"text":1310},{"id":1371,"depth":830,"text":1372},{"id":1547,"depth":830,"text":1548},"Add Selaras to a Nuxt project.","md",{},"\u002Foverview\u002Finstallation",{"title":27,"description":1588},"overview\u002Finstallation","AXXZPYrWHkOkWXHQ-iwD_QBFsGctxZdbk6fZR1WxceE",1792925220984]