@dxos/react-ui 0.6.13-main.ed424a1 → 0.6.13

package/dist/lib/node/index.cjs

@@ -1,2400 +0,0 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var node_exports = {};
-__export(node_exports, {
-  AlertDialog: () => AlertDialog,
-  AnchoredOverflow: () => AnchoredOverflow,
-  Avatar: () => Avatar,
-  AvatarGroup: () => AvatarGroup,
-  AvatarGroupItem: () => AvatarGroupItem,
-  BUTTON_GROUP_NAME: () => BUTTON_GROUP_NAME,
-  Breadcrumb: () => Breadcrumb,
-  Button: () => Button,
-  ButtonGroup: () => ButtonGroup,
-  ContextMenu: () => ContextMenu2,
-  DensityContext: () => DensityContext,
-  DensityProvider: () => DensityProvider,
-  Dialog: () => Dialog,
-  DropdownMenu: () => DropdownMenu2,
-  ElevationContext: () => ElevationContext,
-  ElevationProvider: () => ElevationProvider,
-  Icon: () => Icon,
-  Input: () => Input,
-  LIST_ITEM_NAME: () => import_react_list.LIST_ITEM_NAME,
-  LIST_NAME: () => import_react_list.LIST_NAME,
-  Link: () => Link,
-  List: () => List,
-  ListItem: () => ListItem,
-  Main: () => Main,
-  Message: () => Message,
-  Popover: () => Popover,
-  ScrollArea: () => ScrollArea,
-  Select: () => Select,
-  Separator: () => Separator4,
-  Status: () => Status,
-  Tag: () => Tag,
-  ThemeContext: () => ThemeContext,
-  ThemeProvider: () => ThemeProvider,
-  Toast: () => Toast,
-  Toggle: () => Toggle,
-  ToggleGroup: () => ToggleGroup,
-  ToggleGroupItem: () => ToggleGroupItem,
-  Toolbar: () => Toolbar,
-  Tooltip: () => Tooltip,
-  Trans: () => import_react_i18next.Trans,
-  Tree: () => Tree,
-  TreeItem: () => TreeItem,
-  Treegrid: () => Treegrid,
-  hasIosKeyboard: () => hasIosKeyboard,
-  isLabel: () => isLabel,
-  toLocalizedString: () => toLocalizedString,
-  useAvatarContext: () => useAvatarContext,
-  useButtonGroupContext: () => useButtonGroupContext,
-  useDensityContext: () => useDensityContext,
-  useDropdownMenuContext: () => useDropdownMenuContext2,
-  useDropdownMenuMenuScope: () => useDropdownMenuMenuScope2,
-  useElevationContext: () => useElevationContext,
-  useListContext: () => import_react_list.useListContext,
-  useListItemContext: () => import_react_list.useListItemContext,
-  useMainContext: () => useMainContext,
-  useSidebars: () => useSidebars,
-  useThemeContext: () => useThemeContext,
-  useTranslation: () => useTranslation,
-  useTranslationsContext: () => useTranslationsContext,
-  useVisualViewport: () => useVisualViewport
-});
-module.exports = __toCommonJS(node_exports);
-var import_react_i18next = require("react-i18next");
-__reExport(node_exports, require("@dxos/react-hooks"), module.exports);
-__reExport(node_exports, require("@dxos/react-ui-types"), module.exports);
-var import_react_primitive = require("@radix-ui/react-primitive");
-var import_react_slot = require("@radix-ui/react-slot");
-var import_react = __toESM(require("react"));
-var import_react2 = require("react");
-var import_react3 = require("react");
-var import_react4 = require("react");
-var import_locale = require("date-fns/locale");
-var import_i18next = __toESM(require("i18next"));
-var import_react5 = __toESM(require("react"));
-var import_react_i18next2 = require("react-i18next");
-var import_react6 = require("react");
-var import_react7 = require("react");
-var import_react_avatar = require("@radix-ui/react-avatar");
-var import_react_context = require("@radix-ui/react-context");
-var import_react_primitive2 = require("@radix-ui/react-primitive");
-var import_react_slot2 = require("@radix-ui/react-slot");
-var import_react8 = __toESM(require("react"));
-var import_react_hooks = require("@dxos/react-hooks");
-var import_react9 = __toESM(require("react"));
-var import_react10 = __toESM(require("react"));
-var import_react_hooks2 = require("@dxos/react-hooks");
-var import_react11 = require("@phosphor-icons/react");
-var import_react_primitive3 = require("@radix-ui/react-primitive");
-var import_react_slot3 = require("@radix-ui/react-slot");
-var import_react12 = __toESM(require("react"));
-var import_react_primitive4 = require("@radix-ui/react-primitive");
-var import_react_slot4 = require("@radix-ui/react-slot");
-var import_react13 = __toESM(require("react"));
-var import_react_context2 = require("@radix-ui/react-context");
-var import_react_primitive5 = require("@radix-ui/react-primitive");
-var import_react_slot5 = require("@radix-ui/react-slot");
-var import_react14 = __toESM(require("react"));
-var import_react_toggle = require("@radix-ui/react-toggle");
-var import_react15 = __toESM(require("react"));
-var import_react_toggle_group = require("@radix-ui/react-toggle-group");
-var import_react16 = __toESM(require("react"));
-var import_react_context3 = require("@radix-ui/react-context");
-var import_react_dialog = require("@radix-ui/react-dialog");
-var import_react17 = __toESM(require("react"));
-var import_react18 = __toESM(require("react"));
-var import_react_alert_dialog = require("@radix-ui/react-alert-dialog");
-var import_react_context4 = require("@radix-ui/react-context");
-var import_react19 = __toESM(require("react"));
-var ContextMenuPrimitive = __toESM(require("@radix-ui/react-context-menu"));
-var import_react_primitive6 = require("@radix-ui/react-primitive");
-var import_react_slot6 = require("@radix-ui/react-slot");
-var import_react20 = __toESM(require("react"));
-var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"));
-var import_react_primitive7 = require("@radix-ui/react-primitive");
-var import_react_slot7 = require("@radix-ui/react-slot");
-var import_react21 = __toESM(require("react"));
-var import_react22 = require("@phosphor-icons/react");
-var import_react_checkbox = require("@radix-ui/react-checkbox");
-var import_react_switch = require("@radix-ui/react-switch");
-var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state");
-var import_react23 = __toESM(require("react"));
-var import_react_input = require("@dxos/react-input");
-var import_react24 = require("@phosphor-icons/react");
-var import_react_slot8 = require("@radix-ui/react-slot");
-var import_react25 = __toESM(require("react"));
-var import_react_list = require("@dxos/react-list");
-var import_react26 = __toESM(require("react"));
-var import_react27 = __toESM(require("react"));
-var import_react_tabster = require("@fluentui/react-tabster");
-var import_react_context5 = require("@radix-ui/react-context");
-var import_react_primitive8 = require("@radix-ui/react-primitive");
-var import_react_slot9 = require("@radix-ui/react-slot");
-var import_react_use_controllable_state2 = require("@radix-ui/react-use-controllable-state");
-var import_react28 = __toESM(require("react"));
-var import_react_tabster2 = require("@fluentui/react-tabster");
-var import_react_compose_refs = require("@radix-ui/react-compose-refs");
-var import_react_context6 = require("@radix-ui/react-context");
-var import_react_dialog2 = require("@radix-ui/react-dialog");
-var import_react_primitive9 = require("@radix-ui/react-primitive");
-var import_react_slot10 = require("@radix-ui/react-slot");
-var import_react_use_controllable_state3 = require("@radix-ui/react-use-controllable-state");
-var import_react29 = __toESM(require("react"));
-var import_log = require("@dxos/log");
-var import_react_hooks3 = require("@dxos/react-hooks");
-var import_react30 = require("react");
-var import_react_context7 = require("@radix-ui/react-context");
-var import_react_primitive10 = require("@radix-ui/react-primitive");
-var import_react_slot11 = require("@radix-ui/react-slot");
-var import_react31 = __toESM(require("react"));
-var import_react_hooks4 = require("@dxos/react-hooks");
-var import_react_popover = require("@radix-ui/react-popover");
-var import_react_primitive11 = require("@radix-ui/react-primitive");
-var import_react_slot12 = require("@radix-ui/react-slot");
-var import_react32 = __toESM(require("react"));
-var import_react33 = __toESM(require("react"));
-var import_react_scroll_area = require("@radix-ui/react-scroll-area");
-var import_react34 = __toESM(require("react"));
-var import_react35 = require("@phosphor-icons/react");
-var SelectPrimitive = __toESM(require("@radix-ui/react-select"));
-var import_react36 = __toESM(require("react"));
-var import_react_separator = require("@radix-ui/react-separator");
-var import_react37 = __toESM(require("react"));
-var import_react_primitive12 = require("@radix-ui/react-primitive");
-var import_react_slot13 = require("@radix-ui/react-slot");
-var import_react38 = __toESM(require("react"));
-var import_react_primitive13 = require("@radix-ui/react-primitive");
-var import_react_slot14 = require("@radix-ui/react-slot");
-var import_react_toast = require("@radix-ui/react-toast");
-var import_react39 = __toESM(require("react"));
-var ToolbarPrimitive = __toESM(require("@radix-ui/react-toolbar"));
-var import_react40 = __toESM(require("react"));
-var import_react_tooltip = require("@radix-ui/react-tooltip");
-var import_react41 = __toESM(require("react"));
-var import_keyborg = require("keyborg");
-var import_react42 = __toESM(require("react"));
-var useDensityContext = (propsDensity) => {
-  const { density } = (0, import_react2.useContext)(DensityContext);
-  return propsDensity ?? density;
-};
-var useElevationContext = (propsElevation) => {
-  const { elevation } = (0, import_react3.useContext)(ElevationContext);
-  return propsElevation ?? elevation;
-};
-var initialLng = "en-US";
-var initialNs = "dxos-common";
-var initialDtLocale = import_locale.enUS;
-var isLabel = (o) => typeof o === "string" || Array.isArray(o) && o.length === 2 && typeof o[0] === "string" && !!o[1] && typeof o[1] === "object" && "ns" in o[1] && typeof o[1].ns === "string";
-var toLocalizedString = (label, t) => Array.isArray(label) ? t(...label) : label;
-var resources = {
-  [initialLng]: {
-    [initialNs]: {
-      "loading translations": "Loading translations\u2026"
-    }
-  }
-};
-void import_i18next.default.use(import_react_i18next2.initReactI18next).init({
-  resources,
-  lng: initialLng,
-  defaultNS: initialNs,
-  interpolation: {
-    escapeValue: false
-  }
-});
-var TranslationsContext = /* @__PURE__ */ (0, import_react5.createContext)({
-  appNs: initialNs,
-  dtLocale: initialDtLocale
-});
-var useTranslation = (...args) => {
-  const result = (0, import_react_i18next2.useTranslation)(...args);
-  const { dtLocale } = (0, import_react5.useContext)(TranslationsContext);
-  return {
-    ...result,
-    dtLocale
-  };
-};
-var TranslationsProvider = ({ fallback, resourceExtensions, children, appNs, dtLocale }) => {
-  const [loaded, setLoaded] = (0, import_react5.useState)(false);
-  (0, import_react5.useEffect)(() => {
-    setLoaded(false);
-    if (resourceExtensions && resourceExtensions.length) {
-      resourceExtensions.forEach((resource) => {
-        Object.keys(resource).forEach((language) => {
-          Object.keys(resource[language]).forEach((ns) => {
-            import_i18next.default.addResourceBundle(language, ns, resource[language][ns]);
-          });
-        });
-      });
-    }
-    setLoaded(true);
-  }, [
-    resourceExtensions
-  ]);
-  return /* @__PURE__ */ import_react5.default.createElement(TranslationsContext.Provider, {
-    value: {
-      appNs: appNs ?? initialNs,
-      dtLocale: dtLocale ?? initialDtLocale
-    }
-  }, /* @__PURE__ */ import_react5.default.createElement(import_react5.Suspense, {
-    fallback
-  }, loaded ? children : fallback));
-};
-var useTranslationsContext = () => (0, import_react4.useContext)(TranslationsContext);
-var useThemeContext = () => (0, import_react6.useContext)(ThemeContext);
-var useVisualViewport = (deps) => {
-  const [width, setWidth] = (0, import_react7.useState)(null);
-  const [height, setHeight] = (0, import_react7.useState)(null);
-  (0, import_react7.useEffect)(() => {
-    const handleResize = () => {
-      if (window.visualViewport) {
-        setWidth(window.visualViewport.width);
-        setHeight(window.visualViewport.height);
-      }
-    };
-    window.visualViewport?.addEventListener("resize", handleResize);
-    handleResize();
-    return () => window.visualViewport?.removeEventListener("resize", handleResize);
-  }, deps ?? []);
-  return {
-    width,
-    height
-  };
-};
-var AnchoredOverflowRoot = /* @__PURE__ */ (0, import_react.forwardRef)(({ asChild, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.div;
-  return /* @__PURE__ */ import_react.default.createElement(Root3, {
-    role: "none",
-    ...props,
-    className: tx("anchoredOverflow.root", "overflow-anchored", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var AnchoredOverflowAnchor = /* @__PURE__ */ (0, import_react.forwardRef)(({ asChild, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot.Slot : import_react_primitive.Primitive.div;
-  return /* @__PURE__ */ import_react.default.createElement(Root3, {
-    role: "none",
-    ...props,
-    className: tx("anchoredOverflow.anchor", "overflow-anchor", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var AnchoredOverflow = {
-  Root: AnchoredOverflowRoot,
-  Anchor: AnchoredOverflowAnchor
-};
-var Icon = /* @__PURE__ */ (0, import_react9.forwardRef)(({ icon, classNames, size, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react9.default.createElement("svg", {
-    ...props,
-    className: tx("icon.root", "icon", {
-      size
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react9.default.createElement("use", {
-    href: `/icons.svg#${icon}`
-  }));
-});
-var AVATAR_NAME = "Avatar";
-var [AvatarProvider, useAvatarContext] = (0, import_react_context.createContext)(AVATAR_NAME);
-var AvatarRoot = ({ size = 10, variant = "circle", status, animation, children, labelId: propsLabelId, descriptionId: propsDescriptionId, maskId: propsMaskId, inGroup, hue }) => {
-  const labelId = (0, import_react_hooks.useId)("avatar__label", propsLabelId);
-  const descriptionId = (0, import_react_hooks.useId)("avatar__description", propsDescriptionId);
-  const maskId = (0, import_react_hooks.useId)("avatar__mask", propsMaskId);
-  return /* @__PURE__ */ import_react8.default.createElement(AvatarProvider, {
-    labelId,
-    descriptionId,
-    maskId,
-    size,
-    variant,
-    status,
-    animation,
-    inGroup,
-    hue
-  }, children);
-};
-var rx = "0.25rem";
-var AvatarFrame = /* @__PURE__ */ (0, import_react8.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { size, variant, labelId, descriptionId, maskId, inGroup, status, animation, hue } = useAvatarContext("AvatarFrame");
-  const { tx } = useThemeContext();
-  const numericSize = size === "px" ? 1 : Number(size);
-  const sizePx = numericSize * 4;
-  const ringWidth = status ? numericSize > 4 ? 2 : numericSize > 3 ? 1 : 1 : 0;
-  const ringGap = status ? numericSize > 12 ? 3 : numericSize > 4 ? 2 : numericSize > 3 ? 1 : 0 : 0;
-  const r = sizePx / 2 - ringGap - ringWidth;
-  return /* @__PURE__ */ import_react8.default.createElement(import_react_avatar.Root, {
-    role: "img",
-    ...props,
-    className: tx("avatar.root", "avatar", {
-      size,
-      variant,
-      inGroup
-    }, classNames),
-    ref: forwardedRef,
-    ...!inGroup && {
-      "aria-labelledby": labelId,
-      "aria-describedby": descriptionId
-    }
-  }, /* @__PURE__ */ import_react8.default.createElement("svg", {
-    viewBox: `0 0 ${sizePx} ${sizePx}`,
-    width: sizePx,
-    height: sizePx,
-    className: tx("avatar.frame", "avatar__frame", {
-      variant
-    })
-  }, /* @__PURE__ */ import_react8.default.createElement("defs", null, /* @__PURE__ */ import_react8.default.createElement("mask", {
-    id: maskId
-  }, variant === "circle" ? /* @__PURE__ */ import_react8.default.createElement("circle", {
-    fill: "white",
-    cx: "50%",
-    cy: "50%",
-    r
-  }) : /* @__PURE__ */ import_react8.default.createElement("rect", {
-    fill: "white",
-    width: 2 * r,
-    height: 2 * r,
-    x: ringGap + ringWidth,
-    y: ringGap + ringWidth,
-    rx
-  }))), variant === "circle" ? /* @__PURE__ */ import_react8.default.createElement("circle", {
-    className: hue ? tx("hue.fill", "avatar__frame__circle", {
-      hue
-    }) : "fill-[var(--surface-bg)]",
-    cx: "50%",
-    cy: "50%",
-    r
-  }) : /* @__PURE__ */ import_react8.default.createElement("rect", {
-    className: hue ? tx("hue.fill", "avatar__frame__rect", {
-      hue
-    }) : "fill-[var(--surface-bg)]",
-    x: ringGap + ringWidth,
-    y: ringGap + ringWidth,
-    width: 2 * r,
-    height: 2 * r,
-    rx
-  }), children), /* @__PURE__ */ import_react8.default.createElement("span", {
-    role: "none",
-    className: tx("avatar.ring", "avatar__ring", {
-      size,
-      variant,
-      status,
-      animation
-    }),
-    style: {
-      borderWidth: ringWidth + "px"
-    }
-  }));
-});
-var AvatarLabel = /* @__PURE__ */ (0, import_react8.forwardRef)(({ asChild, srOnly, classNames, ...props }, forwardedRef) => {
-  const Root3 = asChild ? import_react_slot2.Slot : import_react_primitive2.Primitive.span;
-  const { tx } = useThemeContext();
-  const { labelId } = useAvatarContext("AvatarLabel");
-  return /* @__PURE__ */ import_react8.default.createElement(Root3, {
-    ...props,
-    id: labelId,
-    ref: forwardedRef,
-    className: tx("avatar.label", "avatar__label", {
-      srOnly
-    }, classNames)
-  });
-});
-var AvatarDescription = /* @__PURE__ */ (0, import_react8.forwardRef)(({ asChild, srOnly, classNames, ...props }, forwardedRef) => {
-  const Root3 = asChild ? import_react_slot2.Slot : import_react_primitive2.Primitive.span;
-  const { tx } = useThemeContext();
-  const { descriptionId } = useAvatarContext("AvatarDescription");
-  return /* @__PURE__ */ import_react8.default.createElement(Root3, {
-    ...props,
-    id: descriptionId,
-    ref: forwardedRef,
-    className: tx("avatar.description", "avatar__description", {
-      srOnly
-    }, classNames)
-  });
-});
-var AvatarMaskedImage = /* @__PURE__ */ (0, import_react8.forwardRef)((props, forwardedRef) => {
-  const { maskId } = useAvatarContext("AvatarFallback");
-  return /* @__PURE__ */ import_react8.default.createElement("image", {
-    width: "100%",
-    height: "100%",
-    ...props,
-    mask: `url(#${maskId})`,
-    ref: forwardedRef,
-    preserveAspectRatio: "xMidYMid slice"
-  });
-});
-var AvatarMaskedText = (props) => {
-  const { maskId, size } = useAvatarContext("AvatarFallback");
-  const { large } = props;
-  const fontScale = (large ? 4 : 3) * (1 / 1.612);
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react8.default.createElement("text", {
-    x: "50%",
-    y: "50%",
-    className: tx("avatar.fallbackText", "avatar__fallback-text"),
-    textAnchor: "middle",
-    alignmentBaseline: "central",
-    fontSize: size === "px" ? "200%" : size * fontScale,
-    mask: `url(#${maskId})`
-  }, props.children);
-};
-var AvatarImage = /* @__PURE__ */ (0, import_react8.forwardRef)(({ onLoadingStatusChange, ...props }, forwardedRef) => {
-  const { size } = useAvatarContext("AvatarImage");
-  const pxSize = size === "px" ? 1 : size * 4;
-  if (pxSize <= 20) {
-    return null;
-  }
-  return /* @__PURE__ */ import_react8.default.createElement(import_react_avatar.Fallback, {
-    asChild: true
-  }, /* @__PURE__ */ import_react8.default.createElement(AvatarMaskedImage, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var AvatarIcon = /* @__PURE__ */ (0, import_react8.forwardRef)(({ onLoadingStatusChange, ...props }, forwardedRef) => {
-  const { size } = useAvatarContext("AvatarIcon");
-  const pxSize = size === "px" ? 1 : size * 4;
-  if (pxSize <= 20) {
-    return null;
-  }
-  return /* @__PURE__ */ import_react8.default.createElement(import_react_avatar.Fallback, {
-    asChild: true
-  }, /* @__PURE__ */ import_react8.default.createElement(Icon, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var AvatarFallback = /* @__PURE__ */ (0, import_react8.forwardRef)(({ delayMs, text, ...props }, forwardedRef) => {
-  const isTextOnly = Boolean(text && /[0-9a-zA-Z]+/.test(text));
-  const { size } = useAvatarContext("AvatarFallback");
-  const numericSize = size === "px" ? 1 : Number(size);
-  return /* @__PURE__ */ import_react8.default.createElement(import_react_avatar.Fallback, {
-    delayMs,
-    asChild: true
-  }, /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, numericSize >= 6 && /* @__PURE__ */ import_react8.default.createElement(AvatarMaskedImage, {
-    ...props,
-    ref: forwardedRef
-  }), text && /* @__PURE__ */ import_react8.default.createElement(AvatarMaskedText, {
-    large: !isTextOnly
-  }, text.toLocaleUpperCase())));
-});
-var Avatar = {
-  Root: AvatarRoot,
-  Frame: AvatarFrame,
-  Image: AvatarImage,
-  Icon: AvatarIcon,
-  Fallback: AvatarFallback,
-  Label: AvatarLabel,
-  Description: AvatarDescription
-};
-var AvatarGroupRoot = /* @__PURE__ */ (0, import_react10.forwardRef)(({ labelId: propsLabelId, descriptionId: propsDescriptionId, size, variant, children, classNames }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const labelId = (0, import_react_hooks2.useId)("avatar-group__label", propsLabelId);
-  const descriptionId = (0, import_react_hooks2.useId)("avatar-group__description", propsDescriptionId);
-  return /* @__PURE__ */ import_react10.default.createElement(Avatar.Root, {
-    labelId,
-    descriptionId,
-    size,
-    variant,
-    inGroup: true
-  }, /* @__PURE__ */ import_react10.default.createElement("div", {
-    role: "group",
-    className: tx("avatar.group", "avatar-group", {}, classNames),
-    "aria-labelledby": labelId,
-    "aria-describedby": descriptionId,
-    ref: forwardedRef
-  }, children));
-});
-var AvatarGroupItemRoot = ({ maskId, size, variant, status, children, ...rest }) => {
-  const { labelId, descriptionId, size: contextSize, variant: contextVariant } = useAvatarContext("AvatarGroupItemRoot");
-  return /* @__PURE__ */ import_react10.default.createElement(Avatar.Root, {
-    labelId,
-    descriptionId,
-    maskId,
-    status,
-    size: size ?? contextSize,
-    variant: variant ?? contextVariant,
-    inGroup: true,
-    ...rest
-  }, children);
-};
-var AvatarGroupLabel = /* @__PURE__ */ (0, import_react10.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { labelId, size } = useAvatarContext("AvatarGroupLabel");
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react10.default.createElement("span", {
-    ...props,
-    id: labelId,
-    className: tx("avatar.groupLabel", "avatar-group__label", {
-      srOnly,
-      size
-    }, classNames)
-  }, children);
-});
-var AvatarGroupDescription = /* @__PURE__ */ (0, import_react10.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { descriptionId } = useAvatarContext("AvatarGroupDescription");
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react10.default.createElement("span", {
-    ...props,
-    id: descriptionId,
-    className: tx("avatar.groupDescription", "avatar-group__description", {
-      srOnly
-    }, classNames)
-  }, children);
-});
-var AvatarGroup = {
-  Root: AvatarGroupRoot,
-  Label: AvatarGroupLabel,
-  Description: AvatarGroupDescription
-};
-var AvatarGroupItem = {
-  Root: AvatarGroupItemRoot
-};
-var Link = /* @__PURE__ */ (0, import_react13.forwardRef)(({ asChild, variant, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot4.Slot : import_react_primitive4.Primitive.a;
-  return /* @__PURE__ */ import_react13.default.createElement(Root3, {
-    ...props,
-    className: tx("link.root", "link", {
-      variant
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var BreadcrumbRoot = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.div;
-  return /* @__PURE__ */ import_react12.default.createElement(Root3, {
-    role: "navigation",
-    ...props,
-    className: tx("breadcrumb.root", "breadcrumb", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var BreadcrumbList = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.ol;
-  return /* @__PURE__ */ import_react12.default.createElement(Root3, {
-    role: "list",
-    ...props,
-    className: tx("breadcrumb.list", "breadcrumb__list", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var BreadcrumbListItem = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot3.Slot : import_react_primitive3.Primitive.li;
-  return /* @__PURE__ */ import_react12.default.createElement(Root3, {
-    role: "listitem",
-    ...props,
-    className: tx("breadcrumb.listItem", "breadcrumb__list__item", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var BreadcrumbLink = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, ...props }, forwardedRef) => {
-  const Root3 = asChild ? import_react_slot3.Slot : Link;
-  return /* @__PURE__ */ import_react12.default.createElement(Root3, {
-    ...props,
-    ref: forwardedRef
-  });
-});
-var BreadcrumbCurrent = /* @__PURE__ */ (0, import_react12.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot3.Slot : "h1";
-  return /* @__PURE__ */ import_react12.default.createElement(Root3, {
-    ...props,
-    "aria-current": "page",
-    className: tx("breadcrumb.current", "breadcrumb__item__heading--current", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var BreadcrumbSeparator = ({ children, classNames, ...props }) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react12.default.createElement(import_react_primitive3.Primitive.span, {
-    role: "separator",
-    "aria-hidden": "true",
-    ...props,
-    className: tx("breadcrumb.separator", "breadcrumb__separator", {}, classNames)
-  }, children ?? /* @__PURE__ */ import_react12.default.createElement(import_react11.Dot, {
-    weight: "bold"
-  }));
-};
-var Breadcrumb = {
-  Root: BreadcrumbRoot,
-  List: BreadcrumbList,
-  ListItem: BreadcrumbListItem,
-  Link: BreadcrumbLink,
-  Current: BreadcrumbCurrent,
-  Separator: BreadcrumbSeparator
-};
-var BUTTON_GROUP_NAME = "ButtonGroup";
-var BUTTON_NAME = "Button";
-var [ButtonGroupProvider, useButtonGroupContext] = (0, import_react_context2.createContext)(BUTTON_GROUP_NAME, {
-  inGroup: false
-});
-var Button = /* @__PURE__ */ (0, import_react14.forwardRef)(({ classNames, children, density: propsDensity, elevation: propsElevation, variant = "default", asChild, ...props }, ref) => {
-  const { inGroup } = useButtonGroupContext(BUTTON_NAME);
-  const { tx } = useThemeContext();
-  const elevation = useElevationContext(propsElevation);
-  const density = useDensityContext(propsDensity);
-  const Root3 = asChild ? import_react_slot5.Slot : import_react_primitive5.Primitive.button;
-  return /* @__PURE__ */ import_react14.default.createElement(Root3, {
-    ref,
-    ...props,
-    "data-variant": variant,
-    "data-density": density,
-    "data-props": inGroup ? "grouped" : "",
-    className: tx("button.root", "button", {
-      variant,
-      inGroup,
-      disabled: props.disabled,
-      density,
-      elevation
-    }, classNames),
-    ...props.disabled && {
-      disabled: true
-    }
-  }, children);
-});
-Button.displayName = BUTTON_NAME;
-var ButtonGroup = /* @__PURE__ */ (0, import_react14.forwardRef)(({ children, elevation: propsElevation, classNames, asChild, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const elevation = useElevationContext(propsElevation);
-  const Root3 = asChild ? import_react_slot5.Slot : import_react_primitive5.Primitive.div;
-  return /* @__PURE__ */ import_react14.default.createElement(Root3, {
-    role: "none",
-    ...props,
-    className: tx("button.group", "button-group", {
-      elevation
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react14.default.createElement(ButtonGroupProvider, {
-    inGroup: true
-  }, children));
-});
-ButtonGroup.displayName = BUTTON_GROUP_NAME;
-var Toggle = /* @__PURE__ */ (0, import_react15.forwardRef)(({ defaultPressed, pressed, onPressedChange, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ import_react15.default.createElement(import_react_toggle.Toggle, {
-    defaultPressed,
-    pressed,
-    onPressedChange,
-    asChild: true
-  }, /* @__PURE__ */ import_react15.default.createElement(Button, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var ToggleGroup = /* @__PURE__ */ (0, import_react16.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ import_react16.default.createElement(import_react_toggle_group.ToggleGroup, {
-    ...props,
-    asChild: true
-  }, /* @__PURE__ */ import_react16.default.createElement(ButtonGroup, {
-    classNames,
-    children,
-    ref: forwardedRef
-  }));
-});
-var ToggleGroupItem = /* @__PURE__ */ (0, import_react16.forwardRef)(({ variant, elevation, density, classNames, children, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ import_react16.default.createElement(import_react_toggle_group.ToggleGroupItem, {
-    ...props,
-    asChild: true
-  }, /* @__PURE__ */ import_react16.default.createElement(Button, {
-    variant,
-    elevation,
-    density,
-    classNames,
-    children,
-    ref: forwardedRef
-  }));
-});
-var ElevationContext = /* @__PURE__ */ (0, import_react18.createContext)({
-  elevation: "base"
-});
-var ElevationProvider = ({ elevation, children }) => /* @__PURE__ */ import_react18.default.createElement(ElevationContext.Provider, {
-  value: {
-    elevation
-  }
-}, children);
-var DialogRoot = import_react_dialog.Root;
-var DialogTrigger = import_react_dialog.DialogTrigger;
-var DialogPortal = import_react_dialog.DialogPortal;
-var DialogTitle = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react17.default.createElement(import_react_dialog.DialogTitle, {
-    ...props,
-    className: tx("dialog.title", "dialog__title", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var DialogDescription = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react17.default.createElement(import_react_dialog.DialogDescription, {
-    ...props,
-    className: tx("dialog.description", "dialog__description", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var DialogClose = import_react_dialog.DialogClose;
-var DIALOG_OVERLAY_NAME = "DialogOverlay";
-var DIALOG_CONTENT_NAME = "DialogContent";
-var [OverlayLayoutProvider, useOverlayLayoutContext] = (0, import_react_context3.createContext)(DIALOG_OVERLAY_NAME, {
-  inOverlayLayout: false
-});
-var DialogOverlay = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, children, blockAlign, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react17.default.createElement(import_react_dialog.DialogOverlay, {
-    ...props,
-    className: tx("dialog.overlay", "dialog__overlay", {}, classNames, "data-[block-align=start]:justify-center", "data-[block-align=start]:items-start", "data-[block-align=center]:place-content-center"),
-    ref: forwardedRef,
-    "data-block-align": blockAlign
-  }, /* @__PURE__ */ import_react17.default.createElement(OverlayLayoutProvider, {
-    inOverlayLayout: true
-  }, children));
-});
-DialogOverlay.displayName = DIALOG_OVERLAY_NAME;
-var DialogContent = /* @__PURE__ */ (0, import_react17.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { inOverlayLayout } = useOverlayLayoutContext(DIALOG_CONTENT_NAME);
-  return /* @__PURE__ */ import_react17.default.createElement(import_react_dialog.DialogContent, {
-    ...props,
-    className: tx("dialog.content", "dialog", {
-      inOverlayLayout
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react17.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, children));
-});
-DialogContent.displayName = DIALOG_CONTENT_NAME;
-var Dialog = {
-  Root: DialogRoot,
-  Trigger: DialogTrigger,
-  Portal: DialogPortal,
-  Overlay: DialogOverlay,
-  Content: DialogContent,
-  Title: DialogTitle,
-  Description: DialogDescription,
-  Close: DialogClose
-};
-var AlertDialogRoot = import_react_alert_dialog.Root;
-var AlertDialogTrigger = import_react_alert_dialog.AlertDialogTrigger;
-var AlertDialogPortal = import_react_alert_dialog.AlertDialogPortal;
-var AlertDialogCancel = import_react_alert_dialog.AlertDialogCancel;
-var AlertDialogAction = import_react_alert_dialog.AlertDialogAction;
-var AlertDialogTitle = /* @__PURE__ */ (0, import_react19.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_alert_dialog.AlertDialogTitle, {
-    ...props,
-    className: tx("dialog.title", "dialog--alert__title", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var AlertDialogDescription = /* @__PURE__ */ (0, import_react19.forwardRef)(({ classNames, srOnly, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_alert_dialog.AlertDialogDescription, {
-    ...props,
-    className: tx("dialog.description", "dialog--alert__description", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var ALERT_DIALOG_OVERLAY_NAME = "AlertDialogOverlay";
-var ALERT_DIALOG_CONTENT_NAME = "AlertDialogContent";
-var [OverlayLayoutProvider2, useOverlayLayoutContext2] = (0, import_react_context4.createContext)(ALERT_DIALOG_OVERLAY_NAME, {
-  inOverlayLayout: false
-});
-var AlertDialogOverlay = /* @__PURE__ */ (0, import_react19.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_alert_dialog.AlertDialogOverlay, {
-    ...props,
-    className: tx("dialog.overlay", "dialog--alert__overlay", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react19.default.createElement(OverlayLayoutProvider2, {
-    inOverlayLayout: true
-  }, children));
-});
-AlertDialogOverlay.displayName = ALERT_DIALOG_OVERLAY_NAME;
-var AlertDialogContent = /* @__PURE__ */ (0, import_react19.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { inOverlayLayout } = useOverlayLayoutContext2(ALERT_DIALOG_CONTENT_NAME);
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_alert_dialog.AlertDialogContent, {
-    ...props,
-    className: tx("dialog.content", "dialog--alert", {
-      inOverlayLayout
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react19.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, children));
-});
-AlertDialogContent.displayName = ALERT_DIALOG_CONTENT_NAME;
-var AlertDialog = {
-  Root: AlertDialogRoot,
-  Trigger: AlertDialogTrigger,
-  Portal: AlertDialogPortal,
-  Overlay: AlertDialogOverlay,
-  Content: AlertDialogContent,
-  Title: AlertDialogTitle,
-  Description: AlertDialogDescription,
-  Cancel: AlertDialogCancel,
-  Action: AlertDialogAction
-};
-var ContextMenuRoot = ContextMenuPrimitive.ContextMenu;
-var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
-var ContextMenuPortal = ContextMenuPrimitive.Portal;
-var ContextMenuContent = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.Content, {
-    collisionPadding: 8,
-    ...props,
-    className: tx("menu.content", "menu", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react20.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, children));
-});
-var ContextMenuViewport = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, asChild, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot6.Slot : import_react_primitive6.Primitive.div;
-  return /* @__PURE__ */ import_react20.default.createElement(Root3, {
-    ...props,
-    className: tx("menu.viewport", "menu__viewport", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var ContextMenuArrow = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.Arrow, {
-    ...props,
-    className: tx("menu.arrow", "menu__arrow", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ContextMenuGroup = ContextMenuPrimitive.Group;
-var ContextMenuItemIndicator = ContextMenuPrimitive.ItemIndicator;
-var ContextMenuItem = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.Item, {
-    ...props,
-    className: tx("menu.item", "menu__item", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ContextMenuCheckboxItem = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.CheckboxItem, {
-    ...props,
-    className: tx("menu.item", "menu__item--checkbox", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ContextMenuSeparator = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.Separator, {
-    ...props,
-    className: tx("menu.separator", "menu__item", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ContextMenuGroupLabel = /* @__PURE__ */ (0, import_react20.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react20.default.createElement(ContextMenuPrimitive.Label, {
-    ...props,
-    className: tx("menu.groupLabel", "menu__group__label", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ContextMenu2 = {
-  Root: ContextMenuRoot,
-  Trigger: ContextMenuTrigger,
-  Portal: ContextMenuPortal,
-  Content: ContextMenuContent,
-  Viewport: ContextMenuViewport,
-  Arrow: ContextMenuArrow,
-  Group: ContextMenuGroup,
-  Item: ContextMenuItem,
-  CheckboxItem: ContextMenuCheckboxItem,
-  ItemIndicator: ContextMenuItemIndicator,
-  Separator: ContextMenuSeparator,
-  GroupLabel: ContextMenuGroupLabel
-};
-var DropdownMenuRoot = DropdownMenuPrimitive.DropdownMenu;
-var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
-var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
-var useDropdownMenuContext2 = DropdownMenuPrimitive.useDropdownMenuContext;
-var useDropdownMenuMenuScope2 = DropdownMenuPrimitive.useDropdownMenuMenuScope;
-var DropdownMenuContent = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.Content, {
-    sideOffset: 4,
-    collisionPadding: 8,
-    ...props,
-    className: tx("menu.content", "menu", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react21.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, children));
-});
-var DropdownMenuViewport = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, asChild, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot7.Slot : import_react_primitive7.Primitive.div;
-  return /* @__PURE__ */ import_react21.default.createElement(Root3, {
-    ...props,
-    className: tx("menu.viewport", "menu__viewport", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var DropdownMenuArrow = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.Arrow, {
-    ...props,
-    className: tx("menu.arrow", "menu__arrow", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var DropdownMenuGroup = DropdownMenuPrimitive.Group;
-var DropdownMenuItemIndicator = DropdownMenuPrimitive.ItemIndicator;
-var DropdownMenuItem = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.Item, {
-    ...props,
-    className: tx("menu.item", "menu__item", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var DropdownMenuCheckboxItem = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.CheckboxItem, {
-    ...props,
-    className: tx("menu.item", "menu__item--checkbox", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var DropdownMenuSeparator = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.Separator, {
-    ...props,
-    className: tx("menu.separator", "menu__item", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var DropdownMenuGroupLabel = /* @__PURE__ */ (0, import_react21.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react21.default.createElement(DropdownMenuPrimitive.Label, {
-    ...props,
-    className: tx("menu.groupLabel", "menu__group__label", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var DropdownMenu2 = {
-  Root: DropdownMenuRoot,
-  Trigger: DropdownMenuTrigger,
-  Portal: DropdownMenuPortal,
-  Content: DropdownMenuContent,
-  Viewport: DropdownMenuViewport,
-  Arrow: DropdownMenuArrow,
-  Group: DropdownMenuGroup,
-  Item: DropdownMenuItem,
-  CheckboxItem: DropdownMenuCheckboxItem,
-  ItemIndicator: DropdownMenuItemIndicator,
-  Separator: DropdownMenuSeparator,
-  GroupLabel: DropdownMenuGroupLabel
-};
-var Label3 = /* @__PURE__ */ (0, import_react23.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.Label, {
-    ...props,
-    className: tx("input.label", "input__label", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var Description = /* @__PURE__ */ (0, import_react23.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.Description, {
-    ...props,
-    className: tx("input.description", "input__description", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var Validation = /* @__PURE__ */ (0, import_react23.forwardRef)(({ __inputScope, srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.Validation, {
-    ...props,
-    className: tx("input.validation", `input__validation-message input__validation-message--${validationValence}`, {
-      srOnly,
-      validationValence
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var DescriptionAndValidation = /* @__PURE__ */ (0, import_react23.forwardRef)(({ srOnly, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.DescriptionAndValidation, {
-    ...props,
-    className: tx("input.descriptionAndValidation", "input__description-and-validation", {
-      srOnly
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var PinInput = /* @__PURE__ */ (0, import_react23.forwardRef)(({ density: propsDensity, elevation: propsElevation, segmentClassName: propsSegmentClassName, inputClassName, variant, ...props }, forwardedRef) => {
-  const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
-  const { tx } = useThemeContext();
-  const density = useDensityContext(propsDensity);
-  const elevation = useElevationContext(propsElevation);
-  const segmentClassName = (0, import_react23.useCallback)(({ focused, validationValence }) => tx("input.input", "input--pin-segment", {
-    variant: "static",
-    focused,
-    disabled: props.disabled,
-    density,
-    elevation,
-    validationValence
-  }, propsSegmentClassName), [
-    tx,
-    props.disabled,
-    elevation,
-    propsElevation,
-    density
-  ]);
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.PinInput, {
-    ...props,
-    segmentClassName,
-    ...props.autoFocus && !hasIosKeyboard2 && {
-      autoFocus: true
-    },
-    inputClassName: tx("input.inputWithSegments", "input input--pin", {
-      disabled: props.disabled
-    }, inputClassName),
-    ref: forwardedRef
-  });
-});
-var TextInput = /* @__PURE__ */ (0, import_react23.forwardRef)(({ __inputScope, classNames, density: propsDensity, elevation: propsElevation, variant, ...props }, forwardedRef) => {
-  const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
-  const themeContextValue = useThemeContext();
-  const density = useDensityContext(propsDensity);
-  const elevation = useElevationContext(propsElevation);
-  const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
-  const { tx } = themeContextValue;
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.TextInput, {
-    ...props,
-    className: tx("input.input", "input", {
-      variant,
-      disabled: props.disabled,
-      density,
-      elevation,
-      validationValence
-    }, classNames),
-    ...props.autoFocus && !hasIosKeyboard2 && {
-      autoFocus: true
-    },
-    ref: forwardedRef
-  });
-});
-var TextArea = /* @__PURE__ */ (0, import_react23.forwardRef)(({ __inputScope, classNames, density: propsDensity, elevation: propsElevation, variant, ...props }, forwardedRef) => {
-  const { hasIosKeyboard: hasIosKeyboard2 } = useThemeContext();
-  const { tx } = useThemeContext();
-  const density = useDensityContext(propsDensity);
-  const elevation = useElevationContext(propsElevation);
-  const { validationValence } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_input.TextArea, {
-    ...props,
-    className: tx("input.input", "input--text-area", {
-      variant,
-      disabled: props.disabled,
-      density,
-      elevation,
-      validationValence
-    }, classNames),
-    ...props.autoFocus && !hasIosKeyboard2 && {
-      autoFocus: true
-    },
-    ref: forwardedRef
-  });
-});
-var Checkbox = /* @__PURE__ */ (0, import_react23.forwardRef)(({ __inputScope, checked: propsChecked, defaultChecked: propsDefaultChecked, onCheckedChange: propsOnCheckedChange, size, weight = "bold", classNames, ...props }, forwardedRef) => {
-  const [checked, onCheckedChange] = (0, import_react_use_controllable_state.useControllableState)({
-    prop: propsChecked,
-    defaultProp: propsDefaultChecked,
-    onChange: propsOnCheckedChange
-  });
-  const { id, validationValence, descriptionId, errorMessageId } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
-  const { tx } = useThemeContext();
-  const Icon3 = checked === "indeterminate" ? import_react22.Minus : checked ? import_react22.Check : import_react23.Fragment;
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_checkbox.Root, {
-    ...props,
-    checked,
-    onCheckedChange,
-    id,
-    "aria-describedby": descriptionId,
-    ...validationValence === "error" && {
-      "aria-invalid": "true",
-      "aria-errormessage": errorMessageId
-    },
-    className: tx("input.checkbox", "input--checkbox", {
-      size
-    }, "shrink-0", classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react23.default.createElement(import_react_checkbox.Indicator, {
-    asChild: true
-  }, /* @__PURE__ */ import_react23.default.createElement(Icon3, checked && {
-    weight,
-    className: tx("input.checkboxIndicator", "input--checkbox__indicator", {
-      size
-    })
-  })));
-});
-var Switch = /* @__PURE__ */ (0, import_react23.forwardRef)(({ __inputScope, checked: propsChecked, defaultChecked: propsDefaultChecked, onCheckedChange: propsOnCheckedChange, size = 5, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const [checked, onCheckedChange] = (0, import_react_use_controllable_state.useControllableState)({
-    prop: propsChecked,
-    defaultProp: propsDefaultChecked,
-    onChange: propsOnCheckedChange
-  });
-  const { id, validationValence, descriptionId, errorMessageId } = (0, import_react_input.useInputContext)(import_react_input.INPUT_NAME, __inputScope);
-  return /* @__PURE__ */ import_react23.default.createElement(import_react_switch.Root, {
-    ...props,
-    checked,
-    onCheckedChange,
-    id,
-    "aria-describedby": descriptionId,
-    ...validationValence === "error" && {
-      "aria-invalid": "true",
-      "aria-errormessage": errorMessageId
-    },
-    className: tx("input.switch", "input--switch", {
-      size
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react23.default.createElement(import_react_switch.Thumb, {
-    className: tx("input.switchThumb", "input--switch__thumb", {
-      size
-    })
-  }));
-});
-var Input = {
-  Root: import_react_input.InputRoot,
-  PinInput,
-  TextInput,
-  TextArea,
-  Checkbox,
-  Switch,
-  Label: Label3,
-  Description,
-  Validation,
-  DescriptionAndValidation
-};
-var DensityContext = /* @__PURE__ */ (0, import_react26.createContext)({
-  density: "coarse"
-});
-var DensityProvider = ({ density, children }) => /* @__PURE__ */ import_react26.default.createElement(DensityContext.Provider, {
-  value: {
-    density
-  }
-}, children);
-var List = /* @__PURE__ */ (0, import_react25.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const density = useDensityContext(props.density);
-  return /* @__PURE__ */ import_react25.default.createElement(DensityProvider, {
-    density
-  }, /* @__PURE__ */ import_react25.default.createElement(import_react_list.List, {
-    ...props,
-    className: tx("list.root", "list", {}, classNames),
-    ref: forwardedRef
-  }, children));
-});
-var ListItemEndcap = /* @__PURE__ */ (0, import_react25.forwardRef)(({ children, classNames, asChild, ...props }, forwardedRef) => {
-  const Root3 = asChild ? import_react_slot8.Slot : "div";
-  const density = useDensityContext();
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react25.default.createElement(Root3, {
-    ...!asChild && {
-      role: "none"
-    },
-    ...props,
-    className: tx("list.item.endcap", "list__listItem__endcap", {
-      density
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var MockListItemOpenTrigger = ({ classNames, ...props }) => {
-  const density = useDensityContext();
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react25.default.createElement("div", {
-    role: "none",
-    ...props,
-    className: tx("list.item.openTrigger", "list__listItem__openTrigger--mock", {
-      density
-    }, classNames)
-  });
-};
-var ListItemHeading = /* @__PURE__ */ (0, import_react25.forwardRef)(({ children, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const density = useDensityContext();
-  return /* @__PURE__ */ import_react25.default.createElement(import_react_list.ListItemHeading, {
-    ...props,
-    className: tx("list.item.heading", "list__listItem__heading", {
-      density
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var ListItemOpenTrigger = /* @__PURE__ */ (0, import_react25.forwardRef)(({ __listItemScope, classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const density = useDensityContext();
-  const { open } = (0, import_react_list.useListItemContext)(import_react_list.LIST_ITEM_NAME, __listItemScope);
-  const Icon3 = open ? import_react24.CaretDown : import_react24.CaretRight;
-  return /* @__PURE__ */ import_react25.default.createElement(import_react_list.ListItemOpenTrigger, {
-    ...props,
-    className: tx("list.item.openTrigger", "list__listItem__openTrigger", {
-      density
-    }, classNames),
-    ref: forwardedRef
-  }, children || /* @__PURE__ */ import_react25.default.createElement(Icon3, {
-    weight: "bold",
-    className: tx("list.item.openTriggerIcon", "list__listItem__openTrigger__icon", {})
-  }));
-});
-var ListItemRoot = /* @__PURE__ */ (0, import_react25.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const density = useDensityContext();
-  return /* @__PURE__ */ import_react25.default.createElement(import_react_list.ListItem, {
-    ...props,
-    className: tx("list.item.root", "list__listItem", {
-      density,
-      collapsible: props.collapsible
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var ListItem = {
-  Root: ListItemRoot,
-  Endcap: ListItemEndcap,
-  Heading: ListItemHeading,
-  OpenTrigger: ListItemOpenTrigger,
-  CollapsibleContent: import_react_list.ListItemCollapsibleContent,
-  MockOpenTrigger: MockListItemOpenTrigger
-};
-var TreeRoot = /* @__PURE__ */ (0, import_react27.forwardRef)((props, forwardedRef) => {
-  return /* @__PURE__ */ import_react27.default.createElement(List, {
-    ...props,
-    ref: forwardedRef
-  });
-});
-var TreeBranch = /* @__PURE__ */ (0, import_react27.forwardRef)(({ __listScope, ...props }, forwardedRef) => {
-  const { headingId } = (0, import_react_list.useListItemContext)(import_react_list.LIST_ITEM_NAME, __listScope);
-  return /* @__PURE__ */ import_react27.default.createElement(List, {
-    ...props,
-    "aria-labelledby": headingId,
-    ref: forwardedRef
-  });
-});
-var TreeItemRoot = /* @__PURE__ */ (0, import_react27.forwardRef)((props, forwardedRef) => {
-  return /* @__PURE__ */ import_react27.default.createElement(ListItem.Root, {
-    role: "treeitem",
-    ...props,
-    ref: forwardedRef
-  });
-});
-var TreeItemHeading = ListItem.Heading;
-var TreeItemOpenTrigger = ListItem.OpenTrigger;
-var MockTreeItemOpenTrigger = ListItem.MockOpenTrigger;
-var TreeItemBody = ListItem.CollapsibleContent;
-var Tree = {
-  Root: TreeRoot,
-  Branch: TreeBranch
-};
-var TreeItem = {
-  Root: TreeItemRoot,
-  Heading: TreeItemHeading,
-  Body: TreeItemBody,
-  OpenTrigger: TreeItemOpenTrigger,
-  MockOpenTrigger: MockTreeItemOpenTrigger
-};
-var TREEGRID_ROW_NAME = "TreegridRow";
-var [createTreegridRowContext, createTreegridRowScope] = (0, import_react_context5.createContextScope)(TREEGRID_ROW_NAME, []);
-var [TreegridRowProvider, useTreegridRowContext] = createTreegridRowContext(TREEGRID_ROW_NAME);
-var PATH_SEPARATOR = "~";
-var PARENT_OF_SEPARATOR = " ";
-var TreegridRoot = /* @__PURE__ */ (0, import_react28.forwardRef)(({ asChild, classNames, children, style, gridTemplateColumns, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot9.Slot : import_react_primitive8.Primitive.div;
-  const arrowNavigationAttrs = (0, import_react_tabster.useArrowNavigationGroup)({
-    axis: "vertical",
-    tabbable: false,
-    circular: true
-  });
-  return /* @__PURE__ */ import_react28.default.createElement(Root3, {
-    role: "treegrid",
-    ...arrowNavigationAttrs,
-    ...props,
-    className: tx("treegrid.root", "treegrid", {}, classNames),
-    style: {
-      ...style,
-      gridTemplateColumns
-    },
-    ref: forwardedRef
-  }, children);
-});
-var TreegridRow = /* @__PURE__ */ (0, import_react28.forwardRef)(({ __treegridRowScope, asChild, classNames, children, id, parentOf, open: propsOpen, defaultOpen, onOpenChange: propsOnOpenChange, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot9.Slot : import_react_primitive8.Primitive.div;
-  const pathParts = id.split(PATH_SEPARATOR);
-  const level = pathParts.length - 1;
-  const [open, onOpenChange] = (0, import_react_use_controllable_state2.useControllableState)({
-    prop: propsOpen,
-    onChange: propsOnOpenChange,
-    defaultProp: defaultOpen
-  });
-  const focusableGroupAttrs = (0, import_react_tabster.useFocusableGroup)({
-    tabBehavior: "limited"
-  });
-  const arrowGroupAttrs = (0, import_react_tabster.useArrowNavigationGroup)({
-    axis: "horizontal",
-    tabbable: false,
-    circular: false,
-    memorizeCurrent: false
-  });
-  return /* @__PURE__ */ import_react28.default.createElement(TreegridRowProvider, {
-    open,
-    onOpenChange,
-    scope: __treegridRowScope
-  }, /* @__PURE__ */ import_react28.default.createElement(Root3, {
-    role: "row",
-    "aria-level": level,
-    className: tx("treegrid.row", "treegrid__row", {
-      level
-    }, classNames),
-    ...parentOf && {
-      "aria-expanded": open,
-      "aria-owns": parentOf
-    },
-    tabIndex: 0,
-    ...focusableGroupAttrs,
-    ...props,
-    id,
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react28.default.createElement("div", {
-    role: "none",
-    className: "contents",
-    ...arrowGroupAttrs
-  }, children)));
-});
-var TreegridCell = /* @__PURE__ */ (0, import_react28.forwardRef)(({ classNames, children, indent, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react28.default.createElement("div", {
-    role: "gridcell",
-    className: tx("treegrid.cell", "treegrid__cell", {
-      indent
-    }, classNames),
-    ...props,
-    ref: forwardedRef
-  }, children);
-});
-var Treegrid = {
-  Root: TreegridRoot,
-  Row: TreegridRow,
-  Cell: TreegridCell,
-  PARENT_OF_SEPARATOR,
-  PATH_SEPARATOR,
-  createTreegridRowScope,
-  useTreegridRowContext
-};
-var MotionState;
-(function(MotionState2) {
-  MotionState2[MotionState2["IDLE"] = 0] = "IDLE";
-  MotionState2[MotionState2["DEBOUNCING"] = 1] = "DEBOUNCING";
-  MotionState2[MotionState2["FOLLOWING"] = 2] = "FOLLOWING";
-})(MotionState || (MotionState = {}));
-var useSwipeToDismiss = (ref, {
-  onDismiss,
-  dismissThreshold = 64,
-  debounceThreshold = 8,
-  offset = 0
-  /* side = 'inline-start' */
-}) => {
-  const $root = ref.current;
-  const [motionState, setMotionState] = (0, import_react30.useState)(0);
-  const [gestureStartX, setGestureStartX] = (0, import_react30.useState)(0);
-  const setIdle = (0, import_react30.useCallback)(() => {
-    setMotionState(0);
-    $root?.style.removeProperty("inset-inline-start");
-    $root?.style.setProperty("transition-duration", "200ms");
-  }, [
-    $root
-  ]);
-  const setFollowing = (0, import_react30.useCallback)(() => {
-    setMotionState(2);
-    $root?.style.setProperty("transition-duration", "0ms");
-  }, [
-    $root
-  ]);
-  const handlePointerDown = (0, import_react30.useCallback)(({ screenX }) => {
-    if (motionState === 0) {
-      setMotionState(1);
-      setGestureStartX(screenX);
-    }
-  }, [
-    motionState
-  ]);
-  const handlePointerMove = (0, import_react30.useCallback)(({ screenX }) => {
-    if ($root) {
-      const delta = Math.min(screenX - gestureStartX, 0);
-      switch (motionState) {
-        case 2:
-          if (Math.abs(delta) > dismissThreshold) {
-            setIdle();
-            onDismiss?.();
-          } else {
-            $root.style.setProperty("inset-inline-start", `${offset + delta}px`);
-          }
-          break;
-        case 1:
-          if (Math.abs(delta) > debounceThreshold) {
-            setFollowing();
-          }
-          break;
-      }
-    }
-  }, [
-    $root,
-    motionState,
-    gestureStartX
-  ]);
-  const handlePointerUp = (0, import_react30.useCallback)(() => {
-    setIdle();
-  }, [
-    setIdle
-  ]);
-  (0, import_react30.useEffect)(() => {
-    $root?.addEventListener("pointerdown", handlePointerDown);
-    return () => {
-      $root?.removeEventListener("pointerdown", handlePointerDown);
-    };
-  }, [
-    $root,
-    handlePointerDown
-  ]);
-  (0, import_react30.useEffect)(() => {
-    $root && document.documentElement.addEventListener("pointermove", handlePointerMove);
-    return () => {
-      document.documentElement.removeEventListener("pointermove", handlePointerMove);
-    };
-  }, [
-    $root,
-    handlePointerMove
-  ]);
-  (0, import_react30.useEffect)(() => {
-    $root && document.documentElement.addEventListener("pointerup", handlePointerUp);
-    return () => {
-      document.documentElement.removeEventListener("pointerup", handlePointerUp);
-    };
-  }, [
-    $root,
-    handlePointerUp
-  ]);
-};
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui/src/components/Main/Main.tsx";
-var MAIN_ROOT_NAME = "MainRoot";
-var NAVIGATION_SIDEBAR_NAME = "NavigationSidebar";
-var COMPLEMENTARY_SIDEBAR_NAME = "ComplementarySidebar";
-var MAIN_NAME = "Main";
-var GENERIC_CONSUMER_NAME = "GenericConsumer";
-var landmarkAttr = "data-main-landmark";
-var useLandmarkMover = (propsOnKeyDown, landmark) => {
-  const handleKeyDown = (0, import_react29.useCallback)((event) => {
-    const target = event.target;
-    if (event.target === event.currentTarget && event.key === "Tab" && target.hasAttribute(landmarkAttr)) {
-      event.preventDefault();
-      const landmarks = Array.from(document.querySelectorAll(`[${landmarkAttr}]:not([inert])`)).map((el) => el.hasAttribute(landmarkAttr) ? parseInt(el.getAttribute(landmarkAttr)) : NaN).sort();
-      const l = landmarks.length;
-      const cursor = landmarks.indexOf(parseInt(target.getAttribute(landmarkAttr)));
-      const nextLandmark = landmarks[(cursor + l + (event.getModifierState("Shift") ? -1 : 1)) % l];
-      document.querySelector(`[${landmarkAttr}="${nextLandmark}"]`)?.focus();
-    }
-    propsOnKeyDown?.(event);
-  }, [
-    propsOnKeyDown
-  ]);
-  const focusableAttrs = (0, import_react_tabster2.useFocusableGroup)({
-    tabBehavior: "limited",
-    ignoreDefaultKeydown: {
-      Tab: true
-    }
-  });
-  return {
-    onKeyDown: handleKeyDown,
-    [landmarkAttr]: landmark,
-    tabIndex: 0,
-    ...focusableAttrs
-  };
-};
-var [MainProvider, useMainContext] = (0, import_react_context6.createContext)(MAIN_NAME, {
-  resizing: false,
-  navigationSidebarOpen: false,
-  setNavigationSidebarOpen: (nextOpen) => {
-    import_log.log.warn("Attempt to set sidebar state without initializing `MainRoot`", void 0, {
-      F: __dxlog_file,
-      L: 81,
-      S: void 0,
-      C: (f, a) => f(...a)
-    });
-  },
-  complementarySidebarOpen: false,
-  setComplementarySidebarOpen: (nextOpen) => {
-    import_log.log.warn("Attempt to set sidebar state without initializing `MainRoot`", void 0, {
-      F: __dxlog_file,
-      L: 86,
-      S: void 0,
-      C: (f, a) => f(...a)
-    });
-  }
-});
-var useSidebars = (consumerName = GENERIC_CONSUMER_NAME) => {
-  const { setNavigationSidebarOpen, navigationSidebarOpen, setComplementarySidebarOpen, complementarySidebarOpen } = useMainContext(consumerName);
-  return {
-    navigationSidebarOpen,
-    setNavigationSidebarOpen,
-    toggleNavigationSidebar: (0, import_react29.useCallback)(() => setNavigationSidebarOpen(!navigationSidebarOpen), [
-      navigationSidebarOpen,
-      setNavigationSidebarOpen
-    ]),
-    openNavigationSidebar: (0, import_react29.useCallback)(() => setNavigationSidebarOpen(true), [
-      setNavigationSidebarOpen
-    ]),
-    closeNavigationSidebar: (0, import_react29.useCallback)(() => setNavigationSidebarOpen(false), [
-      setNavigationSidebarOpen
-    ]),
-    complementarySidebarOpen,
-    setComplementarySidebarOpen,
-    toggleComplementarySidebar: (0, import_react29.useCallback)(() => setComplementarySidebarOpen(!complementarySidebarOpen), [
-      complementarySidebarOpen,
-      setComplementarySidebarOpen
-    ]),
-    openComplementarySidebar: (0, import_react29.useCallback)(() => setComplementarySidebarOpen(true), [
-      setComplementarySidebarOpen
-    ]),
-    closeComplementarySidebar: (0, import_react29.useCallback)(() => setComplementarySidebarOpen(false), [
-      setComplementarySidebarOpen
-    ])
-  };
-};
-var resizeDebounce = 3e3;
-var MainRoot = ({ navigationSidebarOpen: propsNavigationSidebarOpen, defaultNavigationSidebarOpen, onNavigationSidebarOpenChange, complementarySidebarOpen: propsComplementarySidebarOpen, defaultComplementarySidebarOpen, onComplementarySidebarOpenChange, children, ...props }) => {
-  const [isLg] = (0, import_react_hooks3.useMediaQuery)("lg", {
-    ssr: false
-  });
-  const [navigationSidebarOpen = isLg, setNavigationSidebarOpen] = (0, import_react_use_controllable_state3.useControllableState)({
-    prop: propsNavigationSidebarOpen,
-    defaultProp: defaultNavigationSidebarOpen,
-    onChange: onNavigationSidebarOpenChange
-  });
-  const [complementarySidebarOpen = false, setComplementarySidebarOpen] = (0, import_react_use_controllable_state3.useControllableState)({
-    prop: propsComplementarySidebarOpen,
-    defaultProp: defaultComplementarySidebarOpen,
-    onChange: onComplementarySidebarOpenChange
-  });
-  const [resizing, setResizing] = (0, import_react29.useState)(false);
-  const resizeInterval = (0, import_react29.useRef)(null);
-  const handleResize = (0, import_react29.useCallback)(() => {
-    setResizing(true);
-    if (resizeInterval.current) {
-      clearTimeout(resizeInterval.current);
-    }
-    resizeInterval.current = setTimeout(() => {
-      setResizing(false);
-      resizeInterval.current = null;
-    }, resizeDebounce);
-  }, []);
-  (0, import_react29.useEffect)(() => {
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, [
-    handleResize
-  ]);
-  return /* @__PURE__ */ import_react29.default.createElement(MainProvider, {
-    ...props,
-    navigationSidebarOpen,
-    setNavigationSidebarOpen,
-    complementarySidebarOpen,
-    setComplementarySidebarOpen,
-    resizing
-  }, children);
-};
-MainRoot.displayName = MAIN_ROOT_NAME;
-var handleOpenAutoFocus = (event) => {
-  !document.body.hasAttribute("data-is-keyboard") && event.preventDefault();
-};
-var MainSidebar = /* @__PURE__ */ (0, import_react29.forwardRef)(({ classNames, children, swipeToDismiss, onOpenAutoFocus, open, resizing, setOpen, side, ...props }, forwardedRef) => {
-  const [isLg] = (0, import_react_hooks3.useMediaQuery)("lg", {
-    ssr: false
-  });
-  const { tx } = useThemeContext();
-  const ref = (0, import_react_hooks3.useForwardedRef)(forwardedRef);
-  const noopRef = (0, import_react29.useRef)(null);
-  useSwipeToDismiss(swipeToDismiss ? ref : noopRef, {
-    onDismiss: () => setOpen(false)
-  });
-  const handleKeyDown = (0, import_react29.useCallback)((event) => {
-    if (event.key === "Escape") {
-      event.target.closest("[data-tabster]")?.focus();
-    }
-    props.onKeyDown?.(event);
-  }, [
-    props.onKeyDown
-  ]);
-  const Root3 = isLg ? import_react_primitive9.Primitive.div : import_react_dialog2.DialogContent;
-  return /* @__PURE__ */ import_react29.default.createElement(import_react_dialog2.Root, {
-    open,
-    modal: false
-  }, /* @__PURE__ */ import_react29.default.createElement(Root3, {
-    ...!isLg && {
-      forceMount: true,
-      tabIndex: -1,
-      onOpenAutoFocus: onOpenAutoFocus ?? handleOpenAutoFocus
-    },
-    ...props,
-    "data-side": side === "inline-end" ? "ie" : "is",
-    "data-state": open ? "open" : "closed",
-    "data-resizing": resizing ? "true" : "false",
-    className: tx("main.sidebar", "main__sidebar", {}, classNames),
-    onKeyDown: handleKeyDown,
-    ...!open && {
-      inert: "true"
-    },
-    ref
-  }, /* @__PURE__ */ import_react29.default.createElement(ElevationProvider, {
-    elevation: "group"
-  }, children)));
-});
-var MainNavigationSidebar = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
-  const { navigationSidebarOpen, setNavigationSidebarOpen, resizing } = useMainContext(NAVIGATION_SIDEBAR_NAME);
-  const mover = useLandmarkMover(props.onKeyDown, "0");
-  return /* @__PURE__ */ import_react29.default.createElement(MainSidebar, {
-    ...mover,
-    ...props,
-    open: navigationSidebarOpen,
-    setOpen: setNavigationSidebarOpen,
-    resizing,
-    side: "inline-start",
-    ref: forwardedRef
-  });
-});
-MainNavigationSidebar.displayName = NAVIGATION_SIDEBAR_NAME;
-var MainComplementarySidebar = /* @__PURE__ */ (0, import_react29.forwardRef)((props, forwardedRef) => {
-  const { complementarySidebarOpen, setComplementarySidebarOpen, resizing } = useMainContext(COMPLEMENTARY_SIDEBAR_NAME);
-  const mover = useLandmarkMover(props.onKeyDown, "2");
-  return /* @__PURE__ */ import_react29.default.createElement(MainSidebar, {
-    ...mover,
-    ...props,
-    open: complementarySidebarOpen,
-    setOpen: setComplementarySidebarOpen,
-    resizing,
-    side: "inline-end",
-    ref: forwardedRef
-  });
-});
-MainNavigationSidebar.displayName = NAVIGATION_SIDEBAR_NAME;
-var MainContent = /* @__PURE__ */ (0, import_react29.forwardRef)(({ asChild, classNames, bounce, handlesFocus, children, role, ...props }, forwardedRef) => {
-  const { navigationSidebarOpen, complementarySidebarOpen } = useMainContext(MAIN_NAME);
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot10.Slot : role ? "div" : "main";
-  const mover = useLandmarkMover(props.onKeyDown, "1");
-  return /* @__PURE__ */ import_react29.default.createElement(Root3, {
-    role,
-    ...handlesFocus && {
-      ...mover
-    },
-    ...props,
-    "data-sidebar-inline-start-state": navigationSidebarOpen ? "open" : "closed",
-    "data-sidebar-inline-end-state": complementarySidebarOpen ? "open" : "closed",
-    className: tx("main.content", "main", {
-      bounce,
-      handlesFocus
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-MainContent.displayName = MAIN_NAME;
-var MainOverlay = /* @__PURE__ */ (0, import_react29.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const [isLg] = (0, import_react_hooks3.useMediaQuery)("lg", {
-    ssr: false
-  });
-  const { navigationSidebarOpen, setNavigationSidebarOpen, complementarySidebarOpen, setComplementarySidebarOpen } = useMainContext(MAIN_NAME);
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react29.default.createElement("div", {
-    onClick: () => {
-      setNavigationSidebarOpen(false);
-      setComplementarySidebarOpen(false);
-    },
-    ...props,
-    className: tx("main.overlay", "main__overlay", {
-      isLg,
-      inlineStartSidebarOpen: navigationSidebarOpen,
-      inlineEndSidebarOpen: complementarySidebarOpen
-    }, classNames),
-    "data-state": navigationSidebarOpen || complementarySidebarOpen ? "open" : "closed",
-    "aria-hidden": "true",
-    ref: forwardedRef
-  });
-});
-var MainNotch = /* @__PURE__ */ (0, import_react29.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { navigationSidebarOpen } = useMainContext(MAIN_NAME);
-  const notchElement = (0, import_react29.useRef)(null);
-  const ref = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, notchElement);
-  const handleKeyDown = (0, import_react29.useCallback)((event) => {
-    switch (event.key) {
-      case "Escape":
-        props?.onKeyDown?.(event);
-        notchElement.current?.focus();
-    }
-  }, [
-    props?.onKeyDown
-  ]);
-  const mover = useLandmarkMover(handleKeyDown, "3");
-  return /* @__PURE__ */ import_react29.default.createElement("div", {
-    role: "toolbar",
-    ...mover,
-    ...props,
-    "data-nav-sidebar-state": navigationSidebarOpen ? "open" : "closed",
-    className: tx("main.notch", "main__notch", {}, classNames),
-    ref
-  });
-});
-var Main = {
-  Root: MainRoot,
-  Content: MainContent,
-  Overlay: MainOverlay,
-  NavigationSidebar: MainNavigationSidebar,
-  ComplementarySidebar: MainComplementarySidebar,
-  Notch: MainNotch
-};
-var MESSAGE_NAME = "Message";
-var [MessageProvider, useMessageContext] = (0, import_react_context7.createContext)(MESSAGE_NAME);
-var MessageRoot = /* @__PURE__ */ (0, import_react31.forwardRef)(({ asChild, valence, elevation: propsElevation, className, titleId: propsTitleId, descriptionId: propsDescriptionId, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const titleId = (0, import_react_hooks4.useId)("message__title", propsTitleId);
-  const descriptionId = (0, import_react_hooks4.useId)("message__description", propsDescriptionId);
-  const elevation = useElevationContext(propsElevation);
-  const Root3 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.div;
-  return /* @__PURE__ */ import_react31.default.createElement(MessageProvider, {
-    titleId,
-    descriptionId
-  }, /* @__PURE__ */ import_react31.default.createElement(Root3, {
-    ...props,
-    className: tx("message.root", "message", {
-      valence,
-      elevation
-    }, className),
-    "aria-labelledby": titleId,
-    "aria-describedby": descriptionId,
-    ref: forwardedRef
-  }, children));
-});
-MessageRoot.displayName = MESSAGE_NAME;
-var MESSAGE_TITLE_NAME = "MessageTitle";
-var MessageTitle = /* @__PURE__ */ (0, import_react31.forwardRef)(({ asChild, className, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { titleId } = useMessageContext(MESSAGE_TITLE_NAME);
-  const Root3 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.h2;
-  return /* @__PURE__ */ import_react31.default.createElement(Root3, {
-    ...props,
-    className: tx("message.title", "message__title", {}, className),
-    id: titleId,
-    ref: forwardedRef
-  }, children);
-});
-MessageTitle.displayName = MESSAGE_TITLE_NAME;
-var MESSAGE_BODY_NAME = "MessageBody";
-var MessageBody = /* @__PURE__ */ (0, import_react31.forwardRef)(({ asChild, className, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const { descriptionId } = useMessageContext(MESSAGE_BODY_NAME);
-  const Root3 = asChild ? import_react_slot11.Slot : import_react_primitive10.Primitive.p;
-  return /* @__PURE__ */ import_react31.default.createElement(Root3, {
-    ...props,
-    className: tx("message.body", "message__body", {}, className),
-    id: descriptionId,
-    ref: forwardedRef
-  }, children);
-});
-MessageBody.displayName = MESSAGE_BODY_NAME;
-var Message = {
-  Root: MessageRoot,
-  Title: MessageTitle,
-  Body: MessageBody
-};
-var PopoverRoot = import_react_popover.Root;
-var PopoverPortal = import_react_popover.PopoverPortal;
-var PopoverTrigger = import_react_popover.PopoverTrigger;
-var PopoverAnchor = import_react_popover.PopoverAnchor;
-var PopoverClose = import_react_popover.PopoverClose;
-var PopoverArrow = /* @__PURE__ */ (0, import_react32.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react32.default.createElement(import_react_popover.PopoverArrow, {
-    ...props,
-    className: tx("popover.arrow", "popover__arrow", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var PopoverContent = /* @__PURE__ */ (0, import_react32.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react32.default.createElement(import_react_popover.PopoverContent, {
-    sideOffset: 4,
-    collisionPadding: 8,
-    ...props,
-    className: tx("popover.content", "popover", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react32.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, children));
-});
-var PopoverViewport = /* @__PURE__ */ (0, import_react32.forwardRef)(({ classNames, asChild, constrainInline = true, constrainBlock = true, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot12.Slot : import_react_primitive11.Primitive.div;
-  return /* @__PURE__ */ import_react32.default.createElement(Root3, {
-    ...props,
-    className: tx("popover.viewport", "popover__viewport", {
-      constrainInline,
-      constrainBlock
-    }, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var Popover = {
-  Root: PopoverRoot,
-  Portal: PopoverPortal,
-  Trigger: PopoverTrigger,
-  Anchor: PopoverAnchor,
-  Arrow: PopoverArrow,
-  Close: PopoverClose,
-  Content: PopoverContent,
-  Viewport: PopoverViewport
-};
-var Status = /* @__PURE__ */ (0, import_react33.forwardRef)(({ classNames, children, progress = 0, indeterminate, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react33.default.createElement("span", {
-    role: "status",
-    ...props,
-    className: tx("status.root", "status", {
-      indeterminate
-    }, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react33.default.createElement("span", {
-    role: "none",
-    className: tx("status.bar", "status__bar", {
-      indeterminate
-    }, classNames),
-    ...!indeterminate && {
-      style: {
-        width: `${Math.round(progress * 100)}%`
-      }
-    }
-  }), children);
-});
-var ScrollAreaRoot = /* @__PURE__ */ (0, import_react34.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react34.default.createElement(import_react_scroll_area.Root, {
-    ...props,
-    className: tx("scrollArea.root", "scroll-area", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ScrollAreaViewport = /* @__PURE__ */ (0, import_react34.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react34.default.createElement(import_react_scroll_area.Viewport, {
-    ...props,
-    className: tx("scrollArea.viewport", "scroll-area", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ScrollAreaScrollbar = /* @__PURE__ */ (0, import_react34.forwardRef)(({ classNames, variant = "fine", ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react34.default.createElement(import_react_scroll_area.Scrollbar, {
-    "data-variant": variant,
-    ...props,
-    className: tx("scrollArea.scrollbar", "scroll-area__scrollbar", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ScrollAreaThumb = /* @__PURE__ */ (0, import_react34.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react34.default.createElement(import_react_scroll_area.Thumb, {
-    ...props,
-    className: tx("scrollArea.thumb", "scroll-area__thumb", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ScrollAreaCorner = /* @__PURE__ */ (0, import_react34.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react34.default.createElement(import_react_scroll_area.Corner, {
-    ...props,
-    className: tx("scrollArea.corner", "scroll-area__corner", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ScrollArea = {
-  Root: ScrollAreaRoot,
-  Viewport: ScrollAreaViewport,
-  Scrollbar: ScrollAreaScrollbar,
-  Thumb: ScrollAreaThumb,
-  Corner: ScrollAreaCorner
-};
-var SelectRoot = SelectPrimitive.Root;
-var SelectTrigger = SelectPrimitive.Trigger;
-var SelectValue = SelectPrimitive.Value;
-var SelectIcon = SelectPrimitive.Icon;
-var SelectPortal = SelectPrimitive.Portal;
-var SelectTriggerButton = /* @__PURE__ */ (0, import_react36.forwardRef)(({ children, placeholder, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Trigger, {
-    asChild: true,
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react36.default.createElement(Button, props, /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Value, {
-    placeholder
-  }, children), /* @__PURE__ */ import_react36.default.createElement("span", {
-    className: "w-1 flex-1"
-  }), /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Icon, {
-    asChild: true
-  }, /* @__PURE__ */ import_react36.default.createElement(import_react35.CaretDown, {
-    className: tx("select.triggerIcon", "select__trigger__icon", {}),
-    weight: "bold"
-  }))));
-});
-var SelectContent = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Content, {
-    ...props,
-    className: tx("select.content", "select__content", {}, classNames),
-    position: "popper",
-    ref: forwardedRef
-  }, children);
-});
-var SelectScrollUpButton2 = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.SelectScrollUpButton, {
-    ...props,
-    className: tx("select.scrollButton", "select__scroll-button--up", {}, classNames),
-    ref: forwardedRef
-  }, children ?? /* @__PURE__ */ import_react36.default.createElement(import_react35.CaretUp, {
-    weight: "bold"
-  }));
-});
-var SelectScrollDownButton2 = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.SelectScrollDownButton, {
-    ...props,
-    className: tx("select.scrollButton", "select__scroll-button--down", {}, classNames),
-    ref: forwardedRef
-  }, children ?? /* @__PURE__ */ import_react36.default.createElement(import_react35.CaretDown, {
-    weight: "bold"
-  }));
-});
-var SelectViewport = SelectPrimitive.Viewport;
-var SelectItem = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Item, {
-    ...props,
-    className: tx("select.item", "option", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var SelectItemText = SelectPrimitive.ItemText;
-var SelectItemIndicator = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.ItemIndicator, {
-    ...props,
-    className: tx("select.itemIndicator", "option__indicator", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var SelectOption = /* @__PURE__ */ (0, import_react36.forwardRef)(({ children, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Item, {
-    ...props,
-    className: tx("select.item", "option", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.ItemText, null, children), /* @__PURE__ */ import_react36.default.createElement("span", {
-    className: "grow w-1"
-  }), /* @__PURE__ */ import_react36.default.createElement(Icon, {
-    icon: "ph--check--regular"
-  }));
-});
-var SelectGroup = SelectPrimitive.Group;
-var SelectLabel = SelectPrimitive.Label;
-var SelectSeparator = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Separator, {
-    ...props,
-    className: tx("select.separator", "select__separator", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var SelectArrow = /* @__PURE__ */ (0, import_react36.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react36.default.createElement(SelectPrimitive.Arrow, {
-    ...props,
-    className: tx("select.arrow", "select__arrow", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var Select = {
-  Root: SelectRoot,
-  Trigger: SelectTrigger,
-  TriggerButton: SelectTriggerButton,
-  Value: SelectValue,
-  Icon: SelectIcon,
-  Portal: SelectPortal,
-  Content: SelectContent,
-  ScrollUpButton: SelectScrollUpButton2,
-  ScrollDownButton: SelectScrollDownButton2,
-  Viewport: SelectViewport,
-  Item: SelectItem,
-  ItemText: SelectItemText,
-  ItemIndicator: SelectItemIndicator,
-  Option: SelectOption,
-  Group: SelectGroup,
-  Label: SelectLabel,
-  Separator: SelectSeparator,
-  Arrow: SelectArrow
-};
-var Separator4 = ({ classNames, orientation = "horizontal", ...props }) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react37.default.createElement(import_react_separator.Separator, {
-    orientation,
-    ...props,
-    className: tx("separator.root", "separator", {
-      orientation
-    }, classNames)
-  });
-};
-var Tag = /* @__PURE__ */ (0, import_react38.forwardRef)(({ asChild, palette, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot13.Slot : import_react_primitive12.Primitive.span;
-  return /* @__PURE__ */ import_react38.default.createElement(Root3, {
-    ...props,
-    className: tx("tag.root", "tag", {
-      palette
-    }, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastProvider = import_react_toast.ToastProvider;
-var ToastViewport = /* @__PURE__ */ (0, import_react39.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react39.default.createElement(import_react_toast.ToastViewport, {
-    className: tx("toast.viewport", "toast-viewport", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastRoot = /* @__PURE__ */ (0, import_react39.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react39.default.createElement(import_react_toast.Root, {
-    ...props,
-    className: tx("toast.root", "toast", {}, classNames),
-    ref: forwardedRef
-  }, /* @__PURE__ */ import_react39.default.createElement(ElevationProvider, {
-    elevation: "chrome"
-  }, /* @__PURE__ */ import_react39.default.createElement(DensityProvider, {
-    density: "fine"
-  }, children)));
-});
-var ToastBody = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot14.Slot : import_react_primitive13.Primitive.div;
-  return /* @__PURE__ */ import_react39.default.createElement(Root3, {
-    ...props,
-    className: tx("toast.body", "toast__body", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastTitle = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot14.Slot : import_react_toast.ToastTitle;
-  return /* @__PURE__ */ import_react39.default.createElement(Root3, {
-    ...props,
-    className: tx("toast.title", "toast__title", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastDescription = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot14.Slot : import_react_toast.ToastDescription;
-  return /* @__PURE__ */ import_react39.default.createElement(Root3, {
-    ...props,
-    className: tx("toast.description", "toast__description", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastActions = /* @__PURE__ */ (0, import_react39.forwardRef)(({ asChild, classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  const Root3 = asChild ? import_react_slot14.Slot : import_react_primitive13.Primitive.div;
-  return /* @__PURE__ */ import_react39.default.createElement(Root3, {
-    ...props,
-    className: tx("toast.actions", "toast__actions", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var ToastAction = import_react_toast.ToastAction;
-var ToastClose = import_react_toast.ToastClose;
-var Toast = {
-  Provider: ToastProvider,
-  Viewport: ToastViewport,
-  Root: ToastRoot,
-  Body: ToastBody,
-  Title: ToastTitle,
-  Description: ToastDescription,
-  Actions: ToastActions,
-  Action: ToastAction,
-  Close: ToastClose
-};
-var ToolbarRoot = /* @__PURE__ */ (0, import_react40.forwardRef)(({ classNames, children, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.Root, {
-    ...props,
-    className: tx("toolbar.root", "toolbar", {}, classNames),
-    ref: forwardedRef
-  }, children);
-});
-var ToolbarButton = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.Button, {
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(Button, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var ToolbarToggle = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.Button, {
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(Toggle, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var ToolbarLink = /* @__PURE__ */ (0, import_react40.forwardRef)((props, forwardedRef) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.Link, {
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(Link, {
-    ...props,
-    ref: forwardedRef
-  }));
-});
-var ToolbarToggleGroup2 = /* @__PURE__ */ (0, import_react40.forwardRef)(({ classNames, children, elevation, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.ToolbarToggleGroup, {
-    ...props,
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(ButtonGroup, {
-    classNames,
-    children,
-    elevation,
-    ref: forwardedRef
-  }));
-});
-var ToolbarToggleGroupItem = /* @__PURE__ */ (0, import_react40.forwardRef)(({ variant, density, elevation, classNames, children, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.ToolbarToggleItem, {
-    ...props,
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(Button, {
-    variant,
-    density,
-    elevation,
-    classNames,
-    children,
-    ref: forwardedRef
-  }));
-});
-var ToolbarSeparator = (props) => {
-  return /* @__PURE__ */ import_react40.default.createElement(ToolbarPrimitive.Separator, {
-    asChild: true
-  }, /* @__PURE__ */ import_react40.default.createElement(Separator4, {
-    orientation: "vertical",
-    ...props
-  }));
-};
-var Toolbar = {
-  Root: ToolbarRoot,
-  Button: ToolbarButton,
-  Link: ToolbarLink,
-  Toggle: ToolbarToggle,
-  ToggleGroup: ToolbarToggleGroup2,
-  ToggleGroupItem: ToolbarToggleGroupItem,
-  Separator: ToolbarSeparator
-};
-var TooltipProvider = import_react_tooltip.Provider;
-var TooltipRoot = import_react_tooltip.Root;
-var TooltipPortal = import_react_tooltip.TooltipPortal;
-var TooltipTrigger = import_react_tooltip.TooltipTrigger;
-var TooltipArrow = /* @__PURE__ */ (0, import_react41.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react41.default.createElement(import_react_tooltip.TooltipArrow, {
-    ...props,
-    className: tx("tooltip.arrow", "tooltip__arrow", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var TooltipContent = /* @__PURE__ */ (0, import_react41.forwardRef)(({ classNames, ...props }, forwardedRef) => {
-  const { tx } = useThemeContext();
-  return /* @__PURE__ */ import_react41.default.createElement(import_react_tooltip.TooltipContent, {
-    sideOffset: 4,
-    collisionPadding: 8,
-    ...props,
-    className: tx("tooltip.content", "tooltip", {}, classNames),
-    ref: forwardedRef
-  });
-});
-var Tooltip = {
-  Provider: TooltipProvider,
-  Root: TooltipRoot,
-  Portal: TooltipPortal,
-  Trigger: TooltipTrigger,
-  Arrow: TooltipArrow,
-  Content: TooltipContent
-};
-var hasIosKeyboard = () => {
-  return !!navigator.userAgent.match(/iP(ad|od|hone).+Safari/);
-};
-var ThemeContext = /* @__PURE__ */ (0, import_react42.createContext)({
-  tx: (_path, defaultClassName, _styleProps, ..._options) => defaultClassName,
-  themeMode: "dark",
-  hasIosKeyboard: false
-});
-var handleInputModalityChange = (isUsingKeyboard) => {
-  if (isUsingKeyboard) {
-    document.body.setAttribute("data-is-keyboard", "true");
-  } else {
-    document.body.removeAttribute("data-is-keyboard");
-  }
-};
-var ThemeProvider = ({ children, fallback = null, resourceExtensions, appNs, tx = (_path, defaultClassName, _styleProps, ..._options) => defaultClassName, themeMode = "dark", rootElevation = "base", rootDensity = "coarse" }) => {
-  (0, import_react42.useEffect)(() => {
-    if (document.defaultView) {
-      const kb = (0, import_keyborg.createKeyborg)(document.defaultView);
-      kb.subscribe(handleInputModalityChange);
-      return () => kb.unsubscribe(handleInputModalityChange);
-    }
-  }, []);
-  return /* @__PURE__ */ import_react42.default.createElement(ThemeContext.Provider, {
-    value: {
-      tx,
-      themeMode,
-      hasIosKeyboard: hasIosKeyboard()
-    }
-  }, /* @__PURE__ */ import_react42.default.createElement(TranslationsProvider, {
-    fallback,
-    resourceExtensions,
-    appNs
-  }, /* @__PURE__ */ import_react42.default.createElement(ElevationProvider, {
-    elevation: rootElevation
-  }, /* @__PURE__ */ import_react42.default.createElement(DensityProvider, {
-    density: rootDensity
-  }, children))));
-};
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  AlertDialog,
-  AnchoredOverflow,
-  Avatar,
-  AvatarGroup,
-  AvatarGroupItem,
-  BUTTON_GROUP_NAME,
-  Breadcrumb,
-  Button,
-  ButtonGroup,
-  ContextMenu,
-  DensityContext,
-  DensityProvider,
-  Dialog,
-  DropdownMenu,
-  ElevationContext,
-  ElevationProvider,
-  Icon,
-  Input,
-  LIST_ITEM_NAME,
-  LIST_NAME,
-  Link,
-  List,
-  ListItem,
-  Main,
-  Message,
-  Popover,
-  ScrollArea,
-  Select,
-  Separator,
-  Status,
-  Tag,
-  ThemeContext,
-  ThemeProvider,
-  Toast,
-  Toggle,
-  ToggleGroup,
-  ToggleGroupItem,
-  Toolbar,
-  Tooltip,
-  Trans,
-  Tree,
-  TreeItem,
-  Treegrid,
-  hasIosKeyboard,
-  isLabel,
-  toLocalizedString,
-  useAvatarContext,
-  useButtonGroupContext,
-  useDensityContext,
-  useDropdownMenuContext,
-  useDropdownMenuMenuScope,
-  useElevationContext,
-  useListContext,
-  useListItemContext,
-  useMainContext,
-  useSidebars,
-  useThemeContext,
-  useTranslation,
-  useTranslationsContext,
-  useVisualViewport,
-  ...require("@dxos/react-hooks"),
-  ...require("@dxos/react-ui-types")
-});
-//# sourceMappingURL=index.cjs.map