[{"data":1,"prerenderedAt":822},["ShallowReactive",2],{"navigation":3,"\u002Fcomposables\u002Fuse-safe-area":489,"\u002Fcomposables\u002Fuse-safe-area-surround":817},[4,34,51,317,343,348,353,431],{"title":5,"path":6,"stem":7,"children":8,"package":11,"category":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,"category":11,"icon":12},"Introduction",null,"i-lucide-house",{"title":14,"path":15,"stem":16,"package":11,"category":11,"icon":17},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation","i-lucide-download",{"title":19,"path":20,"stem":21,"package":11,"category":11,"icon":22},"Icons","\u002Fgetting-started\u002Ficons","1.getting-started\u002F3.icons","i-lucide-sparkles",{"title":24,"path":25,"stem":26,"package":11,"category":11,"icon":27},"CLI","\u002Fgetting-started\u002Fcli","1.getting-started\u002F4.cli","i-lucide-terminal",{"title":29,"path":30,"stem":31,"package":11,"category":11,"icon":32},"Roadmap","\u002Fgetting-started\u002Froadmap","1.getting-started\u002F5.roadmap","i-lucide-map","i-lucide-rocket",{"title":35,"package":11,"category":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,"category":11,"icon":44},"@vyui\u002Fcore","\u002Fpackages\u002Fcore","2.packages\u002F1.core","i-lucide-box",{"title":46,"path":47,"stem":48,"package":11,"category":11,"icon":49},"@vyui\u002Fkit","\u002Fpackages\u002Fkit","2.packages\u002F2.kit","i-lucide-layers",false,{"title":52,"package":11,"category":11,"icon":53,"path":54,"stem":55,"children":56},"Components","i-lucide-layout-grid","\u002Fcomponents","3.components",[57,59,66,72,78,84,89,94,99,105,111,116,121,126,131,137,142,147,152,156,161,165,170,175,180,185,190,195,200,204,209,214,219,224,229,234,239,244,249,254,258,262,267,272,277,282,287,292,296,300,304,308,312],{"title":52,"path":54,"stem":58,"package":11,"category":11,"icon":53},"3.components\u002Findex",{"title":60,"path":61,"stem":62,"package":63,"category":64,"icon":65},"Accordion","\u002Fcomponents\u002Faccordion","3.components\u002Faccordion","kit","Navigation","i-lucide-list-collapse",{"title":67,"path":68,"stem":69,"package":63,"category":70,"icon":71},"Alert","\u002Fcomponents\u002Falert","3.components\u002Falert","Data Display","i-lucide-triangle-alert",{"title":73,"path":74,"stem":75,"package":76,"category":77,"icon":71},"Alert Dialog","\u002Fcomponents\u002Falert-dialog","3.components\u002Falert-dialog","core","Overlay",{"title":79,"path":80,"stem":81,"package":63,"category":82,"icon":83},"App","\u002Fcomponents\u002Fapp","3.components\u002Fapp","Layout","i-lucide-smartphone",{"title":85,"path":86,"stem":87,"package":63,"category":82,"icon":88},"Aspect Ratio","\u002Fcomponents\u002Faspect-ratio","3.components\u002Faspect-ratio","i-lucide-ratio",{"title":90,"path":91,"stem":92,"package":63,"category":70,"icon":93},"Avatar","\u002Fcomponents\u002Favatar","3.components\u002Favatar","i-lucide-circle-user-round",{"title":95,"path":96,"stem":97,"package":63,"category":70,"icon":98},"Avatar Group","\u002Fcomponents\u002Favatar-group","3.components\u002Favatar-group","i-lucide-users-round",{"title":100,"path":101,"stem":102,"package":63,"category":103,"icon":104},"Button","\u002Fcomponents\u002Fbutton","3.components\u002Fbutton","Buttons","i-lucide-square-mouse-pointer",{"title":106,"path":107,"stem":108,"package":63,"category":109,"icon":110},"Calendar","\u002Fcomponents\u002Fcalendar","3.components\u002Fcalendar","Form","i-lucide-calendar-days",{"title":112,"path":113,"stem":114,"package":63,"category":82,"icon":115},"Card","\u002Fcomponents\u002Fcard","3.components\u002Fcard","i-lucide-square",{"title":117,"path":118,"stem":119,"package":63,"category":109,"icon":120},"Checkbox","\u002Fcomponents\u002Fcheckbox","3.components\u002Fcheckbox","i-lucide-square-check",{"title":122,"path":123,"stem":124,"package":76,"category":64,"icon":125},"Collapsible","\u002Fcomponents\u002Fcollapsible","3.components\u002Fcollapsible","i-lucide-chevrons-down-up",{"title":127,"path":128,"stem":129,"package":76,"category":77,"icon":130},"Dialog","\u002Fcomponents\u002Fdialog","3.components\u002Fdialog","i-lucide-app-window",{"title":132,"path":133,"stem":134,"package":76,"category":135,"icon":136},"Draggable","\u002Fcomponents\u002Fdraggable","3.components\u002Fdraggable","Gestures & Lists","i-lucide-move",{"title":138,"path":139,"stem":140,"package":63,"category":77,"icon":141},"Drawer","\u002Fcomponents\u002Fdrawer","3.components\u002Fdrawer","i-lucide-panel-bottom",{"title":143,"path":144,"stem":145,"package":63,"category":77,"icon":146},"Dropdown Menu","\u002Fcomponents\u002Fdropdown-menu","3.components\u002Fdropdown-menu","i-lucide-menu",{"title":148,"path":149,"stem":150,"package":63,"category":135,"icon":151},"Feed List","\u002Fcomponents\u002Ffeed-list","3.components\u002Ffeed-list","i-lucide-list",{"title":109,"path":153,"stem":154,"package":63,"category":109,"icon":155},"\u002Fcomponents\u002Fform","3.components\u002Fform","i-lucide-clipboard-list",{"title":157,"path":158,"stem":159,"package":63,"category":109,"icon":160},"Form Field","\u002Fcomponents\u002Fform-field","3.components\u002Fform-field","i-lucide-form-input",{"title":162,"path":163,"stem":164,"package":76,"category":70,"icon":22},"Icon","\u002Fcomponents\u002Ficon","3.components\u002Ficon",{"title":166,"path":167,"stem":168,"package":63,"category":109,"icon":169},"Input","\u002Fcomponents\u002Finput","3.components\u002Finput","i-lucide-text-cursor-input",{"title":171,"path":172,"stem":173,"package":63,"category":174,"icon":141},"Island","\u002Fcomponents\u002Fisland","3.components\u002Fisland","Dynamic Island",{"title":176,"path":177,"stem":178,"package":63,"category":174,"icon":179},"Island Button","\u002Fcomponents\u002Fisland-button","3.components\u002Fisland-button","i-lucide-circle-ellipsis",{"title":181,"path":182,"stem":183,"package":63,"category":174,"icon":184},"Island Group","\u002Fcomponents\u002Fisland-group","3.components\u002Fisland-group","i-lucide-panels-top-left",{"title":186,"path":187,"stem":188,"package":63,"category":11,"icon":189},"KeyboardAware","\u002Fcomponents\u002Fkeyboard-aware","3.components\u002Fkeyboard-aware","i-lucide-keyboard",{"title":191,"path":192,"stem":193,"package":63,"category":109,"icon":194},"Label","\u002Fcomponents\u002Flabel","3.components\u002Flabel","i-lucide-tag",{"title":196,"path":197,"stem":198,"package":63,"category":77,"icon":199},"Modal","\u002Fcomponents\u002Fmodal","3.components\u002Fmodal","i-lucide-gallery-vertical-end",{"title":64,"path":201,"stem":202,"package":76,"category":64,"icon":203},"\u002Fcomponents\u002Fnavigation","3.components\u002Fnavigation","i-lucide-route",{"title":205,"path":206,"stem":207,"package":63,"category":109,"icon":208},"Number Field","\u002Fcomponents\u002Fnumber-field","3.components\u002Fnumber-field","i-lucide-list-plus",{"title":210,"path":211,"stem":212,"package":63,"category":109,"icon":213},"Pin Input","\u002Fcomponents\u002Fpin-input","3.components\u002Fpin-input","i-lucide-key-round",{"title":215,"path":216,"stem":217,"package":63,"category":82,"icon":218},"Placeholder","\u002Fcomponents\u002Fplaceholder","3.components\u002Fplaceholder","i-lucide-square-dashed",{"title":220,"path":221,"stem":222,"package":63,"category":77,"icon":223},"Popover","\u002Fcomponents\u002Fpopover","3.components\u002Fpopover","i-lucide-message-square-more",{"title":225,"path":226,"stem":227,"package":63,"category":70,"icon":228},"Progress","\u002Fcomponents\u002Fprogress","3.components\u002Fprogress","i-lucide-chart-no-axes-column-increasing",{"title":230,"path":231,"stem":232,"package":63,"category":109,"icon":233},"Radio Group","\u002Fcomponents\u002Fradio-group","3.components\u002Fradio-group","i-lucide-circle-dot",{"title":235,"path":236,"stem":237,"package":63,"category":109,"icon":238},"Rating","\u002Fcomponents\u002Frating","3.components\u002Frating","i-lucide-star",{"title":240,"path":241,"stem":242,"package":76,"category":82,"icon":243},"Scroll View","\u002Fcomponents\u002Fscroll-view","3.components\u002Fscroll-view","i-lucide-scroll",{"title":245,"path":246,"stem":247,"package":63,"category":109,"icon":248},"Select","\u002Fcomponents\u002Fselect","3.components\u002Fselect","i-lucide-list-check",{"title":250,"path":251,"stem":252,"package":63,"category":82,"icon":253},"Separator","\u002Fcomponents\u002Fseparator","3.components\u002Fseparator","i-lucide-separator-horizontal",{"title":255,"path":256,"stem":257,"package":76,"category":77,"icon":141},"Sheet","\u002Fcomponents\u002Fsheet","3.components\u002Fsheet",{"title":259,"path":260,"stem":261,"package":63,"category":82,"icon":184},"Skeleton","\u002Fcomponents\u002Fskeleton","3.components\u002Fskeleton",{"title":263,"path":264,"stem":265,"package":63,"category":109,"icon":266},"Slider","\u002Fcomponents\u002Fslider","3.components\u002Fslider","i-lucide-sliders-horizontal",{"title":268,"path":269,"stem":270,"package":63,"category":135,"icon":271},"Sortable","\u002Fcomponents\u002Fsortable","3.components\u002Fsortable","i-lucide-list-restart",{"title":273,"path":274,"stem":275,"package":63,"category":64,"icon":276},"Stepper","\u002Fcomponents\u002Fstepper","3.components\u002Fstepper","i-lucide-list-ordered",{"title":278,"path":279,"stem":280,"package":63,"category":135,"icon":281},"Swipe Action","\u002Fcomponents\u002Fswipe-action","3.components\u002Fswipe-action","i-lucide-move-horizontal",{"title":283,"path":284,"stem":285,"package":63,"category":135,"icon":286},"Swiper","\u002Fcomponents\u002Fswiper","3.components\u002Fswiper","i-lucide-gallery-horizontal-end",{"title":288,"path":289,"stem":290,"package":63,"category":109,"icon":291},"Switch","\u002Fcomponents\u002Fswitch","3.components\u002Fswitch","i-lucide-toggle-right",{"title":293,"path":294,"stem":295,"package":63,"category":64,"icon":184},"Tabs","\u002Fcomponents\u002Ftabs","3.components\u002Ftabs",{"title":297,"path":298,"stem":299,"package":63,"category":109,"icon":169},"Textarea","\u002Fcomponents\u002Ftextarea","3.components\u002Ftextarea",{"title":301,"path":302,"stem":303,"package":63,"category":77,"icon":223},"Toast","\u002Fcomponents\u002Ftoast","3.components\u002Ftoast",{"title":305,"path":306,"stem":307,"package":63,"category":109,"icon":291},"Toggle","\u002Fcomponents\u002Ftoggle","3.components\u002Ftoggle",{"title":309,"path":310,"stem":311,"package":63,"category":109,"icon":184},"Toggle Group","\u002Fcomponents\u002Ftoggle-group","3.components\u002Ftoggle-group",{"title":313,"path":314,"stem":315,"package":63,"category":77,"icon":316},"Tray","\u002Fcomponents\u002Ftray","3.components\u002Ftray","i-lucide-square-dashed-bottom",{"title":318,"path":319,"stem":320,"children":321,"package":11,"category":11,"icon":323},"Theming","\u002Ftheming","4.theming\u002F1.index",[322,324,328,333,338],{"title":318,"path":319,"stem":320,"package":11,"category":11,"icon":323},"i-lucide-palette",{"title":325,"path":326,"stem":327,"package":11,"category":11,"icon":266},"Overrides","\u002Ftheming\u002Foverrides","4.theming\u002F2.overrides",{"title":329,"path":330,"stem":331,"package":11,"category":11,"icon":332},"Colors","\u002Ftheming\u002Fcolors","4.theming\u002F3.colors","i-lucide-swatch-book",{"title":334,"path":335,"stem":336,"package":11,"category":11,"icon":337},"Dark Mode","\u002Ftheming\u002Fdark-mode","4.theming\u002F4.dark-mode","i-lucide-moon",{"title":339,"path":340,"stem":341,"package":11,"category":11,"icon":342},"Fonts","\u002Ftheming\u002Ffonts","4.theming\u002F5.fonts","i-lucide-type",{"title":344,"path":345,"stem":346,"package":11,"category":11,"icon":347},"Accessibility","\u002Faccessibility","5.accessibility","i-lucide-accessibility",{"title":349,"path":350,"stem":351,"package":11,"category":11,"icon":352},"i18n","\u002Fi18n","6.i18n","i-lucide-languages",{"title":354,"path":355,"stem":356,"children":357,"package":11,"category":11,"icon":359},"Composables","\u002Fcomposables","7.composables\u002F1.index",[358,360,365,370,375,380,384,389,394,399,403,408,412,416,421,426],{"title":354,"path":355,"stem":356,"package":11,"category":11,"icon":359},"i-lucide-square-function",{"title":361,"path":362,"stem":363,"package":11,"category":11,"icon":364},"useEmitAsProps","\u002Fcomposables\u002Fuse-emit-as-props","7.composables\u002F10.use-emit-as-props","i-lucide-zap",{"title":366,"path":367,"stem":368,"package":11,"category":11,"icon":369},"useForwardPropsEmits","\u002Fcomposables\u002Fuse-forward-props-emits","7.composables\u002F11.use-forward-props-emits","i-lucide-merge",{"title":371,"path":372,"stem":373,"package":11,"category":11,"icon":374},"useForwardExpose","\u002Fcomposables\u002Fuse-forward-expose","7.composables\u002F12.use-forward-expose","i-lucide-share-2",{"title":376,"path":377,"stem":378,"package":11,"category":11,"icon":379},"usePrimitiveElement","\u002Fcomposables\u002Fuse-primitive-element","7.composables\u002F14.use-primitive-element","i-lucide-crosshair",{"title":381,"path":382,"stem":383,"package":11,"category":11,"icon":83},"useSafeArea","\u002Fcomposables\u002Fuse-safe-area","7.composables\u002F15.use-safe-area",{"title":385,"path":386,"stem":387,"package":11,"category":11,"icon":388},"useGlobalEvent","\u002Fcomposables\u002Fuse-global-event","7.composables\u002F16.use-global-event","i-lucide-radio",{"title":390,"path":391,"stem":392,"package":11,"category":11,"icon":393},"getViewportSize","\u002Fcomposables\u002Fget-viewport-size","7.composables\u002F17.get-viewport-size","i-lucide-scaling",{"title":395,"path":396,"stem":397,"package":11,"category":11,"icon":398},"useAppConfig","\u002Fcomposables\u002Fuse-app-config","7.composables\u002F2.use-app-config","i-lucide-settings",{"title":400,"path":401,"stem":402,"package":11,"category":11,"icon":337},"useColorMode","\u002Fcomposables\u002Fuse-color-mode","7.composables\u002F3.use-color-mode",{"title":404,"path":405,"stem":406,"package":11,"category":11,"icon":407},"useComponentIcons","\u002Fcomposables\u002Fuse-component-icons","7.composables\u002F4.use-component-icons","i-lucide-shapes",{"title":409,"path":410,"stem":411,"package":11,"category":11,"icon":141},"useTray","\u002Fcomposables\u002Fuse-tray","7.composables\u002F5.use-tray",{"title":413,"path":414,"stem":415,"package":11,"category":11,"icon":352},"i18n composables","\u002Fcomposables\u002Fi18n-composables","7.composables\u002F6.i18n-composables",{"title":417,"path":418,"stem":419,"package":11,"category":11,"icon":420},"useId","\u002Fcomposables\u002Fuse-id","7.composables\u002F7.use-id","i-lucide-hash",{"title":422,"path":423,"stem":424,"package":11,"category":11,"icon":425},"useFilter","\u002Fcomposables\u002Fuse-filter","7.composables\u002F8.use-filter","i-lucide-filter",{"title":427,"path":428,"stem":429,"package":11,"category":11,"icon":430},"useForwardProps","\u002Fcomposables\u002Fuse-forward-props","7.composables\u002F9.use-forward-props","i-lucide-arrow-right-left",{"title":432,"path":433,"stem":434,"children":435,"package":11,"category":11,"icon":437},"Guides","\u002Fguides","8.guides\u002F1.index",[436,438,442,447,451,456,461,466,470,475,479,484],{"title":432,"path":433,"stem":434,"package":11,"category":11,"icon":437},"i-lucide-book-open",{"title":439,"path":440,"stem":441,"package":11,"category":11,"icon":364},"Instant first frame","\u002Fguides\u002Finstant-first-frame-rendering","8.guides\u002F10.instant-first-frame-rendering",{"title":443,"path":444,"stem":445,"package":11,"category":11,"icon":446},"Why Vy UI","\u002Fguides\u002Fwhy-vy-ui","8.guides\u002F11.why-vy-ui","i-lucide-help-circle",{"title":448,"path":449,"stem":450,"package":11,"category":11,"icon":22},"Sparkling","\u002Fguides\u002Fsparkling","8.guides\u002F12.sparkling",{"title":452,"path":453,"stem":454,"package":11,"category":11,"icon":455},"Lynx UI frameworks","\u002Fguides\u002Flynx-ui-frameworks","8.guides\u002F2.lynx-ui-frameworks","i-lucide-library",{"title":457,"path":458,"stem":459,"package":11,"category":11,"icon":460},"Vue Lynx","\u002Fguides\u002Fvue-lynx","8.guides\u002F3.vue-lynx","i-lucide-component",{"title":462,"path":463,"stem":464,"package":11,"category":11,"icon":465},"Lynx vs React Native","\u002Fguides\u002Flynx-vs-react-native","8.guides\u002F4.lynx-vs-react-native","i-lucide-git-compare",{"title":467,"path":468,"stem":469,"package":11,"category":11,"icon":83},"Testing on device","\u002Fguides\u002Ftesting-on-device","8.guides\u002F5.testing-on-device",{"title":471,"path":472,"stem":473,"package":11,"category":11,"icon":474},"Testing with Xcode","\u002Fguides\u002Ftesting-with-xcode","8.guides\u002F6.testing-with-xcode","i-lucide-apple",{"title":476,"path":477,"stem":478,"package":11,"category":11,"icon":27},"rspeedy dev server","\u002Fguides\u002Frspeedy-dev-server","8.guides\u002F7.rspeedy-dev-server",{"title":480,"path":481,"stem":482,"package":11,"category":11,"icon":483},"Tailwind on Lynx","\u002Fguides\u002Ftailwind-on-lynx","8.guides\u002F8.tailwind-on-lynx","i-lucide-wind",{"title":485,"path":486,"stem":487,"package":11,"category":11,"icon":488},"Theming on Lynx","\u002Fguides\u002Ftheming-on-lynx","8.guides\u002F9.theming-on-lynx","i-lucide-paintbrush",{"id":490,"title":381,"body":491,"category":11,"description":805,"extension":806,"links":807,"meta":813,"navigation":814,"package":11,"path":382,"seo":815,"stem":383,"__hash__":816},"docs\u002F7.composables\u002F15.use-safe-area.md",{"type":492,"value":493,"toc":799},"minimark",[494,499,515,597,662,665,669,672,738,750,754,770,781,785,795],[495,496,498],"h2",{"id":497},"overview","Overview",[500,501,502,503,507,508,511,512,514],"p",{},"Lynx has no ",[504,505,506],"code",{},"env(safe-area-inset-*)",". The host container injects insets as global props (see ",[509,510,448],"a",{"href":449},"), and each container uses its own key names. ",[504,513,381],{}," normalizes them:",[516,517,522],"pre",{"className":518,"code":519,"language":520,"meta":521,"style":521},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { useSafeArea } from '@vyui\u002Fcore'\n\nconst { top, bottom } = useSafeArea() \u002F\u002F logical px, e.g. { top: 59, bottom: 34 }\n","ts","",[504,523,524,556,563],{"__ignoreMap":521},[525,526,529,533,537,541,544,547,550,553],"span",{"class":527,"line":528},"line",1,[525,530,532],{"class":531},"s7zQu","import",[525,534,536],{"class":535},"sMK4o"," {",[525,538,540],{"class":539},"sTEyZ"," useSafeArea",[525,542,543],{"class":535}," }",[525,545,546],{"class":531}," from",[525,548,549],{"class":535}," '",[525,551,41],{"class":552},"sfazB",[525,554,555],{"class":535},"'\n",[525,557,559],{"class":527,"line":558},2,[525,560,562],{"emptyLinePlaceholder":561},true,"\n",[525,564,566,570,572,575,578,581,584,587,590,593],{"class":527,"line":565},3,[525,567,569],{"class":568},"spNyl","const",[525,571,536],{"class":535},[525,573,574],{"class":539}," top",[525,576,577],{"class":535},",",[525,579,580],{"class":539}," bottom ",[525,582,583],{"class":535},"}",[525,585,586],{"class":535}," =",[525,588,540],{"class":589},"s2Zo4",[525,591,592],{"class":539},"() ",[525,594,596],{"class":595},"sHwdD","\u002F\u002F logical px, e.g. { top: 59, bottom: 34 }\n",[598,599,600,619,632,642,652],"ul",{},[601,602,603,606,607,610,611,614,615,618],"li",{},[604,605,448],"strong",{}," injects ",[504,608,609],{},"topHeight"," \u002F ",[504,612,613],{},"bottomHeight"," plus an ",[504,616,617],{},"os"," prop.",[601,620,621,624,625,610,628,631],{},[604,622,623],{},"Lynx Explorer \u002F Lynx Go"," inject ",[504,626,627],{},"safeAreaTop",[504,629,630],{},"safeAreaBottom",".",[601,633,634,637,638,631],{},[604,635,636],{},"Your own host"," should follow the Explorer names. If you need to build a custom host, see the ",[509,639,641],{"href":640},"\u002Fguides\u002Fnative-host-integration","native host integration guide",[601,643,644,647,648,651],{},[604,645,646],{},"Android"," normalizes to zeros: Android containers inset the ",[504,649,650],{},"LynxView"," natively, so honoring the props would double-pad.",[601,653,654,657,658,661],{},[604,655,656],{},"Web \u002F vitest"," have no ",[504,659,660],{},"lynx"," global and return zeros, so you can apply the insets unconditionally.",[500,663,664],{},"Values are snapshotted once, because global props don't change over a page's lifetime.",[495,666,668],{"id":667},"providing-overrides","Providing overrides",[500,670,671],{},"An ancestor that knows better can override the container read for its subtree:",[516,673,675],{"className":518,"code":674,"language":520,"meta":521,"style":521},"import { provideSafeAreaInsets } from '@vyui\u002Fcore'\n\nprovideSafeAreaInsets({ top: 0, bottom: 0 }) \u002F\u002F e.g. a fullscreen surface drawing its own chrome\n",[504,676,677,696,700],{"__ignoreMap":521},[525,678,679,681,683,686,688,690,692,694],{"class":527,"line":528},[525,680,532],{"class":531},[525,682,536],{"class":535},[525,684,685],{"class":539}," provideSafeAreaInsets",[525,687,543],{"class":535},[525,689,546],{"class":531},[525,691,549],{"class":535},[525,693,41],{"class":552},[525,695,555],{"class":535},[525,697,698],{"class":527,"line":558},[525,699,562],{"emptyLinePlaceholder":561},[525,701,702,705,708,711,714,717,721,723,726,728,730,732,735],{"class":527,"line":565},[525,703,704],{"class":589},"provideSafeAreaInsets",[525,706,707],{"class":539},"(",[525,709,710],{"class":535},"{",[525,712,574],{"class":713},"swJcz",[525,715,716],{"class":535},":",[525,718,720],{"class":719},"sbssI"," 0",[525,722,577],{"class":535},[525,724,725],{"class":713}," bottom",[525,727,716],{"class":535},[525,729,720],{"class":719},[525,731,543],{"class":535},[525,733,734],{"class":539},") ",[525,736,737],{"class":595},"\u002F\u002F e.g. a fullscreen surface drawing its own chrome\n",[500,739,740,745,746,749],{},[509,741,742],{"href":80},[504,743,744],{},"VyApp"," does this at the root: it provides the container's insets app-wide, and its ",[504,747,748],{},"safe-area=\"false\""," prop is the zeros override above.",[495,751,753],{"id":752},"signature","Signature",[500,755,756,759,760,763,764,766,767,631],{},[504,757,758],{},"useSafeArea(): SafeAreaInsets"," returns ",[504,761,762],{},"{ top: number, bottom: number }",", resolved from an ancestor ",[504,765,704],{}," first, the container's global props otherwise. Call during ",[504,768,769],{},"setup()",[500,771,772,773,776,777,780],{},"Also exported: ",[504,774,775],{},"getSafeAreaInsets()"," (the raw global-props read, no injection) and ",[504,778,779],{},"getSafeAreaInsetsFromGlobalProps(props)"," (the pure normalizer, useful in tests).",[495,782,784],{"id":783},"related","Related",[598,786,787,791],{},[601,788,789],{},[509,790,448],{"href":449},[601,792,793],{},[509,794,744],{"href":80},[796,797,798],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html .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 .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}",{"title":521,"searchDepth":528,"depth":558,"links":800},[801,802,803,804],{"id":497,"depth":558,"text":498},{"id":667,"depth":558,"text":668},{"id":752,"depth":558,"text":753},{"id":783,"depth":558,"text":784},"Normalized device safe-area insets (notch, Dynamic Island, home indicator) from the container's global props.","md",[808],{"label":809,"icon":810,"to":811,"target":812},"Source","i-simple-icons-github","https:\u002F\u002Fgithub.com\u002FKealanAU\u002Fvyui\u002Fblob\u002Fmain\u002Fpackages\u002Fcore\u002Fsrc\u002Fshared\u002Fcomposables\u002FuseSafeArea.ts","_blank",{},{"icon":83},{"title":381,"description":805},"JsbRDwSwG8R7am-gkQsrBI6J_bMANx48FEm6Hf8-frw",[818,820],{"title":376,"path":377,"stem":378,"description":819,"icon":-1,"children":-1,"navigation":-1},"Resolve a template ref down to a stable ElementHandle regardless of asChild merging.",{"title":385,"path":386,"stem":387,"description":821,"icon":-1,"children":-1,"navigation":-1},"Subscribe to a Lynx GlobalEventEmitter event (native-to-JS signals from the host app) with automatic cleanup.",1789821821818]