[{"data":1,"prerenderedAt":2289},["ShallowReactive",2],{"navigation_en":3,"-docs-theme-elements-kbd":682,"-docs-theme-elements-kbd-surround":2284},{"gettingStarted":4,"api":71,"theme":162},[5,36,51],{"title":6,"icon":7,"path":8,"stem":9,"children":10,"page":7},"Getting Started",false,"\u002Fdocs\u002Fgetting-started","docs\u002Fgetting-started",[11,16,21,26,31],{"title":12,"path":13,"stem":14,"icon":15},"Introduction","\u002Fdocs\u002Fgetting-started\u002Fintroduction","docs\u002Fgetting-started\u002F01.introduction","i-lucide-house",{"title":17,"path":18,"stem":19,"icon":20},"Installation","\u002Fdocs\u002Fgetting-started\u002Finstallation","docs\u002Fgetting-started\u002F02.installation","i-lucide-download",{"title":22,"path":23,"stem":24,"icon":25},"Guides","\u002Fdocs\u002Fgetting-started\u002Fguides","docs\u002Fgetting-started\u002F03.guides","i-lucide-book-open",{"title":27,"path":28,"stem":29,"icon":30},"Comparisons","\u002Fdocs\u002Fgetting-started\u002Fcomparisons","docs\u002Fgetting-started\u002F06.comparisons","i-lucide-file-diff",{"title":32,"path":33,"stem":34,"icon":35},"Licensing","\u002Fdocs\u002Fgetting-started\u002Flicensing","docs\u002Fgetting-started\u002F07.licensing","i-lucide-scale",{"title":37,"icon":7,"path":38,"stem":39,"children":40,"page":7},"Tooling","\u002Fdocs\u002Fgetting-started\u002Ftooling","docs\u002Fgetting-started\u002Ftooling",[41,46],{"title":42,"path":43,"stem":44,"icon":45},"CLI Reference","\u002Fdocs\u002Fgetting-started\u002Ftooling\u002Fcli","docs\u002Fgetting-started\u002Ftooling\u002F01.cli","i-lucide-square-terminal",{"title":47,"path":48,"stem":49,"icon":50},"Utility Scanner","\u002Fdocs\u002Fgetting-started\u002Ftooling\u002Fscanner","docs\u002Fgetting-started\u002Ftooling\u002F02.scanner","i-lucide-view",{"title":52,"icon":7,"path":53,"stem":54,"children":55,"page":7},"Integrations","\u002Fdocs\u002Fgetting-started\u002Fintegrations","docs\u002Fgetting-started\u002Fintegrations",[56,61,66],{"title":57,"path":58,"stem":59,"icon":60},"DTCG","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fdtcg","docs\u002Fgetting-started\u002Fintegrations\u002F01.dtcg","i-lucide-square-code",{"title":62,"path":63,"stem":64,"icon":65},"Figma Plugin","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Ffigma-plugin","docs\u002Fgetting-started\u002Fintegrations\u002F02.figma-plugin","i-simple-icons-figma",{"title":67,"path":68,"stem":69,"icon":70},"Storybook","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fstorybook","docs\u002Fgetting-started\u002Fintegrations\u002F03.storybook","i-simple-icons-storybook",[72],{"title":73,"path":74,"stem":75,"children":76,"icon":7},"API Reference","\u002Fdocs\u002Fapi","docs\u002Fapi\u002F00.index",[77,80,85,90,95,100,105,110,115,120,125,130,145,150,155,160],{"title":78,"path":74,"stem":75,"icon":79},"Overview","i-lucide-book-text",{"title":81,"path":82,"stem":83,"icon":84},"Instance","\u002Fdocs\u002Fapi\u002Finstance","docs\u002Fapi\u002F01.instance","i-lucide-cloud-lightning",{"title":86,"path":87,"stem":88,"icon":89},"Variables","\u002Fdocs\u002Fapi\u002Fvariables","docs\u002Fapi\u002F02.variables","i-lucide-variable",{"title":91,"path":92,"stem":93,"icon":94},"Selectors","\u002Fdocs\u002Fapi\u002Fselectors","docs\u002Fapi\u002F03.selectors","i-lucide-scan-text",{"title":96,"path":97,"stem":98,"icon":99},"At-Rules","\u002Fdocs\u002Fapi\u002Fat-rules","docs\u002Fapi\u002F04.at-rules","i-lucide-at-sign",{"title":101,"path":102,"stem":103,"icon":104},"Media Queries","\u002Fdocs\u002Fapi\u002Fmedia-queries","docs\u002Fapi\u002F05.media-queries","i-lucide-image-upscale",{"title":106,"path":107,"stem":108,"icon":109},"Keyframes","\u002Fdocs\u002Fapi\u002Fkeyframes","docs\u002Fapi\u002F06.keyframes","i-lucide-square-play",{"title":111,"path":112,"stem":113,"icon":114},"Interpolation","\u002Fdocs\u002Fapi\u002Finterpolation","docs\u002Fapi\u002F07.interpolation","i-lucide-wrap-text",{"title":116,"path":117,"stem":118,"icon":119},"Utilities","\u002Fdocs\u002Fapi\u002Futilities","docs\u002Fapi\u002F08.utilities","i-lucide-sparkles",{"title":121,"path":122,"stem":123,"icon":124},"Utility Modifiers","\u002Fdocs\u002Fapi\u002Futility-modifiers","docs\u002Fapi\u002F09.utility-modifiers","i-lucide-align-horizontal-justify-center",{"title":126,"path":127,"stem":128,"icon":129},"Themes","\u002Fdocs\u002Fapi\u002Fthemes","docs\u002Fapi\u002F10.themes","i-lucide-paintbrush",{"title":131,"path":132,"stem":133,"children":134,"icon":144},"Recipes","\u002Fdocs\u002Fapi\u002Frecipes","docs\u002Fapi\u002F11.recipes\u002F00.index",[135,136,140],{"title":78,"path":132,"stem":133},{"title":137,"path":138,"stem":139},"Runtime","\u002Fdocs\u002Fapi\u002Frecipes\u002Fruntime","docs\u002Fapi\u002F11.recipes\u002F01.runtime",{"title":141,"path":142,"stem":143},"Output Format","\u002Fdocs\u002Fapi\u002Frecipes\u002Foutput-format","docs\u002Fapi\u002F11.recipes\u002F02.output-format","i-lucide-chef-hat",{"title":146,"path":147,"stem":148,"icon":149},"Composables","\u002Fdocs\u002Fapi\u002Fcomposables","docs\u002Fapi\u002F12.composables","i-lucide-component",{"title":151,"path":152,"stem":153,"icon":154},"Imports","\u002Fdocs\u002Fapi\u002Fimports","docs\u002Fapi\u002F13.imports","i-lucide-file-input",{"title":156,"path":157,"stem":158,"icon":159},"Merging","\u002Fdocs\u002Fapi\u002Fmerging","docs\u002Fapi\u002F13.merging","i-lucide-squares-intersect",{"title":151,"path":152,"stem":161,"icon":154},"docs\u002Fapi\u002F14.imports",[163,243,357,558,635],{"title":164,"path":165,"stem":166,"children":167,"icon":7},"Design Tokens","\u002Fdocs\u002Ftheme\u002Fdesign-tokens","docs\u002Ftheme\u002Fdesign-tokens\u002F00.index",[168,169,174,179,184,189,194,199,204,209,224,228,233,238],{"title":78,"path":165,"stem":166,"icon":79},{"title":170,"path":171,"stem":172,"icon":173},"Preset","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fpreset","docs\u002Ftheme\u002Fdesign-tokens\u002F01.preset","i-lucide-package",{"title":175,"path":176,"stem":177,"icon":178},"Border Radiuses","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fborder-radiuses","docs\u002Ftheme\u002Fdesign-tokens\u002F02.border-radiuses","i-lucide-square-round-corner",{"title":180,"path":181,"stem":182,"icon":183},"Borders","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fborders","docs\u002Ftheme\u002Fdesign-tokens\u002F03.borders","i-lucide-square-dashed-top-solid",{"title":185,"path":186,"stem":187,"icon":188},"Box Shadows","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fbox-shadows","docs\u002Ftheme\u002Fdesign-tokens\u002F04.box-shadows","i-lucide-layers-2",{"title":190,"path":191,"stem":192,"icon":193},"Breakpoints","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fbreakpoints","docs\u002Ftheme\u002Fdesign-tokens\u002F05.breakpoints","i-lucide-monitor-smartphone",{"title":195,"path":196,"stem":197,"icon":198},"Colors","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fcolors","docs\u002Ftheme\u002Fdesign-tokens\u002F06.colors","i-lucide-palette",{"title":200,"path":201,"stem":202,"icon":203},"Duration","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fduration","docs\u002Ftheme\u002Fdesign-tokens\u002F07.duration","i-lucide-timer",{"title":205,"path":206,"stem":207,"icon":208},"Easing","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Feasing","docs\u002Ftheme\u002Fdesign-tokens\u002F08.easing","i-lucide-spline",{"title":210,"path":211,"stem":212,"children":213,"icon":104,"defaultOpen":223},"Fluid Design","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Ffluid-design","docs\u002Ftheme\u002Fdesign-tokens\u002F09.fluid-design\u002F01.index",[214,215,219],{"title":78,"path":211,"stem":212},{"title":216,"path":217,"stem":218},"Fluid Viewport","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Ffluid-design\u002Fviewport","docs\u002Ftheme\u002Fdesign-tokens\u002F09.fluid-design\u002F02.viewport",{"title":220,"path":221,"stem":222},"Fluid Typography","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Ffluid-design\u002Ftypography","docs\u002Ftheme\u002Fdesign-tokens\u002F09.fluid-design\u002F03.typography",true,{"title":225,"path":226,"stem":227,"icon":35},"Scales","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fscales","docs\u002Ftheme\u002Fdesign-tokens\u002F10.scales",{"title":229,"path":230,"stem":231,"icon":232},"Spacing","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fspacing","docs\u002Ftheme\u002Fdesign-tokens\u002F11.spacing","i-lucide-move-horizontal",{"title":234,"path":235,"stem":236,"icon":237},"Typography","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Ftypography","docs\u002Ftheme\u002Fdesign-tokens\u002F12.typography","i-lucide-type",{"title":239,"path":240,"stem":241,"icon":242},"Z-Index","\u002Fdocs\u002Ftheme\u002Fdesign-tokens\u002Fz-index","docs\u002Ftheme\u002Fdesign-tokens\u002F13.z-index","i-lucide-layers",{"title":244,"path":245,"stem":246,"children":247,"icon":7},"Elements","\u002Fdocs\u002Ftheme\u002Felements","docs\u002Ftheme\u002Felements\u002F00.index",[248,249,252,259,281,301,313,329,341],{"title":78,"path":245,"stem":246,"icon":79},{"title":170,"path":250,"stem":251,"icon":173},"\u002Fdocs\u002Ftheme\u002Felements\u002Fpreset","docs\u002Ftheme\u002Felements\u002F01.preset",{"title":253,"icon":242,"defaultOpen":223,"page":7,"children":254},"Base",[255],{"title":256,"path":257,"stem":258,"icon":7},"Body","\u002Fdocs\u002Ftheme\u002Felements\u002Fbody","docs\u002Ftheme\u002Felements\u002F02.base\u002F00.body",{"title":234,"icon":237,"defaultOpen":223,"page":7,"children":260},[261,265,269,273,277],{"title":262,"path":263,"stem":264,"icon":7},"Headings","\u002Fdocs\u002Ftheme\u002Felements\u002Fheadings","docs\u002Ftheme\u002Felements\u002F03.typography\u002F01.headings",{"title":266,"path":267,"stem":268,"icon":7},"Paragraphs","\u002Fdocs\u002Ftheme\u002Felements\u002Fparagraphs","docs\u002Ftheme\u002Felements\u002F03.typography\u002F02.paragraphs",{"title":270,"path":271,"stem":272,"icon":7},"Links","\u002Fdocs\u002Ftheme\u002Felements\u002Flinks","docs\u002Ftheme\u002Felements\u002F03.typography\u002F03.links",{"title":274,"path":275,"stem":276,"icon":7},"Lists","\u002Fdocs\u002Ftheme\u002Felements\u002Flists","docs\u002Ftheme\u002Felements\u002F03.typography\u002F04.lists",{"title":278,"path":279,"stem":280,"icon":7},"Definition Lists","\u002Fdocs\u002Ftheme\u002Felements\u002Fdefinition-lists","docs\u002Ftheme\u002Felements\u002F03.typography\u002F05.definition-lists",{"title":282,"icon":283,"defaultOpen":223,"page":7,"children":284},"Inline Text","i-lucide-whole-word",[285,289,293,297],{"title":286,"path":287,"stem":288,"icon":7},"Abbreviation","\u002Fdocs\u002Ftheme\u002Felements\u002Fabbreviation","docs\u002Ftheme\u002Felements\u002F04.inline-text\u002F00.abbreviation",{"title":290,"path":291,"stem":292,"icon":7},"Code","\u002Fdocs\u002Ftheme\u002Felements\u002Fcode","docs\u002Ftheme\u002Felements\u002F04.inline-text\u002F01.code",{"title":294,"path":295,"stem":296,"icon":7},"Kbd","\u002Fdocs\u002Ftheme\u002Felements\u002Fkbd","docs\u002Ftheme\u002Felements\u002F04.inline-text\u002F02.kbd",{"title":298,"path":299,"stem":300,"icon":7},"Mark","\u002Fdocs\u002Ftheme\u002Felements\u002Fmark","docs\u002Ftheme\u002Felements\u002F04.inline-text\u002F03.mark",{"title":302,"icon":303,"defaultOpen":223,"page":7,"children":304},"Media & Embeds","i-lucide-image",[305,309],{"title":306,"path":307,"stem":308,"icon":7},"Image","\u002Fdocs\u002Ftheme\u002Felements\u002Fimage","docs\u002Ftheme\u002Felements\u002F05.media\u002F00.image",{"title":310,"path":311,"stem":312,"icon":7},"Iframe","\u002Fdocs\u002Ftheme\u002Felements\u002Fiframe","docs\u002Ftheme\u002Felements\u002F05.media\u002F01.iframe",{"title":314,"icon":315,"defaultOpen":223,"page":7,"children":316},"Forms & Tables","i-lucide-table",[317,321,325],{"title":318,"path":319,"stem":320,"icon":7},"Caption","\u002Fdocs\u002Ftheme\u002Felements\u002Fcaption","docs\u002Ftheme\u002Felements\u002F06.forms-tables\u002F00.caption",{"title":322,"path":323,"stem":324,"icon":7},"Legend","\u002Fdocs\u002Ftheme\u002Felements\u002Flegend","docs\u002Ftheme\u002Felements\u002F06.forms-tables\u002F01.legend",{"title":326,"path":327,"stem":328,"icon":7},"Output","\u002Fdocs\u002Ftheme\u002Felements\u002Foutput","docs\u002Ftheme\u002Felements\u002F06.forms-tables\u002F02.output",{"title":330,"icon":331,"defaultOpen":223,"page":7,"children":332},"Structure","i-lucide-separator-horizontal",[333,337],{"title":334,"path":335,"stem":336,"icon":7},"Address","\u002Fdocs\u002Ftheme\u002Felements\u002Faddress","docs\u002Ftheme\u002Felements\u002F07.structure\u002F00.address",{"title":338,"path":339,"stem":340,"icon":7},"Horizontal Rule","\u002Fdocs\u002Ftheme\u002Felements\u002Fhorizontal-rule","docs\u002Ftheme\u002Felements\u002F07.structure\u002F01.horizontal-rule",{"title":342,"icon":343,"defaultOpen":223,"page":7,"children":344},"States","i-lucide-mouse-pointer-click",[345,349,353],{"title":346,"path":347,"stem":348,"icon":7},"Focus","\u002Fdocs\u002Ftheme\u002Felements\u002Ffocus","docs\u002Ftheme\u002Felements\u002F08.states\u002F00.focus",{"title":350,"path":351,"stem":352,"icon":7},"Selection","\u002Fdocs\u002Ftheme\u002Felements\u002Fselection","docs\u002Ftheme\u002Felements\u002F08.states\u002F01.selection",{"title":354,"path":355,"stem":356,"icon":7},"Summary","\u002Fdocs\u002Ftheme\u002Felements\u002Fsummary","docs\u002Ftheme\u002Felements\u002F08.states\u002F02.summary",{"title":358,"path":359,"stem":360,"children":361,"icon":7},"Components","\u002Fdocs\u002Ftheme\u002Fcomponents","docs\u002Ftheme\u002Fcomponents\u002F00.index",[362,363,375,399,427,491,518,550],{"title":78,"path":359,"stem":360,"icon":79},{"title":364,"icon":365,"defaultOpen":223,"page":7,"children":366},"Actions","i-lucide-square-mouse-pointer",[367,371],{"title":368,"path":369,"stem":370,"icon":7},"Button","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fbutton","docs\u002Ftheme\u002Fcomponents\u002F02.actions\u002F00.button",{"title":372,"path":373,"stem":374,"icon":7},"Hamburger Menu","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fhamburger-menu","docs\u002Ftheme\u002Fcomponents\u002F02.actions\u002F01.hamburger-menu",{"title":376,"icon":377,"defaultOpen":223,"page":7,"children":378},"Navigation","i-lucide-navigation",[379,383,387,391,395],{"title":380,"path":381,"stem":382,"icon":7},"Breadcrumb","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fbreadcrumb","docs\u002Ftheme\u002Fcomponents\u002F03.navigation\u002F00.breadcrumb",{"title":384,"path":385,"stem":386,"icon":7},"Nav","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fnav","docs\u002Ftheme\u002Fcomponents\u002F03.navigation\u002F01.nav",{"title":388,"path":389,"stem":390,"icon":7},"Pagination","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fpagination","docs\u002Ftheme\u002Fcomponents\u002F03.navigation\u002F02.pagination",{"title":392,"path":393,"stem":394,"icon":7},"Sidebar","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fsidebar","docs\u002Ftheme\u002Fcomponents\u002F03.navigation\u002F03.sidebar",{"title":396,"path":397,"stem":398,"icon":7},"Tabs","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ftabs","docs\u002Ftheme\u002Fcomponents\u002F03.navigation\u002F04.tabs",{"title":400,"icon":401,"defaultOpen":223,"page":7,"children":402},"Feedback","i-lucide-megaphone",[403,407,411,415,419,423],{"title":404,"path":405,"stem":406,"icon":7},"Badge","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fbadge","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F00.badge",{"title":408,"path":409,"stem":410,"icon":7},"Callout","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcallout","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F01.callout",{"title":412,"path":413,"stem":414,"icon":7},"Chip","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fchip","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F02.chip",{"title":416,"path":417,"stem":418,"icon":7},"Progress","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fprogress","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F03.progress",{"title":420,"path":421,"stem":422,"icon":7},"Skeleton","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fskeleton","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F04.skeleton",{"title":424,"path":425,"stem":426,"icon":7},"Spinner","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fspinner","docs\u002Ftheme\u002Fcomponents\u002F04.feedback\u002F05.spinner",{"title":428,"icon":429,"defaultOpen":223,"page":7,"children":430},"Forms","i-lucide-text-cursor-input",[431,435,439,443,447,451,455,459,463,467,471,475,479,483,487],{"title":432,"path":433,"stem":434,"icon":7},"Calendar","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcalendar","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F00.calendar",{"title":436,"path":437,"stem":438,"icon":7},"Checkbox","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcheckbox","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F01.checkbox",{"title":440,"path":441,"stem":442,"icon":7},"Checkbox Group","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcheckbox-group","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F02.checkbox-group",{"title":444,"path":445,"stem":446,"icon":7},"Color Picker","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcolor-picker","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F03.color-picker",{"title":448,"path":449,"stem":450,"icon":7},"Field Group","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ffield-group","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F04.field-group",{"title":452,"path":453,"stem":454,"icon":7},"Input","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Finput","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F05.input",{"title":456,"path":457,"stem":458,"icon":7},"OTP","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fotp","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F06.otp",{"title":460,"path":461,"stem":462,"icon":7},"Radio","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fradio","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F07.radio",{"title":464,"path":465,"stem":466,"icon":7},"Radio Group","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fradio-group","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F08.radio-group",{"title":468,"path":469,"stem":470,"icon":7},"Select","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fselect","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F09.select",{"title":472,"path":473,"stem":474,"icon":7},"Slider","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fslider","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F10.slider",{"title":476,"path":477,"stem":478,"icon":7},"Switch","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fswitch","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F11.switch",{"title":480,"path":481,"stem":482,"icon":7},"Textarea","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ftextarea","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F12.textarea",{"title":484,"path":485,"stem":486,"icon":7},"Toggle","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ftoggle","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F13.toggle",{"title":488,"path":489,"stem":490,"icon":7},"Toggle Group","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ftoggle-group","docs\u002Ftheme\u002Fcomponents\u002F05.forms\u002F14.toggle-group",{"title":492,"icon":242,"defaultOpen":223,"page":7,"children":493},"Overlays",[494,498,502,506,510,514],{"title":495,"path":496,"stem":497,"icon":7},"ContextMenu","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcontext-menu","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F00.context-menu",{"title":499,"path":500,"stem":501,"icon":7},"Drawer","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fdrawer","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F01.drawer",{"title":503,"path":504,"stem":505,"icon":7},"Dropdown","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fdropdown","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F02.dropdown",{"title":507,"path":508,"stem":509,"icon":7},"Modal","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fmodal","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F03.modal",{"title":511,"path":512,"stem":513,"icon":7},"Popover","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fpopover","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F04.popover",{"title":515,"path":516,"stem":517,"icon":7},"Tooltip","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Ftooltip","docs\u002Ftheme\u002Fcomponents\u002F06.overlays\u002F05.tooltip",{"title":519,"icon":520,"defaultOpen":223,"page":7,"children":521},"Layout","i-lucide-layout",[522,526,530,534,538,542,546],{"title":523,"path":524,"stem":525,"icon":7},"Accordion","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Faccordion","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F00.accordion",{"title":527,"path":528,"stem":529,"icon":7},"Avatar","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Favatar","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F01.avatar",{"title":531,"path":532,"stem":533,"icon":7},"Avatar Group","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Favatar-group","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F02.avatar-group",{"title":535,"path":536,"stem":537,"icon":7},"Card","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fcard","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F03.card",{"title":539,"path":540,"stem":541,"icon":7},"Media","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fmedia","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F04.media",{"title":543,"path":544,"stem":545,"icon":7},"PageHero","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fpage-hero","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F05.page-hero",{"title":547,"path":548,"stem":549,"icon":7},"Placeholder","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fplaceholder","docs\u002Ftheme\u002Fcomponents\u002F07.layout\u002F06.placeholder",{"title":551,"icon":552,"defaultOpen":223,"page":7,"children":553},"AI Chat","i-lucide-message-circle",[554],{"title":555,"path":556,"stem":557,"icon":7},"ChatMessage","\u002Fdocs\u002Ftheme\u002Fcomponents\u002Fchat-message","docs\u002Ftheme\u002Fcomponents\u002F08.ai-chat\u002F00.chat-message",{"title":116,"path":559,"stem":560,"children":561,"icon":7},"\u002Fdocs\u002Ftheme\u002Futilities","docs\u002Ftheme\u002Futilities\u002F00.index",[562,563,567,572,577,581,584,588,593,598,602,605,610,613,618,622,627,632],{"title":78,"path":559,"stem":560,"icon":79},{"title":564,"path":565,"stem":566,"icon":173},"Presets","\u002Fdocs\u002Ftheme\u002Futilities\u002Fpreset","docs\u002Ftheme\u002Futilities\u002F01.preset",{"title":568,"path":569,"stem":570,"icon":571},"Accessibility","\u002Fdocs\u002Ftheme\u002Futilities\u002Faccessibility","docs\u002Ftheme\u002Futilities\u002F02.accessibility","i-lucide-accessibility",{"title":573,"path":574,"stem":575,"icon":576},"Animations","\u002Fdocs\u002Ftheme\u002Futilities\u002Fanimations","docs\u002Ftheme\u002Futilities\u002F03.animations","i-lucide-loader-circle",{"title":578,"path":579,"stem":580,"icon":303},"Backgrounds","\u002Fdocs\u002Ftheme\u002Futilities\u002Fbackgrounds","docs\u002Ftheme\u002Futilities\u002F04.backgrounds",{"title":180,"path":582,"stem":583,"icon":183},"\u002Fdocs\u002Ftheme\u002Futilities\u002Fborders","docs\u002Ftheme\u002Futilities\u002F05.borders",{"title":585,"path":586,"stem":587,"icon":119},"Effects","\u002Fdocs\u002Ftheme\u002Futilities\u002Feffects","docs\u002Ftheme\u002Futilities\u002F06.effects",{"title":589,"path":590,"stem":591,"icon":592},"Filters","\u002Fdocs\u002Ftheme\u002Futilities\u002Ffilters","docs\u002Ftheme\u002Futilities\u002F07.filters","i-lucide-aperture",{"title":594,"path":595,"stem":596,"icon":597},"Flexbox & Grid","\u002Fdocs\u002Ftheme\u002Futilities\u002Fflexbox-grid","docs\u002Ftheme\u002Futilities\u002F08.flexbox-grid","i-lucide-layout-grid",{"title":599,"path":600,"stem":601,"icon":343},"Interactivity","\u002Fdocs\u002Ftheme\u002Futilities\u002Finteractivity","docs\u002Ftheme\u002Futilities\u002F09.interactivity",{"title":519,"path":603,"stem":604,"icon":520},"\u002Fdocs\u002Ftheme\u002Futilities\u002Flayout","docs\u002Ftheme\u002Futilities\u002F10.layout",{"title":606,"path":607,"stem":608,"icon":609},"Sizing","\u002Fdocs\u002Ftheme\u002Futilities\u002Fsizing","docs\u002Ftheme\u002Futilities\u002F11.sizing","i-lucide-scaling",{"title":229,"path":611,"stem":612,"icon":232},"\u002Fdocs\u002Ftheme\u002Futilities\u002Fspacing","docs\u002Ftheme\u002Futilities\u002F12.spacing",{"title":614,"path":615,"stem":616,"icon":617},"SVG","\u002Fdocs\u002Ftheme\u002Futilities\u002Fsvg","docs\u002Ftheme\u002Futilities\u002F13.svg","i-lucide-pen-tool",{"title":619,"path":620,"stem":621,"icon":315},"Tables","\u002Fdocs\u002Ftheme\u002Futilities\u002Ftables","docs\u002Ftheme\u002Futilities\u002F14.tables",{"title":623,"path":624,"stem":625,"icon":626},"Transforms","\u002Fdocs\u002Ftheme\u002Futilities\u002Ftransforms","docs\u002Ftheme\u002Futilities\u002F15.transforms","i-lucide-rotate-3d",{"title":628,"path":629,"stem":630,"icon":631},"Transitions","\u002Fdocs\u002Ftheme\u002Futilities\u002Ftransitions","docs\u002Ftheme\u002Futilities\u002F16.transitions","i-lucide-arrow-left-right",{"title":234,"path":633,"stem":634,"icon":237},"\u002Fdocs\u002Ftheme\u002Futilities\u002Ftypography","docs\u002Ftheme\u002Futilities\u002F17.typography",{"title":636,"path":637,"stem":638,"children":639,"icon":7},"Modifiers","\u002Fdocs\u002Ftheme\u002Fmodifiers","docs\u002Ftheme\u002Fmodifiers\u002F00.index",[640,641,644,648,653,657,662,667,672,677],{"title":78,"path":637,"stem":638,"icon":79},{"title":564,"path":642,"stem":643,"icon":173},"\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fpreset","docs\u002Ftheme\u002Fmodifiers\u002F01.preset",{"title":645,"path":646,"stem":647,"icon":571},"ARIA State","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Faria-state","docs\u002Ftheme\u002Fmodifiers\u002F02.aria-state",{"title":649,"path":650,"stem":651,"icon":652},"Directional","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fdirectional","docs\u002Ftheme\u002Fmodifiers\u002F03.directional","i-lucide-flip-horizontal",{"title":654,"path":655,"stem":656,"icon":429},"Form State","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fform-state","docs\u002Ftheme\u002Fmodifiers\u002F04.form-state",{"title":658,"path":659,"stem":660,"icon":661},"Media & Preferences","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fmedia-preferences","docs\u002Ftheme\u002Fmodifiers\u002F05.media-preferences","i-lucide-sun-moon",{"title":663,"path":664,"stem":665,"icon":666},"Other State","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fother-state","docs\u002Ftheme\u002Fmodifiers\u002F06.other-state","i-lucide-toggle-left",{"title":668,"path":669,"stem":670,"icon":671},"Pseudo-Elements","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fpseudo-elements","docs\u002Ftheme\u002Fmodifiers\u002F07.pseudo-elements","i-lucide-box-select",{"title":673,"path":674,"stem":675,"icon":676},"Pseudo-State","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fpseudo-state","docs\u002Ftheme\u002Fmodifiers\u002F08.pseudo-state","i-lucide-pointer",{"title":678,"path":679,"stem":680,"icon":681},"Structural","\u002Fdocs\u002Ftheme\u002Fmodifiers\u002Fstructural","docs\u002Ftheme\u002Fmodifiers\u002F09.structural","i-lucide-list-ordered",{"id":683,"title":684,"body":685,"description":2277,"extension":2278,"links":2279,"meta":2280,"navigation":2281,"path":295,"seo":2282,"stem":296,"__hash__":2283},"docs_theme\u002Fdocs\u002Ftheme\u002Felements\u002F04.inline-text\u002F02.kbd.md","Kbd Element",{"type":686,"value":687,"toc":2270},"minimark",[688,714,718,728,733,738,811,1330,1348,1352,1525,1535,1539,2223,2227,2266],[689,690,691,695,696,700,701,705,706,709,710,713],"note",{"icon":173},[692,693,694],"strong",{},"Part of the Global Preset:"," ",[697,698,699],"code",{},"useKbdElement"," is included in the ",[702,703,704],"a",{"href":250},"Global Preset"," (",[697,707,708],{},"useGlobalPreset",") and you can configure it through the preset's ",[697,711,712],{},"kbd"," option. For most projects, applying it via the preset is the recommended approach.",[715,716,78],"h2",{"id":717},"overview",[719,720,721,722,724,725,727],"p",{},"The ",[697,723,699],{}," composable styles the ",[697,726,712],{}," element for displaying keyboard shortcuts and key combinations. It creates a compact, visually distinct key cap appearance with configurable background, color, font, border radius, and padding.",[729,730],"story-preview",{":panel":731,"story":732},"true","theme-elements-kbd--default",[715,734,736],{"id":735},"usekbdelement",[697,737,699],{},[739,740,745],"pre",{"className":741,"code":742,"language":743,"meta":744,"style":744},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","function useKbdElement(\n    s: Styleframe,\n    options?: WithThemes\u003CKbdElementConfig>\n): KbdElementResult\n","ts","",[697,746,747,764,781,802],{"__ignoreMap":744},[748,749,752,756,760],"span",{"class":750,"line":751},"line",1,[748,753,755],{"class":754},"spNyl","function",[748,757,759],{"class":758},"s2Zo4"," useKbdElement",[748,761,763],{"class":762},"sMK4o","(\n",[748,765,767,771,774,778],{"class":750,"line":766},2,[748,768,770],{"class":769},"sHdIc","    s",[748,772,773],{"class":762},":",[748,775,777],{"class":776},"sBMFI"," Styleframe",[748,779,780],{"class":762},",\n",[748,782,784,787,790,793,796,799],{"class":750,"line":783},3,[748,785,786],{"class":769},"    options",[748,788,789],{"class":762},"?:",[748,791,792],{"class":776}," WithThemes",[748,794,795],{"class":762},"\u003C",[748,797,798],{"class":776},"KbdElementConfig",[748,800,801],{"class":762},">\n",[748,803,805,808],{"class":750,"line":804},4,[748,806,807],{"class":762},"):",[748,809,810],{"class":776}," KbdElementResult\n",[812,813,814,1004],"tabs",{},[815,816,818],"tabs-item",{"icon":817,"label":290},"i-lucide-code",[739,819,822],{"className":741,"code":820,"filename":821,"language":743,"meta":744,"style":744},"import { styleframe } from 'styleframe';\nimport { useKbdElement } from '@styleframe\u002Ftheme';\n\nconst s = styleframe();\n\nconst {\n    kbdBackground,\n    kbdColor,\n    kbdFontFamily,\n    kbdFontSize,\n    kbdBorderRadius,\n    kbdPaddingBlock,\n    kbdPaddingInline,\n} = useKbdElement(s);\n\nexport default s;\n","styleframe.config.ts",[697,823,824,856,877,882,900,905,913,921,929,937,945,953,961,969,985,990],{"__ignoreMap":744},[748,825,826,830,833,837,840,843,846,850,853],{"class":750,"line":751},[748,827,829],{"class":828},"s7zQu","import",[748,831,832],{"class":762}," {",[748,834,836],{"class":835},"sTEyZ"," styleframe",[748,838,839],{"class":762}," }",[748,841,842],{"class":828}," from",[748,844,845],{"class":762}," '",[748,847,849],{"class":848},"sfazB","styleframe",[748,851,852],{"class":762},"'",[748,854,855],{"class":762},";\n",[748,857,858,860,862,864,866,868,870,873,875],{"class":750,"line":766},[748,859,829],{"class":828},[748,861,832],{"class":762},[748,863,759],{"class":835},[748,865,839],{"class":762},[748,867,842],{"class":828},[748,869,845],{"class":762},[748,871,872],{"class":848},"@styleframe\u002Ftheme",[748,874,852],{"class":762},[748,876,855],{"class":762},[748,878,879],{"class":750,"line":783},[748,880,881],{"emptyLinePlaceholder":223},"\n",[748,883,884,887,890,893,895,898],{"class":750,"line":804},[748,885,886],{"class":754},"const",[748,888,889],{"class":835}," s ",[748,891,892],{"class":762},"=",[748,894,836],{"class":758},[748,896,897],{"class":835},"()",[748,899,855],{"class":762},[748,901,903],{"class":750,"line":902},5,[748,904,881],{"emptyLinePlaceholder":223},[748,906,908,910],{"class":750,"line":907},6,[748,909,886],{"class":754},[748,911,912],{"class":762}," {\n",[748,914,916,919],{"class":750,"line":915},7,[748,917,918],{"class":835},"    kbdBackground",[748,920,780],{"class":762},[748,922,924,927],{"class":750,"line":923},8,[748,925,926],{"class":835},"    kbdColor",[748,928,780],{"class":762},[748,930,932,935],{"class":750,"line":931},9,[748,933,934],{"class":835},"    kbdFontFamily",[748,936,780],{"class":762},[748,938,940,943],{"class":750,"line":939},10,[748,941,942],{"class":835},"    kbdFontSize",[748,944,780],{"class":762},[748,946,948,951],{"class":750,"line":947},11,[748,949,950],{"class":835},"    kbdBorderRadius",[748,952,780],{"class":762},[748,954,956,959],{"class":750,"line":955},12,[748,957,958],{"class":835},"    kbdPaddingBlock",[748,960,780],{"class":762},[748,962,964,967],{"class":750,"line":963},13,[748,965,966],{"class":835},"    kbdPaddingInline",[748,968,780],{"class":762},[748,970,972,975,978,980,983],{"class":750,"line":971},14,[748,973,974],{"class":762},"}",[748,976,977],{"class":762}," =",[748,979,759],{"class":758},[748,981,982],{"class":835},"(s)",[748,984,855],{"class":762},[748,986,988],{"class":750,"line":987},15,[748,989,881],{"emptyLinePlaceholder":223},[748,991,993,996,999,1002],{"class":750,"line":992},16,[748,994,995],{"class":828},"export",[748,997,998],{"class":828}," default",[748,1000,1001],{"class":835}," s",[748,1003,855],{"class":762},[815,1005,1006],{"icon":154,"label":326},[739,1007,1012],{"className":1008,"code":1009,"filename":1010,"language":1011,"meta":744,"style":744},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight",":root {\n    --kbd--background: #1e293b;\n    --kbd--color: #ffffff;\n    --kbd--font-family: var(--font-family--mono);\n    --kbd--font-size: 0.875em;\n    --kbd--border-radius: var(--border-radius--sm);\n    --kbd--padding-block: 0.1875rem;\n    --kbd--padding-inline: 0.375rem;\n}\n\nkbd {\n    background: var(--kbd--background);\n    color: var(--kbd--color);\n    font-family: var(--kbd--font-family);\n    font-size: var(--kbd--font-size);\n    border-radius: var(--kbd--border-radius);\n    padding-block: var(--kbd--padding-block);\n    padding-inline: var(--kbd--padding-inline);\n    display: inline-block;\n}\n\nkbd > kbd {\n    padding-block: 0;\n    padding-inline: 0;\n    font-size: 1em;\n}\n","styleframe\u002Findex.css","css",[697,1013,1014,1023,1038,1052,1071,1084,1100,1112,1124,1129,1133,1139,1156,1172,1188,1204,1220,1237,1254,1267,1272,1277,1290,1302,1313,1325],{"__ignoreMap":744},[748,1015,1016,1018,1021],{"class":750,"line":751},[748,1017,773],{"class":762},[748,1019,1020],{"class":754},"root",[748,1022,912],{"class":762},[748,1024,1025,1028,1030,1033,1036],{"class":750,"line":766},[748,1026,1027],{"class":835},"    --kbd--background",[748,1029,773],{"class":762},[748,1031,1032],{"class":762}," #",[748,1034,1035],{"class":835},"1e293b",[748,1037,855],{"class":762},[748,1039,1040,1043,1045,1047,1050],{"class":750,"line":783},[748,1041,1042],{"class":835},"    --kbd--color",[748,1044,773],{"class":762},[748,1046,1032],{"class":762},[748,1048,1049],{"class":835},"ffffff",[748,1051,855],{"class":762},[748,1053,1054,1057,1059,1062,1065,1068],{"class":750,"line":804},[748,1055,1056],{"class":835},"    --kbd--font-family",[748,1058,773],{"class":762},[748,1060,1061],{"class":758}," var",[748,1063,1064],{"class":762},"(",[748,1066,1067],{"class":835},"--font-family--mono",[748,1069,1070],{"class":762},");\n",[748,1072,1073,1076,1078,1082],{"class":750,"line":902},[748,1074,1075],{"class":835},"    --kbd--font-size",[748,1077,773],{"class":762},[748,1079,1081],{"class":1080},"sbssI"," 0.875em",[748,1083,855],{"class":762},[748,1085,1086,1089,1091,1093,1095,1098],{"class":750,"line":907},[748,1087,1088],{"class":835},"    --kbd--border-radius",[748,1090,773],{"class":762},[748,1092,1061],{"class":758},[748,1094,1064],{"class":762},[748,1096,1097],{"class":835},"--border-radius--sm",[748,1099,1070],{"class":762},[748,1101,1102,1105,1107,1110],{"class":750,"line":915},[748,1103,1104],{"class":835},"    --kbd--padding-block",[748,1106,773],{"class":762},[748,1108,1109],{"class":1080}," 0.1875rem",[748,1111,855],{"class":762},[748,1113,1114,1117,1119,1122],{"class":750,"line":923},[748,1115,1116],{"class":835},"    --kbd--padding-inline",[748,1118,773],{"class":762},[748,1120,1121],{"class":1080}," 0.375rem",[748,1123,855],{"class":762},[748,1125,1126],{"class":750,"line":931},[748,1127,1128],{"class":762},"}\n",[748,1130,1131],{"class":750,"line":939},[748,1132,881],{"emptyLinePlaceholder":223},[748,1134,1135,1137],{"class":750,"line":947},[748,1136,712],{"class":776},[748,1138,912],{"class":762},[748,1140,1141,1145,1147,1149,1151,1154],{"class":750,"line":955},[748,1142,1144],{"class":1143},"sqsOY","    background",[748,1146,773],{"class":762},[748,1148,1061],{"class":758},[748,1150,1064],{"class":762},[748,1152,1153],{"class":835},"--kbd--background",[748,1155,1070],{"class":762},[748,1157,1158,1161,1163,1165,1167,1170],{"class":750,"line":963},[748,1159,1160],{"class":1143},"    color",[748,1162,773],{"class":762},[748,1164,1061],{"class":758},[748,1166,1064],{"class":762},[748,1168,1169],{"class":835},"--kbd--color",[748,1171,1070],{"class":762},[748,1173,1174,1177,1179,1181,1183,1186],{"class":750,"line":971},[748,1175,1176],{"class":1143},"    font-family",[748,1178,773],{"class":762},[748,1180,1061],{"class":758},[748,1182,1064],{"class":762},[748,1184,1185],{"class":835},"--kbd--font-family",[748,1187,1070],{"class":762},[748,1189,1190,1193,1195,1197,1199,1202],{"class":750,"line":987},[748,1191,1192],{"class":1143},"    font-size",[748,1194,773],{"class":762},[748,1196,1061],{"class":758},[748,1198,1064],{"class":762},[748,1200,1201],{"class":835},"--kbd--font-size",[748,1203,1070],{"class":762},[748,1205,1206,1209,1211,1213,1215,1218],{"class":750,"line":992},[748,1207,1208],{"class":1143},"    border-radius",[748,1210,773],{"class":762},[748,1212,1061],{"class":758},[748,1214,1064],{"class":762},[748,1216,1217],{"class":835},"--kbd--border-radius",[748,1219,1070],{"class":762},[748,1221,1223,1226,1228,1230,1232,1235],{"class":750,"line":1222},17,[748,1224,1225],{"class":1143},"    padding-block",[748,1227,773],{"class":762},[748,1229,1061],{"class":758},[748,1231,1064],{"class":762},[748,1233,1234],{"class":835},"--kbd--padding-block",[748,1236,1070],{"class":762},[748,1238,1240,1243,1245,1247,1249,1252],{"class":750,"line":1239},18,[748,1241,1242],{"class":1143},"    padding-inline",[748,1244,773],{"class":762},[748,1246,1061],{"class":758},[748,1248,1064],{"class":762},[748,1250,1251],{"class":835},"--kbd--padding-inline",[748,1253,1070],{"class":762},[748,1255,1257,1260,1262,1265],{"class":750,"line":1256},19,[748,1258,1259],{"class":1143},"    display",[748,1261,773],{"class":762},[748,1263,1264],{"class":835}," inline-block",[748,1266,855],{"class":762},[748,1268,1270],{"class":750,"line":1269},20,[748,1271,1128],{"class":762},[748,1273,1275],{"class":750,"line":1274},21,[748,1276,881],{"emptyLinePlaceholder":223},[748,1278,1280,1282,1285,1288],{"class":750,"line":1279},22,[748,1281,712],{"class":776},[748,1283,1284],{"class":762}," >",[748,1286,1287],{"class":776}," kbd",[748,1289,912],{"class":762},[748,1291,1293,1295,1297,1300],{"class":750,"line":1292},23,[748,1294,1225],{"class":1143},[748,1296,773],{"class":762},[748,1298,1299],{"class":1080}," 0",[748,1301,855],{"class":762},[748,1303,1305,1307,1309,1311],{"class":750,"line":1304},24,[748,1306,1242],{"class":1143},[748,1308,773],{"class":762},[748,1310,1299],{"class":1080},[748,1312,855],{"class":762},[748,1314,1316,1318,1320,1323],{"class":750,"line":1315},25,[748,1317,1192],{"class":1143},[748,1319,773],{"class":762},[748,1321,1322],{"class":1080}," 1em",[748,1324,855],{"class":762},[748,1326,1328],{"class":750,"line":1327},26,[748,1329,1128],{"class":762},[719,1331,1332,1333,1336,1337,1339,1340,1343,1344,1347],{},"The composable also sets ",[697,1334,1335],{},"display: inline-block"," on the ",[697,1338,712],{}," element. Nested ",[697,1341,1342],{},"kbd > kbd"," elements have their padding and font size reset to avoid double-styling compound key combinations like ",[697,1345,1346],{},"Ctrl+C",".",[715,1349,1351],{"id":1350},"default-values","Default Values",[1353,1354,1355,1374],"table",{},[1356,1357,1358],"thead",{},[1359,1360,1361,1365,1368,1371],"tr",{},[1362,1363,1364],"th",{},"Option",[1362,1366,1367],{},"Default",[1362,1369,1370],{},"Variable",[1362,1372,1373],{},"Export",[1375,1376,1377,1399,1420,1441,1462,1483,1504],"tbody",{},[1359,1378,1379,1385,1390,1394],{},[1380,1381,1382],"td",{},[697,1383,1384],{},"background",[1380,1386,1387],{},[697,1388,1389],{},"\"#1e293b\"",[1380,1391,1392],{},[697,1393,1153],{},[1380,1395,1396],{},[697,1397,1398],{},"kbdBackground",[1359,1400,1401,1406,1411,1415],{},[1380,1402,1403],{},[697,1404,1405],{},"color",[1380,1407,1408],{},[697,1409,1410],{},"\"#ffffff\"",[1380,1412,1413],{},[697,1414,1169],{},[1380,1416,1417],{},[697,1418,1419],{},"kbdColor",[1359,1421,1422,1427,1432,1436],{},[1380,1423,1424],{},[697,1425,1426],{},"fontFamily",[1380,1428,1429],{},[697,1430,1431],{},"\"@font-family.mono\"",[1380,1433,1434],{},[697,1435,1185],{},[1380,1437,1438],{},[697,1439,1440],{},"kbdFontFamily",[1359,1442,1443,1448,1453,1457],{},[1380,1444,1445],{},[697,1446,1447],{},"fontSize",[1380,1449,1450],{},[697,1451,1452],{},"\"0.875em\"",[1380,1454,1455],{},[697,1456,1201],{},[1380,1458,1459],{},[697,1460,1461],{},"kbdFontSize",[1359,1463,1464,1469,1474,1478],{},[1380,1465,1466],{},[697,1467,1468],{},"borderRadius",[1380,1470,1471],{},[697,1472,1473],{},"\"@border-radius.sm\"",[1380,1475,1476],{},[697,1477,1217],{},[1380,1479,1480],{},[697,1481,1482],{},"kbdBorderRadius",[1359,1484,1485,1490,1495,1499],{},[1380,1486,1487],{},[697,1488,1489],{},"paddingBlock",[1380,1491,1492],{},[697,1493,1494],{},"\"0.1875rem\"",[1380,1496,1497],{},[697,1498,1234],{},[1380,1500,1501],{},[697,1502,1503],{},"kbdPaddingBlock",[1359,1505,1506,1511,1516,1520],{},[1380,1507,1508],{},[697,1509,1510],{},"paddingInline",[1380,1512,1513],{},[697,1514,1515],{},"\"0.375rem\"",[1380,1517,1518],{},[697,1519,1251],{},[1380,1521,1522],{},[697,1523,1524],{},"kbdPaddingInline",[719,1526,1527,1528,1531,1532,1347],{},"The default configuration includes a dark theme that inverts the colors: ",[697,1529,1530],{},"background: \"@color.white\""," and ",[697,1533,1534],{},"color: \"@color.black\"",[715,1536,1538],{"id":1537},"custom-values","Custom Values",[812,1540,1541,1740,1943],{},[815,1542,1543],{"icon":817,"label":290},[739,1544,1546],{"className":741,"code":1545,"filename":821,"language":743,"meta":744,"style":744},"import { styleframe } from 'styleframe';\nimport { useKbdElement } from '@styleframe\u002Ftheme';\n\nconst s = styleframe();\n\nconst { kbdBackground, kbdColor } = useKbdElement(s, {\n    background: '@color.gray-100',\n    color: '@color.gray-800',\n    borderRadius: '@border-radius.md',\n    paddingBlock: '0.25rem',\n    paddingInline: '0.5rem',\n});\n\nexport default s;\n",[697,1547,1548,1568,1588,1592,1606,1610,1638,1654,1669,1685,1701,1717,1726,1730],{"__ignoreMap":744},[748,1549,1550,1552,1554,1556,1558,1560,1562,1564,1566],{"class":750,"line":751},[748,1551,829],{"class":828},[748,1553,832],{"class":762},[748,1555,836],{"class":835},[748,1557,839],{"class":762},[748,1559,842],{"class":828},[748,1561,845],{"class":762},[748,1563,849],{"class":848},[748,1565,852],{"class":762},[748,1567,855],{"class":762},[748,1569,1570,1572,1574,1576,1578,1580,1582,1584,1586],{"class":750,"line":766},[748,1571,829],{"class":828},[748,1573,832],{"class":762},[748,1575,759],{"class":835},[748,1577,839],{"class":762},[748,1579,842],{"class":828},[748,1581,845],{"class":762},[748,1583,872],{"class":848},[748,1585,852],{"class":762},[748,1587,855],{"class":762},[748,1589,1590],{"class":750,"line":783},[748,1591,881],{"emptyLinePlaceholder":223},[748,1593,1594,1596,1598,1600,1602,1604],{"class":750,"line":804},[748,1595,886],{"class":754},[748,1597,889],{"class":835},[748,1599,892],{"class":762},[748,1601,836],{"class":758},[748,1603,897],{"class":835},[748,1605,855],{"class":762},[748,1607,1608],{"class":750,"line":902},[748,1609,881],{"emptyLinePlaceholder":223},[748,1611,1612,1614,1616,1619,1622,1625,1627,1629,1631,1634,1636],{"class":750,"line":907},[748,1613,886],{"class":754},[748,1615,832],{"class":762},[748,1617,1618],{"class":835}," kbdBackground",[748,1620,1621],{"class":762},",",[748,1623,1624],{"class":835}," kbdColor ",[748,1626,974],{"class":762},[748,1628,977],{"class":762},[748,1630,759],{"class":758},[748,1632,1633],{"class":835},"(s",[748,1635,1621],{"class":762},[748,1637,912],{"class":762},[748,1639,1640,1643,1645,1647,1650,1652],{"class":750,"line":915},[748,1641,1144],{"class":1642},"swJcz",[748,1644,773],{"class":762},[748,1646,845],{"class":762},[748,1648,1649],{"class":848},"@color.gray-100",[748,1651,852],{"class":762},[748,1653,780],{"class":762},[748,1655,1656,1658,1660,1662,1665,1667],{"class":750,"line":923},[748,1657,1160],{"class":1642},[748,1659,773],{"class":762},[748,1661,845],{"class":762},[748,1663,1664],{"class":848},"@color.gray-800",[748,1666,852],{"class":762},[748,1668,780],{"class":762},[748,1670,1671,1674,1676,1678,1681,1683],{"class":750,"line":931},[748,1672,1673],{"class":1642},"    borderRadius",[748,1675,773],{"class":762},[748,1677,845],{"class":762},[748,1679,1680],{"class":848},"@border-radius.md",[748,1682,852],{"class":762},[748,1684,780],{"class":762},[748,1686,1687,1690,1692,1694,1697,1699],{"class":750,"line":939},[748,1688,1689],{"class":1642},"    paddingBlock",[748,1691,773],{"class":762},[748,1693,845],{"class":762},[748,1695,1696],{"class":848},"0.25rem",[748,1698,852],{"class":762},[748,1700,780],{"class":762},[748,1702,1703,1706,1708,1710,1713,1715],{"class":750,"line":947},[748,1704,1705],{"class":1642},"    paddingInline",[748,1707,773],{"class":762},[748,1709,845],{"class":762},[748,1711,1712],{"class":848},"0.5rem",[748,1714,852],{"class":762},[748,1716,780],{"class":762},[748,1718,1719,1721,1724],{"class":750,"line":955},[748,1720,974],{"class":762},[748,1722,1723],{"class":835},")",[748,1725,855],{"class":762},[748,1727,1728],{"class":750,"line":963},[748,1729,881],{"emptyLinePlaceholder":223},[748,1731,1732,1734,1736,1738],{"class":750,"line":971},[748,1733,995],{"class":828},[748,1735,998],{"class":828},[748,1737,1001],{"class":835},[748,1739,855],{"class":762},[815,1741,1743],{"icon":173,"label":1742},"Via the preset",[739,1744,1746],{"className":741,"code":1745,"filename":821,"language":743,"meta":744,"style":744},"import { styleframe } from 'styleframe';\nimport { useGlobalPreset } from '@styleframe\u002Ftheme';\n\nconst s = styleframe();\n\nconst { kbd } = useGlobalPreset(s, {\n    kbd: {\n        background: '@color.gray-100',\n        color: '@color.gray-800',\n        borderRadius: '@border-radius.md',\n        paddingBlock: '0.25rem',\n        paddingInline: '0.5rem',\n    },\n});\n\nexport default s;\n",[697,1747,1748,1768,1789,1793,1807,1811,1832,1841,1856,1871,1886,1901,1916,1921,1929,1933],{"__ignoreMap":744},[748,1749,1750,1752,1754,1756,1758,1760,1762,1764,1766],{"class":750,"line":751},[748,1751,829],{"class":828},[748,1753,832],{"class":762},[748,1755,836],{"class":835},[748,1757,839],{"class":762},[748,1759,842],{"class":828},[748,1761,845],{"class":762},[748,1763,849],{"class":848},[748,1765,852],{"class":762},[748,1767,855],{"class":762},[748,1769,1770,1772,1774,1777,1779,1781,1783,1785,1787],{"class":750,"line":766},[748,1771,829],{"class":828},[748,1773,832],{"class":762},[748,1775,1776],{"class":835}," useGlobalPreset",[748,1778,839],{"class":762},[748,1780,842],{"class":828},[748,1782,845],{"class":762},[748,1784,872],{"class":848},[748,1786,852],{"class":762},[748,1788,855],{"class":762},[748,1790,1791],{"class":750,"line":783},[748,1792,881],{"emptyLinePlaceholder":223},[748,1794,1795,1797,1799,1801,1803,1805],{"class":750,"line":804},[748,1796,886],{"class":754},[748,1798,889],{"class":835},[748,1800,892],{"class":762},[748,1802,836],{"class":758},[748,1804,897],{"class":835},[748,1806,855],{"class":762},[748,1808,1809],{"class":750,"line":902},[748,1810,881],{"emptyLinePlaceholder":223},[748,1812,1813,1815,1817,1820,1822,1824,1826,1828,1830],{"class":750,"line":907},[748,1814,886],{"class":754},[748,1816,832],{"class":762},[748,1818,1819],{"class":835}," kbd ",[748,1821,974],{"class":762},[748,1823,977],{"class":762},[748,1825,1776],{"class":758},[748,1827,1633],{"class":835},[748,1829,1621],{"class":762},[748,1831,912],{"class":762},[748,1833,1834,1837,1839],{"class":750,"line":915},[748,1835,1836],{"class":1642},"    kbd",[748,1838,773],{"class":762},[748,1840,912],{"class":762},[748,1842,1843,1846,1848,1850,1852,1854],{"class":750,"line":923},[748,1844,1845],{"class":1642},"        background",[748,1847,773],{"class":762},[748,1849,845],{"class":762},[748,1851,1649],{"class":848},[748,1853,852],{"class":762},[748,1855,780],{"class":762},[748,1857,1858,1861,1863,1865,1867,1869],{"class":750,"line":931},[748,1859,1860],{"class":1642},"        color",[748,1862,773],{"class":762},[748,1864,845],{"class":762},[748,1866,1664],{"class":848},[748,1868,852],{"class":762},[748,1870,780],{"class":762},[748,1872,1873,1876,1878,1880,1882,1884],{"class":750,"line":939},[748,1874,1875],{"class":1642},"        borderRadius",[748,1877,773],{"class":762},[748,1879,845],{"class":762},[748,1881,1680],{"class":848},[748,1883,852],{"class":762},[748,1885,780],{"class":762},[748,1887,1888,1891,1893,1895,1897,1899],{"class":750,"line":947},[748,1889,1890],{"class":1642},"        paddingBlock",[748,1892,773],{"class":762},[748,1894,845],{"class":762},[748,1896,1696],{"class":848},[748,1898,852],{"class":762},[748,1900,780],{"class":762},[748,1902,1903,1906,1908,1910,1912,1914],{"class":750,"line":955},[748,1904,1905],{"class":1642},"        paddingInline",[748,1907,773],{"class":762},[748,1909,845],{"class":762},[748,1911,1712],{"class":848},[748,1913,852],{"class":762},[748,1915,780],{"class":762},[748,1917,1918],{"class":750,"line":963},[748,1919,1920],{"class":762},"    },\n",[748,1922,1923,1925,1927],{"class":750,"line":971},[748,1924,974],{"class":762},[748,1926,1723],{"class":835},[748,1928,855],{"class":762},[748,1930,1931],{"class":750,"line":987},[748,1932,881],{"emptyLinePlaceholder":223},[748,1934,1935,1937,1939,1941],{"class":750,"line":992},[748,1936,995],{"class":828},[748,1938,998],{"class":828},[748,1940,1001],{"class":835},[748,1942,855],{"class":762},[815,1944,1945],{"icon":154,"label":326},[739,1946,1948],{"className":1008,"code":1947,"filename":1010,"language":1011,"meta":744,"style":744},":root {\n    --kbd--background: var(--color--gray-100);\n    --kbd--color: var(--color--gray-800);\n    --kbd--font-family: var(--font-family--mono);\n    --kbd--font-size: 0.875em;\n    --kbd--border-radius: var(--border-radius--md);\n    --kbd--padding-block: 0.25rem;\n    --kbd--padding-inline: 0.5rem;\n}\n\nkbd {\n    background: var(--kbd--background);\n    color: var(--kbd--color);\n    font-family: var(--kbd--font-family);\n    font-size: var(--kbd--font-size);\n    border-radius: var(--kbd--border-radius);\n    padding-block: var(--kbd--padding-block);\n    padding-inline: var(--kbd--padding-inline);\n    display: inline-block;\n}\n\nkbd > kbd {\n    padding-block: 0;\n    padding-inline: 0;\n    font-size: 1em;\n}\n",[697,1949,1950,1958,1973,1988,2002,2012,2027,2038,2049,2053,2057,2063,2077,2091,2105,2119,2133,2147,2161,2171,2175,2179,2189,2199,2209,2219],{"__ignoreMap":744},[748,1951,1952,1954,1956],{"class":750,"line":751},[748,1953,773],{"class":762},[748,1955,1020],{"class":754},[748,1957,912],{"class":762},[748,1959,1960,1962,1964,1966,1968,1971],{"class":750,"line":766},[748,1961,1027],{"class":835},[748,1963,773],{"class":762},[748,1965,1061],{"class":758},[748,1967,1064],{"class":762},[748,1969,1970],{"class":835},"--color--gray-100",[748,1972,1070],{"class":762},[748,1974,1975,1977,1979,1981,1983,1986],{"class":750,"line":783},[748,1976,1042],{"class":835},[748,1978,773],{"class":762},[748,1980,1061],{"class":758},[748,1982,1064],{"class":762},[748,1984,1985],{"class":835},"--color--gray-800",[748,1987,1070],{"class":762},[748,1989,1990,1992,1994,1996,1998,2000],{"class":750,"line":804},[748,1991,1056],{"class":835},[748,1993,773],{"class":762},[748,1995,1061],{"class":758},[748,1997,1064],{"class":762},[748,1999,1067],{"class":835},[748,2001,1070],{"class":762},[748,2003,2004,2006,2008,2010],{"class":750,"line":902},[748,2005,1075],{"class":835},[748,2007,773],{"class":762},[748,2009,1081],{"class":1080},[748,2011,855],{"class":762},[748,2013,2014,2016,2018,2020,2022,2025],{"class":750,"line":907},[748,2015,1088],{"class":835},[748,2017,773],{"class":762},[748,2019,1061],{"class":758},[748,2021,1064],{"class":762},[748,2023,2024],{"class":835},"--border-radius--md",[748,2026,1070],{"class":762},[748,2028,2029,2031,2033,2036],{"class":750,"line":915},[748,2030,1104],{"class":835},[748,2032,773],{"class":762},[748,2034,2035],{"class":1080}," 0.25rem",[748,2037,855],{"class":762},[748,2039,2040,2042,2044,2047],{"class":750,"line":923},[748,2041,1116],{"class":835},[748,2043,773],{"class":762},[748,2045,2046],{"class":1080}," 0.5rem",[748,2048,855],{"class":762},[748,2050,2051],{"class":750,"line":931},[748,2052,1128],{"class":762},[748,2054,2055],{"class":750,"line":939},[748,2056,881],{"emptyLinePlaceholder":223},[748,2058,2059,2061],{"class":750,"line":947},[748,2060,712],{"class":776},[748,2062,912],{"class":762},[748,2064,2065,2067,2069,2071,2073,2075],{"class":750,"line":955},[748,2066,1144],{"class":1143},[748,2068,773],{"class":762},[748,2070,1061],{"class":758},[748,2072,1064],{"class":762},[748,2074,1153],{"class":835},[748,2076,1070],{"class":762},[748,2078,2079,2081,2083,2085,2087,2089],{"class":750,"line":963},[748,2080,1160],{"class":1143},[748,2082,773],{"class":762},[748,2084,1061],{"class":758},[748,2086,1064],{"class":762},[748,2088,1169],{"class":835},[748,2090,1070],{"class":762},[748,2092,2093,2095,2097,2099,2101,2103],{"class":750,"line":971},[748,2094,1176],{"class":1143},[748,2096,773],{"class":762},[748,2098,1061],{"class":758},[748,2100,1064],{"class":762},[748,2102,1185],{"class":835},[748,2104,1070],{"class":762},[748,2106,2107,2109,2111,2113,2115,2117],{"class":750,"line":987},[748,2108,1192],{"class":1143},[748,2110,773],{"class":762},[748,2112,1061],{"class":758},[748,2114,1064],{"class":762},[748,2116,1201],{"class":835},[748,2118,1070],{"class":762},[748,2120,2121,2123,2125,2127,2129,2131],{"class":750,"line":992},[748,2122,1208],{"class":1143},[748,2124,773],{"class":762},[748,2126,1061],{"class":758},[748,2128,1064],{"class":762},[748,2130,1217],{"class":835},[748,2132,1070],{"class":762},[748,2134,2135,2137,2139,2141,2143,2145],{"class":750,"line":1222},[748,2136,1225],{"class":1143},[748,2138,773],{"class":762},[748,2140,1061],{"class":758},[748,2142,1064],{"class":762},[748,2144,1234],{"class":835},[748,2146,1070],{"class":762},[748,2148,2149,2151,2153,2155,2157,2159],{"class":750,"line":1239},[748,2150,1242],{"class":1143},[748,2152,773],{"class":762},[748,2154,1061],{"class":758},[748,2156,1064],{"class":762},[748,2158,1251],{"class":835},[748,2160,1070],{"class":762},[748,2162,2163,2165,2167,2169],{"class":750,"line":1256},[748,2164,1259],{"class":1143},[748,2166,773],{"class":762},[748,2168,1264],{"class":835},[748,2170,855],{"class":762},[748,2172,2173],{"class":750,"line":1269},[748,2174,1128],{"class":762},[748,2176,2177],{"class":750,"line":1274},[748,2178,881],{"emptyLinePlaceholder":223},[748,2180,2181,2183,2185,2187],{"class":750,"line":1279},[748,2182,712],{"class":776},[748,2184,1284],{"class":762},[748,2186,1287],{"class":776},[748,2188,912],{"class":762},[748,2190,2191,2193,2195,2197],{"class":750,"line":1292},[748,2192,1225],{"class":1143},[748,2194,773],{"class":762},[748,2196,1299],{"class":1080},[748,2198,855],{"class":762},[748,2200,2201,2203,2205,2207],{"class":750,"line":1304},[748,2202,1242],{"class":1143},[748,2204,773],{"class":762},[748,2206,1299],{"class":1080},[748,2208,855],{"class":762},[748,2210,2211,2213,2215,2217],{"class":750,"line":1315},[748,2212,1192],{"class":1143},[748,2214,773],{"class":762},[748,2216,1322],{"class":1080},[748,2218,855],{"class":762},[748,2220,2221],{"class":750,"line":1327},[748,2222,1128],{"class":762},[715,2224,2226],{"id":2225},"best-practices","Best Practices",[2228,2229,2230,2237,2243,2253],"ul",{},[2231,2232,2233,2236],"li",{},[692,2234,2235],{},"Use high-contrast colors",": Ensure sufficient contrast between background and text for readability.",[2231,2238,2239,2242],{},[692,2240,2241],{},"Use a monospace font",": The default monospace font helps users recognize keyboard shortcuts at a glance.",[2231,2244,2245,2248,2249,2252],{},[692,2246,2247],{},"Customize per-theme",": The default dark theme inverts colors automatically. Override the ",[697,2250,2251],{},"themes"," option if your dark mode needs different values.",[2231,2254,2255,2258,2259,2261,2262,2265],{},[692,2256,2257],{},"Rely on the nested reset",": Compound key combinations using nested ",[697,2260,712],{}," elements (e.g., ",[697,2263,2264],{},"\u003Ckbd>\u003Ckbd>Ctrl\u003C\u002Fkbd>+\u003Ckbd>C\u003C\u002Fkbd>\u003C\u002Fkbd>",") are automatically handled.",[2267,2268,2269],"style",{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}",{"title":744,"searchDepth":766,"depth":766,"links":2271},[2272,2273,2274,2275,2276],{"id":717,"depth":766,"text":78},{"id":735,"depth":766,"text":699},{"id":1350,"depth":766,"text":1351},{"id":1537,"depth":766,"text":1538},{"id":2225,"depth":766,"text":2226},"Style keyboard input elements with configurable background, color, font, border radius, and padding using the useKbdElement composable.","md",null,{},{"title":294,"icon":7},{"title":684,"description":2277},"J2VjON193Hn6Ii_QLSoxP2_D3k_5F86Hko5EnZynnc8",[2285,2287],{"title":290,"path":291,"stem":292,"description":2286,"icon":7,"children":-1},"Style inline code and preformatted text blocks with configurable font family, font size, and spacing using the useCodeElement and usePreElement composables.",{"title":298,"path":299,"stem":300,"description":2288,"icon":7,"children":-1},"Style highlighted text elements with configurable background, color, and padding using the useMarkElement composable.",1781596347627]