@journ/nude 0.1.0

package/dist/combobox-parts.js

@@ -0,0 +1,61 @@
+"use client";
+import { part } from "./lib/part.js";
+import { createPicker } from "./lib/picker.js";
+import { jsx } from "react/jsx-runtime";
+import { createRequiredContext } from "@journ/lift";
+import { Command } from "cmdk";
+//#region src/combobox-parts.tsx
+const { ContextProvider, Provider, Trigger, Value, usePicker: useCombobox, usePickerState } = createPicker("Combobox", "combobox");
+const [ItemContext, useComboboxItem] = createRequiredContext("Combobox.Item");
+const normalize = (text) => text.normalize("NFD").replace(/\p{Diacritic}/gu, "").toLowerCase();
+const matchKeywords = (value, search, keywords) => normalize(keywords?.length ? keywords.join(" ") : value).includes(normalize(search)) ? 1 : 0;
+const Root = ({ value, defaultValue = null, onValueChange, children }) => {
+	const { state, actions } = usePickerState(value, defaultValue, onValueChange);
+	return /* @__PURE__ */ jsx(Provider, {
+		state,
+		actions,
+		children
+	});
+};
+/** Matches without accents or case, against the item's keywords when it has any. */
+const Frame = part(Command, "combobox", {
+	loop: true,
+	filter: matchKeywords
+});
+const Input = part(Command.Input, "combobox-input");
+const List = part(Command.List, "combobox-list");
+const Empty = part(Command.Empty, "combobox-empty");
+const Group = part(Command.Group, "combobox-group");
+/** An option that knows nothing about the picker around it. Combobox, MultipleSelector and others build their items from it. */
+const Option = ({ value, checked, onPick, onSelect, ...props }) => /* @__PURE__ */ jsx(ItemContext, {
+	value: { checked },
+	children: /* @__PURE__ */ jsx(Command.Item, {
+		"data-slot": "combobox-item",
+		"data-checked": checked,
+		value,
+		...props,
+		onSelect: (search) => {
+			onSelect?.(search);
+			onPick(value);
+		}
+	})
+});
+const Item = (props) => {
+	const { state, actions } = useCombobox();
+	return /* @__PURE__ */ jsx(Option, {
+		...props,
+		checked: state.value === props.value,
+		onPick: actions.select
+	});
+};
+/** Rendered only inside the checked item. */
+const ItemIndicator = (props) => {
+	if (!useComboboxItem().checked) return null;
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": "combobox-item-indicator",
+		"aria-hidden": true,
+		...props
+	});
+};
+//#endregion
+export { ContextProvider, Empty, Frame, Group, Input, Item, ItemIndicator, List, Option, Provider, Root, Trigger, Value, useCombobox };

package/dist/combobox.d.ts

@@ -0,0 +1,84 @@
+import { ModalContentProps } from "./lib/modal-content.js";
+import { PickerProviderProps } from "./lib/picker.js";
+import { ComboboxActions, ComboboxContextValue, ComboboxState, Item, ItemIndicator, Root, RootProps, useCombobox } from "./combobox-parts.js";
+//#region src/combobox.d.ts
+declare const Combobox: {
+  Provider: ({ children, ...props }: PickerProviderProps<string, object>) => import("react").JSX.Element;
+  Root: typeof Root;
+  Trigger: (props: import("react").ComponentPropsWithRef<'button'>) => import("react").JSX.Element;
+  Value: ({ placeholder, children, ...props }: import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
+    placeholder?: string;
+  }) => import("react").JSX.Element;
+  Content: ({ classNames, overlayRef, ...props }: ModalContentProps<{
+    Root: typeof import("vaul").Root;
+    NestedRoot: typeof import("vaul").NestedRoot;
+    Content: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Overlay: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Trigger: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+    Portal: typeof import("vaul").Portal;
+    Handle: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+      preventCycle?: boolean | undefined;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Close: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+    Title: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+    Description: React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+  }>) => import("react").JSX.Element;
+  Title: (props: import("@radix-ui/react-dialog").DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>) => import("react").ReactNode;
+  Description: (props: import("@radix-ui/react-dialog").DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>) => import("react").ReactNode;
+  Frame: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    label?: string;
+    shouldFilter?: boolean;
+    filter?: (value: string, search: string, keywords?: string[]) => number;
+    defaultValue?: string;
+    value?: string;
+    onValueChange?: (value: string) => void;
+    loop?: boolean;
+    disablePointerSelection?: boolean;
+    vimBindings?: boolean;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Input: (props: Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>> & {
+    ref?: React.Ref<HTMLInputElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+    value?: string;
+    onValueChange?: (search: string) => void;
+  } & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactNode;
+  List: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    label?: string;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Empty: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Group: (props: {
+    children?: React.ReactNode;
+  } & Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "heading" | "value"> & {
+    heading?: React.ReactNode;
+    value?: string;
+    forceMount?: boolean;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Item: typeof Item;
+  ItemIndicator: typeof ItemIndicator;
+};
+//#endregion
+export { Combobox, type ComboboxActions, type ComboboxContextValue, type RootProps as ComboboxProps, type ComboboxState, useCombobox };

package/dist/combobox.js

@@ -0,0 +1,21 @@
+import { Content, Description, Title } from "./drawer-parts.js";
+import { Empty, Frame, Group, Input, Item, ItemIndicator, List, Provider, Root, Trigger, Value, useCombobox } from "./combobox-parts.js";
+//#region src/combobox.tsx
+const Combobox = {
+	Provider,
+	Root,
+	Trigger,
+	Value,
+	Content,
+	Title,
+	Description,
+	Frame,
+	Input,
+	List,
+	Empty,
+	Group,
+	Item,
+	ItemIndicator
+};
+//#endregion
+export { Combobox, useCombobox };

package/dist/command-palette-parts.d.ts

@@ -0,0 +1,22 @@
+import { Content as Content$1, Trigger } from "./dialog-parts.js";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/command-palette-parts.d.ts
+type RootProps = {
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  /** Runs when an item is chosen, with the item's `value`. The palette closes after. */
+  onSelect?: (value: string) => void;
+  /** Letter pressed with Cmd or Ctrl to toggle the palette. Pass an empty string to disable. */
+  shortcut?: string;
+  children?: ReactNode;
+};
+/** A dialog that hosts the combobox list parts, opened globally with a keyboard shortcut. */
+declare const Root: ({ open, defaultOpen, onOpenChange, onSelect, shortcut, children }: RootProps) => import("react").JSX.Element;
+type ContentProps = ComponentPropsWithRef<typeof Content$1> & {
+  /** Read by screen readers only. */
+  title?: string;
+};
+declare const Content: ({ title, children, ...props }: ContentProps) => import("react").JSX.Element;
+//#endregion
+export { Content, type ContentProps, Root, type RootProps, Trigger };

package/dist/command-palette-parts.js

@@ -0,0 +1,56 @@
+"use client";
+import { ContextProvider } from "./combobox-parts.js";
+import { Content as Content$1, Root as Root$1, Title, Trigger } from "./dialog-parts.js";
+import { visuallyHidden } from "./lib/visually-hidden.js";
+import { useEffect } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useControllableState } from "@journ/lift";
+//#region src/command-palette-parts.tsx
+/** A dialog that hosts the combobox list parts, opened globally with a keyboard shortcut. */
+const Root = ({ open, defaultOpen = false, onOpenChange, onSelect, shortcut = "k", children }) => {
+	const [current, setOpen] = useControllableState(open, defaultOpen, onOpenChange);
+	const isOpen = current ?? false;
+	useEffect(() => {
+		if (!shortcut) return;
+		const onKeyDown = (event) => {
+			if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === shortcut.toLowerCase()) {
+				event.preventDefault();
+				setOpen(!isOpen);
+			}
+		};
+		document.addEventListener("keydown", onKeyDown);
+		return () => document.removeEventListener("keydown", onKeyDown);
+	}, [
+		shortcut,
+		isOpen,
+		setOpen
+	]);
+	return /* @__PURE__ */ jsx(ContextProvider, {
+		state: {
+			value: null,
+			open: isOpen
+		},
+		actions: {
+			setOpen,
+			select: (value) => {
+				onSelect?.(value);
+				setOpen(false);
+			}
+		},
+		children: /* @__PURE__ */ jsx(Root$1, {
+			open: isOpen,
+			onOpenChange: setOpen,
+			children
+		})
+	});
+};
+const Content = ({ title = "Command palette", children, ...props }) => /* @__PURE__ */ jsxs(Content$1, {
+	"aria-describedby": void 0,
+	...props,
+	children: [/* @__PURE__ */ jsx(Title, {
+		style: visuallyHidden,
+		children: title
+	}), children]
+});
+//#endregion
+export { Content, Root, Trigger };

package/dist/command-palette.d.ts

@@ -0,0 +1,64 @@
+import { Item, ItemIndicator } from "./combobox-parts.js";
+import { Content, Root, RootProps } from "./command-palette-parts.js";
+//#region src/command-palette.d.ts
+declare const CommandPalette: {
+  Root: typeof Root;
+  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Content: typeof Content;
+  Frame: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    label?: string;
+    shouldFilter?: boolean;
+    filter?: (value: string, search: string, keywords?: string[]) => number;
+    defaultValue?: string;
+    value?: string;
+    onValueChange?: (value: string) => void;
+    loop?: boolean;
+    disablePointerSelection?: boolean;
+    vimBindings?: boolean;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Input: (props: Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>> & {
+    ref?: React.Ref<HTMLInputElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").InputHTMLAttributes<HTMLInputElement>>, "onChange" | "type" | "value"> & {
+    value?: string;
+    onValueChange?: (search: string) => void;
+  } & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactNode;
+  List: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    label?: string;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Empty: (props: {
+    children?: React.ReactNode;
+  } & Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Group: (props: {
+    children?: React.ReactNode;
+  } & Omit<Pick<Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import("react").HTMLAttributes<HTMLDivElement>> & {
+    ref?: React.Ref<HTMLDivElement>;
+  } & {
+    asChild?: boolean;
+  }, "asChild" | "key" | keyof import("react").HTMLAttributes<HTMLDivElement>>, "heading" | "value"> & {
+    heading?: React.ReactNode;
+    value?: string;
+    forceMount?: boolean;
+  } & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Item: typeof Item;
+  ItemIndicator: typeof ItemIndicator;
+};
+//#endregion
+export { CommandPalette, type RootProps as CommandPaletteProps };

package/dist/command-palette.js

@@ -0,0 +1,18 @@
+import { Empty, Frame, Group, Input, Item, ItemIndicator, List } from "./combobox-parts.js";
+import { Trigger } from "./dialog-parts.js";
+import { Content, Root } from "./command-palette-parts.js";
+//#region src/command-palette.tsx
+const CommandPalette = {
+	Root,
+	Trigger,
+	Content,
+	Frame,
+	Input,
+	List,
+	Empty,
+	Group,
+	Item,
+	ItemIndicator
+};
+//#endregion
+export { CommandPalette };

package/dist/composer.d.ts

@@ -0,0 +1,7 @@
+//#region src/composer.d.ts
+declare const Composer: {
+  Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Input: (props: import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>) => import("react").ReactNode;
+};
+//#endregion
+export { Composer };

package/dist/composer.js

@@ -0,0 +1,8 @@
+import { part } from "./lib/part.js";
+//#region src/composer.tsx
+const Composer = {
+	Root: part("div", "composer"),
+	Input: part("input", "composer-input")
+};
+//#endregion
+export { Composer };

package/dist/context-menu-parts.d.ts

@@ -0,0 +1,8 @@
+import * as RadixMenu from "@radix-ui/react-context-menu";
+//#region src/context-menu-parts.d.ts
+declare const Root: import("react").FC<RadixMenu.ContextMenuProps>;
+declare const Trigger: import("react").ForwardRefExoticComponent<RadixMenu.ContextMenuTriggerProps & import("react").RefAttributes<HTMLSpanElement>>;
+declare const Group: import("react").ForwardRefExoticComponent<RadixMenu.ContextMenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const Content: (props: RadixMenu.ContextMenuContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element, Item: (props: RadixMenu.ContextMenuItemProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode, Label: (props: RadixMenu.ContextMenuLabelProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode, Separator: (props: RadixMenu.ContextMenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+//#endregion
+export { Content, Group, Item, Label, Root, Separator, Trigger };

package/dist/context-menu-parts.js

@@ -0,0 +1,10 @@
+"use client";
+import { createMenuParts } from "./lib/menu-parts.js";
+import * as RadixMenu from "@radix-ui/react-context-menu";
+//#region src/context-menu-parts.tsx
+const Root = RadixMenu.Root;
+const Trigger = RadixMenu.Trigger;
+const Group = RadixMenu.Group;
+const { Content, Item, Label, Separator } = createMenuParts(RadixMenu, "context-menu");
+//#endregion
+export { Content, Group, Item, Label, Root, Separator, Trigger };

package/dist/context-menu.d.ts

@@ -0,0 +1,12 @@
+//#region src/context-menu.d.ts
+declare const ContextMenu: {
+  Root: import("react").FC<import("@radix-ui/react-context-menu").ContextMenuProps>;
+  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-context-menu").ContextMenuTriggerProps & import("react").RefAttributes<HTMLSpanElement>>;
+  Content: (props: import("@radix-ui/react-context-menu").ContextMenuContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element;
+  Group: import("react").ForwardRefExoticComponent<import("@radix-ui/react-context-menu").ContextMenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
+  Label: (props: import("@radix-ui/react-context-menu").ContextMenuLabelProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Item: (props: import("@radix-ui/react-context-menu").ContextMenuItemProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Separator: (props: import("@radix-ui/react-context-menu").ContextMenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+};
+//#endregion
+export { ContextMenu };

package/dist/context-menu.js

@@ -0,0 +1,13 @@
+import { Content, Group, Item, Label, Root, Separator, Trigger } from "./context-menu-parts.js";
+//#region src/context-menu.tsx
+const ContextMenu = {
+	Root,
+	Trigger,
+	Content,
+	Group,
+	Label,
+	Item,
+	Separator
+};
+//#endregion
+export { ContextMenu };

package/dist/currency-input-parts.d.ts

@@ -0,0 +1,22 @@
+import { Input } from "./input.js";
+import { ComponentPropsWithRef, ReactNode } from "react";
+//#region src/currency-input-parts.d.ts
+type RootProps = {
+  /** The amount, or null while empty. */
+  value?: number | null;
+  defaultValue?: number | null;
+  onValueChange?: (value: number | null) => void;
+  currency?: string;
+  locale?: string;
+  min?: number;
+  max?: number;
+  children?: ReactNode;
+};
+/**
+ * An amount shown formatted ($1,234.50) and edited as plain digits. Typing is
+ * free until blur or Enter, then it is read in the locale and snapped to the bounds.
+ */
+declare const Root: ({ value, defaultValue, onValueChange, currency, locale, min, max, children }: RootProps) => import("react").JSX.Element;
+declare const Field: ({ onBlur, onKeyDown, onFocus, ...props }: ComponentPropsWithRef<typeof Input>) => import("react").JSX.Element;
+//#endregion
+export { Field, Root, type RootProps };

package/dist/currency-input-parts.js

@@ -0,0 +1,57 @@
+"use client";
+import { Input } from "./input.js";
+import { commitOn } from "./lib/commit-on.js";
+import { jsx } from "react/jsx-runtime";
+import { createRequiredContext, useControllableState, useDraft } from "@journ/lift";
+import { clamp, formatPlain, parseLocalizedNumber } from "@journ/fitter-happier";
+//#region src/currency-input-parts.tsx
+const [CurrencyContext, useCurrency] = createRequiredContext("CurrencyInput.Root");
+/**
+* An amount shown formatted ($1,234.50) and edited as plain digits. Typing is
+* free until blur or Enter, then it is read in the locale and snapped to the bounds.
+*/
+const Root = ({ value, defaultValue = null, onValueChange, currency = "USD", locale = "en", min, max, children }) => {
+	const [stored, setStored] = useControllableState(value, defaultValue, onValueChange);
+	const amount = stored ?? null;
+	const money = new Intl.NumberFormat(locale, {
+		style: "currency",
+		currency
+	});
+	const { text, edit, commit } = useDraft({
+		value: amount,
+		format: (current) => current === null ? "" : money.format(current),
+		parse: (typed) => typed.trim() === "" ? null : parseLocalizedNumber(typed, locale) ?? void 0,
+		onCommit: (typed) => setStored(typed === null ? null : clamp(typed, min, max))
+	});
+	return /* @__PURE__ */ jsx(CurrencyContext, {
+		value: {
+			text,
+			edit,
+			commit,
+			locale,
+			focus: () => edit(amount === null ? "" : formatPlain(amount, locale))
+		},
+		children
+	});
+};
+const Field = ({ onBlur, onKeyDown, onFocus, ...props }) => {
+	const { text, edit, commit, focus } = useCurrency();
+	return /* @__PURE__ */ jsx(Input, {
+		"data-slot": "currency-input",
+		inputMode: "decimal",
+		autoComplete: "off",
+		...props,
+		value: text,
+		onChange: (event) => edit(event.target.value),
+		onFocus: (event) => {
+			onFocus?.(event);
+			focus();
+		},
+		...commitOn(commit, {
+			onBlur,
+			onKeyDown
+		})
+	});
+};
+//#endregion
+export { Field, Root };

package/dist/currency-input.d.ts

@@ -0,0 +1,8 @@
+import { Field, Root, RootProps } from "./currency-input-parts.js";
+//#region src/currency-input.d.ts
+declare const CurrencyInput: {
+  Root: typeof Root;
+  Field: typeof Field;
+};
+//#endregion
+export { CurrencyInput, type RootProps as CurrencyInputProps };

package/dist/currency-input.js

@@ -0,0 +1,8 @@
+import { Field, Root } from "./currency-input-parts.js";
+//#region src/currency-input.tsx
+const CurrencyInput = {
+	Root,
+	Field
+};
+//#endregion
+export { CurrencyInput };

package/dist/data-table-parts.d.ts

@@ -0,0 +1,101 @@
+import { Table } from "./table.js";
+import { ComponentPropsWithRef, ElementType, ReactNode } from "react";
+import { ColumnDef, ReactTable, RowData, RowData as RowData$1, SortingState } from "@tanstack/react-table";
+//#region src/data-table-parts.d.ts
+/** The table features journ turns on. Declared once so every part sees the same types. */
+declare const features: {
+  rowSortingFeature: import("@tanstack/react-table").TableFeature;
+  sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+  rowSelectionFeature: import("@tanstack/react-table").TableFeature;
+  columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
+  rowPaginationFeature: import("@tanstack/react-table").TableFeature;
+  paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+};
+type Features = typeof features;
+type DataTableColumn<TData extends RowData$1> = ColumnDef<Features, TData>;
+/** Typed helper for building columns: `const column = dataTableColumns<Row>()`. */
+declare const dataTableColumns: <TData extends RowData$1>() => import("@tanstack/react-table").ColumnHelper<{
+  rowSortingFeature: import("@tanstack/react-table").TableFeature;
+  sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+  rowSelectionFeature: import("@tanstack/react-table").TableFeature;
+  columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
+  rowPaginationFeature: import("@tanstack/react-table").TableFeature;
+  paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+}, TData>;
+/** The components the parts render. A style layer swaps in its own; each receives the same props as the default. */
+type DataTableComponents = {
+  Table: Record<keyof typeof Table, ElementType>;
+  Checkbox: {
+    Root: ElementType;
+    Indicator: ElementType;
+  };
+  Popover: {
+    Root: ElementType;
+    Trigger: ElementType;
+    Content: ElementType;
+  };
+  Pagination: {
+    Root: ElementType;
+  };
+  BulkBar: {
+    Root: ElementType;
+    Count: ElementType;
+    Actions: ElementType;
+  };
+  /** Opens the column picker. */
+  TriggerButton: ElementType;
+  /** Previous, next and clear selection. */
+  ActionButton: ElementType;
+};
+type DataTableClassNames = {
+  sortButton?: string;
+  row?: string;
+  emptyCell?: string;
+  columnPickerContent?: string;
+  columnOption?: string;
+  pagerStatus?: string;
+};
+type DataTableIcons = {
+  sortAscending?: ReactNode;
+  sortDescending?: ReactNode;
+  unsorted?: ReactNode;
+  columns?: ReactNode;
+  previous?: ReactNode;
+  next?: ReactNode;
+};
+/** The TanStack table instance, for custom parts such as a search box or a footer. */
+declare const useDataTable: <TData extends RowData$1>() => ReactTable<Features, TData>;
+type RootProps<TData extends RowData$1> = {
+  data: TData[];
+  columns: ColumnDef<Features, TData, any>[];
+  pageSize?: number;
+  getRowId?: (row: TData, index: number) => string;
+  initialSorting?: SortingState;
+  /** Fires with the selected rows whenever the selection changes. */
+  onSelectionChange?: (rows: TData[]) => void;
+  components?: Partial<DataTableComponents>;
+  classNames?: DataTableClassNames;
+  icons?: DataTableIcons;
+  children?: ReactNode;
+};
+/** Owns sorting, selection, column visibility and paging, and shares the table with its parts. */
+declare const Root: <TData extends RowData$1>({ data, columns, pageSize, getRowId, initialSorting, onSelectionChange, components, classNames, icons, children }: RootProps<TData>) => import("react").JSX.Element;
+declare const Toolbar: (props: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
+type TableViewProps = ComponentPropsWithRef<'table'> & {
+  /** Shown in place of the rows when there are none. */
+  empty?: ReactNode;
+};
+/** Renders the header, rows and cells from the table state with the Table parts. */
+declare const View: ({ empty, ...props }: TableViewProps) => import("react").JSX.Element;
+/** A checkbox column with select all for the current page. Put it first in `columns`. */
+declare const selectColumn: <TData extends RowData$1>() => DataTableColumn<TData>;
+/** A popover with one checkbox per hideable column. Children replace the default trigger label. */
+declare const ColumnPicker: ({ children }: {
+  children?: ReactNode;
+}) => import("react").JSX.Element;
+/** Previous and next with the current page. Uses buttons, since paging stays on the page. */
+declare const Pager: (props: ComponentPropsWithRef<'nav'>) => import("react").JSX.Element;
+/** Appears while rows are selected. Children are the bulk actions. */
+declare const SelectionBar: ({ children, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element | null;
+//#endregion
+export { ColumnPicker, type DataTableClassNames, type DataTableColumn, type DataTableComponents, type DataTableIcons, Pager, Root, type RootProps, type RowData, SelectionBar, type TableViewProps, Toolbar, View, dataTableColumns, selectColumn, useDataTable };