@justanarthur/modo-ui 0.5.0 → 0.6.0-canary.0

package/dist/lib/field-classes.d.ts

@@ -0,0 +1,144 @@
+import { MouseEvent, RefObject } from "react";
+type ShapeVariant = "pill" | "rounded";
+type SizeVariant = "default" | "compact";
+interface SizeClasses {
+	/** The variant these classes belong to — handy for conditionals. */
+	variant: SizeVariant;
+	/** Bounded control height — buttons, inputs, select triggers, subtle tabs —
+	*  AND list/menu rows (select options, dropdown, checkbox and radio rows).
+	*  One token by design: a popup row lines up with the trigger that opened
+	*  it because they share this height. */
+	control: string;
+	/** `control` as a number, for consumers that need raw pixels. */
+	controlHeight: number;
+	/** Tab trigger height inside a padded segmented list. Sized so
+	*  `segmentPad` + `segmentItem` adds back up to the control height —
+	*  the segmented control's outer box stays on the same ladder. */
+	segmentItem: string;
+	/** Padding of the segmented list around its tabs. */
+	segmentPad: string;
+	/** Body text inside controls. */
+	text: string;
+	/** Horizontal padding of bounded controls (select trigger, inputs). */
+	px: string;
+	/** Horizontal padding of list/menu rows, which sit inside a padded popup
+	*  or group and need less inset than a bounded control. */
+	itemPx: string;
+	/** Gap between an icon / control glyph and its label, and between
+	*  neighbouring controls in a row (toolbars, filter bars, button
+	*  clusters). Density is spacing as much as control height, so the
+	*  compact step halves it. */
+	gap: string;
+	/** Glyph size in px: leading/trailing icons inside controls, and the
+	*  checkbox square / radio circle. */
+	icon: number;
+}
+import { ClassProp as ClassProp_wz9o0r } from "class-variance-authority/types";
+/**
+* The ringed box of a text field. It steps from rest to a muted fill when lit
+* (hovered, or `data-active` from a group's fluid hover) to the card fill
+* when focused. `data-invalid` keeps a destructive ring in every state and
+* tints the lit fill; `data-disabled` frames and dims it; `data-readonly`
+* shows the ring when lit or focused but never lifts the fill. Put it on the
+* element around the control and stamp the data attributes; Base UI parts
+* stamp `data-invalid` / `data-disabled` themselves.
+*/
+declare const fieldVariants: (props?: ({
+	variant?: "borderless" | "bordered" | null | undefined;
+} & ClassProp_wz9o0r) | undefined) => string;
+/** A leading icon inside a `fieldVariants` box: muted at rest, it darkens and thickens with the field. Pass `strokeWidth={1.5}`. */
+declare const fieldIconClasses = "shrink-0 text-muted-foreground transition-[color,stroke-width] duration-fast group-hover/field:text-foreground group-hover/field:stroke-[2] group-data-[active]/field:text-foreground group-data-[active]/field:stroke-[2] group-focus-within/field:text-foreground group-focus-within/field:stroke-[2]";
+/**
+* Content beside a field's text (an adornment): muted, held to the ladder's
+* glyph size, and lit with the field like a leading icon. Strings read as a
+* prefix or a unit.
+*/
+declare const fieldAdornmentClasses = "flex shrink-0 items-center whitespace-nowrap text-muted-foreground transition-[color] duration-fast group-hover/field:text-foreground group-data-[active]/field:text-foreground group-focus-within/field:text-foreground";
+/** Glyph size for an adornment's icons, per ladder step (16px default, 14px compact). */
+declare const FIELD_ADORNMENT_ICON: Record<SizeVariant, string>;
+/**
+* A small icon button inside a field box (a password reveal, a clear, a
+* stepper): 4px inside the ring on every side (28px in a 36px field, 20px in
+* a 28px one), its negative margin taking back the box's inset so the gap to
+* the edge matches the gap above and below.
+*/
+declare const FIELD_ACTION: Record<SizeVariant, string>;
+/** A field action's box alone, without `FIELD_ACTION`'s margins, for actions set side by side (a stepper pair). */
+declare const FIELD_ACTION_BOX: Record<SizeVariant, string>;
+/** The margin that pulls the last of several side-by-side actions to 4px inside the ring. */
+declare const FIELD_ACTION_END: Record<SizeVariant, string>;
+/** A field action's corners, concentric with the box's (8px box, 4px gap) or round in pill mode. */
+declare const FIELD_ACTION_RADIUS: Record<ShapeVariant, string>;
+/** The classes every field action shares, beside its `FIELD_ACTION` size and radius. */
+declare const fieldActionClasses = "relative inline-flex shrink-0 cursor-pointer items-center justify-center text-muted-foreground outline-none transition-[color,background-color,opacity] duration-fast hover:bg-hover hover:text-foreground active:bg-active focus-visible:ring-1 focus-visible:ring-focus-ring disabled:pointer-events-none disabled:opacity-50 data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+/** Horizontal inset of a field box. */
+declare const FIELD_PX: Record<SizeVariant, string>;
+/** Left inset of the text around a field (label, description, error), so it lines up with the text inside the box. */
+declare const FIELD_TEXT_INSET: Record<SizeVariant, string>;
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
+import { Context as Context_rri5bl2 } from "react";
+/**
+* What every text field's box takes. Items re-declare these members in their
+* own props interface (the docs read only same-file members), with this prose.
+*/
+interface FieldBoxOptions {
+	/** Framed at rest, or invisible until hovered or focused. */
+	variant: FieldVariant;
+	/** Turns the field destructive. */
+	invalid?: boolean;
+	/** Frames and dims the field. */
+	disabled?: boolean;
+	/** Lit from outside, e.g. a group's fluid hover. */
+	active?: boolean;
+	/** Shows the value without letting it change: the ring answers, the fill never lifts. */
+	readOnly?: boolean;
+	/** Marks the control required (`required` on the control). */
+	required?: boolean;
+	/** Pins the field to one step of the size ladder. Defaults to the surrounding SizeProvider. */
+	size?: SizeVariant;
+}
+/** What a field wrapper hands to the control it holds. */
+interface FieldState {
+	/** Lit by a group's fluid hover. */
+	active: boolean;
+	invalid: boolean;
+	disabled: boolean;
+	readOnly?: boolean;
+	required?: boolean;
+}
+/**
+* State a field wrapper (Field, InputGroup.Field) hands to whatever control
+* it holds: lit by the group's fluid hover, its error, its disabled,
+* read-only and required state. `useFieldBox` reads it, so any field built on
+* the box joins in; the control's own props win.
+*/
+declare const FieldStateContext: Context_rri5bl2<FieldState | null>;
+/** The surrounding field's state, or `null` outside one. */
+declare function useFieldState(): FieldState | null;
+/**
+* The box around a text field's control: the field ladder in the chosen
+* variant, the state attributes it reads, the shape's input radius and the
+* horizontal inset. Spread `props` on the element around the control (or the
+* control itself, for a button field); the height stays with the item, from
+* the returned `size`. Inside a Field or InputGroup.Field, unset `active` / `invalid` /
+* `disabled` / `readOnly` / `required` come from the field (`FieldStateContext`).
+*/
+declare function useFieldBox({ variant, invalid, disabled, active, readOnly, required, size }: FieldBoxOptions): {
+	size: SizeClasses;
+	/** Resolved with the field's state, for the control's `aria-invalid` / `disabled` / `readOnly` / `required`. */
+	invalid: boolean;
+	disabled: boolean;
+	readOnly: boolean;
+	required: boolean | undefined;
+	props: {
+		"data-active": true | undefined;
+		"data-invalid": true | undefined;
+		"data-disabled": true | undefined;
+		"data-readonly": true | undefined;
+		className: string;
+	};
+};
+/** A press anywhere in the box (icon, padding) focuses the control, without disturbing the control's own caret placement. */
+declare function focusControlOnPress(control: RefObject<HTMLElement | null>): (e: MouseEvent) => void;
+export { FIELD_ACTION, FIELD_ACTION_BOX, FIELD_ACTION_END, FIELD_ACTION_RADIUS, FIELD_ADORNMENT_ICON, FIELD_PX, FIELD_TEXT_INSET, FieldBoxOptions, FieldState, FieldStateContext, FieldVariant, fieldActionClasses, fieldAdornmentClasses, fieldIconClasses, fieldVariants, focusControlOnPress, useFieldBox, useFieldState };

package/dist/lib/field-classes.js

@@ -0,0 +1,40 @@
+import {
+  FieldStateContext2,
+  useFieldState2,
+  useFieldBox2,
+  focusControlOnPress2
+} from "../shared/components-6zng858q.js";
+import {
+  fieldVariants2,
+  fieldIconClasses2,
+  fieldAdornmentClasses2,
+  FIELD_ADORNMENT_ICON2,
+  FIELD_ACTION2,
+  FIELD_ACTION_BOX2,
+  FIELD_ACTION_END2,
+  FIELD_ACTION_RADIUS2,
+  fieldActionClasses2,
+  FIELD_PX2,
+  FIELD_TEXT_INSET2
+} from "../shared/components-124epb7f.js";
+import"../shared/components-h83az0bz.js";
+import"../shared/components-34txk9rj.js";
+import"../shared/components-78x40gee.js";
+import"../shared/components-jcnjay5g.js";
+export {
+  FIELD_ACTION2 as FIELD_ACTION,
+  FIELD_ACTION_BOX2 as FIELD_ACTION_BOX,
+  FIELD_ACTION_END2 as FIELD_ACTION_END,
+  FIELD_ACTION_RADIUS2 as FIELD_ACTION_RADIUS,
+  FIELD_ADORNMENT_ICON2 as FIELD_ADORNMENT_ICON,
+  FIELD_PX2 as FIELD_PX,
+  FIELD_TEXT_INSET2 as FIELD_TEXT_INSET,
+  FieldStateContext2 as FieldStateContext,
+  fieldActionClasses2 as fieldActionClasses,
+  fieldAdornmentClasses2 as fieldAdornmentClasses,
+  fieldIconClasses2 as fieldIconClasses,
+  fieldVariants2 as fieldVariants,
+  focusControlOnPress2 as focusControlOnPress,
+  useFieldBox2 as useFieldBox,
+  useFieldState2 as useFieldState
+};

package/dist/lib/field-variants.d.ts

@@ -0,0 +1,47 @@
+type ShapeVariant = "pill" | "rounded";
+type SizeVariant = "default" | "compact";
+import { ClassProp as ClassProp_wz9o0r } from "class-variance-authority/types";
+/**
+* The ringed box of a text field. It steps from rest to a muted fill when lit
+* (hovered, or `data-active` from a group's fluid hover) to the card fill
+* when focused. `data-invalid` keeps a destructive ring in every state and
+* tints the lit fill; `data-disabled` frames and dims it; `data-readonly`
+* shows the ring when lit or focused but never lifts the fill. Put it on the
+* element around the control and stamp the data attributes; Base UI parts
+* stamp `data-invalid` / `data-disabled` themselves.
+*/
+declare const fieldVariants: (props?: ({
+	variant?: "borderless" | "bordered" | null | undefined;
+} & ClassProp_wz9o0r) | undefined) => string;
+/** A leading icon inside a `fieldVariants` box: muted at rest, it darkens and thickens with the field. Pass `strokeWidth={1.5}`. */
+declare const fieldIconClasses = "shrink-0 text-muted-foreground transition-[color,stroke-width] duration-fast group-hover/field:text-foreground group-hover/field:stroke-[2] group-data-[active]/field:text-foreground group-data-[active]/field:stroke-[2] group-focus-within/field:text-foreground group-focus-within/field:stroke-[2]";
+/**
+* Content beside a field's text (an adornment): muted, held to the ladder's
+* glyph size, and lit with the field like a leading icon. Strings read as a
+* prefix or a unit.
+*/
+declare const fieldAdornmentClasses = "flex shrink-0 items-center whitespace-nowrap text-muted-foreground transition-[color] duration-fast group-hover/field:text-foreground group-data-[active]/field:text-foreground group-focus-within/field:text-foreground";
+/** Glyph size for an adornment's icons, per ladder step (16px default, 14px compact). */
+declare const FIELD_ADORNMENT_ICON: Record<SizeVariant, string>;
+/**
+* A small icon button inside a field box (a password reveal, a clear, a
+* stepper): 4px inside the ring on every side (28px in a 36px field, 20px in
+* a 28px one), its negative margin taking back the box's inset so the gap to
+* the edge matches the gap above and below.
+*/
+declare const FIELD_ACTION: Record<SizeVariant, string>;
+/** A field action's box alone, without `FIELD_ACTION`'s margins, for actions set side by side (a stepper pair). */
+declare const FIELD_ACTION_BOX: Record<SizeVariant, string>;
+/** The margin that pulls the last of several side-by-side actions to 4px inside the ring. */
+declare const FIELD_ACTION_END: Record<SizeVariant, string>;
+/** A field action's corners, concentric with the box's (8px box, 4px gap) or round in pill mode. */
+declare const FIELD_ACTION_RADIUS: Record<ShapeVariant, string>;
+/** The classes every field action shares, beside its `FIELD_ACTION` size and radius. */
+declare const fieldActionClasses = "relative inline-flex shrink-0 cursor-pointer items-center justify-center text-muted-foreground outline-none transition-[color,background-color,opacity] duration-fast hover:bg-hover hover:text-foreground active:bg-active focus-visible:ring-1 focus-visible:ring-focus-ring disabled:pointer-events-none disabled:opacity-50 data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
+/** Horizontal inset of a field box. */
+declare const FIELD_PX: Record<SizeVariant, string>;
+/** Left inset of the text around a field (label, description, error), so it lines up with the text inside the box. */
+declare const FIELD_TEXT_INSET: Record<SizeVariant, string>;
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
+export { FIELD_ACTION, FIELD_ACTION_BOX, FIELD_ACTION_END, FIELD_ACTION_RADIUS, FIELD_ADORNMENT_ICON, FIELD_PX, FIELD_TEXT_INSET, FieldVariant, fieldActionClasses, fieldAdornmentClasses, fieldIconClasses, fieldVariants };

package/dist/lib/field-variants.js

@@ -0,0 +1,26 @@
+import {
+  fieldVariants2,
+  fieldIconClasses2,
+  fieldAdornmentClasses2,
+  FIELD_ADORNMENT_ICON2,
+  FIELD_ACTION2,
+  FIELD_ACTION_BOX2,
+  FIELD_ACTION_END2,
+  FIELD_ACTION_RADIUS2,
+  fieldActionClasses2,
+  FIELD_PX2,
+  FIELD_TEXT_INSET2
+} from "../shared/components-124epb7f.js";
+export {
+  FIELD_ACTION2 as FIELD_ACTION,
+  FIELD_ACTION_BOX2 as FIELD_ACTION_BOX,
+  FIELD_ACTION_END2 as FIELD_ACTION_END,
+  FIELD_ACTION_RADIUS2 as FIELD_ACTION_RADIUS,
+  FIELD_ADORNMENT_ICON2 as FIELD_ADORNMENT_ICON,
+  FIELD_PX2 as FIELD_PX,
+  FIELD_TEXT_INSET2 as FIELD_TEXT_INSET,
+  fieldActionClasses2 as fieldActionClasses,
+  fieldAdornmentClasses2 as fieldAdornmentClasses,
+  fieldIconClasses2 as fieldIconClasses,
+  fieldVariants2 as fieldVariants
+};

package/dist/lib/fluid-hover-highlight.d.ts

@@ -0,0 +1,112 @@
+import { Transition } from "motion/react";
+import { Dispatch, MutableRefObject, SetStateAction } from "react";
+interface ItemRect {
+	top: number;
+	height: number;
+	left: number;
+	width: number;
+}
+interface UseFluidHoverReturn {
+	activeIndex: number | null;
+	setActiveIndex: Dispatch<SetStateAction<number | null>>;
+	itemRects: ItemRect[];
+	/**
+	* True once every registered item has been measured and no remeasure is
+	* pending, i.e. `itemRects` describes the current item set. Gate absolutely
+	* positioned overlays on it: an overlay that mounts against a rect a later
+	* pass still corrects animates from the wrong place to the right one, which
+	* reads as the highlight sliding in from another row.
+	*/
+	isMeasured: boolean;
+	sessionRef: MutableRefObject<number>;
+	handlers: {
+		onMouseMove: (e: React.MouseEvent) => void;
+		onMouseEnter: () => void;
+		onMouseLeave: () => void;
+		/**
+		* Routes a click that lands between items (a gap, the padding, past the
+		* last row) to the highlighted item, so the highlight and the click agree:
+		* what is lit is what a click hits. A click inside an item is left to the
+		* item. Disabled items (`isItemDisabled`) are never activated.
+		*/
+		onClick: (e: React.MouseEvent) => void;
+	};
+	registerItem: (index: number, element: HTMLElement | null) => void;
+	/**
+	* Invalidates the published rects and runs the hook's coalesced measurement
+	* pass again, holding `isMeasured` false until it settles. Reach for it when
+	* the rects may be wrong and showing an overlay against them would misplace
+	* it: a popup that stays mounted between opens keeps its items registered,
+	* so nothing else would notice that its rects were taken while it was
+	* hidden. Registration, item resize, and container resize already trigger
+	* a pass; do not call this on `children` changes.
+	*/
+	remeasure: () => void;
+	/**
+	* Re-reads the rects synchronously, keeping `isMeasured` as it is. Only for
+	* layout that moves the rows under a visible overlay frame by frame (the
+	* accordion re-measures inside its height animation). Everything else
+	* wants `remeasure`, or nothing.
+	*/
+	measureItems: () => void;
+}
+import { JSX as JSX_1kxb } from "react";
+/** What the highlight reads off the hook: the highlighted index, the
+*  measured rects, whether they are current, and the pointer session. */
+type FluidHoverSource = Pick<UseFluidHoverReturn, "activeIndex" | "itemRects" | "isMeasured" | "sessionRef">;
+interface HighlightFromHook {
+	/** The hook's return value. The highlight sits on
+	*  `itemRects[activeIndex]` once `isMeasured`, and re-keys on the session. */
+	hover: FluidHoverSource;
+	/** Keep the list's state but show nothing (a closed popup, hover switched
+	*  off). Runs the exit fade. */
+	hidden?: boolean;
+	rect?: never;
+	session?: never;
+}
+interface HighlightFromRect {
+	/** For lists that resolve their own rect (the sidebar's unified scope):
+	*  the rect to sit on, in the container's coordinate space. `null` hides
+	*  the highlight (it fades out on `spring.fast.exit`). */
+	rect: ItemRect | null;
+	/** `sessionRef.current` from `useFluidHover`. It increments when the
+	*  cursor enters the container, which re-keys the highlight so it fades in
+	*  at `from ?? rect` instead of sliding over from wherever it was last. */
+	session: number;
+	hover?: never;
+	hidden?: never;
+}
+type FluidHoverHighlightProps = (HighlightFromHook | HighlightFromRect) & {
+	/** Where a fresh session fades in from. A dropdown passes its checked row,
+	*  a nav menu its active route. Defaults to the rect itself. */
+	from?: ItemRect | null;
+	/** Radius, z-index, anything else. Merged onto
+	*  `absolute bg-hover pointer-events-none`. */
+	className?: string;
+	/** The positional spring. Defaults to `spring.fast`. Pass `false` to snap
+	*  to the new rect with no travel (a layout reflow that moved the rows
+	*  underneath, not a hover change). The opacity fade is always 0.08s. */
+	transition?: Transition | false;
+};
+/** A measured rect as animation targets: position as a transform, size as
+*  layout. Exported for the unit test. */
+declare function toTarget(rect: ItemRect): {
+	x: number;
+	y: number;
+	width: number;
+	height: number;
+};
+/**
+* Resolves the positional transition. Reduced motion keeps the opacity fade
+* and drops the travel, per the motion guidelines: fewer and gentler, not
+* none. Exported for the unit test.
+*/
+declare function resolveHighlightTransition(transition: Transition | false | undefined, reduceMotion: boolean): Transition;
+/** The rect and session a set of props resolves to. Exported for the test. */
+declare function resolveHighlightSource(props: FluidHoverHighlightProps): {
+	rect: ItemRect | null;
+	session: number;
+};
+type Element_12xgc = JSX_1kxb["Element"];
+declare function FluidHoverHighlight(props: FluidHoverHighlightProps): Element_12xgc;
+export { FluidHoverHighlight, FluidHoverHighlightProps, FluidHoverSource, resolveHighlightSource, resolveHighlightTransition, toTarget };

package/dist/lib/fluid-hover-highlight.js

@@ -0,0 +1,17 @@
+import {
+  toTarget2,
+  resolveHighlightTransition2,
+  resolveHighlightSource2,
+  FluidHoverHighlight2
+} from "../shared/components-qdm3yh26.js";
+import"../shared/components-pw06rbxq.js";
+import"../shared/components-awra5sff.js";
+import"../shared/components-de99ykt7.js";
+import"../shared/components-3ey0hzpb.js";
+import"../shared/components-jcnjay5g.js";
+export {
+  FluidHoverHighlight2 as FluidHoverHighlight,
+  resolveHighlightSource2 as resolveHighlightSource,
+  resolveHighlightTransition2 as resolveHighlightTransition,
+  toTarget2 as toTarget
+};

package/dist/lib/focus-ring.d.ts

@@ -0,0 +1,18 @@
+type ShapeVariant = "pill" | "rounded";
+interface ItemRect {
+	top: number;
+	height: number;
+	left: number;
+	width: number;
+}
+import { JSX as JSX_1kxb2 } from "react";
+interface FocusRingProps {
+	/** The focused row's rect in the panel's coordinates; nothing while none has keyboard focus. */
+	rect: ItemRect | null | undefined;
+	/** Pins the radius to one shape (popups stay `rounded`); defaults to the surrounding ShapeProvider. */
+	shape?: ShapeVariant;
+}
+type Element_12xgc2 = JSX_1kxb2["Element"];
+/** The keyboard ring: 2px outside the focused row, springing between rows. */
+declare function FocusRing({ rect, shape }: FocusRingProps): Element_12xgc2;
+export { FocusRing, FocusRingProps };

package/dist/lib/focus-ring.js

@@ -0,0 +1,10 @@
+import {
+  FocusRing2
+} from "../shared/components-8nwsqjn8.js";
+import"../shared/components-de99ykt7.js";
+import"../shared/components-3ey0hzpb.js";
+import"../shared/components-78x40gee.js";
+import"../shared/components-jcnjay5g.js";
+export {
+  FocusRing2 as FocusRing
+};

package/dist/lib/goo-indicator.d.ts

@@ -0,0 +1,46 @@
+import { Transition } from "motion/react";
+import { ReactNode } from "react";
+interface ItemRect {
+	top: number;
+	height: number;
+	left: number;
+	width: number;
+}
+import { JSX as JSX_1kxb } from "react";
+declare function union(a: ItemRect | null, b: ItemRect): ItemRect;
+interface GooLayerProps {
+	/** Filter on: the shapes melt into one. Off at rest. */
+	active: boolean;
+	/** Blur in px: the shapes' radius times `GOO_BLUR_RATIO`. */
+	blur: number;
+	/** The layer's box in the container's coordinates, covering every shape; padded for the blur here. */
+	box: ItemRect | null;
+	/** The shapes' classes (a bg token, a radius): the melted result is filled with their background. */
+	fill: string;
+	/** The shapes, positioned in the container's coordinates. */
+	children?: ReactNode;
+}
+type Element_12xgc = JSX_1kxb["Element"];
+/** A box of shapes that melt into one while `active`. The filter's region follows the box, so keep it tight. */
+declare function GooLayer({ active, blur, box, fill, children }: GooLayerProps): Element_12xgc;
+interface GooIndicatorProps {
+	/** The rect to sit on, in the container's coordinates (as `useFluidHover` measures them). */
+	rect: ItemRect;
+	/** Where it first appears; it then travels to `rect`. Defaults to `rect`. */
+	from?: ItemRect | null;
+	/** Fill and radius classes: a bg token and the shape's radius. */
+	className?: string;
+	/** Shadow class. While it melts, the shapes are drawn again beneath the goo with it, since the filter flattens shadows. */
+	shadow?: string;
+	/** The travel: a spring tier. `false` snaps (a reflow, reduced motion). Defaults to `spring.moderate`. */
+	transition?: Transition | false;
+	/** Opacity of the whole indicator, faded on `spring.fast`. Defaults to `1`. */
+	opacity?: number;
+}
+/**
+* An indicator that travels between items with a liquid neck. Render it in the
+* items' `relative` container, beneath them: the items' text stays above it,
+* unfiltered.
+*/
+declare function GooIndicator({ rect, from, className, shadow, transition, opacity }: GooIndicatorProps): Element_12xgc;
+export { GooIndicator, GooIndicatorProps, GooLayer, GooLayerProps, union };

package/dist/lib/goo-indicator.js

@@ -0,0 +1,14 @@
+import {
+  union2,
+  GooLayer2,
+  GooIndicator2
+} from "../shared/components-pw06rbxq.js";
+import"../shared/components-awra5sff.js";
+import"../shared/components-de99ykt7.js";
+import"../shared/components-3ey0hzpb.js";
+import"../shared/components-jcnjay5g.js";
+export {
+  GooIndicator2 as GooIndicator,
+  GooLayer2 as GooLayer,
+  union2 as union
+};

package/dist/lib/icon-context.d.ts

@@ -0,0 +1,30 @@
+import { ComponentType, ReactNode } from "react";
+import { JSX as JSX_1kxb } from "react";
+interface IconComponentProps {
+	size?: number | string;
+	strokeWidth?: number | string;
+	className?: string;
+}
+type IconComponent = ComponentType<IconComponentProps>;
+type IconName = "chevron-right" | "chevron-down" | "x" | "copy" | "menu" | "dot" | "monitor" | "sun" | "moon" | "rectangle-horizontal" | "circle" | "square-library" | "clock" | "star" | "settings" | "plus" | "arrow-left" | "arrow-right" | "arrow-up" | "arrow-down" | "search" | "loader" | "users" | "lock" | "mail" | "bell" | "shield" | "palette" | "lightbulb" | "rocket" | "heart" | "paintbrush" | "brain" | "globe" | "user" | "image" | "link" | "check" | "rotate-ccw" | "play" | "pause" | "pipette" | "home" | "message-circle" | "inbox" | "pencil" | "scaling" | "skip-forward" | "corner-down-right" | "corner-down-left" | "panel-left" | "panel-left-dashed" | "panel-right" | "panel-right-dashed" | "chevrons-up-down" | "more-horizontal" | "more-vertical" | "calendar" | "folder" | "sliders-horizontal" | "chevron-left" | "chevron-up" | "chevrons-left" | "chevrons-right" | "arrow-up-down" | "circle-alert" | "triangle-alert" | "circle-check" | "info" | "circle-question-mark" | "trash" | "eye" | "eye-off" | "timer" | "arrow-right-from-line" | "arrow-right-to-line" | "funnel-x" | "flag" | "loader-circle" | "minus" | "upload" | "file";
+declare const defaultIcons: Record<IconName, IconComponent>;
+/**
+* Returns a single icon component for the given name.
+* Falls back to the default (Lucide) set if no provider is present.
+*/
+declare function useIcon(name: IconName): IconComponent;
+/**
+* Returns the full icon map.
+* Falls back to the default (Lucide) set if no provider is present.
+*/
+declare function useIcons(): Record<IconName, IconComponent>;
+type Element_12xgc = JSX_1kxb["Element"];
+/**
+* Swap some or all icons for components from another library.
+* Names left out of `icons` keep their default (Lucide) component.
+*/
+declare function IconProvider({ children, icons }: {
+	children: ReactNode;
+	icons?: Partial<Record<IconName, IconComponent>>;
+}): Element_12xgc;
+export { IconComponent, IconComponentProps, IconName, IconProvider, defaultIcons, useIcon, useIcons };

package/dist/lib/icon-context.js

@@ -0,0 +1,12 @@
+import {
+  defaultIcons2,
+  useIcon2,
+  useIcons2,
+  IconProvider2
+} from "../shared/components-jqpefjsn.js";
+export {
+  IconProvider2 as IconProvider,
+  defaultIcons2 as defaultIcons,
+  useIcon2 as useIcon,
+  useIcons2 as useIcons
+};

package/dist/lib/inert.d.ts

@@ -0,0 +1,9 @@
+/** Spread onto an element to make it inert while `on`. */
+declare function inertProps(on: boolean): {
+	inert: boolean;
+} | {
+	inert?: undefined;
+};
+/** A ref callback that makes its element inert for good. */
+declare function markInert(el: HTMLElement | null): void;
+export { inertProps, markInert };

package/dist/lib/inert.js

@@ -0,0 +1,8 @@
+import {
+  inertProps2,
+  markInert2
+} from "../shared/components-z3v0n0de.js";
+export {
+  inertProps2 as inertProps,
+  markInert2 as markInert
+};

package/dist/lib/morph-layers.d.ts

@@ -0,0 +1,93 @@
+import { ReactNode, Ref } from "react";
+import { RefObject } from "react";
+import { MutableRefObject as MutableRefObject_8z5kms } from "react";
+import { MotionValue as MotionValue_d5wxmj } from "motion/react";
+type MorphSide = "top" | "right" | "bottom" | "left";
+type MorphFrom = "trigger" | "pointer" | "center" | MorphSide | RefObject<HTMLElement | null>;
+type MorphEffect = "goo" | "morph" | "slide" | "fade";
+type MorphTier = "moderate" | "slow";
+interface MorphOptions {
+	/** Where the surface grows from. */
+	from?: MorphFrom;
+	/** How it gets there. */
+	effect?: MorphEffect;
+	/** Hide the source while open, so it reads as becoming the overlay. */
+	hideSource?: boolean;
+	/** Spring tier. */
+	tier?: MorphTier;
+	/** Overrides `effect` (and `from`) for the close only, read as it starts: a swiped sheet slides on off its edge. */
+	exit?: {
+		effect: "slide" | "fade";
+		from?: MorphFrom;
+	};
+	/**
+	* Shows or hides at once while this returns true for the popup (Base UI's
+	* `data-instant` hand-off between grouped tooltips). Checked as a run
+	* starts and on every frame.
+	*/
+	instant?: (popup: HTMLElement) => boolean;
+	/** Puts focus back on the trigger once a closed popup that held it has gone (see `returnFocus`). Off when the owner places focus itself (Base UI's `finalFocus`). Defaults to `true`. */
+	returnFocus?: boolean;
+}
+/** What opened the overlay: the pressed trigger and the press point. */
+interface MorphOrigin {
+	trigger?: HTMLElement;
+	point?: {
+		x: number;
+		y: number;
+	};
+}
+/**
+* Drives one overlay's morph. `open` is the overlay's open state, `origin` what
+* opened it (`useMorphOrigin`). Spread the returned refs through
+* `MorphSurface`; `popupRef` goes on the Base UI popup, which keeps its final
+* size the whole time, so positioning and collision flipping never see the
+* animation. `onExited` runs once a close has finished.
+*/
+declare function useMorph(open: boolean, origin: RefObject<MorphOrigin>, { from, effect, hideSource, tier, exit, instant, returnFocus: refocus }?: MorphOptions, onExited?: () => void): {
+	refs: {
+		popup: MutableRefObject_8z5kms<HTMLDivElement | null>;
+		shapes: RefObject<HTMLDivElement>;
+		blur: RefObject<SVGFEGaussianBlurElement>;
+		outline: RefObject<SVGFEFloodElement>;
+		copy: RefObject<HTMLDivElement>;
+		shape: RefObject<HTMLDivElement>;
+		bg: RefObject<HTMLDivElement>;
+		shadow: RefObject<HTMLDivElement>;
+		content: RefObject<HTMLDivElement>;
+	};
+	popupRef: (node: HTMLDivElement | null) => void;
+	popup: HTMLDivElement | null;
+	gooId: string;
+	effect: MorphEffect;
+	progress: MotionValue_d5wxmj<number>;
+};
+type Morph = ReturnType<typeof useMorph>;
+import { JSX as JSX_1kxb } from "react";
+interface MorphSurfaceProps {
+	/** The engine, from `useMorph`. */
+	morph: Morph;
+	/** Background class of the surface: `SURFACE_BG[level]`, or `bg-foreground` for an inverted tooltip. */
+	bg?: string;
+	/** Shadow class (`SURFACE_SHADOW[level]`); leave out for a flat surface. */
+	shadow?: string;
+	/** Radius class the surface rests at (the shape context's `container`, `bg`, …). */
+	radius: string;
+	/** Classes for the content wrapper: padding, width. */
+	className?: string;
+	/** The overlay's content. */
+	children?: ReactNode;
+}
+interface GooFilterProps {
+	id: string;
+	/** Blur radius; leave out when `blurRef` sets it per morph. */
+	blur?: number;
+	blurRef?: Ref<SVGFEGaussianBlurElement>;
+	/** Outlines the melted shape with the surface shadow's 1px ring (`--shadow-color`), so a surface the color of the page still shows its neck; the ref's `flood-opacity` fades it. */
+	outlineRef?: Ref<SVGFEFloodElement>;
+}
+type Element_12xgc = JSX_1kxb["Element"];
+/** The goo filter: blur, threshold the alpha back into solid shapes, then lay the crisp original on top. */
+declare function GooFilter({ id, blur, blurRef, outlineRef }: GooFilterProps): Element_12xgc;
+declare function MorphSurface({ morph, bg, shadow, radius, className, children }: MorphSurfaceProps): Element_12xgc;
+export { GooFilter, MorphSurface };

package/dist/lib/morph-layers.js

@@ -0,0 +1,13 @@
+import {
+  GooFilter2,
+  MorphSurface2
+} from "../shared/components-4y816hwp.js";
+import"../shared/components-b1e239g3.js";
+import"../shared/components-awra5sff.js";
+import"../shared/components-de99ykt7.js";
+import"../shared/components-3ey0hzpb.js";
+import"../shared/components-jcnjay5g.js";
+export {
+  GooFilter2 as GooFilter,
+  MorphSurface2 as MorphSurface
+};