[{"data":1,"prerenderedAt":2049},["ShallowReactive",2],{"design-doc:platform-awareness":3},{"data":4,"body":7,"toc":2028},{"title":5,"description":6},"Platform awareness","",{"type":8,"children":9},"root",[10,18,34,60,67,72,111,116,122,302,308,313,320,378,411,417,457,505,511,534,550,556,561,611,642,648,677,683,718,734,764,770,782,794,819,825,830,874,887,899,904,1304,1351,1391,1416,1555,1561,1642,1648,1653,1796,1802,1807,1830,1849,1855,1860,1893,1898,1904,1909,2022],{"type":11,"tag":12,"props":13,"children":15},"element","h1",{"id":14},"platform-awareness",[16],{"type":17,"value":5},"text",{"type":11,"tag":19,"props":20,"children":21},"blockquote",{},[22],{"type":11,"tag":23,"props":24,"children":25},"p",{},[26,32],{"type":11,"tag":27,"props":28,"children":29},"strong",{},[30],{"type":17,"value":31},"Status:",{"type":17,"value":33}," doctrine (2026-05-22). Captures the multi-platform\nstrategy that grounds the Tauri-targeted absorption sweep\n(Apple suite, Material 3, Android, scrollbar kit, layout grids).\nComponents that ship platform-aware behavior reference this doc.",{"type":11,"tag":23,"props":35,"children":36},{},[37,39,44,46,51,53,58],{"type":17,"value":38},"TUX is a ",{"type":11,"tag":27,"props":40,"children":41},{},[42],{"type":17,"value":43},"single component tree",{"type":17,"value":45}," that adapts at the ",{"type":11,"tag":27,"props":47,"children":48},{},[49],{"type":17,"value":50},"chrome\nlayer",{"type":17,"value":52}," to the host operating system. We don't fork the codebase\nper OS. We don't compile to native widgets. We compile ",{"type":11,"tag":27,"props":54,"children":55},{},[56],{"type":17,"value":57},"once to\nVue 3 + Web Components inside a Tauri WebView",{"type":17,"value":59},", and let a thin\nplatform-detection layer adjust the parts of the UI that are\ngenuinely OS-bound (window chrome, scrollbar, modifier-key labels,\nsystem fonts, native menu bar, accent color).",{"type":11,"tag":61,"props":62,"children":64},"h2",{"id":63},"the-two-layers-mental-model",[65],{"type":17,"value":66},"The \"two layers\" mental model",{"type":11,"tag":23,"props":68,"children":69},{},[70],{"type":17,"value":71},"Every TUX surface decomposes into two layers:",{"type":11,"tag":73,"props":74,"children":75},"ol",{},[76,94],{"type":11,"tag":77,"props":78,"children":79},"li",{},[80,85,87,92],{"type":11,"tag":27,"props":81,"children":82},{},[83],{"type":17,"value":84},"Brand layer — invariant across platforms.",{"type":17,"value":86},"\nMaroon-led palette, paper-grain surfaces, editorial chrome\n(eyebrow \u002F display-face title \u002F signature rule \u002F source line),\nreal photography, restrained motion, Heroicons. This is TTI's\nidentity and ",{"type":11,"tag":27,"props":88,"children":89},{},[90],{"type":17,"value":91},"never changes",{"type":17,"value":93}," with the host OS. A Landscape\nchart looks like TTI on Windows, macOS, and Linux.",{"type":11,"tag":77,"props":95,"children":96},{},[97,102,104,109],{"type":11,"tag":27,"props":98,"children":99},{},[100],{"type":17,"value":101},"Chrome layer — adapts to the host.",{"type":17,"value":103},"\nWindow-frame controls, scrollbar rendering, modifier-key\nsymbols, system font fallback, drag regions, native menu bar,\naccent-color tints, share-sheet invocation, notification API,\nfile-dialog style. This is what makes the app ",{"type":11,"tag":27,"props":105,"children":106},{},[107],{"type":17,"value":108},"feel native\nin its window",{"type":17,"value":110},".",{"type":11,"tag":23,"props":112,"children":113},{},[114],{"type":17,"value":115},"The split is on purpose: TUX's editorial-research identity is what\nTTI is selling; OS-feel is what makes the user not flinch when the\nwindow opens. Keep them separated.",{"type":11,"tag":61,"props":117,"children":119},{"id":118},"target-host-matrix",[120],{"type":17,"value":121},"Target host matrix",{"type":11,"tag":123,"props":124,"children":125},"table",{},[126,150],{"type":11,"tag":127,"props":128,"children":129},"thead",{},[130],{"type":11,"tag":131,"props":132,"children":133},"tr",{},[134,140,145],{"type":11,"tag":135,"props":136,"children":137},"th",{},[138],{"type":17,"value":139},"Host",{"type":11,"tag":135,"props":141,"children":142},{},[143],{"type":17,"value":144},"TUX runtime",{"type":11,"tag":135,"props":146,"children":147},{},[148],{"type":17,"value":149},"Chrome notes",{"type":11,"tag":151,"props":152,"children":153},"tbody",{},[154,185,206,227,248,276],{"type":11,"tag":131,"props":155,"children":156},{},[157,166,171],{"type":11,"tag":158,"props":159,"children":160},"td",{},[161],{"type":11,"tag":27,"props":162,"children":163},{},[164],{"type":17,"value":165},"Web (Nuxt SSR + hydration)",{"type":11,"tag":158,"props":167,"children":168},{},[169],{"type":17,"value":170},"Native Vue\u002FNuxt",{"type":11,"tag":158,"props":172,"children":173},{},[174,176,183],{"type":17,"value":175},"Browser-default scrollbar; no window chrome; ⌘\u002FCtrl auto-detect via navigator.platform; system fonts via ",{"type":11,"tag":177,"props":178,"children":180},"code",{"className":179},[],[181],{"type":17,"value":182},"-apple-system, \"Segoe UI Variable\", system-ui",{"type":17,"value":184}," cascade",{"type":11,"tag":131,"props":186,"children":187},{},[188,196,201],{"type":11,"tag":158,"props":189,"children":190},{},[191],{"type":11,"tag":27,"props":192,"children":193},{},[194],{"type":17,"value":195},"Tauri on macOS 26 (Liquid Glass)",{"type":11,"tag":158,"props":197,"children":198},{},[199],{"type":17,"value":200},"Vue\u002FNuxt inside WKWebView",{"type":11,"tag":158,"props":202,"children":203},{},[204],{"type":17,"value":205},"Traffic-light controls top-left; titlebar drag region; overlay scrollbar; San Francisco font; sheet-style modals; native menu bar at top of screen; accent color from system; ⌘ modifier",{"type":11,"tag":131,"props":207,"children":208},{},[209,217,222],{"type":11,"tag":158,"props":210,"children":211},{},[212],{"type":11,"tag":27,"props":213,"children":214},{},[215],{"type":17,"value":216},"Tauri on Windows 11 25H2",{"type":11,"tag":158,"props":218,"children":219},{},[220],{"type":17,"value":221},"Vue\u002FNuxt inside WebView2",{"type":11,"tag":158,"props":223,"children":224},{},[225],{"type":17,"value":226},"Min\u002Fmax\u002Fclose top-right with snap-layout hover; titlebar drag region; persistent slim scrollbar; Segoe UI Variable font; in-window menu bar; Mica-backdrop materials available; Ctrl modifier",{"type":11,"tag":131,"props":228,"children":229},{},[230,238,243],{"type":11,"tag":158,"props":231,"children":232},{},[233],{"type":11,"tag":27,"props":234,"children":235},{},[236],{"type":17,"value":237},"Tauri on Linux (Ubuntu 24\u002F26, Fedora, etc.)",{"type":11,"tag":158,"props":239,"children":240},{},[241],{"type":17,"value":242},"Vue\u002FNuxt inside WebKitGTK",{"type":11,"tag":158,"props":244,"children":245},{},[246],{"type":17,"value":247},"Depends on DE — GNOME server-side decorations on right, KDE on right, others vary; Adwaita or Breeze scrollbar; Inter \u002F Ubuntu Sans \u002F system-ui; in-window menu bar or global (GNOME); Ctrl modifier; Super available",{"type":11,"tag":131,"props":249,"children":250},{},[251,267,271],{"type":11,"tag":158,"props":252,"children":253},{},[254,259,261],{"type":11,"tag":27,"props":255,"children":256},{},[257],{"type":17,"value":258},"Tauri Mobile on iOS",{"type":17,"value":260}," ",{"type":11,"tag":262,"props":263,"children":264},"em",{},[265],{"type":17,"value":266},"(future)",{"type":11,"tag":158,"props":268,"children":269},{},[270],{"type":17,"value":200},{"type":11,"tag":158,"props":272,"children":273},{},[274],{"type":17,"value":275},"No window chrome; safe-area-inset for notch\u002Fhome-indicator; bottom-sheet idiom; iOS share sheet; system font stack",{"type":11,"tag":131,"props":277,"children":278},{},[279,292,297],{"type":11,"tag":158,"props":280,"children":281},{},[282,287,288],{"type":11,"tag":27,"props":283,"children":284},{},[285],{"type":17,"value":286},"Tauri Mobile on Android",{"type":17,"value":260},{"type":11,"tag":262,"props":289,"children":290},{},[291],{"type":17,"value":266},{"type":11,"tag":158,"props":293,"children":294},{},[295],{"type":17,"value":296},"Vue\u002FNuxt inside WebView",{"type":11,"tag":158,"props":298,"children":299},{},[300],{"type":17,"value":301},"Status-bar + nav-bar safe areas; bottom-nav \u002F bottom-sheet idiom; Material gestures; Roboto \u002F system font",{"type":11,"tag":61,"props":303,"children":305},{"id":304},"dimensions-of-variation",[306],{"type":17,"value":307},"Dimensions of variation",{"type":11,"tag":23,"props":309,"children":310},{},[311],{"type":17,"value":312},"Eight things change per platform. Everything else stays TUX-brand.",{"type":11,"tag":314,"props":315,"children":317},"h3",{"id":316},"_1-window-chrome-titlebar-traffic-lights",[318],{"type":17,"value":319},"1. Window chrome (titlebar + traffic lights)",{"type":11,"tag":321,"props":322,"children":323},"ul",{},[324,341,358,368],{"type":11,"tag":77,"props":325,"children":326},{},[327,332,334,339],{"type":11,"tag":27,"props":328,"children":329},{},[330],{"type":17,"value":331},"macOS 26",{"type":17,"value":333},": traffic-light controls (close \u002F minimize \u002F zoom) at\n",{"type":11,"tag":27,"props":335,"children":336},{},[337],{"type":17,"value":338},"top-left",{"type":17,"value":340},"; titlebar is a 28px drag region; Liquid Glass tint\ncan frost the titlebar.",{"type":11,"tag":77,"props":342,"children":343},{},[344,349,351,356],{"type":11,"tag":27,"props":345,"children":346},{},[347],{"type":17,"value":348},"Windows 11 25H2",{"type":17,"value":350},": minimize \u002F maximize \u002F close at ",{"type":11,"tag":27,"props":352,"children":353},{},[354],{"type":17,"value":355},"top-right",{"type":17,"value":357},";\nmaximize hover reveals snap-layout grid (hover for 600ms);\ntitlebar drag region is the whole top strip excluding controls.",{"type":11,"tag":77,"props":359,"children":360},{},[361,366],{"type":11,"tag":27,"props":362,"children":363},{},[364],{"type":17,"value":365},"Linux (GNOME)",{"type":17,"value":367},": close button at top-right (server-side\ndecorations); no traffic lights; titlebar may show app name.",{"type":11,"tag":77,"props":369,"children":370},{},[371,376],{"type":11,"tag":27,"props":372,"children":373},{},[374],{"type":17,"value":375},"Linux (KDE \u002F others)",{"type":17,"value":377},": vary; respect the DE's CSD\u002FSSD choice.",{"type":11,"tag":23,"props":379,"children":380},{},[381,386,388,394,396,402,404,410],{"type":11,"tag":27,"props":382,"children":383},{},[384],{"type":17,"value":385},"Implementation hook:",{"type":17,"value":387}," future ",{"type":11,"tag":177,"props":389,"children":391},{"className":390},[],[392],{"type":17,"value":393},"\u003CTuxAppFrame>",{"type":17,"value":395}," wrapper composes\na fake titlebar (Tauri runs with ",{"type":11,"tag":177,"props":397,"children":399},{"className":398},[],[400],{"type":17,"value":401},"decorations: false",{"type":17,"value":403},") and renders\nthe right buttons at the right place per platform. Reads\n",{"type":11,"tag":177,"props":405,"children":407},{"className":406},[],[408],{"type":17,"value":409},"useTuxPlatform().os",{"type":17,"value":110},{"type":11,"tag":314,"props":412,"children":414},{"id":413},"_2-scrollbar-style",[415],{"type":17,"value":416},"2. Scrollbar style",{"type":11,"tag":321,"props":418,"children":419},{},[420,430,447],{"type":11,"tag":77,"props":421,"children":422},{},[423,428],{"type":11,"tag":27,"props":424,"children":425},{},[426],{"type":17,"value":427},"macOS",{"type":17,"value":429},": overlay scrollbar (auto-hides); thin track; appears on\nhover\u002Fscroll.",{"type":11,"tag":77,"props":431,"children":432},{},[433,438,440,445],{"type":11,"tag":27,"props":434,"children":435},{},[436],{"type":17,"value":437},"Windows 11",{"type":17,"value":439},": persistent thin scrollbar; ",{"type":11,"tag":27,"props":441,"children":442},{},[443],{"type":17,"value":444},"always visible",{"type":17,"value":446},";\n~12px wide.",{"type":11,"tag":77,"props":448,"children":449},{},[450,455],{"type":11,"tag":27,"props":451,"children":452},{},[453],{"type":17,"value":454},"Linux",{"type":17,"value":456},": depends on GTK\u002FQt theme — Adwaita is thin overlay\nsimilar to macOS; Breeze is persistent like Windows.",{"type":11,"tag":23,"props":458,"children":459},{},[460,464,465,471,473,479,481,487,489,495,497,503],{"type":11,"tag":27,"props":461,"children":462},{},[463],{"type":17,"value":385},{"type":17,"value":387},{"type":11,"tag":177,"props":466,"children":468},{"className":467},[],[469],{"type":17,"value":470},"tux-scrollbar",{"type":17,"value":472}," utility class\napplies ",{"type":11,"tag":177,"props":474,"children":476},{"className":475},[],[477],{"type":17,"value":478},"::-webkit-scrollbar",{"type":17,"value":480}," styles conditional on\n",{"type":11,"tag":177,"props":482,"children":484},{"className":483},[],[485],{"type":17,"value":486},"html[data-platform=\"mac\"]",{"type":17,"value":488}," \u002F ",{"type":11,"tag":177,"props":490,"children":492},{"className":491},[],[493],{"type":17,"value":494},"data-platform=\"win\"",{"type":17,"value":496}," \u002F\n",{"type":11,"tag":177,"props":498,"children":500},{"className":499},[],[501],{"type":17,"value":502},"data-platform=\"linux\"",{"type":17,"value":504},". Doctrine: don't fight the host; if the\nuser expects scrollbar-on-hover on macOS, give them that.",{"type":11,"tag":314,"props":506,"children":508},{"id":507},"_3-modifier-key-labels",[509],{"type":17,"value":510},"3. Modifier-key labels",{"type":11,"tag":321,"props":512,"children":513},{},[514,524],{"type":11,"tag":77,"props":515,"children":516},{},[517,522],{"type":11,"tag":27,"props":518,"children":519},{},[520],{"type":17,"value":521},"Apple",{"type":17,"value":523},": ⌘ (cmd), ⌥ (option), ⌃ (control), ⇧ (shift).",{"type":11,"tag":77,"props":525,"children":526},{},[527,532],{"type":11,"tag":27,"props":528,"children":529},{},[530],{"type":17,"value":531},"Windows \u002F Linux",{"type":17,"value":533},": Ctrl, Alt, Shift, Win\u002FSuper.",{"type":11,"tag":23,"props":535,"children":536},{},[537,541,542,548],{"type":11,"tag":27,"props":538,"children":539},{},[540],{"type":17,"value":385},{"type":17,"value":260},{"type":11,"tag":177,"props":543,"children":545},{"className":544},[],[546],{"type":17,"value":547},"TuxKbd",{"type":17,"value":549}," already does this for Mac vs PC\npost-hydration. Extend to map \"super\" → \"Win\" on Windows and\n\"Super\" on Linux when the OS is known.",{"type":11,"tag":314,"props":551,"children":553},{"id":552},"_4-system-font-fallback",[554],{"type":17,"value":555},"4. System font fallback",{"type":11,"tag":23,"props":557,"children":558},{},[559],{"type":17,"value":560},"The TUX font stack today is brand-led (Maroon Sans + Inter \u002F system).\nFor native-feel touches inside chrome surfaces (titlebar text, menu\nitems, system dialogs), the host font should win:",{"type":11,"tag":321,"props":562,"children":563},{},[564,580,595],{"type":11,"tag":77,"props":565,"children":566},{},[567,571,573,579],{"type":11,"tag":27,"props":568,"children":569},{},[570],{"type":17,"value":521},{"type":17,"value":572},": ",{"type":11,"tag":177,"props":574,"children":576},{"className":575},[],[577],{"type":17,"value":578},"-apple-system, BlinkMacSystemFont, \"SF Pro\"",{"type":17,"value":110},{"type":11,"tag":77,"props":581,"children":582},{},[583,587,588,594],{"type":11,"tag":27,"props":584,"children":585},{},[586],{"type":17,"value":437},{"type":17,"value":572},{"type":11,"tag":177,"props":589,"children":591},{"className":590},[],[592],{"type":17,"value":593},"\"Segoe UI Variable Display\", \"Segoe UI\"",{"type":17,"value":110},{"type":11,"tag":77,"props":596,"children":597},{},[598,602,603,609],{"type":11,"tag":27,"props":599,"children":600},{},[601],{"type":17,"value":454},{"type":17,"value":572},{"type":11,"tag":177,"props":604,"children":606},{"className":605},[],[607],{"type":17,"value":608},"Inter, \"Ubuntu Sans\", system-ui",{"type":17,"value":610}," (Inter is already in\nTUX, so the cross-Linux variation is small).",{"type":11,"tag":23,"props":612,"children":613},{},[614,618,620,626,628,634,636,641],{"type":11,"tag":27,"props":615,"children":616},{},[617],{"type":17,"value":385},{"type":17,"value":619}," a ",{"type":11,"tag":177,"props":621,"children":623},{"className":622},[],[624],{"type":17,"value":625},"--font-system",{"type":17,"value":627}," token resolves to the\nright cascade per host. Brand surfaces (TuxPageHeader,\nTuxChartFrame display-face titles) keep ",{"type":11,"tag":177,"props":629,"children":631},{"className":630},[],[632],{"type":17,"value":633},"--font-brand",{"type":17,"value":635},"; chrome\nsurfaces use ",{"type":11,"tag":177,"props":637,"children":639},{"className":638},[],[640],{"type":17,"value":625},{"type":17,"value":110},{"type":11,"tag":314,"props":643,"children":645},{"id":644},"_5-drag-regions",[646],{"type":17,"value":647},"5. Drag regions",{"type":11,"tag":23,"props":649,"children":650},{},[651,653,659,661,667,669,675],{"type":17,"value":652},"Tauri custom titlebars need explicit ",{"type":11,"tag":177,"props":654,"children":656},{"className":655},[],[657],{"type":17,"value":658},"data-tauri-drag-region",{"type":17,"value":660},"\nmarkers on the titlebar element. Buttons inside (traffic lights,\nmin\u002Fmax\u002Fclose) need explicit ",{"type":11,"tag":177,"props":662,"children":664},{"className":663},[],[665],{"type":17,"value":666},"data-tauri-drag-region=\"false\"",{"type":17,"value":668}," to\nremain clickable. ",{"type":11,"tag":177,"props":670,"children":672},{"className":671},[],[673],{"type":17,"value":674},"TuxAppFrame",{"type":17,"value":676}," will handle this; consumers don't.",{"type":11,"tag":314,"props":678,"children":680},{"id":679},"_6-menu-bar-native-vs-in-window",[681],{"type":17,"value":682},"6. Menu bar (native vs in-window)",{"type":11,"tag":321,"props":684,"children":685},{},[686,702],{"type":11,"tag":77,"props":687,"children":688},{},[689,693,695,700],{"type":11,"tag":27,"props":690,"children":691},{},[692],{"type":17,"value":427},{"type":17,"value":694},": menu bar is at the ",{"type":11,"tag":27,"props":696,"children":697},{},[698],{"type":17,"value":699},"top of the screen",{"type":17,"value":701}," (system-wide\nstrip); Tauri populates it via the Rust side.",{"type":11,"tag":77,"props":703,"children":704},{},[705,709,711,716],{"type":11,"tag":27,"props":706,"children":707},{},[708],{"type":17,"value":531},{"type":17,"value":710},": menu bar lives ",{"type":11,"tag":27,"props":712,"children":713},{},[714],{"type":17,"value":715},"inside the window",{"type":17,"value":717},", either\nin the titlebar (modern Windows apps) or as a row below it\n(legacy \u002F GNOME).",{"type":11,"tag":23,"props":719,"children":720},{},[721,726,728],{"type":11,"tag":27,"props":722,"children":723},{},[724],{"type":17,"value":725},"Doctrine:",{"type":17,"value":727}," define menus in Tauri Rust config (",{"type":11,"tag":177,"props":729,"children":731},{"className":730},[],[732],{"type":17,"value":733},"tauri.conf.json",{"type":11,"tag":321,"props":735,"children":736},{},[737],{"type":11,"tag":77,"props":738,"children":739},{},[740,742,748,750,755,757,763],{"type":17,"value":741},"Rust menu builder). The Vue layer doesn't render a fake menu bar\n— it would conflict with the macOS system menu. For in-window\nfallback on Win\u002FLinux when a Tauri menu isn't set up, render a\n",{"type":11,"tag":177,"props":743,"children":745},{"className":744},[],[746],{"type":17,"value":747},"TuxMenuBar",{"type":17,"value":749}," component ",{"type":11,"tag":27,"props":751,"children":752},{},[753],{"type":17,"value":754},"only",{"type":17,"value":756}," if ",{"type":11,"tag":177,"props":758,"children":760},{"className":759},[],[761],{"type":17,"value":762},"platform.os !== \"mac\"",{"type":17,"value":110},{"type":11,"tag":314,"props":765,"children":767},{"id":766},"_7-accent-color-system-tints",[768],{"type":17,"value":769},"7. Accent color + system tints",{"type":11,"tag":23,"props":771,"children":772},{},[773,775,780],{"type":17,"value":774},"macOS and Windows 11 both expose a user-chosen accent color via\nthe OS. TUX's maroon is the brand anchor and ",{"type":11,"tag":27,"props":776,"children":777},{},[778],{"type":17,"value":779},"always wins",{"type":17,"value":781}," —\ndon't recolor TUX charts or CTAs to the system accent.",{"type":11,"tag":23,"props":783,"children":784},{},[785,787,792],{"type":17,"value":786},"Where the system accent ",{"type":11,"tag":27,"props":788,"children":789},{},[790],{"type":17,"value":791},"can",{"type":17,"value":793}," show through:",{"type":11,"tag":321,"props":795,"children":796},{},[797,802,814],{"type":11,"tag":77,"props":798,"children":799},{},[800],{"type":17,"value":801},"Selection highlight on text inputs (macOS draws this in accent;\nWindows uses the accent for input borders on focus).",{"type":11,"tag":77,"props":803,"children":804},{},[805,807,812],{"type":17,"value":806},"Native-feeling outline focus rings on chrome controls inside\n",{"type":11,"tag":177,"props":808,"children":810},{"className":809},[],[811],{"type":17,"value":674},{"type":17,"value":813}," (titlebar buttons).",{"type":11,"tag":77,"props":815,"children":816},{},[817],{"type":17,"value":818},"Nowhere else. The chart palette and CTA buttons stay maroon.",{"type":11,"tag":314,"props":820,"children":822},{"id":821},"_8-share-file-notification-apis",[823],{"type":17,"value":824},"8. Share \u002F file \u002F notification APIs",{"type":11,"tag":23,"props":826,"children":827},{},[828],{"type":17,"value":829},"These are Tauri-mediated, not CSS-driven. They affect components\nthat invoke them:",{"type":11,"tag":321,"props":831,"children":832},{},[833,844,855],{"type":11,"tag":77,"props":834,"children":835},{},[836,842],{"type":11,"tag":177,"props":837,"children":839},{"className":838},[],[840],{"type":17,"value":841},"TuxArtifact",{"type":17,"value":843}," \"Share\" action: uses the OS share sheet on\nApple\u002FAndroid, falls back to copy-link on Windows\u002FLinux.",{"type":11,"tag":77,"props":845,"children":846},{},[847,853],{"type":11,"tag":177,"props":848,"children":850},{"className":849},[],[851],{"type":17,"value":852},"TuxCodeBlock",{"type":17,"value":854}," \"Download\" + Tauri file dialogs.",{"type":11,"tag":77,"props":856,"children":857},{},[858,864,866,872],{"type":11,"tag":177,"props":859,"children":861},{"className":860},[],[862],{"type":17,"value":863},"TuxStatusToast",{"type":17,"value":865}," background notifications: prefer Tauri's\n",{"type":11,"tag":177,"props":867,"children":869},{"className":868},[],[870],{"type":17,"value":871},"notification",{"type":17,"value":873}," API on desktop hosts; fall back to in-app toast.",{"type":11,"tag":23,"props":875,"children":876},{},[877,879,885],{"type":17,"value":878},"Future doc: ",{"type":11,"tag":177,"props":880,"children":882},{"className":881},[],[883],{"type":17,"value":884},"design\u002Ftauri-bindings.md",{"type":17,"value":886}," will list which TUX\ncomponents call which Tauri APIs. For now, those bindings live in\nthe consumer app, not in TUX components themselves (TUX stays\nruntime-agnostic).",{"type":11,"tag":61,"props":888,"children":890},{"id":889},"the-detection-mechanism-usetuxplatform",[891,893],{"type":17,"value":892},"The detection mechanism: ",{"type":11,"tag":177,"props":894,"children":896},{"className":895},[],[897],{"type":17,"value":898},"useTuxPlatform()",{"type":11,"tag":23,"props":900,"children":901},{},[902],{"type":17,"value":903},"A future composable will surface the host environment to Vue\ncomponents:",{"type":11,"tag":905,"props":906,"children":910},"pre",{"className":907,"code":908,"language":909,"meta":6,"style":6},"language-ts shiki shiki-themes material-theme-lighter github-light github-dark","\u002F\u002F app\u002Fcomposables\u002FuseTuxPlatform.ts (not yet shipped)\nexport interface TuxPlatform {\n  \u002F** Coarse OS family for chrome decisions. *\u002F\n  os: \"mac\" | \"win\" | \"linux\" | \"ios\" | \"android\" | \"web\";\n  \u002F** Tauri runtime detected? If false, treat as plain web. *\u002F\n  tauri: boolean;\n  \u002F** Native UI rendering mode the host prefers. *\u002F\n  prefersOverlayScrollbars: boolean;\n  \u002F** ⌘ vs Ctrl primary modifier. *\u002F\n  primaryModifier: \"meta\" | \"ctrl\";\n  \u002F** User-set accent color from the OS, if exposed. *\u002F\n  accentColor?: string;\n}\n\nexport function useTuxPlatform(): Readonly\u003CTuxPlatform>;\n","ts",[911],{"type":11,"tag":177,"props":912,"children":913},{"__ignoreMap":6},[914,926,954,963,1087,1096,1119,1128,1149,1158,1205,1214,1237,1246,1256],{"type":11,"tag":915,"props":916,"children":919},"span",{"class":917,"line":918},"line",1,[920],{"type":11,"tag":915,"props":921,"children":923},{"style":922},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#6A737D;--shiki-default-font-style:inherit;--shiki-dark:#6A737D;--shiki-dark-font-style:inherit",[924],{"type":17,"value":925},"\u002F\u002F app\u002Fcomposables\u002FuseTuxPlatform.ts (not yet shipped)\n",{"type":11,"tag":915,"props":927,"children":929},{"class":917,"line":928},2,[930,936,942,948],{"type":11,"tag":915,"props":931,"children":933},{"style":932},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#D73A49;--shiki-default-font-style:inherit;--shiki-dark:#F97583;--shiki-dark-font-style:inherit",[934],{"type":17,"value":935},"export",{"type":11,"tag":915,"props":937,"children":939},{"style":938},"--shiki-light:#9C3EDA;--shiki-default:#D73A49;--shiki-dark:#F97583",[940],{"type":17,"value":941}," interface",{"type":11,"tag":915,"props":943,"children":945},{"style":944},"--shiki-light:#E2931D;--shiki-default:#6F42C1;--shiki-dark:#B392F0",[946],{"type":17,"value":947}," TuxPlatform",{"type":11,"tag":915,"props":949,"children":951},{"style":950},"--shiki-light:#39ADB5;--shiki-default:#24292E;--shiki-dark:#E1E4E8",[952],{"type":17,"value":953}," {\n",{"type":11,"tag":915,"props":955,"children":957},{"class":917,"line":956},3,[958],{"type":11,"tag":915,"props":959,"children":960},{"style":922},[961],{"type":17,"value":962},"  \u002F** Coarse OS family for chrome decisions. *\u002F\n",{"type":11,"tag":915,"props":964,"children":966},{"class":917,"line":965},4,[967,973,979,985,991,996,1001,1005,1010,1014,1018,1022,1027,1031,1035,1039,1044,1048,1052,1056,1061,1065,1069,1073,1078,1082],{"type":11,"tag":915,"props":968,"children":970},{"style":969},"--shiki-light:#E53935;--shiki-default:#E36209;--shiki-dark:#FFAB70",[971],{"type":17,"value":972},"  os",{"type":11,"tag":915,"props":974,"children":976},{"style":975},"--shiki-light:#39ADB5;--shiki-default:#D73A49;--shiki-dark:#F97583",[977],{"type":17,"value":978},":",{"type":11,"tag":915,"props":980,"children":982},{"style":981},"--shiki-light:#39ADB5;--shiki-default:#032F62;--shiki-dark:#9ECBFF",[983],{"type":17,"value":984}," \"",{"type":11,"tag":915,"props":986,"children":988},{"style":987},"--shiki-light:#91B859;--shiki-default:#032F62;--shiki-dark:#9ECBFF",[989],{"type":17,"value":990},"mac",{"type":11,"tag":915,"props":992,"children":993},{"style":981},[994],{"type":17,"value":995},"\"",{"type":11,"tag":915,"props":997,"children":998},{"style":975},[999],{"type":17,"value":1000}," |",{"type":11,"tag":915,"props":1002,"children":1003},{"style":981},[1004],{"type":17,"value":984},{"type":11,"tag":915,"props":1006,"children":1007},{"style":987},[1008],{"type":17,"value":1009},"win",{"type":11,"tag":915,"props":1011,"children":1012},{"style":981},[1013],{"type":17,"value":995},{"type":11,"tag":915,"props":1015,"children":1016},{"style":975},[1017],{"type":17,"value":1000},{"type":11,"tag":915,"props":1019,"children":1020},{"style":981},[1021],{"type":17,"value":984},{"type":11,"tag":915,"props":1023,"children":1024},{"style":987},[1025],{"type":17,"value":1026},"linux",{"type":11,"tag":915,"props":1028,"children":1029},{"style":981},[1030],{"type":17,"value":995},{"type":11,"tag":915,"props":1032,"children":1033},{"style":975},[1034],{"type":17,"value":1000},{"type":11,"tag":915,"props":1036,"children":1037},{"style":981},[1038],{"type":17,"value":984},{"type":11,"tag":915,"props":1040,"children":1041},{"style":987},[1042],{"type":17,"value":1043},"ios",{"type":11,"tag":915,"props":1045,"children":1046},{"style":981},[1047],{"type":17,"value":995},{"type":11,"tag":915,"props":1049,"children":1050},{"style":975},[1051],{"type":17,"value":1000},{"type":11,"tag":915,"props":1053,"children":1054},{"style":981},[1055],{"type":17,"value":984},{"type":11,"tag":915,"props":1057,"children":1058},{"style":987},[1059],{"type":17,"value":1060},"android",{"type":11,"tag":915,"props":1062,"children":1063},{"style":981},[1064],{"type":17,"value":995},{"type":11,"tag":915,"props":1066,"children":1067},{"style":975},[1068],{"type":17,"value":1000},{"type":11,"tag":915,"props":1070,"children":1071},{"style":981},[1072],{"type":17,"value":984},{"type":11,"tag":915,"props":1074,"children":1075},{"style":987},[1076],{"type":17,"value":1077},"web",{"type":11,"tag":915,"props":1079,"children":1080},{"style":981},[1081],{"type":17,"value":995},{"type":11,"tag":915,"props":1083,"children":1084},{"style":950},[1085],{"type":17,"value":1086},";\n",{"type":11,"tag":915,"props":1088,"children":1090},{"class":917,"line":1089},5,[1091],{"type":11,"tag":915,"props":1092,"children":1093},{"style":922},[1094],{"type":17,"value":1095},"  \u002F** Tauri runtime detected? If false, treat as plain web. *\u002F\n",{"type":11,"tag":915,"props":1097,"children":1099},{"class":917,"line":1098},6,[1100,1105,1109,1115],{"type":11,"tag":915,"props":1101,"children":1102},{"style":969},[1103],{"type":17,"value":1104},"  tauri",{"type":11,"tag":915,"props":1106,"children":1107},{"style":975},[1108],{"type":17,"value":978},{"type":11,"tag":915,"props":1110,"children":1112},{"style":1111},"--shiki-light:#E2931D;--shiki-default:#005CC5;--shiki-dark:#79B8FF",[1113],{"type":17,"value":1114}," boolean",{"type":11,"tag":915,"props":1116,"children":1117},{"style":950},[1118],{"type":17,"value":1086},{"type":11,"tag":915,"props":1120,"children":1122},{"class":917,"line":1121},7,[1123],{"type":11,"tag":915,"props":1124,"children":1125},{"style":922},[1126],{"type":17,"value":1127},"  \u002F** Native UI rendering mode the host prefers. *\u002F\n",{"type":11,"tag":915,"props":1129,"children":1131},{"class":917,"line":1130},8,[1132,1137,1141,1145],{"type":11,"tag":915,"props":1133,"children":1134},{"style":969},[1135],{"type":17,"value":1136},"  prefersOverlayScrollbars",{"type":11,"tag":915,"props":1138,"children":1139},{"style":975},[1140],{"type":17,"value":978},{"type":11,"tag":915,"props":1142,"children":1143},{"style":1111},[1144],{"type":17,"value":1114},{"type":11,"tag":915,"props":1146,"children":1147},{"style":950},[1148],{"type":17,"value":1086},{"type":11,"tag":915,"props":1150,"children":1152},{"class":917,"line":1151},9,[1153],{"type":11,"tag":915,"props":1154,"children":1155},{"style":922},[1156],{"type":17,"value":1157},"  \u002F** ⌘ vs Ctrl primary modifier. *\u002F\n",{"type":11,"tag":915,"props":1159,"children":1161},{"class":917,"line":1160},10,[1162,1167,1171,1175,1180,1184,1188,1192,1197,1201],{"type":11,"tag":915,"props":1163,"children":1164},{"style":969},[1165],{"type":17,"value":1166},"  primaryModifier",{"type":11,"tag":915,"props":1168,"children":1169},{"style":975},[1170],{"type":17,"value":978},{"type":11,"tag":915,"props":1172,"children":1173},{"style":981},[1174],{"type":17,"value":984},{"type":11,"tag":915,"props":1176,"children":1177},{"style":987},[1178],{"type":17,"value":1179},"meta",{"type":11,"tag":915,"props":1181,"children":1182},{"style":981},[1183],{"type":17,"value":995},{"type":11,"tag":915,"props":1185,"children":1186},{"style":975},[1187],{"type":17,"value":1000},{"type":11,"tag":915,"props":1189,"children":1190},{"style":981},[1191],{"type":17,"value":984},{"type":11,"tag":915,"props":1193,"children":1194},{"style":987},[1195],{"type":17,"value":1196},"ctrl",{"type":11,"tag":915,"props":1198,"children":1199},{"style":981},[1200],{"type":17,"value":995},{"type":11,"tag":915,"props":1202,"children":1203},{"style":950},[1204],{"type":17,"value":1086},{"type":11,"tag":915,"props":1206,"children":1208},{"class":917,"line":1207},11,[1209],{"type":11,"tag":915,"props":1210,"children":1211},{"style":922},[1212],{"type":17,"value":1213},"  \u002F** User-set accent color from the OS, if exposed. *\u002F\n",{"type":11,"tag":915,"props":1215,"children":1217},{"class":917,"line":1216},12,[1218,1223,1228,1233],{"type":11,"tag":915,"props":1219,"children":1220},{"style":969},[1221],{"type":17,"value":1222},"  accentColor",{"type":11,"tag":915,"props":1224,"children":1225},{"style":975},[1226],{"type":17,"value":1227},"?:",{"type":11,"tag":915,"props":1229,"children":1230},{"style":1111},[1231],{"type":17,"value":1232}," string",{"type":11,"tag":915,"props":1234,"children":1235},{"style":950},[1236],{"type":17,"value":1086},{"type":11,"tag":915,"props":1238,"children":1240},{"class":917,"line":1239},13,[1241],{"type":11,"tag":915,"props":1242,"children":1243},{"style":950},[1244],{"type":17,"value":1245},"}\n",{"type":11,"tag":915,"props":1247,"children":1249},{"class":917,"line":1248},14,[1250],{"type":11,"tag":915,"props":1251,"children":1253},{"emptyLinePlaceholder":1252},true,[1254],{"type":17,"value":1255},"\n",{"type":11,"tag":915,"props":1257,"children":1259},{"class":917,"line":1258},15,[1260,1264,1269,1275,1280,1284,1289,1294,1299],{"type":11,"tag":915,"props":1261,"children":1262},{"style":932},[1263],{"type":17,"value":935},{"type":11,"tag":915,"props":1265,"children":1266},{"style":938},[1267],{"type":17,"value":1268}," function",{"type":11,"tag":915,"props":1270,"children":1272},{"style":1271},"--shiki-light:#6182B8;--shiki-default:#6F42C1;--shiki-dark:#B392F0",[1273],{"type":17,"value":1274}," useTuxPlatform",{"type":11,"tag":915,"props":1276,"children":1277},{"style":950},[1278],{"type":17,"value":1279},"()",{"type":11,"tag":915,"props":1281,"children":1282},{"style":975},[1283],{"type":17,"value":978},{"type":11,"tag":915,"props":1285,"children":1286},{"style":944},[1287],{"type":17,"value":1288}," Readonly",{"type":11,"tag":915,"props":1290,"children":1291},{"style":950},[1292],{"type":17,"value":1293},"\u003C",{"type":11,"tag":915,"props":1295,"children":1296},{"style":944},[1297],{"type":17,"value":1298},"TuxPlatform",{"type":11,"tag":915,"props":1300,"children":1301},{"style":950},[1302],{"type":17,"value":1303},">;\n",{"type":11,"tag":23,"props":1305,"children":1306},{},[1307,1312,1314,1319,1321,1326,1328,1334,1336,1342,1343,1349],{"type":11,"tag":27,"props":1308,"children":1309},{},[1310],{"type":17,"value":1311},"SSR safety:",{"type":17,"value":1313}," detection runs ",{"type":11,"tag":27,"props":1315,"children":1316},{},[1317],{"type":17,"value":1318},"post-hydration only",{"type":17,"value":1320}," (same\ntrade-off ",{"type":11,"tag":177,"props":1322,"children":1324},{"className":1323},[],[1325],{"type":17,"value":547},{"type":17,"value":1327}," already makes). Server renders a neutral\ndefault (",{"type":11,"tag":177,"props":1329,"children":1331},{"className":1330},[],[1332],{"type":17,"value":1333},"os: \"web\"",{"type":17,"value":1335},", ",{"type":11,"tag":177,"props":1337,"children":1339},{"className":1338},[],[1340],{"type":17,"value":1341},"tauri: false",{"type":17,"value":1335},{"type":11,"tag":177,"props":1344,"children":1346},{"className":1345},[],[1347],{"type":17,"value":1348},"primaryModifier: \"ctrl\"",{"type":17,"value":1350},"),\nclient swaps after mount. Components that need pre-render\nplatform-correctness (rare) should accept the default and update\nin-place.",{"type":11,"tag":23,"props":1352,"children":1353},{},[1354,1359,1360,1366,1368,1374,1376,1381,1383,1389],{"type":11,"tag":27,"props":1355,"children":1356},{},[1357],{"type":17,"value":1358},"Tauri detection:",{"type":17,"value":260},{"type":11,"tag":177,"props":1361,"children":1363},{"className":1362},[],[1364],{"type":17,"value":1365},"window.__TAURI_INTERNALS__",{"type":17,"value":1367}," or the\n",{"type":11,"tag":177,"props":1369,"children":1371},{"className":1370},[],[1372],{"type":17,"value":1373},"@tauri-apps\u002Fapi\u002Fos",{"type":17,"value":1375}," import. Plain web sets ",{"type":11,"tag":177,"props":1377,"children":1379},{"className":1378},[],[1380],{"type":17,"value":1341},{"type":17,"value":1382}," and OS\nfalls back to ",{"type":11,"tag":177,"props":1384,"children":1386},{"className":1385},[],[1387],{"type":17,"value":1388},"navigator.userAgent",{"type":17,"value":1390}," parsing.",{"type":11,"tag":23,"props":1392,"children":1393},{},[1394,1399,1401,1407,1409,1414],{"type":11,"tag":27,"props":1395,"children":1396},{},[1397],{"type":17,"value":1398},"Body attribute:",{"type":17,"value":1400}," the composable sets\n",{"type":11,"tag":177,"props":1402,"children":1404},{"className":1403},[],[1405],{"type":17,"value":1406},"document.documentElement.dataset.platform = os",{"type":17,"value":1408}," after mount, so\n",{"type":11,"tag":27,"props":1410,"children":1411},{},[1412],{"type":17,"value":1413},"CSS can branch",{"type":17,"value":1415}," without each component asking JS:",{"type":11,"tag":905,"props":1417,"children":1421},{"className":1418,"code":1419,"language":1420,"meta":6,"style":6},"language-css shiki shiki-themes material-theme-lighter github-light github-dark",":root[data-platform=\"mac\"] ::-webkit-scrollbar { \u002F* overlay *\u002F }\n:root[data-platform=\"win\"] ::-webkit-scrollbar { \u002F* persistent *\u002F }\n","css",[1422],{"type":11,"tag":177,"props":1423,"children":1424},{"__ignoreMap":6},[1425,1495],{"type":11,"tag":915,"props":1426,"children":1427},{"class":917,"line":918},[1428,1433,1438,1443,1448,1453,1457,1461,1465,1470,1475,1480,1485,1490],{"type":11,"tag":915,"props":1429,"children":1431},{"style":1430},"--shiki-light:#39ADB5;--shiki-default:#6F42C1;--shiki-dark:#B392F0",[1432],{"type":17,"value":978},{"type":11,"tag":915,"props":1434,"children":1436},{"style":1435},"--shiki-light:#9C3EDA;--shiki-default:#6F42C1;--shiki-dark:#B392F0",[1437],{"type":17,"value":8},{"type":11,"tag":915,"props":1439,"children":1440},{"style":950},[1441],{"type":17,"value":1442},"[",{"type":11,"tag":915,"props":1444,"children":1445},{"style":1435},[1446],{"type":17,"value":1447},"data-platform",{"type":11,"tag":915,"props":1449,"children":1450},{"style":975},[1451],{"type":17,"value":1452},"=",{"type":11,"tag":915,"props":1454,"children":1455},{"style":981},[1456],{"type":17,"value":995},{"type":11,"tag":915,"props":1458,"children":1459},{"style":987},[1460],{"type":17,"value":990},{"type":11,"tag":915,"props":1462,"children":1463},{"style":981},[1464],{"type":17,"value":995},{"type":11,"tag":915,"props":1466,"children":1467},{"style":950},[1468],{"type":17,"value":1469},"]",{"type":11,"tag":915,"props":1471,"children":1472},{"style":1430},[1473],{"type":17,"value":1474}," ::",{"type":11,"tag":915,"props":1476,"children":1477},{"style":1435},[1478],{"type":17,"value":1479},"-webkit-scrollbar",{"type":11,"tag":915,"props":1481,"children":1482},{"style":950},[1483],{"type":17,"value":1484}," {",{"type":11,"tag":915,"props":1486,"children":1487},{"style":922},[1488],{"type":17,"value":1489}," \u002F* overlay *\u002F",{"type":11,"tag":915,"props":1491,"children":1492},{"style":950},[1493],{"type":17,"value":1494}," }\n",{"type":11,"tag":915,"props":1496,"children":1497},{"class":917,"line":928},[1498,1502,1506,1510,1514,1518,1522,1526,1530,1534,1538,1542,1546,1551],{"type":11,"tag":915,"props":1499,"children":1500},{"style":1430},[1501],{"type":17,"value":978},{"type":11,"tag":915,"props":1503,"children":1504},{"style":1435},[1505],{"type":17,"value":8},{"type":11,"tag":915,"props":1507,"children":1508},{"style":950},[1509],{"type":17,"value":1442},{"type":11,"tag":915,"props":1511,"children":1512},{"style":1435},[1513],{"type":17,"value":1447},{"type":11,"tag":915,"props":1515,"children":1516},{"style":975},[1517],{"type":17,"value":1452},{"type":11,"tag":915,"props":1519,"children":1520},{"style":981},[1521],{"type":17,"value":995},{"type":11,"tag":915,"props":1523,"children":1524},{"style":987},[1525],{"type":17,"value":1009},{"type":11,"tag":915,"props":1527,"children":1528},{"style":981},[1529],{"type":17,"value":995},{"type":11,"tag":915,"props":1531,"children":1532},{"style":950},[1533],{"type":17,"value":1469},{"type":11,"tag":915,"props":1535,"children":1536},{"style":1430},[1537],{"type":17,"value":1474},{"type":11,"tag":915,"props":1539,"children":1540},{"style":1435},[1541],{"type":17,"value":1479},{"type":11,"tag":915,"props":1543,"children":1544},{"style":950},[1545],{"type":17,"value":1484},{"type":11,"tag":915,"props":1547,"children":1548},{"style":922},[1549],{"type":17,"value":1550}," \u002F* persistent *\u002F",{"type":11,"tag":915,"props":1552,"children":1553},{"style":950},[1554],{"type":17,"value":1494},{"type":11,"tag":61,"props":1556,"children":1558},{"id":1557},"what-we-dont-do",[1559],{"type":17,"value":1560},"What we don't do",{"type":11,"tag":321,"props":1562,"children":1563},{},[1564,1574,1584,1615,1632],{"type":11,"tag":77,"props":1565,"children":1566},{},[1567,1572],{"type":11,"tag":27,"props":1568,"children":1569},{},[1570],{"type":17,"value":1571},"Don't fork the codebase per OS.",{"type":17,"value":1573}," One component tree, branched\nat the chrome layer. The component author writes one Vue file.",{"type":11,"tag":77,"props":1575,"children":1576},{},[1577,1582],{"type":11,"tag":27,"props":1578,"children":1579},{},[1580],{"type":17,"value":1581},"Don't compile to platform-native widgets.",{"type":17,"value":1583}," No SwiftUI \u002F WinUI \u002F\nCompose targets. Tauri's WebView is our native runtime; we don't\nre-implement components in three other frameworks.",{"type":11,"tag":77,"props":1585,"children":1586},{},[1587,1592,1594,1609,1613],{"type":11,"tag":27,"props":1588,"children":1589},{},[1590],{"type":17,"value":1591},"Don't adopt the host's visual language wholesale.",{"type":17,"value":1593}," macOS 26's\nLiquid Glass is striking but **conflicts with TUX paper grain",{"type":11,"tag":321,"props":1595,"children":1596},{},[1597],{"type":11,"tag":77,"props":1598,"children":1599},{},[1600,1602,1607],{"type":17,"value":1601},"maroon signature rule**. We absorb Liquid Glass for the\n",{"type":11,"tag":262,"props":1603,"children":1604},{},[1605],{"type":17,"value":1606},"interaction patterns",{"type":17,"value":1608}," (drag, traffic lights, sheet animations)\n— not the translucent material itself.",{"type":11,"tag":1610,"props":1611,"children":1612},"br",{},[],{"type":17,"value":1614},"Same for Material 3's elevation-as-color, dynamic theming from\nwallpaper, and Fluent's Mica\u002FAcrylic. We're not transparent. The\nTUX surface is paper.",{"type":11,"tag":77,"props":1616,"children":1617},{},[1618,1623,1625,1630],{"type":11,"tag":27,"props":1619,"children":1620},{},[1621],{"type":17,"value":1622},"Don't render a fake macOS menu bar at the top of a Vue app.",{"type":17,"value":1624},"\nmacOS users expect the system menu strip. Render menus in Tauri\nRust config; on Win\u002FLinux, optionally render ",{"type":11,"tag":177,"props":1626,"children":1628},{"className":1627},[],[1629],{"type":17,"value":747},{"type":17,"value":1631},"\nin-window.",{"type":11,"tag":77,"props":1633,"children":1634},{},[1635,1640],{"type":11,"tag":27,"props":1636,"children":1637},{},[1638],{"type":17,"value":1639},"Don't gate functionality on Tauri.",{"type":17,"value":1641}," Every TUX component must\nwork in plain web (Nuxt SSR + browser). Tauri-only enhancements\n(share sheet, native notification, file dialog) are progressive\nenrichments — the fallback path is always plain HTML.",{"type":11,"tag":61,"props":1643,"children":1645},{"id":1644},"what-we-will-ship-roadmap-deferred-to-consumer-pull",[1646],{"type":17,"value":1647},"What we will ship (roadmap, deferred to consumer pull)",{"type":11,"tag":23,"props":1649,"children":1650},{},[1651],{"type":17,"value":1652},"In rough dependency order. Each item ships when a consumer app\nactually needs it — not pre-emptively.",{"type":11,"tag":73,"props":1654,"children":1655},{},[1656,1671,1707,1729,1744,1757,1783],{"type":11,"tag":77,"props":1657,"children":1658},{},[1659,1669],{"type":11,"tag":27,"props":1660,"children":1661},{},[1662,1667],{"type":11,"tag":177,"props":1663,"children":1665},{"className":1664},[],[1666],{"type":17,"value":898},{"type":17,"value":1668}," composable",{"type":17,"value":1670}," — the detection layer. Lands\nfirst since every other piece depends on it.",{"type":11,"tag":77,"props":1672,"children":1673},{},[1674,1682,1684,1690,1691,1697,1699,1705],{"type":11,"tag":27,"props":1675,"children":1676},{},[1677],{"type":11,"tag":177,"props":1678,"children":1680},{"className":1679},[],[1681],{"type":17,"value":674},{"type":17,"value":1683}," — Tauri custom-titlebar wrapper. Renders\ntraffic lights left on Mac, min\u002Fmax\u002Fclose right on Win, follows\nDE on Linux. Accepts ",{"type":11,"tag":177,"props":1685,"children":1687},{"className":1686},[],[1688],{"type":17,"value":1689},"#left",{"type":17,"value":1335},{"type":11,"tag":177,"props":1692,"children":1694},{"className":1693},[],[1695],{"type":17,"value":1696},"#center",{"type":17,"value":1698}," (title), ",{"type":11,"tag":177,"props":1700,"children":1702},{"className":1701},[],[1703],{"type":17,"value":1704},"#right",{"type":17,"value":1706},"\nslots. Sets drag regions. Owns the platform-specific window\nchrome.",{"type":11,"tag":77,"props":1708,"children":1709},{},[1710,1720,1722,1727],{"type":11,"tag":27,"props":1711,"children":1712},{},[1713,1718],{"type":11,"tag":177,"props":1714,"children":1716},{"className":1715},[],[1717],{"type":17,"value":470},{"type":17,"value":1719}," utility + tokens",{"type":17,"value":1721}," — ",{"type":11,"tag":177,"props":1723,"children":1725},{"className":1724},[],[1726],{"type":17,"value":478},{"type":17,"value":1728},"\nstyles per platform. Doctrine: respect host expectations.",{"type":11,"tag":77,"props":1730,"children":1731},{},[1732,1742],{"type":11,"tag":27,"props":1733,"children":1734},{},[1735,1740],{"type":11,"tag":177,"props":1736,"children":1738},{"className":1737},[],[1739],{"type":17,"value":547},{"type":17,"value":1741}," extension",{"type":17,"value":1743}," — map \"super\" key, \"win\" key on\nWindows \u002F Linux. Today Mac\u002FPC only.",{"type":11,"tag":77,"props":1745,"children":1746},{},[1747,1755],{"type":11,"tag":27,"props":1748,"children":1749},{},[1750],{"type":11,"tag":177,"props":1751,"children":1753},{"className":1752},[],[1754],{"type":17,"value":747},{"type":17,"value":1756}," — in-window menu strip for Win\u002FLinux when\nTauri Rust menus aren't set up. Skipped on macOS.",{"type":11,"tag":77,"props":1758,"children":1759},{},[1760,1765,1767,1773,1775,1781],{"type":11,"tag":27,"props":1761,"children":1762},{},[1763],{"type":17,"value":1764},"Accent-color binding",{"type":17,"value":1766}," — let ",{"type":11,"tag":177,"props":1768,"children":1770},{"className":1769},[],[1771],{"type":17,"value":1772},"--accent-system",{"type":17,"value":1774}," resolve to the\nOS accent (via Tauri or ",{"type":11,"tag":177,"props":1776,"children":1778},{"className":1777},[],[1779],{"type":17,"value":1780},"accentcolor",{"type":17,"value":1782}," CSS media query). Brand\nmaroon stays; accent appears in chrome controls only.",{"type":11,"tag":77,"props":1784,"children":1785},{},[1786,1794],{"type":11,"tag":27,"props":1787,"children":1788},{},[1789],{"type":11,"tag":177,"props":1790,"children":1792},{"className":1791},[],[1793],{"type":17,"value":884},{"type":17,"value":1795}," — companion doc enumerating which\nTUX components call which Tauri APIs and how the web fallback\nworks.",{"type":11,"tag":61,"props":1797,"children":1799},{"id":1798},"why-not-just-use-tauris-default-decorations",[1800],{"type":17,"value":1801},"Why not just use Tauri's default decorations",{"type":11,"tag":23,"props":1803,"children":1804},{},[1805],{"type":17,"value":1806},"Tauri can run with native window decorations (the OS-drawn\ntitlebar). That works, but:",{"type":11,"tag":321,"props":1808,"children":1809},{},[1810,1815,1820,1825],{"type":11,"tag":77,"props":1811,"children":1812},{},[1813],{"type":17,"value":1814},"The titlebar height varies by OS (28px Mac, ~32px Win, varies\nLinux) — content layout has to react.",{"type":11,"tag":77,"props":1816,"children":1817},{},[1818],{"type":17,"value":1819},"The titlebar font differs from TUX brand surfaces.",{"type":11,"tag":77,"props":1821,"children":1822},{},[1823],{"type":17,"value":1824},"The titlebar can't host TUX-branded surfaces (eyebrow + display-\nface title + signature rule).",{"type":11,"tag":77,"props":1826,"children":1827},{},[1828],{"type":17,"value":1829},"We can't put context (breadcrumb \u002F search \u002F tab strip) in the\ntitlebar when the OS draws it.",{"type":11,"tag":23,"props":1831,"children":1832},{},[1833,1835,1840,1842,1847],{"type":17,"value":1834},"For Landscape-class research apps, a ",{"type":11,"tag":27,"props":1836,"children":1837},{},[1838],{"type":17,"value":1839},"custom titlebar with TUX\nbrand + platform-correct controls",{"type":17,"value":1841}," is the right shape.\n",{"type":11,"tag":177,"props":1843,"children":1845},{"className":1844},[],[1846],{"type":17,"value":674},{"type":17,"value":1848}," is that wrapper.",{"type":11,"tag":61,"props":1850,"children":1852},{"id":1851},"why-not-native-multi-platform-implementations",[1853],{"type":17,"value":1854},"Why not native multi-platform implementations",{"type":11,"tag":23,"props":1856,"children":1857},{},[1858],{"type":17,"value":1859},"We considered shipping SwiftUI \u002F WinUI \u002F Compose mirrors of TUX\ncomponents — one code path per OS, sharing tokens only. Rejected\nbecause:",{"type":11,"tag":321,"props":1861,"children":1862},{},[1863,1873,1883],{"type":11,"tag":77,"props":1864,"children":1865},{},[1866,1871],{"type":11,"tag":27,"props":1867,"children":1868},{},[1869],{"type":17,"value":1870},"3× the surface to maintain",{"type":17,"value":1872}," for the same TTI brand outcome.",{"type":11,"tag":77,"props":1874,"children":1875},{},[1876,1881],{"type":11,"tag":27,"props":1877,"children":1878},{},[1879],{"type":17,"value":1880},"Web parity matters more than native parity.",{"type":17,"value":1882}," Web is where\nLandscape lives day-to-day; the Tauri shell is a packaging\ndetail.",{"type":11,"tag":77,"props":1884,"children":1885},{},[1886,1891],{"type":11,"tag":27,"props":1887,"children":1888},{},[1889],{"type":17,"value":1890},"WebView fidelity in 2026 is high.",{"type":17,"value":1892}," WKWebView (Apple), WebView2\n(Microsoft), and WebKitGTK (Linux) render modern CSS uniformly\nenough that a Vue component looks the same in all three.",{"type":11,"tag":23,"props":1894,"children":1895},{},[1896],{"type":17,"value":1897},"The trade-off is accepted: Tauri WebView is the runtime. Native\nplatform implementations are not on the roadmap.",{"type":11,"tag":61,"props":1899,"children":1901},{"id":1900},"references",[1902],{"type":17,"value":1903},"References",{"type":11,"tag":23,"props":1905,"children":1906},{},[1907],{"type":17,"value":1908},"This doctrine cites and is grounded by these absorbed Figma files:",{"type":11,"tag":321,"props":1910,"children":1911},{},[1912,1924,1934,1945,1956,1967,1978,1989,2000,2011],{"type":11,"tag":77,"props":1913,"children":1914},{},[1915,1922],{"type":11,"tag":1916,"props":1917,"children":1919},"a",{"href":1918},"..\u002Freference\u002Ffigma-cache\u002Fwindows-ui-kit\u002FNOTES.md",[1920],{"type":17,"value":1921},"Windows UI kit",{"type":17,"value":1923}," —\nWin11 25H2 chrome, Segoe UI Variable, snap layouts, Mica.",{"type":11,"tag":77,"props":1925,"children":1926},{},[1927,1932],{"type":11,"tag":1916,"props":1928,"children":1930},{"href":1929},"..\u002Freference\u002Ffigma-cache\u002Fmacos-26\u002FNOTES.md",[1931],{"type":17,"value":331},{"type":17,"value":1933}," — Liquid\nGlass, traffic lights, sheet animations, San Francisco font.",{"type":11,"tag":77,"props":1935,"children":1936},{},[1937,1943],{"type":11,"tag":1916,"props":1938,"children":1940},{"href":1939},"..\u002Freference\u002Ffigma-cache\u002Fios-26-liquid-glass\u002FNOTES.md",[1941],{"type":17,"value":1942},"iOS 26 Liquid Glass",{"type":17,"value":1944},"\n— refractive materials, depth.",{"type":11,"tag":77,"props":1946,"children":1947},{},[1948,1954],{"type":11,"tag":1916,"props":1949,"children":1951},{"href":1950},"..\u002Freference\u002Ffigma-cache\u002Fios-and-ipados-26\u002FNOTES.md",[1952],{"type":17,"value":1953},"iOS and iPadOS 26",{"type":17,"value":1955}," —\nsafe areas, bottom sheets, action sheets.",{"type":11,"tag":77,"props":1957,"children":1958},{},[1959,1965],{"type":11,"tag":1916,"props":1960,"children":1962},{"href":1961},"..\u002Freference\u002Ffigma-cache\u002Fmaterial-3-design-kit\u002FNOTES.md",[1963],{"type":17,"value":1964},"Material 3 Design Kit",{"type":17,"value":1966}," —\nAndroid gestures, elevation-as-color (rejected), motion tokens.",{"type":11,"tag":77,"props":1968,"children":1969},{},[1970,1976],{"type":11,"tag":1916,"props":1971,"children":1973},{"href":1972},"..\u002Freference\u002Ffigma-cache\u002Fandroid-ui-kit\u002FNOTES.md",[1974],{"type":17,"value":1975},"Android UI Kit",{"type":17,"value":1977}," —\nstatus bar, bottom nav, FAB.",{"type":11,"tag":77,"props":1979,"children":1980},{},[1981,1987],{"type":11,"tag":1916,"props":1982,"children":1984},{"href":1983},"..\u002Freference\u002Ffigma-cache\u002Fscrollbar-kit-macos-windows\u002FNOTES.md",[1985],{"type":17,"value":1986},"Scrollbar Kit MacOS & Windows",{"type":17,"value":1988}," —\nconcrete scrollbar specs per host.",{"type":11,"tag":77,"props":1990,"children":1991},{},[1992,1998],{"type":11,"tag":1916,"props":1993,"children":1995},{"href":1994},"..\u002Freference\u002Ffigma-cache\u002Ftailwind-headless-ui-with-animations\u002FNOTES.md",[1996],{"type":17,"value":1997},"Tailwind Headless UI with Animations",{"type":17,"value":1999}," —\nmotion primitives + reduced-motion fallbacks.",{"type":11,"tag":77,"props":2001,"children":2002},{},[2003,2009],{"type":11,"tag":1916,"props":2004,"children":2006},{"href":2005},"..\u002Freference\u002Ffigma-cache\u002Fui-prep-layout-grids-8-0\u002FNOTES.md",[2007],{"type":17,"value":2008},"UI Prep Layout Grids 8.0",{"type":17,"value":2010}," —\n12-col grid reference.",{"type":11,"tag":77,"props":2012,"children":2013},{},[2014,2020],{"type":11,"tag":1916,"props":2015,"children":2017},{"href":2016},"..\u002Freference\u002Ffigma-cache\u002Fvisionos-26\u002FNOTES.md",[2018],{"type":17,"value":2019},"visionOS 26",{"type":17,"value":2021}," —\nout-of-scope; capture depth + parallax patterns for future-proofing.",{"type":11,"tag":2023,"props":2024,"children":2025},"style",{},[2026],{"type":17,"value":2027},"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);}",{"title":6,"searchDepth":928,"depth":928,"links":2029},[2030,2031,2032,2042,2044,2045,2046,2047,2048],{"id":63,"depth":928,"text":66},{"id":118,"depth":928,"text":121},{"id":304,"depth":928,"text":307,"children":2033},[2034,2035,2036,2037,2038,2039,2040,2041],{"id":316,"depth":956,"text":319},{"id":413,"depth":956,"text":416},{"id":507,"depth":956,"text":510},{"id":552,"depth":956,"text":555},{"id":644,"depth":956,"text":647},{"id":679,"depth":956,"text":682},{"id":766,"depth":956,"text":769},{"id":821,"depth":956,"text":824},{"id":889,"depth":928,"text":2043},"The detection mechanism: useTuxPlatform()",{"id":1557,"depth":928,"text":1560},{"id":1644,"depth":928,"text":1647},{"id":1798,"depth":928,"text":1801},{"id":1851,"depth":928,"text":1854},{"id":1900,"depth":928,"text":1903},1788285289221]