@mittwald/flow-react-components 1.6.0-next.5 → 1.6.0-next.51

package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs

@@ -11,12 +11,15 @@ var isVirtualKeyboardVisible = (layoutViewportHeight, visualViewportHeight, thre
 * VisualViewport API. On iOS and Android the layout viewport stays while the
 * visual viewport shrinks by the keyboard height. Returns `false` where
 * VisualViewport is unavailable (SSR, very old browsers).
+*
+* Reading the viewport height forces a synchronous layout, so the hook neither
+* reads nor listens while `isEnabled` is `false`, and returns `false` then.
 */
-var useVirtualKeyboardVisible = () => {
+var useVirtualKeyboardVisible = (isEnabled = true) => {
 	const [visible, setVisible] = useState(false);
 	useEffect(() => {
 		const viewport = window.visualViewport;
-		if (!viewport) return;
+		if (!isEnabled || !viewport) return;
 		const update = () => {
 			setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));
 		};
@@ -26,11 +29,11 @@ var useVirtualKeyboardVisible = () => {
 		return () => {
 			viewport.removeEventListener("resize", update);
 			viewport.removeEventListener("scroll", update);
+			setVisible(false);
 		};
-	}, []);
-	return visible;
+	}, [isEnabled]);
+	return isEnabled && visible;
 };
-//#endregion
 export { isVirtualKeyboardVisible, useVirtualKeyboardVisible };
 
 //# sourceMappingURL=useVirtualKeyboardVisible.mjs.map

package/dist/js/packages/components/src/lib/hooks/dom/useVirtualKeyboardVisible.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useVirtualKeyboardVisible.mjs","names":[],"sources":["../../../../../../../../src/lib/hooks/dom/useVirtualKeyboardVisible.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * Minimum shrinkage (px) of the visual viewport relative to the layout viewport\n * that we treat as \"the on-screen keyboard is open\". Filters out the much\n * smaller changes caused by mobile browser chrome (e.g. the address bar).\n */\nexport const VIRTUAL_KEYBOARD_MIN_HEIGHT = 150;\n\n/**\n * Pure predicate: the visual viewport is at least `threshold` px shorter than\n * the layout viewport (i.e. the on-screen keyboard is open).\n */\nexport const isVirtualKeyboardVisible = (\n  layoutViewportHeight: number,\n  visualViewportHeight: number,\n  threshold: number = VIRTUAL_KEYBOARD_MIN_HEIGHT,\n): boolean => layoutViewportHeight - visualViewportHeight > threshold;\n\n/**\n * Tracks whether the on-screen (virtual) keyboard is currently open, using the\n * VisualViewport API. On iOS and Android the layout viewport stays while the\n * visual viewport shrinks by the keyboard height. Returns `false` where\n * VisualViewport is unavailable (SSR, very old browsers).\n */\nexport const useVirtualKeyboardVisible = (): boolean => {\n  const [visible, setVisible] = useState(false);\n\n  useEffect(() => {\n    const viewport = window.visualViewport;\n    if (!viewport) {\n      return;\n    }\n    const update = (): void => {\n      setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));\n    };\n    update();\n    viewport.addEventListener(\"resize\", update);\n    viewport.addEventListener(\"scroll\", update);\n    return () => {\n      viewport.removeEventListener(\"resize\", update);\n      viewport.removeEventListener(\"scroll\", update);\n    };\n  }, []);\n\n  return visible;\n};\n"],"mappings":";;;;;;;AAaA,IAAa,4BACX,sBACA,sBACA,YAAA,QACY,uBAAuB,uBAAuB;;;;;;;AAQ5D,IAAa,kCAA2C;CACtD,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,gBAAgB;EACd,MAAM,WAAW,OAAO;EACxB,IAAI,CAAC,UACH;EAEF,MAAM,eAAqB;GACzB,WAAW,yBAAyB,OAAO,aAAa,SAAS,MAAM,CAAC;EAC1E;EACA,OAAO;EACP,SAAS,iBAAiB,UAAU,MAAM;EAC1C,SAAS,iBAAiB,UAAU,MAAM;EAC1C,aAAa;GACX,SAAS,oBAAoB,UAAU,MAAM;GAC7C,SAAS,oBAAoB,UAAU,MAAM;EAC/C;CACF,GAAG,CAAC,CAAC;CAEL,OAAO;AACT"}
+{"version":3,"file":"useVirtualKeyboardVisible.mjs","names":[],"sources":["../../../../../../../../src/lib/hooks/dom/useVirtualKeyboardVisible.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\n\n/**\n * Minimum shrinkage (px) of the visual viewport relative to the layout viewport\n * that we treat as \"the on-screen keyboard is open\". Filters out the much\n * smaller changes caused by mobile browser chrome (e.g. the address bar).\n */\nexport const VIRTUAL_KEYBOARD_MIN_HEIGHT = 150;\n\n/**\n * Pure predicate: the visual viewport is at least `threshold` px shorter than\n * the layout viewport (i.e. the on-screen keyboard is open).\n */\nexport const isVirtualKeyboardVisible = (\n  layoutViewportHeight: number,\n  visualViewportHeight: number,\n  threshold: number = VIRTUAL_KEYBOARD_MIN_HEIGHT,\n): boolean => layoutViewportHeight - visualViewportHeight > threshold;\n\n/**\n * Tracks whether the on-screen (virtual) keyboard is currently open, using the\n * VisualViewport API. On iOS and Android the layout viewport stays while the\n * visual viewport shrinks by the keyboard height. Returns `false` where\n * VisualViewport is unavailable (SSR, very old browsers).\n *\n * Reading the viewport height forces a synchronous layout, so the hook neither\n * reads nor listens while `isEnabled` is `false`, and returns `false` then.\n */\nexport const useVirtualKeyboardVisible = (isEnabled = true): boolean => {\n  const [visible, setVisible] = useState(false);\n\n  useEffect(() => {\n    const viewport = window.visualViewport;\n    if (!isEnabled || !viewport) {\n      return;\n    }\n    const update = (): void => {\n      setVisible(isVirtualKeyboardVisible(window.innerHeight, viewport.height));\n    };\n    update();\n    viewport.addEventListener(\"resize\", update);\n    viewport.addEventListener(\"scroll\", update);\n    return () => {\n      viewport.removeEventListener(\"resize\", update);\n      viewport.removeEventListener(\"scroll\", update);\n      setVisible(false);\n    };\n  }, [isEnabled]);\n\n  return isEnabled && visible;\n};\n"],"mappings":";;;;;;;AAaA,IAAa,4BACX,sBACA,sBACA,YAAA,QACY,uBAAuB,uBAAuB;;;;;;;;;;AAW5D,IAAa,6BAA6B,YAAY,SAAkB;CACtE,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAE5C,gBAAgB;EACd,MAAM,WAAW,OAAO;EACxB,IAAI,CAAC,aAAa,CAAC,UACjB;EAEF,MAAM,eAAqB;GACzB,WAAW,yBAAyB,OAAO,aAAa,SAAS,MAAM,CAAC;EAC1E;EACA,OAAO;EACP,SAAS,iBAAiB,UAAU,MAAM;EAC1C,SAAS,iBAAiB,UAAU,MAAM;EAC1C,aAAa;GACX,SAAS,oBAAoB,UAAU,MAAM;GAC7C,SAAS,oBAAoB,UAAU,MAAM;GAC7C,WAAW,KAAK;EAClB;CACF,GAAG,CAAC,SAAS,CAAC;CAEd,OAAO,aAAa;AACtB"}

package/dist/js/packages/components/src/lib/hooks/fieldErrorRenderedContext.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { createContext } from "react";
-//#region src/lib/hooks/fieldErrorRenderedContext.ts
+// src/lib/hooks/fieldErrorRenderedContext.ts
 /**
 * Lets a rendered `FieldError` tell its field which id it has, so the field
 * references the error only while it exists. `undefined` reports that it is
@@ -10,7 +10,6 @@ import { createContext } from "react";
 * @internal
 */
 var FieldErrorRenderedContext = createContext(void 0);
-//#endregion
 export { FieldErrorRenderedContext };
 
 //# sourceMappingURL=fieldErrorRenderedContext.mjs.map

package/dist/js/packages/components/src/lib/hooks/useFieldComponent.mjs

@@ -5,7 +5,7 @@ import FormField_module_default from "../../components/FormField/FormField.modul
 import { useFieldError } from "./useFieldError.mjs";
 import "clsx";
 import { useId } from "react";
-//#region src/lib/hooks/useFieldComponent.tsx
+// src/lib/hooks/useFieldComponent.tsx
 /** Joins id references, dropping empty ones. @internal */
 var joinIds = (...ids) => ids.filter(Boolean).join(" ") || void 0;
 var useFieldComponent = (props, component) => {
@@ -35,7 +35,6 @@ var useFieldComponent = (props, component) => {
 		} : {}
 	};
 };
-//#endregion
 export { joinIds, useFieldComponent };
 
 //# sourceMappingURL=useFieldComponent.mjs.map

package/dist/js/packages/components/src/lib/hooks/useFieldError.mjs

@@ -8,7 +8,7 @@ import FormField_module_default from "../../components/FormField/FormField.modul
 import { FieldErrorRenderedContext } from "./fieldErrorRenderedContext.mjs";
 import React, { useMemo, useState } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/lib/hooks/useFieldError.tsx
+// src/lib/hooks/useFieldError.tsx
 var useFieldError = (options) => {
 	const currentTunnelId = useProps("FieldError", {}).tunnel?.id;
 	const tunnelId = options.tunnelId ?? currentTunnelId ?? `${options.fieldErrorId}.fieldError`;
@@ -55,7 +55,6 @@ var useFieldError = (options) => {
 		renderedFieldErrorId
 	};
 };
-//#endregion
 export { useFieldError };
 
 //# sourceMappingURL=useFieldError.mjs.map

package/dist/js/packages/components/src/lib/hooks/useImageSrc.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { useEffect, useState } from "react";
-//#region src/lib/hooks/useImageSrc.tsx
+// src/lib/hooks/useImageSrc.tsx
 var useImageSrc = (image) => {
 	const [src, setSrc] = useState(typeof image === "string" ? image : "");
 	useEffect(() => {
@@ -12,7 +12,6 @@ var useImageSrc = (image) => {
 	}, [image]);
 	return src;
 };
-//#endregion
 export { useImageSrc };
 
 //# sourceMappingURL=useImageSrc.mjs.map

package/dist/js/packages/components/src/lib/hooks/useIsMounted.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { useEffect, useState } from "react";
-//#region src/lib/hooks/useIsMounted.ts
+// src/lib/hooks/useIsMounted.ts
 var useIsMounted = () => {
 	const [isMounted, setIsMounted] = useState(false);
 	useEffect(() => {
@@ -9,7 +9,6 @@ var useIsMounted = () => {
 	}, []);
 	return isMounted;
 };
-//#endregion
 export { useIsMounted };
 
 //# sourceMappingURL=useIsMounted.mjs.map

package/dist/js/packages/components/src/lib/hooks/useLanguage.mjs

@@ -1,9 +1,8 @@
 "use client"
 /* */
 import { useLocale } from "react-aria";
-//#region src/lib/hooks/useLanguage.ts
+// src/lib/hooks/useLanguage.ts
 var useLanguage = () => useLocale().locale;
-//#endregion
 export { useLanguage };
 
 //# sourceMappingURL=useLanguage.mjs.map

package/dist/js/packages/components/src/lib/hooks/useOnChange.mjs

@@ -1,7 +1,7 @@
 "use client"
 /* */
 import { useEffect, useRef } from "react";
-//#region src/lib/hooks/useOnChange.ts
+// src/lib/hooks/useOnChange.ts
 var useOnChange = (value, callback, dependencies = []) => {
 	const oldValue = useRef(value);
 	useEffect(() => {
@@ -13,7 +13,6 @@ var useOnChange = (value, callback, dependencies = []) => {
 		...dependencies
 	]);
 };
-//#endregion
 export { useOnChange };
 
 //# sourceMappingURL=useOnChange.mjs.map

package/dist/js/packages/components/src/lib/hooks/useProps.mjs

@@ -8,7 +8,7 @@ import { areChildrenEmpty } from "../react/areChildrenEmpty.mjs";
 import { isNestingLevelKey } from "../propsContext/nestedPropsContext/lib.mjs";
 import { getPropsMerger } from "../react/getPropsMerger.mjs";
 import { omitBy } from "remeda";
-//#region src/lib/hooks/useProps.ts
+// src/lib/hooks/useProps.ts
 var withoutChildren = (props) => {
 	if ("children" in props) {
 		if (areChildrenEmpty(props.children)) {
@@ -25,7 +25,6 @@ var useProps = (component, localProps) => {
 	const withResolvedDynamicProps = componentPropsContext ? resolveDynamicProps(componentPropsContext, localProps) : void 0;
 	return merger(componentPropsContext ? omitBy(componentPropsContext, (value, key) => isFlowComponentName(key) || isNestingLevelKey(key) || isDynamicProp(value)) : void 0, localProps, withResolvedDynamicProps);
 };
-//#endregion
 export { useProps as default, useProps };
 
 //# sourceMappingURL=useProps.mjs.map

package/dist/js/packages/components/src/lib/hooks/useStatic.mjs

@@ -1,9 +1,8 @@
 "use client"
 /* */
 import { useState } from "react";
-//#region src/lib/hooks/useStatic.ts
+// src/lib/hooks/useStatic.ts
 var useStatic = (factory) => useState(() => factory())[0];
-//#endregion
 export { useStatic };
 
 //# sourceMappingURL=useStatic.mjs.map

package/dist/js/packages/components/src/lib/mobx/mobxMapToObject.mjs

@@ -1,9 +1,8 @@
 "use client"
 /* */
 import "mobx";
-//#region src/lib/mobx/mobxMapToObject.ts
+// src/lib/mobx/mobxMapToObject.ts
 var mobxMapToObject = (map) => Object.fromEntries(map.entries());
-//#endregion
 export { mobxMapToObject };
 
 //# sourceMappingURL=mobxMapToObject.mjs.map

package/dist/js/packages/components/src/lib/mobx/useSelector.mjs

@@ -2,7 +2,7 @@
 /* */
 import { useEffect, useState } from "react";
 import { autorun } from "mobx";
-//#region src/lib/mobx/useSelector.ts
+// src/lib/mobx/useSelector.ts
 /** Use this hook to select reactive state from the store */
 var useSelector = (select, deps = []) => {
 	const [selected, setSelected] = useState(select());
@@ -13,7 +13,6 @@ var useSelector = (select, deps = []) => {
 	}, deps);
 	return selected;
 };
-//#endregion
 export { useSelector as default, useSelector };
 
 //# sourceMappingURL=useSelector.mjs.map

package/dist/js/packages/components/src/lib/object/isPlainObjectDeepEqual.mjs

@@ -0,0 +1,28 @@
+"use client"
+/* */
+// src/lib/object/isPlainObjectDeepEqual.ts
+var isRefObject = (something) => {
+	const keys = Object.keys(something);
+	return keys.length === 1 && keys[0] === "current";
+};
+var isPlainObject = (something) => {
+	if (typeof something !== "object" || something === null || "$$typeof" in something) return false;
+	const prototype = Object.getPrototypeOf(something);
+	return (prototype === Object.prototype || prototype === null) && !isRefObject(something);
+};
+/**
+* Compares plain objects recursively and every other value by identity.
+* Functions, arrays, class instances, React elements and ref objects (`{
+* current }`) only count as equal when they are the same value, so a value
+* created during render counts as a change.
+*/
+var isPlainObjectDeepEqual = (first, second) => {
+	if (Object.is(first, second)) return true;
+	if (!isPlainObject(first) || !isPlainObject(second)) return false;
+	const firstKeys = Object.keys(first);
+	if (firstKeys.length !== Object.keys(second).length) return false;
+	return firstKeys.every((key) => Object.hasOwn(second, key) && isPlainObjectDeepEqual(first[key], second[key]));
+};
+export { isPlainObjectDeepEqual as default, isPlainObjectDeepEqual };
+
+//# sourceMappingURL=isPlainObjectDeepEqual.mjs.map

package/dist/js/packages/components/src/lib/object/isPlainObjectDeepEqual.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"isPlainObjectDeepEqual.mjs","names":[],"sources":["../../../../../../../src/lib/object/isPlainObjectDeepEqual.ts"],"sourcesContent":["const isRefObject = (something: object) => {\n  const keys = Object.keys(something);\n  return keys.length === 1 && keys[0] === \"current\";\n};\n\nconst isPlainObject = (\n  something: unknown,\n): something is Record<string, unknown> => {\n  if (\n    typeof something !== \"object\" ||\n    something === null ||\n    \"$$typeof\" in something\n  ) {\n    return false;\n  }\n  const prototype = Object.getPrototypeOf(something);\n  return (\n    (prototype === Object.prototype || prototype === null) &&\n    !isRefObject(something)\n  );\n};\n\n/**\n * Compares plain objects recursively and every other value by identity.\n * Functions, arrays, class instances, React elements and ref objects (`{\n * current }`) only count as equal when they are the same value, so a value\n * created during render counts as a change.\n */\nexport const isPlainObjectDeepEqual = (\n  first: unknown,\n  second: unknown,\n): boolean => {\n  if (Object.is(first, second)) {\n    return true;\n  }\n\n  if (!isPlainObject(first) || !isPlainObject(second)) {\n    return false;\n  }\n\n  const firstKeys = Object.keys(first);\n\n  if (firstKeys.length !== Object.keys(second).length) {\n    return false;\n  }\n\n  return firstKeys.every(\n    (key) =>\n      Object.hasOwn(second, key) &&\n      isPlainObjectDeepEqual(first[key], second[key]),\n  );\n};\n\nexport default isPlainObjectDeepEqual;\n"],"mappings":";;;AAAA,IAAM,eAAe,cAAsB;CACzC,MAAM,OAAO,OAAO,KAAK,SAAS;CAClC,OAAO,KAAK,WAAW,KAAK,KAAK,OAAO;AAC1C;AAEA,IAAM,iBACJ,cACyC;CACzC,IACE,OAAO,cAAc,YACrB,cAAc,QACd,cAAc,WAEd,OAAO;CAET,MAAM,YAAY,OAAO,eAAe,SAAS;CACjD,QACG,cAAc,OAAO,aAAa,cAAc,SACjD,CAAC,YAAY,SAAS;AAE1B;;;;;;;AAQA,IAAa,0BACX,OACA,WACY;CACZ,IAAI,OAAO,GAAG,OAAO,MAAM,GACzB,OAAO;CAGT,IAAI,CAAC,cAAc,KAAK,KAAK,CAAC,cAAc,MAAM,GAChD,OAAO;CAGT,MAAM,YAAY,OAAO,KAAK,KAAK;CAEnC,IAAI,UAAU,WAAW,OAAO,KAAK,MAAM,CAAC,CAAC,QAC3C,OAAO;CAGT,OAAO,UAAU,OACd,QACC,OAAO,OAAO,QAAQ,GAAG,KACzB,uBAAuB,MAAM,MAAM,OAAO,IAAI,CAClD;AACF"}

package/dist/js/packages/components/src/lib/promises/callFunctionsInOrder.mjs

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/lib/promises/callFunctionsInOrder.ts
+// src/lib/promises/callFunctionsInOrder.ts
 var callFunctionsInOrder = (actions) => (...args) => {
 	const actionsCopy = [...actions];
 	const action = actionsCopy.shift();
@@ -14,7 +14,6 @@ var callFunctionsInOrder = (actions) => (...args) => {
 		else return recurse();
 	}
 };
-//#endregion
 export { callFunctionsInOrder };
 
 //# sourceMappingURL=callFunctionsInOrder.mjs.map

package/dist/js/packages/components/src/lib/propsContext/components/ClearPropsContext.mjs

@@ -3,16 +3,16 @@
 import { PropsContextProvider } from "../propsContext.mjs";
 import "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/lib/propsContext/components/ClearPropsContext.tsx
+// src/lib/propsContext/components/ClearPropsContext.tsx
+var emptyPropsContext = {};
 /** @flr-generate all */
 var ClearPropsContext = (props) => {
 	const { children } = props;
 	return /* @__PURE__ */ jsx(PropsContextProvider, {
-		value: {},
+		value: emptyPropsContext,
 		children
 	});
 };
-//#endregion
 export { ClearPropsContext, ClearPropsContext as default };
 
 //# sourceMappingURL=ClearPropsContext.mjs.map

package/dist/js/packages/components/src/lib/propsContext/components/ClearPropsContext.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ClearPropsContext.mjs","names":[],"sources":["../../../../../../../../src/lib/propsContext/components/ClearPropsContext.tsx"],"sourcesContent":["import { PropsContextProvider } from \"@/lib/propsContext/propsContext\";\nimport { type FC, type PropsWithChildren } from \"react\";\n\nexport type ClearPropsContextProps = PropsWithChildren;\n\n/** @flr-generate all */\nexport const ClearPropsContext: FC<PropsWithChildren> = (props) => {\n  const { children } = props;\n  return <PropsContextProvider value={{}}>{children}</PropsContextProvider>;\n};\n\nexport default ClearPropsContext;\n"],"mappings":";;;;;;;AAMA,IAAa,qBAA4C,UAAU;CACjE,MAAM,EAAE,aAAa;CACrB,OAAO,oBAAC,sBAAD;EAAsB,OAAO,CAAC;EAAI;CAA+B,CAAA;AAC1E"}
+{"version":3,"file":"ClearPropsContext.mjs","names":[],"sources":["../../../../../../../../src/lib/propsContext/components/ClearPropsContext.tsx"],"sourcesContent":["import { PropsContextProvider } from \"@/lib/propsContext/propsContext\";\nimport { type FC, type PropsWithChildren } from \"react\";\n\nexport type ClearPropsContextProps = PropsWithChildren;\n\nconst emptyPropsContext = {};\n\n/** @flr-generate all */\nexport const ClearPropsContext: FC<PropsWithChildren> = (props) => {\n  const { children } = props;\n  return (\n    <PropsContextProvider value={emptyPropsContext}>\n      {children}\n    </PropsContextProvider>\n  );\n};\n\nexport default ClearPropsContext;\n"],"mappings":";;;;;;AAKA,IAAM,oBAAoB,CAAC;;AAG3B,IAAa,qBAA4C,UAAU;CACjE,MAAM,EAAE,aAAa;CACrB,OACE,oBAAC,sBAAD;EAAsB,OAAO;EAC1B;CACmB,CAAA;AAE1B"}

package/dist/js/packages/components/src/lib/propsContext/components/ComponentPropsContextProvider.mjs

@@ -3,7 +3,7 @@
 import { PropsContextProvider } from "./PropsContextProvider.mjs";
 import { memo } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/lib/propsContext/components/ComponentPropsContextProvider.tsx
+// src/lib/propsContext/components/ComponentPropsContextProvider.tsx
 /**
 * @flr-generate all
 * @flr-ignore-props componentProps
@@ -16,7 +16,6 @@ var ComponentPropsContextProvider = memo((props) => {
 	});
 });
 ComponentPropsContextProvider.displayName = "ComponentPropsContextProvider";
-//#endregion
 export { ComponentPropsContextProvider };
 
 //# sourceMappingURL=ComponentPropsContextProvider.mjs.map

package/dist/js/packages/components/src/lib/propsContext/components/PropsContextProvider.mjs

@@ -3,25 +3,35 @@
 import { propsContext, usePropsContext } from "../propsContext.mjs";
 import { addNestingLevel } from "../nestedPropsContext/lib.mjs";
 import mergePropsContext from "../mergePropsContext.mjs";
-import { memo, useMemo } from "react";
+import isPlainObjectDeepEqual from "../../object/isPlainObjectDeepEqual.mjs";
+import { memo, useMemo, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/lib/propsContext/components/PropsContextProvider.tsx
+// src/lib/propsContext/components/PropsContextProvider.tsx
 var Provider = memo(propsContext.Provider);
 Provider.displayName = "PropsContextProviderInner";
+var useStablePropsContext = (props) => {
+	const stableProps = useRef(props);
+	if (!isPlainObjectDeepEqual(stableProps.current, props)) stableProps.current = props;
+	return stableProps.current;
+};
 var PropsContextProvider = memo((props) => {
 	const { props: providedProps, dependencies = [], children } = props;
 	const parentPropsContext = usePropsContext();
+	const stableProvidedProps = useStablePropsContext(providedProps);
 	const propsWithParentPropsContext = useMemo(() => {
-		const propsWithNestingLevel = addNestingLevel(providedProps);
+		const propsWithNestingLevel = addNestingLevel(stableProvidedProps);
 		return mergePropsContext(parentPropsContext, propsWithNestingLevel);
-	}, [parentPropsContext, ...dependencies]);
+	}, [
+		parentPropsContext,
+		stableProvidedProps,
+		...dependencies
+	]);
 	return /* @__PURE__ */ jsx(Provider, {
 		value: propsWithParentPropsContext,
 		children
 	});
 });
 PropsContextProvider.displayName = "PropsContextProvider";
-//#endregion
 export { PropsContextProvider, PropsContextProvider as default };
 
 //# sourceMappingURL=PropsContextProvider.mjs.map

package/dist/js/packages/components/src/lib/propsContext/components/PropsContextProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PropsContextProvider.mjs","names":[],"sources":["../../../../../../../../src/lib/propsContext/components/PropsContextProvider.tsx"],"sourcesContent":["import mergePropsContext from \"@/lib/propsContext/mergePropsContext\";\nimport { addNestingLevel } from \"@/lib/propsContext/nestedPropsContext/lib\";\nimport { propsContext, usePropsContext } from \"@/lib/propsContext/propsContext\";\nimport type { PropsContext as PropsContextShape } from \"@/lib/propsContext/types\";\nimport type { DependencyList, FC, PropsWithChildren } from \"react\";\nimport { memo, useMemo } from \"react\";\n\ninterface Props extends PropsWithChildren {\n  props: PropsContextShape;\n  dependencies?: DependencyList;\n}\n\nconst Provider = memo(propsContext.Provider);\nProvider.displayName = \"PropsContextProviderInner\";\n\nexport const PropsContextProvider: FC<Props> = memo((props) => {\n  const { props: providedProps, dependencies = [], children } = props;\n\n  const parentPropsContext = usePropsContext();\n\n  const propsWithParentPropsContext = useMemo(() => {\n    const propsWithNestingLevel = addNestingLevel(providedProps);\n    return mergePropsContext(parentPropsContext, propsWithNestingLevel);\n  }, [parentPropsContext, ...dependencies]);\n\n  return <Provider value={propsWithParentPropsContext}>{children}</Provider>;\n});\n\nPropsContextProvider.displayName = \"PropsContextProvider\";\n\nexport default PropsContextProvider;\n"],"mappings":";;;;;;;;AAYA,IAAM,WAAW,KAAK,aAAa,QAAQ;AAC3C,SAAS,cAAc;AAEvB,IAAa,uBAAkC,MAAM,UAAU;CAC7D,MAAM,EAAE,OAAO,eAAe,eAAe,CAAC,GAAG,aAAa;CAE9D,MAAM,qBAAqB,gBAAgB;CAE3C,MAAM,8BAA8B,cAAc;EAChD,MAAM,wBAAwB,gBAAgB,aAAa;EAC3D,OAAO,kBAAkB,oBAAoB,qBAAqB;CACpE,GAAG,CAAC,oBAAoB,GAAG,YAAY,CAAC;CAExC,OAAO,oBAAC,UAAD;EAAU,OAAO;EAA8B;CAAmB,CAAA;AAC3E,CAAC;AAED,qBAAqB,cAAc"}
+{"version":3,"file":"PropsContextProvider.mjs","names":[],"sources":["../../../../../../../../src/lib/propsContext/components/PropsContextProvider.tsx"],"sourcesContent":["import mergePropsContext from \"@/lib/propsContext/mergePropsContext\";\nimport { addNestingLevel } from \"@/lib/propsContext/nestedPropsContext/lib\";\nimport { propsContext, usePropsContext } from \"@/lib/propsContext/propsContext\";\nimport { isPlainObjectDeepEqual } from \"@/lib/object/isPlainObjectDeepEqual\";\nimport type { PropsContext as PropsContextShape } from \"@/lib/propsContext/types\";\nimport type { DependencyList, FC, PropsWithChildren } from \"react\";\nimport { memo, useMemo, useRef } from \"react\";\n\ninterface Props extends PropsWithChildren {\n  props: PropsContextShape;\n  dependencies?: DependencyList;\n}\n\nconst Provider = memo(propsContext.Provider);\nProvider.displayName = \"PropsContextProviderInner\";\n\nconst useStablePropsContext = (props: PropsContextShape) => {\n  const stableProps = useRef(props);\n  if (!isPlainObjectDeepEqual(stableProps.current, props)) {\n    stableProps.current = props;\n  }\n  return stableProps.current;\n};\n\nexport const PropsContextProvider: FC<Props> = memo((props) => {\n  const { props: providedProps, dependencies = [], children } = props;\n\n  const parentPropsContext = usePropsContext();\n  const stableProvidedProps = useStablePropsContext(providedProps);\n\n  const propsWithParentPropsContext = useMemo(() => {\n    const propsWithNestingLevel = addNestingLevel(stableProvidedProps);\n    return mergePropsContext(parentPropsContext, propsWithNestingLevel);\n  }, [parentPropsContext, stableProvidedProps, ...dependencies]);\n\n  return <Provider value={propsWithParentPropsContext}>{children}</Provider>;\n});\n\nPropsContextProvider.displayName = \"PropsContextProvider\";\n\nexport default PropsContextProvider;\n"],"mappings":";;;;;;;;;AAaA,IAAM,WAAW,KAAK,aAAa,QAAQ;AAC3C,SAAS,cAAc;AAEvB,IAAM,yBAAyB,UAA6B;CAC1D,MAAM,cAAc,OAAO,KAAK;CAChC,IAAI,CAAC,uBAAuB,YAAY,SAAS,KAAK,GACpD,YAAY,UAAU;CAExB,OAAO,YAAY;AACrB;AAEA,IAAa,uBAAkC,MAAM,UAAU;CAC7D,MAAM,EAAE,OAAO,eAAe,eAAe,CAAC,GAAG,aAAa;CAE9D,MAAM,qBAAqB,gBAAgB;CAC3C,MAAM,sBAAsB,sBAAsB,aAAa;CAE/D,MAAM,8BAA8B,cAAc;EAChD,MAAM,wBAAwB,gBAAgB,mBAAmB;EACjE,OAAO,kBAAkB,oBAAoB,qBAAqB;CACpE,GAAG;EAAC;EAAoB;EAAqB,GAAG;CAAY,CAAC;CAE7D,OAAO,oBAAC,UAAD;EAAU,OAAO;EAA8B;CAAmB,CAAA;AAC3E,CAAC;AAED,qBAAqB,cAAc"}

package/dist/js/packages/components/src/lib/propsContext/dynamicProps/dynamic.mjs

@@ -1,9 +1,8 @@
 "use client"
 /* */
 import { dynamicPropKey } from "./types.mjs";
-//#region src/lib/propsContext/dynamicProps/dynamic.ts
+// src/lib/propsContext/dynamicProps/dynamic.ts
 var dynamic = (getDynamicProp) => ({ [dynamicPropKey]: getDynamicProp });
-//#endregion
 export { dynamic as default, dynamic };
 
 //# sourceMappingURL=dynamic.mjs.map

package/dist/js/packages/components/src/lib/propsContext/dynamicProps/lib.mjs

@@ -1,11 +1,10 @@
 "use client"
 /* */
 import "./types.mjs";
-//#region src/lib/propsContext/dynamicProps/lib.ts
+// src/lib/propsContext/dynamicProps/lib.ts
 function isDynamicProp(something) {
 	return !!something && typeof something === "object" && "___dynamicProp" in something;
 }
-//#endregion
 export { isDynamicProp as default, isDynamicProp };
 
 //# sourceMappingURL=lib.mjs.map

package/dist/js/packages/components/src/lib/propsContext/dynamicProps/resolveDynamicProps.mjs

@@ -3,7 +3,7 @@
 import { dynamicPropKey } from "./types.mjs";
 import isDynamicProp from "./lib.mjs";
 import { isFlowComponentProp } from "../isFlowComponentProp.mjs";
-//#region src/lib/propsContext/dynamicProps/resolveDynamicProps.ts
+// src/lib/propsContext/dynamicProps/resolveDynamicProps.ts
 var resolveDynamicProps = (contextProps, localProps) => {
 	const resolved = {};
 	for (const prop in contextProps) if (isFlowComponentProp(prop)) {
@@ -12,7 +12,6 @@ var resolveDynamicProps = (contextProps, localProps) => {
 	}
 	return resolved;
 };
-//#endregion
 export { resolveDynamicProps as default, resolveDynamicProps };
 
 //# sourceMappingURL=resolveDynamicProps.mjs.map

package/dist/js/packages/components/src/lib/propsContext/dynamicProps/types.mjs

@@ -1,8 +1,7 @@
 "use client"
 /* */
-//#region src/lib/propsContext/dynamicProps/types.ts
+// src/lib/propsContext/dynamicProps/types.ts
 var dynamicPropKey = "___dynamicProp";
-//#endregion
 export { dynamicPropKey };
 
 //# sourceMappingURL=types.mjs.map

package/dist/js/packages/components/src/lib/propsContext/isFlowComponentName.mjs

@@ -1,11 +1,10 @@
 "use client"
 /* */
 import { propsContextSupportingComponents } from "../../components/propTypes/index.mjs";
-//#region src/lib/propsContext/isFlowComponentName.ts
+// src/lib/propsContext/isFlowComponentName.ts
 function isFlowComponentName(something) {
 	return typeof something === "string" && propsContextSupportingComponents.includes(something);
 }
-//#endregion
 export { isFlowComponentName };
 
 //# sourceMappingURL=isFlowComponentName.mjs.map

package/dist/js/packages/components/src/lib/propsContext/isFlowComponentProp.mjs

@@ -1,11 +1,10 @@
 "use client"
 /* */
 import { isFlowComponentName } from "./isFlowComponentName.mjs";
-//#region src/lib/propsContext/isFlowComponentProp.ts
+// src/lib/propsContext/isFlowComponentProp.ts
 function isFlowComponentProp(something) {
 	return !isFlowComponentName(something);
 }
-//#endregion
 export { isFlowComponentProp };
 
 //# sourceMappingURL=isFlowComponentProp.mjs.map

package/dist/js/packages/components/src/lib/propsContext/mergePropsContext.mjs

@@ -2,7 +2,7 @@
 /* */
 import { isFlowComponentName } from "./isFlowComponentName.mjs";
 import { getPropsMerger } from "../react/getPropsMerger.mjs";
-//#region src/lib/propsContext/mergePropsContext.ts
+// src/lib/propsContext/mergePropsContext.ts
 var merger = getPropsMerger({
 	mergeClassNames: false,
 	mergeEventHandler: true
@@ -14,7 +14,6 @@ var mergePropsContext = (firstContext = {}, secondContext = {}) => {
 	}).filter(isFlowComponentName);
 	return Object.fromEntries(mergedComponentNames.map((componentName) => [componentName, merger(firstContext[componentName], secondContext[componentName])]));
 };
-//#endregion
 export { mergePropsContext as default, mergePropsContext };
 
 //# sourceMappingURL=mergePropsContext.mjs.map

package/dist/js/packages/components/src/lib/propsContext/nestedPropsContext/lib.mjs

@@ -2,7 +2,7 @@
 /* */
 import { isFlowComponentName } from "../isFlowComponentName.mjs";
 import { nestingLevelKey } from "./types.mjs";
-//#region src/lib/propsContext/nestedPropsContext/lib.ts
+// src/lib/propsContext/nestedPropsContext/lib.ts
 function isNestingProps(propsContext) {
 	return !!propsContext && typeof propsContext === "object" && "___nestingLevel" in propsContext && typeof propsContext["___nestingLevel"] === "number";
 }
@@ -20,7 +20,6 @@ var addNestingLevel = (propsContext, currentLevel = 0) => {
 	};
 	return withNestingLevel;
 };
-//#endregion
 export { addNestingLevel, getNestingLevel, isNestingLevelKey, isNestingProps };
 
 //# sourceMappingURL=lib.mjs.map

package/dist/js/packages/components/src/lib/propsContext/nestedPropsContext/types.mjs

@@ -1,8 +1,7 @@
 "use client"
 /* */
-//#region src/lib/propsContext/nestedPropsContext/types.ts
+// src/lib/propsContext/nestedPropsContext/types.ts
 var nestingLevelKey = "___nestingLevel";
-//#endregion
 export { nestingLevelKey };
 
 //# sourceMappingURL=types.mjs.map

package/dist/js/packages/components/src/lib/propsContext/overlayTriggerTunnel.mjs

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/lib/propsContext/overlayTriggerTunnel.ts
+// src/lib/propsContext/overlayTriggerTunnel.ts
 /**
 * Props context entries that send every overlay trigger into `tunnel`.
 *
@@ -28,7 +28,6 @@ var overlayTriggersTunneledTo = (tunnel) => ({
 	ModalTrigger: { tunnel },
 	PopoverTrigger: { tunnel }
 });
-//#endregion
 export { overlayTriggersTunneledTo as default, overlayTriggersTunneledTo };
 
 //# sourceMappingURL=overlayTriggerTunnel.mjs.map

package/dist/js/packages/components/src/lib/propsContext/propsContext.mjs

@@ -1,12 +1,11 @@
 "use client"
 /* */
 import { createContext, useContext } from "react";
-//#region src/lib/propsContext/propsContext.ts
+// src/lib/propsContext/propsContext.ts
 var propsContext = createContext({});
 var PropsContextProvider = propsContext.Provider;
 var usePropsContext = () => useContext(propsContext);
 var useComponentPropsContext = (component) => usePropsContext()[component];
-//#endregion
 export { PropsContextProvider, propsContext, useComponentPropsContext, usePropsContext };
 
 //# sourceMappingURL=propsContext.mjs.map

package/dist/js/packages/components/src/lib/react/areChildrenEmpty.mjs

@@ -1,13 +1,12 @@
 "use client"
 /* */
-//#region src/lib/react/areChildrenEmpty.ts
+// src/lib/react/areChildrenEmpty.ts
 var isNullish = (children) => children === null || children === void 0 || children === false;
 var areChildrenEmpty = (children) => {
 	if (isNullish(children)) return true;
 	if (Array.isArray(children)) return children.length === 0 || children.every(isNullish);
 	return false;
 };
-//#endregion
 export { areChildrenEmpty };
 
 //# sourceMappingURL=areChildrenEmpty.mjs.map

package/dist/js/packages/components/src/lib/react/cloneElement.mjs

@@ -2,13 +2,12 @@
 /* */
 import { isRemoteComponentRendererProps } from "./remote.mjs";
 import React from "react";
-//#region src/lib/react/cloneElement.ts
+// src/lib/react/cloneElement.ts
 var cloneElement$1 = (element, props) => {
 	const existingProps = element.props;
 	if (isRemoteComponentRendererProps(existingProps)) Object.assign(existingProps.element.properties, props);
 	return React.cloneElement(element, props);
 };
-//#endregion
 export { cloneElement$1 as cloneElement };
 
 //# sourceMappingURL=cloneElement.mjs.map

package/dist/js/packages/components/src/lib/react/components/Render/Render.mjs

@@ -1,9 +1,8 @@
 "use client"
 /* */
 import { Fragment, jsx } from "react/jsx-runtime";
-//#region src/lib/react/components/Render/Render.tsx
+// src/lib/react/components/Render/Render.tsx
 var Render = (props) => /* @__PURE__ */ jsx(Fragment, { children: props.children() ?? null });
-//#endregion
 export { Render };
 
 //# sourceMappingURL=Render.mjs.map

package/dist/js/packages/components/src/lib/react/deepFindOfType.mjs

@@ -2,7 +2,7 @@
 /* */
 import { isValidElement } from "react";
 import { deepFind, deepForEach } from "react-children-utilities";
-//#region src/lib/react/deepFindOfType.ts
+// src/lib/react/deepFindOfType.ts
 var isOfType = (c, searchType) => {
 	if (!isValidElement(c)) return false;
 	if (typeof searchType === "string") {
@@ -19,7 +19,6 @@ var deepFilterByType = (children, searchType) => {
 	});
 	return result;
 };
-//#endregion
 export { deepFilterByType, deepFindOfType };
 
 //# sourceMappingURL=deepFindOfType.mjs.map

package/dist/js/packages/components/src/lib/react/emitElementValueChange.mjs

@@ -1,6 +1,6 @@
 "use client"
 /* */
-//#region src/lib/react/emitElementValueChange.ts
+// src/lib/react/emitElementValueChange.ts
 /**
 * Triggers a Value Update for an Element that also fires the React onChange
 * routine
@@ -17,7 +17,6 @@ var emitElementValueChange = (element, value) => {
 		} else throw Error("could not emit value update for element", { cause: error });
 	}
 };
-//#endregion
 export { emitElementValueChange };
 
 //# sourceMappingURL=emitElementValueChange.mjs.map