@factorialco/f0-react 14.1.0 → 14.2.0

package/dist/component-status.js

@@ -4,7 +4,7 @@ import { useCallback as i, useEffect as a, useRef as o, useState as s } from "re
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region \0virtual:f0-component-status-data
 var u = {
-	generatedAt: "2026-11-10T16:19:58.378Z",
+	generatedAt: "2026-11-11T08:52:17.529Z",
 	stats: {
 		total: 313,
 		byStatus: {
@@ -1083,7 +1083,7 @@ var u = {
 				hasWhenToUse: !0,
 				hasWhenNotToUse: !0,
 				hasDoDonts: !0,
-				exampleCount: 5
+				exampleCount: 6
 			},
 			a11yTier: "enforced",
 			storyFile: "elements/F0Resizable/__stories__/F0Resizable.stories.tsx"

package/dist/experimental.d.ts

@@ -750,6 +750,8 @@ type ResizableDirection = (typeof resizableDirections)[number];
 interface F0ResizableProps {
   direction?: ResizableDirection;
   children: ReactNode;
+  initialSize?: number;
+  onSizeChange?: (size: number) => void;
 }
 interface F0ResizablePanelProps {
   children: ReactNode;
@@ -774,7 +776,7 @@ declare namespace F0ResizablePanel {
 }
 //#endregion
 //#region src/elements/F0Resizable/F0Resizable.d.ts
-declare const F0ResizableComponent: ({ direction, children }: F0ResizableProps) => import("react").JSX.Element;
+declare const F0ResizableComponent: ({ direction, children, initialSize, onSizeChange }: F0ResizableProps) => import("react").JSX.Element;
 export declare const F0Resizable: import("react").ForwardRefExoticComponent<F0ResizableProps & WithDataTestIdProps & import("react").RefAttributes<unknown>> & Pick<typeof F0ResizableComponent, never> & {
   Panel: typeof F0ResizablePanel;
   Handle: typeof F0ResizableHandle;

package/dist/experimental.js

@@ -2380,53 +2380,55 @@ var Tp = 30, Ep = 50, Dp = (e, t, n) => Math.min(Math.max(e, t), n), Op = (e) =>
 		max: r,
 		defaultSize: Dp(i, n, r)
 	};
-}, Mp = Object.assign(Sn(En("F0Resizable", ({ direction: e = "horizontal", children: t }) => {
-	let n = R(), r = Y(null), i = Y(null), a = Wn({ ref: r }), o = Op(t), [s, c, l] = o;
-	if (o.length !== 3 || !kp(s) || !Ap(c) || !kp(l)) throw Error("F0Resizable: children must be exactly F0Resizable.Panel, F0Resizable.Handle and F0Resizable.Panel, in this order.");
-	let u = s.props, d = l.props, f = c.props, { min: p, max: m, defaultSize: h } = jp(u, d), g = e === "horizontal", _ = (g ? a.width : a.height) ?? 0, [v, y] = X(h), b = Dp(v, p, m), x = (e) => Math.round(_ * e / 100), S = G((e) => _ > 0 ? Dp(e / _ * 100, p, m) : b, [
-		b,
-		_,
-		m,
-		p
-	]), C = G((e) => {
-		i.current?.style.setProperty("flex-basis", `${S(e)}%`);
-	}, [S]);
+}, Mp = Object.assign(Sn(En("F0Resizable", ({ direction: e = "horizontal", children: t, initialSize: n, onSizeChange: r }) => {
+	let i = R(), a = Y(null), o = Y(null), s = Wn({ ref: a }), c = Op(t), [l, u, d] = c;
+	if (c.length !== 3 || !kp(l) || !Ap(u) || !kp(d)) throw Error("F0Resizable: children must be exactly F0Resizable.Panel, F0Resizable.Handle and F0Resizable.Panel, in this order.");
+	let f = l.props, p = d.props, m = u.props, { min: h, max: g, defaultSize: _ } = jp(f, p), v = e === "horizontal", y = (v ? s.width : s.height) ?? 0, [b, x] = X(() => n !== void 0 && Number.isFinite(n) ? n : _), S = Dp(b, h, g), C = (e) => Math.round(y * e / 100), w = G((e) => y > 0 ? Dp(e / y * 100, h, g) : S, [
+		S,
+		y,
+		g,
+		h
+	]), T = G((e) => {
+		o.current?.style.setProperty("flex-basis", `${w(e)}%`);
+	}, [w]), E = (e) => {
+		x(e), r?.(e);
+	};
 	return /* @__PURE__ */ $(Ss, {
-		ref: r,
+		ref: a,
 		display: "flex",
-		flexDirection: g ? "row" : "column",
+		flexDirection: v ? "row" : "column",
 		width: "full",
 		height: "full",
 		minHeight: "0",
 		children: [
 			/* @__PURE__ */ Q("div", {
-				ref: i,
-				className: B("min-h-0 min-w-0 shrink-0 overflow-y-auto overflow-x-hidden", g ? "h-full" : "w-full"),
-				style: { flexBasis: `${b}%` },
-				children: u.children
+				ref: o,
+				className: B("min-h-0 min-w-0 shrink-0 overflow-y-auto overflow-x-hidden", v ? "h-full" : "w-full"),
+				style: { flexBasis: `${S}%` },
+				children: f.children
 			}),
 			/* @__PURE__ */ Q(Sp, {
-				value: x(b),
-				min: x(p),
-				max: x(m),
-				growsTowards: g ? "right" : "down",
-				ariaLabel: f.ariaLabel ?? n.resizable.resize,
-				valueText: n.t("resizable.size", { size: Math.round(b) }),
+				value: C(S),
+				min: C(h),
+				max: C(g),
+				growsTowards: v ? "right" : "down",
+				ariaLabel: m.ariaLabel ?? i.resizable.resize,
+				valueText: i.t("resizable.size", { size: Math.round(S) }),
 				divider: !0,
 				grip: !0,
-				onPreview: C,
-				onCommit: (e) => y(S(e)),
-				onReset: () => y(h)
+				onPreview: T,
+				onCommit: (e) => E(w(e)),
+				onReset: () => E(_)
 			}),
 			/* @__PURE__ */ Q(Ss, {
 				grow: !0,
 				minWidth: "0",
 				minHeight: "0",
-				width: g ? void 0 : "full",
-				height: g ? "full" : void 0,
+				width: v ? void 0 : "full",
+				height: v ? "full" : void 0,
 				overflowY: "auto",
 				overflowX: "hidden",
-				children: d.children
+				children: p.children
 			})
 		]
 	});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@factorialco/f0-react",
-  "version": "14.1.0",
+  "version": "14.2.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/factorialco/f0.git",