fiboui 2.9.4 → 2.9.5

package/dist/{index-DYFx4V14.js → index-T8F37_p4.js}

@@ -2,10 +2,10 @@ var nt = Object.defineProperty;
 var et = (n, i, t) => i in n ? nt(n, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[i] = t;
 var d = (n, i, t) => et(n, typeof i != "symbol" ? i + "" : i, t);
 import h from "react";
-import { b2 as T, b3 as B, b7 as $, b6 as m, b9 as z, bu as _, bv as E, bw as b, bx as rt, bd as ot, by as st, bz as lt } from "./client-lzMYg4vy.js";
+import { b2 as T, b3 as B, b7 as $, b6 as m, b9 as A, bv as _, bw as E, bx as b, by as rt, be as ot, bz as st, bA as lt } from "./client-Cc87LXic.js";
 function at(n, i) {
   if (!(typeof i != "string" || !m(i)))
-    for (const t of z(i))
+    for (const t of A(i))
       n.bindSignal(t);
 }
 function L(n, i) {
@@ -68,7 +68,7 @@ class ut extends B {
 const qt = T(ut);
 function pt(n, i) {
   if (!(typeof i != "string" || !m(i)))
-    for (const t of z(i))
+    for (const t of A(i))
       n.bindSignal(t);
 }
 function N(n, i) {
@@ -127,7 +127,7 @@ function _t(n) {
   const i = n.trim().toLowerCase();
   return !bt.test(i) || yt.has(i) ? "div" : i;
 }
-function A(n, i) {
+function z(n, i) {
   const t = `fibo-${i}-`;
   return n.some((e) => e.startsWith(t));
 }
@@ -163,18 +163,18 @@ function wt(n, i) {
   t.paddingLeft = v(t.paddingLeft, "left"), t.paddingRight = v(t.paddingRight, "right"), e && (t.paddingTop = v(t.paddingTop, "top")), r && (t.paddingBottom = v(t.paddingBottom, "bottom"));
 }
 function vt(n, i, t, e) {
-  const r = n, o = r.width != null || e.has("width") || A(t, "width");
+  const r = n, o = r.width != null || e.has("width") || z(t, "width");
   if (i) {
     o || (r.width = "auto");
     return;
   }
   o || (r.width = "100%");
-  const s = r.margin != null && r.margin !== "", l = s || r.marginLeft != null || r.marginInlineStart != null || e.has("margin-left") || A(t, "margin-left"), a = s || r.marginRight != null || r.marginInlineEnd != null || e.has("margin-right") || A(t, "margin-right");
+  const s = r.margin != null && r.margin !== "", l = s || r.marginLeft != null || r.marginInlineStart != null || e.has("margin-left") || z(t, "margin-left"), a = s || r.marginRight != null || r.marginInlineEnd != null || e.has("margin-right") || z(t, "margin-right");
   l || (r.marginLeft = "auto"), a || (r.marginRight = "auto");
 }
 function Ct(n, i, t, e, r, o, s) {
   const l = i ? rt({ ...n, ...i }) : { ...n }, a = St(l, o);
-  return !(a.maxWidth != null || A(r, "max-width") || o.has("max-width")) && t != null && t !== "" && (a.maxWidth = _("maxWidth", t)), vt(a, e, r, o), wt(a, s), a;
+  return !(a.maxWidth != null || z(r, "max-width") || o.has("max-width")) && t != null && t !== "" && (a.maxWidth = _("maxWidth", t)), vt(a, e, r, o), wt(a, s), a;
 }
 class Tt extends B {
   constructor() {
@@ -278,7 +278,7 @@ function M(n) {
 }
 function Bt(n, i) {
   if (!(typeof i != "string" || !m(i)))
-    for (const t of z(i))
+    for (const t of A(i))
       n.bindSignal(t);
 }
 function I(n, i) {
@@ -299,11 +299,11 @@ function I(n, i) {
 function $t(n) {
   return typeof n == "string" && m(n) ? $(n) : n;
 }
-function zt(n, i) {
+function At(n, i) {
   const { children: t, ...e } = i, r = t !== void 0 ? t : n;
   return { nodes: r == null ? [] : Array.isArray(r) ? r : [r], rest: e };
 }
-function At(n, i, t) {
+function zt(n, i, t) {
   if (n == null || typeof n == "boolean") return null;
   const e = i === 0, r = st(t);
   return e ? h.createElement(
@@ -403,7 +403,7 @@ class Lt extends B {
       ...this._classNames
     ], r = this.getStyle();
     r.overflow == null && (r.overflow = "hidden"), this._baseFixedFrame ? (r.width == null && (r.width = `${this._baseFixedFrame.width}px`), r.height == null && (r.height = `${this._baseFixedFrame.height}px`)) : t && r.height == null && r.minHeight == null && (r.height = "fit-content");
-    const { nodes: o, rest: s } = zt(this.processChildren(), this._props), { className: l, ...a } = s, f = [...e, l].filter(Boolean).join(" "), g = o.map($t).map((p, c) => At(p, c, this._alignment));
+    const { nodes: o, rest: s } = At(this.processChildren(), this._props), { className: l, ...a } = s, f = [...e, l].filter(Boolean).join(" "), g = o.map($t).map((p, c) => zt(p, c, this._alignment));
     return h.createElement(
       "div",
       {
@@ -418,7 +418,7 @@ class Lt extends B {
 const Jt = T(Lt);
 function Nt(n, i) {
   if (!(typeof i != "string" || !m(i)))
-    for (const t of z(i))
+    for (const t of A(i))
       n.bindSignal(t);
 }
 function H(n, i) {
@@ -594,7 +594,7 @@ function X(n) {
 }
 function jt(n, i) {
   if (!(typeof i != "string" || !m(i)))
-    for (const t of z(i))
+    for (const t of A(i))
       n.bindSignal(t);
 }
 function R(n, i) {

package/dist/index.d.ts

@@ -1726,6 +1726,34 @@ export declare function applyEdgeSet(set: EdgeSet, value: number | string): {
 	bottom?: number | string;
 	left?: number | string;
 };
+/**
+ * SwiftUI `Material` — glass fills for `.material(Material.ultraThin)`.
+ * Light translucent defaults; pair with `.theme('noir')` / dark bg as needed.
+ */
+export declare const Material: {
+	readonly ultraThin: {
+		readonly blur: 20;
+		readonly background: "rgba(255, 255, 255, 0.35)";
+	};
+	readonly thin: {
+		readonly blur: 28;
+		readonly background: "rgba(255, 255, 255, 0.48)";
+	};
+	readonly regular: {
+		readonly blur: 36;
+		readonly background: "rgba(255, 255, 255, 0.62)";
+	};
+	readonly thick: {
+		readonly blur: 48;
+		readonly background: "rgba(255, 255, 255, 0.78)";
+	};
+	readonly ultraThick: {
+		readonly blur: 60;
+		readonly background: "rgba(255, 255, 255, 0.88)";
+	};
+};
+export type MaterialKind = keyof typeof Material;
+export type MaterialSpec = (typeof Material)[MaterialKind];
 export type SafeAreaInsetEdge = Edge | "top" | "bottom" | "leading" | "trailing" | "left" | "right";
 export type SafeAreaInsetSpec = {
 	edge: SafeAreaInsetEdge;
@@ -2239,6 +2267,16 @@ declare abstract class FiboBuilder {
 	text(color: string | Colors): this;
 	color(value: string | Colors): this;
 	private resolveSemanticColor;
+	/**
+	 * Backdrop blur (glass). Prefer over raw `.backdropFilter('blur(…)')`.
+	 * `20` → `blur(20px)`; also accepts `'20px'` or a full `blur(…)` string.
+	 */
+	backdropBlur(radius?: number | string): this;
+	/**
+	 * SwiftUI `Material` glass fill — blur + translucent background.
+	 * `Box().material(Material.ultraThin)` or `.material('regular')`.
+	 */
+	material(kind: MaterialKind | MaterialSpec): this;
 	shadow(config?: ShadowConfig): this;
 	/**
 	 * Breakpoint styles compiled to CSS `@media` (same engine as `.md()`).
@@ -3055,6 +3093,11 @@ declare class ColumnBuilder extends FiboBuilder {
 	alignY(alignment: AlignAxis): this;
 	spacing(value: string | number): this;
 	size(size: "small" | "medium" | "large"): this;
+	/**
+	 * Sugar for `.children(ForEach(data).renderItem(fn))`.
+	 * Prefer `ForEach` when you need `.keyBy()`.
+	 */
+	forEach<T>(items: T[] | readonly T[], renderItem: (item: T, index: number) => unknown): this;
 	build(): React$1.ReactElement;
 }
 export declare const Column: () => StyleBuilder<ColumnBuilder>;
@@ -3087,6 +3130,11 @@ declare class RowBuilder extends FiboBuilder {
 	alignY(alignment: AlignAxis): this;
 	spacing(value: string | number): this;
 	items(children: React$1.ReactElement[]): this;
+	/**
+	 * Sugar for `.children(ForEach(data).renderItem(fn))`.
+	 * Prefer `ForEach` when you need `.keyBy()`.
+	 */
+	forEach<T>(items: T[] | readonly T[], renderItem: (item: T, index: number) => unknown): this;
 	build(): React$1.ReactElement;
 }
 export declare const Row: () => StyleBuilder<RowBuilder>;
@@ -3268,8 +3316,14 @@ export declare const ToolbarItem: () => StyleBuilder<ToolbarItemBuilder>;
 export declare const AppBar: () => StyleBuilder<AppBarBuilder>;
 declare class BottomAppBarBuilder extends FiboBuilder {
 	private _items;
+	private _floating;
 	/** Same contract as `AppBar().items` — zone via `ToolbarItem` place. */
 	items(children: FiboChildren): this;
+	/**
+	 * iOS-style floating capsule — inset from edges, rounded, shadow.
+	 * Pair with `.resetStyle().material(Material.ultraThin)` for glass.
+	 */
+	floating(value?: boolean): this;
 	build(): React$1.ReactElement;
 }
 export declare const BottomAppBar: () => StyleBuilder<BottomAppBarBuilder>;
@@ -5158,6 +5212,29 @@ declare class ListBuilder<T = any> extends FiboBuilder {
 	build(): React$1.ReactElement;
 }
 export declare const List: <T = any>() => StyleBuilder<ListBuilder<T>>;
+export type ForEachSource<T> = readonly T[] | T[] | (() => readonly T[] | T[]) | BindableSignal<readonly T[] | T[]>;
+declare class ForEachBuilder<T = unknown> extends FiboBuilder {
+	private _source?;
+	private _renderItem?;
+	private _keyBy?;
+	constructor(source?: ForEachSource<T>, renderItem?: (item: T, index: number) => unknown);
+	/** Data: array, `() => array`, or bindable / `listSignal` (read `.value` at build). */
+	items(source: ForEachSource<T>): this;
+	/** Factory per item — same idea as `List.renderItem`. */
+	renderItem(fn: (item: T, index: number) => unknown): this;
+	/**
+	 * Stable React key per item.
+	 * Defaults to `id` / `_id` / `key` on objects, else index.
+	 * (Not `.id()` — that sets the host HTML id on `FiboBuilder`.)
+	 */
+	keyBy(fn: (item: T, index: number) => string | number): this;
+	build(): React$1.ReactElement;
+}
+export declare const ForEach: <T = unknown>(source?: ForEachSource<T> | undefined, renderItem?: ((item: T, index: number) => unknown) | undefined) => StyleBuilder<ForEachBuilder<T>>;
+declare class GroupBuilder extends FiboBuilder {
+	build(): React$1.ReactElement;
+}
+export declare const Group: () => StyleBuilder<GroupBuilder>;
 declare class SectionBuilder extends FiboBuilder {
 	private _header?;
 	private _footer?;
@@ -6071,6 +6148,8 @@ export {
 	Store as ReactiveStore,
 	Store$1 as Store,
 	Text$1 as Text,
+	VirtualColumn as LazyVStack,
+	VirtualRow as LazyHStack,
 	open$1 as open,
 	scrollTo$1 as scrollTo,
 };