@allxsmith/bestax-bulma 5.67.8 → 5.67.10

package/dist/esm/layout/AppFrame.js

@@ -1,7 +1,7 @@
 /* @allxsmith/bestax-bulma — AI agents: see AGENTS.md in the package root, or https://bestax.io/llms.txt */
 'use client';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { createContext, forwardRef, useContext, useRef, useCallback, useEffect, useState, useId, useMemo } from 'react';
+import { createContext, forwardRef, useContext, useRef, useState, useCallback, useEffect, useId, useMemo } from 'react';
 import { usePrefixedClassNames, classNames } from '../helpers/classNames.js';
 import { useBulmaClasses } from '../helpers/useBulmaClasses.js';
 import { withSubComponents } from '../helpers/withSubComponents.js';
@@ -16,6 +16,7 @@ import { useOverlayFocus } from '../helpers/useOverlayFocus.js';
 import { useOutsidePress } from '../helpers/useOutsidePress.js';
 import { getActiveElementInTree } from '../helpers/shadowDom.js';
 import { useBulmaBreakpoint } from '../helpers/useBulmaViewport.js';
+import { PortalScope } from '../helpers/portal.js';
 import { warnOnce } from '../helpers/devWarnings.js';
 import { NavbarBurger } from '../components/Navbar.js';
 import { Delete } from '../elements/Delete.js';
@@ -92,7 +93,12 @@ const AppFrameNav = forwardRef(({ className, style, width, overlay = true, close
     const navRef = useRef(null);
     const backdropRef = useRef(null);
     const navCleanupRef = useRef(null);
-    const navRefs = useCallback((node) => setRefs(node, navRef, ref, navCleanupRef), [ref]);
+    // The nav, as state, for the popups inside the drawer to portal into.
+    const [navNode, setNavNode] = useState(null);
+    const navRefs = useCallback((node) => {
+        setNavNode(node);
+        setRefs(node, navRef, ref, navCleanupRef);
+    }, [ref]);
     const navId = rest.id || frame?.state.navId;
     if (frame)
         warnOnUnreadId('Nav', rest.id, frame.state.navId);
@@ -190,7 +196,7 @@ const AppFrameNav = forwardRef(({ className, style, width, overlay = true, close
                     onPointerDownCapture?.(e);
                     markInsidePress(e);
                 }, ...rest, id: navId, "aria-label": rest['aria-label'] ||
-                    (rest['aria-labelledby'] ? undefined : frame?.labels.nav), children: [frame && (jsx(Delete, { className: closeClass, size: "medium", ariaLabel: frame.labels.closeNav, onClick: close })), children] }), frame && overlay && (jsx("div", { ref: backdropRef, className: classNames(backdropClass, shown), "aria-hidden": "true", onClick: closeOnClickOutside
+                    (rest['aria-labelledby'] ? undefined : frame?.labels.nav), children: [frame && (jsx(Delete, { className: closeClass, size: "medium", ariaLabel: frame.labels.closeNav, onClick: close })), jsx(PortalScope, { node: isDrawer ? navNode : undefined, children: children })] }), frame && overlay && (jsx("div", { ref: backdropRef, className: classNames(backdropClass, shown), "aria-hidden": "true", onClick: closeOnClickOutside
                     ? () => {
                         // Not under an overlay opened over the drawer.
                         if (isTopmost())

package/dist/esm/layout/AppFrame.js.map

@@ -1 +1 @@
-{"version":3,"file":"AppFrame.js","sources":["../../../src/layout/AppFrame.tsx"],"sourcesContent":["import React, {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { isElementOf } from '../helpers/elementType';\nimport { flattenChildren } from '../helpers/flattenChildren';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { useOverlayEscape, useOverlayStack } from '../helpers/overlayStack';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport { useInertSiblings } from '../helpers/useInertSiblings';\nimport { trapTab } from '../helpers/useFocusTrap';\nimport { useOverlayFocus } from '../helpers/useOverlayFocus';\nimport { useOutsidePress } from '../helpers/useOutsidePress';\nimport { getActiveElementInTree } from '../helpers/shadowDom';\nimport { useBulmaBreakpoint } from '../helpers/useBulmaViewport';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { NavbarBurger } from '../components/Navbar';\nimport type { NavbarBurgerProps } from '../components/Navbar';\nimport { Delete } from '../elements/Delete';\nimport type { ContainerBreakpoint } from './Container';\n\n/**\n * The strings AppFrame renders, each with an English default. A key left\n * out, or set to an empty string, keeps its default.\n */\nexport interface AppFrameLabels {\n  /**\n   * The skip link's text.\n   * @defaultValue 'Skip to main content'\n   */\n  skipLink?: string;\n  /**\n   * The nav's accessible name, when `AppFrame.Nav` has no `aria-label` or\n   * `aria-labelledby`. Leave the word \"navigation\" out: the role says it.\n   * @defaultValue 'Sections'\n   */\n  nav?: string;\n  /**\n   * The name of the close button at the top of the drawer.\n   * @defaultValue 'Close navigation'\n   */\n  closeNav?: string;\n  /**\n   * The burger's name, when `AppFrame.Burger` has no `aria-label`.\n   * @defaultValue 'menu', Navbar.Burger's\n   */\n  burger?: string;\n}\n\n/**\n * Props for the AppFrame component. The helper props, the other attributes\n * and the `ref` land on the root `<div>`.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `<div>`.\n */\nexport interface AppFrameProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The parts, each a direct child: `Header`, `Nav`, `Main`, `Aside` and\n   * `Footer`, in that order, since it's the Tab order. The frame reads the\n   * `id` of `Main` and `Nav` off its children for the skip link and the\n   * burger, so a part wrapped in a component of your own takes no `id` of\n   * its own. Put the frame at the top of the page, outside any `main` or\n   * sectioning element.\n   */\n  children?: React.ReactNode;\n  /**\n   * The width from which the nav is a column beside the page. Below it, the\n   * nav is a drawer the burger opens. The stylesheet switches the layout at\n   * Bulma's breakpoint, and the script reads the width at Bulma's default\n   * breakpoints, so a theme that moves Bulma's breakpoints moves the layout\n   * but not which state the burger toggles.\n   * @defaultValue 'desktop'\n   */\n  breakpoint?: ContainerBreakpoint;\n  /**\n   * Whether the drawer is open, below the breakpoint. With it, the state is\n   * yours: update it from `onNavOpenChange`. It has no effect from the\n   * breakpoint up, where the frame asks to close it.\n   */\n  navOpen?: boolean;\n  /** Whether the drawer starts open. */\n  defaultNavOpen?: boolean;\n  /**\n   * Called with the state asked for: by the burger, `useAppFrame()`, Escape,\n   * a press outside, the close button, a followed link (see\n   * `AppFrame.Nav`'s `closeOnNavigate`), or the window being at or past the\n   * breakpoint while it's open, which closes it.\n   */\n  onNavOpenChange?: (open: boolean) => void;\n  /**\n   * Whether the column is collapsed out of view, from the breakpoint up.\n   * With it, the state is yours: update it from `onNavCollapsedChange`. It\n   * has no effect below the breakpoint, where the drawer always shows the\n   * whole nav.\n   */\n  navCollapsed?: boolean;\n  /** Whether the column starts collapsed. */\n  defaultNavCollapsed?: boolean;\n  /** Called with the state asked for, by the burger or `useAppFrame()`. */\n  onNavCollapsedChange?: (collapsed: boolean) => void;\n  /**\n   * Renders a skip link first, visible when it has focus, that moves focus\n   * to `AppFrame.Main`. Turn it off only for a page that has its own.\n   */\n  skipLink?: boolean;\n  /** The strings the frame renders. Each one left out keeps its English default. */\n  labels?: AppFrameLabels;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/**\n * Props for AppFrame.Header, on its `<header>`, which sticks to the top.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<header>`.\n */\nexport interface AppFrameHeaderProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * Usually a `Navbar`, not `fixed`, with `AppFrame.Burger` in its\n   * `Navbar.Brand`. A header taller than Bulma's navbar sets\n   * `--bulma-app-frame-header-height` on `:root`, so the nav column, an\n   * in-page link and focus clear it.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Nav, on its `<nav>`.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<nav>`.\n * @extraProp {string} [id] - The nav's id, which the burger's `aria-controls` points at. The frame makes one when there's none.\n * @extraProp {string} [aria-label] - The nav's name. Without it or `aria-labelledby`, it's the frame's `labels.nav`, \"Sections\".\n */\nexport interface AppFrameNavProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * Usually a `Menu`. A nav taller than the window scrolls on its own. With\n   * `overlay`, the rest of the frame is inert while the drawer is open, so an\n   * overlay opened from the drawer, such as a `Modal`, goes inside the nav or\n   * renders outside the frame (Modal's `portal`).\n   */\n  children?: React.ReactNode;\n  /**\n   * The column's width, and the drawer's up to the window's width less a\n   * strip of backdrop. A number is pixels, and a string any CSS length. It\n   * writes `--bulma-app-frame-nav-width`, 16rem by default.\n   */\n  width?: number | string;\n  /**\n   * Shows a backdrop behind the drawer and makes it modal: Tab stays inside,\n   * the page scroll locks, and the rest of the frame is inert, while what\n   * renders outside it, such as a Modal opened from the drawer or a toast,\n   * stays live. Without it the drawer covers the page without holding Tab,\n   * and focus can move to the page beside it. Either way focus moves in as\n   * it opens. Sidebar's `overlay`.\n   */\n  overlay?: boolean;\n  /**\n   * Closes the drawer on Escape, while it's the topmost overlay, so Escape\n   * closes one layer at a time.\n   */\n  closeOnEscape?: boolean;\n  /**\n   * Closes the drawer on a press outside it while it's the topmost overlay:\n   * a click on the backdrop, or without `overlay` a press anywhere outside\n   * it. Focus goes back to the burger as it closes. Without `overlay`, the\n   * press's own mousedown then moves it, as on any page: to what was pressed\n   * if that takes focus, and otherwise off the burger to the page. A touch\n   * that scrolls leaves it on the burger. A press on a control whose\n   * `aria-controls` names the nav, such as the burger, is left to that\n   * control. Popover's `closeOnClickOutside`.\n   */\n  closeOnClickOutside?: boolean;\n  /**\n   * Closes the drawer when a link inside it is followed with a plain click:\n   * not with a modifier key held, and not on a link with a `target` other\n   * than `_self` or a `download`. Only a link the nav holds in the page\n   * counts, not one in a Modal or a popup it portals elsewhere. Focus goes\n   * back to the burger, and the navigation takes it from there: a router\n   * that moves focus on navigation moves it, and an in-page `#` link leaves\n   * it at its target, as it does anywhere on the page. Turn it off for a\n   * drawer of filters rather than links.\n   */\n  closeOnNavigate?: boolean;\n}\n\n/**\n * Props for AppFrame.Main, on the page's one `<main>`. Don't put another\n * `<main>` inside it. It takes your `id`, or a generated one, for the skip\n * link, and `tabIndex={-1}` so the link can move focus to it.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<main>`.\n * @extraProp {string} [id] - Its id, which the skip link points at. The frame makes one when there's none.\n */\nexport interface AppFrameMainProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** The page. A `Container` or a `Section` inside it gives Bulma's widths and padding. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Aside, on its `<aside>`, a complementary landmark.\n * Give it an `aria-label` when the page has more than one.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<aside>`.\n */\nexport interface AppFrameAsideProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** What sits beside the page: an outline, details, filters. */\n  children?: React.ReactNode;\n  /**\n   * Its width from the breakpoint up; below it, the aside moves under the\n   * page. A number is pixels, and a string any CSS length. It writes\n   * `--bulma-app-frame-aside-width`, 20rem by default.\n   */\n  width?: number | string;\n}\n\n/**\n * Props for AppFrame.Footer, on its `<footer>`.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<footer>`.\n */\nexport interface AppFrameFooterProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Plain content, or bestax's `Footer` with `as=\"div\"` for Bulma's footer look. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Burger: Navbar.Burger's, less the state the frame\n * fills in. Its `<button>` opens and closes the drawer below the breakpoint\n * and collapses and expands the column from it up, with `aria-expanded` and\n * `aria-controls` following the nav. It shows at every width. Hide it from\n * the breakpoint up with the visibility helpers when the column never\n * collapses. Outside an AppFrame it controls nothing.\n */\nexport type AppFrameBurgerProps = Omit<\n  NavbarBurgerProps,\n  'active' | 'aria-expanded' | 'aria-controls'\n>;\n\n/** What `useAppFrame()` returns. */\nexport interface AppFrameState {\n  /** Whether the drawer is open. */\n  navOpen: boolean;\n  /** Asks to open or close the drawer, through `onNavOpenChange`. */\n  setNavOpen: (open: boolean) => void;\n  /** Whether the column is collapsed. */\n  navCollapsed: boolean;\n  /** Asks to collapse or expand the column, through `onNavCollapsedChange`. */\n  setNavCollapsed: (collapsed: boolean) => void;\n  /**\n   * Whether the nav is a drawer at the current width. `false` on the server\n   * and until the first layout effect has read the width.\n   */\n  isDrawer: boolean;\n  /** Toggles whichever state applies at the current width, as the burger does. */\n  toggleNav: () => void;\n  /** The nav's `id`, for a custom toggle's `aria-controls`. */\n  navId: string;\n}\n\n/** What the frame tells its parts. */\ninterface FrameContextValue {\n  state: AppFrameState;\n  labels: Required<Omit<AppFrameLabels, 'burger'>> &\n    Pick<AppFrameLabels, 'burger'>;\n  mainId: string;\n  /**\n   * Whether the frame has read the width, so it knows whether the nav is a\n   * drawer. Not on the server, nor in the render that hydrates.\n   */\n  modeKnown: boolean;\n}\n\nconst FrameContext = createContext<FrameContextValue | null>(null);\n\n/** A width prop as CSS: a number is pixels. */\nconst cssLength = (value: number | string) =>\n  typeof value === 'number' ? `${value}px` : value;\n\n/**\n * Hands `node` to a part's own ref and to the one forwarded to it. A\n * forwarded callback that returns a cleanup, as React 19 allows, has it held\n * in `cleanup` and run on detach in place of a call with `null`, on React 18\n * as well.\n */\nfunction setRefs<T>(\n  node: T | null,\n  own: React.MutableRefObject<T | null>,\n  forwarded: React.ForwardedRef<T>,\n  cleanup: React.MutableRefObject<(() => void) | null>\n) {\n  own.current = node;\n  if (typeof forwarded === 'function') {\n    if (node === null) {\n      const detach = cleanup.current;\n      cleanup.current = null;\n      if (detach) detach();\n      else forwarded(null);\n      return;\n    }\n    const returned: unknown = forwarded(node);\n    cleanup.current =\n      typeof returned === 'function' ? (returned as () => void) : null;\n  } else if (forwarded) {\n    forwarded.current = node;\n  }\n}\n\n/**\n * Warns when a part has an `id` the frame couldn't read, because it isn't a\n * direct child, so the skip link or the burger points at the wrong one.\n */\nfunction warnOnUnreadId(part: string, id: unknown, expected: string) {\n  if (id && id !== expected) {\n    warnOnce(\n      `AppFrame:${part}-id`,\n      `[bestax-bulma] <AppFrame.${part}> has an id <AppFrame> can't read, ` +\n        `so ${part === 'Main' ? 'the skip link' : \"the burger's aria-controls\"} ` +\n        `misses it. Put AppFrame.${part} directly inside AppFrame.`\n    );\n  }\n}\n\n/**\n * The top bar of an AppFrame, which sticks while the page scrolls.\n *\n * @function\n * @param {AppFrameHeaderProps} props - Props for AppFrame.Header.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<header>`.\n * @returns {JSX.Element} The rendered header.\n */\nexport const AppFrameHeader = forwardRef<HTMLElement, AppFrameHeaderProps>(\n  ({ className, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const headerClass = usePrefixedClassNames('app-frame-header');\n    return (\n      <header\n        ref={ref}\n        className={classNames(headerClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {children}\n      </header>\n    );\n  }\n);\n\nAppFrameHeader.displayName = 'AppFrame.Header';\n\n/**\n * The navigation of an AppFrame: a column beside the page from the breakpoint up, and a drawer below it.\n *\n * @function\n * @param {AppFrameNavProps} props - Props for AppFrame.Nav.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<nav>`.\n * @returns {JSX.Element} The rendered nav, and the drawer's backdrop.\n */\nexport const AppFrameNav = forwardRef<HTMLElement, AppFrameNavProps>(\n  (\n    {\n      className,\n      style,\n      width,\n      overlay = true,\n      closeOnEscape = true,\n      closeOnClickOutside = true,\n      closeOnNavigate = true,\n      onClick,\n      onPointerDownCapture,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const frame = useContext(FrameContext);\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const navClass = usePrefixedClassNames('app-frame-nav');\n    const closeClass = usePrefixedClassNames('app-frame-close');\n    const backdropClass = usePrefixedClassNames('app-frame-backdrop');\n    const activeClass = usePrefixedClassNames('is-active');\n    const navRef = useRef<HTMLElement | null>(null);\n    const backdropRef = useRef<HTMLDivElement | null>(null);\n    const navCleanupRef = useRef<(() => void) | null>(null);\n    const navRefs = useCallback(\n      (node: HTMLElement | null) => setRefs(node, navRef, ref, navCleanupRef),\n      [ref]\n    );\n\n    const navId = rest.id || frame?.state.navId;\n    if (frame) warnOnUnreadId('Nav', rest.id, frame.state.navId);\n    // The drawer is open only below the breakpoint. Above it the nav is a\n    // column, and none of what follows applies.\n    const isDrawer = !!frame?.state.isDrawer;\n    const open = isDrawer && !!frame?.state.navOpen;\n    // The open drawer is Bulma's active state, on the nav as on a navbar's\n    // menu, and on its backdrop.\n    const shown = { [activeClass]: !!frame?.state.navOpen };\n    const modal = open && overlay;\n    const close = () => frame?.state.setNavOpen(false);\n\n    // The rest of the frame goes inert: the header, the page, the aside and\n    // the footer, but not the backdrop, which takes the presses outside the\n    // drawer rather than let them through to what's under it. Not the whole\n    // page, since a Modal or a toast renders beside the frame, often into an\n    // element that's there before the drawer opens, and a Modal opened from\n    // the drawer has to stay usable. First, so that as the drawer closes it\n    // lets go before focus goes back to the burger: an inert element can't\n    // take focus.\n    useInertSiblings(navRef, modal, false, backdropRef);\n    const isTopmost = useOverlayStack(open, overlay);\n    useScrollLock(modal);\n\n    // Tab stays inside while the drawer is the topmost modal overlay, as in\n    // Sidebar, so a Modal opened from the drawer holds Tab until it closes.\n    useEffect(() => {\n      if (!modal) return undefined;\n      return trapTab(\n        () => navRef.current,\n        window,\n        () => isTopmost('modal')\n      );\n    }, [modal, isTopmost]);\n\n    useOverlayEscape(open && closeOnEscape, isTopmost, close);\n\n    // Without an overlay there's no backdrop: a press outside the drawer\n    // closes it, as Popover's does, while it's the topmost overlay, so a\n    // press in a Modal opened over it is the Modal's. A press on a control\n    // that names the nav in its `aria-controls`, such as the burger, is left\n    // to that control, which toggles it.\n    const markInsidePress = useOutsidePress(\n      navRef,\n      open && !overlay && closeOnClickOutside,\n      e => {\n        const id = navRef.current?.id;\n        const controlsNav = (node: EventTarget) =>\n          !!(node as Element)\n            .getAttribute?.('aria-controls')\n            ?.split(/\\s+/)\n            .includes(id as string);\n        if (!isTopmost() || e.composedPath().some(controlsNav)) return;\n        close();\n      }\n    );\n\n    // Focus moves to the drawer's first tab stop, the close button, as it\n    // opens, and back to whatever had it as it closes, unless it has left\n    // the drawer. After a press outside, the press's own mousedown then takes\n    // it wherever the press goes. When the window widened, the drawer is the\n    // column again, and focus on its links stays; the close button hides\n    // there, so focus on it, or dropped from it to <body>, goes back too.\n    const isDrawerRef = useLatestRef(isDrawer);\n    useOverlayFocus(navRef, open, {\n      modal: overlay,\n      restore: () => {\n        if (isDrawerRef.current) return true;\n        const nav = navRef.current as HTMLElement;\n        const active = getActiveElementInTree(nav);\n        return (\n          !nav.contains(active) || !!active?.classList.contains(closeClass)\n        );\n      },\n    });\n\n    const handleClick = (e: React.MouseEvent<HTMLElement>) => {\n      onClick?.(e);\n      if (\n        !open ||\n        !closeOnNavigate ||\n        e.button !== 0 ||\n        e.metaKey ||\n        e.ctrlKey ||\n        e.shiftKey ||\n        e.altKey\n      ) {\n        return;\n      }\n      // Not skipped for a click whose default was prevented: a router's\n      // link prevents it to navigate without a page load. Only a link the nav\n      // holds: one in a Modal portaled from it is the Modal's.\n      const link = (e.target as Element).closest('a[href]');\n      if (!link || !navRef.current?.contains(link)) return;\n      if (link.hasAttribute('download')) return;\n      const target = link.getAttribute('target');\n      if (target && target !== '_self') return;\n      close();\n    };\n\n    const navStyle =\n      width === undefined\n        ? style\n        : ({\n            ...style,\n            '--bulma-app-frame-nav-width': cssLength(width),\n          } as React.CSSProperties);\n\n    return (\n      <>\n        <nav\n          ref={navRefs}\n          className={classNames(navClass, shown, bulmaHelperClasses, className)}\n          style={navStyle}\n          onClick={handleClick}\n          onPointerDownCapture={e => {\n            onPointerDownCapture?.(e);\n            markInsidePress(e);\n          }}\n          {...rest}\n          id={navId}\n          aria-label={\n            rest['aria-label'] ||\n            (rest['aria-labelledby'] ? undefined : frame?.labels.nav)\n          }\n        >\n          {frame && (\n            <Delete\n              className={closeClass}\n              size=\"medium\"\n              ariaLabel={frame.labels.closeNav}\n              onClick={close}\n            />\n          )}\n          {children}\n        </nav>\n        {frame && overlay && (\n          <div\n            ref={backdropRef}\n            className={classNames(backdropClass, shown)}\n            aria-hidden=\"true\"\n            onClick={\n              closeOnClickOutside\n                ? () => {\n                    // Not under an overlay opened over the drawer.\n                    if (isTopmost()) close();\n                  }\n                : undefined\n            }\n          />\n        )}\n      </>\n    );\n  }\n);\n\nAppFrameNav.displayName = 'AppFrame.Nav';\n\n/**\n * The page's main content in an AppFrame, which the skip link moves focus to.\n *\n * @function\n * @param {AppFrameMainProps} props - Props for AppFrame.Main.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<main>`.\n * @returns {JSX.Element} The rendered main.\n */\nexport const AppFrameMain = forwardRef<HTMLElement, AppFrameMainProps>(\n  ({ className, children, ...props }, ref) => {\n    const frame = useContext(FrameContext);\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const mainClass = usePrefixedClassNames('app-frame-main');\n    if (frame) warnOnUnreadId('Main', rest.id, frame.mainId);\n    return (\n      <main\n        ref={ref}\n        tabIndex={-1}\n        className={classNames(mainClass, bulmaHelperClasses, className)}\n        {...rest}\n        id={rest.id || frame?.mainId}\n      >\n        {children}\n      </main>\n    );\n  }\n);\n\nAppFrameMain.displayName = 'AppFrame.Main';\n\n/**\n * Content beside the page in an AppFrame, which moves under it below the breakpoint.\n *\n * @function\n * @param {AppFrameAsideProps} props - Props for AppFrame.Aside.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<aside>`.\n * @returns {JSX.Element} The rendered aside.\n */\nexport const AppFrameAside = forwardRef<HTMLElement, AppFrameAsideProps>(\n  ({ className, style, width, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const asideClass = usePrefixedClassNames('app-frame-aside');\n    const asideStyle =\n      width === undefined\n        ? style\n        : ({\n            ...style,\n            '--bulma-app-frame-aside-width': cssLength(width),\n          } as React.CSSProperties);\n    return (\n      <aside\n        ref={ref}\n        className={classNames(asideClass, bulmaHelperClasses, className)}\n        style={asideStyle}\n        {...rest}\n      >\n        {children}\n      </aside>\n    );\n  }\n);\n\nAppFrameAside.displayName = 'AppFrame.Aside';\n\n/**\n * The bottom of an AppFrame, under the page.\n *\n * @function\n * @param {AppFrameFooterProps} props - Props for AppFrame.Footer.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<footer>`.\n * @returns {JSX.Element} The rendered footer.\n */\nexport const AppFrameFooter = forwardRef<HTMLElement, AppFrameFooterProps>(\n  ({ className, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const footerClass = usePrefixedClassNames('app-frame-footer');\n    return (\n      <footer\n        ref={ref}\n        className={classNames(footerClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {children}\n      </footer>\n    );\n  }\n);\n\nAppFrameFooter.displayName = 'AppFrame.Footer';\n\n/**\n * The button that opens the drawer, or collapses the column from the breakpoint up: Navbar.Burger, wired to the frame.\n *\n * @function\n * @param {AppFrameBurgerProps} props - Props for AppFrame.Burger.\n * @param {React.Ref<HTMLButtonElement>} ref - Forwarded ref to the `<button>`.\n * @returns {JSX.Element} The rendered burger.\n */\nexport const AppFrameBurger = forwardRef<\n  HTMLButtonElement,\n  AppFrameBurgerProps\n>(({ className, onClick, ...props }, ref) => {\n  // Outside a frame it's a Navbar.Burger that controls nothing.\n  const frame = useContext(FrameContext);\n  const burgerClass = usePrefixedClassNames('app-frame-burger');\n  const state = frame?.state;\n  // Until the frame knows whether the nav is a drawer, the burger says\n  // nothing it can't stand behind: no `aria-expanded`, and its bars. It can't\n  // act before then anyway, since that's before hydration. Outside a frame\n  // it's a plain Navbar.Burger.\n  const known = !!frame?.modeKnown;\n  const expanded =\n    known && !!state && (state.isDrawer ? state.navOpen : !state.navCollapsed);\n  return (\n    <NavbarBurger\n      ref={ref}\n      {...props}\n      className={classNames(burgerClass, className)}\n      aria-label={props['aria-label'] || frame?.labels.burger}\n      active={expanded}\n      aria-expanded={frame && !known ? null : expanded}\n      aria-controls={state?.navId}\n      onClick={e => {\n        onClick?.(e);\n        if (e.defaultPrevented || !frame) return;\n        // Safari, and Firefox on a Mac, don't focus a button that's pressed.\n        // Focused, it's the element the drawer hands focus back to.\n        e.currentTarget.focus();\n        frame.state.toggleNav();\n      }}\n    />\n  );\n});\n\nAppFrameBurger.displayName = 'AppFrame.Burger';\n\nconst isMain = (\n  child: React.ReactNode\n): child is React.ReactElement<AppFrameMainProps> =>\n  isElementOf(child, AppFrameMain);\n\nconst isNav = (\n  child: React.ReactNode\n): child is React.ReactElement<AppFrameNavProps> =>\n  isElementOf(child, AppFrameNav);\n\n/**\n * The `AppFrame` component lays out an app's pages: a header across the top, a navigation column down the side, the page, and an aside and a footer, with the nav a drawer behind a burger on narrow screens.\n *\n * The header and the column stick while the document scrolls, and a skip\n * link comes first. The layout is CSS, so the server renders it as the\n * browser does. It holds two states, each yours to control: whether the\n * drawer is open, and whether the column is collapsed. `AppFrame.Burger`\n * and `useAppFrame()` toggle whichever applies at the current width.\n *\n * @function\n * @param {AppFrameProps} props - Props for the AppFrame component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the root `<div>`.\n * @returns {JSX.Element} The rendered frame.\n *\n * @example\n * <AppFrame>\n *   <AppFrame.Header>\n *     <Navbar aria-label=\"Site\">\n *       <Navbar.Brand>\n *         <Navbar.Item href=\"/\">Acme</Navbar.Item>\n *         <AppFrame.Burger />\n *       </Navbar.Brand>\n *     </Navbar>\n *   </AppFrame.Header>\n *   <AppFrame.Nav>\n *     <Menu>…</Menu>\n *   </AppFrame.Nav>\n *   <AppFrame.Main>…</AppFrame.Main>\n * </AppFrame>\n */\nconst AppFrameRoot = forwardRef<HTMLDivElement, AppFrameProps>(\n  (\n    {\n      className,\n      textColor,\n      bgColor,\n      breakpoint = 'desktop',\n      navOpen: navOpenProp,\n      defaultNavOpen = false,\n      onNavOpenChange,\n      navCollapsed: navCollapsedProp,\n      defaultNavCollapsed = false,\n      onNavCollapsedChange,\n      skipLink = true,\n      labels,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses({\n      color: textColor,\n      backgroundColor: bgColor,\n      ...props,\n    });\n    const rootRef = useRef<HTMLDivElement | null>(null);\n    const rootCleanupRef = useRef<(() => void) | null>(null);\n    const rootRefs = useCallback(\n      (node: HTMLDivElement | null) =>\n        setRefs(node, rootRef, ref, rootCleanupRef),\n      [ref]\n    );\n\n    const [openState, setOpenState] = useState(defaultNavOpen);\n    const [collapsedState, setCollapsedState] = useState(defaultNavCollapsed);\n    const navOpen = navOpenProp ?? openState;\n    const navCollapsed = navCollapsedProp ?? collapsedState;\n    const openControlled = navOpenProp !== undefined;\n    const collapsedControlled = navCollapsedProp !== undefined;\n    const onNavOpenChangeRef = useLatestRef(onNavOpenChange);\n    const onNavCollapsedChangeRef = useLatestRef(onNavCollapsedChange);\n\n    const setNavOpen = useCallback(\n      (open: boolean) => {\n        onNavOpenChangeRef.current?.(open);\n        if (!openControlled) setOpenState(open);\n      },\n      [openControlled, onNavOpenChangeRef]\n    );\n    const setNavCollapsed = useCallback(\n      (collapsed: boolean) => {\n        onNavCollapsedChangeRef.current?.(collapsed);\n        if (!collapsedControlled) setCollapsedState(collapsed);\n      },\n      [collapsedControlled, onNavCollapsedChangeRef]\n    );\n\n    // The layout switches in the stylesheet. The script needs the width\n    // only to know which state the burger toggles, and to close the drawer\n    // once the window is at or past the breakpoint.\n    const wide = useBulmaBreakpoint(breakpoint);\n    const isDrawer = wide === false;\n    const isWide = wide === true;\n\n    useEffect(() => {\n      // eslint-disable-next-line react-hooks/set-state-in-effect -- the width is known only in the browser, and the drawer closes in answer to it\n      if (isWide && navOpen) setNavOpen(false);\n    }, [isWide, navOpen, setNavOpen]);\n\n    const toggleNav = useCallback(() => {\n      if (isDrawer) setNavOpen(!navOpen);\n      else setNavCollapsed(!navCollapsed);\n    }, [isDrawer, navOpen, navCollapsed, setNavOpen, setNavCollapsed]);\n\n    // The ids of the parts the skip link and the burger point at, read off\n    // the children so the server renders them too.\n    const baseId = useId();\n    const parts = flattenChildren(children);\n    const mainId = parts.find(isMain)?.props.id || `${baseId}-main`;\n    const navId = parts.find(isNav)?.props.id || `${baseId}-nav`;\n\n    const { skipLink: skipText, nav, closeNav, burger } = labels ?? {};\n    const value = useMemo<FrameContextValue>(\n      () => ({\n        state: {\n          navOpen,\n          setNavOpen,\n          navCollapsed,\n          setNavCollapsed,\n          isDrawer,\n          toggleNav,\n          navId,\n        },\n        labels: {\n          skipLink: skipText || 'Skip to main content',\n          nav: nav || 'Sections',\n          closeNav: closeNav || 'Close navigation',\n          burger: burger || undefined,\n        },\n        mainId,\n        modeKnown: wide !== null,\n      }),\n      [\n        navOpen,\n        setNavOpen,\n        navCollapsed,\n        setNavCollapsed,\n        isDrawer,\n        toggleNav,\n        navId,\n        skipText,\n        nav,\n        closeNav,\n        burger,\n        mainId,\n        wide,\n      ]\n    );\n\n    // Its header and footer are the page's banner and contentinfo only\n    // outside `main` and sectioning content, as HTML-AAM maps them.\n    useEffect(() => {\n      const host = rootRef.current?.parentElement?.closest(\n        'main, article, aside, nav, section'\n      );\n      if (host) {\n        warnOnce(\n          'AppFrame:nested',\n          `[bestax-bulma] <AppFrame> sits inside a <${host.localName}>, where ` +\n            \"its header and footer are no longer the page's banner and \" +\n            'contentinfo landmarks. Put AppFrame at the top of the page.'\n        );\n      }\n    }, []);\n\n    const rootClass = usePrefixedClassNames('app-frame', {\n      [`is-${breakpoint}`]: true,\n      'is-nav-collapsed': navCollapsed,\n    });\n    const skipClass = usePrefixedClassNames('app-frame-skip-link');\n\n    return (\n      <div\n        ref={rootRefs}\n        className={classNames(rootClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {skipLink && (\n          <a className={skipClass} href={`#${mainId}`}>\n            {value.labels.skipLink}\n          </a>\n        )}\n        <FrameContext.Provider value={value}>{children}</FrameContext.Provider>\n      </div>\n    );\n  }\n);\n\n/**\n * The frame's state, for a control of your own inside it: whether the\n * drawer is open and the column collapsed, setters that go through the\n * frame's callbacks, and `toggleNav()`, which does what the burger does.\n * Outside an AppFrame it's `null`, as the library's other context hooks\n * are, so a control that can sit outside one renders a fallback or nothing.\n *\n * @function useAppFrame\n * @returns The frame's state, or `null` outside an AppFrame.\n */\nexport function useAppFrame(): AppFrameState | null {\n  return useContext(FrameContext)?.state ?? null;\n}\n\nexport const AppFrame = withSubComponents(\n  AppFrameRoot,\n  {\n    Header: AppFrameHeader,\n    Nav: AppFrameNav,\n    Main: AppFrameMain,\n    Aside: AppFrameAside,\n    Footer: AppFrameFooter,\n    Burger: AppFrameBurger,\n  },\n  'AppFrame'\n);\n\nexport default AppFrame;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}
+{"version":3,"file":"AppFrame.js","sources":["../../../src/layout/AppFrame.tsx"],"sourcesContent":["import React, {\n  createContext,\n  forwardRef,\n  useCallback,\n  useContext,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { classNames, usePrefixedClassNames } from '../helpers/classNames';\nimport {\n  useBulmaClasses,\n  BulmaClassesProps,\n  validColors,\n} from '../helpers/useBulmaClasses';\nimport { withSubComponents } from '../helpers/withSubComponents';\nimport { isElementOf } from '../helpers/elementType';\nimport { flattenChildren } from '../helpers/flattenChildren';\nimport { useLatestRef } from '../helpers/useLatestRef';\nimport { useOverlayEscape, useOverlayStack } from '../helpers/overlayStack';\nimport { useScrollLock } from '../helpers/scrollLock';\nimport { useInertSiblings } from '../helpers/useInertSiblings';\nimport { trapTab } from '../helpers/useFocusTrap';\nimport { useOverlayFocus } from '../helpers/useOverlayFocus';\nimport { useOutsidePress } from '../helpers/useOutsidePress';\nimport { getActiveElementInTree } from '../helpers/shadowDom';\nimport { useBulmaBreakpoint } from '../helpers/useBulmaViewport';\nimport { PortalScope } from '../helpers/portal';\nimport { warnOnce } from '../helpers/devWarnings';\nimport { NavbarBurger } from '../components/Navbar';\nimport type { NavbarBurgerProps } from '../components/Navbar';\nimport { Delete } from '../elements/Delete';\nimport type { ContainerBreakpoint } from './Container';\n\n/**\n * The strings AppFrame renders, each with an English default. A key left\n * out, or set to an empty string, keeps its default.\n */\nexport interface AppFrameLabels {\n  /**\n   * The skip link's text.\n   * @defaultValue 'Skip to main content'\n   */\n  skipLink?: string;\n  /**\n   * The nav's accessible name, when `AppFrame.Nav` has no `aria-label` or\n   * `aria-labelledby`. Leave the word \"navigation\" out: the role says it.\n   * @defaultValue 'Sections'\n   */\n  nav?: string;\n  /**\n   * The name of the close button at the top of the drawer.\n   * @defaultValue 'Close navigation'\n   */\n  closeNav?: string;\n  /**\n   * The burger's name, when `AppFrame.Burger` has no `aria-label`.\n   * @defaultValue 'menu', Navbar.Burger's\n   */\n  burger?: string;\n}\n\n/**\n * Props for the AppFrame component. The helper props, the other attributes\n * and the `ref` land on the root `<div>`.\n *\n * @extraProp {React.Ref<HTMLDivElement>} [ref] - Ref forwarded to the root `<div>`.\n */\nexport interface AppFrameProps\n  extends\n    Omit<React.HTMLAttributes<HTMLDivElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * The parts, each a direct child: `Header`, `Nav`, `Main`, `Aside` and\n   * `Footer`, in that order, since it's the Tab order. The frame reads the\n   * `id` of `Main` and `Nav` off its children for the skip link and the\n   * burger, so a part wrapped in a component of your own takes no `id` of\n   * its own. Put the frame at the top of the page, outside any `main` or\n   * sectioning element.\n   */\n  children?: React.ReactNode;\n  /**\n   * The width from which the nav is a column beside the page. Below it, the\n   * nav is a drawer the burger opens. The stylesheet switches the layout at\n   * Bulma's breakpoint, and the script reads the width at Bulma's default\n   * breakpoints, so a theme that moves Bulma's breakpoints moves the layout\n   * but not which state the burger toggles.\n   * @defaultValue 'desktop'\n   */\n  breakpoint?: ContainerBreakpoint;\n  /**\n   * Whether the drawer is open, below the breakpoint. With it, the state is\n   * yours: update it from `onNavOpenChange`. It has no effect from the\n   * breakpoint up, where the frame asks to close it.\n   */\n  navOpen?: boolean;\n  /** Whether the drawer starts open. */\n  defaultNavOpen?: boolean;\n  /**\n   * Called with the state asked for: by the burger, `useAppFrame()`, Escape,\n   * a press outside, the close button, a followed link (see\n   * `AppFrame.Nav`'s `closeOnNavigate`), or the window being at or past the\n   * breakpoint while it's open, which closes it.\n   */\n  onNavOpenChange?: (open: boolean) => void;\n  /**\n   * Whether the column is collapsed out of view, from the breakpoint up.\n   * With it, the state is yours: update it from `onNavCollapsedChange`. It\n   * has no effect below the breakpoint, where the drawer always shows the\n   * whole nav.\n   */\n  navCollapsed?: boolean;\n  /** Whether the column starts collapsed. */\n  defaultNavCollapsed?: boolean;\n  /** Called with the state asked for, by the burger or `useAppFrame()`. */\n  onNavCollapsedChange?: (collapsed: boolean) => void;\n  /**\n   * Renders a skip link first, visible when it has focus, that moves focus\n   * to `AppFrame.Main`. Turn it off only for a page that has its own.\n   */\n  skipLink?: boolean;\n  /** The strings the frame renders. Each one left out keeps its English default. */\n  labels?: AppFrameLabels;\n  /** Text color helper. */\n  textColor?: (typeof validColors)[number] | 'inherit' | 'current';\n  /** Background color helper. */\n  bgColor?: (typeof validColors)[number] | 'inherit' | 'current';\n}\n\n/**\n * Props for AppFrame.Header, on its `<header>`, which sticks to the top.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<header>`.\n */\nexport interface AppFrameHeaderProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * Usually a `Navbar`, not `fixed`, with `AppFrame.Burger` in its\n   * `Navbar.Brand`. A header taller than Bulma's navbar sets\n   * `--bulma-app-frame-header-height` on `:root`, so the nav column, an\n   * in-page link and focus clear it.\n   */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Nav, on its `<nav>`.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<nav>`.\n * @extraProp {string} [id] - The nav's id, which the burger's `aria-controls` points at. The frame makes one when there's none.\n * @extraProp {string} [aria-label] - The nav's name. Without it or `aria-labelledby`, it's the frame's `labels.nav`, \"Sections\".\n */\nexport interface AppFrameNavProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /**\n   * Usually a `Menu`. A nav taller than the window scrolls on its own. With\n   * `overlay`, the rest of the frame is inert while the drawer is open, so an\n   * overlay opened from the drawer, such as a `Modal`, goes inside the nav or\n   * renders outside the frame (Modal's `portal`). While the nav is a drawer,\n   * a popup opened in it, such as a Popover's `appendToBody` panel, portals\n   * into the nav, so it shows above the drawer, unless a `ConfigProvider`\n   * sets a `portalContainer`. In the column it portals to the end of the\n   * page, as it does anywhere else.\n   */\n  children?: React.ReactNode;\n  /**\n   * The column's width, and the drawer's up to the window's width less a\n   * strip of backdrop. A number is pixels, and a string any CSS length. It\n   * writes `--bulma-app-frame-nav-width`, 16rem by default.\n   */\n  width?: number | string;\n  /**\n   * Shows a backdrop behind the drawer and makes it modal: Tab stays inside,\n   * the page scroll locks, and the rest of the frame is inert, while what\n   * renders outside it, such as a Modal opened from the drawer or a toast,\n   * stays live. Without it the drawer covers the page without holding Tab,\n   * and focus can move to the page beside it. Either way focus moves in as\n   * it opens. Sidebar's `overlay`.\n   */\n  overlay?: boolean;\n  /**\n   * Closes the drawer on Escape, while it's the topmost overlay, so Escape\n   * closes one layer at a time.\n   */\n  closeOnEscape?: boolean;\n  /**\n   * Closes the drawer on a press outside it while it's the topmost overlay:\n   * a click on the backdrop, or without `overlay` a press anywhere outside\n   * it. Focus goes back to the burger as it closes. Without `overlay`, the\n   * press's own mousedown then moves it, as on any page: to what was pressed\n   * if that takes focus, and otherwise off the burger to the page. A touch\n   * that scrolls leaves it on the burger. A press on a control whose\n   * `aria-controls` names the nav, such as the burger, is left to that\n   * control. Popover's `closeOnClickOutside`.\n   */\n  closeOnClickOutside?: boolean;\n  /**\n   * Closes the drawer when a link inside it is followed with a plain click:\n   * not with a modifier key held, and not on a link with a `target` other\n   * than `_self` or a `download`. Only a link the nav holds in the page\n   * counts, not one in a Modal or a popup it portals elsewhere. Focus goes\n   * back to the burger, and the navigation takes it from there: a router\n   * that moves focus on navigation moves it, and an in-page `#` link leaves\n   * it at its target, as it does anywhere on the page. Turn it off for a\n   * drawer of filters rather than links.\n   */\n  closeOnNavigate?: boolean;\n}\n\n/**\n * Props for AppFrame.Main, on the page's one `<main>`. Don't put another\n * `<main>` inside it. It takes your `id`, or a generated one, for the skip\n * link, and `tabIndex={-1}` so the link can move focus to it.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<main>`.\n * @extraProp {string} [id] - Its id, which the skip link points at. The frame makes one when there's none.\n */\nexport interface AppFrameMainProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** The page. A `Container` or a `Section` inside it gives Bulma's widths and padding. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Aside, on its `<aside>`, a complementary landmark.\n * Give it an `aria-label` when the page has more than one.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<aside>`.\n */\nexport interface AppFrameAsideProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** What sits beside the page: an outline, details, filters. */\n  children?: React.ReactNode;\n  /**\n   * Its width from the breakpoint up; below it, the aside moves under the\n   * page. A number is pixels, and a string any CSS length. It writes\n   * `--bulma-app-frame-aside-width`, 20rem by default.\n   */\n  width?: number | string;\n}\n\n/**\n * Props for AppFrame.Footer, on its `<footer>`.\n *\n * @extraProp {React.Ref<HTMLElement>} [ref] - Ref forwarded to the `<footer>`.\n */\nexport interface AppFrameFooterProps\n  extends\n    Omit<React.HTMLAttributes<HTMLElement>, 'color'>,\n    Omit<BulmaClassesProps, 'color' | 'backgroundColor'> {\n  /** Plain content, or bestax's `Footer` with `as=\"div\"` for Bulma's footer look. */\n  children?: React.ReactNode;\n}\n\n/**\n * Props for AppFrame.Burger: Navbar.Burger's, less the state the frame\n * fills in. Its `<button>` opens and closes the drawer below the breakpoint\n * and collapses and expands the column from it up, with `aria-expanded` and\n * `aria-controls` following the nav. It shows at every width. Hide it from\n * the breakpoint up with the visibility helpers when the column never\n * collapses. Outside an AppFrame it controls nothing.\n */\nexport type AppFrameBurgerProps = Omit<\n  NavbarBurgerProps,\n  'active' | 'aria-expanded' | 'aria-controls'\n>;\n\n/** What `useAppFrame()` returns. */\nexport interface AppFrameState {\n  /** Whether the drawer is open. */\n  navOpen: boolean;\n  /** Asks to open or close the drawer, through `onNavOpenChange`. */\n  setNavOpen: (open: boolean) => void;\n  /** Whether the column is collapsed. */\n  navCollapsed: boolean;\n  /** Asks to collapse or expand the column, through `onNavCollapsedChange`. */\n  setNavCollapsed: (collapsed: boolean) => void;\n  /**\n   * Whether the nav is a drawer at the current width. `false` on the server\n   * and until the first layout effect has read the width.\n   */\n  isDrawer: boolean;\n  /** Toggles whichever state applies at the current width, as the burger does. */\n  toggleNav: () => void;\n  /** The nav's `id`, for a custom toggle's `aria-controls`. */\n  navId: string;\n}\n\n/** What the frame tells its parts. */\ninterface FrameContextValue {\n  state: AppFrameState;\n  labels: Required<Omit<AppFrameLabels, 'burger'>> &\n    Pick<AppFrameLabels, 'burger'>;\n  mainId: string;\n  /**\n   * Whether the frame has read the width, so it knows whether the nav is a\n   * drawer. Not on the server, nor in the render that hydrates.\n   */\n  modeKnown: boolean;\n}\n\nconst FrameContext = createContext<FrameContextValue | null>(null);\n\n/** A width prop as CSS: a number is pixels. */\nconst cssLength = (value: number | string) =>\n  typeof value === 'number' ? `${value}px` : value;\n\n/**\n * Hands `node` to a part's own ref and to the one forwarded to it. A\n * forwarded callback that returns a cleanup, as React 19 allows, has it held\n * in `cleanup` and run on detach in place of a call with `null`, on React 18\n * as well.\n */\nfunction setRefs<T>(\n  node: T | null,\n  own: React.MutableRefObject<T | null>,\n  forwarded: React.ForwardedRef<T>,\n  cleanup: React.MutableRefObject<(() => void) | null>\n) {\n  own.current = node;\n  if (typeof forwarded === 'function') {\n    if (node === null) {\n      const detach = cleanup.current;\n      cleanup.current = null;\n      if (detach) detach();\n      else forwarded(null);\n      return;\n    }\n    const returned: unknown = forwarded(node);\n    cleanup.current =\n      typeof returned === 'function' ? (returned as () => void) : null;\n  } else if (forwarded) {\n    forwarded.current = node;\n  }\n}\n\n/**\n * Warns when a part has an `id` the frame couldn't read, because it isn't a\n * direct child, so the skip link or the burger points at the wrong one.\n */\nfunction warnOnUnreadId(part: string, id: unknown, expected: string) {\n  if (id && id !== expected) {\n    warnOnce(\n      `AppFrame:${part}-id`,\n      `[bestax-bulma] <AppFrame.${part}> has an id <AppFrame> can't read, ` +\n        `so ${part === 'Main' ? 'the skip link' : \"the burger's aria-controls\"} ` +\n        `misses it. Put AppFrame.${part} directly inside AppFrame.`\n    );\n  }\n}\n\n/**\n * The top bar of an AppFrame, which sticks while the page scrolls.\n *\n * @function\n * @param {AppFrameHeaderProps} props - Props for AppFrame.Header.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<header>`.\n * @returns {JSX.Element} The rendered header.\n */\nexport const AppFrameHeader = forwardRef<HTMLElement, AppFrameHeaderProps>(\n  ({ className, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const headerClass = usePrefixedClassNames('app-frame-header');\n    return (\n      <header\n        ref={ref}\n        className={classNames(headerClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {children}\n      </header>\n    );\n  }\n);\n\nAppFrameHeader.displayName = 'AppFrame.Header';\n\n/**\n * The navigation of an AppFrame: a column beside the page from the breakpoint up, and a drawer below it.\n *\n * @function\n * @param {AppFrameNavProps} props - Props for AppFrame.Nav.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<nav>`.\n * @returns {JSX.Element} The rendered nav, and the drawer's backdrop.\n */\nexport const AppFrameNav = forwardRef<HTMLElement, AppFrameNavProps>(\n  (\n    {\n      className,\n      style,\n      width,\n      overlay = true,\n      closeOnEscape = true,\n      closeOnClickOutside = true,\n      closeOnNavigate = true,\n      onClick,\n      onPointerDownCapture,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const frame = useContext(FrameContext);\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const navClass = usePrefixedClassNames('app-frame-nav');\n    const closeClass = usePrefixedClassNames('app-frame-close');\n    const backdropClass = usePrefixedClassNames('app-frame-backdrop');\n    const activeClass = usePrefixedClassNames('is-active');\n    const navRef = useRef<HTMLElement | null>(null);\n    const backdropRef = useRef<HTMLDivElement | null>(null);\n    const navCleanupRef = useRef<(() => void) | null>(null);\n    // The nav, as state, for the popups inside the drawer to portal into.\n    const [navNode, setNavNode] = useState<HTMLElement | null>(null);\n    const navRefs = useCallback(\n      (node: HTMLElement | null) => {\n        setNavNode(node);\n        setRefs(node, navRef, ref, navCleanupRef);\n      },\n      [ref]\n    );\n\n    const navId = rest.id || frame?.state.navId;\n    if (frame) warnOnUnreadId('Nav', rest.id, frame.state.navId);\n    // The drawer is open only below the breakpoint. Above it the nav is a\n    // column, and none of what follows applies.\n    const isDrawer = !!frame?.state.isDrawer;\n    const open = isDrawer && !!frame?.state.navOpen;\n    // The open drawer is Bulma's active state, on the nav as on a navbar's\n    // menu, and on its backdrop.\n    const shown = { [activeClass]: !!frame?.state.navOpen };\n    const modal = open && overlay;\n    const close = () => frame?.state.setNavOpen(false);\n\n    // The rest of the frame goes inert: the header, the page, the aside and\n    // the footer, but not the backdrop, which takes the presses outside the\n    // drawer rather than let them through to what's under it. Not the whole\n    // page, since a Modal or a toast renders beside the frame, often into an\n    // element that's there before the drawer opens, and a Modal opened from\n    // the drawer has to stay usable. First, so that as the drawer closes it\n    // lets go before focus goes back to the burger: an inert element can't\n    // take focus.\n    useInertSiblings(navRef, modal, false, backdropRef);\n    const isTopmost = useOverlayStack(open, overlay);\n    useScrollLock(modal);\n\n    // Tab stays inside while the drawer is the topmost modal overlay, as in\n    // Sidebar, so a Modal opened from the drawer holds Tab until it closes.\n    useEffect(() => {\n      if (!modal) return undefined;\n      return trapTab(\n        () => navRef.current,\n        window,\n        () => isTopmost('modal')\n      );\n    }, [modal, isTopmost]);\n\n    useOverlayEscape(open && closeOnEscape, isTopmost, close);\n\n    // Without an overlay there's no backdrop: a press outside the drawer\n    // closes it, as Popover's does, while it's the topmost overlay, so a\n    // press in a Modal opened over it is the Modal's. A press on a control\n    // that names the nav in its `aria-controls`, such as the burger, is left\n    // to that control, which toggles it.\n    const markInsidePress = useOutsidePress(\n      navRef,\n      open && !overlay && closeOnClickOutside,\n      e => {\n        const id = navRef.current?.id;\n        const controlsNav = (node: EventTarget) =>\n          !!(node as Element)\n            .getAttribute?.('aria-controls')\n            ?.split(/\\s+/)\n            .includes(id as string);\n        if (!isTopmost() || e.composedPath().some(controlsNav)) return;\n        close();\n      }\n    );\n\n    // Focus moves to the drawer's first tab stop, the close button, as it\n    // opens, and back to whatever had it as it closes, unless it has left\n    // the drawer. After a press outside, the press's own mousedown then takes\n    // it wherever the press goes. When the window widened, the drawer is the\n    // column again, and focus on its links stays; the close button hides\n    // there, so focus on it, or dropped from it to <body>, goes back too.\n    const isDrawerRef = useLatestRef(isDrawer);\n    useOverlayFocus(navRef, open, {\n      modal: overlay,\n      restore: () => {\n        if (isDrawerRef.current) return true;\n        const nav = navRef.current as HTMLElement;\n        const active = getActiveElementInTree(nav);\n        return (\n          !nav.contains(active) || !!active?.classList.contains(closeClass)\n        );\n      },\n    });\n\n    const handleClick = (e: React.MouseEvent<HTMLElement>) => {\n      onClick?.(e);\n      if (\n        !open ||\n        !closeOnNavigate ||\n        e.button !== 0 ||\n        e.metaKey ||\n        e.ctrlKey ||\n        e.shiftKey ||\n        e.altKey\n      ) {\n        return;\n      }\n      // Not skipped for a click whose default was prevented: a router's\n      // link prevents it to navigate without a page load. Only a link the nav\n      // holds: one in a Modal portaled from it is the Modal's.\n      const link = (e.target as Element).closest('a[href]');\n      if (!link || !navRef.current?.contains(link)) return;\n      if (link.hasAttribute('download')) return;\n      const target = link.getAttribute('target');\n      if (target && target !== '_self') return;\n      close();\n    };\n\n    const navStyle =\n      width === undefined\n        ? style\n        : ({\n            ...style,\n            '--bulma-app-frame-nav-width': cssLength(width),\n          } as React.CSSProperties);\n\n    return (\n      <>\n        <nav\n          ref={navRefs}\n          className={classNames(navClass, shown, bulmaHelperClasses, className)}\n          style={navStyle}\n          onClick={handleClick}\n          onPointerDownCapture={e => {\n            onPointerDownCapture?.(e);\n            markInsidePress(e);\n          }}\n          {...rest}\n          id={navId}\n          aria-label={\n            rest['aria-label'] ||\n            (rest['aria-labelledby'] ? undefined : frame?.labels.nav)\n          }\n        >\n          {frame && (\n            <Delete\n              className={closeClass}\n              size=\"medium\"\n              ariaLabel={frame.labels.closeNav}\n              onClick={close}\n            />\n          )}\n          {/* The drawer draws over the page, so a popup opened in it, such\n              as a Popover's panel, portals into it to show above it. The\n              column doesn't: it's under the header, which the popup has to\n              clear. */}\n          <PortalScope node={isDrawer ? navNode : undefined}>\n            {children}\n          </PortalScope>\n        </nav>\n        {frame && overlay && (\n          <div\n            ref={backdropRef}\n            className={classNames(backdropClass, shown)}\n            aria-hidden=\"true\"\n            onClick={\n              closeOnClickOutside\n                ? () => {\n                    // Not under an overlay opened over the drawer.\n                    if (isTopmost()) close();\n                  }\n                : undefined\n            }\n          />\n        )}\n      </>\n    );\n  }\n);\n\nAppFrameNav.displayName = 'AppFrame.Nav';\n\n/**\n * The page's main content in an AppFrame, which the skip link moves focus to.\n *\n * @function\n * @param {AppFrameMainProps} props - Props for AppFrame.Main.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<main>`.\n * @returns {JSX.Element} The rendered main.\n */\nexport const AppFrameMain = forwardRef<HTMLElement, AppFrameMainProps>(\n  ({ className, children, ...props }, ref) => {\n    const frame = useContext(FrameContext);\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const mainClass = usePrefixedClassNames('app-frame-main');\n    if (frame) warnOnUnreadId('Main', rest.id, frame.mainId);\n    return (\n      <main\n        ref={ref}\n        tabIndex={-1}\n        className={classNames(mainClass, bulmaHelperClasses, className)}\n        {...rest}\n        id={rest.id || frame?.mainId}\n      >\n        {children}\n      </main>\n    );\n  }\n);\n\nAppFrameMain.displayName = 'AppFrame.Main';\n\n/**\n * Content beside the page in an AppFrame, which moves under it below the breakpoint.\n *\n * @function\n * @param {AppFrameAsideProps} props - Props for AppFrame.Aside.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<aside>`.\n * @returns {JSX.Element} The rendered aside.\n */\nexport const AppFrameAside = forwardRef<HTMLElement, AppFrameAsideProps>(\n  ({ className, style, width, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const asideClass = usePrefixedClassNames('app-frame-aside');\n    const asideStyle =\n      width === undefined\n        ? style\n        : ({\n            ...style,\n            '--bulma-app-frame-aside-width': cssLength(width),\n          } as React.CSSProperties);\n    return (\n      <aside\n        ref={ref}\n        className={classNames(asideClass, bulmaHelperClasses, className)}\n        style={asideStyle}\n        {...rest}\n      >\n        {children}\n      </aside>\n    );\n  }\n);\n\nAppFrameAside.displayName = 'AppFrame.Aside';\n\n/**\n * The bottom of an AppFrame, under the page.\n *\n * @function\n * @param {AppFrameFooterProps} props - Props for AppFrame.Footer.\n * @param {React.Ref<HTMLElement>} ref - Forwarded ref to the `<footer>`.\n * @returns {JSX.Element} The rendered footer.\n */\nexport const AppFrameFooter = forwardRef<HTMLElement, AppFrameFooterProps>(\n  ({ className, children, ...props }, ref) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses(props);\n    const footerClass = usePrefixedClassNames('app-frame-footer');\n    return (\n      <footer\n        ref={ref}\n        className={classNames(footerClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {children}\n      </footer>\n    );\n  }\n);\n\nAppFrameFooter.displayName = 'AppFrame.Footer';\n\n/**\n * The button that opens the drawer, or collapses the column from the breakpoint up: Navbar.Burger, wired to the frame.\n *\n * @function\n * @param {AppFrameBurgerProps} props - Props for AppFrame.Burger.\n * @param {React.Ref<HTMLButtonElement>} ref - Forwarded ref to the `<button>`.\n * @returns {JSX.Element} The rendered burger.\n */\nexport const AppFrameBurger = forwardRef<\n  HTMLButtonElement,\n  AppFrameBurgerProps\n>(({ className, onClick, ...props }, ref) => {\n  // Outside a frame it's a Navbar.Burger that controls nothing.\n  const frame = useContext(FrameContext);\n  const burgerClass = usePrefixedClassNames('app-frame-burger');\n  const state = frame?.state;\n  // Until the frame knows whether the nav is a drawer, the burger says\n  // nothing it can't stand behind: no `aria-expanded`, and its bars. It can't\n  // act before then anyway, since that's before hydration. Outside a frame\n  // it's a plain Navbar.Burger.\n  const known = !!frame?.modeKnown;\n  const expanded =\n    known && !!state && (state.isDrawer ? state.navOpen : !state.navCollapsed);\n  return (\n    <NavbarBurger\n      ref={ref}\n      {...props}\n      className={classNames(burgerClass, className)}\n      aria-label={props['aria-label'] || frame?.labels.burger}\n      active={expanded}\n      aria-expanded={frame && !known ? null : expanded}\n      aria-controls={state?.navId}\n      onClick={e => {\n        onClick?.(e);\n        if (e.defaultPrevented || !frame) return;\n        // Safari, and Firefox on a Mac, don't focus a button that's pressed.\n        // Focused, it's the element the drawer hands focus back to.\n        e.currentTarget.focus();\n        frame.state.toggleNav();\n      }}\n    />\n  );\n});\n\nAppFrameBurger.displayName = 'AppFrame.Burger';\n\nconst isMain = (\n  child: React.ReactNode\n): child is React.ReactElement<AppFrameMainProps> =>\n  isElementOf(child, AppFrameMain);\n\nconst isNav = (\n  child: React.ReactNode\n): child is React.ReactElement<AppFrameNavProps> =>\n  isElementOf(child, AppFrameNav);\n\n/**\n * The `AppFrame` component lays out an app's pages: a header across the top, a navigation column down the side, the page, and an aside and a footer, with the nav a drawer behind a burger on narrow screens.\n *\n * The header and the column stick while the document scrolls, and a skip\n * link comes first. The layout is CSS, so the server renders it as the\n * browser does. It holds two states, each yours to control: whether the\n * drawer is open, and whether the column is collapsed. `AppFrame.Burger`\n * and `useAppFrame()` toggle whichever applies at the current width.\n *\n * @function\n * @param {AppFrameProps} props - Props for the AppFrame component.\n * @param {React.Ref<HTMLDivElement>} ref - Forwarded ref to the root `<div>`.\n * @returns {JSX.Element} The rendered frame.\n *\n * @example\n * <AppFrame>\n *   <AppFrame.Header>\n *     <Navbar aria-label=\"Site\">\n *       <Navbar.Brand>\n *         <Navbar.Item href=\"/\">Acme</Navbar.Item>\n *         <AppFrame.Burger />\n *       </Navbar.Brand>\n *     </Navbar>\n *   </AppFrame.Header>\n *   <AppFrame.Nav>\n *     <Menu>…</Menu>\n *   </AppFrame.Nav>\n *   <AppFrame.Main>…</AppFrame.Main>\n * </AppFrame>\n */\nconst AppFrameRoot = forwardRef<HTMLDivElement, AppFrameProps>(\n  (\n    {\n      className,\n      textColor,\n      bgColor,\n      breakpoint = 'desktop',\n      navOpen: navOpenProp,\n      defaultNavOpen = false,\n      onNavOpenChange,\n      navCollapsed: navCollapsedProp,\n      defaultNavCollapsed = false,\n      onNavCollapsedChange,\n      skipLink = true,\n      labels,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const { bulmaHelperClasses, rest } = useBulmaClasses({\n      color: textColor,\n      backgroundColor: bgColor,\n      ...props,\n    });\n    const rootRef = useRef<HTMLDivElement | null>(null);\n    const rootCleanupRef = useRef<(() => void) | null>(null);\n    const rootRefs = useCallback(\n      (node: HTMLDivElement | null) =>\n        setRefs(node, rootRef, ref, rootCleanupRef),\n      [ref]\n    );\n\n    const [openState, setOpenState] = useState(defaultNavOpen);\n    const [collapsedState, setCollapsedState] = useState(defaultNavCollapsed);\n    const navOpen = navOpenProp ?? openState;\n    const navCollapsed = navCollapsedProp ?? collapsedState;\n    const openControlled = navOpenProp !== undefined;\n    const collapsedControlled = navCollapsedProp !== undefined;\n    const onNavOpenChangeRef = useLatestRef(onNavOpenChange);\n    const onNavCollapsedChangeRef = useLatestRef(onNavCollapsedChange);\n\n    const setNavOpen = useCallback(\n      (open: boolean) => {\n        onNavOpenChangeRef.current?.(open);\n        if (!openControlled) setOpenState(open);\n      },\n      [openControlled, onNavOpenChangeRef]\n    );\n    const setNavCollapsed = useCallback(\n      (collapsed: boolean) => {\n        onNavCollapsedChangeRef.current?.(collapsed);\n        if (!collapsedControlled) setCollapsedState(collapsed);\n      },\n      [collapsedControlled, onNavCollapsedChangeRef]\n    );\n\n    // The layout switches in the stylesheet. The script needs the width\n    // only to know which state the burger toggles, and to close the drawer\n    // once the window is at or past the breakpoint.\n    const wide = useBulmaBreakpoint(breakpoint);\n    const isDrawer = wide === false;\n    const isWide = wide === true;\n\n    useEffect(() => {\n      // eslint-disable-next-line react-hooks/set-state-in-effect -- the width is known only in the browser, and the drawer closes in answer to it\n      if (isWide && navOpen) setNavOpen(false);\n    }, [isWide, navOpen, setNavOpen]);\n\n    const toggleNav = useCallback(() => {\n      if (isDrawer) setNavOpen(!navOpen);\n      else setNavCollapsed(!navCollapsed);\n    }, [isDrawer, navOpen, navCollapsed, setNavOpen, setNavCollapsed]);\n\n    // The ids of the parts the skip link and the burger point at, read off\n    // the children so the server renders them too.\n    const baseId = useId();\n    const parts = flattenChildren(children);\n    const mainId = parts.find(isMain)?.props.id || `${baseId}-main`;\n    const navId = parts.find(isNav)?.props.id || `${baseId}-nav`;\n\n    const { skipLink: skipText, nav, closeNav, burger } = labels ?? {};\n    const value = useMemo<FrameContextValue>(\n      () => ({\n        state: {\n          navOpen,\n          setNavOpen,\n          navCollapsed,\n          setNavCollapsed,\n          isDrawer,\n          toggleNav,\n          navId,\n        },\n        labels: {\n          skipLink: skipText || 'Skip to main content',\n          nav: nav || 'Sections',\n          closeNav: closeNav || 'Close navigation',\n          burger: burger || undefined,\n        },\n        mainId,\n        modeKnown: wide !== null,\n      }),\n      [\n        navOpen,\n        setNavOpen,\n        navCollapsed,\n        setNavCollapsed,\n        isDrawer,\n        toggleNav,\n        navId,\n        skipText,\n        nav,\n        closeNav,\n        burger,\n        mainId,\n        wide,\n      ]\n    );\n\n    // Its header and footer are the page's banner and contentinfo only\n    // outside `main` and sectioning content, as HTML-AAM maps them.\n    useEffect(() => {\n      const host = rootRef.current?.parentElement?.closest(\n        'main, article, aside, nav, section'\n      );\n      if (host) {\n        warnOnce(\n          'AppFrame:nested',\n          `[bestax-bulma] <AppFrame> sits inside a <${host.localName}>, where ` +\n            \"its header and footer are no longer the page's banner and \" +\n            'contentinfo landmarks. Put AppFrame at the top of the page.'\n        );\n      }\n    }, []);\n\n    const rootClass = usePrefixedClassNames('app-frame', {\n      [`is-${breakpoint}`]: true,\n      'is-nav-collapsed': navCollapsed,\n    });\n    const skipClass = usePrefixedClassNames('app-frame-skip-link');\n\n    return (\n      <div\n        ref={rootRefs}\n        className={classNames(rootClass, bulmaHelperClasses, className)}\n        {...rest}\n      >\n        {skipLink && (\n          <a className={skipClass} href={`#${mainId}`}>\n            {value.labels.skipLink}\n          </a>\n        )}\n        <FrameContext.Provider value={value}>{children}</FrameContext.Provider>\n      </div>\n    );\n  }\n);\n\n/**\n * The frame's state, for a control of your own inside it: whether the\n * drawer is open and the column collapsed, setters that go through the\n * frame's callbacks, and `toggleNav()`, which does what the burger does.\n * Outside an AppFrame it's `null`, as the library's other context hooks\n * are, so a control that can sit outside one renders a fallback or nothing.\n *\n * @function useAppFrame\n * @returns The frame's state, or `null` outside an AppFrame.\n */\nexport function useAppFrame(): AppFrameState | null {\n  return useContext(FrameContext)?.state ?? null;\n}\n\nexport const AppFrame = withSubComponents(\n  AppFrameRoot,\n  {\n    Header: AppFrameHeader,\n    Nav: AppFrameNav,\n    Main: AppFrameMain,\n    Aside: AppFrameAside,\n    Footer: AppFrameFooter,\n    Burger: AppFrameBurger,\n  },\n  'AppFrame'\n);\n\nexport default AppFrame;\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}