@ashwa-io/ui 0.0.3 → 0.0.5

package/dist/components/atomic/Button/buttonLook.js

@@ -0,0 +1,18 @@
+import { BUTTON_VARIANT } from "./buttonVariant.js";
+// src/components/atomic/Button/buttonLook.ts
+const TEXT_SIZE = {
+	sm: "sm",
+	md: "default",
+	lg: "lg"
+};
+const ICON_SIZE = {
+	sm: "icon-sm",
+	md: "icon",
+	lg: "icon-lg"
+};
+/** Primitive props for an overlay trigger drawn in the public Button look. */
+const buttonLook = (variant, size, iconOnly) => ({
+	variant: BUTTON_VARIANT[variant],
+	size: (iconOnly ? ICON_SIZE : TEXT_SIZE)[size]
+});
+export { buttonLook };

package/dist/components/atomic/Checkbox/Checkbox.d.ts

@@ -0,0 +1,11 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+export interface CheckboxProps extends FieldBaseProps {
+  value: boolean;
+  onChange: (value: boolean) => void;
+  onBlur?: () => void;
+  name?: string;
+  readOnly?: boolean;
+  ref?: React.Ref<HTMLElement>;
+}
+export declare const Checkbox: React.FC<CheckboxProps>;

package/dist/components/atomic/Checkbox/Checkbox.js

@@ -0,0 +1,32 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Checkbox as Checkbox$1 } from "../../ui/checkbox.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/atomic/Checkbox/Checkbox.tsx
+const Checkbox = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, value, onChange, onBlur, name, readOnly = false, ref } = props;
+	return /* @__PURE__ */ jsx(FormField, {
+		orientation: "horizontal",
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsx(Checkbox$1, {
+			ref,
+			id: control.id,
+			"aria-describedby": control["aria-describedby"],
+			"aria-invalid": control["aria-invalid"],
+			"aria-required": control["aria-required"],
+			disabled: control.disabled,
+			checked: value,
+			onCheckedChange: (checked) => onChange(checked),
+			onBlur,
+			name,
+			readOnly
+		})
+	});
+};
+export { Checkbox };

package/dist/components/atomic/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+import { Checkbox, CheckboxProps } from "./Checkbox.js";
+export { Checkbox, type CheckboxProps };

package/dist/components/atomic/ColorInput/ColorInput.d.ts

@@ -0,0 +1,15 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+export interface ColorInputProps extends FieldBaseProps {
+  /** 6-digit hex, e.g. '#1a73e8' (orgs.primaryColor), or the text being typed. */
+  value: string;
+  /**
+   * A valid 6-digit hex arrives normalized ('#1a73e8'); anything else arrives as typed, so the
+   * form's validation can flag it (e.g. `validate: v => /^#[0-9a-f]{6}$/.test(v) || '…'`).
+   */
+  onChange: (value: string) => void;
+  onBlur?: () => void;
+  name?: string;
+  ref?: React.Ref<HTMLInputElement>;
+}
+export declare const ColorInput: React.FC<ColorInputProps>;

package/dist/components/atomic/ColorInput/ColorInput.js

@@ -0,0 +1,44 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Input } from "../../ui/input.js";
+import { normalizeHex } from "./colorHex.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/atomic/ColorInput/ColorInput.tsx
+const ColorInput = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, value, onChange, onBlur, name, ref } = props;
+	const handleText = (next) => onChange(normalizeHex(next) ?? next);
+	return /* @__PURE__ */ jsx(FormField, {
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2",
+			children: [/* @__PURE__ */ jsx("input", {
+				type: "color",
+				"aria-label": `${label} picker`,
+				value: normalizeHex(value) ?? "#000000",
+				disabled: control.disabled,
+				onChange: (event) => handleText(event.target.value),
+				className: "border-input h-8 w-10 shrink-0 cursor-pointer rounded-lg border bg-transparent p-0.5 disabled:cursor-not-allowed disabled:opacity-50"
+			}), /* @__PURE__ */ jsx(Input, {
+				ref,
+				id: control.id,
+				"aria-describedby": control["aria-describedby"],
+				"aria-invalid": control["aria-invalid"],
+				"aria-required": control["aria-required"],
+				disabled: control.disabled,
+				name,
+				value,
+				spellCheck: false,
+				autoComplete: "off",
+				onChange: (event) => handleText(event.target.value),
+				onBlur
+			})]
+		})
+	});
+};
+export { ColorInput };

package/dist/components/atomic/ColorInput/colorHex.js

@@ -0,0 +1,8 @@
+// src/components/atomic/ColorInput/colorHex.ts
+const HEX6 = /^#?([0-9a-f]{6})$/i;
+/** '#1A73E8' | '1a73e8' → '#1a73e8'; anything that is not 6 hex digits → null. */
+const normalizeHex = (input) => {
+	const match = HEX6.exec(input.trim());
+	return match ? `#${match[1].toLowerCase()}` : null;
+};
+export { normalizeHex };

package/dist/components/atomic/ColorInput/index.d.ts

@@ -0,0 +1,2 @@
+import { ColorInput, ColorInputProps } from "./ColorInput.js";
+export { ColorInput, type ColorInputProps };

package/dist/components/atomic/Select/Select.d.ts

@@ -0,0 +1,18 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+export interface SelectOption {
+  value: string;
+  label: string;
+  disabled?: boolean;
+}
+export interface SelectProps extends FieldBaseProps {
+  options: SelectOption[];
+  /** null = nothing picked; the placeholder shows. */
+  value: string | null;
+  onChange: (value: string) => void;
+  onBlur?: () => void;
+  name?: string;
+  placeholder?: string;
+  ref?: React.Ref<HTMLButtonElement>;
+}
+export declare const Select: React.FC<SelectProps>;

package/dist/components/atomic/Select/Select.js

@@ -0,0 +1,47 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Select as Select$1, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../ui/select.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/atomic/Select/Select.tsx
+const LEFT_FIELD_REASONS = /* @__PURE__ */ new Set(["outside-press", "focus-out"]);
+const Select = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, options, value, onChange, onBlur, name, placeholder, ref } = props;
+	return /* @__PURE__ */ jsx(FormField, {
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsxs(Select$1, {
+			items: options,
+			value,
+			onValueChange: (next) => {
+				if (next !== null) onChange(next);
+			},
+			onOpenChange: (open, details) => {
+				if (!open && LEFT_FIELD_REASONS.has(details.reason)) onBlur?.();
+			},
+			name,
+			disabled: control.disabled,
+			children: [/* @__PURE__ */ jsx(SelectTrigger, {
+				ref,
+				id: control.id,
+				"aria-describedby": control["aria-describedby"],
+				"aria-invalid": control["aria-invalid"],
+				"aria-required": control["aria-required"],
+				onBlur: (event) => {
+					if (!event.relatedTarget?.closest("[data-slot=\"select-content\"]")) onBlur?.();
+				},
+				className: "w-full",
+				children: /* @__PURE__ */ jsx(SelectValue, { placeholder })
+			}), /* @__PURE__ */ jsx(SelectContent, { children: options.map((option) => /* @__PURE__ */ jsx(SelectItem, {
+				value: option.value,
+				disabled: option.disabled,
+				children: option.label
+			}, option.value)) })]
+		})
+	});
+};
+export { Select };

package/dist/components/atomic/Select/index.d.ts

@@ -0,0 +1,2 @@
+import { Select, SelectOption, SelectProps } from "./Select.js";
+export { Select, type SelectOption, type SelectProps };

package/dist/components/atomic/Switch/Switch.d.ts

@@ -0,0 +1,11 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+export interface SwitchProps extends FieldBaseProps {
+  value: boolean;
+  onChange: (value: boolean) => void;
+  onBlur?: () => void;
+  name?: string;
+  readOnly?: boolean;
+  ref?: React.Ref<HTMLElement>;
+}
+export declare const Switch: React.FC<SwitchProps>;

package/dist/components/atomic/Switch/Switch.js

@@ -0,0 +1,32 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Switch as Switch$1 } from "../../ui/switch.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/atomic/Switch/Switch.tsx
+const Switch = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, value, onChange, onBlur, name, readOnly = false, ref } = props;
+	return /* @__PURE__ */ jsx(FormField, {
+		orientation: "horizontal",
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsx(Switch$1, {
+			ref,
+			id: control.id,
+			"aria-describedby": control["aria-describedby"],
+			"aria-invalid": control["aria-invalid"],
+			"aria-required": control["aria-required"],
+			disabled: control.disabled,
+			checked: value,
+			onCheckedChange: (checked) => onChange(checked),
+			onBlur,
+			name,
+			readOnly
+		})
+	});
+};
+export { Switch };

package/dist/components/atomic/Switch/index.d.ts

@@ -0,0 +1,2 @@
+import { Switch, SwitchProps } from "./Switch.js";
+export { Switch, type SwitchProps };

package/dist/components/atomic/TextArea/TextArea.d.ts

@@ -0,0 +1,14 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+export interface TextAreaProps extends FieldBaseProps {
+  value: string;
+  onChange: (value: string) => void;
+  onBlur?: () => void;
+  name?: string;
+  placeholder?: string;
+  rows?: number;
+  maxLength?: number;
+  readOnly?: boolean;
+  ref?: React.Ref<HTMLTextAreaElement>;
+}
+export declare const TextArea: React.FC<TextAreaProps>;

package/dist/components/atomic/TextArea/TextArea.js

@@ -0,0 +1,35 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Textarea } from "../../ui/textarea.js";
+import { jsx } from "react/jsx-runtime";
+// src/components/atomic/TextArea/TextArea.tsx
+const TextArea = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, value, onChange, onBlur, name, placeholder, rows = 3, maxLength, readOnly = false, ref } = props;
+	return /* @__PURE__ */ jsx(FormField, {
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsx(Textarea, {
+			ref,
+			id: control.id,
+			"aria-describedby": control["aria-describedby"],
+			"aria-invalid": control["aria-invalid"],
+			"aria-required": control["aria-required"],
+			disabled: control.disabled,
+			name,
+			value,
+			placeholder,
+			rows,
+			maxLength,
+			readOnly,
+			onChange: (event) => onChange(event.target.value),
+			onBlur,
+			className: "field-sizing-fixed"
+		})
+	});
+};
+export { TextArea };

package/dist/components/atomic/TextArea/index.d.ts

@@ -0,0 +1,2 @@
+import { TextArea, TextAreaProps } from "./TextArea.js";
+export { TextArea, type TextAreaProps };

package/dist/components/atomic/TextInput/TextInput.d.ts

@@ -0,0 +1,18 @@
+import { FieldBaseProps, IconComponent } from "../../../lib/types.js";
+import React from "react";
+export type TextInputType = 'text' | 'email' | 'password' | 'search' | 'tel' | 'url';
+export interface TextInputProps extends FieldBaseProps {
+  value: string;
+  onChange: (value: string) => void;
+  onBlur?: () => void;
+  name?: string;
+  placeholder?: string;
+  type?: TextInputType;
+  /** Leading icon, decorative (aria-hidden). */
+  icon?: IconComponent;
+  readOnly?: boolean;
+  /** e.g. 'username', 'current-password' on login forms. */
+  autoComplete?: string;
+  ref?: React.Ref<HTMLInputElement>;
+}
+export declare const TextInput: React.FC<TextInputProps>;

package/dist/components/atomic/TextInput/TextInput.js

@@ -0,0 +1,42 @@
+import { FormField } from "../../molecule/FormField/FormField.js";
+import { Input } from "../../ui/input.js";
+import { cn } from "../../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/atomic/TextInput/TextInput.tsx
+const TextInput = (props) => {
+	const { label, hideLabel, description, error, required, disabled, id, "data-testid": testId, value, onChange, onBlur, name, placeholder, type = "text", icon: Icon, readOnly = false, autoComplete, ref } = props;
+	return /* @__PURE__ */ jsx(FormField, {
+		label,
+		hideLabel,
+		description,
+		error,
+		required,
+		disabled,
+		id,
+		"data-testid": testId,
+		children: (control) => /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [Icon && /* @__PURE__ */ jsx(Icon, {
+				"aria-hidden": true,
+				className: "text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2"
+			}), /* @__PURE__ */ jsx(Input, {
+				ref,
+				id: control.id,
+				"aria-describedby": control["aria-describedby"],
+				"aria-invalid": control["aria-invalid"],
+				"aria-required": control["aria-required"],
+				disabled: control.disabled,
+				type,
+				name,
+				value,
+				placeholder,
+				readOnly,
+				autoComplete,
+				onChange: (event) => onChange(event.target.value),
+				onBlur,
+				className: cn(Icon && "pl-8")
+			})]
+		})
+	});
+};
+export { TextInput };

package/dist/components/atomic/TextInput/index.d.ts

@@ -0,0 +1,2 @@
+import { TextInput, TextInputProps, TextInputType } from "./TextInput.js";
+export { TextInput, type TextInputProps, type TextInputType };

package/dist/components/atomic/Tooltip/Tooltip.d.ts

@@ -0,0 +1,14 @@
+import { OverlaySide } from "../../../lib/types.js";
+import React from "react";
+export interface TooltipProps {
+  /**
+   * Short plain text, a visual hint only: screen readers don't get it, and it needs a focusable
+   * child to appear for keyboards. Never put essential information only here.
+   */
+  content: string;
+  children: React.ReactNode;
+  side?: OverlaySide;
+  /** Lets a full-width child (e.g. `<Button fullWidth>`) fill its container. */
+  fullWidth?: boolean;
+}
+export declare const Tooltip: React.FC<TooltipProps>;

package/dist/components/atomic/Tooltip/Tooltip.js

@@ -0,0 +1,14 @@
+import { Tooltip as Tooltip$1, TooltipContent, TooltipProvider, TooltipTrigger } from "../../ui/tooltip.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/atomic/Tooltip/Tooltip.tsx
+const Tooltip = (props) => {
+	const { content, children, side = "top", fullWidth = false } = props;
+	return /* @__PURE__ */ jsx(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip$1, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+		render: /* @__PURE__ */ jsx("span", { className: fullWidth ? "flex w-full" : "inline-flex max-w-full min-w-0" }),
+		children
+	}), /* @__PURE__ */ jsx(TooltipContent, {
+		side,
+		children: content
+	})] }) });
+};
+export { Tooltip };

package/dist/components/atomic/Tooltip/index.d.ts

@@ -0,0 +1,2 @@
+import { Tooltip, TooltipProps } from "./Tooltip.js";
+export { Tooltip, type TooltipProps };

package/dist/components/layout/FormLayout/FormLayout.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export type FormLayoutDirection = 'vertical' | 'horizontal';
+export interface FormLayoutProps {
+  children: React.ReactNode;
+  /** horizontal: fields side by side in equal columns from sm up, stacked on phones. */
+  direction?: FormLayoutDirection;
+  'data-testid'?: string;
+}
+export declare const FormLayout: React.FC<FormLayoutProps>;

package/dist/components/layout/FormLayout/FormLayout.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+// src/components/layout/FormLayout/FormLayout.tsx
+const DIRECTION = {
+	vertical: "flex flex-col gap-5",
+	horizontal: "grid gap-5 sm:auto-cols-fr sm:grid-flow-col"
+};
+const FormLayout = (props) => {
+	const { children, direction = "vertical", "data-testid": testId } = props;
+	return /* @__PURE__ */ jsx("div", {
+		"data-testid": testId,
+		className: DIRECTION[direction],
+		children
+	});
+};
+export { FormLayout };

package/dist/components/layout/FormLayout/index.d.ts

@@ -0,0 +1,2 @@
+import { FormLayout, FormLayoutDirection, FormLayoutProps } from "./FormLayout.js";
+export { FormLayout, type FormLayoutDirection, type FormLayoutProps };

package/dist/components/molecule/ConfirmDialog/ConfirmDialog.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+export interface ConfirmDialogProps {
+  open: boolean;
+  /** Cancel and Escape. */
+  onClose: () => void;
+  /** Never closes the dialog: the app closes it when its work finishes. */
+  onConfirm: () => void;
+  title: string;
+  description?: string;
+  confirmLabel: string;
+  cancelLabel?: string;
+  destructive?: boolean;
+  /** Confirm shows busy, Cancel is disabled and Escape is ignored. */
+  loading?: boolean;
+  'data-testid'?: string;
+}
+export declare const ConfirmDialog: React.FC<ConfirmDialogProps>;

package/dist/components/molecule/ConfirmDialog/ConfirmDialog.js

@@ -0,0 +1,28 @@
+import { Button } from "../../atomic/Button/Button.js";
+import { AlertDialog, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "../../ui/alert-dialog.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/components/molecule/ConfirmDialog/ConfirmDialog.tsx
+const ConfirmDialog = (props) => {
+	const { open, onClose, onConfirm, title, description, confirmLabel, cancelLabel = "Cancel", destructive = false, loading = false, "data-testid": testId } = props;
+	return /* @__PURE__ */ jsx(AlertDialog, {
+		open,
+		onOpenChange: (next) => {
+			if (!next && !loading) onClose();
+		},
+		children: /* @__PURE__ */ jsxs(AlertDialogContent, {
+			"data-testid": testId,
+			children: [/* @__PURE__ */ jsxs(AlertDialogHeader, { children: [/* @__PURE__ */ jsx(AlertDialogTitle, { children: title }), description && /* @__PURE__ */ jsx(AlertDialogDescription, { children: description })] }), /* @__PURE__ */ jsxs(AlertDialogFooter, { children: [/* @__PURE__ */ jsx(Button, {
+				variant: "outline",
+				disabled: loading,
+				onClick: onClose,
+				children: cancelLabel
+			}), /* @__PURE__ */ jsx(Button, {
+				variant: destructive ? "destructive" : "primary",
+				loading,
+				onClick: onConfirm,
+				children: confirmLabel
+			})] })]
+		})
+	});
+};
+export { ConfirmDialog };

package/dist/components/molecule/ConfirmDialog/index.d.ts

@@ -0,0 +1,2 @@
+import { ConfirmDialog, ConfirmDialogProps } from "./ConfirmDialog.js";
+export { ConfirmDialog, type ConfirmDialogProps };

package/dist/components/molecule/DropdownMenu/DropdownMenu.d.ts

@@ -0,0 +1,28 @@
+import "../../atomic/Button/index.js";
+import { ButtonVariant } from "../../atomic/Button/buttonVariant.js";
+import { IconComponent, OverlayAlign, Size } from "../../../lib/types.js";
+import React from "react";
+export interface MenuItem {
+  label: string;
+  onSelect: () => void;
+  icon?: IconComponent;
+  /** Second line under the label. */
+  description?: string;
+  disabled?: boolean;
+  destructive?: boolean;
+}
+export interface DropdownMenuProps {
+  /** Trigger text (the trigger's aria-label when iconOnly). */
+  label: string;
+  items: MenuItem[];
+  icon?: IconComponent;
+  iconOnly?: boolean;
+  /** Trigger look. */
+  variant?: ButtonVariant;
+  size?: Size;
+  align?: OverlayAlign;
+  disabled?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  'data-testid'?: string;
+}
+export declare const DropdownMenu: React.FC<DropdownMenuProps>;

package/dist/components/molecule/DropdownMenu/DropdownMenu.js

@@ -0,0 +1,53 @@
+import { buttonLook } from "../../atomic/Button/buttonLook.js";
+import { Button } from "../../ui/button.js";
+import { DropdownMenu as DropdownMenu$1, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../../ui/dropdown-menu.js";
+import { cn } from "../../../lib/utils.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronDownIcon } from "lucide-react";
+// src/components/molecule/DropdownMenu/DropdownMenu.tsx
+const DropdownMenu = (props) => {
+	const { label, items, icon: Icon, iconOnly = false, variant = "outline", size = "md", align = "end", disabled = false, onOpenChange, "data-testid": testId } = props;
+	const look = buttonLook(variant, size, iconOnly);
+	return /* @__PURE__ */ jsxs(DropdownMenu$1, {
+		onOpenChange: (open) => onOpenChange?.(open),
+		children: [/* @__PURE__ */ jsxs(DropdownMenuTrigger, {
+			disabled,
+			"aria-label": iconOnly ? label : void 0,
+			"data-testid": testId,
+			render: /* @__PURE__ */ jsx(Button, {
+				variant: look.variant,
+				size: look.size
+			}),
+			children: [
+				Icon && /* @__PURE__ */ jsx(Icon, {
+					"data-icon": iconOnly ? void 0 : "inline-start",
+					"aria-hidden": true
+				}),
+				!iconOnly && label,
+				!iconOnly && /* @__PURE__ */ jsx(ChevronDownIcon, {
+					"data-icon": "inline-end",
+					"aria-hidden": true
+				})
+			]
+		}), /* @__PURE__ */ jsx(DropdownMenuContent, {
+			align,
+			className: "w-auto max-w-80 min-w-48",
+			children: items.map((item) => {
+				const ItemIcon = item.icon;
+				return /* @__PURE__ */ jsxs(DropdownMenuItem, {
+					onClick: item.onSelect,
+					disabled: item.disabled,
+					variant: item.destructive ? "destructive" : "default",
+					children: [ItemIcon && /* @__PURE__ */ jsx(ItemIcon, { "aria-hidden": true }), /* @__PURE__ */ jsxs("span", {
+						className: "flex flex-col",
+						children: [/* @__PURE__ */ jsx("span", { children: item.label }), item.description && /* @__PURE__ */ jsx("span", {
+							className: cn("text-xs", !item.destructive && "text-muted-foreground"),
+							children: item.description
+						})]
+					})]
+				}, item.label);
+			})
+		})]
+	});
+};
+export { DropdownMenu };

package/dist/components/molecule/DropdownMenu/index.d.ts

@@ -0,0 +1,2 @@
+import { DropdownMenu, DropdownMenuProps, MenuItem } from "./DropdownMenu.js";
+export { DropdownMenu, type DropdownMenuProps, type MenuItem };

package/dist/components/molecule/FormField/FormField.d.ts

@@ -0,0 +1,16 @@
+import { FieldBaseProps } from "../../../lib/types.js";
+import React from "react";
+/** Wiring FormField hands to its control; pass each prop by name. */
+export interface FormFieldControlProps {
+  id: string;
+  'aria-describedby'?: string;
+  'aria-invalid'?: true;
+  'aria-required'?: true;
+  disabled?: boolean;
+}
+export interface FormFieldProps extends FieldBaseProps {
+  children: (control: FormFieldControlProps) => React.ReactNode;
+  /** horizontal puts the label beside the control (checkbox, switch). */
+  orientation?: 'vertical' | 'horizontal';
+}
+export declare const FormField: React.FC<FormFieldProps>;