[{"data":1,"prerenderedAt":4051},["ShallowReactive",2],{"navigation_en":3,"-docs-theme-modifiers-composables-aria-state":407,"-docs-theme-modifiers-composables-aria-state-surround":4046},{"gettingStarted":4,"api":57,"theme":148},[5],{"title":6,"icon":7,"path":8,"stem":9,"children":10,"page":7},"Getting Started",false,"/docs/getting-started","docs/getting-started",[11,16,21,26,31,52],{"title":12,"path":13,"stem":14,"icon":15},"Introduction","/docs/getting-started/introduction","docs/getting-started/01.introduction","i-lucide-house",{"title":17,"path":18,"stem":19,"icon":20},"Installation","/docs/getting-started/installation","docs/getting-started/02.installation","i-lucide-download",{"title":22,"path":23,"stem":24,"icon":25},"Guides","/docs/getting-started/guides","docs/getting-started/03.guides","i-lucide-book-open",{"title":27,"path":28,"stem":29,"icon":30},"Comparisons","/docs/getting-started/comparisons","docs/getting-started/04.comparisons","i-lucide-file-diff",{"title":32,"icon":33,"path":34,"stem":35,"children":36,"page":7},"Tooling","i-lucide-hammer","/docs/getting-started/tooling","docs/getting-started/05.tooling",[37,42,47],{"title":38,"path":39,"stem":40,"icon":41},"CLI Reference","/docs/getting-started/tooling/cli","docs/getting-started/05.tooling/01.cli","i-lucide-square-terminal",{"title":43,"path":44,"stem":45,"icon":46},"Utility Scanner","/docs/getting-started/tooling/scanner","docs/getting-started/05.tooling/02.scanner","i-lucide-view",{"title":48,"path":49,"stem":50,"icon":51},"Figma Plugin","/docs/getting-started/tooling/figma-plugin","docs/getting-started/05.tooling/03.figma-plugin","i-simple-icons-figma",{"title":53,"path":54,"stem":55,"icon":56},"Licensing","/docs/getting-started/licensing","docs/getting-started/06.licensing","i-lucide-scale",[58],{"title":59,"path":60,"stem":61,"children":62,"icon":7},"API Reference","/docs/api","docs/api/00.index",[63,66,71,76,81,86,91,96,101,106,111,116,131,136,141,146],{"title":64,"path":60,"stem":61,"icon":65},"Overview","i-lucide-book-text",{"title":67,"path":68,"stem":69,"icon":70},"Instance","/docs/api/instance","docs/api/01.instance","i-lucide-cloud-lightning",{"title":72,"path":73,"stem":74,"icon":75},"Variables","/docs/api/variables","docs/api/02.variables","i-lucide-variable",{"title":77,"path":78,"stem":79,"icon":80},"Selectors","/docs/api/selectors","docs/api/03.selectors","i-lucide-scan-text",{"title":82,"path":83,"stem":84,"icon":85},"At-Rules","/docs/api/at-rules","docs/api/04.at-rules","i-lucide-at-sign",{"title":87,"path":88,"stem":89,"icon":90},"Media Queries","/docs/api/media-queries","docs/api/05.media-queries","i-lucide-image-upscale",{"title":92,"path":93,"stem":94,"icon":95},"Keyframes","/docs/api/keyframes","docs/api/06.keyframes","i-lucide-square-play",{"title":97,"path":98,"stem":99,"icon":100},"Interpolation","/docs/api/interpolation","docs/api/07.interpolation","i-lucide-wrap-text",{"title":102,"path":103,"stem":104,"icon":105},"Utilities","/docs/api/utilities","docs/api/08.utilities","i-lucide-sparkles",{"title":107,"path":108,"stem":109,"icon":110},"Utility Modifiers","/docs/api/utility-modifiers","docs/api/09.utility-modifiers","i-lucide-align-horizontal-justify-center",{"title":112,"path":113,"stem":114,"icon":115},"Themes","/docs/api/themes","docs/api/10.themes","i-lucide-paintbrush",{"title":117,"path":118,"stem":119,"children":120,"icon":130},"Recipes","/docs/api/recipes","docs/api/11.recipes/00.index",[121,122,126],{"title":64,"path":118,"stem":119},{"title":123,"path":124,"stem":125},"Runtime","/docs/api/recipes/runtime","docs/api/11.recipes/01.runtime",{"title":127,"path":128,"stem":129},"Output Format","/docs/api/recipes/output-format","docs/api/11.recipes/02.output-format","i-lucide-chef-hat",{"title":132,"path":133,"stem":134,"icon":135},"Composables","/docs/api/composables","docs/api/12.composables","i-lucide-component",{"title":137,"path":138,"stem":139,"icon":140},"Imports","/docs/api/imports","docs/api/13.imports","i-lucide-file-input",{"title":142,"path":143,"stem":144,"icon":145},"Merging","/docs/api/merging","docs/api/13.merging","i-lucide-squares-intersect",{"title":137,"path":138,"stem":147,"icon":140},"docs/api/14.imports",[149,223,289,362],{"title":150,"path":151,"stem":152,"children":153,"icon":7},"Design Tokens","/docs/theme/design-tokens","docs/theme/design-tokens/00.index",[154,155,160],{"title":64,"path":151,"stem":152,"icon":65},{"title":156,"path":157,"stem":158,"icon":159},"Presets","/docs/theme/design-tokens/presets","docs/theme/design-tokens/01.presets","i-lucide-package",{"title":132,"icon":135,"defaultOpen":7,"path":161,"stem":162,"children":163,"page":7},"/docs/theme/design-tokens/composables","docs/theme/design-tokens/02.composables",[164,168,172,176,180,184,188,192,207,211,215,219],{"title":165,"path":166,"stem":167,"icon":7},"Border Radiuses","/docs/theme/design-tokens/composables/border-radiuses","docs/theme/design-tokens/02.composables/00.border-radiuses",{"title":169,"path":170,"stem":171,"icon":7},"Borders","/docs/theme/design-tokens/composables/borders","docs/theme/design-tokens/02.composables/01.borders",{"title":173,"path":174,"stem":175,"icon":7},"Box Shadows","/docs/theme/design-tokens/composables/box-shadows","docs/theme/design-tokens/02.composables/02.box-shadows",{"title":177,"path":178,"stem":179,"icon":7},"Breakpoints","/docs/theme/design-tokens/composables/breakpoints","docs/theme/design-tokens/02.composables/03.breakpoints",{"title":181,"path":182,"stem":183,"icon":7},"Colors","/docs/theme/design-tokens/composables/colors","docs/theme/design-tokens/02.composables/04.colors",{"title":185,"path":186,"stem":187,"icon":7},"Duration","/docs/theme/design-tokens/composables/duration","docs/theme/design-tokens/02.composables/05.duration",{"title":189,"path":190,"stem":191,"icon":7},"Easing","/docs/theme/design-tokens/composables/easing","docs/theme/design-tokens/02.composables/06.easing",{"title":193,"path":194,"stem":195,"children":196,"icon":7,"pro":206,"defaultOpen":7},"Fluid Design","/docs/theme/design-tokens/composables/fluid-design","docs/theme/design-tokens/02.composables/07.fluid-design/01.index",[197,198,202],{"title":64,"path":194,"stem":195},{"title":199,"path":200,"stem":201},"Fluid Viewport","/docs/theme/design-tokens/composables/fluid-design/viewport","docs/theme/design-tokens/02.composables/07.fluid-design/02.viewport",{"title":203,"path":204,"stem":205},"Fluid Typography","/docs/theme/design-tokens/composables/fluid-design/typography","docs/theme/design-tokens/02.composables/07.fluid-design/03.typography",true,{"title":208,"path":209,"stem":210,"icon":7},"Scales","/docs/theme/design-tokens/composables/scales","docs/theme/design-tokens/02.composables/08.scales",{"title":212,"path":213,"stem":214,"icon":7},"Spacing","/docs/theme/design-tokens/composables/spacing","docs/theme/design-tokens/02.composables/09.spacing",{"title":216,"path":217,"stem":218,"icon":7},"Typography","/docs/theme/design-tokens/composables/typography","docs/theme/design-tokens/02.composables/10.typography",{"title":220,"path":221,"stem":222,"icon":7},"Z-Index","/docs/theme/design-tokens/composables/z-index","docs/theme/design-tokens/02.composables/11.z-index",{"title":224,"path":225,"stem":226,"children":227,"icon":7},"Components","/docs/theme/components","docs/theme/components/00.index",[228,229],{"title":64,"path":225,"stem":226,"icon":65},{"title":132,"icon":135,"defaultOpen":206,"path":230,"stem":231,"children":232,"page":7},"/docs/theme/components/composables","docs/theme/components/02.composables",[233,237,241,245,249,253,257,261,265,269,273,277,281,285],{"title":234,"path":235,"stem":236},"Badge","/docs/theme/components/composables/badge","docs/theme/components/02.composables/01.badge",{"title":238,"path":239,"stem":240},"Button","/docs/theme/components/composables/button","docs/theme/components/02.composables/02.button",{"title":242,"path":243,"stem":244},"Button Group","/docs/theme/components/composables/button-group","docs/theme/components/02.composables/03.button-group",{"title":246,"path":247,"stem":248},"Callout","/docs/theme/components/composables/callout","docs/theme/components/02.composables/04.callout",{"title":250,"path":251,"stem":252},"Card","/docs/theme/components/composables/card","docs/theme/components/02.composables/05.card",{"title":254,"path":255,"stem":256},"Nav","/docs/theme/components/composables/nav","docs/theme/components/02.composables/06.nav",{"title":258,"path":259,"stem":260},"Modal","/docs/theme/components/composables/modal","docs/theme/components/02.composables/07.modal",{"title":262,"path":263,"stem":264},"Skeleton","/docs/theme/components/composables/skeleton","docs/theme/components/02.composables/08.skeleton",{"title":266,"path":267,"stem":268},"Tooltip","/docs/theme/components/composables/tooltip","docs/theme/components/02.composables/08.tooltip",{"title":270,"path":271,"stem":272},"Placeholder","/docs/theme/components/composables/placeholder","docs/theme/components/02.composables/09.placeholder",{"title":274,"path":275,"stem":276},"Progress","/docs/theme/components/composables/progress","docs/theme/components/02.composables/10.progress",{"title":278,"path":279,"stem":280},"Popover","/docs/theme/components/composables/popover","docs/theme/components/02.composables/11.popover",{"title":282,"path":283,"stem":284},"Chip","/docs/theme/components/composables/chip","docs/theme/components/02.composables/12.chip",{"title":286,"path":287,"stem":288},"Spinner","/docs/theme/components/composables/spinner","docs/theme/components/02.composables/13.spinner",{"title":102,"path":290,"stem":291,"children":292,"icon":7},"/docs/theme/utilities","docs/theme/utilities/00.index",[293,294,297],{"title":64,"path":290,"stem":291,"icon":65},{"title":156,"path":295,"stem":296,"icon":159},"/docs/theme/utilities/presets","docs/theme/utilities/01.presets",{"title":132,"icon":135,"defaultOpen":7,"path":298,"stem":299,"children":300,"page":7},"/docs/theme/utilities/composables","docs/theme/utilities/02.composables",[301,305,309,313,316,320,324,328,332,336,340,343,347,351,355,359],{"title":302,"path":303,"stem":304,"icon":7},"Accessibility","/docs/theme/utilities/composables/accessibility","docs/theme/utilities/02.composables/00.accessibility",{"title":306,"path":307,"stem":308,"icon":7},"Animations","/docs/theme/utilities/composables/animations","docs/theme/utilities/02.composables/01.animations",{"title":310,"path":311,"stem":312,"icon":7},"Backgrounds","/docs/theme/utilities/composables/backgrounds","docs/theme/utilities/02.composables/02.backgrounds",{"title":169,"path":314,"stem":315,"icon":7},"/docs/theme/utilities/composables/borders","docs/theme/utilities/02.composables/03.borders",{"title":317,"path":318,"stem":319,"icon":7},"Effects","/docs/theme/utilities/composables/effects","docs/theme/utilities/02.composables/04.effects",{"title":321,"path":322,"stem":323,"icon":7},"Filters","/docs/theme/utilities/composables/filters","docs/theme/utilities/02.composables/05.filters",{"title":325,"path":326,"stem":327,"icon":7},"Flexbox & Grid","/docs/theme/utilities/composables/flexbox-grid","docs/theme/utilities/02.composables/06.flexbox-grid",{"title":329,"path":330,"stem":331,"icon":7},"Interactivity","/docs/theme/utilities/composables/interactivity","docs/theme/utilities/02.composables/07.interactivity",{"title":333,"path":334,"stem":335,"icon":7},"Layout","/docs/theme/utilities/composables/layout","docs/theme/utilities/02.composables/08.layout",{"title":337,"path":338,"stem":339,"icon":7},"Sizing","/docs/theme/utilities/composables/sizing","docs/theme/utilities/02.composables/09.sizing",{"title":212,"path":341,"stem":342,"icon":7},"/docs/theme/utilities/composables/spacing","docs/theme/utilities/02.composables/10.spacing",{"title":344,"path":345,"stem":346,"icon":7},"SVG","/docs/theme/utilities/composables/svg","docs/theme/utilities/02.composables/11.svg",{"title":348,"path":349,"stem":350,"icon":7},"Tables","/docs/theme/utilities/composables/tables","docs/theme/utilities/02.composables/12.tables",{"title":352,"path":353,"stem":354,"icon":7},"Transforms","/docs/theme/utilities/composables/transforms","docs/theme/utilities/02.composables/13.transforms",{"title":356,"path":357,"stem":358,"icon":7},"Transitions","/docs/theme/utilities/composables/transitions","docs/theme/utilities/02.composables/14.transitions",{"title":216,"path":360,"stem":361,"icon":7},"/docs/theme/utilities/composables/typography","docs/theme/utilities/02.composables/15.typography",{"title":363,"path":364,"stem":365,"children":366,"icon":7},"Modifiers","/docs/theme/modifiers","docs/theme/modifiers/00.index",[367,368,371],{"title":64,"path":364,"stem":365,"icon":65},{"title":156,"path":369,"stem":370,"icon":159},"/docs/theme/modifiers/presets","docs/theme/modifiers/01.presets",{"title":132,"icon":135,"defaultOpen":7,"path":372,"stem":373,"children":374,"page":7},"/docs/theme/modifiers/composables","docs/theme/modifiers/02.composables",[375,379,383,387,391,395,399,403],{"title":376,"path":377,"stem":378,"icon":7},"ARIA State","/docs/theme/modifiers/composables/aria-state","docs/theme/modifiers/02.composables/00.aria-state",{"title":380,"path":381,"stem":382,"icon":7},"Directional","/docs/theme/modifiers/composables/directional","docs/theme/modifiers/02.composables/01.directional",{"title":384,"path":385,"stem":386,"icon":7},"Form State","/docs/theme/modifiers/composables/form-state","docs/theme/modifiers/02.composables/02.form-state",{"title":388,"path":389,"stem":390,"icon":7},"Media & Preferences","/docs/theme/modifiers/composables/media-preferences","docs/theme/modifiers/02.composables/03.media-preferences",{"title":392,"path":393,"stem":394,"icon":7},"Other State","/docs/theme/modifiers/composables/other-state","docs/theme/modifiers/02.composables/04.other-state",{"title":396,"path":397,"stem":398,"icon":7},"Pseudo-Elements","/docs/theme/modifiers/composables/pseudo-elements","docs/theme/modifiers/02.composables/05.pseudo-elements",{"title":400,"path":401,"stem":402,"icon":7},"Pseudo-State","/docs/theme/modifiers/composables/pseudo-state","docs/theme/modifiers/02.composables/06.pseudo-state",{"title":404,"path":405,"stem":406,"icon":7},"Structural","/docs/theme/modifiers/composables/structural","docs/theme/modifiers/02.composables/07.structural",{"id":408,"title":409,"body":410,"description":4038,"extension":4039,"links":4040,"meta":4041,"navigation":4042,"path":377,"seo":4043,"sitemap":4044,"stem":378,"__hash__":4045},"docs_theme/docs/theme/modifiers/02.composables/00.aria-state.md","ARIA State Modifiers",{"type":411,"value":412,"toc":4016},"minimark",[413,417,426,430,433,462,468,479,484,515,521,529,532,556,562,570,1056,1059,1083,1089,1097,1588,1591,1615,1621,1629,1632,1656,1662,1670,2123,2126,2150,2156,2164,2167,2191,2197,2205,2208,2232,2238,2246,2783,2786,2810,2816,2822,2827,2977,2981,2985,3361,3365,3901,3905,3944,3948,4012],[414,415,64],"h2",{"id":416},"overview",[418,419,420,421,425],"p",{},"ARIA state modifiers let you apply utility styles conditionally based on ARIA attribute values. They wrap utility declarations in attribute selectors like ",[422,423,424],"code",{},"[aria-expanded=\"true\"]",", generating variant utility classes that respond to accessibility state changes.",[414,427,429],{"id":428},"why-use-aria-state-modifiers","Why Use ARIA State Modifiers?",[418,431,432],{},"ARIA state modifiers help you:",[434,435,436,444,450,456],"ul",{},[437,438,439,443],"li",{},[440,441,442],"strong",{},"Style accessible components",": Apply styles based on ARIA attributes used by screen readers",[437,445,446,449],{},[440,447,448],{},"Avoid JavaScript class toggling",": Let ARIA attributes drive both accessibility and visual presentation",[437,451,452,455],{},[440,453,454],{},"Build inclusive UIs",": Keep visual state in sync with the accessibility tree",[437,457,458,461],{},[440,459,460],{},"Follow WAI-ARIA patterns",": Style disclosure widgets, tabs, accordions, and more using standard ARIA attributes",[414,463,465],{"id":464},"useariabusymodifier",[422,466,467],{},"useAriaBusyModifier",[418,469,470,471,474,475,478],{},"The ",[422,472,473],{},"useAriaBusyModifier()"," function creates a modifier that applies styles when ",[422,476,477],{},"aria-busy=\"true\"",".",[480,481,483],"h4",{"id":482},"css-selector","CSS Selector",[485,486,487,499],"table",{},[488,489,490],"thead",{},[491,492,493,497],"tr",{},[494,495,496],"th",{},"Modifier Name",[494,498,483],{},[500,501,502],"tbody",{},[491,503,504,510],{},[505,506,507],"td",{},[422,508,509],{},"aria-busy",[505,511,512],{},[422,513,514],{},"&[aria-busy=\"true\"]",[414,516,518],{"id":517},"useariacheckedmodifier",[422,519,520],{},"useAriaCheckedModifier",[418,522,470,523,474,526,478],{},[422,524,525],{},"useAriaCheckedModifier()",[422,527,528],{},"aria-checked=\"true\"",[480,530,483],{"id":531},"css-selector-1",[485,533,534,542],{},[488,535,536],{},[491,537,538,540],{},[494,539,496],{},[494,541,483],{},[500,543,544],{},[491,545,546,551],{},[505,547,548],{},[422,549,550],{},"aria-checked",[505,552,553],{},[422,554,555],{},"&[aria-checked=\"true\"]",[414,557,559],{"id":558},"useariadisabledmodifier",[422,560,561],{},"useAriaDisabledModifier",[418,563,470,564,474,567,478],{},[422,565,566],{},"useAriaDisabledModifier()",[422,568,569],{},"aria-disabled=\"true\"",[571,572,573,819,968],"tabs",{},[574,575,578],"tabs-item",{"icon":576,"label":577},"i-lucide-code","Code",[579,580,586],"pre",{"className":581,"code":582,"filename":583,"language":584,"meta":585,"style":585},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { styleframe } from \"styleframe\";\nimport { useOpacityUtility, useCursorUtility } from \"@styleframe/theme\";\nimport { useAriaDisabledModifier } from \"@styleframe/theme\";\n\nconst s = styleframe();\n\nconst ariaDisabled = useAriaDisabledModifier(s);\n\nuseOpacityUtility(s, { 50: '0.5' }, [ariaDisabled]);\nuseCursorUtility(s, { 'not-allowed': 'not-allowed' }, [ariaDisabled]);\n\nexport default s;\n","styleframe.config.ts","ts","",[422,587,588,624,653,675,681,702,707,724,729,766,800,805],{"__ignoreMap":585},[589,590,593,597,601,605,608,611,614,618,621],"span",{"class":591,"line":592},"line",1,[589,594,596],{"class":595},"s7zQu","import",[589,598,600],{"class":599},"sMK4o"," {",[589,602,604],{"class":603},"sTEyZ"," styleframe",[589,606,607],{"class":599}," }",[589,609,610],{"class":595}," from",[589,612,613],{"class":599}," \"",[589,615,617],{"class":616},"sfazB","styleframe",[589,619,620],{"class":599},"\"",[589,622,623],{"class":599},";\n",[589,625,627,629,631,634,637,640,642,644,646,649,651],{"class":591,"line":626},2,[589,628,596],{"class":595},[589,630,600],{"class":599},[589,632,633],{"class":603}," useOpacityUtility",[589,635,636],{"class":599},",",[589,638,639],{"class":603}," useCursorUtility",[589,641,607],{"class":599},[589,643,610],{"class":595},[589,645,613],{"class":599},[589,647,648],{"class":616},"@styleframe/theme",[589,650,620],{"class":599},[589,652,623],{"class":599},[589,654,656,658,660,663,665,667,669,671,673],{"class":591,"line":655},3,[589,657,596],{"class":595},[589,659,600],{"class":599},[589,661,662],{"class":603}," useAriaDisabledModifier",[589,664,607],{"class":599},[589,666,610],{"class":595},[589,668,613],{"class":599},[589,670,648],{"class":616},[589,672,620],{"class":599},[589,674,623],{"class":599},[589,676,678],{"class":591,"line":677},4,[589,679,680],{"emptyLinePlaceholder":206},"\n",[589,682,684,688,691,694,697,700],{"class":591,"line":683},5,[589,685,687],{"class":686},"spNyl","const",[589,689,690],{"class":603}," s ",[589,692,693],{"class":599},"=",[589,695,604],{"class":696},"s2Zo4",[589,698,699],{"class":603},"()",[589,701,623],{"class":599},[589,703,705],{"class":591,"line":704},6,[589,706,680],{"emptyLinePlaceholder":206},[589,708,710,712,715,717,719,722],{"class":591,"line":709},7,[589,711,687],{"class":686},[589,713,714],{"class":603}," ariaDisabled ",[589,716,693],{"class":599},[589,718,662],{"class":696},[589,720,721],{"class":603},"(s)",[589,723,623],{"class":599},[589,725,727],{"class":591,"line":726},8,[589,728,680],{"emptyLinePlaceholder":206},[589,730,732,735,738,740,742,746,749,752,755,758,761,764],{"class":591,"line":731},9,[589,733,734],{"class":696},"useOpacityUtility",[589,736,737],{"class":603},"(s",[589,739,636],{"class":599},[589,741,600],{"class":599},[589,743,745],{"class":744},"sbssI"," 50",[589,747,748],{"class":599},":",[589,750,751],{"class":599}," '",[589,753,754],{"class":616},"0.5",[589,756,757],{"class":599},"'",[589,759,760],{"class":599}," },",[589,762,763],{"class":603}," [ariaDisabled])",[589,765,623],{"class":599},[589,767,769,772,774,776,778,780,784,786,788,790,792,794,796,798],{"class":591,"line":768},10,[589,770,771],{"class":696},"useCursorUtility",[589,773,737],{"class":603},[589,775,636],{"class":599},[589,777,600],{"class":599},[589,779,751],{"class":599},[589,781,783],{"class":782},"swJcz","not-allowed",[589,785,757],{"class":599},[589,787,748],{"class":599},[589,789,751],{"class":599},[589,791,783],{"class":616},[589,793,757],{"class":599},[589,795,760],{"class":599},[589,797,763],{"class":603},[589,799,623],{"class":599},[589,801,803],{"class":591,"line":802},11,[589,804,680],{"emptyLinePlaceholder":206},[589,806,808,811,814,817],{"class":591,"line":807},12,[589,809,810],{"class":595},"export",[589,812,813],{"class":595}," default",[589,815,816],{"class":603}," s",[589,818,623],{"class":599},[574,820,822],{"icon":140,"label":821},"Output",[579,823,828],{"className":824,"code":825,"filename":826,"language":827,"meta":585,"style":585},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","._opacity\\:50 { opacity: 0.5; }\n._cursor\\:not-allowed { cursor: not-allowed; }\n\n._aria-disabled\\:opacity\\:50 {\n    &[aria-disabled=\"true\"] { opacity: 0.5; }\n}\n\n._aria-disabled\\:cursor\\:not-allowed {\n    &[aria-disabled=\"true\"] { cursor: not-allowed; }\n}\n","styleframe/index.css","css",[422,829,830,861,886,890,909,924,929,933,950,964],{"__ignoreMap":585},[589,831,832,834,838,841,844,846,850,852,855,858],{"class":591,"line":592},[589,833,478],{"class":599},[589,835,837],{"class":836},"sBMFI","_opacity",[589,839,840],{"class":603},"\\:",[589,842,843],{"class":836},"50",[589,845,600],{"class":599},[589,847,849],{"class":848},"sqsOY"," opacity",[589,851,748],{"class":599},[589,853,854],{"class":744}," 0.5",[589,856,857],{"class":599},";",[589,859,860],{"class":599}," }\n",[589,862,863,865,868,870,872,874,877,879,882,884],{"class":591,"line":626},[589,864,478],{"class":599},[589,866,867],{"class":836},"_cursor",[589,869,840],{"class":603},[589,871,783],{"class":836},[589,873,600],{"class":599},[589,875,876],{"class":848}," cursor",[589,878,748],{"class":599},[589,880,881],{"class":603}," not-allowed",[589,883,857],{"class":599},[589,885,860],{"class":599},[589,887,888],{"class":591,"line":655},[589,889,680],{"emptyLinePlaceholder":206},[589,891,892,894,897,899,902,904,906],{"class":591,"line":677},[589,893,478],{"class":599},[589,895,896],{"class":836},"_aria-disabled",[589,898,840],{"class":603},[589,900,901],{"class":836},"opacity",[589,903,840],{"class":603},[589,905,843],{"class":836},[589,907,908],{"class":599}," {\n",[589,910,911,914,916,918,920,922],{"class":591,"line":683},[589,912,913],{"class":603},"    &[aria-disabled=\"true\"] { ",[589,915,901],{"class":848},[589,917,748],{"class":599},[589,919,854],{"class":744},[589,921,857],{"class":599},[589,923,860],{"class":599},[589,925,926],{"class":591,"line":704},[589,927,928],{"class":603},"}\n",[589,930,931],{"class":591,"line":709},[589,932,680],{"emptyLinePlaceholder":206},[589,934,935,937,939,941,944,946,948],{"class":591,"line":726},[589,936,478],{"class":599},[589,938,896],{"class":836},[589,940,840],{"class":603},[589,942,943],{"class":836},"cursor",[589,945,840],{"class":603},[589,947,783],{"class":836},[589,949,908],{"class":599},[589,951,952,954,956,958,960,962],{"class":591,"line":731},[589,953,913],{"class":603},[589,955,943],{"class":848},[589,957,748],{"class":599},[589,959,881],{"class":603},[589,961,857],{"class":599},[589,963,860],{"class":599},[589,965,966],{"class":591,"line":768},[589,967,928],{"class":603},[574,969,972],{"icon":970,"label":971},"i-lucide-layout","Usage",[579,973,977],{"className":974,"code":975,"language":976,"meta":585,"style":585},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003C!-- Style custom disabled button -->\n\u003Cdiv\n    role=\"button\"\n    aria-disabled=\"true\"\n    class=\"_aria-disabled:opacity:50 _aria-disabled:cursor:not-allowed\"\n>\n    Disabled action\n\u003C/div>\n","html",[422,978,979,985,993,1008,1022,1036,1041,1046],{"__ignoreMap":585},[589,980,981],{"class":591,"line":592},[589,982,984],{"class":983},"sHwdD","\u003C!-- Style custom disabled button -->\n",[589,986,987,990],{"class":591,"line":626},[589,988,989],{"class":599},"\u003C",[589,991,992],{"class":782},"div\n",[589,994,995,998,1000,1002,1005],{"class":591,"line":655},[589,996,997],{"class":686},"    role",[589,999,693],{"class":599},[589,1001,620],{"class":599},[589,1003,1004],{"class":616},"button",[589,1006,1007],{"class":599},"\"\n",[589,1009,1010,1013,1015,1017,1020],{"class":591,"line":677},[589,1011,1012],{"class":686},"    aria-disabled",[589,1014,693],{"class":599},[589,1016,620],{"class":599},[589,1018,1019],{"class":616},"true",[589,1021,1007],{"class":599},[589,1023,1024,1027,1029,1031,1034],{"class":591,"line":683},[589,1025,1026],{"class":686},"    class",[589,1028,693],{"class":599},[589,1030,620],{"class":599},[589,1032,1033],{"class":616},"_aria-disabled:opacity:50 _aria-disabled:cursor:not-allowed",[589,1035,1007],{"class":599},[589,1037,1038],{"class":591,"line":704},[589,1039,1040],{"class":599},">\n",[589,1042,1043],{"class":591,"line":709},[589,1044,1045],{"class":603},"    Disabled action\n",[589,1047,1048,1051,1054],{"class":591,"line":726},[589,1049,1050],{"class":599},"\u003C/",[589,1052,1053],{"class":782},"div",[589,1055,1040],{"class":599},[480,1057,483],{"id":1058},"css-selector-2",[485,1060,1061,1069],{},[488,1062,1063],{},[491,1064,1065,1067],{},[494,1066,496],{},[494,1068,483],{},[500,1070,1071],{},[491,1072,1073,1078],{},[505,1074,1075],{},[422,1076,1077],{},"aria-disabled",[505,1079,1080],{},[422,1081,1082],{},"&[aria-disabled=\"true\"]",[414,1084,1086],{"id":1085},"useariaexpandedmodifier",[422,1087,1088],{},"useAriaExpandedModifier",[418,1090,470,1091,474,1094,478],{},[422,1092,1093],{},"useAriaExpandedModifier()",[422,1095,1096],{},"aria-expanded=\"true\"",[571,1098,1099,1327,1488],{},[574,1100,1101],{"icon":576,"label":577},[579,1102,1104],{"className":581,"code":1103,"filename":583,"language":584,"meta":585,"style":585},"import { styleframe } from \"styleframe\";\nimport { useDisplayUtility, useRotateUtility } from \"@styleframe/theme\";\nimport { useAriaExpandedModifier } from \"@styleframe/theme\";\n\nconst s = styleframe();\n\nconst ariaExpanded = useAriaExpandedModifier(s);\n\nuseDisplayUtility(s, {\n    block: 'block',\n    none: 'none',\n}, [ariaExpanded]);\n\nuseRotateUtility(s, {\n    180: '180deg',\n}, [ariaExpanded]);\n\nexport default s;\n",[422,1105,1106,1126,1152,1173,1177,1191,1195,1210,1214,1225,1242,1258,1268,1273,1285,1302,1311,1316],{"__ignoreMap":585},[589,1107,1108,1110,1112,1114,1116,1118,1120,1122,1124],{"class":591,"line":592},[589,1109,596],{"class":595},[589,1111,600],{"class":599},[589,1113,604],{"class":603},[589,1115,607],{"class":599},[589,1117,610],{"class":595},[589,1119,613],{"class":599},[589,1121,617],{"class":616},[589,1123,620],{"class":599},[589,1125,623],{"class":599},[589,1127,1128,1130,1132,1135,1137,1140,1142,1144,1146,1148,1150],{"class":591,"line":626},[589,1129,596],{"class":595},[589,1131,600],{"class":599},[589,1133,1134],{"class":603}," useDisplayUtility",[589,1136,636],{"class":599},[589,1138,1139],{"class":603}," useRotateUtility",[589,1141,607],{"class":599},[589,1143,610],{"class":595},[589,1145,613],{"class":599},[589,1147,648],{"class":616},[589,1149,620],{"class":599},[589,1151,623],{"class":599},[589,1153,1154,1156,1158,1161,1163,1165,1167,1169,1171],{"class":591,"line":655},[589,1155,596],{"class":595},[589,1157,600],{"class":599},[589,1159,1160],{"class":603}," useAriaExpandedModifier",[589,1162,607],{"class":599},[589,1164,610],{"class":595},[589,1166,613],{"class":599},[589,1168,648],{"class":616},[589,1170,620],{"class":599},[589,1172,623],{"class":599},[589,1174,1175],{"class":591,"line":677},[589,1176,680],{"emptyLinePlaceholder":206},[589,1178,1179,1181,1183,1185,1187,1189],{"class":591,"line":683},[589,1180,687],{"class":686},[589,1182,690],{"class":603},[589,1184,693],{"class":599},[589,1186,604],{"class":696},[589,1188,699],{"class":603},[589,1190,623],{"class":599},[589,1192,1193],{"class":591,"line":704},[589,1194,680],{"emptyLinePlaceholder":206},[589,1196,1197,1199,1202,1204,1206,1208],{"class":591,"line":709},[589,1198,687],{"class":686},[589,1200,1201],{"class":603}," ariaExpanded ",[589,1203,693],{"class":599},[589,1205,1160],{"class":696},[589,1207,721],{"class":603},[589,1209,623],{"class":599},[589,1211,1212],{"class":591,"line":726},[589,1213,680],{"emptyLinePlaceholder":206},[589,1215,1216,1219,1221,1223],{"class":591,"line":731},[589,1217,1218],{"class":696},"useDisplayUtility",[589,1220,737],{"class":603},[589,1222,636],{"class":599},[589,1224,908],{"class":599},[589,1226,1227,1230,1232,1234,1237,1239],{"class":591,"line":768},[589,1228,1229],{"class":782},"    block",[589,1231,748],{"class":599},[589,1233,751],{"class":599},[589,1235,1236],{"class":616},"block",[589,1238,757],{"class":599},[589,1240,1241],{"class":599},",\n",[589,1243,1244,1247,1249,1251,1254,1256],{"class":591,"line":802},[589,1245,1246],{"class":782},"    none",[589,1248,748],{"class":599},[589,1250,751],{"class":599},[589,1252,1253],{"class":616},"none",[589,1255,757],{"class":599},[589,1257,1241],{"class":599},[589,1259,1260,1263,1266],{"class":591,"line":807},[589,1261,1262],{"class":599},"},",[589,1264,1265],{"class":603}," [ariaExpanded])",[589,1267,623],{"class":599},[589,1269,1271],{"class":591,"line":1270},13,[589,1272,680],{"emptyLinePlaceholder":206},[589,1274,1276,1279,1281,1283],{"class":591,"line":1275},14,[589,1277,1278],{"class":696},"useRotateUtility",[589,1280,737],{"class":603},[589,1282,636],{"class":599},[589,1284,908],{"class":599},[589,1286,1288,1291,1293,1295,1298,1300],{"class":591,"line":1287},15,[589,1289,1290],{"class":744},"    180",[589,1292,748],{"class":599},[589,1294,751],{"class":599},[589,1296,1297],{"class":616},"180deg",[589,1299,757],{"class":599},[589,1301,1241],{"class":599},[589,1303,1305,1307,1309],{"class":591,"line":1304},16,[589,1306,1262],{"class":599},[589,1308,1265],{"class":603},[589,1310,623],{"class":599},[589,1312,1314],{"class":591,"line":1313},17,[589,1315,680],{"emptyLinePlaceholder":206},[589,1317,1319,1321,1323,1325],{"class":591,"line":1318},18,[589,1320,810],{"class":595},[589,1322,813],{"class":595},[589,1324,816],{"class":603},[589,1326,623],{"class":599},[574,1328,1329],{"icon":140,"label":821},[579,1330,1332],{"className":824,"code":1331,"filename":826,"language":827,"meta":585,"style":585},"._display\\:block { display: block; }\n._display\\:none { display: none; }\n._rotate\\:180 { rotate: 180deg; }\n\n._aria-expanded\\:display\\:block {\n    &[aria-expanded=\"true\"] { display: block; }\n}\n\n._aria-expanded\\:rotate\\:180 {\n    &[aria-expanded=\"true\"] { rotate: 180deg; }\n}\n",[422,1333,1334,1359,1382,1408,1412,1430,1445,1449,1453,1470,1484],{"__ignoreMap":585},[589,1335,1336,1338,1341,1343,1345,1347,1350,1352,1355,1357],{"class":591,"line":592},[589,1337,478],{"class":599},[589,1339,1340],{"class":836},"_display",[589,1342,840],{"class":603},[589,1344,1236],{"class":836},[589,1346,600],{"class":599},[589,1348,1349],{"class":848}," display",[589,1351,748],{"class":599},[589,1353,1354],{"class":603}," block",[589,1356,857],{"class":599},[589,1358,860],{"class":599},[589,1360,1361,1363,1365,1367,1369,1371,1373,1375,1378,1380],{"class":591,"line":626},[589,1362,478],{"class":599},[589,1364,1340],{"class":836},[589,1366,840],{"class":603},[589,1368,1253],{"class":836},[589,1370,600],{"class":599},[589,1372,1349],{"class":848},[589,1374,748],{"class":599},[589,1376,1377],{"class":603}," none",[589,1379,857],{"class":599},[589,1381,860],{"class":599},[589,1383,1384,1386,1389,1391,1394,1396,1399,1401,1404,1406],{"class":591,"line":655},[589,1385,478],{"class":599},[589,1387,1388],{"class":836},"_rotate",[589,1390,840],{"class":603},[589,1392,1393],{"class":836},"180",[589,1395,600],{"class":599},[589,1397,1398],{"class":848}," rotate",[589,1400,748],{"class":599},[589,1402,1403],{"class":744}," 180deg",[589,1405,857],{"class":599},[589,1407,860],{"class":599},[589,1409,1410],{"class":591,"line":677},[589,1411,680],{"emptyLinePlaceholder":206},[589,1413,1414,1416,1419,1421,1424,1426,1428],{"class":591,"line":683},[589,1415,478],{"class":599},[589,1417,1418],{"class":836},"_aria-expanded",[589,1420,840],{"class":603},[589,1422,1423],{"class":836},"display",[589,1425,840],{"class":603},[589,1427,1236],{"class":836},[589,1429,908],{"class":599},[589,1431,1432,1435,1437,1439,1441,1443],{"class":591,"line":704},[589,1433,1434],{"class":603},"    &[aria-expanded=\"true\"] { ",[589,1436,1423],{"class":848},[589,1438,748],{"class":599},[589,1440,1354],{"class":603},[589,1442,857],{"class":599},[589,1444,860],{"class":599},[589,1446,1447],{"class":591,"line":709},[589,1448,928],{"class":603},[589,1450,1451],{"class":591,"line":726},[589,1452,680],{"emptyLinePlaceholder":206},[589,1454,1455,1457,1459,1461,1464,1466,1468],{"class":591,"line":731},[589,1456,478],{"class":599},[589,1458,1418],{"class":836},[589,1460,840],{"class":603},[589,1462,1463],{"class":836},"rotate",[589,1465,840],{"class":603},[589,1467,1393],{"class":836},[589,1469,908],{"class":599},[589,1471,1472,1474,1476,1478,1480,1482],{"class":591,"line":768},[589,1473,1434],{"class":603},[589,1475,1463],{"class":848},[589,1477,748],{"class":599},[589,1479,1403],{"class":744},[589,1481,857],{"class":599},[589,1483,860],{"class":599},[589,1485,1486],{"class":591,"line":802},[589,1487,928],{"class":603},[574,1489,1490],{"icon":970,"label":971},[579,1491,1493],{"className":974,"code":1492,"language":976,"meta":585,"style":585},"\u003C!-- Accordion trigger with rotating icon -->\n\u003Cbutton aria-expanded=\"false\" class=\"_aria-expanded:rotate:180\">\n    \u003Cspan>Toggle section\u003C/span>\n    \u003Csvg class=\"icon\">\u003C!-- chevron icon -->\u003C/svg>\n\u003C/button>\n",[422,1494,1495,1500,1532,1551,1580],{"__ignoreMap":585},[589,1496,1497],{"class":591,"line":592},[589,1498,1499],{"class":983},"\u003C!-- Accordion trigger with rotating icon -->\n",[589,1501,1502,1504,1506,1509,1511,1513,1516,1518,1521,1523,1525,1528,1530],{"class":591,"line":626},[589,1503,989],{"class":599},[589,1505,1004],{"class":782},[589,1507,1508],{"class":686}," aria-expanded",[589,1510,693],{"class":599},[589,1512,620],{"class":599},[589,1514,1515],{"class":616},"false",[589,1517,620],{"class":599},[589,1519,1520],{"class":686}," class",[589,1522,693],{"class":599},[589,1524,620],{"class":599},[589,1526,1527],{"class":616},"_aria-expanded:rotate:180",[589,1529,620],{"class":599},[589,1531,1040],{"class":599},[589,1533,1534,1537,1539,1542,1545,1547,1549],{"class":591,"line":655},[589,1535,1536],{"class":599},"    \u003C",[589,1538,589],{"class":782},[589,1540,1541],{"class":599},">",[589,1543,1544],{"class":603},"Toggle section",[589,1546,1050],{"class":599},[589,1548,589],{"class":782},[589,1550,1040],{"class":599},[589,1552,1553,1555,1558,1560,1562,1564,1567,1569,1571,1574,1576,1578],{"class":591,"line":677},[589,1554,1536],{"class":599},[589,1556,1557],{"class":782},"svg",[589,1559,1520],{"class":686},[589,1561,693],{"class":599},[589,1563,620],{"class":599},[589,1565,1566],{"class":616},"icon",[589,1568,620],{"class":599},[589,1570,1541],{"class":599},[589,1572,1573],{"class":983},"\u003C!-- chevron icon -->",[589,1575,1050],{"class":599},[589,1577,1557],{"class":782},[589,1579,1040],{"class":599},[589,1581,1582,1584,1586],{"class":591,"line":683},[589,1583,1050],{"class":599},[589,1585,1004],{"class":782},[589,1587,1040],{"class":599},[480,1589,483],{"id":1590},"css-selector-3",[485,1592,1593,1601],{},[488,1594,1595],{},[491,1596,1597,1599],{},[494,1598,496],{},[494,1600,483],{},[500,1602,1603],{},[491,1604,1605,1610],{},[505,1606,1607],{},[422,1608,1609],{},"aria-expanded",[505,1611,1612],{},[422,1613,1614],{},"&[aria-expanded=\"true\"]",[414,1616,1618],{"id":1617},"useariahiddenmodifier",[422,1619,1620],{},"useAriaHiddenModifier",[418,1622,470,1623,474,1626,478],{},[422,1624,1625],{},"useAriaHiddenModifier()",[422,1627,1628],{},"aria-hidden=\"true\"",[480,1630,483],{"id":1631},"css-selector-4",[485,1633,1634,1642],{},[488,1635,1636],{},[491,1637,1638,1640],{},[494,1639,496],{},[494,1641,483],{},[500,1643,1644],{},[491,1645,1646,1651],{},[505,1647,1648],{},[422,1649,1650],{},"aria-hidden",[505,1652,1653],{},[422,1654,1655],{},"&[aria-hidden=\"true\"]",[414,1657,1659],{"id":1658},"useariapressedmodifier",[422,1660,1661],{},"useAriaPressedModifier",[418,1663,470,1664,474,1667,478],{},[422,1665,1666],{},"useAriaPressedModifier()",[422,1668,1669],{},"aria-pressed=\"true\"",[571,1671,1672,1937,2049],{},[574,1673,1674],{"icon":576,"label":577},[579,1675,1677],{"className":581,"code":1676,"filename":583,"language":584,"meta":585,"style":585},"import { styleframe } from \"styleframe\";\nimport { useColorDesignTokens } from \"@styleframe/theme\";\nimport { useBackgroundColorUtility } from \"@styleframe/theme\";\nimport { useAriaPressedModifier } from \"@styleframe/theme\";\n\nconst s = styleframe();\nconst { ref } = s;\n\nconst { colorPrimary } = useColorDesignTokens(s, { primary: '#006cff' } as const);\n\nconst ariaPressed = useAriaPressedModifier(s);\n\nuseBackgroundColorUtility(s, {\n    primary: ref(colorPrimary),\n    muted: '#e9ecef',\n}, [ariaPressed]);\n\nexport default s;\n",[422,1678,1679,1699,1720,1741,1762,1766,1780,1799,1803,1849,1853,1868,1872,1883,1898,1914,1923,1927],{"__ignoreMap":585},[589,1680,1681,1683,1685,1687,1689,1691,1693,1695,1697],{"class":591,"line":592},[589,1682,596],{"class":595},[589,1684,600],{"class":599},[589,1686,604],{"class":603},[589,1688,607],{"class":599},[589,1690,610],{"class":595},[589,1692,613],{"class":599},[589,1694,617],{"class":616},[589,1696,620],{"class":599},[589,1698,623],{"class":599},[589,1700,1701,1703,1705,1708,1710,1712,1714,1716,1718],{"class":591,"line":626},[589,1702,596],{"class":595},[589,1704,600],{"class":599},[589,1706,1707],{"class":603}," useColorDesignTokens",[589,1709,607],{"class":599},[589,1711,610],{"class":595},[589,1713,613],{"class":599},[589,1715,648],{"class":616},[589,1717,620],{"class":599},[589,1719,623],{"class":599},[589,1721,1722,1724,1726,1729,1731,1733,1735,1737,1739],{"class":591,"line":655},[589,1723,596],{"class":595},[589,1725,600],{"class":599},[589,1727,1728],{"class":603}," useBackgroundColorUtility",[589,1730,607],{"class":599},[589,1732,610],{"class":595},[589,1734,613],{"class":599},[589,1736,648],{"class":616},[589,1738,620],{"class":599},[589,1740,623],{"class":599},[589,1742,1743,1745,1747,1750,1752,1754,1756,1758,1760],{"class":591,"line":677},[589,1744,596],{"class":595},[589,1746,600],{"class":599},[589,1748,1749],{"class":603}," useAriaPressedModifier",[589,1751,607],{"class":599},[589,1753,610],{"class":595},[589,1755,613],{"class":599},[589,1757,648],{"class":616},[589,1759,620],{"class":599},[589,1761,623],{"class":599},[589,1763,1764],{"class":591,"line":683},[589,1765,680],{"emptyLinePlaceholder":206},[589,1767,1768,1770,1772,1774,1776,1778],{"class":591,"line":704},[589,1769,687],{"class":686},[589,1771,690],{"class":603},[589,1773,693],{"class":599},[589,1775,604],{"class":696},[589,1777,699],{"class":603},[589,1779,623],{"class":599},[589,1781,1782,1784,1786,1789,1792,1795,1797],{"class":591,"line":709},[589,1783,687],{"class":686},[589,1785,600],{"class":599},[589,1787,1788],{"class":603}," ref ",[589,1790,1791],{"class":599},"}",[589,1793,1794],{"class":599}," =",[589,1796,816],{"class":603},[589,1798,623],{"class":599},[589,1800,1801],{"class":591,"line":726},[589,1802,680],{"emptyLinePlaceholder":206},[589,1804,1805,1807,1809,1812,1814,1816,1818,1820,1822,1824,1827,1829,1831,1834,1836,1838,1841,1844,1847],{"class":591,"line":731},[589,1806,687],{"class":686},[589,1808,600],{"class":599},[589,1810,1811],{"class":603}," colorPrimary ",[589,1813,1791],{"class":599},[589,1815,1794],{"class":599},[589,1817,1707],{"class":696},[589,1819,737],{"class":603},[589,1821,636],{"class":599},[589,1823,600],{"class":599},[589,1825,1826],{"class":782}," primary",[589,1828,748],{"class":599},[589,1830,751],{"class":599},[589,1832,1833],{"class":616},"#006cff",[589,1835,757],{"class":599},[589,1837,607],{"class":599},[589,1839,1840],{"class":595}," as",[589,1842,1843],{"class":686}," const",[589,1845,1846],{"class":603},")",[589,1848,623],{"class":599},[589,1850,1851],{"class":591,"line":768},[589,1852,680],{"emptyLinePlaceholder":206},[589,1854,1855,1857,1860,1862,1864,1866],{"class":591,"line":802},[589,1856,687],{"class":686},[589,1858,1859],{"class":603}," ariaPressed ",[589,1861,693],{"class":599},[589,1863,1749],{"class":696},[589,1865,721],{"class":603},[589,1867,623],{"class":599},[589,1869,1870],{"class":591,"line":807},[589,1871,680],{"emptyLinePlaceholder":206},[589,1873,1874,1877,1879,1881],{"class":591,"line":1270},[589,1875,1876],{"class":696},"useBackgroundColorUtility",[589,1878,737],{"class":603},[589,1880,636],{"class":599},[589,1882,908],{"class":599},[589,1884,1885,1888,1890,1893,1896],{"class":591,"line":1275},[589,1886,1887],{"class":782},"    primary",[589,1889,748],{"class":599},[589,1891,1892],{"class":696}," ref",[589,1894,1895],{"class":603},"(colorPrimary)",[589,1897,1241],{"class":599},[589,1899,1900,1903,1905,1907,1910,1912],{"class":591,"line":1287},[589,1901,1902],{"class":782},"    muted",[589,1904,748],{"class":599},[589,1906,751],{"class":599},[589,1908,1909],{"class":616},"#e9ecef",[589,1911,757],{"class":599},[589,1913,1241],{"class":599},[589,1915,1916,1918,1921],{"class":591,"line":1304},[589,1917,1262],{"class":599},[589,1919,1920],{"class":603}," [ariaPressed])",[589,1922,623],{"class":599},[589,1924,1925],{"class":591,"line":1313},[589,1926,680],{"emptyLinePlaceholder":206},[589,1928,1929,1931,1933,1935],{"class":591,"line":1318},[589,1930,810],{"class":595},[589,1932,813],{"class":595},[589,1934,816],{"class":603},[589,1936,623],{"class":599},[574,1938,1939],{"icon":140,"label":821},[579,1940,1942],{"className":824,"code":1941,"filename":826,"language":827,"meta":585,"style":585},"._background-color\\:primary { background-color: var(--color--primary); }\n._background-color\\:muted { background-color: #e9ecef; }\n\n._aria-pressed\\:background-color\\:primary {\n    &[aria-pressed=\"true\"] { background-color: var(--color--primary); }\n}\n",[422,1943,1944,1977,2004,2008,2026,2045],{"__ignoreMap":585},[589,1945,1946,1948,1951,1953,1956,1958,1961,1963,1966,1969,1972,1975],{"class":591,"line":592},[589,1947,478],{"class":599},[589,1949,1950],{"class":836},"_background-color",[589,1952,840],{"class":603},[589,1954,1955],{"class":836},"primary",[589,1957,600],{"class":599},[589,1959,1960],{"class":848}," background-color",[589,1962,748],{"class":599},[589,1964,1965],{"class":696}," var",[589,1967,1968],{"class":599},"(",[589,1970,1971],{"class":603},"--color--primary",[589,1973,1974],{"class":599},");",[589,1976,860],{"class":599},[589,1978,1979,1981,1983,1985,1988,1990,1992,1994,1997,2000,2002],{"class":591,"line":626},[589,1980,478],{"class":599},[589,1982,1950],{"class":836},[589,1984,840],{"class":603},[589,1986,1987],{"class":836},"muted",[589,1989,600],{"class":599},[589,1991,1960],{"class":848},[589,1993,748],{"class":599},[589,1995,1996],{"class":599}," #",[589,1998,1999],{"class":603},"e9ecef",[589,2001,857],{"class":599},[589,2003,860],{"class":599},[589,2005,2006],{"class":591,"line":655},[589,2007,680],{"emptyLinePlaceholder":206},[589,2009,2010,2012,2015,2017,2020,2022,2024],{"class":591,"line":677},[589,2011,478],{"class":599},[589,2013,2014],{"class":836},"_aria-pressed",[589,2016,840],{"class":603},[589,2018,2019],{"class":836},"background-color",[589,2021,840],{"class":603},[589,2023,1955],{"class":836},[589,2025,908],{"class":599},[589,2027,2028,2031,2033,2035,2037,2039,2041,2043],{"class":591,"line":683},[589,2029,2030],{"class":603},"    &[aria-pressed=\"true\"] { ",[589,2032,2019],{"class":848},[589,2034,748],{"class":599},[589,2036,1965],{"class":696},[589,2038,1968],{"class":599},[589,2040,1971],{"class":603},[589,2042,1974],{"class":599},[589,2044,860],{"class":599},[589,2046,2047],{"class":591,"line":704},[589,2048,928],{"class":603},[574,2050,2051],{"icon":970,"label":971},[579,2052,2054],{"className":974,"code":2053,"language":976,"meta":585,"style":585},"\u003C!-- Toggle button -->\n\u003Cbutton\n    role=\"button\"\n    aria-pressed=\"false\"\n    class=\"_background-color:muted _aria-pressed:background-color:primary\"\n>\n    Toggle\n\u003C/button>\n",[422,2055,2056,2061,2068,2080,2093,2106,2110,2115],{"__ignoreMap":585},[589,2057,2058],{"class":591,"line":592},[589,2059,2060],{"class":983},"\u003C!-- Toggle button -->\n",[589,2062,2063,2065],{"class":591,"line":626},[589,2064,989],{"class":599},[589,2066,2067],{"class":782},"button\n",[589,2069,2070,2072,2074,2076,2078],{"class":591,"line":655},[589,2071,997],{"class":686},[589,2073,693],{"class":599},[589,2075,620],{"class":599},[589,2077,1004],{"class":616},[589,2079,1007],{"class":599},[589,2081,2082,2085,2087,2089,2091],{"class":591,"line":677},[589,2083,2084],{"class":686},"    aria-pressed",[589,2086,693],{"class":599},[589,2088,620],{"class":599},[589,2090,1515],{"class":616},[589,2092,1007],{"class":599},[589,2094,2095,2097,2099,2101,2104],{"class":591,"line":683},[589,2096,1026],{"class":686},[589,2098,693],{"class":599},[589,2100,620],{"class":599},[589,2102,2103],{"class":616},"_background-color:muted _aria-pressed:background-color:primary",[589,2105,1007],{"class":599},[589,2107,2108],{"class":591,"line":704},[589,2109,1040],{"class":599},[589,2111,2112],{"class":591,"line":709},[589,2113,2114],{"class":603},"    Toggle\n",[589,2116,2117,2119,2121],{"class":591,"line":726},[589,2118,1050],{"class":599},[589,2120,1004],{"class":782},[589,2122,1040],{"class":599},[480,2124,483],{"id":2125},"css-selector-5",[485,2127,2128,2136],{},[488,2129,2130],{},[491,2131,2132,2134],{},[494,2133,496],{},[494,2135,483],{},[500,2137,2138],{},[491,2139,2140,2145],{},[505,2141,2142],{},[422,2143,2144],{},"aria-pressed",[505,2146,2147],{},[422,2148,2149],{},"&[aria-pressed=\"true\"]",[414,2151,2153],{"id":2152},"useariareadonlymodifier",[422,2154,2155],{},"useAriaReadonlyModifier",[418,2157,470,2158,474,2161,478],{},[422,2159,2160],{},"useAriaReadonlyModifier()",[422,2162,2163],{},"aria-readonly=\"true\"",[480,2165,483],{"id":2166},"css-selector-6",[485,2168,2169,2177],{},[488,2170,2171],{},[491,2172,2173,2175],{},[494,2174,496],{},[494,2176,483],{},[500,2178,2179],{},[491,2180,2181,2186],{},[505,2182,2183],{},[422,2184,2185],{},"aria-readonly",[505,2187,2188],{},[422,2189,2190],{},"&[aria-readonly=\"true\"]",[414,2192,2194],{"id":2193},"useariarequiredmodifier",[422,2195,2196],{},"useAriaRequiredModifier",[418,2198,470,2199,474,2202,478],{},[422,2200,2201],{},"useAriaRequiredModifier()",[422,2203,2204],{},"aria-required=\"true\"",[480,2206,483],{"id":2207},"css-selector-7",[485,2209,2210,2218],{},[488,2211,2212],{},[491,2213,2214,2216],{},[494,2215,496],{},[494,2217,483],{},[500,2219,2220],{},[491,2221,2222,2227],{},[505,2223,2224],{},[422,2225,2226],{},"aria-required",[505,2228,2229],{},[422,2230,2231],{},"&[aria-required=\"true\"]",[414,2233,2235],{"id":2234},"useariaselectedmodifier",[422,2236,2237],{},"useAriaSelectedModifier",[418,2239,470,2240,474,2243,478],{},[422,2241,2242],{},"useAriaSelectedModifier()",[422,2244,2245],{},"aria-selected=\"true\"",[571,2247,2248,2542,2632],{},[574,2249,2250],{"icon":576,"label":577},[579,2251,2253],{"className":581,"code":2252,"filename":583,"language":584,"meta":585,"style":585},"import { styleframe } from \"styleframe\";\nimport { useColorDesignTokens } from \"@styleframe/theme\";\nimport { useBackgroundColorUtility, useBorderColorUtility } from \"@styleframe/theme\";\nimport { useAriaSelectedModifier } from \"@styleframe/theme\";\n\nconst s = styleframe();\nconst { ref } = s;\n\nconst { colorPrimary } = useColorDesignTokens(s, { primary: '#006cff' } as const);\n\nconst ariaSelected = useAriaSelectedModifier(s);\n\nuseBackgroundColorUtility(s, {\n    primary: ref(colorPrimary),\n    white: '#ffffff',\n}, [ariaSelected]);\n\nuseBorderColorUtility(s, {\n    primary: ref(colorPrimary),\n}, [ariaSelected]);\n\nexport default s;\n",[422,2254,2255,2275,2295,2320,2341,2345,2359,2375,2379,2419,2423,2438,2442,2452,2464,2480,2489,2493,2504,2517,2526,2531],{"__ignoreMap":585},[589,2256,2257,2259,2261,2263,2265,2267,2269,2271,2273],{"class":591,"line":592},[589,2258,596],{"class":595},[589,2260,600],{"class":599},[589,2262,604],{"class":603},[589,2264,607],{"class":599},[589,2266,610],{"class":595},[589,2268,613],{"class":599},[589,2270,617],{"class":616},[589,2272,620],{"class":599},[589,2274,623],{"class":599},[589,2276,2277,2279,2281,2283,2285,2287,2289,2291,2293],{"class":591,"line":626},[589,2278,596],{"class":595},[589,2280,600],{"class":599},[589,2282,1707],{"class":603},[589,2284,607],{"class":599},[589,2286,610],{"class":595},[589,2288,613],{"class":599},[589,2290,648],{"class":616},[589,2292,620],{"class":599},[589,2294,623],{"class":599},[589,2296,2297,2299,2301,2303,2305,2308,2310,2312,2314,2316,2318],{"class":591,"line":655},[589,2298,596],{"class":595},[589,2300,600],{"class":599},[589,2302,1728],{"class":603},[589,2304,636],{"class":599},[589,2306,2307],{"class":603}," useBorderColorUtility",[589,2309,607],{"class":599},[589,2311,610],{"class":595},[589,2313,613],{"class":599},[589,2315,648],{"class":616},[589,2317,620],{"class":599},[589,2319,623],{"class":599},[589,2321,2322,2324,2326,2329,2331,2333,2335,2337,2339],{"class":591,"line":677},[589,2323,596],{"class":595},[589,2325,600],{"class":599},[589,2327,2328],{"class":603}," useAriaSelectedModifier",[589,2330,607],{"class":599},[589,2332,610],{"class":595},[589,2334,613],{"class":599},[589,2336,648],{"class":616},[589,2338,620],{"class":599},[589,2340,623],{"class":599},[589,2342,2343],{"class":591,"line":683},[589,2344,680],{"emptyLinePlaceholder":206},[589,2346,2347,2349,2351,2353,2355,2357],{"class":591,"line":704},[589,2348,687],{"class":686},[589,2350,690],{"class":603},[589,2352,693],{"class":599},[589,2354,604],{"class":696},[589,2356,699],{"class":603},[589,2358,623],{"class":599},[589,2360,2361,2363,2365,2367,2369,2371,2373],{"class":591,"line":709},[589,2362,687],{"class":686},[589,2364,600],{"class":599},[589,2366,1788],{"class":603},[589,2368,1791],{"class":599},[589,2370,1794],{"class":599},[589,2372,816],{"class":603},[589,2374,623],{"class":599},[589,2376,2377],{"class":591,"line":726},[589,2378,680],{"emptyLinePlaceholder":206},[589,2380,2381,2383,2385,2387,2389,2391,2393,2395,2397,2399,2401,2403,2405,2407,2409,2411,2413,2415,2417],{"class":591,"line":731},[589,2382,687],{"class":686},[589,2384,600],{"class":599},[589,2386,1811],{"class":603},[589,2388,1791],{"class":599},[589,2390,1794],{"class":599},[589,2392,1707],{"class":696},[589,2394,737],{"class":603},[589,2396,636],{"class":599},[589,2398,600],{"class":599},[589,2400,1826],{"class":782},[589,2402,748],{"class":599},[589,2404,751],{"class":599},[589,2406,1833],{"class":616},[589,2408,757],{"class":599},[589,2410,607],{"class":599},[589,2412,1840],{"class":595},[589,2414,1843],{"class":686},[589,2416,1846],{"class":603},[589,2418,623],{"class":599},[589,2420,2421],{"class":591,"line":768},[589,2422,680],{"emptyLinePlaceholder":206},[589,2424,2425,2427,2430,2432,2434,2436],{"class":591,"line":802},[589,2426,687],{"class":686},[589,2428,2429],{"class":603}," ariaSelected ",[589,2431,693],{"class":599},[589,2433,2328],{"class":696},[589,2435,721],{"class":603},[589,2437,623],{"class":599},[589,2439,2440],{"class":591,"line":807},[589,2441,680],{"emptyLinePlaceholder":206},[589,2443,2444,2446,2448,2450],{"class":591,"line":1270},[589,2445,1876],{"class":696},[589,2447,737],{"class":603},[589,2449,636],{"class":599},[589,2451,908],{"class":599},[589,2453,2454,2456,2458,2460,2462],{"class":591,"line":1275},[589,2455,1887],{"class":782},[589,2457,748],{"class":599},[589,2459,1892],{"class":696},[589,2461,1895],{"class":603},[589,2463,1241],{"class":599},[589,2465,2466,2469,2471,2473,2476,2478],{"class":591,"line":1287},[589,2467,2468],{"class":782},"    white",[589,2470,748],{"class":599},[589,2472,751],{"class":599},[589,2474,2475],{"class":616},"#ffffff",[589,2477,757],{"class":599},[589,2479,1241],{"class":599},[589,2481,2482,2484,2487],{"class":591,"line":1304},[589,2483,1262],{"class":599},[589,2485,2486],{"class":603}," [ariaSelected])",[589,2488,623],{"class":599},[589,2490,2491],{"class":591,"line":1313},[589,2492,680],{"emptyLinePlaceholder":206},[589,2494,2495,2498,2500,2502],{"class":591,"line":1318},[589,2496,2497],{"class":696},"useBorderColorUtility",[589,2499,737],{"class":603},[589,2501,636],{"class":599},[589,2503,908],{"class":599},[589,2505,2507,2509,2511,2513,2515],{"class":591,"line":2506},19,[589,2508,1887],{"class":782},[589,2510,748],{"class":599},[589,2512,1892],{"class":696},[589,2514,1895],{"class":603},[589,2516,1241],{"class":599},[589,2518,2520,2522,2524],{"class":591,"line":2519},20,[589,2521,1262],{"class":599},[589,2523,2486],{"class":603},[589,2525,623],{"class":599},[589,2527,2529],{"class":591,"line":2528},21,[589,2530,680],{"emptyLinePlaceholder":206},[589,2532,2534,2536,2538,2540],{"class":591,"line":2533},22,[589,2535,810],{"class":595},[589,2537,813],{"class":595},[589,2539,816],{"class":603},[589,2541,623],{"class":599},[574,2543,2544],{"icon":140,"label":821},[579,2545,2547],{"className":824,"code":2546,"filename":826,"language":827,"meta":585,"style":585},"._aria-selected\\:background-color\\:primary {\n    &[aria-selected=\"true\"] { background-color: var(--color--primary); }\n}\n\n._aria-selected\\:border-color\\:primary {\n    &[aria-selected=\"true\"] { border-color: var(--color--primary); }\n}\n",[422,2548,2549,2566,2585,2589,2593,2610,2628],{"__ignoreMap":585},[589,2550,2551,2553,2556,2558,2560,2562,2564],{"class":591,"line":592},[589,2552,478],{"class":599},[589,2554,2555],{"class":836},"_aria-selected",[589,2557,840],{"class":603},[589,2559,2019],{"class":836},[589,2561,840],{"class":603},[589,2563,1955],{"class":836},[589,2565,908],{"class":599},[589,2567,2568,2571,2573,2575,2577,2579,2581,2583],{"class":591,"line":626},[589,2569,2570],{"class":603},"    &[aria-selected=\"true\"] { ",[589,2572,2019],{"class":848},[589,2574,748],{"class":599},[589,2576,1965],{"class":696},[589,2578,1968],{"class":599},[589,2580,1971],{"class":603},[589,2582,1974],{"class":599},[589,2584,860],{"class":599},[589,2586,2587],{"class":591,"line":655},[589,2588,928],{"class":603},[589,2590,2591],{"class":591,"line":677},[589,2592,680],{"emptyLinePlaceholder":206},[589,2594,2595,2597,2599,2601,2604,2606,2608],{"class":591,"line":683},[589,2596,478],{"class":599},[589,2598,2555],{"class":836},[589,2600,840],{"class":603},[589,2602,2603],{"class":836},"border-color",[589,2605,840],{"class":603},[589,2607,1955],{"class":836},[589,2609,908],{"class":599},[589,2611,2612,2614,2616,2618,2620,2622,2624,2626],{"class":591,"line":704},[589,2613,2570],{"class":603},[589,2615,2603],{"class":848},[589,2617,748],{"class":599},[589,2619,1965],{"class":696},[589,2621,1968],{"class":599},[589,2623,1971],{"class":603},[589,2625,1974],{"class":599},[589,2627,860],{"class":599},[589,2629,2630],{"class":591,"line":709},[589,2631,928],{"class":603},[574,2633,2634],{"icon":970,"label":971},[579,2635,2637],{"className":974,"code":2636,"language":976,"meta":585,"style":585},"\u003C!-- Tab navigation -->\n\u003Cdiv role=\"tablist\">\n    \u003Cbutton role=\"tab\" aria-selected=\"true\"\n        class=\"_background-color:white _aria-selected:background-color:primary\">\n        Tab 1\n    \u003C/button>\n    \u003Cbutton role=\"tab\" aria-selected=\"false\"\n        class=\"_background-color:white _aria-selected:background-color:primary\">\n        Tab 2\n    \u003C/button>\n\u003C/div>\n",[422,2638,2639,2644,2664,2692,2708,2713,2722,2748,2762,2767,2775],{"__ignoreMap":585},[589,2640,2641],{"class":591,"line":592},[589,2642,2643],{"class":983},"\u003C!-- Tab navigation -->\n",[589,2645,2646,2648,2650,2653,2655,2657,2660,2662],{"class":591,"line":626},[589,2647,989],{"class":599},[589,2649,1053],{"class":782},[589,2651,2652],{"class":686}," role",[589,2654,693],{"class":599},[589,2656,620],{"class":599},[589,2658,2659],{"class":616},"tablist",[589,2661,620],{"class":599},[589,2663,1040],{"class":599},[589,2665,2666,2668,2670,2672,2674,2676,2679,2681,2684,2686,2688,2690],{"class":591,"line":655},[589,2667,1536],{"class":599},[589,2669,1004],{"class":782},[589,2671,2652],{"class":686},[589,2673,693],{"class":599},[589,2675,620],{"class":599},[589,2677,2678],{"class":616},"tab",[589,2680,620],{"class":599},[589,2682,2683],{"class":686}," aria-selected",[589,2685,693],{"class":599},[589,2687,620],{"class":599},[589,2689,1019],{"class":616},[589,2691,1007],{"class":599},[589,2693,2694,2697,2699,2701,2704,2706],{"class":591,"line":677},[589,2695,2696],{"class":686},"        class",[589,2698,693],{"class":599},[589,2700,620],{"class":599},[589,2702,2703],{"class":616},"_background-color:white _aria-selected:background-color:primary",[589,2705,620],{"class":599},[589,2707,1040],{"class":599},[589,2709,2710],{"class":591,"line":683},[589,2711,2712],{"class":603},"        Tab 1\n",[589,2714,2715,2718,2720],{"class":591,"line":704},[589,2716,2717],{"class":599},"    \u003C/",[589,2719,1004],{"class":782},[589,2721,1040],{"class":599},[589,2723,2724,2726,2728,2730,2732,2734,2736,2738,2740,2742,2744,2746],{"class":591,"line":709},[589,2725,1536],{"class":599},[589,2727,1004],{"class":782},[589,2729,2652],{"class":686},[589,2731,693],{"class":599},[589,2733,620],{"class":599},[589,2735,2678],{"class":616},[589,2737,620],{"class":599},[589,2739,2683],{"class":686},[589,2741,693],{"class":599},[589,2743,620],{"class":599},[589,2745,1515],{"class":616},[589,2747,1007],{"class":599},[589,2749,2750,2752,2754,2756,2758,2760],{"class":591,"line":726},[589,2751,2696],{"class":686},[589,2753,693],{"class":599},[589,2755,620],{"class":599},[589,2757,2703],{"class":616},[589,2759,620],{"class":599},[589,2761,1040],{"class":599},[589,2763,2764],{"class":591,"line":731},[589,2765,2766],{"class":603},"        Tab 2\n",[589,2768,2769,2771,2773],{"class":591,"line":768},[589,2770,2717],{"class":599},[589,2772,1004],{"class":782},[589,2774,1040],{"class":599},[589,2776,2777,2779,2781],{"class":591,"line":802},[589,2778,1050],{"class":599},[589,2780,1053],{"class":782},[589,2782,1040],{"class":599},[480,2784,483],{"id":2785},"css-selector-8",[485,2787,2788,2796],{},[488,2789,2790],{},[491,2791,2792,2794],{},[494,2793,496],{},[494,2795,483],{},[500,2797,2798],{},[491,2799,2800,2805],{},[505,2801,2802],{},[422,2803,2804],{},"aria-selected",[505,2806,2807],{},[422,2808,2809],{},"&[aria-selected=\"true\"]",[414,2811,2813],{"id":2812},"useariastatemodifiers",[422,2814,2815],{},"useAriaStateModifiers",[418,2817,470,2818,2821],{},[422,2819,2820],{},"useAriaStateModifiers()"," function registers all ARIA state modifiers at once and returns them as a destructurable object.",[2823,2824,2826],"h3",{"id":2825},"returned-modifiers","Returned Modifiers",[485,2828,2829,2840],{},[488,2830,2831],{},[491,2832,2833,2836,2838],{},[494,2834,2835],{},"Key",[494,2837,496],{},[494,2839,483],{},[500,2841,2842,2857,2872,2887,2902,2917,2932,2947,2962],{},[491,2843,2844,2849,2853],{},[505,2845,2846],{},[422,2847,2848],{},"ariaBusy",[505,2850,2851],{},[422,2852,509],{},[505,2854,2855],{},[422,2856,514],{},[491,2858,2859,2864,2868],{},[505,2860,2861],{},[422,2862,2863],{},"ariaChecked",[505,2865,2866],{},[422,2867,550],{},[505,2869,2870],{},[422,2871,555],{},[491,2873,2874,2879,2883],{},[505,2875,2876],{},[422,2877,2878],{},"ariaDisabled",[505,2880,2881],{},[422,2882,1077],{},[505,2884,2885],{},[422,2886,1082],{},[491,2888,2889,2894,2898],{},[505,2890,2891],{},[422,2892,2893],{},"ariaExpanded",[505,2895,2896],{},[422,2897,1609],{},[505,2899,2900],{},[422,2901,1614],{},[491,2903,2904,2909,2913],{},[505,2905,2906],{},[422,2907,2908],{},"ariaHidden",[505,2910,2911],{},[422,2912,1650],{},[505,2914,2915],{},[422,2916,1655],{},[491,2918,2919,2924,2928],{},[505,2920,2921],{},[422,2922,2923],{},"ariaPressed",[505,2925,2926],{},[422,2927,2144],{},[505,2929,2930],{},[422,2931,2149],{},[491,2933,2934,2939,2943],{},[505,2935,2936],{},[422,2937,2938],{},"ariaReadonly",[505,2940,2941],{},[422,2942,2185],{},[505,2944,2945],{},[422,2946,2190],{},[491,2948,2949,2954,2958],{},[505,2950,2951],{},[422,2952,2953],{},"ariaRequired",[505,2955,2956],{},[422,2957,2226],{},[505,2959,2960],{},[422,2961,2231],{},[491,2963,2964,2969,2973],{},[505,2965,2966],{},[422,2967,2968],{},"ariaSelected",[505,2970,2971],{},[422,2972,2804],{},[505,2974,2975],{},[422,2976,2809],{},[414,2978,2980],{"id":2979},"examples","Examples",[2823,2982,2984],{"id":2983},"accessible-accordion","Accessible Accordion",[571,2986,2987,3215],{},[574,2988,2989],{"icon":576,"label":577},[579,2990,2992],{"className":581,"code":2991,"filename":583,"language":584,"meta":585,"style":585},"import { styleframe } from \"styleframe\";\nimport { useDisplayUtility, useRotateUtility, useOpacityUtility } from \"@styleframe/theme\";\nimport { useAriaStateModifiers } from \"@styleframe/theme\";\n\nconst s = styleframe();\n\nconst { ariaExpanded, ariaHidden } = useAriaStateModifiers(s);\n\nuseDisplayUtility(s, {\n    block: 'block',\n    none: 'none',\n}, [ariaExpanded, ariaHidden]);\n\nuseRotateUtility(s, {\n    180: '180deg',\n}, [ariaExpanded]);\n\nexport default s;\n",[422,2993,2994,3014,3042,3063,3067,3081,3085,3109,3113,3123,3137,3151,3165,3169,3179,3193,3201,3205],{"__ignoreMap":585},[589,2995,2996,2998,3000,3002,3004,3006,3008,3010,3012],{"class":591,"line":592},[589,2997,596],{"class":595},[589,2999,600],{"class":599},[589,3001,604],{"class":603},[589,3003,607],{"class":599},[589,3005,610],{"class":595},[589,3007,613],{"class":599},[589,3009,617],{"class":616},[589,3011,620],{"class":599},[589,3013,623],{"class":599},[589,3015,3016,3018,3020,3022,3024,3026,3028,3030,3032,3034,3036,3038,3040],{"class":591,"line":626},[589,3017,596],{"class":595},[589,3019,600],{"class":599},[589,3021,1134],{"class":603},[589,3023,636],{"class":599},[589,3025,1139],{"class":603},[589,3027,636],{"class":599},[589,3029,633],{"class":603},[589,3031,607],{"class":599},[589,3033,610],{"class":595},[589,3035,613],{"class":599},[589,3037,648],{"class":616},[589,3039,620],{"class":599},[589,3041,623],{"class":599},[589,3043,3044,3046,3048,3051,3053,3055,3057,3059,3061],{"class":591,"line":655},[589,3045,596],{"class":595},[589,3047,600],{"class":599},[589,3049,3050],{"class":603}," useAriaStateModifiers",[589,3052,607],{"class":599},[589,3054,610],{"class":595},[589,3056,613],{"class":599},[589,3058,648],{"class":616},[589,3060,620],{"class":599},[589,3062,623],{"class":599},[589,3064,3065],{"class":591,"line":677},[589,3066,680],{"emptyLinePlaceholder":206},[589,3068,3069,3071,3073,3075,3077,3079],{"class":591,"line":683},[589,3070,687],{"class":686},[589,3072,690],{"class":603},[589,3074,693],{"class":599},[589,3076,604],{"class":696},[589,3078,699],{"class":603},[589,3080,623],{"class":599},[589,3082,3083],{"class":591,"line":704},[589,3084,680],{"emptyLinePlaceholder":206},[589,3086,3087,3089,3091,3094,3096,3099,3101,3103,3105,3107],{"class":591,"line":709},[589,3088,687],{"class":686},[589,3090,600],{"class":599},[589,3092,3093],{"class":603}," ariaExpanded",[589,3095,636],{"class":599},[589,3097,3098],{"class":603}," ariaHidden ",[589,3100,1791],{"class":599},[589,3102,1794],{"class":599},[589,3104,3050],{"class":696},[589,3106,721],{"class":603},[589,3108,623],{"class":599},[589,3110,3111],{"class":591,"line":726},[589,3112,680],{"emptyLinePlaceholder":206},[589,3114,3115,3117,3119,3121],{"class":591,"line":731},[589,3116,1218],{"class":696},[589,3118,737],{"class":603},[589,3120,636],{"class":599},[589,3122,908],{"class":599},[589,3124,3125,3127,3129,3131,3133,3135],{"class":591,"line":768},[589,3126,1229],{"class":782},[589,3128,748],{"class":599},[589,3130,751],{"class":599},[589,3132,1236],{"class":616},[589,3134,757],{"class":599},[589,3136,1241],{"class":599},[589,3138,3139,3141,3143,3145,3147,3149],{"class":591,"line":802},[589,3140,1246],{"class":782},[589,3142,748],{"class":599},[589,3144,751],{"class":599},[589,3146,1253],{"class":616},[589,3148,757],{"class":599},[589,3150,1241],{"class":599},[589,3152,3153,3155,3158,3160,3163],{"class":591,"line":807},[589,3154,1262],{"class":599},[589,3156,3157],{"class":603}," [ariaExpanded",[589,3159,636],{"class":599},[589,3161,3162],{"class":603}," ariaHidden])",[589,3164,623],{"class":599},[589,3166,3167],{"class":591,"line":1270},[589,3168,680],{"emptyLinePlaceholder":206},[589,3170,3171,3173,3175,3177],{"class":591,"line":1275},[589,3172,1278],{"class":696},[589,3174,737],{"class":603},[589,3176,636],{"class":599},[589,3178,908],{"class":599},[589,3180,3181,3183,3185,3187,3189,3191],{"class":591,"line":1287},[589,3182,1290],{"class":744},[589,3184,748],{"class":599},[589,3186,751],{"class":599},[589,3188,1297],{"class":616},[589,3190,757],{"class":599},[589,3192,1241],{"class":599},[589,3194,3195,3197,3199],{"class":591,"line":1304},[589,3196,1262],{"class":599},[589,3198,1265],{"class":603},[589,3200,623],{"class":599},[589,3202,3203],{"class":591,"line":1313},[589,3204,680],{"emptyLinePlaceholder":206},[589,3206,3207,3209,3211,3213],{"class":591,"line":1318},[589,3208,810],{"class":595},[589,3210,813],{"class":595},[589,3212,816],{"class":603},[589,3214,623],{"class":599},[574,3216,3217],{"icon":970,"label":971},[579,3218,3220],{"className":974,"code":3219,"language":976,"meta":585,"style":585},"\u003Cdiv class=\"accordion\">\n    \u003Cbutton aria-expanded=\"true\" class=\"_aria-expanded:rotate:180\">\n        Section 1 \u003Cspan class=\"chevron\">▼\u003C/span>\n    \u003C/button>\n    \u003Cdiv aria-hidden=\"false\">\n        \u003Cp>Accordion content here.\u003C/p>\n    \u003C/div>\n\u003C/div>\n",[422,3221,3222,3241,3269,3300,3308,3327,3345,3353],{"__ignoreMap":585},[589,3223,3224,3226,3228,3230,3232,3234,3237,3239],{"class":591,"line":592},[589,3225,989],{"class":599},[589,3227,1053],{"class":782},[589,3229,1520],{"class":686},[589,3231,693],{"class":599},[589,3233,620],{"class":599},[589,3235,3236],{"class":616},"accordion",[589,3238,620],{"class":599},[589,3240,1040],{"class":599},[589,3242,3243,3245,3247,3249,3251,3253,3255,3257,3259,3261,3263,3265,3267],{"class":591,"line":626},[589,3244,1536],{"class":599},[589,3246,1004],{"class":782},[589,3248,1508],{"class":686},[589,3250,693],{"class":599},[589,3252,620],{"class":599},[589,3254,1019],{"class":616},[589,3256,620],{"class":599},[589,3258,1520],{"class":686},[589,3260,693],{"class":599},[589,3262,620],{"class":599},[589,3264,1527],{"class":616},[589,3266,620],{"class":599},[589,3268,1040],{"class":599},[589,3270,3271,3274,3276,3278,3280,3282,3284,3287,3289,3291,3294,3296,3298],{"class":591,"line":655},[589,3272,3273],{"class":603},"        Section 1 ",[589,3275,989],{"class":599},[589,3277,589],{"class":782},[589,3279,1520],{"class":686},[589,3281,693],{"class":599},[589,3283,620],{"class":599},[589,3285,3286],{"class":616},"chevron",[589,3288,620],{"class":599},[589,3290,1541],{"class":599},[589,3292,3293],{"class":603},"▼",[589,3295,1050],{"class":599},[589,3297,589],{"class":782},[589,3299,1040],{"class":599},[589,3301,3302,3304,3306],{"class":591,"line":677},[589,3303,2717],{"class":599},[589,3305,1004],{"class":782},[589,3307,1040],{"class":599},[589,3309,3310,3312,3314,3317,3319,3321,3323,3325],{"class":591,"line":683},[589,3311,1536],{"class":599},[589,3313,1053],{"class":782},[589,3315,3316],{"class":686}," aria-hidden",[589,3318,693],{"class":599},[589,3320,620],{"class":599},[589,3322,1515],{"class":616},[589,3324,620],{"class":599},[589,3326,1040],{"class":599},[589,3328,3329,3332,3334,3336,3339,3341,3343],{"class":591,"line":704},[589,3330,3331],{"class":599},"        \u003C",[589,3333,418],{"class":782},[589,3335,1541],{"class":599},[589,3337,3338],{"class":603},"Accordion content here.",[589,3340,1050],{"class":599},[589,3342,418],{"class":782},[589,3344,1040],{"class":599},[589,3346,3347,3349,3351],{"class":591,"line":709},[589,3348,2717],{"class":599},[589,3350,1053],{"class":782},[589,3352,1040],{"class":599},[589,3354,3355,3357,3359],{"class":591,"line":726},[589,3356,1050],{"class":599},[589,3358,1053],{"class":782},[589,3360,1040],{"class":599},[2823,3362,3364],{"id":3363},"tab-panel-with-selected-state","Tab Panel with Selected State",[571,3366,3367,3746],{},[574,3368,3369],{"icon":576,"label":577},[579,3370,3372],{"className":581,"code":3371,"filename":583,"language":584,"meta":585,"style":585},"import { styleframe } from \"styleframe\";\nimport { useColorDesignTokens } from \"@styleframe/theme\";\nimport {\n    useBackgroundColorUtility,\n    useTextColorUtility,\n    useBorderColorUtility,\n} from \"@styleframe/theme\";\nimport { useAriaSelectedModifier } from \"@styleframe/theme\";\n\nconst s = styleframe();\nconst { ref } = s;\n\nconst { colorPrimary } = useColorDesignTokens(s, { primary: '#006cff' } as const);\n\nconst ariaSelected = useAriaSelectedModifier(s);\n\nuseBackgroundColorUtility(s, {\n    primary: ref(colorPrimary),\n    transparent: 'transparent',\n}, [ariaSelected]);\n\nuseTextColorUtility(s, {\n    white: '#ffffff',\n    dark: '#212529',\n}, [ariaSelected]);\n\nuseBorderColorUtility(s, {\n    primary: ref(colorPrimary),\n    transparent: 'transparent',\n}, [ariaSelected]);\n\nexport default s;\n",[422,3373,3374,3394,3414,3420,3427,3434,3441,3455,3475,3479,3493,3509,3513,3553,3557,3571,3575,3585,3597,3613,3621,3625,3636,3651,3668,3677,3682,3693,3706,3721,3730,3735],{"__ignoreMap":585},[589,3375,3376,3378,3380,3382,3384,3386,3388,3390,3392],{"class":591,"line":592},[589,3377,596],{"class":595},[589,3379,600],{"class":599},[589,3381,604],{"class":603},[589,3383,607],{"class":599},[589,3385,610],{"class":595},[589,3387,613],{"class":599},[589,3389,617],{"class":616},[589,3391,620],{"class":599},[589,3393,623],{"class":599},[589,3395,3396,3398,3400,3402,3404,3406,3408,3410,3412],{"class":591,"line":626},[589,3397,596],{"class":595},[589,3399,600],{"class":599},[589,3401,1707],{"class":603},[589,3403,607],{"class":599},[589,3405,610],{"class":595},[589,3407,613],{"class":599},[589,3409,648],{"class":616},[589,3411,620],{"class":599},[589,3413,623],{"class":599},[589,3415,3416,3418],{"class":591,"line":655},[589,3417,596],{"class":595},[589,3419,908],{"class":599},[589,3421,3422,3425],{"class":591,"line":677},[589,3423,3424],{"class":603},"    useBackgroundColorUtility",[589,3426,1241],{"class":599},[589,3428,3429,3432],{"class":591,"line":683},[589,3430,3431],{"class":603},"    useTextColorUtility",[589,3433,1241],{"class":599},[589,3435,3436,3439],{"class":591,"line":704},[589,3437,3438],{"class":603},"    useBorderColorUtility",[589,3440,1241],{"class":599},[589,3442,3443,3445,3447,3449,3451,3453],{"class":591,"line":709},[589,3444,1791],{"class":599},[589,3446,610],{"class":595},[589,3448,613],{"class":599},[589,3450,648],{"class":616},[589,3452,620],{"class":599},[589,3454,623],{"class":599},[589,3456,3457,3459,3461,3463,3465,3467,3469,3471,3473],{"class":591,"line":726},[589,3458,596],{"class":595},[589,3460,600],{"class":599},[589,3462,2328],{"class":603},[589,3464,607],{"class":599},[589,3466,610],{"class":595},[589,3468,613],{"class":599},[589,3470,648],{"class":616},[589,3472,620],{"class":599},[589,3474,623],{"class":599},[589,3476,3477],{"class":591,"line":731},[589,3478,680],{"emptyLinePlaceholder":206},[589,3480,3481,3483,3485,3487,3489,3491],{"class":591,"line":768},[589,3482,687],{"class":686},[589,3484,690],{"class":603},[589,3486,693],{"class":599},[589,3488,604],{"class":696},[589,3490,699],{"class":603},[589,3492,623],{"class":599},[589,3494,3495,3497,3499,3501,3503,3505,3507],{"class":591,"line":802},[589,3496,687],{"class":686},[589,3498,600],{"class":599},[589,3500,1788],{"class":603},[589,3502,1791],{"class":599},[589,3504,1794],{"class":599},[589,3506,816],{"class":603},[589,3508,623],{"class":599},[589,3510,3511],{"class":591,"line":807},[589,3512,680],{"emptyLinePlaceholder":206},[589,3514,3515,3517,3519,3521,3523,3525,3527,3529,3531,3533,3535,3537,3539,3541,3543,3545,3547,3549,3551],{"class":591,"line":1270},[589,3516,687],{"class":686},[589,3518,600],{"class":599},[589,3520,1811],{"class":603},[589,3522,1791],{"class":599},[589,3524,1794],{"class":599},[589,3526,1707],{"class":696},[589,3528,737],{"class":603},[589,3530,636],{"class":599},[589,3532,600],{"class":599},[589,3534,1826],{"class":782},[589,3536,748],{"class":599},[589,3538,751],{"class":599},[589,3540,1833],{"class":616},[589,3542,757],{"class":599},[589,3544,607],{"class":599},[589,3546,1840],{"class":595},[589,3548,1843],{"class":686},[589,3550,1846],{"class":603},[589,3552,623],{"class":599},[589,3554,3555],{"class":591,"line":1275},[589,3556,680],{"emptyLinePlaceholder":206},[589,3558,3559,3561,3563,3565,3567,3569],{"class":591,"line":1287},[589,3560,687],{"class":686},[589,3562,2429],{"class":603},[589,3564,693],{"class":599},[589,3566,2328],{"class":696},[589,3568,721],{"class":603},[589,3570,623],{"class":599},[589,3572,3573],{"class":591,"line":1304},[589,3574,680],{"emptyLinePlaceholder":206},[589,3576,3577,3579,3581,3583],{"class":591,"line":1313},[589,3578,1876],{"class":696},[589,3580,737],{"class":603},[589,3582,636],{"class":599},[589,3584,908],{"class":599},[589,3586,3587,3589,3591,3593,3595],{"class":591,"line":1318},[589,3588,1887],{"class":782},[589,3590,748],{"class":599},[589,3592,1892],{"class":696},[589,3594,1895],{"class":603},[589,3596,1241],{"class":599},[589,3598,3599,3602,3604,3606,3609,3611],{"class":591,"line":2506},[589,3600,3601],{"class":782},"    transparent",[589,3603,748],{"class":599},[589,3605,751],{"class":599},[589,3607,3608],{"class":616},"transparent",[589,3610,757],{"class":599},[589,3612,1241],{"class":599},[589,3614,3615,3617,3619],{"class":591,"line":2519},[589,3616,1262],{"class":599},[589,3618,2486],{"class":603},[589,3620,623],{"class":599},[589,3622,3623],{"class":591,"line":2528},[589,3624,680],{"emptyLinePlaceholder":206},[589,3626,3627,3630,3632,3634],{"class":591,"line":2533},[589,3628,3629],{"class":696},"useTextColorUtility",[589,3631,737],{"class":603},[589,3633,636],{"class":599},[589,3635,908],{"class":599},[589,3637,3639,3641,3643,3645,3647,3649],{"class":591,"line":3638},23,[589,3640,2468],{"class":782},[589,3642,748],{"class":599},[589,3644,751],{"class":599},[589,3646,2475],{"class":616},[589,3648,757],{"class":599},[589,3650,1241],{"class":599},[589,3652,3654,3657,3659,3661,3664,3666],{"class":591,"line":3653},24,[589,3655,3656],{"class":782},"    dark",[589,3658,748],{"class":599},[589,3660,751],{"class":599},[589,3662,3663],{"class":616},"#212529",[589,3665,757],{"class":599},[589,3667,1241],{"class":599},[589,3669,3671,3673,3675],{"class":591,"line":3670},25,[589,3672,1262],{"class":599},[589,3674,2486],{"class":603},[589,3676,623],{"class":599},[589,3678,3680],{"class":591,"line":3679},26,[589,3681,680],{"emptyLinePlaceholder":206},[589,3683,3685,3687,3689,3691],{"class":591,"line":3684},27,[589,3686,2497],{"class":696},[589,3688,737],{"class":603},[589,3690,636],{"class":599},[589,3692,908],{"class":599},[589,3694,3696,3698,3700,3702,3704],{"class":591,"line":3695},28,[589,3697,1887],{"class":782},[589,3699,748],{"class":599},[589,3701,1892],{"class":696},[589,3703,1895],{"class":603},[589,3705,1241],{"class":599},[589,3707,3709,3711,3713,3715,3717,3719],{"class":591,"line":3708},29,[589,3710,3601],{"class":782},[589,3712,748],{"class":599},[589,3714,751],{"class":599},[589,3716,3608],{"class":616},[589,3718,757],{"class":599},[589,3720,1241],{"class":599},[589,3722,3724,3726,3728],{"class":591,"line":3723},30,[589,3725,1262],{"class":599},[589,3727,2486],{"class":603},[589,3729,623],{"class":599},[589,3731,3733],{"class":591,"line":3732},31,[589,3734,680],{"emptyLinePlaceholder":206},[589,3736,3738,3740,3742,3744],{"class":591,"line":3737},32,[589,3739,810],{"class":595},[589,3741,813],{"class":595},[589,3743,816],{"class":603},[589,3745,623],{"class":599},[574,3747,3748],{"icon":970,"label":971},[579,3749,3751],{"className":974,"code":3750,"language":976,"meta":585,"style":585},"\u003Cdiv role=\"tablist\">\n    \u003Cbutton\n        role=\"tab\"\n        aria-selected=\"true\"\n        class=\"_background-color:transparent _aria-selected:background-color:primary _text-color:dark _aria-selected:text-color:white\"\n    >\n        Active Tab\n    \u003C/button>\n    \u003Cbutton\n        role=\"tab\"\n        aria-selected=\"false\"\n        class=\"_background-color:transparent _aria-selected:background-color:primary _text-color:dark _aria-selected:text-color:white\"\n    >\n        Inactive Tab\n    \u003C/button>\n\u003C/div>\n",[422,3752,3753,3771,3777,3790,3803,3816,3821,3826,3834,3840,3852,3864,3876,3880,3885,3893],{"__ignoreMap":585},[589,3754,3755,3757,3759,3761,3763,3765,3767,3769],{"class":591,"line":592},[589,3756,989],{"class":599},[589,3758,1053],{"class":782},[589,3760,2652],{"class":686},[589,3762,693],{"class":599},[589,3764,620],{"class":599},[589,3766,2659],{"class":616},[589,3768,620],{"class":599},[589,3770,1040],{"class":599},[589,3772,3773,3775],{"class":591,"line":626},[589,3774,1536],{"class":599},[589,3776,2067],{"class":782},[589,3778,3779,3782,3784,3786,3788],{"class":591,"line":655},[589,3780,3781],{"class":686},"        role",[589,3783,693],{"class":599},[589,3785,620],{"class":599},[589,3787,2678],{"class":616},[589,3789,1007],{"class":599},[589,3791,3792,3795,3797,3799,3801],{"class":591,"line":677},[589,3793,3794],{"class":686},"        aria-selected",[589,3796,693],{"class":599},[589,3798,620],{"class":599},[589,3800,1019],{"class":616},[589,3802,1007],{"class":599},[589,3804,3805,3807,3809,3811,3814],{"class":591,"line":683},[589,3806,2696],{"class":686},[589,3808,693],{"class":599},[589,3810,620],{"class":599},[589,3812,3813],{"class":616},"_background-color:transparent _aria-selected:background-color:primary _text-color:dark _aria-selected:text-color:white",[589,3815,1007],{"class":599},[589,3817,3818],{"class":591,"line":704},[589,3819,3820],{"class":599},"    >\n",[589,3822,3823],{"class":591,"line":709},[589,3824,3825],{"class":603},"        Active Tab\n",[589,3827,3828,3830,3832],{"class":591,"line":726},[589,3829,2717],{"class":599},[589,3831,1004],{"class":782},[589,3833,1040],{"class":599},[589,3835,3836,3838],{"class":591,"line":731},[589,3837,1536],{"class":599},[589,3839,2067],{"class":782},[589,3841,3842,3844,3846,3848,3850],{"class":591,"line":768},[589,3843,3781],{"class":686},[589,3845,693],{"class":599},[589,3847,620],{"class":599},[589,3849,2678],{"class":616},[589,3851,1007],{"class":599},[589,3853,3854,3856,3858,3860,3862],{"class":591,"line":802},[589,3855,3794],{"class":686},[589,3857,693],{"class":599},[589,3859,620],{"class":599},[589,3861,1515],{"class":616},[589,3863,1007],{"class":599},[589,3865,3866,3868,3870,3872,3874],{"class":591,"line":807},[589,3867,2696],{"class":686},[589,3869,693],{"class":599},[589,3871,620],{"class":599},[589,3873,3813],{"class":616},[589,3875,1007],{"class":599},[589,3877,3878],{"class":591,"line":1270},[589,3879,3820],{"class":599},[589,3881,3882],{"class":591,"line":1275},[589,3883,3884],{"class":603},"        Inactive Tab\n",[589,3886,3887,3889,3891],{"class":591,"line":1287},[589,3888,2717],{"class":599},[589,3890,1004],{"class":782},[589,3892,1040],{"class":599},[589,3894,3895,3897,3899],{"class":591,"line":1304},[589,3896,1050],{"class":599},[589,3898,1053],{"class":782},[589,3900,1040],{"class":599},[414,3902,3904],{"id":3903},"best-practices","Best Practices",[434,3906,3907,3913,3919,3929,3935],{},[437,3908,3909,3912],{},[440,3910,3911],{},"Use ARIA modifiers for custom components",": Native form elements have built-in pseudo-classes; use ARIA modifiers for custom widgets",[437,3914,3915,3918],{},[440,3916,3917],{},"Keep ARIA attributes in sync",": Ensure JavaScript updates ARIA attributes so styles reflect the current state",[437,3920,3921,3924,3925,3928],{},[440,3922,3923],{},"Prefer semantic HTML",": When possible, use native elements (like ",[422,3926,3927],{},"\u003Cdetails>",") that have built-in ARIA support",[437,3930,3931,3934],{},[440,3932,3933],{},"Test with screen readers",": Verify that ARIA attributes are correctly announced alongside the visual changes",[437,3936,3937,3940,3941,3943],{},[440,3938,3939],{},"Use aria-expanded for disclosure widgets",": Accordions, dropdowns, and menus should use ",[422,3942,1609],{}," for both accessibility and styling",[414,3945,3947],{"id":3946},"faq","FAQ",[3236,3949,3950,3986,3997],{},[3951,3952,3955,3956,3959,3960,3963,3964,3959,3967,3970,3971,3974,3975,3959,3978,3981,3982,3985],"accordion-item",{"icon":3953,"label":3954},"i-lucide-circle-help","When should I use ARIA modifiers vs form state modifiers?","Use form state modifiers (",[422,3957,3958],{},":disabled",", ",[422,3961,3962],{},":checked",") for native form elements like ",[422,3965,3966],{},"\u003Cinput>",[422,3968,3969],{},"\u003Cselect>",", and ",[422,3972,3973],{},"\u003Cbutton>",". Use ARIA state modifiers for custom components built with ",[422,3976,3977],{},"\u003Cdiv>",[422,3979,3980],{},"\u003Cspan>",", or other non-form elements that need ",[422,3983,3984],{},"aria-*"," attributes for accessibility.",[3951,3987,3989,3990,3993,3994,478],{"icon":3953,"label":3988},"Do ARIA modifiers work with all elements?","Yes, ARIA modifiers use attribute selectors (",[422,3991,3992],{},"[aria-*=\"true\"]",") that work with any HTML element. The selector matches as long as the element has the corresponding ARIA attribute set to ",[422,3995,3996],{},"\"true\"",[3951,3998,4000,4001,4004,4005,3959,4008,4011],{"icon":3953,"label":3999},"Can I use ARIA modifiers with pseudo-state modifiers?","Yes! You can combine them freely. For example, ",[422,4002,4003],{},"[ariaExpanded, hover]"," generates ",[422,4006,4007],{},"_aria-expanded:property:value",[422,4009,4010],{},"_hover:property:value",", and combined variants for nuanced interactive styling.",[4013,4014,4015],"style",{},"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 .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}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 .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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}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 .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":585,"searchDepth":626,"depth":626,"links":4017},[4018,4019,4020,4021,4022,4023,4024,4025,4026,4027,4028,4029,4032,4036,4037],{"id":416,"depth":626,"text":64},{"id":428,"depth":626,"text":429},{"id":464,"depth":626,"text":467},{"id":517,"depth":626,"text":520},{"id":558,"depth":626,"text":561},{"id":1085,"depth":626,"text":1088},{"id":1617,"depth":626,"text":1620},{"id":1658,"depth":626,"text":1661},{"id":2152,"depth":626,"text":2155},{"id":2193,"depth":626,"text":2196},{"id":2234,"depth":626,"text":2237},{"id":2812,"depth":626,"text":2815,"children":4030},[4031],{"id":2825,"depth":655,"text":2826},{"id":2979,"depth":626,"text":2980,"children":4033},[4034,4035],{"id":2983,"depth":655,"text":2984},{"id":3363,"depth":655,"text":3364},{"id":3903,"depth":626,"text":3904},{"id":3946,"depth":626,"text":3947},"Create ARIA state modifiers for styling elements based on their ARIA attribute values with full type safety.","md",null,{},{"title":376,"icon":7},{"title":409,"description":4038},{"loc":377},"htt1ndCfu2_qM87aMtoK9_rIJHgoxQZcZqGGiBlxRoo",[4047,4049],{"title":156,"path":369,"stem":370,"description":4048,"icon":159,"children":-1},"Quickly register all modifier composables with the useModifiersPreset function for comprehensive modifier coverage in a single call.",{"title":380,"path":381,"stem":382,"description":4050,"icon":7,"children":-1},"Create directional modifiers for targeting elements based on text direction (RTL/LTR) with full type safety.",1776621151403]