[{"data":1,"prerenderedAt":782},["ShallowReactive",2],{"navigation":3,"\u002Fguides\u002Flynx-ui-frameworks":455,"\u002Fguides\u002Flynx-ui-frameworks-surround":777},[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,436,441,445,450],{"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},"Lynx UI frameworks","\u002Fguides\u002Flynx-ui-frameworks","8.guides\u002F2.lynx-ui-frameworks","i-lucide-library",{"title":423,"path":424,"stem":425,"package":11,"icon":426},"What is Vue Lynx","\u002Fguides\u002Fvue-lynx","8.guides\u002F3.vue-lynx","i-lucide-component",{"title":428,"path":429,"stem":430,"package":11,"icon":431},"Lynx vs React Native","\u002Fguides\u002Flynx-vs-react-native","8.guides\u002F4.lynx-vs-react-native","i-lucide-git-compare",{"title":433,"path":434,"stem":435,"package":11,"icon":84},"Testing on your phone","\u002Fguides\u002Ftesting-on-device","8.guides\u002F5.testing-on-device",{"title":437,"path":438,"stem":439,"package":11,"icon":440},"Testing with Xcode","\u002Fguides\u002Ftesting-with-xcode","8.guides\u002F6.testing-with-xcode","i-lucide-apple",{"title":442,"path":443,"stem":444,"package":11,"icon":27},"The rspeedy dev server","\u002Fguides\u002Frspeedy-dev-server","8.guides\u002F7.rspeedy-dev-server",{"title":446,"path":447,"stem":448,"package":11,"icon":449},"Tailwind on Lynx","\u002Fguides\u002Ftailwind-on-lynx","8.guides\u002F8.tailwind-on-lynx","i-lucide-wind",{"title":451,"path":452,"stem":453,"package":11,"icon":454},"Theming on Lynx","\u002Fguides\u002Ftheming-on-lynx","8.guides\u002F9.theming-on-lynx","i-lucide-paintbrush",{"id":456,"title":418,"body":457,"description":769,"extension":770,"links":11,"meta":771,"navigation":772,"package":11,"path":419,"seo":773,"stem":420,"__hash__":776},"docs\u002F8.guides\u002F2.lynx-ui-frameworks.md",{"type":458,"value":459,"toc":755},"minimark",[460,483,492,499,504,609,614,623,626,629,633,638,643,660,663,667,673,676,680,688,698,701,705,708,718,721,728,731,735],[461,462,463,464,468,469,468,472,468,475,478,479,482],"p",{},"Lynx ships five native elements and leaves everything above them to you. ",[465,466,467],"code",{},"\u003Cview>",", ",[465,470,471],{},"\u003Ctext>",[465,473,474],{},"\u003Cimage>",[465,476,477],{},"\u003Cscroll-view>",", and ",[465,480,481],{},"\u003Clist>"," cover layout and primitive rendering, so every application builds the tier web developers take for granted, meaning dialogs that trap focus, sheets that respond to a drag, and sliders that track a gesture without dropping frames.",[461,484,485,486,491],{},"Two libraries fill that tier today, and they bind to different frameworks, so the choice falls out of a decision you already made about React or Vue. If you know which framework you are writing, skip to ",[487,488,490],"a",{"href":489},"#choosing-between-them","choosing between them",".",[493,494,496],"callout",{"icon":495},"i-lucide-info",[461,497,498],{},"We maintain Vy UI, the Vue library described below. I have named what the alternative does better, because a comparison that pretended otherwise would be no use to anyone actually choosing.",[500,501,503],"h2",{"id":502},"the-libraries","The libraries",[505,506,507,528],"table",{},[508,509,510],"thead",{},[511,512,513,517,520,523,525],"tr",{},[514,515,516],"th",{},"Library",[514,518,519],{},"Framework",[514,521,522],{},"Layer",[514,524,52],{},[514,526,527],{},"License",[529,530,531,556,575,593],"tbody",{},[511,532,533,544,547,550,553],{},[534,535,536],"td",{},[487,537,541],{"href":538,"rel":539},"https:\u002F\u002Fgithub.com\u002Flynx-family\u002Flynx-ui",[540],"nofollow",[465,542,543],{},"@lynx-js\u002Flynx-ui",[534,545,546],{},"ReactLynx",[534,548,549],{},"Headless",[534,551,552],{},"~21 packages",[534,554,555],{},"Apache 2.0",[511,557,558,564,567,569,572],{},[534,559,560],{},[487,561,562],{"href":42},[465,563,41],{},[534,565,566],{},"Vue Lynx",[534,568,549],{},[534,570,571],{},"47 primitives",[534,573,574],{},"MIT",[511,576,577,583,585,588,591],{},[534,578,579],{},[487,580,581],{"href":47},[465,582,46],{},[534,584,566],{},[534,586,587],{},"Styled",[534,589,590],{},"48 components",[534,592,574],{},[511,594,595,598,601,604,607],{},[534,596,597],{},"Lynx built-in elements",[534,599,600],{},"Any",[534,602,603],{},"Native",[534,605,606],{},"5 elements",[534,608,555],{},[610,611,613],"h3",{"id":612},"lynx-ui-the-official-reactlynx-library","lynx-ui, the official ReactLynx library",[461,615,616,618,619,622],{},[465,617,543],{}," is the Lynx team's own component library for ReactLynx. It is headless, and it ships one npm package per component rather than a single barrel, so you only pay for what you import. The published set covers Button, Checkbox, Dialog, Draggable, FeedList, Form, Input, LazyComponent, List, Overlay, Popover, Presence, RadioGroup, ScrollView, Sheet, Slider, Sortable, SwipeAction, Swiper, and Switch, plus a shared ",[465,620,621],{},"common"," package underneath them.",[461,624,625],{},"The same team builds the runtime, so behavior tracks Lynx SDK changes closely, and it requires LynxSDK 3.2 or newer. If you write ReactLynx, start here.",[461,627,628],{},"It styles nothing, and it does not support Vue. No ReactLynx equivalent to shadcn\u002Fui or Vant sits on top of it yet, so the visual layer is still work you do yourself.",[610,630,632],{"id":631},"vy-ui-for-vue-lynx","Vy UI, for Vue Lynx",[461,634,635,637],{},[487,636,566],{"href":424}," is a Vue 3 custom renderer that cannot consume React components, so lynx-ui does not help there. Vy UI fills the gap in two layers.",[461,639,640,642],{},[465,641,41],{}," is the headless layer, 47 primitives covering overlays and dialogs, menus and popovers, form controls, navigation, and gestures. Swiper, SwipeAction, Sortable, Draggable, FeedList, and ScrollView share one main-thread gesture core, so a drag never round-trips through the background thread.",[461,644,645,647,648,651,652,655,656,659],{},[465,646,46],{}," is the styled layer, 48 components on those primitives themed through Tailwind Variants. A ",[487,649,650],{"href":303},"three-tier semantic token system"," flips the whole set into dark mode through a single class instead of per-component ",[465,653,654],{},"dark:"," variants, and a ",[487,657,658],{"href":25},"shadcn-style CLI"," copies component source into your repository when you would rather own the code.",[461,661,662],{},"Vy UI is alpha and Vue Lynx is earlier than that, so pick it once you have settled on Vue and accepted that APIs will move. It is MIT licensed and community-maintained rather than official.",[610,664,666],{"id":665},"skipping-the-libraries-entirely","Skipping the libraries entirely",[461,668,669,670,672],{},"The obvious objection is that you could write these components yourself, and for a small application that holds up better than I would like. Lynx gives you real CSS in external stylesheets, and ",[465,671,481],{}," is already a virtualized recycler.",[461,674,675],{},"The cost lands in behavior rather than appearance. A dialog needs focus and dismissal handling, a bottom sheet needs velocity-aware drag physics on the main thread, and a select needs keyboard and screen-reader wiring that Lynx does not infer. Those take weeks and then break on one platform.",[500,677,679],{"id":678},"choosing-between-them","Choosing between them",[461,681,682,683,687],{},"Pick ",[684,685,686],"strong",{},"ReactLynx and lynx-ui"," if your team writes React and you are willing to build the styling layer yourself. This is the better-supported path today and most of the ecosystem assumes it.",[461,689,682,690,693,694,697],{},[684,691,692],{},"Vue Lynx and Vy UI"," if your team writes Vue and rewriting into React is not a trade you want. You get a styled layer that ReactLynx has no equivalent for, and a younger runtime underneath it. The ",[487,695,696],{"href":424},"Vue Lynx guide"," covers what that runtime supports.",[461,699,700],{},"Both compile down to the same native Lynx elements on iOS, Android, and web, so neither choice commits you to a different rendering model.",[500,702,704],{"id":703},"where-the-ecosystem-is-thin","Where the ecosystem is thin",[461,706,707],{},"Three gaps apply to every option on this page.",[461,709,710,711,714,715,491],{},"Accessibility on web is incomplete in a way it is not on native. Lynx emits ",[465,712,713],{},"accessibility-*"," properties that iOS VoiceOver and Android TalkBack consume directly, but browsers ignore them, so a web screen reader sees generic boxes unless a library mirrors them into ARIA. Vy UI documents this as ",[487,716,717],{"href":329},"an open gap",[461,719,720],{},"Keyboard input on web is similarly unhandled, because Lynx was designed for touch and the browser target inherits that. Neither library wires Escape-to-dismiss or arrow-key menu navigation by default.",[461,722,723,724,727],{},"Internationalization is early. ",[465,725,726],{},"Intl"," is not fully available in the Lynx runtime, so date and number formatting depend on polyfills and RTL layout coverage is partial.",[461,729,730],{},"None of this is a reason to avoid Lynx. It is a reason to check the components you need against the targets you ship to, instead of assuming web parity with native.",[500,732,734],{"id":733},"related","Related",[736,737,738,744,749],"card-group",{},[739,740,741],"card",{"icon":426,"title":423,"to":424},[461,742,743],{},"The Vue renderer for Lynx, its dual-thread model, and what it supports.",[739,745,746],{"icon":431,"title":428,"to":429},[461,747,748],{},"How the two architectures differ and when each one makes sense.",[739,750,752],{"icon":33,"title":751,"to":6},"Get started with Vy UI",[461,753,754],{},"Install the packages and render a first component.",{"title":756,"searchDepth":757,"depth":758,"links":759},"",1,2,[760,766,767,768],{"id":502,"depth":758,"text":503,"children":761},[762,764,765],{"id":612,"depth":763,"text":613},3,{"id":631,"depth":763,"text":632},{"id":665,"depth":763,"text":666},{"id":678,"depth":758,"text":679},{"id":703,"depth":758,"text":704},{"id":733,"depth":758,"text":734},"A comparison of the UI component libraries available for Lynx today, covering what each one ships, which framework it targets, and how mature it is.","md",{},{"icon":421},{"title":774,"description":775},"Lynx UI Frameworks & Component Libraries","Which UI component libraries exist for Lynx, ByteDance's cross-platform framework. Compares lynx-ui for ReactLynx and Vy UI for Vue Lynx on components, styling, and maturity.","7d1mVkKf62sUqze1HmjzFT98vW0R1-_v079FyPd5rsg",[778,780],{"title":414,"path":415,"stem":416,"description":779,"icon":-1,"children":-1,"navigation":-1},"Vue Lynx 0.5 can render your first screen on the main thread before any background JavaScript runs, which removes the blank frame at launch. The flag, the rules your components have to obey, and what it costs.",{"title":423,"path":424,"stem":425,"description":781,"icon":-1,"children":-1,"navigation":-1},"How Vue Lynx renders Vue components to native iOS, Android, and web through ByteDance's Lynx runtime, and what changes when you write Vue against it.",1785008678625]