@cladd-ui/react 0.0.1 → 0.0.3

package/components/List.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode, Ref, HTMLAttributes } from 'react';
+export interface ListProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const List: (props: ListProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=List.d.ts.map

package/components/List.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../src/components/List.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvD,MAAM,WAAW,SAAU,SAAQ,cAAc,CAAC,cAAc,CAAC;IAC/D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,4CAYpC,CAAC"}

package/components/List.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../shared/cn';
+export const List = (props) => {
+    const { children, className = '', ref, ...rest } = props;
+    return (_jsx("div", { ref: ref, className: cn('list flex flex-col p-2', className), ...rest, children: children }));
+};
+//# sourceMappingURL=List.js.map

package/components/List.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"List.js","sourceRoot":"","sources":["../../../src/components/List.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAgB,EAAE,EAAE;IACvC,MAAM,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEzD,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,KAC9C,IAAI,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC"}

package/components/ListButton.d.ts

@@ -0,0 +1,61 @@
+import { ReactNode, Ref, ElementType } from 'react';
+import { Color } from '../types';
+import { ButtonProps, ButtonSize } from './Button';
+import { SurfaceVariant } from './Surface';
+interface ListButtonOwnProps<C extends ElementType = 'button'> {
+    /** Title content of the row (the main text/element on the row). */
+    children?: ReactNode;
+    /** Extra classes for the row's surface root. */
+    className?: string;
+    /** Extra classes for the row's inner content area. */
+    contentClassName?: string;
+    /** Extra classes for the inner column (the wrapper around `header`/title/`footer`). */
+    innerContentClassName?: string;
+    /** Icon node rendered on the left, before the inner content column. */
+    icon?: ReactNode;
+    /** Extra classes for the icon wrapper. */
+    iconClassName?: string;
+    /** Small text rendered above the title. Typically a category, date, or eyebrow label. */
+    header?: ReactNode;
+    headerClassName?: string;
+    /** Small text rendered below the title. Typically secondary metadata. */
+    footer?: ReactNode;
+    footerClassName?: string;
+    /** Extra classes for the title row (the wrapper around `children`). */
+    titleClassName?: string;
+    /** Visually dim the row and disable pointer events. */
+    disabled?: boolean;
+    /** Block clicks while keeping the row visually enabled. */
+    readOnly?: boolean;
+    /** Default `'lg'` (vs Button's `'md'`) - list rows usually want more vertical space. */
+    size?: ButtonSize;
+    /** Polymorphic root element. Defaults to `'button'`. Pass `'a'` for navigation list rows. */
+    component?: C;
+    /** Accent color token. Forwarded to `Button.color`. */
+    color?: Color;
+    /**
+     * Marks this list row as selected. When `true`, forces `variant` to `'gradient'` and
+     * `outline` to `true` regardless of the props passed - used for the active row in a list.
+     */
+    selected?: boolean;
+    /** Forwarded to the underlying `Button`'s polymorphic root. */
+    ref?: Ref<HTMLElement>;
+    /** Slot rendered right-aligned at the end of the row (e.g. badge, chevron). */
+    after?: ReactNode;
+    /**
+     * Surface variant. Default `'transparent'` so rows blend into the list surface.
+     * Overridden to `'gradient'` when `selected` is `true`.
+     */
+    variant?: SurfaceVariant;
+    /**
+     * Outline ring on the row. Default `false`. Effective value is `outline || selected`,
+     * so a selected row always shows the ring.
+     */
+    outline?: boolean;
+    /** Default `true`. Forwarded to the underlying `Button`. */
+    rounded?: boolean;
+}
+export type ListButtonProps<C extends ElementType = 'button'> = ListButtonOwnProps<C> & Omit<ButtonProps<C>, keyof ListButtonOwnProps<C>>;
+export declare const ListButton: <C extends ElementType = "button">(props: ListButtonProps<C>) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ListButton.d.ts.map

package/components/ListButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListButton.d.ts","sourceRoot":"","sources":["../../../src/components/ListButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,WAAW,EAAM,MAAM,OAAO,CAAC;AAGxD,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAU,WAAW,EAAmB,UAAU,EAAE,MAAM,UAAU,CAAC;AAC5E,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,UAAU,kBAAkB,CAAC,CAAC,SAAS,WAAW,GAAG,QAAQ;IAC3D,mEAAmE;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sDAAsD;IACtD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uFAAuF;IACvF,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uEAAuE;IACvE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0CAA0C;IAC1C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yFAAyF;IACzF,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,yEAAyE;IACzE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uEAAuE;IACvE,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wFAAwF;IACxF,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,6FAA6F;IAC7F,SAAS,CAAC,EAAE,CAAC,CAAC;IACd,uDAAuD;IACvD,KAAK,CAAC,EAAE,KAAK,CAAC;IAEd;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,GAAG,QAAQ,IAC1D,kBAAkB,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,MAAM,kBAAkB,CAAC,CAAC,CAAC,CAAC,CAAC;AAE5E,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,WAAW,GAAG,QAAQ,EACzD,OAAO,eAAe,CAAC,CAAC,CAAC,4CA2G1B,CAAC"}

package/components/ListButton.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../shared/cn';
+import { Button, buttonIconSizes } from './Button';
+export const ListButton = (props) => {
+    const { children, className = '', contentClassName = '', innerContentClassName = '', disabled = false, readOnly = false, size = 'lg', component = 'button', color = '', icon, iconClassName = '', header, headerClassName = '', footer, footerClassName = '', selected = false, titleClassName = '', after, ref, variant = 'transparent', outline = false, rounded = true, ...rest } = props;
+    const ButtonEl = Button;
+    return (_jsxs(ButtonEl, { component: component, rounded: rounded, className: cn('list-button z-10 w-full', className), contentClassName: cn('gap-4 px-2', contentClassName), variant: selected ? 'gradient' : variant, outline: outline || selected, disabled: disabled, readOnly: readOnly, ref: ref, color: color, size: size, multiline: true, ...rest, children: [icon && (_jsx("div", { className: cn('relative shrink-0 [&>svg]:shrink-0', buttonIconSizes[size], iconClassName), children: icon })), (children || footer || header) && (_jsxs("div", { className: cn('relative flex w-full min-w-0 shrink flex-col gap-1', innerContentClassName), children: [header && (_jsx("div", { className: cn('text-xs leading-tight font-normal text-on-surface-dark', headerClassName), children: header })), _jsx("div", { className: cn('flex items-center gap-4 [&>svg]:shrink-0', buttonIconSizes[size], titleClassName), children: children }), footer && (_jsx("div", { className: cn('text-xs leading-tight font-normal text-on-surface-darker', footerClassName), children: footer }))] })), after && (_jsx("div", { className: cn('ml-auto shrink-0 [&>svg]:shrink-0', buttonIconSizes[size]), children: after }))] }));
+};
+//# sourceMappingURL=ListButton.js.map

package/components/ListButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListButton.js","sourceRoot":"","sources":["../../../src/components/ListButton.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAElC,OAAO,EAAE,MAAM,EAAe,eAAe,EAAc,MAAM,UAAU,CAAC;AA+D5E,MAAM,CAAC,MAAM,UAAU,GAAG,CACxB,KAAyB,EACzB,EAAE;IACF,MAAM,EACJ,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,gBAAgB,GAAG,EAAE,EACrB,qBAAqB,GAAG,EAAE,EAC1B,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,IAAI,EACX,SAAS,GAAG,QAAQ,EACpB,KAAK,GAAG,EAAE,EACV,IAAI,EACJ,aAAa,GAAG,EAAE,EAClB,MAAM,EACN,eAAe,GAAG,EAAE,EACpB,MAAM,EACN,eAAe,GAAG,EAAE,EACpB,QAAQ,GAAG,KAAK,EAChB,cAAc,GAAG,EAAE,EACnB,KAAK,EACL,GAAG,EACH,OAAO,GAAG,aAAa,EACvB,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,IAAI,EACd,GAAG,IAAI,EACR,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,MAAsC,CAAC;IAExD,OAAO,CACL,MAAC,QAAQ,IACP,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE,SAAS,CAAC,EACnD,gBAAgB,EAAE,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,EACpD,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,EACxC,OAAO,EAAE,OAAO,IAAI,QAAQ,EAC5B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,SAAS,WACL,IAAI,aAEP,IAAI,IAAI,CACP,cACE,SAAS,EAAE,EAAE,CACX,oCAAoC,EACpC,eAAe,CAAC,IAAI,CAAC,EACrB,aAAa,CACd,YAEA,IAAI,GACD,CACP,EACA,CAAC,QAAQ,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,CACjC,eACE,SAAS,EAAE,EAAE,CACX,oDAAoD,EACpD,qBAAqB,CACtB,aAEA,MAAM,IAAI,CACT,cACE,SAAS,EAAE,EAAE,CACX,wDAAwD,EACxD,eAAe,CAChB,YAEA,MAAM,GACH,CACP,EACD,cACE,SAAS,EAAE,EAAE,CACX,0CAA0C,EAC1C,eAAe,CAAC,IAAI,CAAC,EACrB,cAAc,CACf,YAEA,QAAQ,GACL,EACL,MAAM,IAAI,CACT,cACE,SAAS,EAAE,EAAE,CACX,0DAA0D,EAC1D,eAAe,CAChB,YAEA,MAAM,GACH,CACP,IACG,CACP,EACA,KAAK,IAAI,CACR,cACE,SAAS,EAAE,EAAE,CACX,mCAAmC,EACnC,eAAe,CAAC,IAAI,CAAC,CACtB,YAEA,KAAK,GACF,CACP,IACQ,CACZ,CAAC;AACJ,CAAC,CAAC"}

package/components/ListItem.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode, Ref, HTMLAttributes } from 'react';
+export interface ListItemProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const ListItem: (props: ListItemProps, ref?: Ref<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ListItem.d.ts.map

package/components/ListItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.d.ts","sourceRoot":"","sources":["../../../src/components/ListItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvD,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,cAAc,CAAC;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,EAAE,MAAM,GAAG,CAAC,cAAc,CAAC,4CAevE,CAAC"}

package/components/ListItem.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../shared/cn';
+export const ListItem = (props, ref) => {
+    const { children, className = '', ...rest } = props;
+    return (_jsx("div", { ref: ref, className: cn('flex min-h-9 items-center gap-4 px-2 py-1 text-xs font-medium', className), ...rest, children: children }));
+};
+//# sourceMappingURL=ListItem.js.map

package/components/ListItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItem.js","sourceRoot":"","sources":["../../../src/components/ListItem.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,GAAyB,EAAE,EAAE;IAC1E,MAAM,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEpD,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,+DAA+D,EAC/D,SAAS,CACV,KACG,IAAI,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC"}

package/components/ListSeparator.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode, Ref, HTMLAttributes } from 'react';
+export interface ListSeparatorProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+    className?: string;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const ListSeparator: (props: ListSeparatorProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ListSeparator.d.ts.map

package/components/ListSeparator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSeparator.d.ts","sourceRoot":"","sources":["../../../src/components/ListSeparator.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAIvD,MAAM,WAAW,kBAAmB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACxE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,4CAetD,CAAC"}

package/components/ListSeparator.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../shared/cn';
+export const ListSeparator = (props) => {
+    const { children, className = '', ref, ...rest } = props;
+    return (_jsx("div", { ref: ref, className: cn('list-separator -mx-2 my-2 h-px bg-surface-outline', className), ...rest, children: children }));
+};
+//# sourceMappingURL=ListSeparator.js.map

package/components/ListSeparator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListSeparator.js","sourceRoot":"","sources":["../../../src/components/ListSeparator.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAQlC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE;IACzD,MAAM,EAAE,QAAQ,EAAE,SAAS,GAAG,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAEzD,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,mDAAmD,EACnD,SAAS,CACV,KACG,IAAI,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC"}

package/components/ModalController.d.ts

@@ -0,0 +1,26 @@
+/**
+ * Lifecycle phases of an animated modal:
+ * - `'closed'` - not mounted (or pre-mount).
+ * - `'opening'` - mounted, currently animating in.
+ * - `'opened'` - open, animation complete.
+ * - `'closing'` - animating out, will become `'closed'` on `transitionend`.
+ */
+export type ModalPhase = 'closed' | 'opening' | 'opened' | 'closing';
+/**
+ * Wraps a single modal child to drive its animation phase from a boolean `open`.
+ * Mounts the child when `open` flips to `true` (phase `'opening'`), keeps it mounted while
+ * the close animation runs, then unmounts when phase reaches `'closed'`. Used internally by
+ * `Popover`, `Tooltip`, `Dialog`, `Popup`, and `Toast` - you usually won't instantiate this directly.
+ *
+ * The wrapped child must accept `phase: ModalPhase` and `onPhaseChange: (phase: ModalPhase) => void`
+ * props (this is what the `*Inner` components in this library do).
+ */
+export declare const ModalController: (props: {
+    /** Desired open state. Drives the phase machine. */
+    open: boolean;
+    /** Fires when the controller resolves an internal phase change back into a boolean (e.g. animation completes). */
+    onOpenChange?: (open: boolean) => void;
+    /** Single React element accepting `phase` + `onPhaseChange`. */
+    children: React.ReactNode;
+}) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+//# sourceMappingURL=ModalController.d.ts.map

package/components/ModalController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalController.d.ts","sourceRoot":"","sources":["../../../src/components/ModalController.tsx"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAErE;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO;IACrC,oDAAoD;IACpD,IAAI,EAAE,OAAO,CAAC;IACd,kHAAkH;IAClH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,gEAAgE;IAChE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,kGAsCA,CAAC"}

package/components/ModalController.js

@@ -0,0 +1,52 @@
+import { useEffect, useState, cloneElement } from 'react';
+/**
+ * Wraps a single modal child to drive its animation phase from a boolean `open`.
+ * Mounts the child when `open` flips to `true` (phase `'opening'`), keeps it mounted while
+ * the close animation runs, then unmounts when phase reaches `'closed'`. Used internally by
+ * `Popover`, `Tooltip`, `Dialog`, `Popup`, and `Toast` - you usually won't instantiate this directly.
+ *
+ * The wrapped child must accept `phase: ModalPhase` and `onPhaseChange: (phase: ModalPhase) => void`
+ * props (this is what the `*Inner` components in this library do).
+ */
+export const ModalController = (props) => {
+    const { open, onOpenChange = () => { }, children } = props;
+    const [phase, setPhase] = useState('closed');
+    useEffect(() => {
+        if (open) {
+            if (phase === 'closed' || phase === 'closing') {
+                setPhase('opening');
+                if (open !== true)
+                    onOpenChange(true);
+            }
+        }
+        else {
+            if (phase === 'opening' || phase === 'opened') {
+                setPhase('closing');
+            }
+        }
+    }, [open]);
+    const onPhaseChange = (newPhase) => {
+        setPhase(newPhase);
+        if (newPhase === 'closed') {
+            if (open !== false)
+                onOpenChange(false);
+        }
+        else if (newPhase === 'opening') {
+            if (open !== true)
+                onOpenChange(true);
+        }
+    };
+    if (phase === 'closed')
+        return null;
+    if (!children || (Array.isArray(children) && !children.length))
+        return null;
+    const child = (Array.isArray(children) ? children[0] : children);
+    const onPhaseChangeOriginal = child.props.onPhaseChange;
+    const handlePhaseChange = (newPhase) => {
+        onPhaseChange(newPhase);
+        if (onPhaseChangeOriginal)
+            onPhaseChangeOriginal(newPhase);
+    };
+    return cloneElement(child, { phase, onPhaseChange: handlePhaseChange });
+};
+//# sourceMappingURL=ModalController.js.map

package/components/ModalController.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ModalController.js","sourceRoot":"","sources":["../../../src/components/ModalController.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAW1D;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAO/B,EAAE,EAAE;IACH,MAAM,EAAE,IAAI,EAAE,YAAY,GAAG,GAAG,EAAE,GAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAa,QAAQ,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE,CAAC;YACT,IAAI,KAAK,KAAK,QAAQ,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;gBAC9C,QAAQ,CAAC,SAAS,CAAC,CAAC;gBACpB,IAAI,IAAI,KAAK,IAAI;oBAAE,YAAY,CAAC,IAAI,CAAC,CAAC;YACxC,CAAC;QACH,CAAC;aAAM,CAAC;YACN,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,QAAQ,EAAE,CAAC;gBAC9C,QAAQ,CAAC,SAAS,CAAC,CAAC;YACtB,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,aAAa,GAAG,CAAC,QAAoB,EAAE,EAAE;QAC7C,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACnB,IAAI,QAAQ,KAAK,QAAQ,EAAE,CAAC;YAC1B,IAAI,IAAI,KAAK,KAAK;gBAAE,YAAY,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;aAAM,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;YAClC,IAAI,IAAI,KAAK,IAAI;gBAAE,YAAY,CAAC,IAAI,CAAC,CAAC;QACxC,CAAC;IACH,CAAC,CAAC;IAEF,IAAI,KAAK,KAAK,QAAQ;QAAE,OAAO,IAAI,CAAC;IACpC,IAAI,CAAC,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC;QAAE,OAAO,IAAI,CAAC;IAE5E,MAAM,KAAK,GAAG,CACZ,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,CACtB,CAAC;IAC7B,MAAM,qBAAqB,GAAG,KAAK,CAAC,KAAK,CAAC,aAAa,CAAC;IACxD,MAAM,iBAAiB,GAAG,CAAC,QAAoB,EAAE,EAAE;QACjD,aAAa,CAAC,QAAQ,CAAC,CAAC;QACxB,IAAI,qBAAqB;YAAE,qBAAqB,CAAC,QAAQ,CAAC,CAAC;IAC7D,CAAC,CAAC;IACF,OAAO,YAAY,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,aAAa,EAAE,iBAAiB,EAAE,CAAC,CAAC;AAC1E,CAAC,CAAC"}

package/components/NumberField.d.ts

@@ -0,0 +1,49 @@
+import { ReactNode, Ref, ComponentPropsWithoutRef } from 'react';
+import { Color } from '../types';
+import { SurfaceVariant } from './Surface';
+export type NumberFieldSize = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+interface NumberFieldOwnProps {
+    /** Custom content rendered inside the number field container (rare - most usage is value-only). */
+    children?: ReactNode;
+    /**
+     * When `true` (default), the value is rendered in an editable `Input`.
+     * When `false`, the value is rendered in a read-only `SurfaceCut` chip - useful
+     * when keyboard entry is not desired.
+     */
+    input?: boolean;
+    /** Extra classes for the value `Input` (or `SurfaceCut`). */
+    inputClassName?: string;
+    /** Extra classes for the number field container. */
+    className?: string;
+    /** Visually dim the number field and disable both buttons. */
+    disabled?: boolean;
+    /** Block changes without the disabled visual treatment. */
+    readOnly?: boolean;
+    /** Pill-shape the +/− buttons. Default `true`. */
+    rounded?: boolean;
+    /** Pill-shape the value display. Default `false`. */
+    valueRounded?: boolean;
+    size?: NumberFieldSize;
+    /** Accent color for the +/− buttons. */
+    color?: Color;
+    /** Outline ring on the +/− buttons. Default `false`. */
+    outline?: boolean;
+    /** Default `0`. */
+    min?: number;
+    /** Default `1_000_000`. */
+    max?: number;
+    /** Default `0`. */
+    value?: number;
+    /** Increment per +/− press. Default `1`. */
+    step?: number;
+    /** Surface variant for the +/− buttons. Default `'transparent'`. */
+    variant?: SurfaceVariant;
+    /** Fires after a +/− button press, with the new value (already clamped to `[min, max]`). */
+    onChange?: (value: number) => void;
+    /** Forwarded to the number field container `<div>`. */
+    ref?: Ref<HTMLDivElement>;
+}
+export type NumberFieldProps = NumberFieldOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof NumberFieldOwnProps>;
+export declare const NumberField: (props: NumberFieldProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=NumberField.d.ts.map

package/components/NumberField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberField.d.ts","sourceRoot":"","sources":["../../../src/components/NumberField.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AAGjE,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAGjC,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAG3C,MAAM,MAAM,eAAe,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;AAEhE,UAAU,mBAAmB;IAC3B,mGAAmG;IACnG,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6DAA6D;IAC7D,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oDAAoD;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kDAAkD;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qDAAqD;IACrD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wCAAwC;IACxC,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,wDAAwD;IACxD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,mBAAmB;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,2BAA2B;IAC3B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4CAA4C;IAC5C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,4FAA4F;IAC5F,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,uDAAuD;IACvD,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAED,MAAM,MAAM,gBAAgB,GAAG,mBAAmB,GAChD,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,mBAAmB,CAAC,CAAC;AAEnE,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,4CA+HlD,CAAC"}

package/components/NumberField.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../shared/cn';
+import { Button } from './Button';
+import { Input } from './Input';
+import { SurfaceCut } from './SurfaceCut';
+export const NumberField = (props) => {
+    const { children, input = true, inputClassName = '', className = '', disabled = false, readOnly = false, rounded = true, valueRounded = false, size = 'md', color = '', outline = false, variant = 'transparent', min = 0, max = 1000000, value = 0, step = 1, onChange = () => { }, ref, ...rest } = props;
+    const decrease = () => {
+        if (value <= min || disabled)
+            return;
+        onChange(Math.max(min, value - step));
+    };
+    const increase = () => {
+        if (value >= max || disabled)
+            return;
+        onChange(Math.min(max, value + step));
+    };
+    const inputPaddingNoIcon = {
+        sm: 'px-2.5',
+        md: 'px-2.5',
+        lg: 'px-2.5',
+        xl: 'px-2.5',
+        '2xl': 'px-3.5',
+    };
+    const roundedSizes = {
+        sm: 'rounded-md',
+        md: 'rounded-lg',
+        lg: 'rounded-[10px]',
+        xl: 'rounded-xl',
+        '2xl': 'rounded-xl',
+    };
+    return (_jsxs("div", { className: cn('number-field flex items-center gap-0.5', className), ref: ref, ...rest, children: [_jsx(Button, { size: size, variant: variant, color: color, outline: outline, rounded: rounded, readOnly: readOnly, disabled: value <= min || disabled, onClick: decrease, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 18 18", children: _jsx("g", { fill: "currentColor", children: _jsx("path", { d: "M14.75,9.75H3.25c-.414,0-.75-.336-.75-.75s.336-.75,.75-.75H14.75c.414,0,.75,.336,.75,.75s-.336,.75-.75,.75Z" }) }) }) }), input ? (_jsx(Input, { size: size, value: value, disabled: disabled, readOnly: readOnly, rounded: valueRounded, className: "w-auto min-w-0 shrink", inputClassName: cn('w-auto min-w-9 text-center', inputClassName) })) : (_jsx(SurfaceCut, { className: cn('w-auto min-w-9 self-stretch text-center', valueRounded ? 'rounded-full' : roundedSizes[size]), contentClassName: cn('flex items-center justify-center text-xs', inputPaddingNoIcon[size]), children: value })), _jsx(Button, { size: size, variant: variant, color: color, outline: outline, rounded: rounded, readOnly: readOnly, disabled: value >= max || disabled, onClick: increase, children: _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "18", height: "18", viewBox: "0 0 18 18", children: _jsxs("g", { fill: "currentColor", children: [_jsx("path", { d: "M14.75,9.75H3.25c-.414,0-.75-.336-.75-.75s.336-.75,.75-.75H14.75c.414,0,.75,.336,.75,.75s-.336,.75-.75,.75Z" }), _jsx("path", { d: "M9,15.5c-.414,0-.75-.336-.75-.75V3.25c0-.414,.336-.75,.75-.75s.75,.336,.75,.75V14.75c0,.414-.336,.75-.75,.75Z" })] }) }) })] }));
+};
+//# sourceMappingURL=NumberField.js.map

package/components/NumberField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberField.js","sourceRoot":"","sources":["../../../src/components/NumberField.tsx"],"names":[],"mappings":"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"}

package/components/Popover.d.ts

@@ -0,0 +1,137 @@
+import { Color } from '../types';
+import { SurfaceProps, SurfaceVariant } from './Surface';
+/**
+ * State container for the `Popover` + `PopoverTrigger` + `Popover` compound. Holds the open
+ * state and the anchor ref so a `PopoverTrigger` can register the anchor element and a sibling
+ * `Popover` can read both via context.
+ *
+ * Use this when you want the trigger and the popover to be siblings in JSX (Radix-style):
+ *
+ * ```tsx
+ * <PopoverRoot>
+ *   <PopoverTrigger><Button>Open</Button></PopoverTrigger>
+ *   <Popover>...</Popover>
+ * </PopoverRoot>
+ * ```
+ *
+ * Skip this and pass `open`/`onOpenChange`/`anchorRef` directly to `<Popover>` if you'd rather
+ * control state yourself.
+ */
+export declare const PopoverRoot: ({ children, defaultOpen, open: openProp, onOpenChange, }: {
+    children: React.ReactNode;
+    /** Initial open state (uncontrolled). Default `false`. Ignored when `open` is provided. */
+    defaultOpen?: boolean;
+    /** Controlled open state. When provided, internal state is bypassed. */
+    open?: boolean;
+    /** Fires whenever the open state should change (clicks on trigger, outside-clicks, escape). */
+    onOpenChange?: (open: boolean) => void;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Wraps a single child element to act as the popover trigger. **Clones** the child to attach:
+ * - a `ref` callback that registers the element as the popover's anchor (composed with any
+ *   existing ref on the child),
+ * - an `onClick` handler that toggles the surrounding `PopoverRoot`'s open state (composed
+ *   with any existing `onClick`).
+ *
+ * No-ops (renders the child as-is) when used outside a `PopoverRoot`. Expects exactly one
+ * React element child that accepts `ref` and `onClick`.
+ */
+export declare const PopoverTrigger: ({ children, }: {
+    /** Single React element to use as the trigger. Must accept `ref` and `onClick`. */
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Wraps a single child element to close the surrounding popover when clicked. **Clones** the
+ * child to attach an `onClick` handler that flips the surrounding `PopoverRoot`'s open state
+ * to `false` (composed with any existing `onClick` on the child).
+ *
+ * ```tsx
+ * <PopoverRoot>
+ *   <PopoverTrigger><Button>Open</Button></PopoverTrigger>
+ *   <Popover>
+ *     ...
+ *     <PopoverClose><Button>Done</Button></PopoverClose>
+ *   </Popover>
+ * </PopoverRoot>
+ * ```
+ *
+ * No-ops (renders the child as-is) when used outside a `PopoverRoot`.
+ */
+export declare const PopoverClose: ({ children, }: {
+    /** Single React element to use as the close affordance. Must accept `onClick`. */
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export type PopoverPosition = 'top-start' | 'top' | 'top-end' | 'bottom-start' | 'bottom' | 'bottom-end' | 'left-start' | 'left' | 'left-end' | 'right-start' | 'right' | 'right-end';
+export type PopoverOffset = OffsetValue | [OffsetValue, OffsetValue];
+type OffsetValue = number | string;
+type PopoverOwnProps = {
+    /** Controlled open state. When omitted, falls back to the surrounding `PopoverRoot` state, then `false`. */
+    open?: boolean;
+    /** Fires whenever the open state should change. When omitted, falls back to the `PopoverRoot` setter. */
+    onOpenChange?: (open: boolean) => void;
+    /** Extra classes applied to the popover root `Surface`. */
+    className?: string;
+    /** Extra classes applied to the inner scrollable content area. Default includes `max-h-[70vh] overflow-auto`. */
+    contentClassName?: string;
+    /**
+     * Ref to the element the popover should anchor against. Defaults to the anchor registered
+     * by `PopoverRoot` + `PopoverTrigger`. CSS anchor positioning is used - an `anchor-name`
+     * is auto-applied to the element if it doesn't already have one.
+     */
+    anchorRef?: React.RefObject<HTMLElement | null>;
+    /**
+     * Static rect (or ref to one) to anchor against when there's no DOM anchor element
+     * (e.g. for a context menu opened at a pointer position). Ignored if `anchorRef.current` exists.
+     */
+    anchorRect?: DOMRect | React.RefObject<DOMRect>;
+    /**
+     * Portal target. CSS selector string (default `'#app, #__next, #root'` - first match wins),
+     * or `false` to render inline without portalling.
+     */
+    root?: string | boolean;
+    /** Anchor side + alignment. See `PopoverPosition`. Default `'bottom'`. */
+    position?: PopoverPosition;
+    /**
+     * Spacing from anchor. Either a single value (main axis only) or `[main, cross]`.
+     * Numbers are pixels; strings pass through (e.g. `'8px'`, `'50%'` - `%` resolves against
+     * `anchor-size(width|height)` depending on the position).
+     */
+    offset?: OffsetValue | [OffsetValue, OffsetValue];
+    /** Render a backdrop behind the popover. Default `false`. */
+    backdrop?: boolean;
+    /** Make the backdrop transparent (still captures clicks for outside-close). */
+    backdropTransparent?: boolean;
+    /** Accent color token (`Color` enum). Sets the popover's `color-{name}` class - used by border/ring/text helpers. */
+    color?: Color;
+    /** Popover content. */
+    children?: React.ReactNode;
+    /**
+     * Forwarded to the underlying `Surface` as `level`. Default depends on theme:
+     * `1` for light theme, `undefined` (parent + 1) for dark theme.
+     */
+    surfaceLevel?: number | string;
+    /** Surface variant. Default depends on theme: `'gradient'` for dark, `'solid'` for light. */
+    variant?: SurfaceVariant;
+    /** Outline ring on the popover surface. Default `true` for non-light themes. */
+    outline?: boolean;
+    /** Defer rendering until first opened, and unmount after close. */
+    lazy?: boolean;
+    /** Default `true`. */
+    closeOnBackdropClick?: boolean;
+    /** Default `true`. Suppressed automatically when this popover has a child popover/dialog open. */
+    closeOnEscape?: boolean;
+    /** Fires when the open transition begins (after `open` flips to `true`, before the animation). */
+    onOpen?: () => void;
+    /** Fires after the open transition completes (`transitionend` on the surface). */
+    onOpened?: () => void;
+    /** Fires when the close transition begins (after `open` flips to `false`, before the animation). */
+    onClose?: () => void;
+    /** Fires after the close transition completes - use for unmount/cleanup work tied to dismissal. */
+    onClosed?: () => void;
+    /** Forwarded to the popover surface root element. */
+    ref?: React.Ref<HTMLElement>;
+};
+export type PopoverProps = PopoverOwnProps & Omit<SurfaceProps, keyof PopoverOwnProps>;
+export declare const Popover: ({ open, onOpenChange, anchorRef, ...rest }: PopoverProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Popover.d.ts.map

package/components/Popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../../src/components/Popover.tsx"],"names":[],"mappings":"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"}