@jengaui/root/dist/esm/chunk-7WE5GTQ4.js

Jenga UI Root component in React

import { useRef, useState, useEffect } from 'react';
import { ModalProvider } from '@react-aria/overlays';
import { StyleSheetManager } from 'styled-components';
import { tasty, BASE_STYLES, BLOCK_STYLES, extractStyles, filterBaseProps } from 'tastycss';
import { Provider } from '@jengaui/providers';
import { TOKENS, GlobalStyles } from '@jengaui/core';
import { useViewportSize } from '@jengaui/utils';
import { PortalProvider } from '@jengaui/portal';
import { AlertDialogApiProvider } from '@jengaui/alert-dialog';
import { NotificationsProvider } from '@jengaui/notification';
import { jsx, jsxs } from 'react/jsx-runtime';

var J=tasty({id:"Jenga UI-kit-root",className:"root"}),M={display:"block",preset:"t3",...Object.keys(TOKENS).reduce((r,i)=>(r[`@${i}`]=TOKENS[i],r),{})},O=[...BASE_STYLES,...BLOCK_STYLES],u=typeof CSS<"u"&&typeof(CSS==null?void 0:CSS.supports)=="function"?CSS.supports("height: 100dvh"):!1;function Z(r){let{children:i,bodyStyles:S,fonts:g,publicUrl:y,router:h,font:P,monospaceFont:v,applyLegacyTokens:T,...l}=r,o=useRef(null),[p,b]=useState(),t=useViewportSize(),[n,a]=useState(u?void 0:t.height),s=useRef();useEffect(()=>{u&&typeof window<"u"||(s.current&&clearTimeout(s.current),t.height<(n||0)&&t.height<window.innerHeight?s.current=setTimeout(()=>{a(t.height);},500):a(t.height));},[n,t.height]),useEffect(()=>{p||b(o==null?void 0:o.current);},[]);let R=extractStyles(l,O,M);return jsx(Provider,{router:h,root:p,children:jsx(StyleSheetManager,{disableVendorPrefixes:!0,children:jsxs(J,{ref:o,...filterBaseProps(l,{eventProps:!0}),styles:R,style:{"--jenga-dynamic-viewport-height":n?n+"px":"100dvh"},children:[jsx(GlobalStyles,{bodyStyles:S,applyLegacyTokens:T,publicUrl:y,fonts:g,font:P,monospaceFont:v}),jsx(ModalProvider,{children:jsx(PortalProvider,{value:o,children:jsx(NotificationsProvider,{rootRef:o,children:jsx(AlertDialogApiProvider,{children:i})})})})]})})})}

export { Z as a };