@justanarthur/modo-ui 0.3.0 → 0.4.0

package/README.md

@@ -169,7 +169,7 @@ positioning) are ported.
 | — (new) | `lib/use-controllable-state.ts` | Local addition: controlled + uncontrolled state, Base UI style |
 | — (new) | `lib/use-morph.ts` | Local addition: the morph engine (source rect → popup box on a spring tier, exit hold for Base UI's unmount), geometry after beUI's popover; goo runs on its own `spring.goo` with a blur of at least 8px that eases to nothing as the surface lands, so the neck pinches off; a close-only `exit` override, an `instant` predicate that ends a run at once, press points from clicks, context menus and long presses (a droplet source for `from="pointer"`), cleanup when the popup unmounts mid-run; focus goes back to the trigger when a closed popup that held it is gone and Base UI skipped the return (the exit hold makes a menu read the pointer leaving the inert popup as a hover close) |
 | — (new) | `lib/reduced-motion.ts` | Local addition: `useReduceMotion`, the one reduced-motion read for the morph layer and the liquid indicators — the OS setting, or a `MotionConfig` asking for it (motion's `useReducedMotionConfig` alone ignores the OS without `<MotionConfig reducedMotion="user">`) |
-| — (new) | `lib/field-classes.ts` | Local addition: the field ladder FF repeats per text field (rest → muted fill on hover or a group's `data-active` → card fill on focus; `data-invalid` keeps a destructive ring), as `fieldVariants` + `fieldIconClasses`, shared by Input, Combobox and Sidebar's input |
+| — (new) | `lib/field-classes.ts` | Local addition: the field ladder FF repeats per text field (rest → muted fill on hover or a group's `data-active` → card fill on focus; `data-invalid` keeps a destructive ring), as `fieldVariants` + `fieldIconClasses`, shared by Input, Textarea, Combobox and Sidebar's input; `useFieldBox` (variant, state attributes, radius, inset) + `focusControlOnPress`, the box Input, Textarea, Combobox's fields and the date/time pickers' field build on, so each takes `variant` |
 | — (new) | `lib/date-locale.ts` | Local addition: what the date and time pickers read off a react-day-picker (date-fns) locale — the hour cycle (Intl), typed dates, times and months in the locale's formats (date-fns `parse` with `P`…`PPPP`), field names for column labels (`Intl.DisplayNames`) |
 | — (new) | `lib/scroll-column.tsx` | Local addition: `ScrollColumn`, the scrolling option list beside a calendar (months, years, hours, minutes) or a strip above it: the pick gets a dot, a run of `inView` options one band, the followed option stays centred; fluid hover, listbox semantics, arrow keys; `dividedColumns` puts a hairline between neighbours |
 | — (new) | `lib/slot.ts` | Local addition: Dialog's `render` / `asChild` slot shape (`SlotProps`, `slotRender`), shared by every overlay part that wraps a control |
@@ -255,6 +255,7 @@ only what is specific to it:
 | `Table` | `registry/default/table.tsx` | `components/table/index.tsx` | statics `.Header/.Body/.Row/.Head/.Cell`; `TableProps` / `TableRowProps` exported |
 | `Tabs` | `registry/base/tabs.tsx` | `components/navigation/tabs/index.tsx` | `defaultSelectedIndex` added as the index-mode twin of the existing `defaultValue`; indicator and hover pill are `GooIndicator`s (the hover pill returns to the active tab as it fades); statics `.List/.Item/.Panel` |
 | `TabsSubtle` | `registry/base/tabs-subtle.tsx` | `components/navigation/tabs-subtle/index.tsx` | uncontrolled mode; panels may be authored inside the root (below); the tab list's ref write goes through `MutableRefObject`; selected and hover pills are `GooIndicator`s; statics `.Item/.Panel` |
+| `Textarea` | — (local; Input's multi-line twin) | `components/inputs/textarea/index.tsx` | Base UI `Field.Control` rendered as a `<textarea>`; the field ladder from `lib/field-classes.ts`; padding sized so one row matches the control height; grows from `minRows` to `maxRows` (InputMessage's measure), then scrolls; `value` / `defaultValue` / `onChange` |
 | `ThinkingIndicator` | `registry/default/thinking-indicator.tsx` | `components/AI/thinking-indicator/index.tsx` | upstream prop JSDoc kept (it already matches the FF API table); the `.shimmer-text` rule it rides lives in `base.css`; local `variant="goo"` (three dots merging and splitting through `GooFilter`, plain label; default stays `shimmer`); reduced motion also follows MotionConfig |
 | `Toast` | — (local; after Sileo, see [Morph sources](#morph-sources)) | `components/overlays/toast/index.tsx` | Base UI Toast (queue, timers, swipe, announcements) with Sileo's pill melting into a body through the shared `GooFilter`; autopilot expand/collapse, six states on the `--status-*` tokens, promise toasts; `Toast` is the provider + viewport, `Toast.Trigger` shows one, `useToast()` the imperative API |
 | `Tooltip` | `registry/base/tooltip.tsx` | `components/overlays/tooltip/index.tsx` | `className`/`children` docs filled in; statics `.Provider` / `.PortalContainer`; the slide + fade replaced by the morph layer (goo from the trigger on `spring.goo`, `from` / `effect` / `tier` props; `followCursor` tooltips fade); a hand-off between grouped tooltips skips the morph (Base UI's `data-instant`) |

package/dist/blocks/sidebar-app/index.js

@@ -1,9 +1,9 @@
 import {
   SidebarApp2
-} from "../../shared/components-2n3whx7z.js";
-import"../../shared/components-nb87fjy4.js";
+} from "../../shared/components-ye0ze0h8.js";
+import"../../shared/components-mqyvvh8k.js";
 import"../../shared/components-c6s6b43g.js";
-import"../../shared/components-mhd39z7x.js";
+import"../../shared/components-3myrw7ne.js";
 import"../../shared/components-rr7a6ja9.js";
 import"../../shared/components-ng72k97e.js";
 import"../../shared/components-zfnmn5d4.js";

package/dist/components/inputs/combobox/index.d.ts

@@ -1,5 +1,5 @@
-import { VariantProps } from "class-variance-authority";
-import { HTMLAttributes, InputHTMLAttributes, ReactNode as ReactNode2, RefObject } from "react";
+import { HTMLAttributes, InputHTMLAttributes, ReactNode as ReactNode2, RefObject as RefObject2 } from "react";
+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
@@ -12,6 +12,8 @@ import { ClassProp as ClassProp_wz9o0r } from "class-variance-authority/types";
 declare const fieldVariants: (props?: ({
 	variant?: "borderless" | "bordered" | null | undefined;
 } & ClassProp_wz9o0r) | undefined) => string;
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { ComponentType } from "react";
 interface IconComponentProps {
 	size?: number | string;
@@ -19,7 +21,6 @@ interface IconComponentProps {
 	className?: string;
 }
 type IconComponent = ComponentType<IconComponentProps>;
-type SizeVariant = "default" | "compact";
 import { JSX as JSX_1kxb2 } from "react";
 import { ForwardRefExoticComponent as ForwardRefExoticComponent_tcubfn } from "react";
 import { RefAttributes as RefAttributes_miuf56 } from "react";
@@ -91,9 +92,9 @@ type Element_12xgc2 = JSX_1kxb2["Element"];
 * @example {@include ./examples.mdx}
 */
 declare function Combobox({ children, items, multiple, value, defaultValue, onValueChange, filter, onCreate, createLabel, creatable, hideSelected, disabled, name, required, size }: ComboboxProps): Element_12xgc2;
-interface ComboboxFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "defaultValue" | "onChange">, VariantProps<typeof fieldVariants> {
+interface ComboboxFieldProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "value" | "defaultValue" | "onChange"> {
 	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
-	variant?: "bordered" | "borderless" | null;
+	variant?: FieldVariant;
 	/** Leading icon inside the field. */
 	icon?: IconComponent;
 	/** Shown while nothing is typed or selected. Defaults to `"Search…"`. */
@@ -123,7 +124,7 @@ interface ComboboxContentProps {
 	/** Gap to the field, in px. Ignored when the list opens in place over the field (`effect="morph"` with `hideSource`). Defaults to `6`. */
 	sideOffset?: number;
 	/** Where the list grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How it grows (see Morph): with the liquid goo neck, a plain morph, a slide or a fade. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the list. Defaults to `false`. */

package/dist/components/inputs/combobox/index.js

@@ -7,10 +7,10 @@ import {
   ComboboxItem2,
   ComboboxEmpty2,
   combobox_default
-} from "../../../shared/components-8ey44d79.js";
+} from "../../../shared/components-tcee5k0s.js";
 import {
   fieldVariants
-} from "../../../shared/components-mhd39z7x.js";
+} from "../../../shared/components-3myrw7ne.js";
 import"../../../shared/components-5xc2j8jz.js";
 import"../../../shared/components-zrkzcayz.js";
 import"../../../shared/components-0q0sqfh4.js";

package/dist/components/inputs/date-time/date-picker/index.d.ts

@@ -1,8 +1,10 @@
 import { Locale as Locale2 } from "date-fns";
-import { RefObject } from "react";
+import { RefObject as RefObject2 } from "react";
 import { Matcher } from "react-day-picker";
 type HourCycle = "h11" | "h12" | "h23" | "h24";
 type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { JSX as JSX_1kxb } from "react";
 interface DatePickerProps {
 	/** The picked date (and time, with `withTime`); `null` when empty. */
@@ -27,6 +29,8 @@ interface DatePickerProps {
 	startMonth?: Date;
 	/** The last month the calendar reaches. Defaults to 50 years ahead. */
 	endMonth?: Date;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
+	variant?: FieldVariant;
 	/** Marks the field invalid. Defaults to `false`. */
 	invalid?: boolean;
 	/** Pins the field and its panel to one step of the size ladder. Defaults to the surrounding SizeProvider. */
@@ -46,7 +50,7 @@ interface DatePickerProps {
 	/** Id of the field, for a `Label`'s `htmlFor`. */
 	id?: string;
 	/** Where the panel grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How the panel grows (see Morph), as Combobox's list does: with the liquid goo neck, a plain morph, a slide or a fade. `'morph'` with `hideSource` opens it in place over the field. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the panel. Defaults to `false`. */
@@ -78,5 +82,5 @@ type Element_12xgc = JSX_1kxb["Element"];
 *
 * @example {@include ./examples.mdx}
 */
-declare function DatePicker({ value: valueProp, defaultValue, onValueChange, withTime, hourCycle, minuteStep, locale, placeholder, disabled, startMonth, endMonth, invalid, size, open: openProp, defaultOpen, onOpenChange, dir, columnsSide, timeColumnsSide, id, from, effect, hideSource, tier, className }: DatePickerProps): Element_12xgc;
+declare function DatePicker({ value: valueProp, defaultValue, onValueChange, withTime, hourCycle, minuteStep, locale, placeholder, disabled, startMonth, endMonth, variant, invalid, size, open: openProp, defaultOpen, onOpenChange, dir, columnsSide, timeColumnsSide, id, from, effect, hideSource, tier, className }: DatePickerProps): Element_12xgc;
 export { DatePicker, DatePickerProps, DatePicker as default };

package/dist/components/inputs/date-time/date-picker/index.js

@@ -1,14 +1,14 @@
 import {
   DatePicker2,
   date_picker_default
-} from "../../../../shared/components-2nhgyh31.js";
-import"../../../../shared/components-1z6tdadk.js";
+} from "../../../../shared/components-wtbesgdp.js";
 import"../../../../shared/components-mjthm1kf.js";
-import"../../../../shared/components-7btqt08d.js";
-import"../../../../shared/components-gvr9w41t.js";
+import"../../../../shared/components-1z6tdadk.js";
+import"../../../../shared/components-qtqxgfrb.js";
+import"../../../../shared/components-50m950y9.js";
 import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
-import"../../../../shared/components-mhd39z7x.js";
+import"../../../../shared/components-3myrw7ne.js";
 import"../../../../shared/components-rr7a6ja9.js";
 import"../../../../shared/components-zfnmn5d4.js";
 import"../../../../shared/components-3ky44908.js";

package/dist/components/inputs/date-time/date-range-picker/index.d.ts

@@ -1,7 +1,9 @@
 import { Locale } from "date-fns";
-import { RefObject } from "react";
+import { RefObject as RefObject2 } from "react";
 import { DateRange, Matcher } from "react-day-picker";
 type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { JSX as JSX_1kxb } from "react";
 interface DateRangePickerProps {
 	/** The picked range, react-day-picker's `{ from, to }`; `null` when empty. */
@@ -20,6 +22,8 @@ interface DateRangePickerProps {
 	startMonth?: Date;
 	/** The last month the calendar reaches. Defaults to 50 years ahead. */
 	endMonth?: Date;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
+	variant?: FieldVariant;
 	/** Marks the field invalid. Defaults to `false`. */
 	invalid?: boolean;
 	/** Pins the field and its panel to one step of the size ladder. Defaults to the surrounding SizeProvider. */
@@ -37,7 +41,7 @@ interface DateRangePickerProps {
 	/** Id of the field, for a `Label`'s `htmlFor`. */
 	id?: string;
 	/** Where the panel grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How the panel grows (see Morph), as Combobox's list does: with the liquid goo neck, a plain morph, a slide or a fade. `'morph'` with `hideSource` opens it in place over the field. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the panel. Defaults to `false`. */
@@ -60,5 +64,5 @@ type Element_12xgc = JSX_1kxb["Element"];
 *
 * @example {@include ./examples.mdx}
 */
-declare function DateRangePicker({ value: valueProp, defaultValue, onValueChange, locale, placeholder, disabled, startMonth, endMonth, invalid, size, open: openProp, defaultOpen, onOpenChange, dir, columnsSide, id, from: growFrom, effect, hideSource, tier, className }: DateRangePickerProps): Element_12xgc;
+declare function DateRangePicker({ value: valueProp, defaultValue, onValueChange, locale, placeholder, disabled, startMonth, endMonth, variant, invalid, size, open: openProp, defaultOpen, onOpenChange, dir, columnsSide, id, from: growFrom, effect, hideSource, tier, className }: DateRangePickerProps): Element_12xgc;
 export { DateRangePicker, DateRangePickerProps, DateRangePicker as default };

package/dist/components/inputs/date-time/date-range-picker/index.js

@@ -1,13 +1,13 @@
 import {
   DateRangePicker2,
   date_range_picker_default
-} from "../../../../shared/components-k809mbn0.js";
+} from "../../../../shared/components-zwhtxm15.js";
 import"../../../../shared/components-1z6tdadk.js";
-import"../../../../shared/components-7btqt08d.js";
-import"../../../../shared/components-gvr9w41t.js";
+import"../../../../shared/components-qtqxgfrb.js";
+import"../../../../shared/components-50m950y9.js";
 import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
-import"../../../../shared/components-mhd39z7x.js";
+import"../../../../shared/components-3myrw7ne.js";
 import"../../../../shared/components-rr7a6ja9.js";
 import"../../../../shared/components-zfnmn5d4.js";
 import"../../../../shared/components-3ky44908.js";

package/dist/components/inputs/date-time/duration-picker/index.d.ts

@@ -1,6 +1,8 @@
 import { Duration, Locale } from "date-fns";
-import { RefObject } from "react";
+import { RefObject as RefObject2 } from "react";
 type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { JSX as JSX_1kxb } from "react";
 interface DurationPickerProps {
 	/** The picked duration, a date-fns `Duration` (`{ hours, minutes }`); `null` when empty. */
@@ -19,6 +21,8 @@ interface DurationPickerProps {
 	placeholder?: string;
 	/** Disables the field. Defaults to `false`. */
 	disabled?: boolean;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
+	variant?: FieldVariant;
 	/** Marks the field invalid. Defaults to `false`. */
 	invalid?: boolean;
 	/** Pins the field and its panel to one step of the size ladder. Defaults to the surrounding SizeProvider. */
@@ -32,7 +36,7 @@ interface DurationPickerProps {
 	/** Id of the field, for a `Label`'s `htmlFor`. */
 	id?: string;
 	/** Where the panel grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How the panel grows (see Morph), as Combobox's list does: with the liquid goo neck, a plain morph, a slide or a fade. `'morph'` with `hideSource` opens it in place over the field. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the panel. Defaults to `false`. */
@@ -53,5 +57,5 @@ type Element_12xgc = JSX_1kxb["Element"];
 *
 * @example {@include ./examples.mdx}
 */
-declare function DurationPicker({ value: valueProp, defaultValue, onValueChange, maxHours, minuteStep, locale, placeholder, disabled, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: DurationPickerProps): Element_12xgc;
+declare function DurationPicker({ value: valueProp, defaultValue, onValueChange, maxHours, minuteStep, locale, placeholder, disabled, variant, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: DurationPickerProps): Element_12xgc;
 export { DurationPicker, DurationPickerProps, DurationPicker as default };

package/dist/components/inputs/date-time/duration-picker/index.js

@@ -1,13 +1,13 @@
 import {
   DurationPicker2,
   duration_picker_default
-} from "../../../../shared/components-re6rs21k.js";
+} from "../../../../shared/components-nyq0rym2.js";
 import"../../../../shared/components-mjthm1kf.js";
-import"../../../../shared/components-7btqt08d.js";
-import"../../../../shared/components-gvr9w41t.js";
+import"../../../../shared/components-qtqxgfrb.js";
+import"../../../../shared/components-50m950y9.js";
 import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
-import"../../../../shared/components-mhd39z7x.js";
+import"../../../../shared/components-3myrw7ne.js";
 import"../../../../shared/components-rr7a6ja9.js";
 import"../../../../shared/components-zfnmn5d4.js";
 import"../../../../shared/components-3ky44908.js";

package/dist/components/inputs/date-time/month-picker/index.d.ts

@@ -1,6 +1,8 @@
 import { Locale } from "date-fns";
-import { RefObject } from "react";
+import { RefObject as RefObject2 } from "react";
 type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { JSX as JSX_1kxb } from "react";
 interface MonthPickerProps {
 	/** The picked month as its first day; `null` when empty. */
@@ -19,6 +21,8 @@ interface MonthPickerProps {
 	endMonth?: Date;
 	/** Disables the field. Defaults to `false`. */
 	disabled?: boolean;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
+	variant?: FieldVariant;
 	/** Marks the field invalid. Defaults to `false`. */
 	invalid?: boolean;
 	/** Pins the field and its panel to one step of the size ladder. Defaults to the surrounding SizeProvider. */
@@ -32,7 +36,7 @@ interface MonthPickerProps {
 	/** Id of the field, for a `Label`'s `htmlFor`. */
 	id?: string;
 	/** Where the panel grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How the panel grows (see Morph), as Combobox's list does: with the liquid goo neck, a plain morph, a slide or a fade. `'morph'` with `hideSource` opens it in place over the field. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the panel. Defaults to `false`. */
@@ -53,5 +57,5 @@ type Element_12xgc = JSX_1kxb["Element"];
 *
 * @example {@include ./examples.mdx}
 */
-declare function MonthPicker({ value: valueProp, defaultValue, onValueChange, locale, placeholder, startMonth, endMonth, disabled, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: MonthPickerProps): Element_12xgc;
+declare function MonthPicker({ value: valueProp, defaultValue, onValueChange, locale, placeholder, startMonth, endMonth, disabled, variant, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: MonthPickerProps): Element_12xgc;
 export { MonthPicker, MonthPickerProps, MonthPicker as default };

package/dist/components/inputs/date-time/month-picker/index.js

@@ -1,12 +1,12 @@
 import {
   MonthPicker2,
   month_picker_default
-} from "../../../../shared/components-3fbbvq5j.js";
-import"../../../../shared/components-7btqt08d.js";
-import"../../../../shared/components-gvr9w41t.js";
+} from "../../../../shared/components-nsjec21k.js";
+import"../../../../shared/components-qtqxgfrb.js";
+import"../../../../shared/components-50m950y9.js";
 import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
-import"../../../../shared/components-mhd39z7x.js";
+import"../../../../shared/components-3myrw7ne.js";
 import"../../../../shared/components-rr7a6ja9.js";
 import"../../../../shared/components-zfnmn5d4.js";
 import"../../../../shared/components-3ky44908.js";

package/dist/components/inputs/date-time/time-picker/index.d.ts

@@ -1,7 +1,9 @@
 import { Locale as Locale2 } from "date-fns";
-import { RefObject } from "react";
+import { RefObject as RefObject2 } from "react";
 type HourCycle = "h11" | "h12" | "h23" | "h24";
 type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { JSX as JSX_1kxb } from "react";
 interface TimePickerProps {
 	/** The picked time as `"HH:mm"` on a 24-hour clock (an `<input type="time">`'s value); `null` when empty. */
@@ -20,6 +22,8 @@ interface TimePickerProps {
 	placeholder?: string;
 	/** Disables the field. Defaults to `false`. */
 	disabled?: boolean;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"bordered"`. */
+	variant?: FieldVariant;
 	/** Marks the field invalid. Defaults to `false`. */
 	invalid?: boolean;
 	/** Pins the field and its panel to one step of the size ladder. Defaults to the surrounding SizeProvider. */
@@ -33,7 +37,7 @@ interface TimePickerProps {
 	/** Id of the field, for a `Label`'s `htmlFor`. */
 	id?: string;
 	/** Where the panel grows from (see Morph): the field, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'` (the field). */
-	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<HTMLElement | null>;
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject2<HTMLElement | null>;
 	/** How the panel grows (see Morph), as Combobox's list does: with the liquid goo neck, a plain morph, a slide or a fade. `'morph'` with `hideSource` opens it in place over the field. Defaults to `'goo'`. */
 	effect?: "goo" | "morph" | "slide" | "fade";
 	/** Hide the field while open, so it reads as turning into the panel. Defaults to `false`. */
@@ -55,5 +59,5 @@ type Element_12xgc = JSX_1kxb["Element"];
 *
 * @example {@include ./examples.mdx}
 */
-declare function TimePicker({ value: valueProp, defaultValue, onValueChange, hourCycle, minuteStep, locale, placeholder, disabled, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: TimePickerProps): Element_12xgc;
+declare function TimePicker({ value: valueProp, defaultValue, onValueChange, hourCycle, minuteStep, locale, placeholder, disabled, variant, invalid, size, open: openProp, defaultOpen, onOpenChange, id, from, effect, hideSource, tier, className }: TimePickerProps): Element_12xgc;
 export { TimePicker, TimePickerProps, TimePicker as default };

package/dist/components/inputs/date-time/time-picker/index.js

@@ -1,13 +1,13 @@
 import {
   TimePicker2,
   time_picker_default
-} from "../../../../shared/components-bshdmf75.js";
+} from "../../../../shared/components-wshd8f3n.js";
 import"../../../../shared/components-mjthm1kf.js";
-import"../../../../shared/components-7btqt08d.js";
-import"../../../../shared/components-gvr9w41t.js";
+import"../../../../shared/components-qtqxgfrb.js";
+import"../../../../shared/components-50m950y9.js";
 import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
-import"../../../../shared/components-mhd39z7x.js";
+import"../../../../shared/components-3myrw7ne.js";
 import"../../../../shared/components-rr7a6ja9.js";
 import"../../../../shared/components-zfnmn5d4.js";
 import"../../../../shared/components-3ky44908.js";

package/dist/components/inputs/input/index.d.ts

@@ -1,4 +1,7 @@
 import { ForwardRefExoticComponent, HTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, ReactNode as ReactNode2, RefAttributes } from "react";
+type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
 import { ComponentType } from "react";
 interface IconComponentProps {
 	size?: number | string;
@@ -6,7 +9,6 @@ interface IconComponentProps {
 	className?: string;
 }
 type IconComponent = ComponentType<IconComponentProps>;
-type SizeVariant = "default" | "compact";
 interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "onChange" | "value" | "defaultValue" | "size"> {
 	/** Placeholder text. */
 	placeholder?: string;
@@ -18,6 +20,8 @@ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "onChan
 	defaultValue?: string;
 	/** Called when the input value changes. */
 	onChange?: (value: string) => void;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"borderless"`. */
+	variant?: FieldVariant;
 	/** Marks the value invalid: the field turns destructive and sets `aria-invalid`. Defaults to `false`. */
 	invalid?: boolean;
 	/** Disables the input. Defaults to `false`. */

package/dist/components/inputs/input/index.js

@@ -3,8 +3,8 @@ import {
   Label2,
   InputGroup2,
   input_default
-} from "../../../shared/components-gvr9w41t.js";
-import"../../../shared/components-mhd39z7x.js";
+} from "../../../shared/components-50m950y9.js";
+import"../../../shared/components-3myrw7ne.js";
 import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-jjw69c4c.js";
 import"../../../shared/components-n7mjr357.js";

package/dist/components/inputs/textarea/index.d.ts

@@ -0,0 +1,46 @@
+import { TextareaHTMLAttributes } from "react";
+type SizeVariant = "default" | "compact";
+/** Framed at rest (`bordered`), or invisible until hovered or focused (`borderless`). */
+type FieldVariant = "bordered" | "borderless";
+import { ForwardRefExoticComponent as ForwardRefExoticComponent_tcubfn } from "react";
+import { RefAttributes as RefAttributes_miuf56 } from "react";
+interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange" | "value" | "defaultValue" | "rows"> {
+	/** Placeholder text. */
+	placeholder?: string;
+	/** Controlled value. Pair with `onChange`. */
+	value?: string;
+	/** Initial value when uncontrolled. Defaults to `''`. */
+	defaultValue?: string;
+	/** Called with the new value on every change. */
+	onChange?: (value: string) => void;
+	/** Rows shown when empty; the box never gets shorter. Defaults to `3`. */
+	minRows?: number;
+	/** Rows the box grows to before it scrolls. Set it to `minRows` for a fixed height. Defaults to `8`. */
+	maxRows?: number;
+	/** Framed at rest, or invisible until hovered or focused. Defaults to `"borderless"`. */
+	variant?: FieldVariant;
+	/** Marks the value invalid: the field turns destructive and sets `aria-invalid`. Defaults to `false`. */
+	invalid?: boolean;
+	/** Disables the textarea. Defaults to `false`. */
+	disabled?: boolean;
+	/** Pins the textarea to one step of the size ladder (36px default, 28px compact): its text and padding follow, so one row matches an Input. Defaults to the surrounding SizeProvider. */
+	size?: SizeVariant;
+	/** Classes for the ringed box around the textarea. */
+	className?: string;
+}
+/**
+* Multi-line text field that grows with what you type.
+*
+* It sits on the same ground as Input: bare text at rest (or framed, with
+* `variant="bordered"`), a muted fill with a hairline ring on hover, the
+* card ground on focus, a destructive ring when `invalid`. The box starts at `minRows`, grows line by line as text wraps,
+* and scrolls once it reaches `maxRows`. One row lines up with an Input of
+* the same size, so the two stack in a form without a seam. It is
+* uncontrolled with `defaultValue`, or controlled with `value` + `onChange`,
+* fills the width of its container, and joins a Base UI `Field` when placed
+* inside one. Pair it with a `Label` (see Input) through `htmlFor` / `id`.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const Textarea: ForwardRefExoticComponent_tcubfn<TextareaProps & RefAttributes_miuf56<HTMLTextAreaElement>>;
+export { Textarea, TextareaProps, Textarea as default };

package/dist/components/inputs/textarea/index.js

@@ -0,0 +1,13 @@
+import {
+  Textarea2,
+  textarea_default
+} from "../../../shared/components-rd9tbsqv.js";
+import"../../../shared/components-3myrw7ne.js";
+import"../../../shared/components-n7mjr357.js";
+import"../../../shared/components-0sn7ypjw.js";
+import"../../../shared/components-cv16mryv.js";
+import"../../../shared/components-ezxhrmer.js";
+export {
+  Textarea2 as Textarea,
+  textarea_default as default
+};

package/dist/components/navigation/sidebar/index.js

@@ -36,9 +36,9 @@ import {
   Sidebar2,
   SidebarContent2,
   sidebar_default
-} from "../../../shared/components-nb87fjy4.js";
+} from "../../../shared/components-mqyvvh8k.js";
 import"../../../shared/components-c6s6b43g.js";
-import"../../../shared/components-mhd39z7x.js";
+import"../../../shared/components-3myrw7ne.js";
 import"../../../shared/components-rr7a6ja9.js";
 import"../../../shared/components-ng72k97e.js";
 import"../../../shared/components-zfnmn5d4.js";