fiboui 2.8.3 → 2.8.5

package/dist/structure.d.ts

@@ -1 +1,1345 @@
-export { Box, Card, List, ListTile, Table, Tags, Banner, Collapse, Grid, GridItem, AssetCard, ProfileCard, CollectionCard, ContentCard } from './index.js';
+// Generated by dts-bundle-generator v9.5.1
+
+import React$1 from 'react';
+import { CSSProperties, ReactElement, ReactNode } from 'react';
+
+type Buildable = {
+	/** @deprecated Builders are React elements; `.build()` is optional. */
+	build(): React$1.ReactNode;
+};
+type FiboChild = React$1.ReactNode | Buildable;
+type FiboChildren = FiboChild | readonly FiboChild[] | (() => FiboChild | readonly FiboChild[]);
+type FiboThemeName = "material" | "cupertino" | "web" | "noir";
+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 StatusType = "success" | "warning" | "error" | "info";
+declare const FIBO_BREAKPOINTS: {
+	readonly sm: 640;
+	readonly md: 768;
+	readonly lg: 1024;
+	readonly xl: 1280;
+};
+type BreakpointKey = keyof typeof FIBO_BREAKPOINTS;
+type Listener<T> = (value: T) => void;
+type Unsubscribe = () => void;
+interface Subscribable<T> {
+	subscribe(listener: Listener<T>): Unsubscribe;
+	subscribeEffect(effect: Effect): void;
+	unsubscribeEffect(effect: Effect): void;
+}
+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 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;
+}
+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;
+}
+declare abstract class GestureBuilder {
+	abstract wrap(children: React$1.ReactNode): React$1.ReactNode;
+}
+interface AnimationOptions {
+	duration?: number;
+	curve?: "linear" | "easeIn" | "easeOut" | "easeInOut" | "spring" | string;
+	damping?: number;
+	stiffness?: number;
+	velocity?: number;
+	mass?: number;
+	onComplete?: () => void;
+}
+interface Signal<T> {
+	spring(target: T, options?: Partial<AnimationOptions>): void;
+	animate(target: T, options?: Partial<AnimationOptions>): void;
+	snapTo(target: T, options?: Partial<AnimationOptions>): void;
+}
+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"
+];
+type InteractionEffectName = (typeof INTERACTION_EFFECTS)[number];
+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;
+}
+type CssFluentMethods = {
+	[K in keyof React$1.CSSProperties]-?: (value: React$1.CSSProperties[K] | number | string) => CssFluentProxy;
+} & {
+	/** Escape hatch: any CSS property (camel or kebab). */
+	css(property: string, value: string | number): CssFluentProxy;
+	/** Merge a raw style object. */
+	style(extra: React$1.CSSProperties): CssFluentProxy;
+};
+type CssFluentProxy = CssFluentMethods & LogicalAxes & {
+	/** Shorthand for `backgroundColor` (FiboBuilder / List / Checkbox state paints). */
+	bg(color: string): CssFluentProxy;
+	toStyle(): React$1.CSSProperties;
+	toCSSString(): string;
+};
+type CssFluentHost = {
+	setProp(prop: string, value: string | number): void;
+	mergeStyle(extra: React$1.CSSProperties): void;
+	toStyle(): React$1.CSSProperties;
+	toCSSString(): string;
+};
+declare class CssStyleStore implements CssFluentHost {
+	protected _style: React$1.CSSProperties;
+	/** Shorthand for `backgroundColor` (same as FiboBuilder / ListItemStyleBuilder). */
+	bg(color: string): this;
+	setProp(prop: string, value: string | number): void;
+	/** Flutter / RN: left + right. */
+	paddingHorizontal(value: number | string): this;
+	/** Flutter / RN: top + bottom. */
+	paddingVertical(value: number | string): this;
+	paddingX(value: number | string): this;
+	paddingY(value: number | string): this;
+	marginHorizontal(value: number | string): this;
+	marginVertical(value: number | string): this;
+	marginX(value: number | string): this;
+	marginY(value: number | string): this;
+	mergeStyle(extra: React$1.CSSProperties): void;
+	toStyle(): React$1.CSSProperties;
+	toCSSString(): string;
+}
+interface PseudoStateBuilder extends LogicalAxes {
+	boxShadow(value: string | number): this;
+}
+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);
+interface SpringOptions {
+	stiffness?: number;
+	damping?: number;
+	mass?: number;
+}
+declare const MOTION_PRESETS: readonly [
+	"fadeIn",
+	"fadeOut",
+	"fade",
+	"slideUp",
+	"slideDown",
+	"slideLeft",
+	"slideRight",
+	"scaleIn",
+	"scaleOut",
+	"scale",
+	"blurIn",
+	"blurOut",
+	"blur",
+	"pop",
+	"bounce"
+];
+type MotionPreset = (typeof MOTION_PRESETS)[number];
+interface CustomMotion {
+	from: Record<string, string | number>;
+	to: Record<string, string | number>;
+	duration?: number;
+	ease?: string;
+	delay?: number;
+	stiffness?: number;
+	damping?: number;
+	mass?: number;
+}
+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?
+];
+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;
+declare class BoxBuilder extends FiboBuilder {
+	children(children: FiboChildren): this;
+	props(value: Record<string, any>): this;
+	build(): React$1.ReactElement;
+}
+export declare const Box: () => StyleBuilder<BoxBuilder>;
+declare class CardBuilder extends FiboBuilder {
+	private _text;
+	private _subtitle?;
+	private _number?;
+	private _color?;
+	private _header?;
+	private _footer?;
+	private _as?;
+	text(value: string): this;
+	/** Alias of `.text()` — same slot as Banner/ListTile/Alert `.title()`. */
+	title(value: string): this;
+	subtitle(value: string): this;
+	number(value: string): this;
+	children(children: FiboChildren): this;
+	header(node: FiboChild): this;
+	footer(node: FiboChild): this;
+	as(tag: keyof HTMLElementTagNameMap | string): this;
+	props(value: Record<string, any>): this;
+	color(value: string): this;
+	build(): React$1.ReactElement;
+}
+export declare const Card: () => StyleBuilder<CardBuilder>;
+declare class ListItemStyleBuilder extends CssStyleStore {
+	padding(value: number | string): this;
+	paddingX(value: number | string): this;
+	paddingY(value: number | string): this;
+	/** SwiftUI-ish: `listRowInsets` */
+	insets(value: number | string): this;
+	bg(color: string): this;
+	/** SwiftUI-ish: `listRowBackground` */
+	background(color: string): this;
+	color(value: string): this;
+	rounded(value?: number | string): this;
+	border(value: number | string): this;
+	borderBottom(value: string): this;
+	/** Alias of `.boxShadow(...)` — full CSS `box-shadow` string or `0` → `none`. */
+	shadow(value: number | string): this;
+	boxShadow(value: number | string): this;
+	opacity(value: number): this;
+	/** Space after each row. */
+	spacing(value: number | string): this;
+	css(property: string, value: string | number): this;
+	style(extra: React$1.CSSProperties): this;
+}
+type ListVariant = "default" | "card" | "floating";
+declare class ListBuilder<T = any> extends FiboBuilder {
+	private _items;
+	/** Plain `signal(array)`. Read on each rebuild. */
+	private _source?;
+	/** `listSignal`. Rows subscribe by `_id`. The list shell only hears membership. */
+	private _liveList?;
+	private _renderItem?;
+	private _onItemPress?;
+	private _variant;
+	private _separator;
+	private _onEndReached?;
+	private _loading;
+	private _threshold;
+	private _containerHeight;
+	private _resetItemStyles;
+	private _direction;
+	private _customItemHover?;
+	private _customItemActive?;
+	private _customItemFocus?;
+	/** Universal row chrome — applies to every child wrapper. */
+	private _itemStyle?;
+	/** Kept and re-invoked on each rebuild (`List().items(fn)` / bindSignal). */
+	private _itemsFn?;
+	/** Placeholder when `items.length === 0` (plain array or empty `listSignal`). */
+	private _empty?;
+	/**
+	 * Entries to show.
+	 *
+	 * - **UI mode** (same as `.children`): `List().items([ListTile()…, Text(…)])`
+	 * - **Data mode**: `List().items(rows).renderItem((row) => ListTile().title(row.name))`
+	 * - **Live list**: `List().items(listSignal).renderItem((row) => ListTile().title(row.title))`
+	 * - **Live fn**: `List().items(() => todos.value).bindSignal(todos)` — fn re-runs on rebuild
+	 */
+	items(items: T[] | FiboChildren | BindableSignal<T[]> | (() => T[])): this;
+	/**
+	 * UI mode — any builders / nodes (ListTile, Text, Row, …).
+	 * Equivalent to `.items([...])` without `renderItem`.
+	 */
+	children(children: FiboChildren): this;
+	/** Shared path so `.children` and `.items` stay interchangeable for UI. */
+	private setListEntries;
+	/**
+	 * Map raw data from `.items(data)` → UI. Skip this when items are already
+	 * ListTile / Text / builders (use `.children` or `.items` alone).
+	 */
+	renderItem(fn: (item: T, index: number) => React$1.ReactNode): this;
+	/**
+	 * Same press for every row. The row is the target; the click reaches it
+	 * from the item. A row that needs its own action keeps that inside `renderItem`.
+	 *
+	 * ```ts
+	 * List().items(todos).onPress((todo) => toggle(todo.id)).renderItem((todo) => TodoItem(todo))
+	 * ```
+	 */
+	onPress(handler: (item: T, index: number) => void): this;
+	/** Alias of `.onPress()`. */
+	onTap(handler: (item: T, index: number) => void): this;
+	/**
+	 * Shown when there are no rows — empty array or empty `listSignal`.
+	 * Accepts a string, a node, a builder, or a factory that re-runs on rebuild.
+	 *
+	 * ```ts
+	 * List().items(todos).empty('No todos').renderItem((t) => Text(t.title))
+	 * List().items([]).empty(Text('Nothing'))
+	 * List().items(todos).empty(() => Text(`Count ${todos.length}`))
+	 * ```
+	 */
+	empty(content: FiboChild | (() => FiboChild)): this;
+	variant(variant: ListVariant): this;
+	separator(show?: boolean): this;
+	onEndReached(handler: () => void): this;
+	loading(isLoading: boolean): this;
+	threshold(value: number): this;
+	containerHeight(height: number): this;
+	resetItemStyles(reset?: boolean): this;
+	direction(dir: "horizontal" | "vertical"): this;
+	reset(): this;
+	/**
+	 * Universal row style (all children).
+	 * SwiftUI: `listRowBackground` / `listRowInsets` · Flutter: `ListTileTheme`.
+	 *
+	 * ```ts
+	 * List()
+	 *   .itemStyle((s) => s.padding(14).bg('#fff').rounded(12))
+	 *   .when(When.hover, (h) => h.bg('#f3f4f6'))
+	 *   .children([ListTile().title('A'), ListTile().title('B')])
+	 * ```
+	 */
+	itemStyle(style: React$1.CSSProperties | ((builder: ListItemStyleBuilder & CssFluentProxy) => void | ListItemStyleBuilder | CssFluentProxy)): this;
+	/** SwiftUI `listRowBackground` — shorthand for `.itemStyle(s => s.bg(color))`. */
+	itemBackground(color: string): this;
+	/** SwiftUI `listRowInsets` — shorthand for `.itemStyle(s => s.insets(value))`. */
+	itemInsets(value: number | string): this;
+	/**
+	 * Row paint for `When.hover` / `When.focus` / `When.active`.
+	 * Other states fall through to the node pseudo (the list box itself).
+	 */
+	when(state: When, style: WhenStyle): this;
+	private paintItem;
+	build(): React$1.ReactElement;
+}
+export declare const List: <T = any>() => StyleBuilder<ListBuilder<T>>;
+declare class ListTileBuilder extends FiboBuilder {
+	private _leading?;
+	private _title?;
+	private _subtitle?;
+	private _trailing?;
+	private _chevron;
+	private _divider;
+	private _dividerColor?;
+	private _onPress?;
+	private _href?;
+	private _disabled;
+	private _dense;
+	leading(node: FiboChild): this;
+	icon(node: FiboChild): this;
+	title(value: string | FiboChild): this;
+	subtitle(value: string | FiboChild): this;
+	trailing(node: FiboChild): this;
+	chevron(show?: boolean): this;
+	divider(show?: boolean, color?: string): this;
+	onPress(handler: () => void): this;
+	/** Flutter-style alias of `.onPress()`. */
+	onTap(handler: () => void): this;
+	href(url: string): this;
+	disabled(value?: boolean): this;
+	dense(value?: boolean): this;
+	build(): React$1.ReactElement;
+}
+export declare const ListTile: () => StyleBuilder<ListTileBuilder>;
+type TableVariant = "default" | "clean";
+type TableDensity = "compact" | "standard" | "relaxed";
+interface TableColumn<T = any> {
+	header: string;
+	accessor?: keyof T;
+	render?: (item: T) => React$1.ReactNode;
+	width?: string;
+	align?: "left" | "center" | "right";
+	/** When true, this header sorts even if the table is not `.sortable()`. `false` opts out. */
+	sortable?: boolean;
+}
+declare class TableBuilder<T = any> extends FiboBuilder {
+	private _data;
+	/** Plain `signal(array)`. Read on each rebuild. */
+	private _source?;
+	/** `listSignal`. Rows subscribe by `_id`. */
+	private _liveList?;
+	private _columns;
+	private _variant;
+	private _density;
+	private _striped;
+	private _width;
+	private _sortable;
+	data(items: T[] | BindableSignal<T[]>): this;
+	columns(cols: TableColumn<T>[]): this;
+	variant(variant: TableVariant): this;
+	density(density: TableDensity): this;
+	striped(enable?: boolean): this;
+	width(value: string | number): this;
+	/** Header clicks sort that column ascending, then descending (`aria-sort`). */
+	sortable(enable?: boolean): this;
+	build(): React$1.ReactElement;
+}
+export declare const Table: <T = any>() => StyleBuilder<TableBuilder<T>>;
+interface TagItem {
+	title: string;
+}
+declare class TagsBuilder extends FiboBuilder {
+	private _items;
+	/** Plain `signal(array)`. Read on each rebuild. */
+	private _source?;
+	/** `listSignal`. Tags subscribe by `_id`. */
+	private _liveList?;
+	constructor(items?: TagItem[]);
+	items(items: TagItem[] | BindableSignal<TagItem[]>): this;
+	build(): React$1.ReactElement;
+}
+export declare const Tags: (items?: TagItem[] | undefined) => StyleBuilder<TagsBuilder>;
+declare class BannerBuilder extends FiboBuilder {
+	private _status;
+	private _title;
+	private _subtitle?;
+	constructor(title?: string);
+	status(value: StatusType): this;
+	/** Docs alias: `.status()` is the Banner intent. */
+	intent(value: StatusType): this;
+	title(value: string): this;
+	subtitle(value: string): this;
+	children(children: FiboChildren): this;
+	build(): React$1.ReactElement;
+}
+export declare const Banner: (title?: string | undefined) => StyleBuilder<BannerBuilder>;
+declare class CollapseBuilder extends FiboBuilder {
+	_title: React$1.ReactNode | string;
+	_content: React$1.ReactNode;
+	_defaultExpanded: boolean;
+	_expanded?: boolean;
+	_onToggle?: (isOpen: boolean) => void;
+	title(value: React$1.ReactNode | string): this;
+	content(value: FiboChild): this;
+	/** Docs and fluent trees use `.children()`; keep it as the panel body. */
+	children(value: FiboChildren): this;
+	isOpen(value: boolean): this;
+	defaultOpen(value: boolean): this;
+	onToggle(handler: (isOpen: boolean) => void): this;
+	build(): React$1.ReactElement;
+}
+export declare const Collapse: () => StyleBuilder<CollapseBuilder>;
+type GridVariant = "standard" | "masonry" | "bento";
+type GridGap = "none" | "sm" | "md" | "lg" | "xl" | number;
+type GridCols = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type GridAutoFlow = "row" | "column" | "dense";
+interface ResponsiveCols {
+	sm?: GridCols;
+	md?: GridCols;
+	lg?: GridCols;
+	xl?: GridCols;
+}
+declare class GridBuilder extends FiboBuilder {
+	private _variant;
+	private _columns;
+	private _gap;
+	private _rowGap?;
+	private _columnGap?;
+	private _rows?;
+	private _templateColumns?;
+	private _templateRows?;
+	private _autoFlow?;
+	variant(v: GridVariant): this;
+	columns(cols: GridCols | ResponsiveCols): this;
+	rows(count: number): this;
+	gap(g: GridGap): this;
+	rowGap(g: GridGap | string | number): this;
+	columnGap(g: GridGap | string | number): this;
+	templateColumns(template: string): this;
+	/** CSS name — same as `.templateColumns()`, wins over numeric `.columns()`. */
+	gridTemplateColumns(template: string): this;
+	templateRows(template: string): this;
+	autoFlow(flow: GridAutoFlow): this;
+	build(): React$1.ReactElement;
+}
+declare class GridItemBuilder extends FiboBuilder {
+	private _colSpan?;
+	private _rowSpan?;
+	private _colStart?;
+	private _colEnd?;
+	private _rowStart?;
+	private _rowEnd?;
+	colSpan(span: number): this;
+	rowSpan(span: number): this;
+	colStart(start: number): this;
+	colEnd(end: number): this;
+	rowStart(start: number): this;
+	rowEnd(end: number): this;
+	build(): React$1.ReactElement;
+}
+export declare const Grid: () => StyleBuilder<GridBuilder>;
+export declare const GridItem: () => StyleBuilder<GridItemBuilder>;
+declare class AssetCardBuilder extends FiboBuilder {
+	private _image;
+	private _title;
+	private _price;
+	private _likes;
+	private _timeLeft?;
+	image(url: string): this;
+	title(text: string): this;
+	price(value: string | number): this;
+	likes(count: string | number): this;
+	timeLeft(time: string): this;
+	build(): React$1.ReactElement;
+}
+export declare const AssetCard: () => StyleBuilder<AssetCardBuilder>;
+declare class ProfileCardBuilder extends FiboBuilder {
+	private _banner;
+	private _avatar;
+	private _name;
+	private _handle;
+	private _stats;
+	banner(url: string): this;
+	avatar(url: string): this;
+	name(text: string): this;
+	handle(text: string): this;
+	stats(stats: {
+		items: string;
+		owners: string;
+		floor: string;
+	}): this;
+	build(): React$1.ReactElement;
+}
+export declare const ProfileCard: () => StyleBuilder<ProfileCardBuilder>;
+declare class CollectionCardBuilder extends FiboBuilder {
+	private _image;
+	private _title;
+	private _author;
+	private _items;
+	image(url: string): this;
+	title(text: string): this;
+	author(text: string): this;
+	items(text: string): this;
+	build(): React$1.ReactElement;
+}
+export declare const CollectionCard: () => StyleBuilder<CollectionCardBuilder>;
+declare class ContentCardBuilder extends FiboBuilder {
+	private _image?;
+	private _title?;
+	private _description?;
+	private _date?;
+	private _source?;
+	image(url: string): this;
+	title(text: string): this;
+	description(text: string): this;
+	date(text: string): this;
+	source(text: string): this;
+	build(): React$1.ReactElement;
+}
+export declare const ContentCard: () => StyleBuilder<ContentCardBuilder>;
+
+export {};