@justanarthur/modo-ui 0.0.0-stage → 0.1.0

package/dist/blocks/sidebar-app/index.d.ts

@@ -0,0 +1,34 @@
+import { JSX as JSX_1kxb } from "react";
+interface SidebarAppProps {
+	/** Start with the sidebar open; the preset starts it collapsed. Defaults to `false`. */
+	defaultOpen?: boolean;
+	/** The sidebar's layout (see Sidebar). Defaults to `'inset'`. */
+	variant?: "sidebar" | "floating" | "inset";
+	/** The edge it sits on. Defaults to `'left'`. */
+	side?: "left" | "right";
+	/** Open the collapsed sidebar while the pointer is at its edge or on the topbar's trigger (see Sidebar). Defaults to `false`. */
+	openOnHover?: boolean;
+	/** Fill the parent box instead of the viewport, as the examples do. Defaults to `false`. */
+	contained?: boolean;
+}
+type Element_12xgc = JSX_1kxb["Element"];
+/**
+* An app shell around the Sidebar, as Fluid Functionalism's playground preset
+* `sa1FQfCxH6` builds it: the inset layout, starting collapsed.
+*
+* Press the trigger in the topbar (or `[`) to bring the sidebar in. The
+* header holds a workspace switcher, a search field and a "New" row; two
+* thread sections fold from their labels and carry an "Add item" action;
+* every thread shows its status dot and, on hover, a "More options" menu;
+* the footer anchors the user row and two buttons. Pick a thread and the
+* active row melts over to it while the topbar follows.
+*
+* Every overlay grows out of what opened it: the switcher, the user menu
+* and the row menus are Dropdowns, the labels on the buttons are Tooltips,
+* a collapsed sidebar with `openOnHover` slides open from its edge, and below
+* the `md` breakpoint the sidebar is a Sheet growing out of the left edge.
+*
+* @example {@include ./examples.mdx}
+*/
+declare function SidebarApp({ defaultOpen, variant, side, openOnHover, contained }: SidebarAppProps): Element_12xgc;
+export { SidebarApp as default, SidebarAppProps };

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

@@ -0,0 +1,34 @@
+import {
+  SidebarApp
+} from "../../shared/components-s5pkbjx1.js";
+import"../../shared/components-40j34hdb.js";
+import"../../shared/components-74c20v2f.js";
+import"../../shared/components-nn6xezy2.js";
+import"../../shared/components-4xxddc44.js";
+import"../../shared/components-r43mqnd6.js";
+import"../../shared/components-de8xsm9y.js";
+import"../../shared/components-gndm6am4.js";
+import"../../shared/components-rc63qsy6.js";
+import"../../shared/components-vb033rns.js";
+import"../../shared/components-61ckf42z.js";
+import"../../shared/components-5vxtcp88.js";
+import"../../shared/components-5pkcfprd.js";
+import"../../shared/components-m5br529r.js";
+import"../../shared/components-jw16snbn.js";
+import"../../shared/components-ed7cmssr.js";
+import"../../shared/components-csxz9f52.js";
+import"../../shared/components-jxgznftn.js";
+import"../../shared/components-r22vtgqc.js";
+import"../../shared/components-e46kf6cp.js";
+import"../../shared/components-7zp99w5d.js";
+import"../../shared/components-dg0w8g5p.js";
+import"../../shared/components-kf2ehztc.js";
+import"../../shared/components-7nww01w4.js";
+import"../../shared/components-nnnd2xef.js";
+import"../../shared/components-vc1k7yv2.js";
+import"../../shared/components-x3rz4cyn.js";
+import"../../shared/components-0f0as45n.js";
+import"../../shared/components-kpbcms10.js";
+export {
+  SidebarApp as default
+};

package/dist/components/badge/index.d.ts

@@ -0,0 +1,59 @@
+import { VariantProps } from "class-variance-authority";
+import { HTMLAttributes } from "react";
+import { ClassProp as ClassProp_wz9o0r } from "class-variance-authority/types";
+import { ForwardRefExoticComponent as ForwardRefExoticComponent_tcubfn } from "react";
+import { RefAttributes as RefAttributes_miuf56 } from "react";
+declare const badgeColors: {
+	readonly gray: "var(--badge-gray)";
+	readonly red: "var(--badge-red)";
+	readonly orange: "var(--badge-orange)";
+	readonly amber: "var(--badge-amber)";
+	readonly yellow: "var(--badge-yellow)";
+	readonly lime: "var(--badge-lime)";
+	readonly green: "var(--badge-green)";
+	readonly emerald: "var(--badge-emerald)";
+	readonly teal: "var(--badge-teal)";
+	readonly cyan: "var(--badge-cyan)";
+	readonly blue: "var(--badge-blue)";
+	readonly indigo: "var(--badge-indigo)";
+	readonly violet: "var(--badge-violet)";
+	readonly purple: "var(--badge-purple)";
+	readonly fuchsia: "var(--badge-fuchsia)";
+	readonly pink: "var(--badge-pink)";
+	readonly rose: "var(--badge-rose)";
+};
+type BadgeColor = keyof typeof badgeColors;
+declare const badgeVariants: (props?: ({
+	variant?: "dot" | "solid" | null | undefined;
+	size?: "default" | "compact" | null | undefined;
+} & ClassProp_wz9o0r) | undefined) => string;
+type BadgeSizeCanonical = "default" | "compact";
+/** Public size values: the canonical two-size scale plus the pre-sizes-system
+*  aliases, kept so existing call sites keep compiling. Aliases resolve onto
+*  the canonical ladder (sm → compact; md/lg → default). */
+type BadgeSize = BadgeSizeCanonical | "sm" | "md" | "lg";
+interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, "color">, Omit<VariantProps<typeof badgeVariants>, "size"> {
+	/** Visual style. Solid uses a tinted background; dot shows a colored indicator. Defaults to `"solid"`. */
+	variant?: "solid" | "dot";
+	/** Step on the size ladder (see Sizes). Legacy sm/md/lg values resolve as aliases (sm → compact; md/lg → default). Defaults to the surrounding SizeProvider, else `"default"`. */
+	size?: BadgeSize;
+	/** Color from the Tailwind palette: gray, red, orange, amber, yellow, lime, green, emerald, teal, cyan, blue, indigo, violet, purple, fuchsia, pink, rose. Defaults to `"gray"`. */
+	color?: BadgeColor;
+}
+/**
+* Compact label for status, category, or metadata. Supports solid and dot
+* variants with Tailwind colors.
+*
+* Solid badges tint their background with the chosen color mixed into the
+* page background (gray uses the accent token); dot badges keep a neutral
+* border and show the color as a small indicator. The badge rides the size
+* ladder — `size` pins it, otherwise it follows the surrounding SizeProvider
+* — and takes its corner radius from the shape context. Changes animate: a
+* new label or variant springs the width while the label crossfades, and a
+* new color fades in. The palette is also exported as `badgeColors`, the class
+* recipe as `badgeVariants`.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const Badge: ForwardRefExoticComponent_tcubfn<BadgeProps & RefAttributes_miuf56<HTMLSpanElement>>;
+export { Badge as default, badgeVariants, badgeColors, BadgeSize, BadgeProps, BadgeColor, Badge };

package/dist/components/badge/index.js

@@ -0,0 +1,18 @@
+import {
+  Badge,
+  badgeColors,
+  badgeVariants,
+  badge_default
+} from "../../shared/components-9p8s8n5q.js";
+import"../../shared/components-7zp99w5d.js";
+import"../../shared/components-nnnd2xef.js";
+import"../../shared/components-vc1k7yv2.js";
+import"../../shared/components-x3rz4cyn.js";
+import"../../shared/components-0f0as45n.js";
+import"../../shared/components-kpbcms10.js";
+export {
+  badge_default as default,
+  badgeVariants,
+  badgeColors,
+  Badge
+};

package/dist/components/button/index.d.ts

@@ -0,0 +1,59 @@
+import { VariantProps } from "class-variance-authority";
+import { ButtonHTMLAttributes, ReactNode as ReactNode2 } from "react";
+import { ComponentType } from "react";
+interface IconComponentProps {
+	size?: number | string;
+	strokeWidth?: number | string;
+	className?: string;
+}
+type IconComponent = ComponentType<IconComponentProps>;
+import { ClassProp as ClassProp_wz9o0r } from "class-variance-authority/types";
+import { ForwardRefExoticComponent as ForwardRefExoticComponent_tcubfn } from "react";
+import { RefAttributes as RefAttributes_miuf56 } from "react";
+declare const buttonVariants: (props?: ({
+	variant?: "primary" | "secondary" | "tertiary" | "ghost" | null | undefined;
+	size?: "default" | "compact" | "icon" | "icon-compact" | null | undefined;
+	iconLeft?: boolean | null | undefined;
+	iconRight?: boolean | null | undefined;
+} & ClassProp_wz9o0r) | undefined) => string;
+type ButtonSizeCanonical = "default" | "compact" | "icon" | "icon-compact";
+/** Public size values: the canonical two-size scale plus the pre-sizes-system
+*  aliases, kept so existing call sites keep compiling. Aliases resolve onto
+*  the canonical ladder (sm → compact; md/lg → default). */
+type ButtonSize = ButtonSizeCanonical | "sm" | "md" | "lg" | "icon-sm" | "icon-lg";
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, Omit<VariantProps<typeof buttonVariants>, "size"> {
+	/** Visual style of the button. Defaults to `"primary"`. */
+	variant?: "primary" | "secondary" | "tertiary" | "ghost";
+	/** Step on the size ladder (36px default, 28px compact — see Sizes): `"default"` | `"compact"` | `"icon"` | `"icon-compact"`. Omitted, the button follows the surrounding SizeProvider. Legacy sm/md/lg values resolve as aliases (sm → compact; md/lg → default; icon-sm → icon-compact; icon-lg → icon). */
+	size?: ButtonSize;
+	/** Merge props onto the child element instead of rendering a `<button>` — the single React-element child becomes the rendered element (slot-style). Defaults to `false`. */
+	asChild?: boolean;
+	/** Folds the button into a circle around a spinner and disables it; the button keeps its box, so nothing around it moves. Defaults to `false`. */
+	loading?: boolean;
+	/** Icon displayed before the label. */
+	leadingIcon?: IconComponent;
+	/** Icon displayed after the label. */
+	trailingIcon?: IconComponent;
+	/** Forces the pressed/held visual — e.g. while a dropdown or popover the button opened is showing. Defaults to `false`. */
+	active?: boolean;
+	/** Disables the button. Defaults to `false`. */
+	disabled?: boolean;
+	/** The label. With `size="icon"` / `"icon-compact"`, the icon itself (give the button an `aria-label`). */
+	children?: ReactNode2;
+}
+/**
+* Versatile button with variants, sizes, loading state, and icon support.
+*
+* Four variants (primary, secondary, tertiary, ghost) on the two-step size
+* ladder: 36px by default, 28px compact — an explicit `size` wins, otherwise
+* the button follows the surrounding SizeProvider. The press effect shrinks
+* the fill by exactly 1px per side at any width, icons thicken their stroke
+* on hover, and `loading` folds the surface into a circle around a spinner
+* (and back when it ends) while the button keeps its box, so nothing around
+* it moves. Built on Base UI's Button; `asChild` renders your own
+* element (e.g. a link) with the button's styling instead.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const Button: ForwardRefExoticComponent_tcubfn<ButtonProps & RefAttributes_miuf56<HTMLButtonElement>>;
+export { Button as default, buttonVariants, ButtonSize, ButtonProps, Button };

package/dist/components/button/index.js

@@ -0,0 +1,16 @@
+import {
+  Button,
+  buttonVariants,
+  button_default
+} from "../../shared/components-5pkcfprd.js";
+import"../../shared/components-7zp99w5d.js";
+import"../../shared/components-nnnd2xef.js";
+import"../../shared/components-vc1k7yv2.js";
+import"../../shared/components-x3rz4cyn.js";
+import"../../shared/components-0f0as45n.js";
+import"../../shared/components-kpbcms10.js";
+export {
+  button_default as default,
+  buttonVariants,
+  Button
+};

package/dist/components/card/index.d.ts

@@ -0,0 +1,141 @@
+import { ForwardRefExoticComponent, HTMLAttributes, ReactNode as ReactNode2, RefAttributes } from "react";
+import { ComponentType } from "react";
+interface IconComponentProps {
+	size?: number | string;
+	strokeWidth?: number | string;
+	className?: string;
+}
+type IconComponent = ComponentType<IconComponentProps>;
+type SizeVariant = "default" | "compact";
+import { JSX as JSX_1kxb2 } from "react";
+type CardOrientation = "card" | "inline";
+type CardBorder = "none" | "outlined";
+interface CardGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, "onDrag"> {
+	/** How each card lays its own content out.
+	*  "card" — stacked vertically (media/header on top). "inline" — a
+	*  horizontal row (leading media, trailing footer), like a Table row.
+	*  @default "card" */
+	orientation?: CardOrientation;
+	/** Number of grid columns. >1 enables 2-D fluid hover across rows and columns.
+	*  @default 1 */
+	columns?: number;
+	/** "none" — borderless (default), separated only by subtle dividers.
+	*  "outlined" — draws a border: one shared frame when grouped, or one per
+	*  card when `separated`. @default "none" */
+	border?: CardBorder;
+	/** Split the group into individually-shaped cards with a gap between them
+	*  (a grid of tiles) instead of one continuous divided block. @default false */
+	separated?: boolean;
+	/** Enable the magnetic fluid-hover highlight. @default true */
+	fluidHover?: boolean;
+}
+declare const CardGroup: ForwardRefExoticComponent<CardGroupProps & RefAttributes<HTMLDivElement>>;
+interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "onClick"> {
+	/** Compositional parts: Card.Image, Card.Media, Card.Header, Card.Content, Card.Footer. */
+	children?: ReactNode2;
+	/** Makes the whole card a clickable target (stretched button); fluid hover previews it. */
+	onClick?: () => void;
+	/** Makes the whole card a link (stretched anchor). */
+	href?: string;
+	/** Opens href in a new tab. Defaults to `false`. */
+	external?: boolean;
+	/** Accessible name for the stretched link/button when the whole card is clickable (the visible title isn't wired up automatically). */
+	label?: string;
+	/** Persistent selected fill + title emphasis, on top of fluid hover. The group drops the hairline dividers around the selected card so the fill reads clean. Defaults to `false`. */
+	selected?: boolean;
+	/** Dims and disables the card. Defaults to `false`. */
+	disabled?: boolean;
+	/** Shows a dismiss (✕) button, revealed on hover or focus by default. Defaults to `false`. */
+	dismissible?: boolean;
+	/** Keeps the dismiss control hidden until the card is hovered or holds focus. Pass false for an always-visible ✕. Defaults to `true`. */
+	dismissOnHover?: boolean;
+	/** Called when the dismiss button is pressed. */
+	onDismiss?: () => void;
+	/** Pins the card to one step of the size ladder — compact tightens type and padding. Omitted, it follows the surrounding SizeProvider. */
+	size?: SizeVariant;
+	/** Injected by Card.Group — do not set by hand. */
+	index?: number;
+}
+type CardComponent = ForwardRefExoticComponent<CardProps & RefAttributes<HTMLDivElement>> & {
+	Group: typeof CardGroup;
+	Header: typeof CardHeader;
+	Title: typeof CardTitle;
+	Description: typeof CardDescription;
+	Action: typeof CardAction;
+	Content: typeof CardContent;
+	Footer: typeof CardFooter;
+	Media: typeof CardMedia;
+	Image: typeof CardImage;
+	Eyebrow: typeof CardEyebrow;
+	Feature: typeof CardFeature;
+	Button: typeof CardButton;
+};
+/**
+* shadcn's compositional card, dressed in Fluid Functionalism. Stacked,
+* inline, or grid — borderless by default with fluid hover that previews
+* where a click will land.
+*
+* The same parts and data-slot contract as shadcn's Card, on a transparent,
+* borderless surface: a card inherits its parent's substrate and leans on
+* hairline dividers rather than a drawn frame. Card.Group owns the layout (a
+* stacked list, inline rows or a grid) and assigns every child its fluid
+* hover index; only a clickable card (`onClick` or `href`) joins the magnetic
+* highlight. A clickable card is one stretched button or link, while footer
+* actions and Card.Action stay independently clickable above it.
+*
+* Statics: Card.Group (orientation "card" | "inline", columns, border "none"
+* | "outlined", separated, fluidHover), Card.Header (title + description
+* grid, pins Card.Action top-right), Card.Title (weight-animates when the card
+* is selected), Card.Description, Card.Action, Card.Content, Card.Footer (the
+* actions row), Card.Media (an icon tile, a logo or a [logoA, logoB] pair),
+* Card.Image (full-bleed banner, or a leading image when inline),
+* Card.Eyebrow (small uppercase label), Card.Feature (icon + title +
+* description row) and Card.Button (primary | secondary | ghost | link
+* action; an anchor when given `href`).
+*
+* @example {@include ./examples.mdx}
+*/
+declare const Card: CardComponent;
+declare const CardHeader: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+declare const CardTitle: ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & RefAttributes<HTMLSpanElement>>;
+declare const CardDescription: ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & RefAttributes<HTMLParagraphElement>>;
+declare const CardAction: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+declare const CardContent: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+declare const CardFooter: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & RefAttributes<HTMLDivElement>>;
+type CardLogo = string | [string, string];
+interface CardMediaProps {
+	logo?: CardLogo;
+	logoAlt?: string;
+	icon?: IconComponent;
+	size?: number;
+	className?: string;
+}
+type Element_12xgc2 = JSX_1kxb2["Element"];
+declare function CardMedia({ logo, logoAlt, icon: Icon, size, className }: CardMediaProps): Element_12xgc2 | null;
+interface CardImageProps {
+	src: string;
+	alt?: string;
+	className?: string;
+}
+declare function CardImage({ src, alt, className }: CardImageProps): Element_12xgc2;
+declare const CardEyebrow: ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & RefAttributes<HTMLSpanElement>>;
+interface CardFeatureProps {
+	icon?: IconComponent;
+	title: string;
+	description?: string;
+}
+declare function CardFeature({ icon: Icon, title, description }: CardFeatureProps): Element_12xgc2;
+type CardButtonVariant = "primary" | "secondary" | "ghost" | "link";
+interface CardButtonProps {
+	children: React.ReactNode2;
+	onClick?: () => void;
+	href?: string;
+	variant?: CardButtonVariant;
+	icon?: IconComponent;
+	iconPosition?: "start" | "end";
+	/** Opens the href in a new tab and appends an outward arrow glyph. */
+	external?: boolean;
+	disabled?: boolean;
+}
+declare function CardButton({ children, onClick, href, variant, icon: Icon, iconPosition, external, disabled }: CardButtonProps): Element_12xgc2;
+export { Card as default, CardTitle, CardProps, CardMedia, CardLogo, CardImage, CardHeader, CardGroupProps, CardGroup, CardFooter, CardFeature, CardEyebrow, CardDescription, CardContent, CardButtonVariant, CardButtonProps, CardButton, CardAction, Card };

package/dist/components/card/index.js

@@ -0,0 +1,44 @@
+import {
+  Card,
+  CardAction,
+  CardButton,
+  CardContent,
+  CardDescription,
+  CardEyebrow,
+  CardFeature,
+  CardFooter,
+  CardGroup,
+  CardHeader,
+  CardImage,
+  CardMedia,
+  CardTitle,
+  card_default
+} from "../../shared/components-bf2d9k02.js";
+import"../../shared/components-vb033rns.js";
+import"../../shared/components-m5br529r.js";
+import"../../shared/components-r22vtgqc.js";
+import"../../shared/components-e46kf6cp.js";
+import"../../shared/components-7zp99w5d.js";
+import"../../shared/components-kf2ehztc.js";
+import"../../shared/components-7nww01w4.js";
+import"../../shared/components-nnnd2xef.js";
+import"../../shared/components-vc1k7yv2.js";
+import"../../shared/components-x3rz4cyn.js";
+import"../../shared/components-0f0as45n.js";
+import"../../shared/components-kpbcms10.js";
+export {
+  card_default as default,
+  CardTitle,
+  CardMedia,
+  CardImage,
+  CardHeader,
+  CardGroup,
+  CardFooter,
+  CardFeature,
+  CardEyebrow,
+  CardDescription,
+  CardContent,
+  CardButton,
+  CardAction,
+  Card
+};

package/dist/components/inputs/checkbox-group/index.d.ts

@@ -0,0 +1,50 @@
+import { ForwardRefExoticComponent, HTMLAttributes, ReactNode, RefAttributes } from "react";
+type SizeVariant = "default" | "compact";
+interface CheckboxGroupProps extends HTMLAttributes<HTMLDivElement> {
+	/** CheckboxGroup.Item children. */
+	children: ReactNode;
+	/** Set of checked item indices; drives the merged background across contiguous picks. Controlled — pair it with `onCheckedIndicesChange` (or per-item `onToggle`). */
+	checkedIndices?: Set<number>;
+	/** Checked indices on first render when uncontrolled (a Set or an array). Defaults to none. */
+	defaultCheckedIndices?: Set<number> | number[];
+	/** Called with the next checked set whenever an item is toggled. */
+	onCheckedIndicesChange?: (checkedIndices: Set<number>) => void;
+	/** Pins the group's rows to one step of the size ladder (default 36px, compact 28px). Defaults to the surrounding SizeProvider. */
+	size?: SizeVariant;
+}
+type CheckboxGroupComponent = ForwardRefExoticComponent<CheckboxGroupProps & RefAttributes<HTMLDivElement>> & {
+	Item: typeof CheckboxItem;
+};
+/**
+* Checkbox group with merged backgrounds for contiguous selections.
+*
+* Each row is a `CheckboxGroup.Item` with a stable `index`. Contiguous checked
+* rows share one background: a checked row's background grows out of its
+* center and melts into its neighbours, an unchecked one pinches off and
+* shrinks away (the liquid indicators in Morph). A fluid hover highlight melts
+* from row to row, and Arrow Up/Down,
+* Home and End move focus while Space or Enter toggles. The checked label
+* animates to semibold without shifting its width. The group is uncontrolled
+* with `defaultCheckedIndices`, or controlled with `checkedIndices` plus
+* `onCheckedIndicesChange` — FF's per-item `checked` / `onToggle` still work
+* and override the group state for their row.
+*
+* Statics:
+* - `CheckboxGroup.Item` — one checkbox row: `label`, `index`, and optional
+*   `checked` / `onToggle`.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const CheckboxGroup: CheckboxGroupComponent;
+interface CheckboxItemProps extends HTMLAttributes<HTMLDivElement> {
+	/** Text label for the checkbox. */
+	label: string;
+	/** Position index within the group. */
+	index: number;
+	/** Whether this item is checked. Defaults to the group's checked set. */
+	checked?: boolean;
+	/** Called when this item is toggled (the group's `onCheckedIndicesChange` fires too). */
+	onToggle?: () => void;
+}
+declare const CheckboxItem: ForwardRefExoticComponent<CheckboxItemProps & RefAttributes<HTMLDivElement>>;
+export { CheckboxGroup as default, CheckboxItemProps, CheckboxItem, CheckboxGroupProps, CheckboxGroup };

package/dist/components/inputs/checkbox-group/index.js

@@ -0,0 +1,23 @@
+import {
+  CheckboxGroup,
+  CheckboxItem,
+  checkbox_group_default
+} from "../../../shared/components-y3cqdrgy.js";
+import"../../../shared/components-rc63qsy6.js";
+import"../../../shared/components-vb033rns.js";
+import"../../../shared/components-r22vtgqc.js";
+import"../../../shared/components-e46kf6cp.js";
+import"../../../shared/components-7zp99w5d.js";
+import"../../../shared/components-dg0w8g5p.js";
+import"../../../shared/components-kf2ehztc.js";
+import"../../../shared/components-7nww01w4.js";
+import"../../../shared/components-nnnd2xef.js";
+import"../../../shared/components-vc1k7yv2.js";
+import"../../../shared/components-x3rz4cyn.js";
+import"../../../shared/components-0f0as45n.js";
+import"../../../shared/components-kpbcms10.js";
+export {
+  checkbox_group_default as default,
+  CheckboxItem,
+  CheckboxGroup
+};

package/dist/components/inputs/color-picker/index.d.ts

@@ -0,0 +1,137 @@
+import { CSSProperties, ForwardRefExoticComponent, HTMLAttributes, ReactNode, RefAttributes, RefObject } from "react";
+type SizeVariant = "default" | "compact";
+import { JSX as JSX_1kxb } from "react";
+type ColorFormat = "hex" | "rgb" | "hsl" | "oklch";
+type Element_12xgc = JSX_1kxb["Element"];
+declare function ColorPickerPortalContainer({ value, children }: {
+	value: HTMLElement | null;
+	children: ReactNode;
+}): Element_12xgc;
+interface ParsedColor {
+	h: number;
+	s: number;
+	v: number;
+	a: number;
+	r: number;
+	g: number;
+	b: number;
+	hex: string;
+	rgb: string;
+	hsl: string;
+	oklch: string;
+}
+interface ColorPickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue"> {
+	/** Controlled color value, in any of the supported formats. Omit it to let the picker keep its own state, seeded from `defaultValue`. */
+	value?: string;
+	/** Initial color when uncontrolled — any CSS color string, named colors included. Defaults to `"#6B97FF"`. */
+	defaultValue?: string;
+	/** Fired on every change. Receives the formatted string and a parsed color object carrying every format. */
+	onValueChange?: (value: string, parsed: ParsedColor) => void;
+	/** Controlled format selection. */
+	format?: ColorFormat;
+	/** Initial format when uncontrolled. Defaults to `"hex"`. */
+	defaultFormat?: ColorFormat;
+	/** Fired when the user switches format. */
+	onFormatChange?: (format: ColorFormat) => void;
+	/** Optional preset swatches. When omitted, the strip is hidden. */
+	swatches?: string[];
+	/** Force-hide the eyedropper button — it is hidden automatically in browsers that do not support it. Defaults to `false`. */
+	hideEyedropper?: boolean;
+	/** Controls the format dropdown's open state. When provided, the dropdown is fully controlled and ignores user toggles. */
+	formatOpen?: boolean;
+	/** Initial open state for the format dropdown (uncontrolled). Defaults to `false`. */
+	defaultFormatOpen?: boolean;
+	/** Pins trigger and popover to one step of the size ladder (default 36px, compact 28px — see Sizes). Omitted, they follow the surrounding SizeProvider. */
+	size?: SizeVariant;
+	/** Merged after the panel's surface, radius and padding classes. */
+	className?: string;
+}
+interface ColorPickerPopoverProps extends ColorPickerProps {
+	/** Optional label rendered alongside the color tile. */
+	triggerLabel?: string;
+	/** Position of the label relative to the color tile. Defaults to `"left"`. */
+	triggerLabelPosition?: "left" | "right";
+	/** Show the hex value (without alpha) next to the tile. Defaults to `true`. */
+	triggerShowValue?: boolean;
+	/** Render an X button on the trigger; pairs with `onTriggerRemove`. Defaults to `false`. */
+	triggerShowRemove?: boolean;
+	/** Fired when the X button is clicked. */
+	onTriggerRemove?: () => void;
+	/** Custom classes on the trigger button. */
+	triggerClassName?: string;
+	/** Controls the popover's open state. When provided, the popover is fully
+	*  controlled and ignores trigger clicks. */
+	open?: boolean;
+	/** Initial open state for the popover (uncontrolled). Defaults to `false`. */
+	defaultOpen?: boolean;
+	/** Called when the open state would change (fires even when controlled). */
+	onOpenChange?: (open: boolean) => void;
+	/** Where the panel grows from (see Morph): the trigger, the press point, its own center, a viewport edge, or a ref to any element. Defaults to `'trigger'`. */
+	from?: "trigger" | "pointer" | "center" | "top" | "right" | "bottom" | "left" | RefObject<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 trigger while open, so it reads as turning into the panel. Defaults to `false`. */
+	hideSource?: boolean;
+	/** Spring tier of a plain morph, slide or fade; goo runs on its own `spring.goo`. Defaults to `'slow'`. */
+	tier?: "moderate" | "slow";
+}
+interface ColorSwatchProps extends Omit<HTMLAttributes<HTMLButtonElement>, "color"> {
+	/** The swatch color — any CSS color string. */
+	color: string;
+	/** Edge length in pixels. Defaults to `28`. */
+	size?: number;
+	/** Draws the selection ring. */
+	selected?: boolean;
+}
+declare function parseColor(input: string): {
+	r: number;
+	g: number;
+	b: number;
+	a: number;
+} | null;
+declare function buildParsed(h: number, s: number, v: number, a: number): ParsedColor;
+interface ColorTileProps {
+	color: string;
+	size?: number;
+	className?: string;
+	style?: CSSProperties;
+}
+declare function ColorTile({ color, size, className, style }: ColorTileProps): Element_12xgc;
+declare const ColorSwatch: ForwardRefExoticComponent<ColorSwatchProps & RefAttributes<HTMLButtonElement>>;
+type ColorPickerComponent = ForwardRefExoticComponent<ColorPickerProps & RefAttributes<HTMLDivElement>> & {
+	/** `ColorPickerPopover` — the same panel behind a trigger button. */
+	Popover: typeof ColorPickerPopover;
+};
+/**
+* Color picker with HEX, RGB, HSL, and OKLCH formats, an alpha channel,
+* optional swatches, and an eyedropper. Available as an inline panel or a
+* popover.
+*
+* The value is kept internally as HSV, so hue survives a pass through pure
+* black, pure white or full grey instead of collapsing to red. Every edit —
+* the saturation square, the hue and alpha sliders, the per-channel inputs,
+* a swatch, the eyedropper — writes to that one canonical color, which is
+* re-emitted in the active format together with a parsed object carrying all
+* four. Numeric channels scrub: drag sideways to sweep a value, click to type
+* it. Alpha reads against a checkerboard, swatches accept any CSS color string
+* (named colors included), and OKLCH edits keep the hue you typed across the
+* lossy trip back through sRGB. The panel paints itself on the surface ladder
+* and re-provides its level, so the format menu elevates above it however
+* deeply the picker is nested.
+*
+* Statics:
+* - `ColorPicker.Popover` — `ColorPickerPopover`: the same panel behind a
+*   trigger button showing a color tile, an optional label and the hex value.
+*   The panel oozes out of the trigger and back through the shared morph (see
+*   Morph), with the morph options `from`, `effect`, `hideSource`, `tier`.
+*
+* Also exported: `ColorSwatch` and `ColorTile` (the swatch button and the
+* checkerboard tile), `ColorPickerPortalContainer` (portal the format menu
+* into a given element — e.g. inside a CSS-scaled ancestor), and the
+* `parseColor` / `buildParsed` color helpers.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const ColorPicker: ColorPickerComponent;
+declare const ColorPickerPopover: ForwardRefExoticComponent<ColorPickerPopoverProps & RefAttributes<HTMLDivElement>>;
+export { parseColor, ColorPicker as default, buildParsed, ParsedColor, ColorTile, ColorSwatchProps, ColorSwatch, ColorPickerProps, ColorPickerPortalContainer, ColorPickerPopoverProps, ColorPickerPopover, ColorPicker, ColorFormat };