fiboui 2.8.4 → 2.8.5

package/dist/core.d.ts

@@ -1,2 +1,1545 @@
-export { signal, computed, observable, createStore, Signal, ComputedSignal, Observable, createReactivityRoot, runInScope, getCurrentScope, listSignal, collection, ListSignal, ensureListId, interp, useSignal, useReactiveStore, useObservable, useBuilderState, Observer, ProviderWrapper, useProvider, ReactivityRoot, FineGrainText, bindText, applyResponsiveStyles, useTransition, useSpring, useStagger, useMountTransition, usePrefersReducedMotion, useScrollProgress, Easing, cssCurve, Presence, Reveal, ScrollProgress, scrollTo, startViewTransition, supportsViewTimeline, supportsScrollTimeline, springEase, resolveCssEase, MOTION_PRESETS, INTERACTION_EFFECTS, normalizeInteractionEffect, interactionEffectClass, interactionEffectKebab, FIBO_INTERACTION_FX_CSS, ensureInteractionFxCss, MotionStyles, FiboStyles, getMotionCss, getCss, getStyleTag, endSsrRequest, page, withFiboStyles, createPage, FiboApp, FiboAppBuilder, mount, Fibo, toElement, ValueBuilder } from './index.js';
-export type { Buildable, FiboChild, FiboChildren, ResponsiveStyles, BindableSignal, ReactiveStore, ReactivityScope, ListItemId, ListMatcher, ListEntity, TransitionConfig, SpringConfig, AnimationOptions, SpringOptions, MotionPreset, CustomMotion, InteractionEffectName, FiboPageBuild, FiboPageOptions, PseudoStateFn, PseudoStateBuilder } from './index.js';
+// Generated by dts-bundle-generator v9.5.1
+
+import React$1 from 'react';
+import { CSSProperties, ComponentType, ReactElement, ReactNode } from 'react';
+import { Root } from 'react-dom/client';
+
+/** Any fluent builder that can produce a React element. */
+export type Buildable = {
+	/** @deprecated Builders are React elements; `.build()` is optional. */
+	build(): React$1.ReactNode;
+};
+/**
+ * A single child accepted by `.children()` / layout slots / JSX / component returns.
+ * Builders are React elements — they do not need `.build()`.
+ */
+export type FiboChild = React$1.ReactNode | Buildable;
+/** Value accepted by `.children()`: one child, a list, or a lazy factory. */
+export type FiboChildren = FiboChild | readonly FiboChild[] | (() => FiboChild | readonly FiboChild[]);
+type FiboThemeName = "material" | "cupertino" | "web" | "noir";
+export interface ResponsiveStyles {
+	mobile?: React$1.CSSProperties;
+	tablet?: React$1.CSSProperties;
+	desktop?: React$1.CSSProperties;
+}
+type AlignAxis = "start" | "center" | "end" | "stretch" | "baseline" | "between" | "around" | "evenly" | "space-between" | "space-around" | "space-evenly" | "spaceBetween" | "spaceAround" | "spaceEvenly";
+interface TextStyle {
+	fontSize?: string | number;
+	fontWeight?: string | number;
+	fontFamily?: string;
+	color?: string;
+	lineHeight?: string | number;
+	letterSpacing?: string | number;
+}
+type Listener<T> = (value: T) => void;
+type Unsubscribe = () => void;
+/** Isolated reactive graph for one React root / test / island. */
+export declare class ReactivityScope {
+	activeEffect: Effect | Tracker | null;
+}
+export declare function createReactivityRoot(): ReactivityScope;
+export declare function getCurrentScope(): ReactivityScope;
+export declare function runInScope<T>(scope: ReactivityScope, fn: () => T): T;
+interface Subscribable<T> {
+	subscribe(listener: Listener<T>): Unsubscribe;
+	subscribeEffect(effect: Effect): void;
+	unsubscribeEffect(effect: Effect): void;
+}
+/** Anything `.bindSignal()` can subscribe to (`Signal` or `ComputedSignal`). */
+export interface BindableSignal<T = unknown> {
+	readonly value: T;
+	subscribe(listener: Listener<T>): Unsubscribe;
+}
+declare class Effect {
+	private fn;
+	private dependencies;
+	private _onDispose?;
+	constructor(fn: () => void);
+	run(): void;
+	track(dep: Subscribable<any>): void;
+	trigger(): void;
+	cleanup(): void;
+	dispose(): void;
+}
+declare class Tracker {
+	private _onInvalidate;
+	private dependencies;
+	constructor(_onInvalidate: () => void);
+	execute<T>(fn: () => T): T;
+	track(dep: Subscribable<any>): void;
+	trigger(): void;
+	cleanup(): void;
+	dispose(): void;
+}
+export declare class Signal<T> implements Subscribable<T> {
+	private _value;
+	private listeners;
+	private effects;
+	private readonly _initial;
+	constructor(_value: T);
+	get value(): T;
+	/** Current value without tracking. Replays use this so a node does not subscribe twice. */
+	peek(): T;
+	set value(newValue: T);
+	/** Replace the value. Same notify path as `.value = next`. */
+	set(next: T): this;
+	/**
+	 * Write a value, or an updater `(prev) => next`.
+	 * Function-valued signals should use `.set()` / `.value =` so the function is stored, not called.
+	 * Not named `update`: `listSignal.update(id, patch)` is the item patch.
+	 */
+	change(next: T | ((prev: T) => T)): this;
+	/** Restore the value passed to `signal(initial)`. */
+	reset(): this;
+	subscribe(listener: Listener<T>): Unsubscribe;
+	subscribeEffect(effect: Effect): void;
+	unsubscribeEffect(effect: Effect): void;
+	private _notifyDepth;
+	private notify;
+}
+export declare function signal<T>(initialValue: T): Signal<T>;
+export declare class ComputedSignal<T> implements Subscribable<T> {
+	private fn;
+	private listeners;
+	private effects;
+	private _value;
+	private _dirty;
+	private _disposed;
+	private _ready;
+	private _hasValue;
+	private _computing;
+	private internalEffect;
+	constructor(fn: () => T);
+	/** Current value without tracking and without joining the page frame. */
+	peek(): T;
+	get value(): T;
+	subscribe(listener: Listener<T>): Unsubscribe;
+	subscribeEffect(effect: Effect): void;
+	unsubscribeEffect(effect: Effect): void;
+	/** Drop the internal effect and freeze the last evaluated value. */
+	dispose(): void;
+	private _notifyDepth;
+	private notify;
+}
+export declare function computed<T>(fn: () => T): ComputedSignal<T>;
+export declare class Observable<T> implements Subscribable<T> {
+	private _value;
+	private listeners;
+	private effects;
+	constructor(_value: T);
+	get(): T;
+	set(newValue: T): void;
+	subscribe(listener: Listener<T>): Unsubscribe;
+	subscribeEffect(effect: Effect): void;
+	unsubscribeEffect(effect: Effect): void;
+	private notify;
+}
+export declare function observable<T>(initialValue: T): Observable<T>;
+interface Store<T> extends Subscribable<T> {
+	getState(): T;
+	setState(fn: Partial<T> | ((state: T) => Partial<T>)): void;
+}
+export declare function createStore<T>(initialState: T): Store<T>;
+export type ListItemId = string | number;
+/** Every object in a `listSignal` gets a stable internal key. */
+export type ListEntity<T extends object = object> = T & {
+	_id: string;
+};
+export type ListMatcher<T> = ListItemId | ((item: T, index: number) => boolean);
+/** Stamp `_id` if missing. Keeps an existing `_id`. */
+export declare function ensureListId<T extends object>(item: T): ListEntity<T>;
+/**
+ * Reactive list — auto-stamps a UUID `_id` on every object.
+ * Use `_id` for update/remove/find; your domain fields stay free of ids.
+ *
+ * `view('ship')` / `search('ship')` show a subset. The full list stays in memory, so
+ * `view('')` / `search('')` show every item again. `filter(fn)` is a one-shot snapshot
+ * of the full list. `viewWhere(fn)` is the live predicate (AND with the query);
+ * `viewWhere()` clears it. `add` always writes to the full list.
+ *
+ * ```ts
+ * const todos = listSignal<{ title: string }>([])
+ * todos.add({ title: 'Ship' })              // → { title: 'Ship', _id: '…' }
+ * todos.update(todo._id, { title: 'Done' })
+ * todos.view('done')
+ * todos.view('')
+ * todos.remove(todo._id)
+ * ```
+ */
+export declare class ListSignal<T extends object> extends Signal<ListEntity<T>[]> {
+	private _$length?;
+	/** Full list. `.value` is this array, or a filtered slice while a view/filter is set. */
+	private _source;
+	private _query;
+	private _keys?;
+	private _predicate?;
+	/** Membership and order. Item patches do not move this. */
+	private _structureVersion;
+	private _itemVersions;
+	private _structureListeners;
+	private _itemListeners;
+	constructor(initial?: Array<T | ListEntity<T>>);
+	get value(): ListEntity<T>[];
+	/**
+	 * Replaces the full list, then reapplies the current view.
+	 * In-place mutation of this array (`push` / `splice`) does not notify
+	 * and does not write the stored list — assign a new array or use
+	 * `add` / `update` / `remove`.
+	 */
+	set value(next: ListEntity<T>[]);
+	/** Who is in the list, and in what order. `add` / `remove` / `set` / `view` move this. */
+	structureVersion(): number;
+	/** Content of one `_id`. `update` / `replace` move only that id. */
+	itemVersion(id: string): number;
+	subscribeStructure(listener: () => void): () => void;
+	subscribeItem(id: string, listener: () => void): () => void;
+	private emitStructure;
+	private emitItem;
+	/**
+	 * Push the visible rows. Always a copy so `.value.splice` cannot write `_source`.
+	 * `silent` still notifies `.subscribe` (the whole array changed in memory).
+	 * `structure` is membership. `items` is one row's fields.
+	 */
+	private publish;
+	get length(): number;
+	/**
+	 * Reactive length for plain templates:
+	 * `Text(\`Total todos: ${todos.$length}\`)`
+	 *
+	 * Embeds a marker via `interp()`; `Text` resolves it on each update.
+	 * (`todos.length` is a plain number and still freezes — use `$length`.)
+	 */
+	get $length(): string;
+	/** Replace the whole array (missing `_id`s are generated). */
+	set(items: Array<T | ListEntity<T>>): this;
+	clear(): this;
+	/** Append items — each gets `_id` if not already set. Writes the full list. */
+	add(...items: Array<T | ListEntity<T>>): this;
+	/** Insert at index (clamped) in the full list. */
+	insert(index: number, item: T | ListEntity<T>): this;
+	/**
+	 * Patch by `_id` / `id` / predicate.
+	 * `patch` can be a partial object or a mapper.
+	 */
+	update(matcher: ListMatcher<ListEntity<T>>, patch: Partial<T> | ((item: ListEntity<T>) => T | ListEntity<T>)): this;
+	/** Replace the first match (keeps original `_id` unless `item` already has one). */
+	replace(matcher: ListMatcher<ListEntity<T>>, item: T | ListEntity<T>): this;
+	/** Remove by `_id` / `id` / predicate. Alias: `delete`. */
+	remove(matcher: ListMatcher<ListEntity<T>>): this;
+	delete(matcher: ListMatcher<ListEntity<T>>): this;
+	find(matcher: ListMatcher<ListEntity<T>>): ListEntity<T> | undefined;
+	/**
+	 * Show only rows that match `query`. The full list stays stored.
+	 * `view('')` or `view()` shows every item again (does not clear `viewWhere`).
+	 * `keys` limits the match to those fields (`['text']`).
+	 */
+	view(query?: string, keys?: (keyof T)[]): this;
+	/**
+	 * Live predicate on `publish()` (AND with `view`/`search` query).
+	 * `viewWhere()` with no fn (or `null`) clears it.
+	 */
+	viewWhere(predicate?: ((item: ListEntity<T>, index: number) => boolean) | null): this;
+	/**
+	 * Same live view as `view()`, plus a copy of the visible rows.
+	 * Bound List/Table update; `const hits = todos.search('x')` still works.
+	 */
+	search(query: string, keys?: (keyof T)[]): ListEntity<T>[];
+	/**
+	 * One-shot snapshot of `_source` (Array.filter). Does not change `.value`.
+	 * Safe inside `computed(() => todos.filter(fn))`.
+	 * `todos.set(todos.filter(fn))` replaces the full list (clearDone).
+	 */
+	filter(predicate: (item: ListEntity<T>, index: number) => boolean): ListEntity<T>[];
+	map<U>(fn: (item: ListEntity<T>, index: number) => U): U[];
+	move(from: number, to: number): this;
+}
+export declare function listSignal<T extends object>(initial?: Array<T | ListEntity<T>>): ListSignal<T>;
+/** Alias — same as `listSignal`. */
+export declare const collection: typeof listSignal;
+/**
+ * Wrap a signal so `` `…${interp(sig)}` `` embeds a reactive marker
+ * instead of freezing `String(sig.value)` immediately.
+ *
+ * Returns a primitive string (the marker). Callers that check
+ * `typeof x === 'string'` then `hasInterpMarks(x)` must see it.
+ */
+export declare function interp<T>(signal: BindableSignal<T>): string;
+export type FiboDevStats = {
+	/** runBuildFrame / page produce counts */
+	produces: number;
+	/** node wire replays */
+	replays: number;
+	/** times a signal was promoted to page root (warn path) */
+	pageRoots: number;
+	/** warnDev calls that actually printed */
+	warns: number;
+};
+export declare function fiboDevStats(): FiboDevStats;
+export declare function resetFiboDevStats(): void;
+type NumericInput = number | BindableSignal<number>;
+/**
+ * Number / money printers for live `Text` / `Button` templates.
+ *
+ * ```ts
+ * Text(`€ ${Format.fixed(price)}`)
+ * Text(Format.euro(price))
+ * Text(Format.currency(price, 'USD'))
+ * ```
+ */
+export declare const Format: {
+	/** Decimals — default 2: `Format.fixed(price)` → `"12.50"`. */
+	readonly fixed: (value: NumericInput, digits?: number) => string;
+	/** Whole number, no decimals: `Format.integer(n)` → `"12"`. */
+	readonly integer: (value: NumericInput) => string;
+	/** `Format.euro(price)` → `"€ 12.50"`. */
+	readonly euro: (value: NumericInput, digits?: number) => string;
+	/**
+	 * Locale currency. Default `EUR` / `es-ES`.
+	 * `Format.currency(price, 'USD', 'en-US')` → `"$12.50"`.
+	 */
+	readonly currency: (value: NumericInput, currency?: string, locale?: string) => string;
+	/** `Format.percent(rate)` with rate `0–1` → `"12%"` (default 0 decimals). */
+	readonly percent: (value: NumericInput, digits?: number) => string;
+	/** Compact: `1200` → `"1.2K"` (en). */
+	readonly compact: (value: NumericInput, locale?: string) => string;
+};
+/** Alias of `Format`. */
+export declare const Transform: {
+	/** Decimals — default 2: `Format.fixed(price)` → `"12.50"`. */
+	readonly fixed: (value: NumericInput, digits?: number) => string;
+	/** Whole number, no decimals: `Format.integer(n)` → `"12"`. */
+	readonly integer: (value: NumericInput) => string;
+	/** `Format.euro(price)` → `"€ 12.50"`. */
+	readonly euro: (value: NumericInput, digits?: number) => string;
+	/**
+	 * Locale currency. Default `EUR` / `es-ES`.
+	 * `Format.currency(price, 'USD', 'en-US')` → `"$12.50"`.
+	 */
+	readonly currency: (value: NumericInput, currency?: string, locale?: string) => string;
+	/** `Format.percent(rate)` with rate `0–1` → `"12%"` (default 0 decimals). */
+	readonly percent: (value: NumericInput, digits?: number) => string;
+	/** Compact: `1200` → `"1.2K"` (en). */
+	readonly compact: (value: NumericInput, locale?: string) => string;
+};
+/**
+ * CSS length printers for live styles / text.
+ *
+ * ```ts
+ * Box().width(Unit.px(width))
+ * Box().height(Unit.percent(height))
+ * Text(Unit.rem(size))
+ * ```
+ */
+export declare const Unit: {
+	readonly px: (value: NumericInput) => string;
+	readonly rem: (value: NumericInput) => string;
+	readonly em: (value: NumericInput) => string;
+	/** `Unit.percent(50)` → `"50%"`. */
+	readonly percent: (value: NumericInput) => string;
+	readonly vh: (value: NumericInput) => string;
+	readonly vw: (value: NumericInput) => string;
+};
+/**
+ * Count + word for live labels.
+ *
+ * ```ts
+ * Text(Plural.of(count, 'task', 'tasks'))  // "1 task" / "3 tasks"
+ * Text(Plural.of(left, 'left', 'left'))    // "2 left"
+ * ```
+ */
+export declare const Plural: {
+	/**
+	 * `"N word"` — uses `one` when the absolute count is 1, otherwise `many`.
+	 */
+	readonly of: (count: NumericInput, one: string, many: string) => string;
+	/** Only the word: `Plural.word(count, 'item', 'items')` → `"items"`. */
+	readonly word: (count: NumericInput, one: string, many: string) => string;
+};
+export declare function useSignal<T>(signal: Signal<T> | ComputedSignal<T>): T;
+/** Subscribe to a `createStore()` instance. Distinct from the class-decorator `useStore`. */
+export declare function useReactiveStore<T>(store: Store<T>): T;
+export declare function useObservable<T>(obs: Observable<T>): T;
+export declare function Observer({ children }: {
+	children: () => React$1.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useBuilderState<T = unknown>(key: string): [
+	T | undefined,
+	(value: T) => void
+];
+interface ProviderWrapperProps {
+	providers?: Map<string, unknown>;
+	children: React$1.ReactNode;
+}
+export declare function useProvider<T>(key: string): T | undefined;
+export declare function ProviderWrapper({ providers, children }: ProviderWrapperProps): import("react/jsx-runtime").JSX.Element;
+interface ReactivityRootProps {
+	children: React$1.ReactNode;
+	scope?: ReactivityScope;
+}
+/** Isolates `activeEffect` for one React tree / island. */
+export declare function ReactivityRoot({ children, scope }: ReactivityRootProps): import("react/jsx-runtime").JSX.Element;
+interface FineGrainTextProps {
+	compute: () => string;
+	as?: keyof HTMLElementTagNameMap;
+	className?: string;
+	style?: React$1.CSSProperties;
+}
+/** Updates `textContent` in place — the host element is not remounted. */
+export declare function FineGrainText({ compute, as, className, style, ...rest }: FineGrainTextProps & Record<string, unknown>): React$1.DetailedReactHTMLElement<{
+	ref: (node: HTMLElement | null) => void;
+	className: string | undefined;
+	style: React$1.CSSProperties | undefined;
+}, HTMLElement>;
+/** Bind a signal to a live text node without a React state subscription. */
+export declare function bindText(signal: BindableSignal<unknown>, as?: keyof HTMLElementTagNameMap): React$1.FunctionComponentElement<FineGrainTextProps & Record<string, unknown>>;
+export declare function applyResponsiveStyles(baseStyle: React$1.CSSProperties, responsive?: ResponsiveStyles, width?: number): React$1.CSSProperties;
+export interface TransitionConfig {
+	duration?: number;
+	delay?: number;
+	easing?: (t: number) => number;
+}
+export interface SpringConfig {
+	stiffness?: number;
+	damping?: number;
+	mass?: number;
+}
+export declare const Easing: {
+	linear: (t: number) => number;
+	easeIn: (t: number) => number;
+	easeOut: (t: number) => number;
+	easeInOut: (t: number) => number;
+	easeInCubic: (t: number) => number;
+	easeOutCubic: (t: number) => number;
+	elastic: (t: number) => number;
+	bounce: (t: number) => number;
+};
+export declare function useTransition(targetValue: number, config?: TransitionConfig): number;
+export declare function useSpring(targetValue: number, config?: SpringConfig): number;
+export declare function useMountTransition(isVisible: boolean, duration?: number): {
+	shouldRender: boolean;
+	stage: "entering" | "entered" | "exiting" | "exited";
+};
+export declare function useStagger(count: number, delayBetween?: number): number[];
+export declare function usePrefersReducedMotion(): boolean;
+/** Scroll position 0–1. Uses `scroll` / `resize` listeners — not rAF. */
+export declare function useScrollProgress(): number;
+export interface AnimationOptions {
+	duration?: number;
+	curve?: "linear" | "easeIn" | "easeOut" | "easeInOut" | "spring" | string;
+	damping?: number;
+	stiffness?: number;
+	velocity?: number;
+	mass?: number;
+	onComplete?: () => void;
+}
+export interface Signal<T> {
+	spring(target: T, options?: Partial<AnimationOptions>): void;
+	animate(target: T, options?: Partial<AnimationOptions>): void;
+	snapTo(target: T, options?: Partial<AnimationOptions>): void;
+}
+export declare function cssCurve(options?: Partial<AnimationOptions>): string;
+export declare const MOTION_PRESETS: readonly [
+	"fadeIn",
+	"fadeOut",
+	"fade",
+	"slideUp",
+	"slideDown",
+	"slideLeft",
+	"slideRight",
+	"scaleIn",
+	"scaleOut",
+	"scale",
+	"blurIn",
+	"blurOut",
+	"blur",
+	"pop",
+	"bounce"
+];
+export type MotionPreset = (typeof MOTION_PRESETS)[number];
+export interface CustomMotion {
+	from: Record<string, string | number>;
+	to: Record<string, string | number>;
+	duration?: number;
+	ease?: string;
+	delay?: number;
+	stiffness?: number;
+	damping?: number;
+	mass?: number;
+}
+declare const FIBO_BREAKPOINTS: {
+	readonly sm: 640;
+	readonly md: 768;
+	readonly lg: 1024;
+	readonly xl: 1280;
+};
+type BreakpointKey = keyof typeof FIBO_BREAKPOINTS;
+declare abstract class GestureBuilder {
+	abstract wrap(children: React$1.ReactNode): React$1.ReactNode;
+}
+/**
+ * Full interaction-effect catalog (Hover.css–inspired names, fiboui-owned CSS).
+ * NOT a vendor of Hover.css — reimplemented for commercial use inside fiboui.
+ *
+ * Apply on any trigger:
+ *   .hover(h => h.effect("sweepToRight"))
+ *   .pressEffect("shrink")
+ *   .focusEffect("glow")
+ */
+export declare const INTERACTION_EFFECTS: readonly [
+	"grow",
+	"shrink",
+	"pulse",
+	"pulseGrow",
+	"pulseShrink",
+	"push",
+	"pop",
+	"bounceIn",
+	"bounceOut",
+	"rotate",
+	"growRotate",
+	"float",
+	"sink",
+	"bob",
+	"hang",
+	"skew",
+	"skewForward",
+	"skewBackward",
+	"wobbleHorizontal",
+	"wobbleVertical",
+	"wobbleToBottomRight",
+	"wobbleToTopRight",
+	"wobbleTop",
+	"wobbleBottom",
+	"wobbleSkew",
+	"buzz",
+	"buzzOut",
+	"forward",
+	"backward",
+	"nudge",
+	"fade",
+	"backPulse",
+	"sweepToRight",
+	"sweepToLeft",
+	"sweepToBottom",
+	"sweepToTop",
+	"bounceToRight",
+	"bounceToLeft",
+	"bounceToBottom",
+	"bounceToTop",
+	"radialOut",
+	"radialIn",
+	"rectangleIn",
+	"rectangleOut",
+	"shutterInHorizontal",
+	"shutterOutHorizontal",
+	"shutterInVertical",
+	"shutterOutVertical",
+	"iconBack",
+	"iconForward",
+	"iconDown",
+	"iconUp",
+	"iconSpin",
+	"iconDrop",
+	"iconFade",
+	"iconFloatAway",
+	"iconSinkAway",
+	"iconGrow",
+	"iconShrink",
+	"iconPulse",
+	"iconPulseGrow",
+	"iconPulseShrink",
+	"iconPush",
+	"iconPop",
+	"iconBounce",
+	"iconRotate",
+	"iconGrowRotate",
+	"iconFloat",
+	"iconSink",
+	"iconBob",
+	"iconHang",
+	"iconWobbleHorizontal",
+	"iconWobbleVertical",
+	"iconBuzz",
+	"iconBuzzOut",
+	"borderFade",
+	"hollow",
+	"trim",
+	"rippleOut",
+	"rippleIn",
+	"outlineOut",
+	"outlineIn",
+	"roundCorners",
+	"underlineFromLeft",
+	"underlineFromCenter",
+	"underlineFromRight",
+	"reveal",
+	"underlineReveal",
+	"overlineFromLeft",
+	"overlineFromCenter",
+	"overlineFromRight",
+	"overlineReveal",
+	"shadowGrow",
+	"shadowFloat",
+	"shadowGlow",
+	"shadowRadial",
+	"boxShadowOutset",
+	"boxShadowInset",
+	"lift",
+	"glow",
+	"bubbleTop",
+	"bubbleRight",
+	"bubbleBottom",
+	"bubbleLeft",
+	"bubbleFloatTop",
+	"bubbleFloatRight",
+	"bubbleFloatBottom",
+	"bubbleFloatLeft",
+	"curlTopLeft",
+	"curlTopRight",
+	"curlBottomRight",
+	"curlBottomLeft"
+];
+export type InteractionEffectName = (typeof INTERACTION_EFFECTS)[number];
+export declare function interactionEffectKebab(name: InteractionEffectName): string;
+export declare function normalizeInteractionEffect(name: string): InteractionEffectName;
+export declare function interactionEffectClass(name: InteractionEffectName): string;
+interface LogicalAxes {
+	paddingHorizontal(value: string | number): this;
+	paddingVertical(value: string | number): this;
+	paddingX(value: string | number): this;
+	paddingY(value: string | number): this;
+	px(value: string | number): this;
+	py(value: string | number): this;
+	marginHorizontal(value: string | number): this;
+	marginVertical(value: string | number): this;
+	marginX(value: string | number): this;
+	marginY(value: string | number): this;
+	mx(value: string | number): this;
+	my(value: string | number): this;
+	borderHorizontal(value: string | number): this;
+	borderVertical(value: string | number): this;
+	borderX(value: string | number): this;
+	borderY(value: string | number): this;
+	borderWidthHorizontal(value: string | number): this;
+	borderWidthVertical(value: string | number): this;
+	borderColorHorizontal(value: string | number): this;
+	borderColorVertical(value: string | number): this;
+	roundedTop(value: string | number): this;
+	roundedBottom(value: string | number): this;
+	roundedLeft(value: string | number): this;
+	roundedRight(value: string | number): this;
+	insetHorizontal(value: string | number): this;
+	insetVertical(value: string | number): this;
+	insetX(value: string | number): this;
+	insetY(value: string | number): this;
+	gapX(value: string | number): this;
+	gapY(value: string | number): this;
+}
+/**
+ * The constructor returns a proxy that accepts any CSS method.
+ * Declare the axes plus `boxShadow` (the class method is `.shadow()`).
+ */
+export interface PseudoStateBuilder extends LogicalAxes {
+	boxShadow(value: string | number): this;
+}
+export declare class PseudoStateBuilder {
+	private pseudoState;
+	private parentBuilder;
+	private isGroup;
+	private transitionDuration;
+	private transitionEasing;
+	private transitionDelay;
+	private transitionProperties;
+	private transforms;
+	private _boxLonghands;
+	constructor(pseudoState: string, parentBuilder: FiboBuilder, isGroup?: boolean);
+	/**
+	 * Apply a named interaction effect (full Hover.css–inspired catalog).
+	 * Works on any pseudo trigger — hover, press/active, focus, groupHover, etc.
+	 * Stamps CSS classes; sheet is fiboui-owned (not a Hover.css vendor).
+	 */
+	effect(name: InteractionEffectName | string): this;
+	bg(color: string): this;
+	/** Same longhand as `.bg()` — interpolates against the resting surface. */
+	backgroundColor(value: string): this;
+	color(value: string): this;
+	text(color: string): this;
+	opacity(value: number): this;
+	borderColor(value: string): this;
+	transform(value: string): this;
+	scale(value: number): this;
+	translateX(value: number | string): this;
+	translateY(value: number | string): this;
+	rotate(degrees: number): this;
+	shadow(value: string | number): this;
+	css(property: string, value: string | number): this;
+	padding(value: string | number): this;
+	p(value: string | number): this;
+	margin(value: string | number): this;
+	transition(value: string): this;
+	transition(properties: string | string[], duration: number, easing?: string, delay?: number): this;
+	duration(ms: number): this;
+	easing(value: "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out" | "spring" | string): this;
+	ease(value: string): this;
+	delay(ms: number): this;
+	properties(props: string[]): this;
+	private applyTransition;
+	private flushTransform;
+	private set;
+	private commit;
+	end(): FiboBuilder;
+}
+declare const When: {
+	readonly hover: "hover";
+	readonly focus: "focus";
+	readonly active: "active";
+	readonly visited: "visited";
+	readonly disabled: "disabled";
+	readonly on: "on";
+	readonly off: "off";
+	readonly checked: "checked";
+	readonly unchecked: "unchecked";
+	readonly indeterminate: "indeterminate";
+	readonly mixed: "mixed";
+};
+type When = (typeof When)[keyof typeof When];
+type WhenStyle = React$1.CSSProperties | string | ((builder: any) => void);
+export interface SpringOptions {
+	stiffness?: number;
+	damping?: number;
+	mass?: number;
+}
+/**
+ * CSS `linear()` spring sampled once. stiffness/damping/mass change the curve.
+ * The browser interpolates — no rAF on the CSS path.
+ */
+export declare function springEase(options?: SpringOptions): string;
+export declare function resolveCssEase(value: string, spring?: SpringOptions): string;
+interface ThemeColors {
+	primary: string;
+	primaryVariant?: string;
+	primaryContainer?: string;
+	onPrimaryContainer?: string;
+	secondary: string;
+	secondaryVariant?: string;
+	secondaryContainer?: string;
+	onSecondaryContainer?: string;
+	tertiary?: string;
+	onTertiary?: string;
+	tertiaryContainer?: string;
+	onTertiaryContainer?: string;
+	background: string;
+	surface: string;
+	surfaceVariant?: string;
+	onSurfaceVariant?: string;
+	error: string;
+	errorContainer?: string;
+	onErrorContainer?: string;
+	success?: string;
+	warning?: string;
+	info?: string;
+	onPrimary: string;
+	onSecondary: string;
+	onBackground: string;
+	onSurface: string;
+	onError: string;
+	/** Borders / hairlines — maps to `--fibo-outline`. */
+	outline?: string;
+	outlineVariant?: string;
+	/** Maps to `--fibo-surface-container-low` (M3 card surfaces). */
+	surfaceContainerLow?: string;
+}
+interface ThemeTypography {
+	h1: TextStyle;
+	h2: TextStyle;
+	h3: TextStyle;
+	h4: TextStyle;
+	h5: TextStyle;
+	h6: TextStyle;
+	body: TextStyle;
+	caption: TextStyle;
+	label: TextStyle;
+}
+interface ThemeSpacing {
+	xs: string;
+	sm: string;
+	md: string;
+	lg: string;
+	xl: string;
+}
+interface ThemeBorderRadius {
+	/** Maps to `--fibo-radius-xs` when set (CSS sheets already define it). */
+	xs?: string;
+	sm: string;
+	md: string;
+	lg: string;
+	/** Maps to `--fibo-radius-xl` when set (CSS sheets already define it). */
+	xl?: string;
+	full: string;
+}
+interface ThemeShadows {
+	sm: string;
+	md: string;
+	lg: string;
+}
+interface FiboTheme {
+	name: FiboThemeName;
+	colors: ThemeColors;
+	typography: ThemeTypography;
+	spacing: ThemeSpacing;
+	borderRadius: ThemeBorderRadius;
+	shadows: ThemeShadows;
+	fontFamily: string;
+}
+declare const FIBO_THEMES: {
+	readonly material: FiboTheme;
+	readonly cupertino: FiboTheme;
+	readonly web: FiboTheme;
+	readonly noir: FiboTheme;
+};
+type FiboThemePreset = keyof typeof FIBO_THEMES;
+type ThemeInput = FiboTheme | FiboThemePreset;
+declare enum Colors {
+	Primary = "primary",
+	OnPrimary = "on-primary",
+	PrimaryContainer = "primary-container",
+	OnPrimaryContainer = "on-primary-container",
+	Secondary = "secondary",
+	OnSecondary = "on-secondary",
+	SecondaryContainer = "secondary-container",
+	OnSecondaryContainer = "on-secondary-container",
+	Tertiary = "tertiary",
+	OnTertiary = "on-tertiary",
+	TertiaryContainer = "tertiary-container",
+	OnTertiaryContainer = "on-tertiary-container",
+	Error = "error",
+	OnError = "on-error",
+	Success = "success",
+	Warning = "warning",
+	Info = "info",
+	Background = "background",
+	OnBackground = "on-background",
+	Surface = "surface",
+	OnSurface = "on-surface",
+	SurfaceVariant = "surface-variant",
+	OnSurfaceVariant = "on-surface-variant",
+	Outline = "outline",
+	Transparent = "transparent",
+	Black = "black",
+	White = "white"
+}
+declare enum ShadowSize {
+	Sm = "sm",
+	Md = "md",
+	Lg = "lg",
+	Xl = "xl",
+	Xl2 = "2xl"
+}
+declare enum ShadowPreset {
+	Card = "card",
+	Button = "button",
+	Modal = "modal",
+	Float = "float",
+	Inner = "inner"
+}
+declare enum ShadowDirection {
+	Top = "top",
+	Bottom = "bottom",
+	Left = "left",
+	Right = "right",
+	TopBottom = "top-bottom",
+	LeftRight = "left-right",
+	Vertical = "vertical",
+	Horizontal = "horizontal",
+	All = "all"
+}
+type ShadowConfig = ShadowSize | ShadowPreset | string | 0 | null | [
+	string,
+	number?
+] | [
+	ShadowDirection | string,
+	ShadowSize | string
+] | [
+	ShadowDirection | string,
+	string
+] | [
+	ShadowDirection | string,
+	string,
+	number?
+] | [
+	ShadowDirection | string,
+	ShadowSize | string,
+	string,
+	number?
+];
+/**
+ * Callback form of `.hover()` / `.focus()` / … Contextual typing uses the *last*
+ * overload, so this signature must stay last or `h` becomes implicit `any` inside `.map()`.
+ */
+export type PseudoStateFn = (builder: PseudoStateBuilder) => void | PseudoStateBuilder;
+declare abstract class FiboBuilder {
+	/** @internal Extra DOM props forwarded to the host element. */
+	protected _props: Record<string, any>;
+	protected _style: React$1.CSSProperties;
+	protected _cssStyles: React$1.CSSProperties;
+	protected _classNames: string[];
+	protected _children: React$1.ReactNode[];
+	/** Resolved theme for this subtree (SwiftUI Environment / Flutter Theme). */
+	protected _theme?: FiboTheme;
+	protected _state: Map<string, any>;
+	protected _providers: Map<string, any>;
+	protected _observers: Set<Observable<any>>;
+	protected _signals: Set<BindableSignal<any>>;
+	/** Explicit `.bindSignal()` / `.observer()` owns nested reads. A direct wire does not. */
+	protected _ownsReads: boolean;
+	/** @internal Direct `method(signal.value)` calls replayed when that signal changes. */
+	protected _replays: Array<() => void>;
+	protected _isObserver: boolean;
+	protected _gesture?: GestureBuilder;
+	protected _animationConfig?: Partial<AnimationOptions>;
+	protected _animatedProps: Map<string, Signal<any>>;
+	protected _transforms: string[];
+	protected _transitionClass?: string;
+	/** True while transition class was auto-managed for hover/effect presets (expandable). */
+	protected _autoEffectTransition: boolean;
+	protected _effectTransitionProps: string[];
+	/**
+	 * When true, getStyle() promotes background/border shorthands to longhands and
+	 * (optionally) stamps a resting translate3d so pseudo transforms ease cleanly.
+	 */
+	protected _smoothSurface: boolean;
+	protected _smoothNeedsRestTransform: boolean;
+	protected _motionClass?: string;
+	protected _staggerMs?: number;
+	protected _reveal?: {
+		preset: string;
+		once?: boolean;
+		rootMargin?: string;
+		threshold?: number;
+	};
+	protected _scrollProgress: boolean;
+	protected _viewTransition?: string;
+	protected _reducedMotion: "reduce" | "never";
+	protected _usesCssMotion: boolean;
+	protected _explicitScrollMargin: boolean;
+	/** Shrink-wrap: skip the default `w-full` / `self-stretch` on Row and Column. */
+	protected _hug: boolean;
+	/**
+	 * Unset every CSS property on this component and what it renders inside.
+	 * Chain `.style()`, `.px()`, `.flex()` and the rest after this to put back only what you want.
+	 */
+	protected _resetStyle: boolean;
+	/** Kebab box longhands already stamped (`padding-left`, …) so later shorthand cannot clobber them. */
+	protected _boxLonghands: Set<string>;
+	resetStyle(): this;
+	protected isReset(): boolean;
+	hug(): this;
+	protected isHug(): boolean;
+	id(value: string): this;
+	/**
+	 * Scroll target. Same as `.id()`, plus `scroll-margin-top` so the section
+	 * is not hidden under a sticky header. Pair with `scrollTo('#name')`.
+	 */
+	anchor(value: string): this;
+	/**
+	 * Explicit `scroll-margin-top` on this node (overrides the sticky CSS variable
+	 * that `.anchor()` applies).
+	 */
+	scrollMargin(value: number | string): this;
+	/** Stamp a class onto the host. Used by PseudoStateBuilder (hashed `:hover` etc.). */
+	addClassName(name: string): this;
+	/**
+	 * React list key. After this is called, React reads the key as a string
+	 * on both the builder element and the inner host wrapper.
+	 * Builders are valid elements — you do not need `.build()`.
+	 */
+	key(value: string | number): this;
+	private setBoxLonghand;
+	private setBoxShorthand;
+	paddingHorizontal(value: string | number): this;
+	paddingVertical(value: string | number): this;
+	padding(value: string | number): this;
+	marginHorizontal(value: string | number): this;
+	marginVertical(value: string | number): this;
+	margin(value: string | number): this;
+	/** Inline layout wins over a host that hardcodes flex on the element (Form, Scaffold). */
+	protected layoutStyle(patch: React$1.CSSProperties): this;
+	/** Last write of a key lives in one bag so getStyle() does not let earlier `.css()` beat later `.style()`. */
+	private dropConflictingKeys;
+	private trackBoxLonghandsFrom;
+	flexDirection(direction: "row" | "column" | "row-reverse" | "column-reverse"): this;
+	/** Flutter `textDirection`. */
+	textDirection(direction: "ltr" | "rtl"): this;
+	/** Flutter `textBaseline`. Both modes align on the flex baseline. */
+	textBaseline(baseline: "alphabetic" | "ideographic"): this;
+	/** Flutter `clipBehavior`. `none` shows overflow; the other two clip. */
+	clip(behavior: "none" | "hardEdge" | "antiAlias"): this;
+	/**
+	 * Flutter `mainAxisSize`. `min` hugs the current flex direction.
+	 * `max` stretches along that same axis.
+	 */
+	mainAxisSize(size: "min" | "max"): this;
+	zIndex(value: number): this;
+	alignItems(alignment: "start" | "center" | "end" | "stretch" | "baseline"): this;
+	alignSelf(alignment: "start" | "center" | "end" | "stretch" | "baseline" | "auto"): this;
+	flexWrap(wrap: "wrap" | "nowrap" | "wrap-reverse"): this;
+	/**
+	 * Main-axis distribution. Accepts Tailwind shortcuts (`between`) and CSS/Flutter
+	 * names (`space-between` / `spaceBetween`).
+	 */
+	justifyContent(justify: "start" | "center" | "end" | "between" | "around" | "evenly" | "space-between" | "space-around" | "space-evenly" | "spaceBetween" | "spaceAround" | "spaceEvenly"): this;
+	/** True when flexDirection is column / column-reverse (default is row). */
+	protected isVerticalFlex(): boolean;
+	/**
+	 * Both screen axes. `.align(Align.center)` and `.align('center')` do the same.
+	 * `between` packs the main axis and starts the cross axis.
+	 */
+	align(alignment: AlignAxis): this;
+	/**
+	 * Horizontal (screen X) alignment. Same meaning on Row and Column:
+	 * left / center / right of the container — not “main axis”.
+	 */
+	alignX(alignment: AlignAxis): this;
+	/**
+	 * Vertical (screen Y) alignment. Same meaning on Row and Column:
+	 * top / center / bottom of the container — not “cross axis”.
+	 */
+	alignY(alignment: AlignAxis): this;
+	protected applyMainAlign(alignment: AlignAxis | string): this;
+	protected applyCrossAlign(alignment: AlignAxis | string): this;
+	flex(value?: number | string): this;
+	grid(): this;
+	inlineFlex(): this;
+	inlineGrid(): this;
+	block(): this;
+	inlineBlock(): this;
+	hidden(): this;
+	center(): this;
+	/** Center on the horizontal screen axis (uses `.alignX('center')`). */
+	centerX(): this;
+	/** Center on the vertical screen axis (uses `.alignY('center')`). */
+	centerY(): this;
+	spaceBetween(): this;
+	spaceAround(): this;
+	spaceEvenly(): this;
+	fill(): this;
+	fillWidth(): this;
+	fillHeight(): this;
+	square(size: number | string): this;
+	circle(): this;
+	opacity(value: number): this;
+	p(value: number | string): this;
+	px(value: number | string): this;
+	py(value: number | string): this;
+	paddingX(value: number | string): this;
+	paddingY(value: number | string): this;
+	m(value: number | string): this;
+	mx(value: number | string): this;
+	my(value: number | string): this;
+	marginX(value: number | string): this;
+	marginY(value: number | string): this;
+	bg(color: string | Colors): this;
+	text(color: string | Colors): this;
+	color(value: string | Colors): this;
+	private resolveSemanticColor;
+	shadow(config?: ShadowConfig): this;
+	/**
+	 * Breakpoint styles compiled to CSS `@media` (same engine as `.md()`).
+	 * Tiers stay mutually exclusive: mobile `<768`, tablet `768–1023`, desktop `≥1024`.
+	 * No `window.innerWidth` — hydrate-safe.
+	 */
+	responsive(styles: ResponsiveStyles): this;
+	/**
+	 * CSS `@media` (min-width or a raw query). Compiles to a class — no resize JS.
+	 *
+	 * @example Box().padding(8).media('md', { padding: 16 }).media('(prefers-color-scheme: dark)', { backgroundColor: '#111' })
+	 */
+	media(query: BreakpointKey | string, styles: React$1.CSSProperties): this;
+	private registerMediaStyles;
+	sm(styles: React$1.CSSProperties): this;
+	md(styles: React$1.CSSProperties): this;
+	lg(styles: React$1.CSSProperties): this;
+	xl(styles: React$1.CSSProperties): this;
+	rounded(value: string | number): this;
+	borderRadius(value: string | number): this;
+	borderColor(value: string): this;
+	/**
+	 * A passed size is a lock: `min-*` plus `flex-shrink: 0`, so a flex parent
+	 * (the Scaffold body) cannot divide the viewport across these children.
+	 * `400`, `'320px'`, `Size.full`, and `Space.md` all count. `flex(1)` afterwards
+	 * opts back into sharing space.
+	 */
+	private lockAxis;
+	width(value: string | number): this;
+	paint(property: string, value: string): this;
+	height(value: string | number): this;
+	gap(value: string | number): this;
+	clean(): this;
+	borderInput(color?: string, focusColor?: string): this;
+	weight(value: string | number): this;
+	onClick(handler: (event: React$1.MouseEvent<any>) => void): this;
+	state<T>(key: string, initialValue: T): this;
+	getState<T>(key: string): T | undefined;
+	setState<T>(key: string, value: T): this;
+	provide<T>(key: string, value: T): this;
+	consume<T>(key: string): T | undefined;
+	observer(options?: string | number | {
+		key?: string | number;
+	}): this;
+	observe<T>(observable: Observable<T>): this;
+	bindSignal<T>(signal: BindableSignal<T>): this;
+	/**
+	 * @internal Wire a direct `method(signal.value)` to this node.
+	 * Does not claim reads that happen later in a children function.
+	 */
+	adoptWire(signals: Subscribable<unknown>[], replay: () => void): void;
+	/** @internal */
+	runReplays(): void;
+	translateX(value: Signal<number> | number): this;
+	translateY(value: Signal<number> | number): this;
+	scale(value: Signal<number> | number): this;
+	rotate(degrees: Signal<number> | number): this;
+	gesture(gesture: GestureBuilder): this;
+	animation(config: Partial<AnimationOptions>): this;
+	protected hasStateManagement(): boolean;
+	className(className: string): this;
+	classNames(classNames: string[]): this;
+	css(styles: React$1.CSSProperties): this;
+	style(style: React$1.CSSProperties): this;
+	props(props: Record<string, any>): this;
+	protected _transitionDuration: number;
+	protected _transitionEasing: string;
+	protected _transitionDelay: number;
+	protected _transitionProperties: string[];
+	/**
+	 * Apply CSS transition
+	 *
+	 * Overload 1: String syntax
+	 * Example: .transition('all 0.2s ease-in-out')
+	 *
+	 * Overload 2: Shorthand with parameters
+	 * Example: .transition('all', 200, 'ease-out')
+	 * Example: .transition('all', 200, 'ease-out', 50)
+	 */
+	transition(value: string): this;
+	transition(properties: string | string[], duration: number, easing?: string, delay?: number): this;
+	/**
+	 * Set transition duration in milliseconds
+	 * Example: .duration(200) → 200ms
+	 */
+	duration(ms: number): this;
+	/**
+	 * Set transition easing function
+	 * Example: .easing('ease-in-out')
+	 */
+	easing(value: "linear" | "ease" | "ease-in" | "ease-out" | "ease-in-out" | "spring" | string): this;
+	/** Alias of `.easing()`. `'spring'` becomes CSS `linear()`. */
+	ease(value: string): this;
+	/**
+	 * Set transition delay in milliseconds
+	 * Example: .delay(100) → 100ms delay
+	 */
+	delay(ms: number): this;
+	/**
+	 * Set which properties to transition
+	 * Example: .properties(['color', 'transform'])
+	 */
+	properties(props: string[]): this;
+	/**
+	 * Apply the built transition to the element
+	 */
+	protected _applyTransition(): void;
+	private replaceTransitionClass;
+	/**
+	 * CSS enter/exit preset. Compiles to `@keyframes` — no rAF.
+	 * @example Box().animate('fadeIn').duration(300).ease('spring')
+	 */
+	animate(preset: MotionPreset | string, options?: {
+		duration?: number;
+		ease?: string;
+		delay?: number;
+		from?: number | string;
+		stiffness?: number;
+		damping?: number;
+		mass?: number;
+	}): this;
+	animate(custom: CustomMotion): this;
+	/** CSS `linear()` spring. Works on `.animate()` and `.transition()` / `.hover()`. */
+	spring(options?: SpringOptions): this;
+	reducedMotion(mode?: "reduce" | "never"): this;
+	press(callback?: (builder: PseudoStateBuilder) => void | PseudoStateBuilder): this;
+	/**
+	 * Shortcut: `.hover(h => h.effect(name))`.
+	 * Named interaction effect on `:hover` (forward, float, grow, nudge, …).
+	 */
+	hoverEffect(name: string): this;
+	/**
+	 * Shortcut: `.press(p => p.effect(name))` (maps to `:active`).
+	 */
+	pressEffect(name: string): this;
+	/**
+	 * Shortcut: `.focus(f => f.effect(name))`.
+	 */
+	focusEffect(name: string): this;
+	/**
+	 * Shortcut: `.active(a => a.effect(name))`.
+	 */
+	activeEffect(name: string): this;
+	/**
+	 * Shortcut: `.groupHover(h => h.effect(name))`.
+	 */
+	groupHoverEffect(name: string): this;
+	focusVisible(): PseudoStateBuilder;
+	focusVisible(callback: PseudoStateFn): this;
+	stagger(ms: number): this;
+	/** Scroll-reveal: IntersectionObserver toggles `.fibo-inview`. */
+	reveal(preset?: string | {
+		preset?: string;
+		once?: boolean;
+		rootMargin?: string;
+		threshold?: number;
+	}, options?: {
+		once?: boolean;
+		rootMargin?: string;
+		threshold?: number;
+	}): this;
+	/** Alias of `.reveal()` for scroll-triggered presets. */
+	onScroll(preset?: string): this;
+	/** CSS `animation-timeline: view()` / `scroll()`; IntersectionObserver reveal is the fallback. */
+	scrollTimeline(kind?: "view" | "scroll"): this;
+	scrollProgress(): this;
+	smoothScroll(): this;
+	scrollSnap(axis?: "x" | "y" | "both"): this;
+	scrollSnapAlign(align?: "start" | "center" | "end"): this;
+	sticky(top?: number | string | boolean): this;
+	/**
+	 * Publish `--fibo-sticky-offset` on `:root` so `.anchor()` / `html` scroll-padding
+	 * clear this bar. Header uses the real bar height.
+	 */
+	protected publishStickyOffset(value: number | string): void;
+	viewTransition(name: string): this;
+	/** Default `:focus-visible` ring. Pass a callback to customize. */
+	focusRing(color?: string): this;
+	protected ensureInteractiveTransition(): void;
+	/**
+	 * Prepare resting styles + transition so pseudo-state longhands (bg/border/transform)
+	 * interpolate instead of snapping. Safe to call repeatedly from PseudoStateBuilder.
+	 * @internal
+	 */
+	prepareSmoothInteraction(properties: string[]): void;
+	/** @internal Convert inline background/border shorthands → longhands. */
+	promoteSurfaceLonghands(): void;
+	/** @internal Stamp translate3d(0,0,0) when no resting transform exists. */
+	ensureRestTransform(): void;
+	/**
+	 * Ensure the base element transitions the properties an interaction effect needs.
+	 * Expands an auto-managed transition; no-ops if the caller set `.transition(...)`
+	 * explicitly or a motion animation class is present.
+	 * @internal Used by PseudoStateBuilder.effect() and hover/press shortcuts.
+	 */
+	ensureEffectTransition(properties: string[]): void;
+	/**
+	 * Apply a theme to this node and descendants (CSS vars inherit).
+	 * Fluent: `.theme("noir")` | `.theme(noirTheme)` | `.theme(extendTheme(webTheme, {…}))`.
+	 * SSR-safe: class + inline vars on first paint (no useEffect).
+	 */
+	theme(input: ThemeInput): this;
+	/** Prefer dark/light system chrome for native controls under this subtree. */
+	colorScheme(scheme: "light" | "dark" | "light dark"): this;
+	hover(): PseudoStateBuilder;
+	hover(callback: PseudoStateFn): this;
+	/**
+	 * Paint for a `When` state. Hover / focus / active / visited / disabled
+	 * write a CSS pseudo on this node. `on` / `off` are for Checkbox and Switch.
+	 *
+	 * ```ts
+	 * Row().when(When.hover, (s) => s.bg('#c8ff00'))
+	 * ```
+	 */
+	when(state: When, style: WhenStyle): this;
+	focus(): PseudoStateBuilder;
+	focus(callback: PseudoStateFn): this;
+	active(): PseudoStateBuilder;
+	active(callback: PseudoStateFn): this;
+	visited(): PseudoStateBuilder;
+	visited(callback: PseudoStateFn): this;
+	disabledState(): PseudoStateBuilder;
+	disabledState(callback: PseudoStateFn): this;
+	focusWithin(): PseudoStateBuilder;
+	focusWithin(callback: PseudoStateFn): this;
+	firstChild(): PseudoStateBuilder;
+	firstChild(callback: PseudoStateFn): this;
+	lastChild(): PseudoStateBuilder;
+	lastChild(callback: PseudoStateFn): this;
+	groupHover(): PseudoStateBuilder;
+	groupHover(callback: PseudoStateFn): this;
+	groupFocus(): PseudoStateBuilder;
+	groupFocus(callback: PseudoStateFn): this;
+	groupActive(): PseudoStateBuilder;
+	groupActive(callback: PseudoStateFn): this;
+	groupFocusWithin(): PseudoStateBuilder;
+	groupFocusWithin(callback: PseudoStateFn): this;
+	group(): this;
+	protected _childFunction?: () => FiboChild | FiboChild[];
+	children(children: FiboChildren): this;
+	protected getClassName(): string;
+	protected getStyle(): React$1.CSSProperties;
+	protected processChildren(): React$1.ReactNode[];
+	protected getChildFunction(): (() => FiboChild | FiboChild[]) | undefined;
+	/**
+	 * @deprecated Builders are React elements. Returning or nesting the builder is enough.
+	 * `.build()` still assembles the host tree for older call sites.
+	 */
+	abstract build(): React$1.ReactElement;
+}
+type KnownKeys<T> = {
+	[K in keyof T]: string extends K ? never : number extends K ? never : K;
+} extends {
+	[_ in keyof T]: infer U;
+} ? U : never;
+type StyleBuilder<T> = T & LogicalAxes & {
+	[K in KnownKeys<React$1.CSSProperties>]-?: (value: React$1.CSSProperties[K]) => StyleBuilder<T>;
+} & React$1.ReactElement;
+interface SignalLike<T> {
+	value: T;
+	subscribe: (listener: (val: T) => void) => () => void;
+}
+declare class FluentValueBuilder<T> {
+	private _signal;
+	private _loading?;
+	private _error?;
+	private _builder?;
+	constructor(_signal: SignalLike<T>);
+	loading(component: React$1.ReactNode | (() => React$1.ReactNode)): this;
+	error(component: (error: Error | unknown) => React$1.ReactNode): this;
+	builder(fn: (value: T) => React$1.ReactNode): this;
+	children(fn: (value: T) => React$1.ReactNode): this;
+	build(): React$1.ReactElement;
+}
+export declare function ValueBuilder<T>(signal: SignalLike<T>): FluentValueBuilder<T>;
+type PresenceShow = boolean | BindableSignal<boolean>;
+interface PresenceProps {
+	show: PresenceShow;
+	enter?: MotionPreset | string;
+	exit?: MotionPreset | string;
+	duration?: number;
+	reducedMotion?: "reduce" | "never";
+	children?: React$1.ReactNode;
+}
+declare class PresenceBuilder extends FiboBuilder {
+	private _show;
+	private _enter;
+	private _exit;
+	constructor(show?: PresenceShow);
+	show(value: PresenceShow): this;
+	enter(preset: MotionPreset | string): this;
+	exit(preset: MotionPreset | string): this;
+	duration(ms: number): this;
+	build(): React$1.ReactElement;
+}
+declare const presenceBuilder: (show?: PresenceShow | undefined) => StyleBuilder<PresenceBuilder>;
+export declare function Presence(show?: PresenceShow): ReturnType<typeof presenceBuilder>;
+export declare function Presence(props: PresenceProps): React$1.ReactElement;
+export declare namespace Presence {
+	var displayName: string;
+}
+interface RevealProps {
+	preset?: string;
+	once?: boolean;
+	rootMargin?: string;
+	threshold?: number;
+	forceMotion?: boolean;
+	/** @deprecated Ignored — view-timeline never skips IO (was forcing fibo-inview on load). */
+	preferTimeline?: boolean;
+	/** CSS vars (`--fibo-dur`, `--fibo-ease`, `--fibo-delay`) for the reveal wrapper. */
+	style?: React$1.CSSProperties;
+	children?: React$1.ReactNode;
+}
+/** IntersectionObserver toggles `.fibo-inview`. Motion is CSS — no rAF. */
+export declare function Reveal({ preset, once, rootMargin, threshold, forceMotion, style, children, }: RevealProps): React$1.DetailedReactHTMLElement<{
+	ref: React$1.RefObject<HTMLDivElement>;
+	className: string;
+	style: React$1.CSSProperties | undefined;
+	"data-fibo-reveal": string;
+}, HTMLDivElement>;
+interface ScrollProgressProps {
+	children: React$1.ReactElement;
+}
+/** Binds `--fibo-progress` from scroll when `animation-timeline: scroll()` is missing. No rAF. */
+export declare function ScrollProgress({ children }: ScrollProgressProps): React$1.DetailedReactHTMLElement<{
+	ref: React$1.RefObject<HTMLDivElement>;
+	"data-fibo-scroll-progress": string;
+	style: {
+		display: "contents";
+	};
+}, HTMLDivElement>;
+type ScrollToOptions$1 = {
+	behavior?: ScrollBehavior;
+	block?: ScrollLogicalPosition;
+	/** Also set `location.hash` (in-page anchor navigation). */
+	hash?: boolean;
+};
+/**
+ * Smooth-scroll to an element id / selector / Element.
+ * Pass `hash: true` to update the URL hash (replaces the old site-only `goHash`).
+ */
+declare function scrollTo$1(target: string | Element, options?: ScrollToOptions$1): void;
+export declare function startViewTransition(update: () => void): void;
+export declare function supportsViewTimeline(): boolean;
+export declare function supportsScrollTimeline(): boolean;
+/**
+ * AUTO-GENERATED by scripts/gen-interaction-fx.mjs — do not edit by hand.
+ * Fiboui-owned interaction effects (Hover.css–inspired names, not a vendor dump).
+ */
+export declare const FIBO_INTERACTION_FX_CSS: string;
+/**
+ * Inject the full interaction-effect sheet once.
+ * Idempotent via StyleManager cache — must NOT use a module flag, or
+ * `endSsrRequest()` / `StyleManager.reset()` would skip re-injection on the
+ * next SSR request and drop FX CSS from the snapshot.
+ */
+export declare function ensureInteractionFxCss(): void;
+export declare function getMotionCss(): string;
+export declare function getCss(): string;
+/** `<style id="fibo-dynamic-styles">` HTML. Call **after** `renderToString` so rules are collected. */
+export declare function getStyleTag(): string;
+/**
+ * Reset the StyleManager singleton between SSR requests (Next.js / custom servers).
+ * Call after the response CSS has been captured when using `<FiboStyles />` mid-tree.
+ */
+export declare function endSsrRequest(): void;
+/**
+ * Inject collected CSS into a document. Place as a **later sibling** of the app
+ * so registrations from children run first during SSR.
+ */
+export declare function FiboStyles(): React$1.ReactElement;
+export declare function MotionStyles(): React$1.ReactElement;
+export type FiboPageBuild = () => FiboChild | React$1.ReactNode;
+type FiboPageMeta = {
+	title?: string;
+	description?: string;
+};
+export type FiboPageOptions = {
+	/** Append `<FiboStyles />` after the tree (SSR dynamic CSS). Default true. */
+	styles?: boolean;
+	/** SSR `<title>` / `<meta name="description">` (React 19 hoists into `<head>`). */
+	meta?: FiboPageMeta;
+};
+type FiboPageComponent = React$1.ComponentType & {
+	meta?: FiboPageMeta;
+};
+/**
+ * Next/Vite page helper — **zero JSX** in app code, SSR-safe.
+ *
+ * Next App Router still SSRs Client Components: HTML is rendered on the server,
+ * then hydrated. Import `fiboui/style.css` once from `app/layout.tsx` (or the
+ * Vite entry) so the base sheet is in the document on first paint.
+ *
+ * ```ts
+ * // app/page.tsx — Server Component (no 'use client')
+ * import { page, Column, Text } from 'fiboui'
+ *
+ * export default page(() =>
+ *   Column().gap(12).children([Text('Hello')])
+ * )
+ * ```
+ *
+ * App Router resolves `fiboui` via the `react-server` export (static builders).
+ * `build()` runs during RSC render so StyleManager rules exist before `<FiboStyles />`.
+ */
+export declare function page(build: FiboPageBuild, options?: FiboPageOptions): FiboPageComponent;
+/**
+ * Alias of `page()`. Prefer `export default page(() => …)` from a Server Component.
+ */
+export declare const createPage: typeof page;
+/**
+ * Wrap any builder / node with `FiboStyles` without JSX.
+ *
+ * ```ts
+ * export default function Home() {
+ *   return withFiboStyles(Column().children([Text('Hi')]))
+ * }
+ * ```
+ */
+export declare function withFiboStyles(child: FiboChild | React$1.ReactNode): React$1.ReactElement;
+type Constructor<T = any> = new (...args: any[]) => T;
+type Factory<T = any> = () => T;
+type Provider<T = any> = Constructor<T> | Factory<T> | T;
+type Token<T = any> = string | symbol | Constructor<T>;
+interface RouteDefinition {
+	path: string;
+	component: () => FiboBuilder;
+	meta?: Record<string, any>;
+}
+interface SidebarConfig {
+	label: string;
+	icon?: any;
+	path: string;
+	order?: number;
+}
+interface FiboContext {
+	registerService<T>(token: Token<T>, implementation: Provider<T>): void;
+	registerStore(store: unknown, name?: string): void;
+	getStore?<T = unknown>(name: string): T | undefined;
+	registerRoute(route: RouteDefinition): void;
+	registerSidebarItem(item: SidebarConfig): void;
+	registerTopbarAction(component: () => FiboBuilder): void;
+	registerOverlay(component: () => FiboBuilder): void;
+}
+type PluginSetup = (context: FiboContext) => void;
+interface FiboPlugin {
+	name: string;
+	version?: string;
+	setup: PluginSetup;
+	teardown?: PluginSetup;
+}
+export declare class FiboAppBuilder {
+	private _rootComponent;
+	private _rootElement;
+	private _plugins;
+	private _reactRoot;
+	private _installed;
+	use(plugin: FiboPlugin): this;
+	plugins(pluginsList: FiboPlugin[]): this;
+	root(component: React$1.ComponentType): this;
+	mount(elementId: string, options?: {
+		strict?: boolean;
+	}): () => void;
+	unmount(): void;
+	private build;
+}
+export declare const FiboApp: () => FiboAppBuilder;
+/** Turn a builder (or already-built node) into a React node. */
+export declare function toElement(node: FiboChild): React$1.ReactNode;
+/**
+ * Optional wrapper. Builders are already React elements:
+ *
+ * ```tsx
+ * function App() {
+ *   return Button('Save').onPress(save);
+ * }
+ * ```
+ */
+export declare function Fibo({ children }: {
+	children: FiboChild;
+}): React$1.ReactElement;
+/**
+ * Mount a page that returns a builder — no `.build()` on the root.
+ *
+ * ```ts
+ * function App() {
+ *   return Column().children([Text('Hi')]);
+ * }
+ * mount('#root', App);
+ * ```
+ */
+export declare function mount(target: string | Element, app: (() => FiboChild) | FiboChild, options?: {
+	strict?: boolean;
+}): Root;
+
+export {
+	Store as ReactiveStore,
+	scrollTo$1 as scrollTo,
+};
+
+export {};