[{"data":1,"prerenderedAt":4103},["ShallowReactive",2],{"navigation_en":3,"-docs-theme-utilities-interactivity":682,"-docs-theme-utilities-interactivity-surround":4098},{"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":4091,"extension":4092,"links":4093,"meta":4094,"navigation":4095,"path":600,"seo":4096,"stem":601,"__hash__":4097},"docs_theme\u002Fdocs\u002Ftheme\u002Futilities\u002F09.interactivity.md","Interactivity Utilities",{"type":686,"value":687,"toc":4069},"minimark",[688,706,710,714,718,721,749,755,762,1567,1573,1576,1824,1830,1833,2156,2162,2165,2407,2413,2416,2885,2889,2896,2899,2977,2983,2986,3064,3070,3073,3183,3189,3192,3268,3274,3277,3387,3391,3395,3752,3756,3988,3992,4024,4028,4065],[689,690,691,695,696,700,701,705],"note",{"icon":173},[692,693,694],"strong",{},"Part of the Utilities Preset:"," The utilities on this page are registered by the ",[697,698,699],"a",{"href":565},"Utilities Preset"," (",[702,703,704],"code",{},"useUtilitiesPreset","). For most projects, applying them via the preset is the recommended approach.",[707,708,78],"h2",{"id":709},"overview",[711,712,713],"p",{},"Interactivity utilities help you control how users interact with elements including cursor styles, pointer events, text selection, scroll behavior, and touch actions.",[707,715,717],{"id":716},"why-use-interactivity-utilities","Why Use Interactivity Utilities?",[711,719,720],{},"Interactivity utilities help you:",[722,723,724,731,737,743],"ul",{},[725,726,727,730],"li",{},[692,728,729],{},"Enhance user feedback",": Provide visual cues through cursor changes",[725,732,733,736],{},[692,734,735],{},"Control interactions",": Manage which elements respond to pointer events",[725,738,739,742],{},[692,740,741],{},"Improve accessibility",": Support various input methods including touch",[725,744,745,748],{},[692,746,747],{},"Customize scrolling",": Create smooth scroll experiences",[707,750,752],{"id":751},"usecursorutility",[702,753,754],{},"useCursorUtility",[711,756,757,758,761],{},"The ",[702,759,760],{},"useCursorUtility()"," function creates utility classes for setting cursor styles.",[763,764,765,1150,1466],"tabs",{},[766,767,769],"tabs-item",{"icon":768,"label":290},"i-lucide-code",[770,771,777],"pre",{"className":772,"code":773,"filename":774,"language":775,"meta":776,"style":776},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { styleframe } from \"styleframe\";\nimport { useCursorUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\n\nuseCursorUtility(s, {\n    auto: 'auto',\n    default: 'default',\n    pointer: 'pointer',\n    wait: 'wait',\n    text: 'text',\n    move: 'move',\n    help: 'help',\n    'not-allowed': 'not-allowed',\n    none: 'none',\n    grab: 'grab',\n    grabbing: 'grabbing',\n    'zoom-in': 'zoom-in',\n    'zoom-out': 'zoom-out',\n});\n\nexport default s;\n","styleframe.config.ts","ts","",[702,778,779,815,838,844,865,870,884,906,923,940,957,974,991,1008,1029,1046,1063,1080,1100,1120,1131,1136],{"__ignoreMap":776},[780,781,784,788,792,796,799,802,805,809,812],"span",{"class":782,"line":783},"line",1,[780,785,787],{"class":786},"s7zQu","import",[780,789,791],{"class":790},"sMK4o"," {",[780,793,795],{"class":794},"sTEyZ"," styleframe",[780,797,798],{"class":790}," }",[780,800,801],{"class":786}," from",[780,803,804],{"class":790}," \"",[780,806,808],{"class":807},"sfazB","styleframe",[780,810,811],{"class":790},"\"",[780,813,814],{"class":790},";\n",[780,816,818,820,822,825,827,829,831,834,836],{"class":782,"line":817},2,[780,819,787],{"class":786},[780,821,791],{"class":790},[780,823,824],{"class":794}," useCursorUtility",[780,826,798],{"class":790},[780,828,801],{"class":786},[780,830,804],{"class":790},[780,832,833],{"class":807},"@styleframe\u002Ftheme",[780,835,811],{"class":790},[780,837,814],{"class":790},[780,839,841],{"class":782,"line":840},3,[780,842,843],{"emptyLinePlaceholder":223},"\n",[780,845,847,851,854,857,860,863],{"class":782,"line":846},4,[780,848,850],{"class":849},"spNyl","const",[780,852,853],{"class":794}," s ",[780,855,856],{"class":790},"=",[780,858,795],{"class":859},"s2Zo4",[780,861,862],{"class":794},"()",[780,864,814],{"class":790},[780,866,868],{"class":782,"line":867},5,[780,869,843],{"emptyLinePlaceholder":223},[780,871,873,875,878,881],{"class":782,"line":872},6,[780,874,754],{"class":859},[780,876,877],{"class":794},"(s",[780,879,880],{"class":790},",",[780,882,883],{"class":790}," {\n",[780,885,887,891,894,897,900,903],{"class":782,"line":886},7,[780,888,890],{"class":889},"swJcz","    auto",[780,892,893],{"class":790},":",[780,895,896],{"class":790}," '",[780,898,899],{"class":807},"auto",[780,901,902],{"class":790},"'",[780,904,905],{"class":790},",\n",[780,907,909,912,914,916,919,921],{"class":782,"line":908},8,[780,910,911],{"class":889},"    default",[780,913,893],{"class":790},[780,915,896],{"class":790},[780,917,918],{"class":807},"default",[780,920,902],{"class":790},[780,922,905],{"class":790},[780,924,926,929,931,933,936,938],{"class":782,"line":925},9,[780,927,928],{"class":889},"    pointer",[780,930,893],{"class":790},[780,932,896],{"class":790},[780,934,935],{"class":807},"pointer",[780,937,902],{"class":790},[780,939,905],{"class":790},[780,941,943,946,948,950,953,955],{"class":782,"line":942},10,[780,944,945],{"class":889},"    wait",[780,947,893],{"class":790},[780,949,896],{"class":790},[780,951,952],{"class":807},"wait",[780,954,902],{"class":790},[780,956,905],{"class":790},[780,958,960,963,965,967,970,972],{"class":782,"line":959},11,[780,961,962],{"class":889},"    text",[780,964,893],{"class":790},[780,966,896],{"class":790},[780,968,969],{"class":807},"text",[780,971,902],{"class":790},[780,973,905],{"class":790},[780,975,977,980,982,984,987,989],{"class":782,"line":976},12,[780,978,979],{"class":889},"    move",[780,981,893],{"class":790},[780,983,896],{"class":790},[780,985,986],{"class":807},"move",[780,988,902],{"class":790},[780,990,905],{"class":790},[780,992,994,997,999,1001,1004,1006],{"class":782,"line":993},13,[780,995,996],{"class":889},"    help",[780,998,893],{"class":790},[780,1000,896],{"class":790},[780,1002,1003],{"class":807},"help",[780,1005,902],{"class":790},[780,1007,905],{"class":790},[780,1009,1011,1014,1017,1019,1021,1023,1025,1027],{"class":782,"line":1010},14,[780,1012,1013],{"class":790},"    '",[780,1015,1016],{"class":889},"not-allowed",[780,1018,902],{"class":790},[780,1020,893],{"class":790},[780,1022,896],{"class":790},[780,1024,1016],{"class":807},[780,1026,902],{"class":790},[780,1028,905],{"class":790},[780,1030,1032,1035,1037,1039,1042,1044],{"class":782,"line":1031},15,[780,1033,1034],{"class":889},"    none",[780,1036,893],{"class":790},[780,1038,896],{"class":790},[780,1040,1041],{"class":807},"none",[780,1043,902],{"class":790},[780,1045,905],{"class":790},[780,1047,1049,1052,1054,1056,1059,1061],{"class":782,"line":1048},16,[780,1050,1051],{"class":889},"    grab",[780,1053,893],{"class":790},[780,1055,896],{"class":790},[780,1057,1058],{"class":807},"grab",[780,1060,902],{"class":790},[780,1062,905],{"class":790},[780,1064,1066,1069,1071,1073,1076,1078],{"class":782,"line":1065},17,[780,1067,1068],{"class":889},"    grabbing",[780,1070,893],{"class":790},[780,1072,896],{"class":790},[780,1074,1075],{"class":807},"grabbing",[780,1077,902],{"class":790},[780,1079,905],{"class":790},[780,1081,1083,1085,1088,1090,1092,1094,1096,1098],{"class":782,"line":1082},18,[780,1084,1013],{"class":790},[780,1086,1087],{"class":889},"zoom-in",[780,1089,902],{"class":790},[780,1091,893],{"class":790},[780,1093,896],{"class":790},[780,1095,1087],{"class":807},[780,1097,902],{"class":790},[780,1099,905],{"class":790},[780,1101,1103,1105,1108,1110,1112,1114,1116,1118],{"class":782,"line":1102},19,[780,1104,1013],{"class":790},[780,1106,1107],{"class":889},"zoom-out",[780,1109,902],{"class":790},[780,1111,893],{"class":790},[780,1113,896],{"class":790},[780,1115,1107],{"class":807},[780,1117,902],{"class":790},[780,1119,905],{"class":790},[780,1121,1123,1126,1129],{"class":782,"line":1122},20,[780,1124,1125],{"class":790},"}",[780,1127,1128],{"class":794},")",[780,1130,814],{"class":790},[780,1132,1134],{"class":782,"line":1133},21,[780,1135,843],{"emptyLinePlaceholder":223},[780,1137,1139,1142,1145,1148],{"class":782,"line":1138},22,[780,1140,1141],{"class":786},"export",[780,1143,1144],{"class":786}," default",[780,1146,1147],{"class":794}," s",[780,1149,814],{"class":790},[766,1151,1152],{"icon":154,"label":326},[770,1153,1158],{"className":1154,"code":1155,"filename":1156,"language":1157,"meta":776,"style":776},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","._cursor\\:auto { cursor: auto; }\n._cursor\\:default { cursor: default; }\n._cursor\\:pointer { cursor: pointer; }\n._cursor\\:wait { cursor: wait; }\n._cursor\\:text { cursor: text; }\n._cursor\\:move { cursor: move; }\n._cursor\\:help { cursor: help; }\n._cursor\\:not-allowed { cursor: not-allowed; }\n._cursor\\:none { cursor: none; }\n._cursor\\:grab { cursor: grab; }\n._cursor\\:grabbing { cursor: grabbing; }\n._cursor\\:zoom-in { cursor: zoom-in; }\n._cursor\\:zoom-out { cursor: zoom-out; }\n","styleframe\u002Findex.css","css",[702,1159,1160,1191,1213,1236,1259,1282,1305,1328,1351,1374,1397,1420,1443],{"__ignoreMap":776},[780,1161,1162,1165,1169,1172,1174,1176,1180,1182,1185,1188],{"class":782,"line":783},[780,1163,1164],{"class":790},".",[780,1166,1168],{"class":1167},"sBMFI","_cursor",[780,1170,1171],{"class":794},"\\:",[780,1173,899],{"class":1167},[780,1175,791],{"class":790},[780,1177,1179],{"class":1178},"sqsOY"," cursor",[780,1181,893],{"class":790},[780,1183,1184],{"class":794}," auto",[780,1186,1187],{"class":790},";",[780,1189,1190],{"class":790}," }\n",[780,1192,1193,1195,1197,1199,1201,1203,1205,1207,1209,1211],{"class":782,"line":817},[780,1194,1164],{"class":790},[780,1196,1168],{"class":1167},[780,1198,1171],{"class":794},[780,1200,918],{"class":1167},[780,1202,791],{"class":790},[780,1204,1179],{"class":1178},[780,1206,893],{"class":790},[780,1208,1144],{"class":794},[780,1210,1187],{"class":790},[780,1212,1190],{"class":790},[780,1214,1215,1217,1219,1221,1223,1225,1227,1229,1232,1234],{"class":782,"line":840},[780,1216,1164],{"class":790},[780,1218,1168],{"class":1167},[780,1220,1171],{"class":794},[780,1222,935],{"class":1167},[780,1224,791],{"class":790},[780,1226,1179],{"class":1178},[780,1228,893],{"class":790},[780,1230,1231],{"class":794}," pointer",[780,1233,1187],{"class":790},[780,1235,1190],{"class":790},[780,1237,1238,1240,1242,1244,1246,1248,1250,1252,1255,1257],{"class":782,"line":846},[780,1239,1164],{"class":790},[780,1241,1168],{"class":1167},[780,1243,1171],{"class":794},[780,1245,952],{"class":1167},[780,1247,791],{"class":790},[780,1249,1179],{"class":1178},[780,1251,893],{"class":790},[780,1253,1254],{"class":794}," wait",[780,1256,1187],{"class":790},[780,1258,1190],{"class":790},[780,1260,1261,1263,1265,1267,1269,1271,1273,1275,1278,1280],{"class":782,"line":867},[780,1262,1164],{"class":790},[780,1264,1168],{"class":1167},[780,1266,1171],{"class":794},[780,1268,969],{"class":1167},[780,1270,791],{"class":790},[780,1272,1179],{"class":1178},[780,1274,893],{"class":790},[780,1276,1277],{"class":794}," text",[780,1279,1187],{"class":790},[780,1281,1190],{"class":790},[780,1283,1284,1286,1288,1290,1292,1294,1296,1298,1301,1303],{"class":782,"line":872},[780,1285,1164],{"class":790},[780,1287,1168],{"class":1167},[780,1289,1171],{"class":794},[780,1291,986],{"class":1167},[780,1293,791],{"class":790},[780,1295,1179],{"class":1178},[780,1297,893],{"class":790},[780,1299,1300],{"class":794}," move",[780,1302,1187],{"class":790},[780,1304,1190],{"class":790},[780,1306,1307,1309,1311,1313,1315,1317,1319,1321,1324,1326],{"class":782,"line":886},[780,1308,1164],{"class":790},[780,1310,1168],{"class":1167},[780,1312,1171],{"class":794},[780,1314,1003],{"class":1167},[780,1316,791],{"class":790},[780,1318,1179],{"class":1178},[780,1320,893],{"class":790},[780,1322,1323],{"class":794}," help",[780,1325,1187],{"class":790},[780,1327,1190],{"class":790},[780,1329,1330,1332,1334,1336,1338,1340,1342,1344,1347,1349],{"class":782,"line":908},[780,1331,1164],{"class":790},[780,1333,1168],{"class":1167},[780,1335,1171],{"class":794},[780,1337,1016],{"class":1167},[780,1339,791],{"class":790},[780,1341,1179],{"class":1178},[780,1343,893],{"class":790},[780,1345,1346],{"class":794}," not-allowed",[780,1348,1187],{"class":790},[780,1350,1190],{"class":790},[780,1352,1353,1355,1357,1359,1361,1363,1365,1367,1370,1372],{"class":782,"line":925},[780,1354,1164],{"class":790},[780,1356,1168],{"class":1167},[780,1358,1171],{"class":794},[780,1360,1041],{"class":1167},[780,1362,791],{"class":790},[780,1364,1179],{"class":1178},[780,1366,893],{"class":790},[780,1368,1369],{"class":794}," none",[780,1371,1187],{"class":790},[780,1373,1190],{"class":790},[780,1375,1376,1378,1380,1382,1384,1386,1388,1390,1393,1395],{"class":782,"line":942},[780,1377,1164],{"class":790},[780,1379,1168],{"class":1167},[780,1381,1171],{"class":794},[780,1383,1058],{"class":1167},[780,1385,791],{"class":790},[780,1387,1179],{"class":1178},[780,1389,893],{"class":790},[780,1391,1392],{"class":794}," grab",[780,1394,1187],{"class":790},[780,1396,1190],{"class":790},[780,1398,1399,1401,1403,1405,1407,1409,1411,1413,1416,1418],{"class":782,"line":959},[780,1400,1164],{"class":790},[780,1402,1168],{"class":1167},[780,1404,1171],{"class":794},[780,1406,1075],{"class":1167},[780,1408,791],{"class":790},[780,1410,1179],{"class":1178},[780,1412,893],{"class":790},[780,1414,1415],{"class":794}," grabbing",[780,1417,1187],{"class":790},[780,1419,1190],{"class":790},[780,1421,1422,1424,1426,1428,1430,1432,1434,1436,1439,1441],{"class":782,"line":976},[780,1423,1164],{"class":790},[780,1425,1168],{"class":1167},[780,1427,1171],{"class":794},[780,1429,1087],{"class":1167},[780,1431,791],{"class":790},[780,1433,1179],{"class":1178},[780,1435,893],{"class":790},[780,1437,1438],{"class":794}," zoom-in",[780,1440,1187],{"class":790},[780,1442,1190],{"class":790},[780,1444,1445,1447,1449,1451,1453,1455,1457,1459,1462,1464],{"class":782,"line":993},[780,1446,1164],{"class":790},[780,1448,1168],{"class":1167},[780,1450,1171],{"class":794},[780,1452,1107],{"class":1167},[780,1454,791],{"class":790},[780,1456,1179],{"class":1178},[780,1458,893],{"class":790},[780,1460,1461],{"class":794}," zoom-out",[780,1463,1187],{"class":790},[780,1465,1190],{"class":790},[766,1467,1469],{"icon":520,"label":1468},"Usage",[770,1470,1474],{"className":1471,"code":1472,"language":1473,"meta":776,"style":776},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cbutton class=\"_cursor:pointer\">Clickable button\u003C\u002Fbutton>\n\u003Cdiv class=\"_cursor:not-allowed\">Disabled area\u003C\u002Fdiv>\n\u003Cdiv class=\"_cursor:grab\">Draggable element\u003C\u002Fdiv>\n","html",[702,1475,1476,1510,1539],{"__ignoreMap":776},[780,1477,1478,1481,1484,1487,1489,1491,1494,1496,1499,1502,1505,1507],{"class":782,"line":783},[780,1479,1480],{"class":790},"\u003C",[780,1482,1483],{"class":889},"button",[780,1485,1486],{"class":849}," class",[780,1488,856],{"class":790},[780,1490,811],{"class":790},[780,1492,1493],{"class":807},"_cursor:pointer",[780,1495,811],{"class":790},[780,1497,1498],{"class":790},">",[780,1500,1501],{"class":794},"Clickable button",[780,1503,1504],{"class":790},"\u003C\u002F",[780,1506,1483],{"class":889},[780,1508,1509],{"class":790},">\n",[780,1511,1512,1514,1517,1519,1521,1523,1526,1528,1530,1533,1535,1537],{"class":782,"line":817},[780,1513,1480],{"class":790},[780,1515,1516],{"class":889},"div",[780,1518,1486],{"class":849},[780,1520,856],{"class":790},[780,1522,811],{"class":790},[780,1524,1525],{"class":807},"_cursor:not-allowed",[780,1527,811],{"class":790},[780,1529,1498],{"class":790},[780,1531,1532],{"class":794},"Disabled area",[780,1534,1504],{"class":790},[780,1536,1516],{"class":889},[780,1538,1509],{"class":790},[780,1540,1541,1543,1545,1547,1549,1551,1554,1556,1558,1561,1563,1565],{"class":782,"line":840},[780,1542,1480],{"class":790},[780,1544,1516],{"class":889},[780,1546,1486],{"class":849},[780,1548,856],{"class":790},[780,1550,811],{"class":790},[780,1552,1553],{"class":807},"_cursor:grab",[780,1555,811],{"class":790},[780,1557,1498],{"class":790},[780,1559,1560],{"class":794},"Draggable element",[780,1562,1504],{"class":790},[780,1564,1516],{"class":889},[780,1566,1509],{"class":790},[707,1568,1570],{"id":1569},"usepointereventsutility",[702,1571,1572],{},"usePointerEventsUtility",[711,1574,1575],{},"Control whether an element responds to pointer events.",[763,1577,1578,1708,1761],{},[766,1579,1580],{"icon":768,"label":290},[770,1581,1583],{"className":772,"code":1582,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { usePointerEventsUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\n\nusePointerEventsUtility(s, {\n    none: 'none',\n    auto: 'auto',\n});\n\nexport default s;\n",[702,1584,1585,1605,1626,1630,1644,1648,1658,1672,1686,1694,1698],{"__ignoreMap":776},[780,1586,1587,1589,1591,1593,1595,1597,1599,1601,1603],{"class":782,"line":783},[780,1588,787],{"class":786},[780,1590,791],{"class":790},[780,1592,795],{"class":794},[780,1594,798],{"class":790},[780,1596,801],{"class":786},[780,1598,804],{"class":790},[780,1600,808],{"class":807},[780,1602,811],{"class":790},[780,1604,814],{"class":790},[780,1606,1607,1609,1611,1614,1616,1618,1620,1622,1624],{"class":782,"line":817},[780,1608,787],{"class":786},[780,1610,791],{"class":790},[780,1612,1613],{"class":794}," usePointerEventsUtility",[780,1615,798],{"class":790},[780,1617,801],{"class":786},[780,1619,804],{"class":790},[780,1621,833],{"class":807},[780,1623,811],{"class":790},[780,1625,814],{"class":790},[780,1627,1628],{"class":782,"line":840},[780,1629,843],{"emptyLinePlaceholder":223},[780,1631,1632,1634,1636,1638,1640,1642],{"class":782,"line":846},[780,1633,850],{"class":849},[780,1635,853],{"class":794},[780,1637,856],{"class":790},[780,1639,795],{"class":859},[780,1641,862],{"class":794},[780,1643,814],{"class":790},[780,1645,1646],{"class":782,"line":867},[780,1647,843],{"emptyLinePlaceholder":223},[780,1649,1650,1652,1654,1656],{"class":782,"line":872},[780,1651,1572],{"class":859},[780,1653,877],{"class":794},[780,1655,880],{"class":790},[780,1657,883],{"class":790},[780,1659,1660,1662,1664,1666,1668,1670],{"class":782,"line":886},[780,1661,1034],{"class":889},[780,1663,893],{"class":790},[780,1665,896],{"class":790},[780,1667,1041],{"class":807},[780,1669,902],{"class":790},[780,1671,905],{"class":790},[780,1673,1674,1676,1678,1680,1682,1684],{"class":782,"line":908},[780,1675,890],{"class":889},[780,1677,893],{"class":790},[780,1679,896],{"class":790},[780,1681,899],{"class":807},[780,1683,902],{"class":790},[780,1685,905],{"class":790},[780,1687,1688,1690,1692],{"class":782,"line":925},[780,1689,1125],{"class":790},[780,1691,1128],{"class":794},[780,1693,814],{"class":790},[780,1695,1696],{"class":782,"line":942},[780,1697,843],{"emptyLinePlaceholder":223},[780,1699,1700,1702,1704,1706],{"class":782,"line":959},[780,1701,1141],{"class":786},[780,1703,1144],{"class":786},[780,1705,1147],{"class":794},[780,1707,814],{"class":790},[766,1709,1710],{"icon":154,"label":326},[770,1711,1713],{"className":1154,"code":1712,"filename":1156,"language":1157,"meta":776,"style":776},"._pointer-events\\:none { pointer-events: none; }\n._pointer-events\\:auto { pointer-events: auto; }\n",[702,1714,1715,1739],{"__ignoreMap":776},[780,1716,1717,1719,1722,1724,1726,1728,1731,1733,1735,1737],{"class":782,"line":783},[780,1718,1164],{"class":790},[780,1720,1721],{"class":1167},"_pointer-events",[780,1723,1171],{"class":794},[780,1725,1041],{"class":1167},[780,1727,791],{"class":790},[780,1729,1730],{"class":1178}," pointer-events",[780,1732,893],{"class":790},[780,1734,1369],{"class":794},[780,1736,1187],{"class":790},[780,1738,1190],{"class":790},[780,1740,1741,1743,1745,1747,1749,1751,1753,1755,1757,1759],{"class":782,"line":817},[780,1742,1164],{"class":790},[780,1744,1721],{"class":1167},[780,1746,1171],{"class":794},[780,1748,899],{"class":1167},[780,1750,791],{"class":790},[780,1752,1730],{"class":1178},[780,1754,893],{"class":790},[780,1756,1184],{"class":794},[780,1758,1187],{"class":790},[780,1760,1190],{"class":790},[766,1762,1763],{"icon":520,"label":1468},[770,1764,1766],{"className":1471,"code":1765,"language":1473,"meta":776,"style":776},"\u003Cdiv class=\"_pointer-events:none\">Click passes through\u003C\u002Fdiv>\n\u003Cdiv class=\"_pointer-events:auto\">Normal click behavior\u003C\u002Fdiv>\n",[702,1767,1768,1796],{"__ignoreMap":776},[780,1769,1770,1772,1774,1776,1778,1780,1783,1785,1787,1790,1792,1794],{"class":782,"line":783},[780,1771,1480],{"class":790},[780,1773,1516],{"class":889},[780,1775,1486],{"class":849},[780,1777,856],{"class":790},[780,1779,811],{"class":790},[780,1781,1782],{"class":807},"_pointer-events:none",[780,1784,811],{"class":790},[780,1786,1498],{"class":790},[780,1788,1789],{"class":794},"Click passes through",[780,1791,1504],{"class":790},[780,1793,1516],{"class":889},[780,1795,1509],{"class":790},[780,1797,1798,1800,1802,1804,1806,1808,1811,1813,1815,1818,1820,1822],{"class":782,"line":817},[780,1799,1480],{"class":790},[780,1801,1516],{"class":889},[780,1803,1486],{"class":849},[780,1805,856],{"class":790},[780,1807,811],{"class":790},[780,1809,1810],{"class":807},"_pointer-events:auto",[780,1812,811],{"class":790},[780,1814,1498],{"class":790},[780,1816,1817],{"class":794},"Normal click behavior",[780,1819,1504],{"class":790},[780,1821,1516],{"class":889},[780,1823,1509],{"class":790},[707,1825,1827],{"id":1826},"useuserselectutility",[702,1828,1829],{},"useUserSelectUtility",[711,1831,1832],{},"Control text selection behavior.",[763,1834,1835,1995,2093],{},[766,1836,1837],{"icon":768,"label":290},[770,1838,1840],{"className":772,"code":1839,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { useUserSelectUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\n\nuseUserSelectUtility(s, {\n    none: 'none',\n    text: 'text',\n    all: 'all',\n    auto: 'auto',\n});\n\nexport default s;\n",[702,1841,1842,1862,1883,1887,1901,1905,1915,1929,1943,1959,1973,1981,1985],{"__ignoreMap":776},[780,1843,1844,1846,1848,1850,1852,1854,1856,1858,1860],{"class":782,"line":783},[780,1845,787],{"class":786},[780,1847,791],{"class":790},[780,1849,795],{"class":794},[780,1851,798],{"class":790},[780,1853,801],{"class":786},[780,1855,804],{"class":790},[780,1857,808],{"class":807},[780,1859,811],{"class":790},[780,1861,814],{"class":790},[780,1863,1864,1866,1868,1871,1873,1875,1877,1879,1881],{"class":782,"line":817},[780,1865,787],{"class":786},[780,1867,791],{"class":790},[780,1869,1870],{"class":794}," useUserSelectUtility",[780,1872,798],{"class":790},[780,1874,801],{"class":786},[780,1876,804],{"class":790},[780,1878,833],{"class":807},[780,1880,811],{"class":790},[780,1882,814],{"class":790},[780,1884,1885],{"class":782,"line":840},[780,1886,843],{"emptyLinePlaceholder":223},[780,1888,1889,1891,1893,1895,1897,1899],{"class":782,"line":846},[780,1890,850],{"class":849},[780,1892,853],{"class":794},[780,1894,856],{"class":790},[780,1896,795],{"class":859},[780,1898,862],{"class":794},[780,1900,814],{"class":790},[780,1902,1903],{"class":782,"line":867},[780,1904,843],{"emptyLinePlaceholder":223},[780,1906,1907,1909,1911,1913],{"class":782,"line":872},[780,1908,1829],{"class":859},[780,1910,877],{"class":794},[780,1912,880],{"class":790},[780,1914,883],{"class":790},[780,1916,1917,1919,1921,1923,1925,1927],{"class":782,"line":886},[780,1918,1034],{"class":889},[780,1920,893],{"class":790},[780,1922,896],{"class":790},[780,1924,1041],{"class":807},[780,1926,902],{"class":790},[780,1928,905],{"class":790},[780,1930,1931,1933,1935,1937,1939,1941],{"class":782,"line":908},[780,1932,962],{"class":889},[780,1934,893],{"class":790},[780,1936,896],{"class":790},[780,1938,969],{"class":807},[780,1940,902],{"class":790},[780,1942,905],{"class":790},[780,1944,1945,1948,1950,1952,1955,1957],{"class":782,"line":925},[780,1946,1947],{"class":889},"    all",[780,1949,893],{"class":790},[780,1951,896],{"class":790},[780,1953,1954],{"class":807},"all",[780,1956,902],{"class":790},[780,1958,905],{"class":790},[780,1960,1961,1963,1965,1967,1969,1971],{"class":782,"line":942},[780,1962,890],{"class":889},[780,1964,893],{"class":790},[780,1966,896],{"class":790},[780,1968,899],{"class":807},[780,1970,902],{"class":790},[780,1972,905],{"class":790},[780,1974,1975,1977,1979],{"class":782,"line":959},[780,1976,1125],{"class":790},[780,1978,1128],{"class":794},[780,1980,814],{"class":790},[780,1982,1983],{"class":782,"line":976},[780,1984,843],{"emptyLinePlaceholder":223},[780,1986,1987,1989,1991,1993],{"class":782,"line":993},[780,1988,1141],{"class":786},[780,1990,1144],{"class":786},[780,1992,1147],{"class":794},[780,1994,814],{"class":790},[766,1996,1997],{"icon":154,"label":326},[770,1998,2000],{"className":1154,"code":1999,"filename":1156,"language":1157,"meta":776,"style":776},"._user-select\\:none { user-select: none; }\n._user-select\\:text { user-select: text; }\n._user-select\\:all { user-select: all; }\n._user-select\\:auto { user-select: auto; }\n",[702,2001,2002,2026,2048,2071],{"__ignoreMap":776},[780,2003,2004,2006,2009,2011,2013,2015,2018,2020,2022,2024],{"class":782,"line":783},[780,2005,1164],{"class":790},[780,2007,2008],{"class":1167},"_user-select",[780,2010,1171],{"class":794},[780,2012,1041],{"class":1167},[780,2014,791],{"class":790},[780,2016,2017],{"class":1178}," user-select",[780,2019,893],{"class":790},[780,2021,1369],{"class":794},[780,2023,1187],{"class":790},[780,2025,1190],{"class":790},[780,2027,2028,2030,2032,2034,2036,2038,2040,2042,2044,2046],{"class":782,"line":817},[780,2029,1164],{"class":790},[780,2031,2008],{"class":1167},[780,2033,1171],{"class":794},[780,2035,969],{"class":1167},[780,2037,791],{"class":790},[780,2039,2017],{"class":1178},[780,2041,893],{"class":790},[780,2043,1277],{"class":794},[780,2045,1187],{"class":790},[780,2047,1190],{"class":790},[780,2049,2050,2052,2054,2056,2058,2060,2062,2064,2067,2069],{"class":782,"line":840},[780,2051,1164],{"class":790},[780,2053,2008],{"class":1167},[780,2055,1171],{"class":794},[780,2057,1954],{"class":1167},[780,2059,791],{"class":790},[780,2061,2017],{"class":1178},[780,2063,893],{"class":790},[780,2065,2066],{"class":794}," all",[780,2068,1187],{"class":790},[780,2070,1190],{"class":790},[780,2072,2073,2075,2077,2079,2081,2083,2085,2087,2089,2091],{"class":782,"line":846},[780,2074,1164],{"class":790},[780,2076,2008],{"class":1167},[780,2078,1171],{"class":794},[780,2080,899],{"class":1167},[780,2082,791],{"class":790},[780,2084,2017],{"class":1178},[780,2086,893],{"class":790},[780,2088,1184],{"class":794},[780,2090,1187],{"class":790},[780,2092,1190],{"class":790},[766,2094,2095],{"icon":520,"label":1468},[770,2096,2098],{"className":1471,"code":2097,"language":1473,"meta":776,"style":776},"\u003Cbutton class=\"_user-select:none\">Can't select this text\u003C\u002Fbutton>\n\u003Ccode class=\"_user-select:all\">Click to select all\u003C\u002Fcode>\n",[702,2099,2100,2128],{"__ignoreMap":776},[780,2101,2102,2104,2106,2108,2110,2112,2115,2117,2119,2122,2124,2126],{"class":782,"line":783},[780,2103,1480],{"class":790},[780,2105,1483],{"class":889},[780,2107,1486],{"class":849},[780,2109,856],{"class":790},[780,2111,811],{"class":790},[780,2113,2114],{"class":807},"_user-select:none",[780,2116,811],{"class":790},[780,2118,1498],{"class":790},[780,2120,2121],{"class":794},"Can't select this text",[780,2123,1504],{"class":790},[780,2125,1483],{"class":889},[780,2127,1509],{"class":790},[780,2129,2130,2132,2134,2136,2138,2140,2143,2145,2147,2150,2152,2154],{"class":782,"line":817},[780,2131,1480],{"class":790},[780,2133,702],{"class":889},[780,2135,1486],{"class":849},[780,2137,856],{"class":790},[780,2139,811],{"class":790},[780,2141,2142],{"class":807},"_user-select:all",[780,2144,811],{"class":790},[780,2146,1498],{"class":790},[780,2148,2149],{"class":794},"Click to select all",[780,2151,1504],{"class":790},[780,2153,702],{"class":889},[780,2155,1509],{"class":790},[707,2157,2159],{"id":2158},"usescrollbehaviorutility",[702,2160,2161],{},"useScrollBehaviorUtility",[711,2163,2164],{},"Control scroll animation behavior.",[763,2166,2167,2299,2353],{},[766,2168,2169],{"icon":768,"label":290},[770,2170,2172],{"className":772,"code":2171,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { useScrollBehaviorUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\n\nuseScrollBehaviorUtility(s, {\n    auto: 'auto',\n    smooth: 'smooth',\n});\n\nexport default s;\n",[702,2173,2174,2194,2215,2219,2233,2237,2247,2261,2277,2285,2289],{"__ignoreMap":776},[780,2175,2176,2178,2180,2182,2184,2186,2188,2190,2192],{"class":782,"line":783},[780,2177,787],{"class":786},[780,2179,791],{"class":790},[780,2181,795],{"class":794},[780,2183,798],{"class":790},[780,2185,801],{"class":786},[780,2187,804],{"class":790},[780,2189,808],{"class":807},[780,2191,811],{"class":790},[780,2193,814],{"class":790},[780,2195,2196,2198,2200,2203,2205,2207,2209,2211,2213],{"class":782,"line":817},[780,2197,787],{"class":786},[780,2199,791],{"class":790},[780,2201,2202],{"class":794}," useScrollBehaviorUtility",[780,2204,798],{"class":790},[780,2206,801],{"class":786},[780,2208,804],{"class":790},[780,2210,833],{"class":807},[780,2212,811],{"class":790},[780,2214,814],{"class":790},[780,2216,2217],{"class":782,"line":840},[780,2218,843],{"emptyLinePlaceholder":223},[780,2220,2221,2223,2225,2227,2229,2231],{"class":782,"line":846},[780,2222,850],{"class":849},[780,2224,853],{"class":794},[780,2226,856],{"class":790},[780,2228,795],{"class":859},[780,2230,862],{"class":794},[780,2232,814],{"class":790},[780,2234,2235],{"class":782,"line":867},[780,2236,843],{"emptyLinePlaceholder":223},[780,2238,2239,2241,2243,2245],{"class":782,"line":872},[780,2240,2161],{"class":859},[780,2242,877],{"class":794},[780,2244,880],{"class":790},[780,2246,883],{"class":790},[780,2248,2249,2251,2253,2255,2257,2259],{"class":782,"line":886},[780,2250,890],{"class":889},[780,2252,893],{"class":790},[780,2254,896],{"class":790},[780,2256,899],{"class":807},[780,2258,902],{"class":790},[780,2260,905],{"class":790},[780,2262,2263,2266,2268,2270,2273,2275],{"class":782,"line":908},[780,2264,2265],{"class":889},"    smooth",[780,2267,893],{"class":790},[780,2269,896],{"class":790},[780,2271,2272],{"class":807},"smooth",[780,2274,902],{"class":790},[780,2276,905],{"class":790},[780,2278,2279,2281,2283],{"class":782,"line":925},[780,2280,1125],{"class":790},[780,2282,1128],{"class":794},[780,2284,814],{"class":790},[780,2286,2287],{"class":782,"line":942},[780,2288,843],{"emptyLinePlaceholder":223},[780,2290,2291,2293,2295,2297],{"class":782,"line":959},[780,2292,1141],{"class":786},[780,2294,1144],{"class":786},[780,2296,1147],{"class":794},[780,2298,814],{"class":790},[766,2300,2301],{"icon":154,"label":326},[770,2302,2304],{"className":1154,"code":2303,"filename":1156,"language":1157,"meta":776,"style":776},"._scroll-behavior\\:auto { scroll-behavior: auto; }\n._scroll-behavior\\:smooth { scroll-behavior: smooth; }\n",[702,2305,2306,2330],{"__ignoreMap":776},[780,2307,2308,2310,2313,2315,2317,2319,2322,2324,2326,2328],{"class":782,"line":783},[780,2309,1164],{"class":790},[780,2311,2312],{"class":1167},"_scroll-behavior",[780,2314,1171],{"class":794},[780,2316,899],{"class":1167},[780,2318,791],{"class":790},[780,2320,2321],{"class":1178}," scroll-behavior",[780,2323,893],{"class":790},[780,2325,1184],{"class":794},[780,2327,1187],{"class":790},[780,2329,1190],{"class":790},[780,2331,2332,2334,2336,2338,2340,2342,2344,2346,2349,2351],{"class":782,"line":817},[780,2333,1164],{"class":790},[780,2335,2312],{"class":1167},[780,2337,1171],{"class":794},[780,2339,2272],{"class":1167},[780,2341,791],{"class":790},[780,2343,2321],{"class":1178},[780,2345,893],{"class":790},[780,2347,2348],{"class":794}," smooth",[780,2350,1187],{"class":790},[780,2352,1190],{"class":790},[766,2354,2355],{"icon":520,"label":1468},[770,2356,2358],{"className":1471,"code":2357,"language":1473,"meta":776,"style":776},"\u003Chtml class=\"_scroll-behavior:smooth\">\n\u003Cdiv class=\"_scroll-behavior:auto\">Instant scrolling container\u003C\u002Fdiv>\n",[702,2359,2360,2379],{"__ignoreMap":776},[780,2361,2362,2364,2366,2368,2370,2372,2375,2377],{"class":782,"line":783},[780,2363,1480],{"class":790},[780,2365,1473],{"class":889},[780,2367,1486],{"class":849},[780,2369,856],{"class":790},[780,2371,811],{"class":790},[780,2373,2374],{"class":807},"_scroll-behavior:smooth",[780,2376,811],{"class":790},[780,2378,1509],{"class":790},[780,2380,2381,2383,2385,2387,2389,2391,2394,2396,2398,2401,2403,2405],{"class":782,"line":817},[780,2382,1480],{"class":790},[780,2384,1516],{"class":889},[780,2386,1486],{"class":849},[780,2388,856],{"class":790},[780,2390,811],{"class":790},[780,2392,2393],{"class":807},"_scroll-behavior:auto",[780,2395,811],{"class":790},[780,2397,1498],{"class":790},[780,2399,2400],{"class":794},"Instant scrolling container",[780,2402,1504],{"class":790},[780,2404,1516],{"class":889},[780,2406,1509],{"class":790},[707,2408,2410],{"id":2409},"usetouchactionutility",[702,2411,2412],{},"useTouchActionUtility",[711,2414,2415],{},"Control how touch interactions are handled.",[763,2417,2418,2694,2822],{},[766,2419,2420],{"icon":768,"label":290},[770,2421,2423],{"className":772,"code":2422,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { useTouchActionUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\n\nuseTouchActionUtility(s, {\n    auto: 'auto',\n    none: 'none',\n    'pan-x': 'pan-x',\n    'pan-left': 'pan-left',\n    'pan-right': 'pan-right',\n    'pan-y': 'pan-y',\n    'pan-up': 'pan-up',\n    'pan-down': 'pan-down',\n    pinchZoom: 'pinch-zoom',\n    manipulation: 'manipulation',\n});\n\nexport default s;\n",[702,2424,2425,2445,2466,2470,2484,2488,2498,2512,2526,2545,2564,2583,2602,2621,2640,2656,2672,2680,2684],{"__ignoreMap":776},[780,2426,2427,2429,2431,2433,2435,2437,2439,2441,2443],{"class":782,"line":783},[780,2428,787],{"class":786},[780,2430,791],{"class":790},[780,2432,795],{"class":794},[780,2434,798],{"class":790},[780,2436,801],{"class":786},[780,2438,804],{"class":790},[780,2440,808],{"class":807},[780,2442,811],{"class":790},[780,2444,814],{"class":790},[780,2446,2447,2449,2451,2454,2456,2458,2460,2462,2464],{"class":782,"line":817},[780,2448,787],{"class":786},[780,2450,791],{"class":790},[780,2452,2453],{"class":794}," useTouchActionUtility",[780,2455,798],{"class":790},[780,2457,801],{"class":786},[780,2459,804],{"class":790},[780,2461,833],{"class":807},[780,2463,811],{"class":790},[780,2465,814],{"class":790},[780,2467,2468],{"class":782,"line":840},[780,2469,843],{"emptyLinePlaceholder":223},[780,2471,2472,2474,2476,2478,2480,2482],{"class":782,"line":846},[780,2473,850],{"class":849},[780,2475,853],{"class":794},[780,2477,856],{"class":790},[780,2479,795],{"class":859},[780,2481,862],{"class":794},[780,2483,814],{"class":790},[780,2485,2486],{"class":782,"line":867},[780,2487,843],{"emptyLinePlaceholder":223},[780,2489,2490,2492,2494,2496],{"class":782,"line":872},[780,2491,2412],{"class":859},[780,2493,877],{"class":794},[780,2495,880],{"class":790},[780,2497,883],{"class":790},[780,2499,2500,2502,2504,2506,2508,2510],{"class":782,"line":886},[780,2501,890],{"class":889},[780,2503,893],{"class":790},[780,2505,896],{"class":790},[780,2507,899],{"class":807},[780,2509,902],{"class":790},[780,2511,905],{"class":790},[780,2513,2514,2516,2518,2520,2522,2524],{"class":782,"line":908},[780,2515,1034],{"class":889},[780,2517,893],{"class":790},[780,2519,896],{"class":790},[780,2521,1041],{"class":807},[780,2523,902],{"class":790},[780,2525,905],{"class":790},[780,2527,2528,2530,2533,2535,2537,2539,2541,2543],{"class":782,"line":925},[780,2529,1013],{"class":790},[780,2531,2532],{"class":889},"pan-x",[780,2534,902],{"class":790},[780,2536,893],{"class":790},[780,2538,896],{"class":790},[780,2540,2532],{"class":807},[780,2542,902],{"class":790},[780,2544,905],{"class":790},[780,2546,2547,2549,2552,2554,2556,2558,2560,2562],{"class":782,"line":942},[780,2548,1013],{"class":790},[780,2550,2551],{"class":889},"pan-left",[780,2553,902],{"class":790},[780,2555,893],{"class":790},[780,2557,896],{"class":790},[780,2559,2551],{"class":807},[780,2561,902],{"class":790},[780,2563,905],{"class":790},[780,2565,2566,2568,2571,2573,2575,2577,2579,2581],{"class":782,"line":959},[780,2567,1013],{"class":790},[780,2569,2570],{"class":889},"pan-right",[780,2572,902],{"class":790},[780,2574,893],{"class":790},[780,2576,896],{"class":790},[780,2578,2570],{"class":807},[780,2580,902],{"class":790},[780,2582,905],{"class":790},[780,2584,2585,2587,2590,2592,2594,2596,2598,2600],{"class":782,"line":976},[780,2586,1013],{"class":790},[780,2588,2589],{"class":889},"pan-y",[780,2591,902],{"class":790},[780,2593,893],{"class":790},[780,2595,896],{"class":790},[780,2597,2589],{"class":807},[780,2599,902],{"class":790},[780,2601,905],{"class":790},[780,2603,2604,2606,2609,2611,2613,2615,2617,2619],{"class":782,"line":993},[780,2605,1013],{"class":790},[780,2607,2608],{"class":889},"pan-up",[780,2610,902],{"class":790},[780,2612,893],{"class":790},[780,2614,896],{"class":790},[780,2616,2608],{"class":807},[780,2618,902],{"class":790},[780,2620,905],{"class":790},[780,2622,2623,2625,2628,2630,2632,2634,2636,2638],{"class":782,"line":1010},[780,2624,1013],{"class":790},[780,2626,2627],{"class":889},"pan-down",[780,2629,902],{"class":790},[780,2631,893],{"class":790},[780,2633,896],{"class":790},[780,2635,2627],{"class":807},[780,2637,902],{"class":790},[780,2639,905],{"class":790},[780,2641,2642,2645,2647,2649,2652,2654],{"class":782,"line":1031},[780,2643,2644],{"class":889},"    pinchZoom",[780,2646,893],{"class":790},[780,2648,896],{"class":790},[780,2650,2651],{"class":807},"pinch-zoom",[780,2653,902],{"class":790},[780,2655,905],{"class":790},[780,2657,2658,2661,2663,2665,2668,2670],{"class":782,"line":1048},[780,2659,2660],{"class":889},"    manipulation",[780,2662,893],{"class":790},[780,2664,896],{"class":790},[780,2666,2667],{"class":807},"manipulation",[780,2669,902],{"class":790},[780,2671,905],{"class":790},[780,2673,2674,2676,2678],{"class":782,"line":1065},[780,2675,1125],{"class":790},[780,2677,1128],{"class":794},[780,2679,814],{"class":790},[780,2681,2682],{"class":782,"line":1082},[780,2683,843],{"emptyLinePlaceholder":223},[780,2685,2686,2688,2690,2692],{"class":782,"line":1102},[780,2687,1141],{"class":786},[780,2689,1144],{"class":786},[780,2691,1147],{"class":794},[780,2693,814],{"class":790},[766,2695,2696],{"icon":154,"label":326},[770,2697,2699],{"className":1154,"code":2698,"filename":1156,"language":1157,"meta":776,"style":776},"._touch-action\\:auto { touch-action: auto; }\n._touch-action\\:none { touch-action: none; }\n._touch-action\\:pan-x { touch-action: pan-x; }\n._touch-action\\:pan-y { touch-action: pan-y; }\n._touch-action\\:manipulation { touch-action: manipulation; }\n\u002F* ... more values *\u002F\n",[702,2700,2701,2725,2747,2770,2793,2816],{"__ignoreMap":776},[780,2702,2703,2705,2708,2710,2712,2714,2717,2719,2721,2723],{"class":782,"line":783},[780,2704,1164],{"class":790},[780,2706,2707],{"class":1167},"_touch-action",[780,2709,1171],{"class":794},[780,2711,899],{"class":1167},[780,2713,791],{"class":790},[780,2715,2716],{"class":1178}," touch-action",[780,2718,893],{"class":790},[780,2720,1184],{"class":794},[780,2722,1187],{"class":790},[780,2724,1190],{"class":790},[780,2726,2727,2729,2731,2733,2735,2737,2739,2741,2743,2745],{"class":782,"line":817},[780,2728,1164],{"class":790},[780,2730,2707],{"class":1167},[780,2732,1171],{"class":794},[780,2734,1041],{"class":1167},[780,2736,791],{"class":790},[780,2738,2716],{"class":1178},[780,2740,893],{"class":790},[780,2742,1369],{"class":794},[780,2744,1187],{"class":790},[780,2746,1190],{"class":790},[780,2748,2749,2751,2753,2755,2757,2759,2761,2763,2766,2768],{"class":782,"line":840},[780,2750,1164],{"class":790},[780,2752,2707],{"class":1167},[780,2754,1171],{"class":794},[780,2756,2532],{"class":1167},[780,2758,791],{"class":790},[780,2760,2716],{"class":1178},[780,2762,893],{"class":790},[780,2764,2765],{"class":794}," pan-x",[780,2767,1187],{"class":790},[780,2769,1190],{"class":790},[780,2771,2772,2774,2776,2778,2780,2782,2784,2786,2789,2791],{"class":782,"line":846},[780,2773,1164],{"class":790},[780,2775,2707],{"class":1167},[780,2777,1171],{"class":794},[780,2779,2589],{"class":1167},[780,2781,791],{"class":790},[780,2783,2716],{"class":1178},[780,2785,893],{"class":790},[780,2787,2788],{"class":794}," pan-y",[780,2790,1187],{"class":790},[780,2792,1190],{"class":790},[780,2794,2795,2797,2799,2801,2803,2805,2807,2809,2812,2814],{"class":782,"line":867},[780,2796,1164],{"class":790},[780,2798,2707],{"class":1167},[780,2800,1171],{"class":794},[780,2802,2667],{"class":1167},[780,2804,791],{"class":790},[780,2806,2716],{"class":1178},[780,2808,893],{"class":790},[780,2810,2811],{"class":794}," manipulation",[780,2813,1187],{"class":790},[780,2815,1190],{"class":790},[780,2817,2818],{"class":782,"line":872},[780,2819,2821],{"class":2820},"sHwdD","\u002F* ... more values *\u002F\n",[766,2823,2824],{"icon":520,"label":1468},[770,2825,2827],{"className":1471,"code":2826,"language":1473,"meta":776,"style":776},"\u003Cdiv class=\"_touch-action:none\">Disable all touch gestures\u003C\u002Fdiv>\n\u003Cbutton class=\"_touch-action:manipulation\">Fast tap response\u003C\u002Fbutton>\n",[702,2828,2829,2857],{"__ignoreMap":776},[780,2830,2831,2833,2835,2837,2839,2841,2844,2846,2848,2851,2853,2855],{"class":782,"line":783},[780,2832,1480],{"class":790},[780,2834,1516],{"class":889},[780,2836,1486],{"class":849},[780,2838,856],{"class":790},[780,2840,811],{"class":790},[780,2842,2843],{"class":807},"_touch-action:none",[780,2845,811],{"class":790},[780,2847,1498],{"class":790},[780,2849,2850],{"class":794},"Disable all touch gestures",[780,2852,1504],{"class":790},[780,2854,1516],{"class":889},[780,2856,1509],{"class":790},[780,2858,2859,2861,2863,2865,2867,2869,2872,2874,2876,2879,2881,2883],{"class":782,"line":817},[780,2860,1480],{"class":790},[780,2862,1483],{"class":889},[780,2864,1486],{"class":849},[780,2866,856],{"class":790},[780,2868,811],{"class":790},[780,2870,2871],{"class":807},"_touch-action:manipulation",[780,2873,811],{"class":790},[780,2875,1498],{"class":790},[780,2877,2878],{"class":794},"Fast tap response",[780,2880,1504],{"class":790},[780,2882,1483],{"class":889},[780,2884,1509],{"class":790},[707,2886,2888],{"id":2887},"more-interactivity-utilities","More Interactivity Utilities",[2890,2891,2893],"h3",{"id":2892},"useaccentcolorutility",[702,2894,2895],{},"useAccentColorUtility",[711,2897,2898],{},"Set the accent color for form controls.",[770,2900,2902],{"className":772,"code":2901,"language":775,"meta":776,"style":776},"import { useAccentColorUtility } from \"@styleframe\u002Ftheme\";\n\nuseAccentColorUtility(s, {\n    auto: 'auto',\n    primary: '#006cff',\n});\n",[702,2903,2904,2925,2929,2939,2953,2969],{"__ignoreMap":776},[780,2905,2906,2908,2910,2913,2915,2917,2919,2921,2923],{"class":782,"line":783},[780,2907,787],{"class":786},[780,2909,791],{"class":790},[780,2911,2912],{"class":794}," useAccentColorUtility",[780,2914,798],{"class":790},[780,2916,801],{"class":786},[780,2918,804],{"class":790},[780,2920,833],{"class":807},[780,2922,811],{"class":790},[780,2924,814],{"class":790},[780,2926,2927],{"class":782,"line":817},[780,2928,843],{"emptyLinePlaceholder":223},[780,2930,2931,2933,2935,2937],{"class":782,"line":840},[780,2932,2895],{"class":859},[780,2934,877],{"class":794},[780,2936,880],{"class":790},[780,2938,883],{"class":790},[780,2940,2941,2943,2945,2947,2949,2951],{"class":782,"line":846},[780,2942,890],{"class":889},[780,2944,893],{"class":790},[780,2946,896],{"class":790},[780,2948,899],{"class":807},[780,2950,902],{"class":790},[780,2952,905],{"class":790},[780,2954,2955,2958,2960,2962,2965,2967],{"class":782,"line":867},[780,2956,2957],{"class":889},"    primary",[780,2959,893],{"class":790},[780,2961,896],{"class":790},[780,2963,2964],{"class":807},"#006cff",[780,2966,902],{"class":790},[780,2968,905],{"class":790},[780,2970,2971,2973,2975],{"class":782,"line":872},[780,2972,1125],{"class":790},[780,2974,1128],{"class":794},[780,2976,814],{"class":790},[2890,2978,2980],{"id":2979},"usecaretcolorutility",[702,2981,2982],{},"useCaretColorUtility",[711,2984,2985],{},"Set the color of the text input caret.",[770,2987,2989],{"className":772,"code":2988,"language":775,"meta":776,"style":776},"import { useCaretColorUtility } from \"@styleframe\u002Ftheme\";\n\nuseCaretColorUtility(s, {\n    primary: '#006cff',\n    transparent: 'transparent',\n});\n",[702,2990,2991,3012,3016,3026,3040,3056],{"__ignoreMap":776},[780,2992,2993,2995,2997,3000,3002,3004,3006,3008,3010],{"class":782,"line":783},[780,2994,787],{"class":786},[780,2996,791],{"class":790},[780,2998,2999],{"class":794}," useCaretColorUtility",[780,3001,798],{"class":790},[780,3003,801],{"class":786},[780,3005,804],{"class":790},[780,3007,833],{"class":807},[780,3009,811],{"class":790},[780,3011,814],{"class":790},[780,3013,3014],{"class":782,"line":817},[780,3015,843],{"emptyLinePlaceholder":223},[780,3017,3018,3020,3022,3024],{"class":782,"line":840},[780,3019,2982],{"class":859},[780,3021,877],{"class":794},[780,3023,880],{"class":790},[780,3025,883],{"class":790},[780,3027,3028,3030,3032,3034,3036,3038],{"class":782,"line":846},[780,3029,2957],{"class":889},[780,3031,893],{"class":790},[780,3033,896],{"class":790},[780,3035,2964],{"class":807},[780,3037,902],{"class":790},[780,3039,905],{"class":790},[780,3041,3042,3045,3047,3049,3052,3054],{"class":782,"line":867},[780,3043,3044],{"class":889},"    transparent",[780,3046,893],{"class":790},[780,3048,896],{"class":790},[780,3050,3051],{"class":807},"transparent",[780,3053,902],{"class":790},[780,3055,905],{"class":790},[780,3057,3058,3060,3062],{"class":782,"line":872},[780,3059,1125],{"class":790},[780,3061,1128],{"class":794},[780,3063,814],{"class":790},[2890,3065,3067],{"id":3066},"useresizeutility",[702,3068,3069],{},"useResizeUtility",[711,3071,3072],{},"Control whether an element is resizable.",[770,3074,3076],{"className":772,"code":3075,"language":775,"meta":776,"style":776},"import { useResizeUtility } from \"@styleframe\u002Ftheme\";\n\nuseResizeUtility(s, {\n    none: 'none',\n    y: 'vertical',\n    x: 'horizontal',\n    both: 'both',\n});\n",[702,3077,3078,3099,3103,3113,3127,3143,3159,3175],{"__ignoreMap":776},[780,3079,3080,3082,3084,3087,3089,3091,3093,3095,3097],{"class":782,"line":783},[780,3081,787],{"class":786},[780,3083,791],{"class":790},[780,3085,3086],{"class":794}," useResizeUtility",[780,3088,798],{"class":790},[780,3090,801],{"class":786},[780,3092,804],{"class":790},[780,3094,833],{"class":807},[780,3096,811],{"class":790},[780,3098,814],{"class":790},[780,3100,3101],{"class":782,"line":817},[780,3102,843],{"emptyLinePlaceholder":223},[780,3104,3105,3107,3109,3111],{"class":782,"line":840},[780,3106,3069],{"class":859},[780,3108,877],{"class":794},[780,3110,880],{"class":790},[780,3112,883],{"class":790},[780,3114,3115,3117,3119,3121,3123,3125],{"class":782,"line":846},[780,3116,1034],{"class":889},[780,3118,893],{"class":790},[780,3120,896],{"class":790},[780,3122,1041],{"class":807},[780,3124,902],{"class":790},[780,3126,905],{"class":790},[780,3128,3129,3132,3134,3136,3139,3141],{"class":782,"line":867},[780,3130,3131],{"class":889},"    y",[780,3133,893],{"class":790},[780,3135,896],{"class":790},[780,3137,3138],{"class":807},"vertical",[780,3140,902],{"class":790},[780,3142,905],{"class":790},[780,3144,3145,3148,3150,3152,3155,3157],{"class":782,"line":872},[780,3146,3147],{"class":889},"    x",[780,3149,893],{"class":790},[780,3151,896],{"class":790},[780,3153,3154],{"class":807},"horizontal",[780,3156,902],{"class":790},[780,3158,905],{"class":790},[780,3160,3161,3164,3166,3168,3171,3173],{"class":782,"line":886},[780,3162,3163],{"class":889},"    both",[780,3165,893],{"class":790},[780,3167,896],{"class":790},[780,3169,3170],{"class":807},"both",[780,3172,902],{"class":790},[780,3174,905],{"class":790},[780,3176,3177,3179,3181],{"class":782,"line":908},[780,3178,1125],{"class":790},[780,3180,1128],{"class":794},[780,3182,814],{"class":790},[2890,3184,3186],{"id":3185},"useappearanceutility",[702,3187,3188],{},"useAppearanceUtility",[711,3190,3191],{},"Control native browser styling on form elements.",[770,3193,3195],{"className":772,"code":3194,"language":775,"meta":776,"style":776},"import { useAppearanceUtility } from \"@styleframe\u002Ftheme\";\n\nuseAppearanceUtility(s, {\n    none: 'none',\n    auto: 'auto',\n});\n",[702,3196,3197,3218,3222,3232,3246,3260],{"__ignoreMap":776},[780,3198,3199,3201,3203,3206,3208,3210,3212,3214,3216],{"class":782,"line":783},[780,3200,787],{"class":786},[780,3202,791],{"class":790},[780,3204,3205],{"class":794}," useAppearanceUtility",[780,3207,798],{"class":790},[780,3209,801],{"class":786},[780,3211,804],{"class":790},[780,3213,833],{"class":807},[780,3215,811],{"class":790},[780,3217,814],{"class":790},[780,3219,3220],{"class":782,"line":817},[780,3221,843],{"emptyLinePlaceholder":223},[780,3223,3224,3226,3228,3230],{"class":782,"line":840},[780,3225,3188],{"class":859},[780,3227,877],{"class":794},[780,3229,880],{"class":790},[780,3231,883],{"class":790},[780,3233,3234,3236,3238,3240,3242,3244],{"class":782,"line":846},[780,3235,1034],{"class":889},[780,3237,893],{"class":790},[780,3239,896],{"class":790},[780,3241,1041],{"class":807},[780,3243,902],{"class":790},[780,3245,905],{"class":790},[780,3247,3248,3250,3252,3254,3256,3258],{"class":782,"line":867},[780,3249,890],{"class":889},[780,3251,893],{"class":790},[780,3253,896],{"class":790},[780,3255,899],{"class":807},[780,3257,902],{"class":790},[780,3259,905],{"class":790},[780,3261,3262,3264,3266],{"class":782,"line":872},[780,3263,1125],{"class":790},[780,3265,1128],{"class":794},[780,3267,814],{"class":790},[2890,3269,3271],{"id":3270},"usewillchangeutility",[702,3272,3273],{},"useWillChangeUtility",[711,3275,3276],{},"Hint to browsers about expected changes for optimization.",[770,3278,3280],{"className":772,"code":3279,"language":775,"meta":776,"style":776},"import { useWillChangeUtility } from \"@styleframe\u002Ftheme\";\n\nuseWillChangeUtility(s, {\n    auto: 'auto',\n    scroll: 'scroll-position',\n    contents: 'contents',\n    transform: 'transform',\n});\n",[702,3281,3282,3303,3307,3317,3331,3347,3363,3379],{"__ignoreMap":776},[780,3283,3284,3286,3288,3291,3293,3295,3297,3299,3301],{"class":782,"line":783},[780,3285,787],{"class":786},[780,3287,791],{"class":790},[780,3289,3290],{"class":794}," useWillChangeUtility",[780,3292,798],{"class":790},[780,3294,801],{"class":786},[780,3296,804],{"class":790},[780,3298,833],{"class":807},[780,3300,811],{"class":790},[780,3302,814],{"class":790},[780,3304,3305],{"class":782,"line":817},[780,3306,843],{"emptyLinePlaceholder":223},[780,3308,3309,3311,3313,3315],{"class":782,"line":840},[780,3310,3273],{"class":859},[780,3312,877],{"class":794},[780,3314,880],{"class":790},[780,3316,883],{"class":790},[780,3318,3319,3321,3323,3325,3327,3329],{"class":782,"line":846},[780,3320,890],{"class":889},[780,3322,893],{"class":790},[780,3324,896],{"class":790},[780,3326,899],{"class":807},[780,3328,902],{"class":790},[780,3330,905],{"class":790},[780,3332,3333,3336,3338,3340,3343,3345],{"class":782,"line":867},[780,3334,3335],{"class":889},"    scroll",[780,3337,893],{"class":790},[780,3339,896],{"class":790},[780,3341,3342],{"class":807},"scroll-position",[780,3344,902],{"class":790},[780,3346,905],{"class":790},[780,3348,3349,3352,3354,3356,3359,3361],{"class":782,"line":872},[780,3350,3351],{"class":889},"    contents",[780,3353,893],{"class":790},[780,3355,896],{"class":790},[780,3357,3358],{"class":807},"contents",[780,3360,902],{"class":790},[780,3362,905],{"class":790},[780,3364,3365,3368,3370,3372,3375,3377],{"class":782,"line":886},[780,3366,3367],{"class":889},"    transform",[780,3369,893],{"class":790},[780,3371,896],{"class":790},[780,3373,3374],{"class":807},"transform",[780,3376,902],{"class":790},[780,3378,905],{"class":790},[780,3380,3381,3383,3385],{"class":782,"line":908},[780,3382,1125],{"class":790},[780,3384,1128],{"class":794},[780,3386,814],{"class":790},[707,3388,3390],{"id":3389},"examples","Examples",[2890,3392,3394],{"id":3393},"disabled-button-state","Disabled Button State",[763,3396,3397,3660],{},[766,3398,3399],{"icon":768,"label":290},[770,3400,3402],{"className":772,"code":3401,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { useCursorUtility, usePointerEventsUtility, useUserSelectUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\nconst { modifier } = s;\n\nconst disabled = modifier('disabled', ({ declarations }) => ({\n    '&:disabled': declarations,\n}));\n\nuseCursorUtility(s, { 'not-allowed': 'not-allowed' }, [disabled]);\nusePointerEventsUtility(s, { none: 'none' }, [disabled]);\nuseUserSelectUtility(s, { none: 'none' });\n\nexport default s;\n",[702,3403,3404,3424,3452,3456,3470,3488,3492,3534,3549,3558,3562,3594,3620,3646,3650],{"__ignoreMap":776},[780,3405,3406,3408,3410,3412,3414,3416,3418,3420,3422],{"class":782,"line":783},[780,3407,787],{"class":786},[780,3409,791],{"class":790},[780,3411,795],{"class":794},[780,3413,798],{"class":790},[780,3415,801],{"class":786},[780,3417,804],{"class":790},[780,3419,808],{"class":807},[780,3421,811],{"class":790},[780,3423,814],{"class":790},[780,3425,3426,3428,3430,3432,3434,3436,3438,3440,3442,3444,3446,3448,3450],{"class":782,"line":817},[780,3427,787],{"class":786},[780,3429,791],{"class":790},[780,3431,824],{"class":794},[780,3433,880],{"class":790},[780,3435,1613],{"class":794},[780,3437,880],{"class":790},[780,3439,1870],{"class":794},[780,3441,798],{"class":790},[780,3443,801],{"class":786},[780,3445,804],{"class":790},[780,3447,833],{"class":807},[780,3449,811],{"class":790},[780,3451,814],{"class":790},[780,3453,3454],{"class":782,"line":840},[780,3455,843],{"emptyLinePlaceholder":223},[780,3457,3458,3460,3462,3464,3466,3468],{"class":782,"line":846},[780,3459,850],{"class":849},[780,3461,853],{"class":794},[780,3463,856],{"class":790},[780,3465,795],{"class":859},[780,3467,862],{"class":794},[780,3469,814],{"class":790},[780,3471,3472,3474,3476,3479,3481,3484,3486],{"class":782,"line":867},[780,3473,850],{"class":849},[780,3475,791],{"class":790},[780,3477,3478],{"class":794}," modifier ",[780,3480,1125],{"class":790},[780,3482,3483],{"class":790}," =",[780,3485,1147],{"class":794},[780,3487,814],{"class":790},[780,3489,3490],{"class":782,"line":872},[780,3491,843],{"emptyLinePlaceholder":223},[780,3493,3494,3496,3499,3501,3504,3507,3509,3512,3514,3516,3519,3523,3526,3529,3531],{"class":782,"line":886},[780,3495,850],{"class":849},[780,3497,3498],{"class":794}," disabled ",[780,3500,856],{"class":790},[780,3502,3503],{"class":859}," modifier",[780,3505,3506],{"class":794},"(",[780,3508,902],{"class":790},[780,3510,3511],{"class":807},"disabled",[780,3513,902],{"class":790},[780,3515,880],{"class":790},[780,3517,3518],{"class":790}," ({",[780,3520,3522],{"class":3521},"sHdIc"," declarations",[780,3524,3525],{"class":790}," })",[780,3527,3528],{"class":849}," =>",[780,3530,700],{"class":794},[780,3532,3533],{"class":790},"{\n",[780,3535,3536,3538,3541,3543,3545,3547],{"class":782,"line":908},[780,3537,1013],{"class":790},[780,3539,3540],{"class":889},"&:disabled",[780,3542,902],{"class":790},[780,3544,893],{"class":790},[780,3546,3522],{"class":794},[780,3548,905],{"class":790},[780,3550,3551,3553,3556],{"class":782,"line":925},[780,3552,1125],{"class":790},[780,3554,3555],{"class":794},"))",[780,3557,814],{"class":790},[780,3559,3560],{"class":782,"line":942},[780,3561,843],{"emptyLinePlaceholder":223},[780,3563,3564,3566,3568,3570,3572,3574,3576,3578,3580,3582,3584,3586,3589,3592],{"class":782,"line":959},[780,3565,754],{"class":859},[780,3567,877],{"class":794},[780,3569,880],{"class":790},[780,3571,791],{"class":790},[780,3573,896],{"class":790},[780,3575,1016],{"class":889},[780,3577,902],{"class":790},[780,3579,893],{"class":790},[780,3581,896],{"class":790},[780,3583,1016],{"class":807},[780,3585,902],{"class":790},[780,3587,3588],{"class":790}," },",[780,3590,3591],{"class":794}," [disabled])",[780,3593,814],{"class":790},[780,3595,3596,3598,3600,3602,3604,3606,3608,3610,3612,3614,3616,3618],{"class":782,"line":976},[780,3597,1572],{"class":859},[780,3599,877],{"class":794},[780,3601,880],{"class":790},[780,3603,791],{"class":790},[780,3605,1369],{"class":889},[780,3607,893],{"class":790},[780,3609,896],{"class":790},[780,3611,1041],{"class":807},[780,3613,902],{"class":790},[780,3615,3588],{"class":790},[780,3617,3591],{"class":794},[780,3619,814],{"class":790},[780,3621,3622,3624,3626,3628,3630,3632,3634,3636,3638,3640,3642,3644],{"class":782,"line":993},[780,3623,1829],{"class":859},[780,3625,877],{"class":794},[780,3627,880],{"class":790},[780,3629,791],{"class":790},[780,3631,1369],{"class":889},[780,3633,893],{"class":790},[780,3635,896],{"class":790},[780,3637,1041],{"class":807},[780,3639,902],{"class":790},[780,3641,798],{"class":790},[780,3643,1128],{"class":794},[780,3645,814],{"class":790},[780,3647,3648],{"class":782,"line":1010},[780,3649,843],{"emptyLinePlaceholder":223},[780,3651,3652,3654,3656,3658],{"class":782,"line":1031},[780,3653,1141],{"class":786},[780,3655,1144],{"class":786},[780,3657,1147],{"class":794},[780,3659,814],{"class":790},[766,3661,3662],{"icon":154,"label":326},[770,3663,3665],{"className":1154,"code":3664,"filename":1156,"language":1157,"meta":776,"style":776},"._disabled\\:cursor\\:not-allowed:disabled { cursor: not-allowed; }\n._disabled\\:pointer-events\\:none:disabled { pointer-events: none; }\n._user-select\\:none { user-select: none; }\n",[702,3666,3667,3699,3730],{"__ignoreMap":776},[780,3668,3669,3671,3674,3676,3679,3681,3683,3685,3687,3689,3691,3693,3695,3697],{"class":782,"line":783},[780,3670,1164],{"class":790},[780,3672,3673],{"class":1167},"_disabled",[780,3675,1171],{"class":794},[780,3677,3678],{"class":1167},"cursor",[780,3680,1171],{"class":794},[780,3682,1016],{"class":1167},[780,3684,893],{"class":790},[780,3686,3511],{"class":849},[780,3688,791],{"class":790},[780,3690,1179],{"class":1178},[780,3692,893],{"class":790},[780,3694,1346],{"class":794},[780,3696,1187],{"class":790},[780,3698,1190],{"class":790},[780,3700,3701,3703,3705,3707,3710,3712,3714,3716,3718,3720,3722,3724,3726,3728],{"class":782,"line":817},[780,3702,1164],{"class":790},[780,3704,3673],{"class":1167},[780,3706,1171],{"class":794},[780,3708,3709],{"class":1167},"pointer-events",[780,3711,1171],{"class":794},[780,3713,1041],{"class":1167},[780,3715,893],{"class":790},[780,3717,3511],{"class":849},[780,3719,791],{"class":790},[780,3721,1730],{"class":1178},[780,3723,893],{"class":790},[780,3725,1369],{"class":794},[780,3727,1187],{"class":790},[780,3729,1190],{"class":790},[780,3731,3732,3734,3736,3738,3740,3742,3744,3746,3748,3750],{"class":782,"line":840},[780,3733,1164],{"class":790},[780,3735,2008],{"class":1167},[780,3737,1171],{"class":794},[780,3739,1041],{"class":1167},[780,3741,791],{"class":790},[780,3743,2017],{"class":1178},[780,3745,893],{"class":790},[780,3747,1369],{"class":794},[780,3749,1187],{"class":790},[780,3751,1190],{"class":790},[2890,3753,3755],{"id":3754},"smooth-scroll-navigation","Smooth Scroll Navigation",[763,3757,3758,3933],{},[766,3759,3760],{"icon":768,"label":290},[770,3761,3763],{"className":772,"code":3762,"filename":774,"language":775,"meta":776,"style":776},"import { styleframe } from \"styleframe\";\nimport { useScrollBehaviorUtility } from \"@styleframe\u002Ftheme\";\n\nconst s = styleframe();\nconst { selector } = s;\n\nuseScrollBehaviorUtility(s, { smooth: 'smooth' });\n\n\u002F\u002F Apply to html element for page-wide smooth scrolling\nselector('html', {\n    scrollBehavior: 'smooth',\n});\n\nexport default s;\n",[702,3764,3765,3785,3805,3809,3823,3840,3844,3870,3874,3879,3896,3911,3919,3923],{"__ignoreMap":776},[780,3766,3767,3769,3771,3773,3775,3777,3779,3781,3783],{"class":782,"line":783},[780,3768,787],{"class":786},[780,3770,791],{"class":790},[780,3772,795],{"class":794},[780,3774,798],{"class":790},[780,3776,801],{"class":786},[780,3778,804],{"class":790},[780,3780,808],{"class":807},[780,3782,811],{"class":790},[780,3784,814],{"class":790},[780,3786,3787,3789,3791,3793,3795,3797,3799,3801,3803],{"class":782,"line":817},[780,3788,787],{"class":786},[780,3790,791],{"class":790},[780,3792,2202],{"class":794},[780,3794,798],{"class":790},[780,3796,801],{"class":786},[780,3798,804],{"class":790},[780,3800,833],{"class":807},[780,3802,811],{"class":790},[780,3804,814],{"class":790},[780,3806,3807],{"class":782,"line":840},[780,3808,843],{"emptyLinePlaceholder":223},[780,3810,3811,3813,3815,3817,3819,3821],{"class":782,"line":846},[780,3812,850],{"class":849},[780,3814,853],{"class":794},[780,3816,856],{"class":790},[780,3818,795],{"class":859},[780,3820,862],{"class":794},[780,3822,814],{"class":790},[780,3824,3825,3827,3829,3832,3834,3836,3838],{"class":782,"line":867},[780,3826,850],{"class":849},[780,3828,791],{"class":790},[780,3830,3831],{"class":794}," selector ",[780,3833,1125],{"class":790},[780,3835,3483],{"class":790},[780,3837,1147],{"class":794},[780,3839,814],{"class":790},[780,3841,3842],{"class":782,"line":872},[780,3843,843],{"emptyLinePlaceholder":223},[780,3845,3846,3848,3850,3852,3854,3856,3858,3860,3862,3864,3866,3868],{"class":782,"line":886},[780,3847,2161],{"class":859},[780,3849,877],{"class":794},[780,3851,880],{"class":790},[780,3853,791],{"class":790},[780,3855,2348],{"class":889},[780,3857,893],{"class":790},[780,3859,896],{"class":790},[780,3861,2272],{"class":807},[780,3863,902],{"class":790},[780,3865,798],{"class":790},[780,3867,1128],{"class":794},[780,3869,814],{"class":790},[780,3871,3872],{"class":782,"line":908},[780,3873,843],{"emptyLinePlaceholder":223},[780,3875,3876],{"class":782,"line":925},[780,3877,3878],{"class":2820},"\u002F\u002F Apply to html element for page-wide smooth scrolling\n",[780,3880,3881,3884,3886,3888,3890,3892,3894],{"class":782,"line":942},[780,3882,3883],{"class":859},"selector",[780,3885,3506],{"class":794},[780,3887,902],{"class":790},[780,3889,1473],{"class":807},[780,3891,902],{"class":790},[780,3893,880],{"class":790},[780,3895,883],{"class":790},[780,3897,3898,3901,3903,3905,3907,3909],{"class":782,"line":959},[780,3899,3900],{"class":889},"    scrollBehavior",[780,3902,893],{"class":790},[780,3904,896],{"class":790},[780,3906,2272],{"class":807},[780,3908,902],{"class":790},[780,3910,905],{"class":790},[780,3912,3913,3915,3917],{"class":782,"line":976},[780,3914,1125],{"class":790},[780,3916,1128],{"class":794},[780,3918,814],{"class":790},[780,3920,3921],{"class":782,"line":993},[780,3922,843],{"emptyLinePlaceholder":223},[780,3924,3925,3927,3929,3931],{"class":782,"line":1010},[780,3926,1141],{"class":786},[780,3928,1144],{"class":786},[780,3930,1147],{"class":794},[780,3932,814],{"class":790},[766,3934,3935],{"icon":154,"label":326},[770,3936,3938],{"className":1154,"code":3937,"filename":1156,"language":1157,"meta":776,"style":776},"._scroll-behavior\\:smooth { scroll-behavior: smooth; }\n\nhtml {\n    scroll-behavior: smooth;\n}\n",[702,3939,3940,3962,3966,3972,3983],{"__ignoreMap":776},[780,3941,3942,3944,3946,3948,3950,3952,3954,3956,3958,3960],{"class":782,"line":783},[780,3943,1164],{"class":790},[780,3945,2312],{"class":1167},[780,3947,1171],{"class":794},[780,3949,2272],{"class":1167},[780,3951,791],{"class":790},[780,3953,2321],{"class":1178},[780,3955,893],{"class":790},[780,3957,2348],{"class":794},[780,3959,1187],{"class":790},[780,3961,1190],{"class":790},[780,3963,3964],{"class":782,"line":817},[780,3965,843],{"emptyLinePlaceholder":223},[780,3967,3968,3970],{"class":782,"line":840},[780,3969,1473],{"class":1167},[780,3971,883],{"class":790},[780,3973,3974,3977,3979,3981],{"class":782,"line":846},[780,3975,3976],{"class":1178},"    scroll-behavior",[780,3978,893],{"class":790},[780,3980,2348],{"class":794},[780,3982,814],{"class":790},[780,3984,3985],{"class":782,"line":867},[780,3986,3987],{"class":790},"}\n",[707,3989,3991],{"id":3990},"best-practices","Best Practices",[722,3993,3994,4000,4006,4012,4018],{},[725,3995,3996,3999],{},[692,3997,3998],{},"Use semantic cursors",": Match cursor to the action (pointer for clickable, grab for draggable)",[725,4001,4002,4005],{},[692,4003,4004],{},"Respect user preferences",": Some users prefer reduced motion; use smooth scroll thoughtfully",[725,4007,4008,4011],{},[692,4009,4010],{},"Don't disable user select universally",": Only prevent selection where it makes sense (buttons, drag handles)",[725,4013,4014,4017],{},[692,4015,4016],{},"Test touch interactions",": Touch actions affect mobile usability significantly",[725,4019,4020,4023],{},[692,4021,4022],{},"Use will-change sparingly",": It consumes memory; only use when you know changes will happen",[707,4025,4027],{"id":4026},"faq","FAQ",[4029,4030,4031,4037,4041,4045],"accordion",{},[4032,4033,4036],"accordion-item",{"icon":4034,"label":4035},"i-lucide-circle-help","When should I use pointer-events: none?","Use it for overlay elements that shouldn't block clicks (like decorative elements), elements that should be visually present but not interactive, or elements during loading\u002Fdisabled states.",[4032,4038,4040],{"icon":4034,"label":4039},"What does touch-action: manipulation do?","It enables panning and zooming but disables other non-standard gestures like double-tap zoom. This is useful for buttons and interactive elements where you want to avoid the 300ms click delay on mobile.",[4032,4042,4044],{"icon":4034,"label":4043},"Should I use user-select: none on buttons?","Generally yes, preventing text selection on buttons improves the interaction feel. Users don't expect to select button text. However, ensure this doesn't interfere with accessibility.",[4032,4046,4048,4049,4052,4053,4056,4057,4060,4061,4064],{"icon":4034,"label":4047},"Does scroll-behavior affect JavaScript scrolling?","Yes, ",[702,4050,4051],{},"scroll-behavior: smooth"," affects both anchor link navigation and JavaScript methods like ",[702,4054,4055],{},"scrollIntoView()"," and ",[702,4058,4059],{},"window.scrollTo()",". Use ",[702,4062,4063],{},"{ behavior: 'instant' }"," in JavaScript if you need to override it.",[4066,4067,4068],"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 .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}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}",{"title":776,"searchDepth":817,"depth":817,"links":4070},[4071,4072,4073,4074,4075,4076,4077,4078,4085,4089,4090],{"id":709,"depth":817,"text":78},{"id":716,"depth":817,"text":717},{"id":751,"depth":817,"text":754},{"id":1569,"depth":817,"text":1572},{"id":1826,"depth":817,"text":1829},{"id":2158,"depth":817,"text":2161},{"id":2409,"depth":817,"text":2412},{"id":2887,"depth":817,"text":2888,"children":4079},[4080,4081,4082,4083,4084],{"id":2892,"depth":840,"text":2895},{"id":2979,"depth":840,"text":2982},{"id":3066,"depth":840,"text":3069},{"id":3185,"depth":840,"text":3188},{"id":3270,"depth":840,"text":3273},{"id":3389,"depth":817,"text":3390,"children":4086},[4087,4088],{"id":3393,"depth":840,"text":3394},{"id":3754,"depth":840,"text":3755},{"id":3990,"depth":817,"text":3991},{"id":4026,"depth":817,"text":4027},"Create interactivity utilities for cursor styles, pointer events, user selection, and scroll behavior with full type safety.","md",null,{},{"title":599,"icon":343},{"title":684,"description":4091},"RPP7sBFSucEycGuNA2ZFdxCwwFT3uNjE78DkrVr36fI",[4099,4101],{"title":594,"path":595,"stem":596,"description":4100,"icon":597,"children":-1},"Create flexbox and grid layout utilities for building responsive layouts with full type safety.",{"title":519,"path":603,"stem":604,"description":4102,"icon":520,"children":-1},"Create layout utilities for display, position, overflow, visibility, and more with full type safety.",1781596352335]