[{"data":1,"prerenderedAt":2898},["ShallowReactive",2],{"navigation":3,"\u002Fgetting-started\u002Finstallation":460,"\u002Fgetting-started\u002Finstallation-surround":2893},[4,34,51,301,327,332,337,406],{"title":5,"path":6,"stem":7,"children":8,"package":11,"icon":33},"Getting Started","\u002Fgetting-started","1.getting-started\u002F1.index",[9,13,18,23,28],{"title":10,"path":6,"stem":7,"package":11,"icon":12},"Introduction",null,"i-lucide-house",{"title":14,"path":15,"stem":16,"package":11,"icon":17},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":19,"path":20,"stem":21,"package":11,"icon":22},"Icons","\u002Fgetting-started\u002Ficons","1.getting-started\u002F3.icons","i-lucide-sparkles",{"title":24,"path":25,"stem":26,"package":11,"icon":27},"CLI","\u002Fgetting-started\u002Fcli","1.getting-started\u002F4.cli","i-lucide-terminal",{"title":29,"path":30,"stem":31,"package":11,"icon":32},"Roadmap","\u002Fgetting-started\u002Froadmap","1.getting-started\u002F5.roadmap","i-lucide-map","i-lucide-rocket",{"title":35,"package":11,"icon":36,"path":37,"stem":38,"children":39,"page":50},"Packages","i-lucide-package","\u002Fpackages","2.packages",[40,45],{"title":41,"path":42,"stem":43,"package":11,"icon":44},"@vyui\u002Fcore","\u002Fpackages\u002Fcore","2.packages\u002F1.core","i-lucide-box",{"title":46,"path":47,"stem":48,"package":11,"icon":49},"@vyui\u002Fkit","\u002Fpackages\u002Fkit","2.packages\u002F2.kit","i-lucide-layers",false,{"title":52,"package":11,"icon":53,"path":54,"stem":55,"children":56},"Components","i-lucide-layout-grid","\u002Fcomponents","3.components",[57,59,65,70,75,80,85,90,95,100,105,110,115,120,125,130,135,140,144,149,153,158,163,168,173,178,183,188,193,198,203,208,213,218,223,228,233,238,242,246,251,256,261,266,271,276,280,284,288,292,296],{"title":52,"path":54,"stem":58,"package":11,"icon":53},"3.components\u002Findex",{"title":60,"path":61,"stem":62,"package":63,"icon":64},"Accordion","\u002Fcomponents\u002Faccordion","3.components\u002Faccordion","kit","i-lucide-list-collapse",{"title":66,"path":67,"stem":68,"package":63,"icon":69},"Action Sheet","\u002Fcomponents\u002Faction-sheet","3.components\u002Faction-sheet","i-lucide-panel-bottom",{"title":71,"path":72,"stem":73,"package":63,"icon":74},"Alert","\u002Fcomponents\u002Falert","3.components\u002Falert","i-lucide-triangle-alert",{"title":76,"path":77,"stem":78,"package":79,"icon":74},"Alert Dialog","\u002Fcomponents\u002Falert-dialog","3.components\u002Falert-dialog","core",{"title":81,"path":82,"stem":83,"package":63,"icon":84},"App","\u002Fcomponents\u002Fapp","3.components\u002Fapp","i-lucide-smartphone",{"title":86,"path":87,"stem":88,"package":63,"icon":89},"Aspect Ratio","\u002Fcomponents\u002Faspect-ratio","3.components\u002Faspect-ratio","i-lucide-ratio",{"title":91,"path":92,"stem":93,"package":63,"icon":94},"Avatar","\u002Fcomponents\u002Favatar","3.components\u002Favatar","i-lucide-circle-user-round",{"title":96,"path":97,"stem":98,"package":63,"icon":99},"Avatar Group","\u002Fcomponents\u002Favatar-group","3.components\u002Favatar-group","i-lucide-users-round",{"title":101,"path":102,"stem":103,"package":63,"icon":104},"Button","\u002Fcomponents\u002Fbutton","3.components\u002Fbutton","i-lucide-square-mouse-pointer",{"title":106,"path":107,"stem":108,"package":63,"icon":109},"Calendar","\u002Fcomponents\u002Fcalendar","3.components\u002Fcalendar","i-lucide-calendar-days",{"title":111,"path":112,"stem":113,"package":63,"icon":114},"Card","\u002Fcomponents\u002Fcard","3.components\u002Fcard","i-lucide-square",{"title":116,"path":117,"stem":118,"package":63,"icon":119},"Checkbox","\u002Fcomponents\u002Fcheckbox","3.components\u002Fcheckbox","i-lucide-square-check",{"title":121,"path":122,"stem":123,"package":79,"icon":124},"Collapsible","\u002Fcomponents\u002Fcollapsible","3.components\u002Fcollapsible","i-lucide-chevrons-down-up",{"title":126,"path":127,"stem":128,"package":79,"icon":129},"Dialog","\u002Fcomponents\u002Fdialog","3.components\u002Fdialog","i-lucide-app-window",{"title":131,"path":132,"stem":133,"package":79,"icon":134},"Draggable","\u002Fcomponents\u002Fdraggable","3.components\u002Fdraggable","i-lucide-move",{"title":136,"path":137,"stem":138,"package":63,"icon":139},"Form","\u002Fcomponents\u002Fform","3.components\u002Fform","i-lucide-clipboard-list",{"title":141,"path":142,"stem":143,"package":79,"icon":22},"Icon","\u002Fcomponents\u002Ficon","3.components\u002Ficon",{"title":145,"path":146,"stem":147,"package":63,"icon":148},"Input","\u002Fcomponents\u002Finput","3.components\u002Finput","i-lucide-text-cursor-input",{"title":150,"path":151,"stem":152,"package":63,"icon":69},"Island","\u002Fcomponents\u002Fisland","3.components\u002Fisland",{"title":154,"path":155,"stem":156,"package":63,"icon":157},"Island Button","\u002Fcomponents\u002Fisland-button","3.components\u002Fisland-button","i-lucide-circle-ellipsis",{"title":159,"path":160,"stem":161,"package":63,"icon":162},"Island Group","\u002Fcomponents\u002Fisland-group","3.components\u002Fisland-group","i-lucide-panels-top-left",{"title":164,"path":165,"stem":166,"package":63,"icon":167},"KeyboardAware","\u002Fcomponents\u002Fkeyboard-aware","3.components\u002Fkeyboard-aware","i-lucide-keyboard",{"title":169,"path":170,"stem":171,"package":63,"icon":172},"Label","\u002Fcomponents\u002Flabel","3.components\u002Flabel","i-lucide-tag",{"title":174,"path":175,"stem":176,"package":63,"icon":177},"Modal","\u002Fcomponents\u002Fmodal","3.components\u002Fmodal","i-lucide-gallery-vertical-end",{"title":179,"path":180,"stem":181,"package":79,"icon":182},"Navigation","\u002Fcomponents\u002Fnavigation","3.components\u002Fnavigation","i-lucide-route",{"title":184,"path":185,"stem":186,"package":63,"icon":187},"Number Field","\u002Fcomponents\u002Fnumber-field","3.components\u002Fnumber-field","i-lucide-list-plus",{"title":189,"path":190,"stem":191,"package":79,"icon":192},"Pagination","\u002Fcomponents\u002Fpagination","3.components\u002Fpagination","i-lucide-ellipsis",{"title":194,"path":195,"stem":196,"package":63,"icon":197},"Pin Input","\u002Fcomponents\u002Fpin-input","3.components\u002Fpin-input","i-lucide-key-round",{"title":199,"path":200,"stem":201,"package":63,"icon":202},"Placeholder","\u002Fcomponents\u002Fplaceholder","3.components\u002Fplaceholder","i-lucide-square-dashed",{"title":204,"path":205,"stem":206,"package":63,"icon":207},"Popover","\u002Fcomponents\u002Fpopover","3.components\u002Fpopover","i-lucide-message-square-more",{"title":209,"path":210,"stem":211,"package":63,"icon":212},"Progress","\u002Fcomponents\u002Fprogress","3.components\u002Fprogress","i-lucide-chart-no-axes-column-increasing",{"title":214,"path":215,"stem":216,"package":63,"icon":217},"Radio Group","\u002Fcomponents\u002Fradio-group","3.components\u002Fradio-group","i-lucide-circle-dot",{"title":219,"path":220,"stem":221,"package":63,"icon":222},"Rating","\u002Fcomponents\u002Frating","3.components\u002Frating","i-lucide-star",{"title":224,"path":225,"stem":226,"package":79,"icon":227},"Scroll View","\u002Fcomponents\u002Fscroll-view","3.components\u002Fscroll-view","i-lucide-scroll",{"title":229,"path":230,"stem":231,"package":63,"icon":232},"Select","\u002Fcomponents\u002Fselect","3.components\u002Fselect","i-lucide-list-check",{"title":234,"path":235,"stem":236,"package":63,"icon":237},"Separator","\u002Fcomponents\u002Fseparator","3.components\u002Fseparator","i-lucide-separator-horizontal",{"title":239,"path":240,"stem":241,"package":79,"icon":69},"Sheet","\u002Fcomponents\u002Fsheet","3.components\u002Fsheet",{"title":243,"path":244,"stem":245,"package":63,"icon":162},"Skeleton","\u002Fcomponents\u002Fskeleton","3.components\u002Fskeleton",{"title":247,"path":248,"stem":249,"package":63,"icon":250},"Slider","\u002Fcomponents\u002Fslider","3.components\u002Fslider","i-lucide-sliders-horizontal",{"title":252,"path":253,"stem":254,"package":63,"icon":255},"Sortable","\u002Fcomponents\u002Fsortable","3.components\u002Fsortable","i-lucide-list-restart",{"title":257,"path":258,"stem":259,"package":63,"icon":260},"Stepper","\u002Fcomponents\u002Fstepper","3.components\u002Fstepper","i-lucide-list-ordered",{"title":262,"path":263,"stem":264,"package":63,"icon":265},"Swipe Action","\u002Fcomponents\u002Fswipe-action","3.components\u002Fswipe-action","i-lucide-move-horizontal",{"title":267,"path":268,"stem":269,"package":63,"icon":270},"Swiper","\u002Fcomponents\u002Fswiper","3.components\u002Fswiper","i-lucide-gallery-horizontal-end",{"title":272,"path":273,"stem":274,"package":63,"icon":275},"Switch","\u002Fcomponents\u002Fswitch","3.components\u002Fswitch","i-lucide-toggle-right",{"title":277,"path":278,"stem":279,"package":63,"icon":162},"Tabs","\u002Fcomponents\u002Ftabs","3.components\u002Ftabs",{"title":281,"path":282,"stem":283,"package":63,"icon":148},"Textarea","\u002Fcomponents\u002Ftextarea","3.components\u002Ftextarea",{"title":285,"path":286,"stem":287,"package":63,"icon":207},"Toast","\u002Fcomponents\u002Ftoast","3.components\u002Ftoast",{"title":289,"path":290,"stem":291,"package":63,"icon":275},"Toggle","\u002Fcomponents\u002Ftoggle","3.components\u002Ftoggle",{"title":293,"path":294,"stem":295,"package":63,"icon":162},"Toggle Group","\u002Fcomponents\u002Ftoggle-group","3.components\u002Ftoggle-group",{"title":297,"path":298,"stem":299,"package":63,"icon":300},"Tray","\u002Fcomponents\u002Ftray","3.components\u002Ftray","i-lucide-square-dashed-bottom",{"title":302,"path":303,"stem":304,"children":305,"package":11,"icon":307},"Theming","\u002Ftheming","4.theming\u002F1.index",[306,308,312,317,322],{"title":302,"path":303,"stem":304,"package":11,"icon":307},"i-lucide-palette",{"title":309,"path":310,"stem":311,"package":11,"icon":250},"Overrides","\u002Ftheming\u002Foverrides","4.theming\u002F2.overrides",{"title":313,"path":314,"stem":315,"package":11,"icon":316},"Colors","\u002Ftheming\u002Fcolors","4.theming\u002F3.colors","i-lucide-swatch-book",{"title":318,"path":319,"stem":320,"package":11,"icon":321},"Dark Mode","\u002Ftheming\u002Fdark-mode","4.theming\u002F4.dark-mode","i-lucide-moon",{"title":323,"path":324,"stem":325,"package":11,"icon":326},"Fonts","\u002Ftheming\u002Ffonts","4.theming\u002F5.fonts","i-lucide-type",{"title":328,"path":329,"stem":330,"package":11,"icon":331},"Accessibility","\u002Faccessibility","5.accessibility","i-lucide-accessibility",{"title":333,"path":334,"stem":335,"package":11,"icon":336},"i18n","\u002Fi18n","6.i18n","i-lucide-languages",{"title":338,"path":339,"stem":340,"children":341,"package":11,"icon":343},"Composables","\u002Fcomposables","7.composables\u002F1.index",[342,344,349,354,359,364,369,374,378,383,387,391,396,401],{"title":338,"path":339,"stem":340,"package":11,"icon":343},"i-lucide-square-function",{"title":345,"path":346,"stem":347,"package":11,"icon":348},"useEmitAsProps","\u002Fcomposables\u002Fuse-emit-as-props","7.composables\u002F10.use-emit-as-props","i-lucide-zap",{"title":350,"path":351,"stem":352,"package":11,"icon":353},"useForwardPropsEmits","\u002Fcomposables\u002Fuse-forward-props-emits","7.composables\u002F11.use-forward-props-emits","i-lucide-merge",{"title":355,"path":356,"stem":357,"package":11,"icon":358},"useForwardExpose","\u002Fcomposables\u002Fuse-forward-expose","7.composables\u002F12.use-forward-expose","i-lucide-share-2",{"title":360,"path":361,"stem":362,"package":11,"icon":363},"useStateMachine","\u002Fcomposables\u002Fuse-state-machine","7.composables\u002F13.use-state-machine","i-lucide-workflow",{"title":365,"path":366,"stem":367,"package":11,"icon":368},"usePrimitiveElement","\u002Fcomposables\u002Fuse-primitive-element","7.composables\u002F14.use-primitive-element","i-lucide-crosshair",{"title":370,"path":371,"stem":372,"package":11,"icon":373},"useAppConfig","\u002Fcomposables\u002Fuse-app-config","7.composables\u002F2.use-app-config","i-lucide-settings",{"title":375,"path":376,"stem":377,"package":11,"icon":321},"useColorMode","\u002Fcomposables\u002Fuse-color-mode","7.composables\u002F3.use-color-mode",{"title":379,"path":380,"stem":381,"package":11,"icon":382},"useComponentIcons","\u002Fcomposables\u002Fuse-component-icons","7.composables\u002F4.use-component-icons","i-lucide-shapes",{"title":384,"path":385,"stem":386,"package":11,"icon":69},"useTray","\u002Fcomposables\u002Fuse-tray","7.composables\u002F5.use-tray",{"title":388,"path":389,"stem":390,"package":11,"icon":336},"i18n composables","\u002Fcomposables\u002Fi18n-composables","7.composables\u002F6.i18n-composables",{"title":392,"path":393,"stem":394,"package":11,"icon":395},"useId","\u002Fcomposables\u002Fuse-id","7.composables\u002F7.use-id","i-lucide-hash",{"title":397,"path":398,"stem":399,"package":11,"icon":400},"useFilter","\u002Fcomposables\u002Fuse-filter","7.composables\u002F8.use-filter","i-lucide-filter",{"title":402,"path":403,"stem":404,"package":11,"icon":405},"useForwardProps","\u002Fcomposables\u002Fuse-forward-props","7.composables\u002F9.use-forward-props","i-lucide-arrow-right-left",{"title":407,"path":408,"stem":409,"children":410,"package":11,"icon":412},"Guides","\u002Fguides","8.guides\u002F1.index",[411,413,417,422,427,432,437,441,446,450,455],{"title":407,"path":408,"stem":409,"package":11,"icon":412},"i-lucide-book-open",{"title":414,"path":415,"stem":416,"package":11,"icon":348},"Instant first-frame rendering","\u002Fguides\u002Finstant-first-frame-rendering","8.guides\u002F10.instant-first-frame-rendering",{"title":418,"path":419,"stem":420,"package":11,"icon":421},"Why use Vy UI","\u002Fguides\u002Fwhy-vy-ui","8.guides\u002F11.why-vy-ui","i-lucide-help-circle",{"title":423,"path":424,"stem":425,"package":11,"icon":426},"Lynx UI frameworks","\u002Fguides\u002Flynx-ui-frameworks","8.guides\u002F2.lynx-ui-frameworks","i-lucide-library",{"title":428,"path":429,"stem":430,"package":11,"icon":431},"What is Vue Lynx","\u002Fguides\u002Fvue-lynx","8.guides\u002F3.vue-lynx","i-lucide-component",{"title":433,"path":434,"stem":435,"package":11,"icon":436},"Lynx vs React Native","\u002Fguides\u002Flynx-vs-react-native","8.guides\u002F4.lynx-vs-react-native","i-lucide-git-compare",{"title":438,"path":439,"stem":440,"package":11,"icon":84},"Testing on your phone","\u002Fguides\u002Ftesting-on-device","8.guides\u002F5.testing-on-device",{"title":442,"path":443,"stem":444,"package":11,"icon":445},"Testing with Xcode","\u002Fguides\u002Ftesting-with-xcode","8.guides\u002F6.testing-with-xcode","i-lucide-apple",{"title":447,"path":448,"stem":449,"package":11,"icon":27},"The rspeedy dev server","\u002Fguides\u002Frspeedy-dev-server","8.guides\u002F7.rspeedy-dev-server",{"title":451,"path":452,"stem":453,"package":11,"icon":454},"Tailwind on Lynx","\u002Fguides\u002Ftailwind-on-lynx","8.guides\u002F8.tailwind-on-lynx","i-lucide-wind",{"title":456,"path":457,"stem":458,"package":11,"icon":459},"Theming on Lynx","\u002Fguides\u002Ftheming-on-lynx","8.guides\u002F9.theming-on-lynx","i-lucide-paintbrush",{"id":461,"title":14,"body":462,"description":2887,"extension":2888,"links":11,"meta":2889,"navigation":2890,"package":11,"path":15,"seo":2891,"stem":16,"__hash__":2892},"docs\u002F1.getting-started\u002F2.installation.md",{"type":463,"value":464,"toc":2869},"minimark",[465,470,475,484,570,574,594,661,665,668,902,908,912,993,1008,1012,1033,1326,1330,1357,1406,1410,1435,1615,1618,1700,1710,1713,1736,1751,1799,1813,1851,1855,1863,1923,1939,1946,1967,2169,2242,2298,2302,2322,2425,2432,2605,2609,2612,2615,2628,2704,2707,2742,2748,2752,2757,2768,2776,2798,2807,2851,2865],[466,467,469],"h2",{"id":468},"setup","Setup",[471,472,474],"h3",{"id":473},"add-to-a-vue-lynx-project","Add to a Vue-Lynx project",[476,477,479,480,483],"h4",{"id":478},"install-the-vyuicore-package","Install the ",[481,482,41],"code",{}," package",[485,486,487,512,526,540,555],"code-group",{},[488,489,495],"pre",{"className":490,"code":491,"filename":492,"language":493,"meta":494,"style":494},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm add @vyui\u002Fcore\n","pnpm","bash","",[481,496,497],{"__ignoreMap":494},[498,499,502,505,509],"span",{"class":500,"line":501},"line",1,[498,503,492],{"class":504},"sBMFI",[498,506,508],{"class":507},"sfazB"," add",[498,510,511],{"class":507}," @vyui\u002Fcore\n",[488,513,516],{"className":490,"code":514,"filename":515,"language":493,"meta":494,"style":494},"yarn add @vyui\u002Fcore\n","yarn",[481,517,518],{"__ignoreMap":494},[498,519,520,522,524],{"class":500,"line":501},[498,521,515],{"class":504},[498,523,508],{"class":507},[498,525,511],{"class":507},[488,527,530],{"className":490,"code":528,"filename":529,"language":493,"meta":494,"style":494},"bun add @vyui\u002Fcore\n","bun",[481,531,532],{"__ignoreMap":494},[498,533,534,536,538],{"class":500,"line":501},[498,535,529],{"class":504},[498,537,508],{"class":507},[498,539,511],{"class":507},[488,541,544],{"className":490,"code":542,"filename":543,"language":493,"meta":494,"style":494},"deno add npm:@vyui\u002Fcore\n","deno",[481,545,546],{"__ignoreMap":494},[498,547,548,550,552],{"class":500,"line":501},[498,549,543],{"class":504},[498,551,508],{"class":507},[498,553,554],{"class":507}," npm:@vyui\u002Fcore\n",[488,556,559],{"className":490,"code":557,"filename":558,"language":493,"meta":494,"style":494},"npm install @vyui\u002Fcore\n","npm",[481,560,561],{"__ignoreMap":494},[498,562,563,565,568],{"class":500,"line":501},[498,564,558],{"class":504},[498,566,567],{"class":507}," install",[498,569,511],{"class":507},[476,571,573],{"id":572},"follow-vyui-worklets-in-the-lynx-build","Follow VyUI worklets in the Lynx build",[575,576,577,578,581,582,585,586,589,590,593],"p",{},"VyUI components register ",[481,579,580],{},"'main thread'"," worklets (gestures, drag, animation). vue-lynx's main-thread loader skips ",[481,583,584],{},"node_modules"," unless a package is allowlisted — without this, the first gesture throws ",[481,587,588],{},"TypeError: cannot read property 'bind' of undefined",". Requires ",[481,591,592],{},"vue-lynx@^0.4.2",".",[488,595,600],{"className":596,"code":597,"filename":598,"language":599,"meta":494,"style":494},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pluginVueLynx({\n  includeWorkletPackages: ['@vyui\u002Fcore', '@vyui\u002Fkit'],\n})\n","lynx.config.ts","ts",[481,601,602,616,652],{"__ignoreMap":494},[498,603,604,608,612],{"class":500,"line":501},[498,605,607],{"class":606},"s2Zo4","pluginVueLynx",[498,609,611],{"class":610},"sTEyZ","(",[498,613,615],{"class":614},"sMK4o","{\n",[498,617,619,623,626,629,632,634,636,639,642,644,646,649],{"class":500,"line":618},2,[498,620,622],{"class":621},"swJcz","  includeWorkletPackages",[498,624,625],{"class":614},":",[498,627,628],{"class":610}," [",[498,630,631],{"class":614},"'",[498,633,41],{"class":507},[498,635,631],{"class":614},[498,637,638],{"class":614},",",[498,640,641],{"class":614}," '",[498,643,46],{"class":507},[498,645,631],{"class":614},[498,647,648],{"class":610},"]",[498,650,651],{"class":614},",\n",[498,653,655,658],{"class":500,"line":654},3,[498,656,657],{"class":614},"}",[498,659,660],{"class":610},")\n",[476,662,664],{"id":663},"use-a-primitive","Use a primitive",[575,666,667],{},"Primitives are unstyled. Compose them with your own classes, tokens, or design system.",[488,669,674],{"className":670,"code":671,"filename":672,"language":673,"meta":494,"style":494},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup>\nimport { SliderRoot, SliderTrack, SliderRange, SliderThumb } from '@vyui\u002Fcore'\nimport { ref } from 'vue'\n\nconst value = ref(50)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CSliderRoot v-model=\"value\" :max=\"100\">\n    \u003CSliderTrack>\n      \u003CSliderRange \u002F>\n    \u003C\u002FSliderTrack>\n    \u003CSliderThumb \u002F>\n  \u003C\u002FSliderRoot>\n\u003C\u002Ftemplate>\n","App.vue","vue",[481,675,676,691,731,750,757,779,789,794,804,840,851,863,873,883,893],{"__ignoreMap":494},[498,677,678,681,684,688],{"class":500,"line":501},[498,679,680],{"class":614},"\u003C",[498,682,683],{"class":621},"script",[498,685,687],{"class":686},"spNyl"," setup",[498,689,690],{"class":614},">\n",[498,692,693,697,700,703,705,708,710,713,715,718,721,724,726,728],{"class":500,"line":618},[498,694,696],{"class":695},"s7zQu","import",[498,698,699],{"class":614}," {",[498,701,702],{"class":610}," SliderRoot",[498,704,638],{"class":614},[498,706,707],{"class":610}," SliderTrack",[498,709,638],{"class":614},[498,711,712],{"class":610}," SliderRange",[498,714,638],{"class":614},[498,716,717],{"class":610}," SliderThumb",[498,719,720],{"class":614}," }",[498,722,723],{"class":695}," from",[498,725,641],{"class":614},[498,727,41],{"class":507},[498,729,730],{"class":614},"'\n",[498,732,733,735,737,740,742,744,746,748],{"class":500,"line":654},[498,734,696],{"class":695},[498,736,699],{"class":614},[498,738,739],{"class":610}," ref",[498,741,720],{"class":614},[498,743,723],{"class":695},[498,745,641],{"class":614},[498,747,673],{"class":507},[498,749,730],{"class":614},[498,751,753],{"class":500,"line":752},4,[498,754,756],{"emptyLinePlaceholder":755},true,"\n",[498,758,760,763,766,769,771,773,777],{"class":500,"line":759},5,[498,761,762],{"class":686},"const",[498,764,765],{"class":610}," value ",[498,767,768],{"class":614},"=",[498,770,739],{"class":606},[498,772,611],{"class":610},[498,774,776],{"class":775},"sbssI","50",[498,778,660],{"class":610},[498,780,782,785,787],{"class":500,"line":781},6,[498,783,784],{"class":614},"\u003C\u002F",[498,786,683],{"class":621},[498,788,690],{"class":614},[498,790,792],{"class":500,"line":791},7,[498,793,756],{"emptyLinePlaceholder":755},[498,795,797,799,802],{"class":500,"line":796},8,[498,798,680],{"class":614},[498,800,801],{"class":621},"template",[498,803,690],{"class":614},[498,805,807,810,813,816,818,821,824,826,829,831,833,836,838],{"class":500,"line":806},9,[498,808,809],{"class":614},"  \u003C",[498,811,812],{"class":621},"SliderRoot",[498,814,815],{"class":686}," v-model",[498,817,768],{"class":614},[498,819,820],{"class":614},"\"",[498,822,823],{"class":507},"value",[498,825,820],{"class":614},[498,827,828],{"class":686}," :max",[498,830,768],{"class":614},[498,832,820],{"class":614},[498,834,835],{"class":507},"100",[498,837,820],{"class":614},[498,839,690],{"class":614},[498,841,843,846,849],{"class":500,"line":842},10,[498,844,845],{"class":614},"    \u003C",[498,847,848],{"class":621},"SliderTrack",[498,850,690],{"class":614},[498,852,854,857,860],{"class":500,"line":853},11,[498,855,856],{"class":614},"      \u003C",[498,858,859],{"class":621},"SliderRange",[498,861,862],{"class":614}," \u002F>\n",[498,864,866,869,871],{"class":500,"line":865},12,[498,867,868],{"class":614},"    \u003C\u002F",[498,870,848],{"class":621},[498,872,690],{"class":614},[498,874,876,878,881],{"class":500,"line":875},13,[498,877,845],{"class":614},[498,879,880],{"class":621},"SliderThumb",[498,882,862],{"class":614},[498,884,886,889,891],{"class":500,"line":885},14,[498,887,888],{"class":614},"  \u003C\u002F",[498,890,812],{"class":621},[498,892,690],{"class":614},[498,894,896,898,900],{"class":500,"line":895},15,[498,897,784],{"class":614},[498,899,801],{"class":621},[498,901,690],{"class":614},[471,903,905,906],{"id":904},"add-styled-components-with-vyuikit","Add styled components with ",[481,907,46],{},[476,909,911],{"id":910},"install-both-packages","Install both packages",[485,913,914,931,946,961,978],{},[488,915,917],{"className":490,"code":916,"filename":492,"language":493,"meta":494,"style":494},"pnpm add @vyui\u002Fcore @vyui\u002Fkit\n",[481,918,919],{"__ignoreMap":494},[498,920,921,923,925,928],{"class":500,"line":501},[498,922,492],{"class":504},[498,924,508],{"class":507},[498,926,927],{"class":507}," @vyui\u002Fcore",[498,929,930],{"class":507}," @vyui\u002Fkit\n",[488,932,934],{"className":490,"code":933,"filename":515,"language":493,"meta":494,"style":494},"yarn add @vyui\u002Fcore @vyui\u002Fkit\n",[481,935,936],{"__ignoreMap":494},[498,937,938,940,942,944],{"class":500,"line":501},[498,939,515],{"class":504},[498,941,508],{"class":507},[498,943,927],{"class":507},[498,945,930],{"class":507},[488,947,949],{"className":490,"code":948,"filename":529,"language":493,"meta":494,"style":494},"bun add @vyui\u002Fcore @vyui\u002Fkit\n",[481,950,951],{"__ignoreMap":494},[498,952,953,955,957,959],{"class":500,"line":501},[498,954,529],{"class":504},[498,956,508],{"class":507},[498,958,927],{"class":507},[498,960,930],{"class":507},[488,962,964],{"className":490,"code":963,"filename":543,"language":493,"meta":494,"style":494},"deno add npm:@vyui\u002Fcore npm:@vyui\u002Fkit\n",[481,965,966],{"__ignoreMap":494},[498,967,968,970,972,975],{"class":500,"line":501},[498,969,543],{"class":504},[498,971,508],{"class":507},[498,973,974],{"class":507}," npm:@vyui\u002Fcore",[498,976,977],{"class":507}," npm:@vyui\u002Fkit\n",[488,979,981],{"className":490,"code":980,"filename":558,"language":493,"meta":494,"style":494},"npm install @vyui\u002Fcore @vyui\u002Fkit\n",[481,982,983],{"__ignoreMap":494},[498,984,985,987,989,991],{"class":500,"line":501},[498,986,558],{"class":504},[498,988,567],{"class":507},[498,990,927],{"class":507},[498,992,930],{"class":507},[575,994,995,997,998,1000,1001,1004,1005,1007],{},[481,996,46],{}," depends on ",[481,999,41],{},", but it does not re-export the full core surface. Import styled ",[481,1002,1003],{},"Vy*"," components from kit, and import raw primitives or utilities directly from core unless the kit docs call out a specific ",[481,1006,1003],{}," convenience alias.",[476,1009,1011],{"id":1010},"configure-tailwind","Configure Tailwind",[575,1013,1014,1016,1017,1020,1021,1024,1025,1028,1029,593],{},[481,1015,46],{}," ships its styling as a Tailwind preset. Add it alongside the Lynx preset, and feed the kit ",[481,1018,1019],{},"ui-*"," state markers into the Lynx preset's ",[481,1022,1023],{},"uiVariants"," plugin — the class-based replacements for Lynx-incompatible ",[481,1026,1027],{},"data-[state]"," selectors. Without this step components render ",[1030,1031,1032],"strong",{},"unstyled",[488,1034,1037],{"className":596,"code":1035,"filename":1036,"language":599,"meta":494,"style":494},"import type { Config } from 'tailwindcss'\nimport { createLynxPreset } from '@lynx-js\u002Ftailwind-preset'\nimport { createVyuiPreset, VYUI_UI_STATES } from '@vyui\u002Fkit\u002Ftailwind'\n\nconst lynxPreset = createLynxPreset({\n  lynxUIPlugins: {\n    uiVariants: {\n      prefixes: defaults => ({ ...defaults, ui: [...defaults.ui, ...VYUI_UI_STATES] }),\n    },\n  },\n})\n\nexport default {\n  \u002F\u002F Scan the kit + core component sources so their utility classes aren't purged.\n  content: [\n    '.\u002Fsrc\u002F**\u002F*.{vue,js,ts}',\n    '.\u002Fnode_modules\u002F@vyui\u002Fkit\u002Fdist\u002F**\u002F*.js',\n    '.\u002Fnode_modules\u002F@vyui\u002Fcore\u002Fdist\u002F**\u002F*.js',\n  ],\n  presets: [lynxPreset, createVyuiPreset()],\n} satisfies Config\n","tailwind.config.ts",[481,1038,1039,1062,1082,1107,1111,1126,1136,1145,1204,1209,1214,1220,1224,1234,1240,1250,1263,1275,1287,1295,1315],{"__ignoreMap":494},[498,1040,1041,1043,1046,1048,1051,1053,1055,1057,1060],{"class":500,"line":501},[498,1042,696],{"class":695},[498,1044,1045],{"class":695}," type",[498,1047,699],{"class":614},[498,1049,1050],{"class":610}," Config",[498,1052,720],{"class":614},[498,1054,723],{"class":695},[498,1056,641],{"class":614},[498,1058,1059],{"class":507},"tailwindcss",[498,1061,730],{"class":614},[498,1063,1064,1066,1068,1071,1073,1075,1077,1080],{"class":500,"line":618},[498,1065,696],{"class":695},[498,1067,699],{"class":614},[498,1069,1070],{"class":610}," createLynxPreset",[498,1072,720],{"class":614},[498,1074,723],{"class":695},[498,1076,641],{"class":614},[498,1078,1079],{"class":507},"@lynx-js\u002Ftailwind-preset",[498,1081,730],{"class":614},[498,1083,1084,1086,1088,1091,1093,1096,1098,1100,1102,1105],{"class":500,"line":654},[498,1085,696],{"class":695},[498,1087,699],{"class":614},[498,1089,1090],{"class":610}," createVyuiPreset",[498,1092,638],{"class":614},[498,1094,1095],{"class":610}," VYUI_UI_STATES",[498,1097,720],{"class":614},[498,1099,723],{"class":695},[498,1101,641],{"class":614},[498,1103,1104],{"class":507},"@vyui\u002Fkit\u002Ftailwind",[498,1106,730],{"class":614},[498,1108,1109],{"class":500,"line":752},[498,1110,756],{"emptyLinePlaceholder":755},[498,1112,1113,1115,1118,1120,1122,1124],{"class":500,"line":759},[498,1114,762],{"class":686},[498,1116,1117],{"class":610}," lynxPreset ",[498,1119,768],{"class":614},[498,1121,1070],{"class":606},[498,1123,611],{"class":610},[498,1125,615],{"class":614},[498,1127,1128,1131,1133],{"class":500,"line":781},[498,1129,1130],{"class":621},"  lynxUIPlugins",[498,1132,625],{"class":614},[498,1134,1135],{"class":614}," {\n",[498,1137,1138,1141,1143],{"class":500,"line":791},[498,1139,1140],{"class":621},"    uiVariants",[498,1142,625],{"class":614},[498,1144,1135],{"class":614},[498,1146,1147,1150,1152,1156,1159,1162,1165,1168,1171,1173,1176,1178,1180,1183,1185,1187,1190,1192,1194,1197,1199,1202],{"class":500,"line":796},[498,1148,1149],{"class":606},"      prefixes",[498,1151,625],{"class":614},[498,1153,1155],{"class":1154},"sHdIc"," defaults",[498,1157,1158],{"class":686}," =>",[498,1160,1161],{"class":610}," (",[498,1163,1164],{"class":614},"{",[498,1166,1167],{"class":614}," ...",[498,1169,1170],{"class":610},"defaults",[498,1172,638],{"class":614},[498,1174,1175],{"class":621}," ui",[498,1177,625],{"class":614},[498,1179,628],{"class":610},[498,1181,1182],{"class":614},"...",[498,1184,1170],{"class":610},[498,1186,593],{"class":614},[498,1188,1189],{"class":610},"ui",[498,1191,638],{"class":614},[498,1193,1167],{"class":614},[498,1195,1196],{"class":610},"VYUI_UI_STATES] ",[498,1198,657],{"class":614},[498,1200,1201],{"class":610},")",[498,1203,651],{"class":614},[498,1205,1206],{"class":500,"line":806},[498,1207,1208],{"class":614},"    },\n",[498,1210,1211],{"class":500,"line":842},[498,1212,1213],{"class":614},"  },\n",[498,1215,1216,1218],{"class":500,"line":853},[498,1217,657],{"class":614},[498,1219,660],{"class":610},[498,1221,1222],{"class":500,"line":865},[498,1223,756],{"emptyLinePlaceholder":755},[498,1225,1226,1229,1232],{"class":500,"line":875},[498,1227,1228],{"class":695},"export",[498,1230,1231],{"class":695}," default",[498,1233,1135],{"class":614},[498,1235,1236],{"class":500,"line":885},[498,1237,1239],{"class":1238},"sHwdD","  \u002F\u002F Scan the kit + core component sources so their utility classes aren't purged.\n",[498,1241,1242,1245,1247],{"class":500,"line":895},[498,1243,1244],{"class":621},"  content",[498,1246,625],{"class":614},[498,1248,1249],{"class":610}," [\n",[498,1251,1253,1256,1259,1261],{"class":500,"line":1252},16,[498,1254,1255],{"class":614},"    '",[498,1257,1258],{"class":507},".\u002Fsrc\u002F**\u002F*.{vue,js,ts}",[498,1260,631],{"class":614},[498,1262,651],{"class":614},[498,1264,1266,1268,1271,1273],{"class":500,"line":1265},17,[498,1267,1255],{"class":614},[498,1269,1270],{"class":507},".\u002Fnode_modules\u002F@vyui\u002Fkit\u002Fdist\u002F**\u002F*.js",[498,1272,631],{"class":614},[498,1274,651],{"class":614},[498,1276,1278,1280,1283,1285],{"class":500,"line":1277},18,[498,1279,1255],{"class":614},[498,1281,1282],{"class":507},".\u002Fnode_modules\u002F@vyui\u002Fcore\u002Fdist\u002F**\u002F*.js",[498,1284,631],{"class":614},[498,1286,651],{"class":614},[498,1288,1290,1293],{"class":500,"line":1289},19,[498,1291,1292],{"class":610},"  ]",[498,1294,651],{"class":614},[498,1296,1298,1301,1303,1306,1308,1310,1313],{"class":500,"line":1297},20,[498,1299,1300],{"class":621},"  presets",[498,1302,625],{"class":614},[498,1304,1305],{"class":610}," [lynxPreset",[498,1307,638],{"class":614},[498,1309,1090],{"class":606},[498,1311,1312],{"class":610},"()]",[498,1314,651],{"class":614},[498,1316,1318,1320,1323],{"class":500,"line":1317},21,[498,1319,657],{"class":614},[498,1321,1322],{"class":695}," satisfies",[498,1324,1325],{"class":504}," Config\n",[476,1327,1329],{"id":1328},"import-the-theme-stylesheet","Import the theme stylesheet",[575,1331,1332,1335,1336,1339,1340,1343,1344,1347,1348,1351,1352,1356],{},[481,1333,1334],{},"@vyui\u002Fkit\u002Fstyle.css"," defines the default design tokens using Tailwind ",[481,1337,1338],{},"theme()"," calls, so pull it in ",[1030,1341,1342],{},"through"," your Tailwind pipeline with a CSS ",[481,1345,1346],{},"@import"," — not a plain JS import. Put any ",[481,1349,1350],{},"--ui-color-*"," overrides ",[1353,1354,1355],"em",{},"after"," it.",[488,1358,1363],{"className":1359,"code":1360,"filename":1361,"language":1362,"meta":494,"style":494},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","@tailwind base;\n@tailwind utilities;\n\n\u002F* @vyui\u002Fkit default theme tokens — overrides go below this line. *\u002F\n@import '@vyui\u002Fkit\u002Fstyle.css';\n","src\u002Findex.css","css",[481,1364,1365,1376,1385,1389,1394],{"__ignoreMap":494},[498,1366,1367,1370,1373],{"class":500,"line":501},[498,1368,1369],{"class":695},"@tailwind",[498,1371,1372],{"class":610}," base",[498,1374,1375],{"class":614},";\n",[498,1377,1378,1380,1383],{"class":500,"line":618},[498,1379,1369],{"class":695},[498,1381,1382],{"class":610}," utilities",[498,1384,1375],{"class":614},[498,1386,1387],{"class":500,"line":654},[498,1388,756],{"emptyLinePlaceholder":755},[498,1390,1391],{"class":500,"line":752},[498,1392,1393],{"class":1238},"\u002F* @vyui\u002Fkit default theme tokens — overrides go below this line. *\u002F\n",[498,1395,1396,1398,1400,1402,1404],{"class":500,"line":759},[498,1397,1346],{"class":695},[498,1399,641],{"class":614},[498,1401,1334],{"class":507},[498,1403,631],{"class":614},[498,1405,1375],{"class":614},[476,1407,1409],{"id":1408},"register-vy-ui","Register Vy UI",[575,1411,1412,1413,1416,1417,1420,1421,1426,1427,1430,1431,1434],{},"Vy UI needs its theme config provided once at your app entry. On Vue-Lynx — the primary target — do this with ",[481,1414,1415],{},"provideVyUI"," and import each component from its own deep entry where you use it (",[481,1418,1419],{},"@vyui\u002Fkit\u002Fbutton","), so the bundler ships only what you reference — see ",[1422,1423,1425],"a",{"href":1424},"#bundle-size-deep-imports","Bundle size & deep imports",". Kit's defaults use ",[481,1428,1429],{},"lucide"," icons, so register that set up front, and install the ",[481,1432,1433],{},"Intl"," polyfill for Lynx's PrimJS engine.",[488,1436,1439],{"className":596,"code":1437,"filename":1438,"language":599,"meta":494,"style":494},"import { createApp } from 'vue-lynx'\nimport { installIntlPolyfill, registerIconSet } from '@vyui\u002Fcore'\nimport { provideVyUI } from '@vyui\u002Fkit'\nimport lucide from '@iconify-json\u002Flucide\u002Ficons.json'\nimport App from '.\u002FApp.vue'\nimport '.\u002Findex.css'\n\ninstallIntlPolyfill()\nregisterIconSet('lucide', lucide)\n\nconst app = createApp(App)\nprovideVyUI(app)\napp.mount()\n","src\u002Findex.ts",[481,1440,1441,1461,1485,1504,1521,1537,1548,1552,1560,1578,1582,1596,1603],{"__ignoreMap":494},[498,1442,1443,1445,1447,1450,1452,1454,1456,1459],{"class":500,"line":501},[498,1444,696],{"class":695},[498,1446,699],{"class":614},[498,1448,1449],{"class":610}," createApp",[498,1451,720],{"class":614},[498,1453,723],{"class":695},[498,1455,641],{"class":614},[498,1457,1458],{"class":507},"vue-lynx",[498,1460,730],{"class":614},[498,1462,1463,1465,1467,1470,1472,1475,1477,1479,1481,1483],{"class":500,"line":618},[498,1464,696],{"class":695},[498,1466,699],{"class":614},[498,1468,1469],{"class":610}," installIntlPolyfill",[498,1471,638],{"class":614},[498,1473,1474],{"class":610}," registerIconSet",[498,1476,720],{"class":614},[498,1478,723],{"class":695},[498,1480,641],{"class":614},[498,1482,41],{"class":507},[498,1484,730],{"class":614},[498,1486,1487,1489,1491,1494,1496,1498,1500,1502],{"class":500,"line":654},[498,1488,696],{"class":695},[498,1490,699],{"class":614},[498,1492,1493],{"class":610}," provideVyUI",[498,1495,720],{"class":614},[498,1497,723],{"class":695},[498,1499,641],{"class":614},[498,1501,46],{"class":507},[498,1503,730],{"class":614},[498,1505,1506,1508,1511,1514,1516,1519],{"class":500,"line":752},[498,1507,696],{"class":695},[498,1509,1510],{"class":610}," lucide ",[498,1512,1513],{"class":695},"from",[498,1515,641],{"class":614},[498,1517,1518],{"class":507},"@iconify-json\u002Flucide\u002Ficons.json",[498,1520,730],{"class":614},[498,1522,1523,1525,1528,1530,1532,1535],{"class":500,"line":759},[498,1524,696],{"class":695},[498,1526,1527],{"class":610}," App ",[498,1529,1513],{"class":695},[498,1531,641],{"class":614},[498,1533,1534],{"class":507},".\u002FApp.vue",[498,1536,730],{"class":614},[498,1538,1539,1541,1543,1546],{"class":500,"line":781},[498,1540,696],{"class":695},[498,1542,641],{"class":614},[498,1544,1545],{"class":507},".\u002Findex.css",[498,1547,730],{"class":614},[498,1549,1550],{"class":500,"line":791},[498,1551,756],{"emptyLinePlaceholder":755},[498,1553,1554,1557],{"class":500,"line":796},[498,1555,1556],{"class":606},"installIntlPolyfill",[498,1558,1559],{"class":610},"()\n",[498,1561,1562,1565,1567,1569,1571,1573,1575],{"class":500,"line":806},[498,1563,1564],{"class":606},"registerIconSet",[498,1566,611],{"class":610},[498,1568,631],{"class":614},[498,1570,1429],{"class":507},[498,1572,631],{"class":614},[498,1574,638],{"class":614},[498,1576,1577],{"class":610}," lucide)\n",[498,1579,1580],{"class":500,"line":842},[498,1581,756],{"emptyLinePlaceholder":755},[498,1583,1584,1586,1589,1591,1593],{"class":500,"line":853},[498,1585,762],{"class":686},[498,1587,1588],{"class":610}," app ",[498,1590,768],{"class":614},[498,1592,1449],{"class":606},[498,1594,1595],{"class":610},"(App)\n",[498,1597,1598,1600],{"class":500,"line":865},[498,1599,1415],{"class":606},[498,1601,1602],{"class":610},"(app)\n",[498,1604,1605,1608,1610,1613],{"class":500,"line":875},[498,1606,1607],{"class":610},"app",[498,1609,593],{"class":614},[498,1611,1612],{"class":606},"mount",[498,1614,1559],{"class":610},[575,1616,1617],{},"Then import each component from its own entry where you use it:",[488,1619,1622],{"className":670,"code":1620,"filename":1621,"language":673,"meta":494,"style":494},"\u003Cscript setup>\nimport { VyButton } from '@vyui\u002Fkit\u002Fbutton'\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CVyButton>Tap me\u003C\u002FVyButton>\n\u003C\u002Ftemplate>\n","SomeScreen.vue",[481,1623,1624,1634,1653,1661,1665,1673,1692],{"__ignoreMap":494},[498,1625,1626,1628,1630,1632],{"class":500,"line":501},[498,1627,680],{"class":614},[498,1629,683],{"class":621},[498,1631,687],{"class":686},[498,1633,690],{"class":614},[498,1635,1636,1638,1640,1643,1645,1647,1649,1651],{"class":500,"line":618},[498,1637,696],{"class":695},[498,1639,699],{"class":614},[498,1641,1642],{"class":610}," VyButton",[498,1644,720],{"class":614},[498,1646,723],{"class":695},[498,1648,641],{"class":614},[498,1650,1419],{"class":507},[498,1652,730],{"class":614},[498,1654,1655,1657,1659],{"class":500,"line":654},[498,1656,784],{"class":614},[498,1658,683],{"class":621},[498,1660,690],{"class":614},[498,1662,1663],{"class":500,"line":752},[498,1664,756],{"emptyLinePlaceholder":755},[498,1666,1667,1669,1671],{"class":500,"line":759},[498,1668,680],{"class":614},[498,1670,801],{"class":621},[498,1672,690],{"class":614},[498,1674,1675,1677,1680,1683,1686,1688,1690],{"class":500,"line":781},[498,1676,809],{"class":614},[498,1678,1679],{"class":621},"VyButton",[498,1681,1682],{"class":614},">",[498,1684,1685],{"class":610},"Tap me",[498,1687,784],{"class":614},[498,1689,1679],{"class":621},[498,1691,690],{"class":614},[498,1693,1694,1696,1698],{"class":500,"line":791},[498,1695,784],{"class":614},[498,1697,801],{"class":621},[498,1699,690],{"class":614},[575,1701,1702,1703,1706,1707,1709],{},"The barrel (",[481,1704,1705],{},"import { VyButton } from '@vyui\u002Fkit'",") works identically, but on Vue-Lynx it ships every component — see ",[1422,1708,1425],{"href":1424}," below.",[471,1711,1425],{"id":1712},"bundle-size-deep-imports",[575,1714,1715,1716,1718,1719,1722,1723,1161,1726,1728,1729,1732,1733,1735],{},"Every component is published twice: through the ",[481,1717,46],{}," ",[1030,1720,1721],{},"barrel"," and through its own ",[1030,1724,1725],{},"deep entry",[481,1727,1419],{},", ",[481,1730,1731],{},"@vyui\u002Fkit\u002Ftray",", …). The bindings are identical — the canonical ",[481,1734,1003],{}," name — so choosing one is a specifier swap.",[575,1737,1738,1739,1742,1743,1746,1747,1750],{},"On the web, either is fine; a normal tree-shaking bundler drops what you don't reference from the barrel. ",[1030,1740,1741],{},"On Vue-Lynx it does not."," The main-thread worklet pipeline prunes by ",[481,1744,1745],{},"sideEffects"," globs over whatever is ",[1353,1748,1749],{},"reached",", and a bare side-effect import erases export-level usage — so a single barrel import pulls the whole set into both the background bundle and the worklet slice. Deep entries are the only way to ship less:",[1752,1753,1754,1770],"table",{},[1755,1756,1757],"thead",{},[1758,1759,1760,1764,1767],"tr",{},[1761,1762,1763],"th",{},"Import",[1761,1765,1766],{},"Modules reached",[1761,1768,1769],{},"Worklet registrations",[1771,1772,1773,1786],"tbody",{},[1758,1774,1775,1780,1783],{},[1776,1777,1778],"td",{},[481,1779,1419],{},[1776,1781,1782],{},"~37",[1776,1784,1785],{},"~26",[1758,1787,1788,1793,1796],{},[1776,1789,1790,1792],{},[481,1791,46],{}," (barrel)",[1776,1794,1795],{},"~294",[1776,1797,1798],{},"~118",[575,1800,1801,1802,1805,1806,1809,1810,1812],{},"So on Vue-Lynx, ",[1030,1803,1804],{},"prefer deep imports"," for components. One barrel import anywhere in a module re-pulls everything, so keep component imports deep throughout. (The build-only entries ",[481,1807,1808],{},"@vyui\u002Fkit\u002Fconfig"," and ",[481,1811,1104],{}," are already isolated and never pull component code.)",[1814,1815,1816],"tip",{},[575,1817,1818,1819,1822,1823,1826,1827,1829,1830,1833,1834,1837,1838,1841,1842,1844,1845,1847,1848,593],{},"On ",[1030,1820,1821],{},"full Vue (web)"," you can instead call ",[481,1824,1825],{},"app.use(VyUI)",", which registers every ",[481,1828,1003],{}," component globally so ",[481,1831,1832],{},"\u003CVyButton>"," works without an import — convenient, but it pulls the entire component set into your bundle. Vue-Lynx's ",[481,1835,1836],{},"createApp"," has no ",[481,1839,1840],{},"app.component",", so ",[481,1843,1825],{}," degrades to theme-only there (with a dev warning) — ",[481,1846,1415],{}," + named imports is the native path. Register just a subset globally with ",[481,1849,1850],{},"app.use(VyUI, { components: { VyButton } })",[471,1852,1854],{"id":1853},"runtime-modes","Runtime modes",[575,1856,1857,1859,1860,1862],{},[481,1858,46],{}," runs on any Vue-compatible runtime, but only some expose ",[481,1861,1840],{},". Pick the entry that matches yours:",[1752,1864,1865,1877],{},[1755,1866,1867],{},[1758,1868,1869,1872,1875],{},[1761,1870,1871],{},"Runtime",[1761,1873,1874],{},"Entry",[1761,1876,52],{},[1771,1878,1879,1897,1910],{},[1758,1880,1881,1884,1889],{},[1776,1882,1883],{},"Vue-Lynx \u002F minimal (native path)",[1776,1885,1886],{},[481,1887,1888],{},"provideVyUI(app, config)",[1776,1890,1891,1161,1894,1201],{},[1030,1892,1893],{},"Deep imports",[481,1895,1896],{},"import { VyButton } from '@vyui\u002Fkit\u002Fbutton'",[1758,1898,1899,1902,1907],{},[1776,1900,1901],{},"Full Vue (web)",[1776,1903,1904],{},[481,1905,1906],{},"app.use(VyUI, config)",[1776,1908,1909],{},"Registered globally",[1758,1911,1912,1915,1920],{},[1776,1913,1914],{},"Build (Tailwind)",[1776,1916,1917],{},[481,1918,1919],{},"createVyuiPreset(config)",[1776,1921,1922],{},"— (generates the class surface)",[575,1924,1925,1926,1837,1928,1841,1930,1844,1932,1934,1935,1938],{},"Vue-Lynx's ",[481,1927,1836],{},[481,1929,1840],{},[481,1931,1825],{},[481,1933,1415],{}," is the blessed native path. Runtime config ",[1030,1936,1937],{},"selects"," from the classes Tailwind already emitted; it never creates styling.",[471,1940,1942,1943],{"id":1941},"single-source-config-with-definevyuiconfig","Single-source config with ",[481,1944,1945],{},"defineVyuiConfig",[575,1947,1948,1949,1952,1953,1956,1957,1960,1961,1963,1964,1966],{},"The color set is meaningful to ",[1030,1950,1951],{},"both"," planes: the Tailwind preset must ",[1353,1954,1955],{},"generate"," the classes, and the runtime must ",[1353,1958,1959],{},"select"," the same set. Author it once with ",[481,1962,1945],{}," (from the light ",[481,1965,1808],{}," entry — safe to import in a Tailwind config; it never pulls component code) and feed the result to both:",[488,1968,1971],{"className":596,"code":1969,"filename":1970,"language":599,"meta":494,"style":494},"import { defineVyuiConfig } from '@vyui\u002Fkit\u002Fconfig'\n\nexport default defineVyuiConfig({\n  theme: {\n    primary: 'orange',\n    gray: 'stone',\n    colors: ['primary', 'secondary', 'success', 'info', 'warning', 'error'],\n  },\n  components: {\n    button: { slots: { base: 'rounded-xl' } },\n  },\n})\n","vyui.config.ts",[481,1972,1973,1992,1996,2008,2017,2033,2049,2114,2118,2127,2159,2163],{"__ignoreMap":494},[498,1974,1975,1977,1979,1982,1984,1986,1988,1990],{"class":500,"line":501},[498,1976,696],{"class":695},[498,1978,699],{"class":614},[498,1980,1981],{"class":610}," defineVyuiConfig",[498,1983,720],{"class":614},[498,1985,723],{"class":695},[498,1987,641],{"class":614},[498,1989,1808],{"class":507},[498,1991,730],{"class":614},[498,1993,1994],{"class":500,"line":618},[498,1995,756],{"emptyLinePlaceholder":755},[498,1997,1998,2000,2002,2004,2006],{"class":500,"line":654},[498,1999,1228],{"class":695},[498,2001,1231],{"class":695},[498,2003,1981],{"class":606},[498,2005,611],{"class":610},[498,2007,615],{"class":614},[498,2009,2010,2013,2015],{"class":500,"line":752},[498,2011,2012],{"class":621},"  theme",[498,2014,625],{"class":614},[498,2016,1135],{"class":614},[498,2018,2019,2022,2024,2026,2029,2031],{"class":500,"line":759},[498,2020,2021],{"class":621},"    primary",[498,2023,625],{"class":614},[498,2025,641],{"class":614},[498,2027,2028],{"class":507},"orange",[498,2030,631],{"class":614},[498,2032,651],{"class":614},[498,2034,2035,2038,2040,2042,2045,2047],{"class":500,"line":781},[498,2036,2037],{"class":621},"    gray",[498,2039,625],{"class":614},[498,2041,641],{"class":614},[498,2043,2044],{"class":507},"stone",[498,2046,631],{"class":614},[498,2048,651],{"class":614},[498,2050,2051,2054,2056,2058,2060,2063,2065,2067,2069,2072,2074,2076,2078,2081,2083,2085,2087,2090,2092,2094,2096,2099,2101,2103,2105,2108,2110,2112],{"class":500,"line":791},[498,2052,2053],{"class":621},"    colors",[498,2055,625],{"class":614},[498,2057,628],{"class":610},[498,2059,631],{"class":614},[498,2061,2062],{"class":507},"primary",[498,2064,631],{"class":614},[498,2066,638],{"class":614},[498,2068,641],{"class":614},[498,2070,2071],{"class":507},"secondary",[498,2073,631],{"class":614},[498,2075,638],{"class":614},[498,2077,641],{"class":614},[498,2079,2080],{"class":507},"success",[498,2082,631],{"class":614},[498,2084,638],{"class":614},[498,2086,641],{"class":614},[498,2088,2089],{"class":507},"info",[498,2091,631],{"class":614},[498,2093,638],{"class":614},[498,2095,641],{"class":614},[498,2097,2098],{"class":507},"warning",[498,2100,631],{"class":614},[498,2102,638],{"class":614},[498,2104,641],{"class":614},[498,2106,2107],{"class":507},"error",[498,2109,631],{"class":614},[498,2111,648],{"class":610},[498,2113,651],{"class":614},[498,2115,2116],{"class":500,"line":796},[498,2117,1213],{"class":614},[498,2119,2120,2123,2125],{"class":500,"line":806},[498,2121,2122],{"class":621},"  components",[498,2124,625],{"class":614},[498,2126,1135],{"class":614},[498,2128,2129,2132,2134,2136,2139,2141,2143,2145,2147,2149,2152,2154,2156],{"class":500,"line":842},[498,2130,2131],{"class":621},"    button",[498,2133,625],{"class":614},[498,2135,699],{"class":614},[498,2137,2138],{"class":621}," slots",[498,2140,625],{"class":614},[498,2142,699],{"class":614},[498,2144,1372],{"class":621},[498,2146,625],{"class":614},[498,2148,641],{"class":614},[498,2150,2151],{"class":507},"rounded-xl",[498,2153,631],{"class":614},[498,2155,720],{"class":614},[498,2157,2158],{"class":614}," },\n",[498,2160,2161],{"class":500,"line":853},[498,2162,1213],{"class":614},[498,2164,2165,2167],{"class":500,"line":865},[498,2166,657],{"class":614},[498,2168,660],{"class":610},[488,2170,2172],{"className":596,"code":2171,"filename":1036,"language":599,"meta":494,"style":494},"import vyuiConfig from '.\u002Fvyui.config'\nimport { createVyuiPreset } from '@vyui\u002Fkit\u002Ftailwind'\n\nexport default {\n  presets: [lynxPreset, createVyuiPreset(vyuiConfig)],\n}\n",[481,2173,2174,2190,2208,2212,2220,2237],{"__ignoreMap":494},[498,2175,2176,2178,2181,2183,2185,2188],{"class":500,"line":501},[498,2177,696],{"class":695},[498,2179,2180],{"class":610}," vyuiConfig ",[498,2182,1513],{"class":695},[498,2184,641],{"class":614},[498,2186,2187],{"class":507},".\u002Fvyui.config",[498,2189,730],{"class":614},[498,2191,2192,2194,2196,2198,2200,2202,2204,2206],{"class":500,"line":618},[498,2193,696],{"class":695},[498,2195,699],{"class":614},[498,2197,1090],{"class":610},[498,2199,720],{"class":614},[498,2201,723],{"class":695},[498,2203,641],{"class":614},[498,2205,1104],{"class":507},[498,2207,730],{"class":614},[498,2209,2210],{"class":500,"line":654},[498,2211,756],{"emptyLinePlaceholder":755},[498,2213,2214,2216,2218],{"class":500,"line":752},[498,2215,1228],{"class":695},[498,2217,1231],{"class":695},[498,2219,1135],{"class":614},[498,2221,2222,2224,2226,2228,2230,2232,2235],{"class":500,"line":759},[498,2223,1300],{"class":621},[498,2225,625],{"class":614},[498,2227,1305],{"class":610},[498,2229,638],{"class":614},[498,2231,1090],{"class":606},[498,2233,2234],{"class":610},"(vyuiConfig)]",[498,2236,651],{"class":614},[498,2238,2239],{"class":500,"line":781},[498,2240,2241],{"class":614},"}\n",[488,2243,2245],{"className":596,"code":2244,"filename":1438,"language":599,"meta":494,"style":494},"import vyuiConfig from '.\u002Fvyui.config'\nimport { provideVyUI } from '@vyui\u002Fkit' \u002F\u002F or: app.use(VyUI, vyuiConfig) on web\n\nprovideVyUI(app, vyuiConfig)\n",[481,2246,2247,2261,2282,2286],{"__ignoreMap":494},[498,2248,2249,2251,2253,2255,2257,2259],{"class":500,"line":501},[498,2250,696],{"class":695},[498,2252,2180],{"class":610},[498,2254,1513],{"class":695},[498,2256,641],{"class":614},[498,2258,2187],{"class":507},[498,2260,730],{"class":614},[498,2262,2263,2265,2267,2269,2271,2273,2275,2277,2279],{"class":500,"line":618},[498,2264,696],{"class":695},[498,2266,699],{"class":614},[498,2268,1493],{"class":610},[498,2270,720],{"class":614},[498,2272,723],{"class":695},[498,2274,641],{"class":614},[498,2276,46],{"class":507},[498,2278,631],{"class":614},[498,2280,2281],{"class":1238}," \u002F\u002F or: app.use(VyUI, vyuiConfig) on web\n",[498,2283,2284],{"class":500,"line":654},[498,2285,756],{"emptyLinePlaceholder":755},[498,2287,2288,2290,2293,2295],{"class":500,"line":752},[498,2289,1415],{"class":606},[498,2291,2292],{"class":610},"(app",[498,2294,638],{"class":614},[498,2296,2297],{"class":610}," vyuiConfig)\n",[476,2299,2301],{"id":2300},"mount-the-overlay-toast-hosts","Mount the overlay & toast hosts",[575,2303,2304,1728,2307,1728,2310,2313,2314,2317,2318,2321],{},[481,2305,2306],{},"VyModal",[481,2308,2309],{},"VyDrawer",[481,2311,2312],{},"VyPopover"," and friends render into a portal host, and ",[481,2315,2316],{},"VyToast"," needs a toast provider — the plugin does ",[1030,2319,2320],{},"not"," wire these up for you. Mount both once near the root:",[488,2323,2325],{"className":670,"code":2324,"filename":672,"language":673,"meta":494,"style":494},"\u003Cscript setup>\nimport { OverlayRoot, ToastProvider } from '@vyui\u002Fcore'\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CToastProvider>\n    \u003C!-- your app -->\n  \u003C\u002FToastProvider>\n  \u003C!-- Portal host for overlays; keep it a sibling at the app root. -->\n  \u003COverlayRoot \u002F>\n\u003C\u002Ftemplate>\n",[481,2326,2327,2337,2361,2369,2373,2381,2390,2395,2403,2408,2417],{"__ignoreMap":494},[498,2328,2329,2331,2333,2335],{"class":500,"line":501},[498,2330,680],{"class":614},[498,2332,683],{"class":621},[498,2334,687],{"class":686},[498,2336,690],{"class":614},[498,2338,2339,2341,2343,2346,2348,2351,2353,2355,2357,2359],{"class":500,"line":618},[498,2340,696],{"class":695},[498,2342,699],{"class":614},[498,2344,2345],{"class":610}," OverlayRoot",[498,2347,638],{"class":614},[498,2349,2350],{"class":610}," ToastProvider",[498,2352,720],{"class":614},[498,2354,723],{"class":695},[498,2356,641],{"class":614},[498,2358,41],{"class":507},[498,2360,730],{"class":614},[498,2362,2363,2365,2367],{"class":500,"line":654},[498,2364,784],{"class":614},[498,2366,683],{"class":621},[498,2368,690],{"class":614},[498,2370,2371],{"class":500,"line":752},[498,2372,756],{"emptyLinePlaceholder":755},[498,2374,2375,2377,2379],{"class":500,"line":759},[498,2376,680],{"class":614},[498,2378,801],{"class":621},[498,2380,690],{"class":614},[498,2382,2383,2385,2388],{"class":500,"line":781},[498,2384,809],{"class":614},[498,2386,2387],{"class":621},"ToastProvider",[498,2389,690],{"class":614},[498,2391,2392],{"class":500,"line":791},[498,2393,2394],{"class":1238},"    \u003C!-- your app -->\n",[498,2396,2397,2399,2401],{"class":500,"line":796},[498,2398,888],{"class":614},[498,2400,2387],{"class":621},[498,2402,690],{"class":614},[498,2404,2405],{"class":500,"line":806},[498,2406,2407],{"class":1238},"  \u003C!-- Portal host for overlays; keep it a sibling at the app root. -->\n",[498,2409,2410,2412,2415],{"class":500,"line":842},[498,2411,809],{"class":614},[498,2413,2414],{"class":621},"OverlayRoot",[498,2416,862],{"class":614},[498,2418,2419,2421,2423],{"class":500,"line":853},[498,2420,784],{"class":614},[498,2422,801],{"class":621},[498,2424,690],{"class":614},[476,2426,2428,2429,2431],{"id":2427},"use-a-vy-component","Use a ",[481,2430,1003],{}," component",[488,2433,2435],{"className":670,"code":2434,"filename":672,"language":673,"meta":494,"style":494},"\u003Cscript setup>\nimport { VyButton, VySlider } from '@vyui\u002Fkit'\nimport { ref } from 'vue'\n\nconst value = ref(50)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003CVySlider v-model=\"value\" :max=\"100\" \u002F>\n  \u003CVyButton variant=\"solid\" color=\"primary\">Save\u003C\u002FVyButton>\n\u003C\u002Ftemplate>\n",[481,2436,2437,2447,2470,2488,2492,2508,2516,2520,2528,2557,2597],{"__ignoreMap":494},[498,2438,2439,2441,2443,2445],{"class":500,"line":501},[498,2440,680],{"class":614},[498,2442,683],{"class":621},[498,2444,687],{"class":686},[498,2446,690],{"class":614},[498,2448,2449,2451,2453,2455,2457,2460,2462,2464,2466,2468],{"class":500,"line":618},[498,2450,696],{"class":695},[498,2452,699],{"class":614},[498,2454,1642],{"class":610},[498,2456,638],{"class":614},[498,2458,2459],{"class":610}," VySlider",[498,2461,720],{"class":614},[498,2463,723],{"class":695},[498,2465,641],{"class":614},[498,2467,46],{"class":507},[498,2469,730],{"class":614},[498,2471,2472,2474,2476,2478,2480,2482,2484,2486],{"class":500,"line":654},[498,2473,696],{"class":695},[498,2475,699],{"class":614},[498,2477,739],{"class":610},[498,2479,720],{"class":614},[498,2481,723],{"class":695},[498,2483,641],{"class":614},[498,2485,673],{"class":507},[498,2487,730],{"class":614},[498,2489,2490],{"class":500,"line":752},[498,2491,756],{"emptyLinePlaceholder":755},[498,2493,2494,2496,2498,2500,2502,2504,2506],{"class":500,"line":759},[498,2495,762],{"class":686},[498,2497,765],{"class":610},[498,2499,768],{"class":614},[498,2501,739],{"class":606},[498,2503,611],{"class":610},[498,2505,776],{"class":775},[498,2507,660],{"class":610},[498,2509,2510,2512,2514],{"class":500,"line":781},[498,2511,784],{"class":614},[498,2513,683],{"class":621},[498,2515,690],{"class":614},[498,2517,2518],{"class":500,"line":791},[498,2519,756],{"emptyLinePlaceholder":755},[498,2521,2522,2524,2526],{"class":500,"line":796},[498,2523,680],{"class":614},[498,2525,801],{"class":621},[498,2527,690],{"class":614},[498,2529,2530,2532,2535,2537,2539,2541,2543,2545,2547,2549,2551,2553,2555],{"class":500,"line":806},[498,2531,809],{"class":614},[498,2533,2534],{"class":621},"VySlider",[498,2536,815],{"class":686},[498,2538,768],{"class":614},[498,2540,820],{"class":614},[498,2542,823],{"class":507},[498,2544,820],{"class":614},[498,2546,828],{"class":686},[498,2548,768],{"class":614},[498,2550,820],{"class":614},[498,2552,835],{"class":507},[498,2554,820],{"class":614},[498,2556,862],{"class":614},[498,2558,2559,2561,2563,2566,2568,2570,2573,2575,2578,2580,2582,2584,2586,2588,2591,2593,2595],{"class":500,"line":842},[498,2560,809],{"class":614},[498,2562,1679],{"class":621},[498,2564,2565],{"class":686}," variant",[498,2567,768],{"class":614},[498,2569,820],{"class":614},[498,2571,2572],{"class":507},"solid",[498,2574,820],{"class":614},[498,2576,2577],{"class":686}," color",[498,2579,768],{"class":614},[498,2581,820],{"class":614},[498,2583,2062],{"class":507},[498,2585,820],{"class":614},[498,2587,1682],{"class":614},[498,2589,2590],{"class":610},"Save",[498,2592,784],{"class":614},[498,2594,1679],{"class":621},[498,2596,690],{"class":614},[498,2598,2599,2601,2603],{"class":500,"line":853},[498,2600,784],{"class":614},[498,2602,801],{"class":621},[498,2604,690],{"class":614},[466,2606,2608],{"id":2607},"options","Options",[575,2610,2611],{},"Kit ships sensible defaults — you only need to reach for these when you want to override theme tokens, swap a primary color, or change a component's default variant.",[471,2613,2614],{"id":2614},"theme",[575,2616,2617,2618,2621,2622,2624,2625,2627],{},"Pass component overrides under ",[481,2619,2620],{},"ui.\u003Ccomponent>"," to deep-merge them into the default Tailwind Variants theme. Every ",[481,2623,1003],{}," component reads from this — no rebuild required. Like Nuxt UI, everything lives under the single ",[481,2626,1189],{}," namespace.",[488,2629,2631],{"className":596,"code":2630,"filename":1438,"language":599,"meta":494,"style":494},"createApp(App).use(VyUI, {\n  ui: {\n    button: {\n      defaultVariants: { color: 'primary' },\n    },\n  },\n})\n",[481,2632,2633,2652,2661,2669,2690,2694,2698],{"__ignoreMap":494},[498,2634,2635,2637,2640,2642,2645,2648,2650],{"class":500,"line":501},[498,2636,1836],{"class":606},[498,2638,2639],{"class":610},"(App)",[498,2641,593],{"class":614},[498,2643,2644],{"class":606},"use",[498,2646,2647],{"class":610},"(VyUI",[498,2649,638],{"class":614},[498,2651,1135],{"class":614},[498,2653,2654,2657,2659],{"class":500,"line":618},[498,2655,2656],{"class":621},"  ui",[498,2658,625],{"class":614},[498,2660,1135],{"class":614},[498,2662,2663,2665,2667],{"class":500,"line":654},[498,2664,2131],{"class":621},[498,2666,625],{"class":614},[498,2668,1135],{"class":614},[498,2670,2671,2674,2676,2678,2680,2682,2684,2686,2688],{"class":500,"line":752},[498,2672,2673],{"class":621},"      defaultVariants",[498,2675,625],{"class":614},[498,2677,699],{"class":614},[498,2679,2577],{"class":621},[498,2681,625],{"class":614},[498,2683,641],{"class":614},[498,2685,2062],{"class":507},[498,2687,631],{"class":614},[498,2689,2158],{"class":614},[498,2691,2692],{"class":500,"line":759},[498,2693,1208],{"class":614},[498,2695,2696],{"class":500,"line":781},[498,2697,1213],{"class":614},[498,2699,2700,2702],{"class":500,"line":791},[498,2701,657],{"class":614},[498,2703,660],{"class":610},[471,2705,2706],{"id":2706},"colors",[575,2708,2709,2710,1728,2712,1728,2714,1728,2716,1728,2718,1728,2720,1728,2722,2725,2726,2729,2730,2733,2734,2736,2737,2741],{},"Override the semantic color slots (",[481,2711,2062],{},[481,2713,2071],{},[481,2715,2080],{},[481,2717,2089],{},[481,2719,2098],{},[481,2721,2107],{},[481,2723,2724],{},"neutral",") by redefining the ",[481,2727,2728],{},"--ui-color-{semantic}-{shade}"," CSS variables in your own stylesheet, or add a brand-new color slot (e.g. ",[481,2731,2732],{},"tertiary",") with ",[481,2735,1945],{}," — see ",[1422,2738,2740],{"href":2739},"\u002Ftheming\u002Fcolors#configuring-colors","Theming → Colors"," for the full walkthrough, including the type-safety and codegen steps.",[2743,2744,2745],"callout",{"icon":27,"to":25},[575,2746,2747],{},"Prefer copying component source into your app? Use the Vy UI CLI to initialize a registry-backed setup and add individual components.",[466,2749,2751],{"id":2750},"troubleshooting","Troubleshooting",[471,2753,2755],{"id":2754},"typeerror-cannot-read-property-bind-of-undefined",[481,2756,588],{},[575,2758,2759,2760,2763,2764,2767],{},"The app builds fine, then crashes on the ",[1030,2761,2762],{},"main thread"," the first time a\nworklet-driven component runs — dragging a ",[481,2765,2766],{},"VySortable",", a gesture, an\nanimation:",[488,2769,2774],{"className":2770,"code":2772,"language":2773},[2771],"language-text","main-thread.js exception: TypeError: cannot read property 'bind' of undefined\n","text",[481,2775,2772],{"__ignoreMap":494},[575,2777,2778,2781,2782,2784,2785,2787,2788,2790,2791,2793,2794,2797],{},[1030,2779,2780],{},"Cause."," VyUI ships those handlers as ",[481,2783,580],{}," worklets inside\n",[481,2786,41],{}," \u002F ",[481,2789,46],{},". vue-lynx's main-thread loader only walks\nfirst-party source, so worklets living in ",[481,2792,584],{}," never get registered —\nand the main thread then tries to ",[481,2795,2796],{},".bind"," a worklet that isn't there.",[575,2799,2800,2803,2804,2806],{},[1030,2801,2802],{},"Fix."," Allowlist the packages in your Lynx build (requires ",[481,2805,592],{},"):",[488,2808,2809],{"className":596,"code":597,"filename":598,"language":599,"meta":494,"style":494},[481,2810,2811,2819,2845],{"__ignoreMap":494},[498,2812,2813,2815,2817],{"class":500,"line":501},[498,2814,607],{"class":606},[498,2816,611],{"class":610},[498,2818,615],{"class":614},[498,2820,2821,2823,2825,2827,2829,2831,2833,2835,2837,2839,2841,2843],{"class":500,"line":618},[498,2822,622],{"class":621},[498,2824,625],{"class":614},[498,2826,628],{"class":610},[498,2828,631],{"class":614},[498,2830,41],{"class":507},[498,2832,631],{"class":614},[498,2834,638],{"class":614},[498,2836,641],{"class":614},[498,2838,46],{"class":507},[498,2840,631],{"class":614},[498,2842,648],{"class":610},[498,2844,651],{"class":614},[498,2846,2847,2849],{"class":500,"line":654},[498,2848,657],{"class":614},[498,2850,660],{"class":610},[575,2852,2853,2854,2856,2857,2860,2861,2864],{},"If you set the project up with the ",[1422,2855,24],{"href":25},", run\n",[481,2858,2859],{},"npx @vyui\u002Fcli check"," — it audits your config and reports this (and other common\nwiring gaps) with the fix, and exits non-zero so you can gate CI on it. ",[481,2862,2863],{},"init","\nadds the allowlist for you on new projects.",[2866,2867,2868],"style",{},"html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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 .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}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 .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}",{"title":494,"searchDepth":501,"depth":618,"links":2870},[2871,2880,2884],{"id":468,"depth":618,"text":469,"children":2872},[2873,2874,2876,2877,2878],{"id":473,"depth":654,"text":474},{"id":904,"depth":654,"text":2875},"Add styled components with @vyui\u002Fkit",{"id":1712,"depth":654,"text":1425},{"id":1853,"depth":654,"text":1854},{"id":1941,"depth":654,"text":2879},"Single-source config with defineVyuiConfig",{"id":2607,"depth":618,"text":2608,"children":2881},[2882,2883],{"id":2614,"depth":654,"text":2614},{"id":2706,"depth":654,"text":2706},{"id":2750,"depth":618,"text":2751,"children":2885},[2886],{"id":2754,"depth":654,"text":588},"Install @vyui\u002Fcore and @vyui\u002Fkit into a Vue-Lynx app.","md",{},{"icon":17},{"title":14,"description":2887},"6r36gZFxHsgCVtCOh8igpYIwuMjo7Mje_omhXFDNCfI",[2894,2896],{"title":10,"path":6,"stem":7,"description":2895,"icon":-1,"children":-1,"navigation":-1},"What Vy UI is, how the two-layer architecture works, and why Vue-Lynx needs its own component library.",{"title":19,"path":20,"stem":21,"description":2897,"icon":-1,"children":-1,"navigation":-1},"Bring your own icon set via Iconify.",1785060129484]