@oomol-lab/open-flow 0.1.0-beta.85 → 0.1.0-beta.87

package/dist/browser/{tooltip-DGj5pudg.js → tooltip-BZ6tpqnr.js}

@@ -4250,6 +4250,7 @@ function cn(...inputs) {
 //#region src/ui/browser/button.tsx
 var buttonVariants = cva("nodrag group/button relative inline-flex shrink-0 items-center justify-center rounded-[var(--ui-control-radius,calc(var(--ui-radius)_+_2px))] border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap no-underline transition-[color,background-color,border-color,box-shadow,opacity,transform] outline-none select-none before:absolute before:inset-0 before:content-[''] motion-reduce:transition-none focus-visible:border-border focus-visible:outline-2 focus-visible:outline-solid focus-visible:ring-0 focus-visible:aria-invalid:ring-0 focus-visible:outline-offset-1 focus-visible:outline-ring focus-visible:aria-invalid:outline-destructive active:not-aria-[haspopup]:not-data-[variant=field]:translate-y-px disabled:pointer-events-none disabled:opacity-[var(--ui-disabled-opacity,0.5)] aria-disabled:pointer-events-none aria-disabled:opacity-[var(--ui-disabled-opacity,0.5)] aria-invalid:border-destructive [&_svg]:pointer-events-none [&_i[aria-hidden=true]]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
 	variants: {
+		multiline: { true: "min-h-min whitespace-normal wrap-anywhere text-center" },
 		variant: {
 			"default": "bg-primary text-primary-foreground hover:bg-primary/80",
 			"outline": "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-[var(--ui-disabled-background,color-mix(in_srgb,var(--ui-input)_50%,transparent))]",
@@ -4278,7 +4279,7 @@ var buttonVariants = cva("nodrag group/button relative inline-flex shrink-0 item
 		size: "default"
 	}
 });
-var Button = forwardRef(function Button({ className, variant = "default", size = "default", ...props }, ref) {
+var Button = forwardRef(function Button({ className, variant = "default", size = "default", multiline, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Button$1, {
 		ref,
 		"data-slot": "button",
@@ -4287,6 +4288,7 @@ var Button = forwardRef(function Button({ className, variant = "default", size =
 		className: cn(buttonVariants({
 			variant,
 			size,
+			multiline,
 			className
 		})),
 		...props
@@ -12652,7 +12654,7 @@ var Separator = /*#__PURE__*/ React.forwardRef(function SeparatorComponent(compo
 });
 if (process.env.NODE_ENV !== "production") Separator.displayName = "Separator";
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/util.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/util.js
 function getEnumValues(entries) {
 	const numericValues = Object.values(entries).filter((v) => typeof v === "number");
 	return Object.entries(entries).filter(([k, _]) => numericValues.indexOf(+k) === -1).map(([_, v]) => v);
@@ -12977,6 +12979,17 @@ function prefixIssues(path, issues) {
 function unwrapMessage(message) {
 	return typeof message === "string" ? message : message?.message;
 }
+/** The leading size checks of `defChecks` that set an upper bound, each paired with it. */
+function sizeCaps(defChecks) {
+	const caps = [];
+	for (const ch of defChecks ?? []) {
+		const d = ch._zod.def;
+		if (!/_(length|size)$|_equals$/.test(d.check)) break;
+		const max = d.maximum ?? d.length ?? d.size;
+		if (max >= 0) caps.push([max, ch]);
+	}
+	return caps;
+}
 function attachSchema(issues, start, inst) {
 	var _a;
 	for (let i = start; i < issues.length; i++) (_a = issues[i]).schema ?? (_a.schema = inst);
@@ -13193,7 +13206,7 @@ function constantCatch(value) {
 	return fn;
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/core.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/core.js
 var _a$1;
 var _zodDesc = {
 	value: void 0,
@@ -13299,7 +13312,7 @@ function config(newConfig) {
 	return globalConfig;
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/errors.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/errors.js
 function _getMessage() {
 	const internals = this._zod;
 	internals.message ?? (internals.message = JSON.stringify(internals.def, jsonStringifyReplacer, 2));
@@ -13415,7 +13428,7 @@ function formatError(error, mapper = (issue) => issue.message) {
 	return fieldErrors;
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/parse.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/parse.js
 function finalizeParams(callee, params) {
 	return {
 		callee: params?.callee ?? callee,
@@ -13618,7 +13631,7 @@ var _safeDecodeAsync = (_Err) => async (schema, value, _ctx) => {
 	return _safeParseAsync(_Err)(schema, value, _ctx);
 };
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/regexes.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/regexes.js
 /**
 * @deprecated CUID v1 is deprecated by its authors due to information leakage
 * (timestamps embedded in the id). Use {@link cuid2} instead.
@@ -13691,7 +13704,7 @@ var _null$2 = /^null$/i;
 var lowercase = /^[^A-Z]*$/;
 var uppercase = /^[^a-z]*$/;
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/checks.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/checks.js
 var $ZodCheck = /*@__PURE__*/ $constructor("$ZodCheck", (inst, def) => {
 	var _a;
 	inst._zod ?? (inst._zod = {});
@@ -13987,7 +14000,7 @@ var $ZodCheckOverwrite = /*@__PURE__*/ $constructor("$ZodCheckOverwrite", (inst,
 	};
 });
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/doc.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/doc.js
 var Doc = class {
 	constructor(args = [], closed = {}) {
 		this.content = [];
@@ -14021,14 +14034,14 @@ var Doc = class {
 	}
 };
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/versions.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/versions.js
 var version = {
 	major: 4,
 	minor: 6,
-	patch: 5
+	patch: 7
 };
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/schemas.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/schemas.js
 var $ZodType = /*@__PURE__*/ $constructor("$ZodType", (inst, def) => {
 	var _a;
 	inst ?? (inst = {});
@@ -14541,6 +14554,26 @@ var $ZodNever = /*@__PURE__*/ $constructor("$ZodNever", (inst, def) => {
 		return payload;
 	};
 });
+function capSize(inst, size) {
+	const caps = sizeCaps(inst._zod.def.checks);
+	if (!caps.length) return;
+	const cap = Math.min(...caps.map((c) => c[0]));
+	const parse = inst._zod.parse;
+	inst._zod.parse = (payload, ctx) => {
+		const n = size(payload.value);
+		if (n > cap && !ctx?.skipChecks && ctx?.direction !== "backward") {
+			for (const [max, ch] of sizeCaps(inst._zod.def.checks)) if (n > max && ch._zod.def.when(payload)) {
+				const start = payload.issues.length;
+				ch._zod.check(payload);
+				payload.issues[start].continue = false;
+				attachSchema(payload.issues, start, inst);
+				return payload;
+			}
+		}
+		return parse(payload, ctx);
+	};
+}
+var arraySize = (input) => Array.isArray(input) ? input.length : -1;
 function handleArrayResult(result, final, index) {
 	if (result.issues.length) final.issues.push(...prefixIssues(index, result.issues));
 	final.value[index] = result.value;
@@ -14578,6 +14611,7 @@ var $ZodArray = /*@__PURE__*/ $constructor("$ZodArray", (inst, def) => {
 		if (proms.length) return Promise.all(proms).then(() => payload);
 		return payload;
 	};
+	capSize(inst, arraySize);
 });
 function handlePropertyResult(result, final, key, input, optin, optout) {
 	const isPresent = key in input;
@@ -14686,7 +14720,7 @@ var $ZodObject = /*@__PURE__*/ $constructor("$ZodObject", (inst, def) => {
 		}
 		return propValues;
 	});
-	const isObject$2 = isObject;
+	const isObject$1 = isObject;
 	const catchall = def.catchall;
 	let value;
 	const memo = globalConfig.memoizer;
@@ -14694,7 +14728,7 @@ var $ZodObject = /*@__PURE__*/ $constructor("$ZodObject", (inst, def) => {
 	inst._zod.parse = (payload, ctx) => {
 		value ?? (value = _normalized.value);
 		const input = payload.value;
-		if (!isObject$2(input)) {
+		if (!isObject$1(input)) {
 			payload.issues.push({
 				expected: "object",
 				code: "invalid_type",
@@ -14824,7 +14858,7 @@ var $ZodObjectJIT = /*@__PURE__*/ $constructor("$ZodObjectJIT", (inst, def) => {
 		return doc.compile();
 	};
 	let fastpass;
-	const isObject$1 = isObject;
+	const isObject$2 = isObject;
 	const jit = !globalConfig.jitless;
 	const fastEnabled = jit && allowsEval.value;
 	const catchall = def.catchall;
@@ -14832,7 +14866,7 @@ var $ZodObjectJIT = /*@__PURE__*/ $constructor("$ZodObjectJIT", (inst, def) => {
 	inst._zod.parse = (payload, ctx) => {
 		value ?? (value = _normalized.value);
 		const input = payload.value;
-		if (!isObject$1(input)) {
+		if (!isObject$2(input)) {
 			payload.issues.push({
 				expected: "object",
 				code: "invalid_type",
@@ -15496,7 +15530,7 @@ function handleRefineResult(result, payload, input, inst) {
 	}
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/memoizer.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/memoizer.js
 var $ZodCyclicError = class extends Error {
 	constructor() {
 		super(`Cannot parse a reference cycle that closes through a transform`);
@@ -15749,7 +15783,7 @@ function isBackEdge(ctx, value) {
 	return backEdges !== void 0 && isRef(value) && backEdges.has(value);
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/locales/en.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/locales/en.js
 var error = () => {
 	const Sizable = {
 		string: {
@@ -15857,7 +15891,7 @@ function en_default() {
 	return { localeError: error() };
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/registries.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/registries.js
 var _a;
 var $ZodRegistry = class {
 	constructor() {
@@ -15904,7 +15938,7 @@ function registry() {
 (_a = globalThis).__zod_globalRegistry ?? (_a.__zod_globalRegistry = registry());
 var globalRegistry = globalThis.__zod_globalRegistry;
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/api.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/api.js
 function snapshotChecks(def) {
 	if (def.checks) def.checks = [...def.checks];
 	return def;
@@ -16420,7 +16454,7 @@ function _check(fn, params) {
 	return ch;
 }
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/to-json-schema.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/to-json-schema.js
 function assignProps(target, ...sources) {
 	for (const source of sources) for (const key of Reflect.ownKeys(source)) if (Object.prototype.propertyIsEnumerable.call(source, key)) assignProp(target, key, source[key]);
 	return target;
@@ -16864,7 +16898,7 @@ var createStandardJSONSchemaMethod = (schema, io, processors = {}) => (params) =
 	return finalize(ctx, schema);
 };
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/core/json-schema-processors.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/core/json-schema-processors.js
 var narrowMin = (agg, key, value) => {
 	if (agg[key] === void 0 || value > agg[key]) agg[key] = value;
 };
@@ -17325,7 +17359,7 @@ var lazyProcessor = (schema, ctx, _json, params) => {
 	seen.ref = innerType;
 };
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/classic/errors.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/classic/errors.js
 var _installedErrorProtos = /* @__PURE__ */ new WeakSet([Object.prototype, Error.prototype]);
 function _lazyMethod(proto, key, make) {
 	Object.defineProperty(proto, key, {
@@ -17375,7 +17409,7 @@ var initializer = (inst, issues) => {
 };
 var ZodRealError = /*@__PURE__*/ $constructor("ZodError", initializer, void 0, { Parent: Error });
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/classic/parse.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/classic/parse.js
 var parse = /* @__PURE__ */ _parse(ZodRealError);
 var parseAsync = /* @__PURE__ */ _parseAsync(ZodRealError);
 var safeParse = /* @__PURE__ */ _safeParse(ZodRealError);
@@ -17389,7 +17423,7 @@ var safeDecode = /* @__PURE__ */ _safeDecode(ZodRealError);
 var safeEncodeAsync = /* @__PURE__ */ _safeEncodeAsync(ZodRealError);
 var safeDecodeAsync = /* @__PURE__ */ _safeDecodeAsync(ZodRealError);
 //#endregion
-//#region ../../node_modules/.bun/zod@4.6.5/node_modules/zod/v4/classic/schemas.js
+//#region ../../node_modules/.bun/zod@4.6.7/node_modules/zod/v4/classic/schemas.js
 function _ensureDefaultLocale() {
 	if (!globalConfig.localeError) config(en_default());
 }

package/dist/browser/ui.css

@@ -92,7 +92,7 @@
 
 .open-flow-theme {
   --_open-flow-theme: light;
-  color-scheme: var(--_open-flow-theme);
+  color-scheme: light;
   --_open-flow-background: var(--open-flow-background, light-dark(#fdfdfd, #1c1c1c));
   --_open-flow-foreground: var(--open-flow-foreground, light-dark(#242424, #eee));
   --_open-flow-card: var(--open-flow-card, light-dark(#fefefe, #242424));
@@ -131,6 +131,7 @@
 
 .open-flow-theme[data-theme="dark"] {
   --_open-flow-theme: dark;
+  color-scheme: dark;
 }
 
 .open-flow-theme, .open-flow-canvas-root :is(.react-flow__controls, [data-canvas-control-scope]) {
@@ -1450,6 +1451,10 @@
     min-height: min(360px, 80dvh);
   }
 
+  :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .min-h-min {
+    min-height: min-content;
+  }
+
   :where(.open-flow-theme, .open-flow-workbench, .open-flow-canvas-root) .w-\(--anchor-width\) {
     width: var(--anchor-width);
   }
@@ -6131,23 +6136,20 @@
 }
 
 .open-flow-navigation-menu {
+  width: max-content;
+  max-width: calc(100vw - 16px);
+  max-height: var(--available-height);
+  overscroll-behavior: contain;
   border: 1px solid var(--ui-border);
   border-radius: var(--ui-radius);
   background: var(--ui-popover);
   color: var(--ui-popover-foreground);
-  margin: 0;
+  gap: 0;
   padding: 4px;
-  position: fixed;
-  inset: 48px 16px auto auto;
+  overflow-y: auto;
   box-shadow: 0 4px 12px #0002;
 }
 
-.open-flow-navigation-menu:popover-open {
-  flex-direction: column;
-  align-items: stretch;
-  display: flex;
-}
-
 .open-flow-navigation-menu button[aria-pressed="true"] {
   background: var(--ui-muted);
 }

package/dist/browser/ui.d.ts

@@ -1,6 +1,7 @@
 import type { ComponentPropsWithoutRef, ComponentType, ForwardRefExoticComponent, ReactElement, ReactNode, RefAttributes, RefObject } from 'react';
 /** Native host button contract; Base UI composition stays internal to the product. */
 export interface ButtonProps extends ComponentPropsWithoutRef<'button'> {
+    multiline?: boolean;
     variant?: 'default' | 'outline' | 'secondary' | 'ghost' | 'disclosure' | 'destructive' | 'link';
     size?: 'default' | 'xs' | 'sm' | 'lg' | 'icon' | 'icon-xs' | 'icon-sm' | 'icon-lg';
 }

package/dist/browser/ui.js

@@ -1,5 +1,5 @@
 import * as React from "react";
-import w, { createElement, forwardRef, useEffect, useId, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
+import w, { createElement, forwardRef, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import * as ReactDOM from "react-dom";
 //#region \0rolldown/runtime.js
@@ -4252,6 +4252,7 @@ function cn(...inputs) {
 //#region src/ui/browser/button.tsx
 var buttonVariants = cva("nodrag group/button relative inline-flex shrink-0 items-center justify-center rounded-[var(--ui-control-radius,calc(var(--ui-radius)_+_2px))] border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap no-underline transition-[color,background-color,border-color,box-shadow,opacity,transform] outline-none select-none before:absolute before:inset-0 before:content-[''] motion-reduce:transition-none focus-visible:border-border focus-visible:outline-2 focus-visible:outline-solid focus-visible:ring-0 focus-visible:aria-invalid:ring-0 focus-visible:outline-offset-1 focus-visible:outline-ring focus-visible:aria-invalid:outline-destructive active:not-aria-[haspopup]:not-data-[variant=field]:translate-y-px disabled:pointer-events-none disabled:opacity-[var(--ui-disabled-opacity,0.5)] aria-disabled:pointer-events-none aria-disabled:opacity-[var(--ui-disabled-opacity,0.5)] aria-invalid:border-destructive [&_svg]:pointer-events-none [&_i[aria-hidden=true]]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
 	variants: {
+		multiline: { true: "min-h-min whitespace-normal wrap-anywhere text-center" },
 		variant: {
 			"default": "bg-primary text-primary-foreground hover:bg-primary/80",
 			"outline": "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-[var(--ui-disabled-background,color-mix(in_srgb,var(--ui-input)_50%,transparent))]",
@@ -4280,7 +4281,7 @@ var buttonVariants = cva("nodrag group/button relative inline-flex shrink-0 item
 		size: "default"
 	}
 });
-var Button$1 = forwardRef(function Button({ className, variant = "default", size = "default", ...props }, ref) {
+var Button$1 = forwardRef(function Button({ className, variant = "default", size = "default", multiline, ...props }, ref) {
 	return /* @__PURE__ */ jsx(Button$2, {
 		ref,
 		"data-slot": "button",
@@ -4289,6 +4290,7 @@ var Button$1 = forwardRef(function Button({ className, variant = "default", size
 		className: cn(buttonVariants({
 			variant,
 			size,
+			multiline,
 			className
 		})),
 		...props
@@ -4537,7 +4539,7 @@ var maybeReactUseId = SafeReact.useId;
 * @param idOverride
 * @returns {string}
 */
-function useId$1(idOverride, prefix) {
+function useId(idOverride, prefix) {
 	if (maybeReactUseId !== void 0) {
 		const reactId = maybeReactUseId();
 		return idOverride ?? (prefix ? `${prefix}-${reactId}` : reactId);
@@ -4552,7 +4554,7 @@ function useId$1(idOverride, prefix) {
 * @returns {string | undefined}
 */
 function useBaseUiId(idOverride) {
-	return useId$1(idOverride, "base-ui");
+	return useId(idOverride, "base-ui");
 }
 //#endregion
 //#region ../../node_modules/.bun/@base-ui+react@1.4.1+fa6c2f29eeb10566/node_modules/@base-ui/react/esm/dialog/description/DialogDescription.js
@@ -5785,7 +5787,7 @@ var usePortalContext = () => React.useContext(PortalContext);
 var attr = createAttribute("portal");
 function useFloatingPortalNode(props = {}) {
 	const { ref, container: containerProp, componentProps = EMPTY_OBJECT, elementProps } = props;
-	const uniqueId = useId$1();
+	const uniqueId = useId();
 	const parentPortalNode = usePortalContext()?.portalNode;
 	const [containerElement, setContainerElement] = React.useState(null);
 	const [portalNode, setPortalNode] = React.useState(null);
@@ -5978,7 +5980,7 @@ var useFloatingTree = (externalTree) => {
 * @see https://floating-ui.com/docs/FloatingTree
 */
 function useFloatingNodeId(externalTree) {
-	const id = useId$1();
+	const id = useId();
 	const tree = useFloatingTree(externalTree);
 	const parentId = useFloatingParentNodeId();
 	useIsoLayoutEffect(() => {
@@ -9513,7 +9515,7 @@ var popupStoreSelectors = {
 //#region ../../node_modules/.bun/@base-ui+react@1.4.1+fa6c2f29eeb10566/node_modules/@base-ui/react/esm/floating-ui-react/hooks/useFloatingRootContext.js
 function useFloatingRootContext(options) {
 	const { open = false, onOpenChange, elements = {} } = options;
-	const floatingId = useId$1();
+	const floatingId = useId();
 	const nested = useFloatingParentNodeId() != null;
 	if (process.env.NODE_ENV !== "production") {
 		const optionDomReference = elements.reference;
@@ -9671,7 +9673,7 @@ function useFloating(options = {}) {
 */
 function useSyncedFloatingRootContext(options) {
 	const { popupStore, treatPopupAsFloatingElement = false, onOpenChange } = options;
-	const floatingId = useId$1();
+	const floatingId = useId();
 	const nested = useFloatingParentNodeId() != null;
 	const open = popupStore.useState("open");
 	const referenceElement = popupStore.useState("activeTriggerElement");
@@ -10806,7 +10808,7 @@ function useRole(context, props = {}) {
 	const domReference = store.useState("domReferenceElement");
 	const floatingElement = store.useState("floatingElement");
 	const { role = "dialog" } = props;
-	const defaultReferenceId = useId$1();
+	const defaultReferenceId = useId();
 	const referenceId = domReference?.id || defaultReferenceId;
 	const floatingId = React.useMemo(() => getFloatingFocusElement(floatingElement)?.id || defaultFloatingId, [floatingElement, defaultFloatingId]);
 	const ariaRole = componentRoleToAriaRoleMap.get(role) ?? role;
@@ -14405,7 +14407,7 @@ var MenuRoot = fastComponent(function MenuRoot(props) {
 		disabled: disabledProp,
 		modal: parent.type === void 0 ? modalProp : void 0,
 		openMethod,
-		rootId: useId$1()
+		rootId: useId()
 	});
 	useImplicitActiveTrigger(store);
 	const { forceUnmount } = useOpenStateTransitions(open, store, () => {
@@ -15969,6 +15971,12 @@ function ClosePartProvider(props) {
 		children
 	});
 }
+function useClosePartRegistration() {
+	const context = React.useContext(ClosePartContext);
+	useIsoLayoutEffect(() => {
+		return context?.register();
+	}, [context]);
+}
 //#endregion
 //#region ../../node_modules/.bun/@base-ui+react@1.4.1+fa6c2f29eeb10566/node_modules/@base-ui/react/esm/popover/popup/PopoverPopup.js
 var stateAttributesMapping$1 = {
@@ -16093,6 +16101,35 @@ var PopoverTitle$2 = /*#__PURE__*/ React.forwardRef(function PopoverTitle(compon
 	});
 });
 if (process.env.NODE_ENV !== "production") PopoverTitle$2.displayName = "PopoverTitle";
+//#endregion
+//#region ../../node_modules/.bun/@base-ui+react@1.4.1+fa6c2f29eeb10566/node_modules/@base-ui/react/esm/popover/close/PopoverClose.js
+/**
+* A button that closes the popover.
+* Renders a `<button>` element.
+*
+* Documentation: [Base UI Popover](https://base-ui.com/react/components/popover)
+*/
+var PopoverClose$1 = /*#__PURE__*/ React.forwardRef(function PopoverClose(componentProps, forwardedRef) {
+	const { render, className, disabled = false, nativeButton = true, style, ...elementProps } = componentProps;
+	const { buttonRef, getButtonProps } = useButton({
+		disabled,
+		focusableWhenDisabled: false,
+		native: nativeButton
+	});
+	const { store } = usePopoverRootContext();
+	useClosePartRegistration();
+	return useRenderElement("button", componentProps, {
+		ref: [forwardedRef, buttonRef],
+		props: [
+			{ onClick(event) {
+				store.setOpen(false, createChangeEventDetails(closePress, event.nativeEvent, event.currentTarget));
+			} },
+			elementProps,
+			getButtonProps
+		]
+	});
+});
+if (process.env.NODE_ENV !== "production") PopoverClose$1.displayName = "PopoverClose";
 var scroll_area_module_default = {
 	container: "scroll-area_container_07c14",
 	scrollbar: "scroll-area_scrollbar_07c14",
@@ -18675,6 +18712,12 @@ var PopoverTrigger$1 = React.forwardRef(function PopoverTrigger(props, ref) {
 		ref
 	});
 });
+function PopoverClose(props) {
+	return /* @__PURE__ */ jsx(PopoverClose$1, {
+		"data-slot": "popover-close",
+		...props
+	});
+}
 function PopoverContent$1({ className, positionerClassName, positionerStyle, align = "center", alignOffset = 0, anchor, collisionBoundary, collisionAvoidance, positionMethod, container, keepMounted, side = "bottom", sideOffset = 4, ...props }) {
 	return /* @__PURE__ */ jsx(PopoverPortal, {
 		container,
@@ -19624,9 +19667,9 @@ var themeIcons = {
 var actionClassName = "rounded-full bg-foreground/3 text-foreground hover:bg-foreground/7 dark:hover:bg-foreground/7";
 /** Shared host navigation; each host owns preference storage and localized labels. */
 function HostNavigationActions({ className, language, onLanguageChange, theme, onThemeChange, labels }) {
-	const themeId = useId();
-	const languageId = useId();
+	const [container, setContainer] = useState(null);
 	return /* @__PURE__ */ jsxs("div", {
+		ref: setContainer,
 		className: cn("flex items-center gap-2", className),
 		children: [
 			/* @__PURE__ */ jsx(HostTooltip, {
@@ -19648,78 +19691,82 @@ function HostNavigationActions({ className, language, onLanguageChange, theme, o
 					})
 				})
 			}),
-			/* @__PURE__ */ jsx(HostTooltip, {
+			/* @__PURE__ */ jsxs(Popover$1, { children: [/* @__PURE__ */ jsx(HostTooltip, {
 				label: labels.theme,
 				side: "bottom",
-				children: /* @__PURE__ */ jsx(Button$1, {
-					className: actionClassName,
-					variant: "ghost",
-					size: "icon",
-					type: "button",
-					"aria-label": labels.theme,
-					popovertarget: themeId,
+				children: /* @__PURE__ */ jsx(PopoverTrigger$1, {
+					render: /* @__PURE__ */ jsx(Button$1, {
+						className: actionClassName,
+						variant: "ghost",
+						size: "icon",
+						type: "button",
+						"aria-label": labels.theme
+					}),
 					children: /* @__PURE__ */ jsx("i", {
 						"aria-hidden": "true",
 						className: `${themeIcons[theme]} size-4`
 					})
 				})
-			}),
-			/* @__PURE__ */ jsx(HostTooltip, {
-				label: labels.language,
-				side: "bottom",
-				children: /* @__PURE__ */ jsx(Button$1, {
-					className: actionClassName,
-					variant: "ghost",
-					size: "icon",
-					type: "button",
-					popovertarget: languageId,
-					"aria-label": labels.language,
-					children: /* @__PURE__ */ jsx("i", {
-						"aria-hidden": "true",
-						className: "i-lucide-light:languages size-4"
-					})
-				})
-			}),
-			/* @__PURE__ */ jsx("div", {
-				id: themeId,
-				popover: "auto",
-				className: "open-flow-navigation-menu",
+			}), /* @__PURE__ */ jsx(PopoverContent$1, {
+				container,
+				align: "end",
+				positionMethod: "fixed",
+				className: "open-flow-navigation-menu ring-0",
+				"aria-label": labels.theme,
 				children: [
 					"light",
 					"dark",
 					"auto"
-				].map((value) => /* @__PURE__ */ jsxs(Button$1, {
-					className: "justify-start gap-2",
-					variant: "ghost",
-					size: "sm",
+				].map((value) => /* @__PURE__ */ jsxs(PopoverClose, {
+					render: /* @__PURE__ */ jsx(Button$1, {
+						multiline: true,
+						className: "justify-start gap-2",
+						variant: "ghost",
+						size: "sm"
+					}),
 					type: "button",
 					"aria-pressed": theme == value,
-					onClick: (event) => {
-						onThemeChange(value);
-						event.currentTarget.closest("[popover]")?.hidePopover();
-					},
+					onClick: () => onThemeChange(value),
 					children: [/* @__PURE__ */ jsx("i", {
 						"aria-hidden": "true",
-						className: `${themeIcons[value]} size-4`
+						className: `${themeIcons[value]} size-4 shrink-0`
 					}), labels[value]]
 				}, value))
-			}),
-			/* @__PURE__ */ jsx("div", {
-				id: languageId,
-				popover: "auto",
-				className: "open-flow-navigation-menu",
-				children: uiLanguages.map((value) => /* @__PURE__ */ jsx(Button$1, {
-					variant: "ghost",
-					size: "sm",
+			})] }),
+			/* @__PURE__ */ jsxs(Popover$1, { children: [/* @__PURE__ */ jsx(HostTooltip, {
+				label: labels.language,
+				side: "bottom",
+				children: /* @__PURE__ */ jsx(PopoverTrigger$1, {
+					render: /* @__PURE__ */ jsx(Button$1, {
+						className: actionClassName,
+						variant: "ghost",
+						size: "icon",
+						type: "button",
+						"aria-label": labels.language
+					}),
+					children: /* @__PURE__ */ jsx("i", {
+						"aria-hidden": "true",
+						className: "i-lucide-light:languages size-4"
+					})
+				})
+			}), /* @__PURE__ */ jsx(PopoverContent$1, {
+				container,
+				align: "end",
+				positionMethod: "fixed",
+				className: "open-flow-navigation-menu ring-0",
+				"aria-label": labels.language,
+				children: uiLanguages.map((value) => /* @__PURE__ */ jsx(PopoverClose, {
+					render: /* @__PURE__ */ jsx(Button$1, {
+						multiline: true,
+						variant: "ghost",
+						size: "sm"
+					}),
 					type: "button",
 					"aria-pressed": language == value,
-					onClick: (event) => {
-						onLanguageChange(value);
-						event.currentTarget.closest("[popover]")?.hidePopover();
-					},
+					onClick: () => onLanguageChange(value),
 					children: uiLanguageNames[value]
 				}, value))
-			})
+			})] })
 		]
 	});
 }