@journ/nude 0.1.1 → 0.1.3

package/dist/combobox-parts.d.ts

@@ -1,74 +1,30 @@
-import { PickerActions, PickerContextValue, PickerProviderProps, PickerState } from "./lib/picker.js";
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { Styled } from "./styled.js";
+import { Picker, PickerActions, PickerContextValue, PickerState } from "./lib/picker.js";
+import { ComponentPropsWithRef, JSX, ReactNode } from "react";
 import { Command } from "cmdk";
 //#region src/combobox-parts.d.ts
 type ComboboxState = PickerState<string>;
 type ComboboxActions = PickerActions<string>;
-type ComboboxContextValue = Omit<PickerContextValue<string, object>, 'meta'>;
-declare const ContextProvider: ({ state, actions, meta, children }: PickerProviderProps<string, object>) => import("react").JSX.Element, Provider: ({ children, ...props }: PickerProviderProps<string, object>) => import("react").JSX.Element, Trigger: (props: ComponentPropsWithRef<'button'>) => import("react").JSX.Element, Value: ({ placeholder, children, ...props }: import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
-  placeholder?: string;
-}) => import("react").JSX.Element, useCombobox: any;
+type ComboboxContextValue = Omit<PickerContextValue<string, object>, "meta">;
+declare const ContextProvider: Picker<string>["ContextProvider"];
+declare const Provider: Picker<string>["Provider"];
+declare const Trigger: Picker<string>["Trigger"];
+declare const Value: Picker<string>["Value"];
+declare const useCombobox: Picker<string>["usePicker"];
 type RootProps = {
   value?: string | null;
   defaultValue?: string | null;
   onValueChange?: (value: string) => void;
   children?: ReactNode;
 };
-declare const Root: ({ value, defaultValue, onValueChange, children }: RootProps) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, children }: RootProps) => JSX.Element;
 /** Matches without accents or case, against the item's keywords when it has any. */
-declare const 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>) => ReactNode;
-declare const 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>) => ReactNode;
-declare const 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>) => ReactNode;
-declare const 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>) => ReactNode;
-declare const 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>) => ReactNode;
-type ItemProps = Omit<ComponentPropsWithRef<typeof Command.Item>, 'value'> & {
+declare const Frame: Styled<typeof Command>;
+declare const Input: Styled<typeof Command.Input>;
+declare const List: Styled<typeof Command.List>;
+declare const Empty: Styled<typeof Command.Empty>;
+declare const Group: Styled<typeof Command.Group>;
+type ItemProps = Omit<ComponentPropsWithRef<typeof Command.Item>, "value"> & {
   value: string;
 };
 type OptionProps = ItemProps & {
@@ -77,9 +33,9 @@ type OptionProps = ItemProps & {
   onPick: (value: string) => void;
 };
 /** An option that knows nothing about the picker around it. Combobox, MultipleSelector and others build their items from it. */
-declare const Option: ({ value, checked, onPick, onSelect, ...props }: OptionProps) => import("react").JSX.Element;
-declare const Item: (props: ItemProps) => import("react").JSX.Element;
+declare const Option: ({ value, checked, onPick, onSelect, ...props }: OptionProps) => JSX.Element;
+declare const Item: (props: ItemProps) => JSX.Element;
 /** Rendered only inside the checked item. */
-declare const ItemIndicator: (props: ComponentPropsWithRef<'span'>) => import("react").JSX.Element | null;
+declare const ItemIndicator: (props: ComponentPropsWithRef<"span">) => ReactNode;
 //#endregion
 export { type ComboboxActions, type ComboboxContextValue, type ComboboxState, ContextProvider, Empty, Frame, Group, Input, Item, ItemIndicator, type ItemProps, List, Option, type OptionProps, Provider, Root, type RootProps, Trigger, Value, useCombobox };

package/dist/combobox-parts.js

@@ -2,10 +2,16 @@
 import { part } from "./lib/part.js";
 import { createPicker } from "./lib/picker.js";
 import { jsx } from "react/jsx-runtime";
-import { createRequiredContext } from "@journ/lift";
+import { createRequiredContext } from "@journ/lift/required-context";
 import { Command } from "cmdk";
 //#region src/combobox-parts.tsx
-const { ContextProvider, Provider, Trigger, Value, usePicker: useCombobox, usePickerState } = createPicker("Combobox", "combobox");
+const picker = createPicker("Combobox", "combobox");
+const ContextProvider = picker.ContextProvider;
+const Provider = picker.Provider;
+const Trigger = picker.Trigger;
+const Value = picker.Value;
+const useCombobox = picker.usePicker;
+const usePickerState = picker.usePickerState;
 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;

package/dist/combobox.d.ts

@@ -1,82 +1,19 @@
-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";
+import { ComboboxActions, ComboboxContextValue, ComboboxState, Empty, Frame, Group, Input, Item, ItemIndicator, List, Provider, Root, RootProps, Trigger, Value, useCombobox } from "./combobox-parts.js";
+import { Content, Description, Title } from "./drawer-parts.js";
 //#region src/combobox.d.ts
 declare const Combobox: {
-  Provider: ({ children, ...props }: PickerProviderProps<string, object>) => import("react").JSX.Element;
+  Provider: typeof Provider;
   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;
+  Trigger: typeof Trigger;
+  Value: typeof Value;
+  Content: typeof Content;
+  Title: typeof Title;
+  Description: typeof Description;
+  Frame: typeof Frame;
+  Input: typeof Input;
+  List: typeof List;
+  Empty: typeof Empty;
+  Group: typeof Group;
   Item: typeof Item;
   ItemIndicator: typeof ItemIndicator;
 };

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

@@ -1,5 +1,5 @@
 import { Content as Content$1, Trigger } from "./dialog-parts.js";
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { ComponentPropsWithRef, JSX, ReactNode } from "react";
 //#region src/command-palette-parts.d.ts
 type RootProps = {
   open?: boolean;
@@ -12,11 +12,11 @@ type RootProps = {
   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;
+declare const Root: ({ open, defaultOpen, onOpenChange, onSelect, shortcut, children }: RootProps) => 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;
+declare const Content: ({ title, children, ...props }: ContentProps) => JSX.Element;
 //#endregion
 export { Content, type ContentProps, Root, type RootProps, Trigger };

package/dist/command-palette-parts.js

@@ -4,7 +4,7 @@ import { Content as Content$1, Root as Root$1, Title, Trigger } from "./dialog-p
 import { visuallyHidden } from "./lib/visually-hidden.js";
 import { useEffect } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useControllableState } from "@journ/lift";
+import { useControllableState } from "@journ/lift/use-controllable-state";
 //#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 }) => {

package/dist/command-palette.d.ts

@@ -1,62 +1,16 @@
-import { Item, ItemIndicator } from "./combobox-parts.js";
+import { Empty, Frame, Group, Input, Item, ItemIndicator, List } from "./combobox-parts.js";
+import { Trigger } from "./dialog-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>>;
+  Trigger: typeof Trigger;
   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;
+  Frame: typeof Frame;
+  Input: typeof Input;
+  List: typeof List;
+  Empty: typeof Empty;
+  Group: typeof Group;
   Item: typeof Item;
   ItemIndicator: typeof ItemIndicator;
 };

package/dist/composer.d.ts

@@ -1,7 +1,10 @@
+import { Styled } from "./styled.js";
 //#region src/composer.d.ts
+declare const Root: Styled<"div">;
+declare const Input: Styled<"input">;
 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;
+  Root: typeof Root;
+  Input: typeof Input;
 };
 //#endregion
 export { Composer };

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

@@ -1,8 +1,12 @@
+import { Styled } from "./styled.js";
 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;
+declare const Root: typeof RadixMenu.Root;
+declare const Trigger: typeof RadixMenu.Trigger;
+declare const Group: typeof RadixMenu.Group;
+declare const Content: Styled<typeof RadixMenu.Content>;
+declare const Item: Styled<typeof RadixMenu.Item>;
+declare const Label: Styled<typeof RadixMenu.Label>;
+declare const Separator: Styled<typeof RadixMenu.Separator>;
 //#endregion
 export { Content, Group, Item, Label, Root, Separator, Trigger };

package/dist/context-menu-parts.js

@@ -5,6 +5,10 @@ import * as RadixMenu from "@radix-ui/react-context-menu";
 const Root = RadixMenu.Root;
 const Trigger = RadixMenu.Trigger;
 const Group = RadixMenu.Group;
-const { Content, Item, Label, Separator } = createMenuParts(RadixMenu, "context-menu");
+const menu = createMenuParts(RadixMenu, "context-menu");
+const Content = menu.Content;
+const Item = menu.Item;
+const Label = menu.Label;
+const Separator = menu.Separator;
 //#endregion
 export { Content, Group, Item, Label, Root, Separator, Trigger };

package/dist/context-menu.d.ts

@@ -1,12 +1,13 @@
+import { Content, Group, Item, Label, Root, Separator, Trigger } from "./context-menu-parts.js";
 //#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;
+  Root: typeof Root;
+  Trigger: typeof Trigger;
+  Content: typeof Content;
+  Group: typeof Group;
+  Label: typeof Label;
+  Item: typeof Item;
+  Separator: typeof Separator;
 };
 //#endregion
 export { ContextMenu };

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

@@ -1,5 +1,6 @@
+import { Styled } from "./styled.js";
 import { Input } from "./input.js";
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { JSX, ReactNode } from "react";
 //#region src/currency-input-parts.d.ts
 type RootProps = {
   /** The amount, or null while empty. */
@@ -16,7 +17,7 @@ type RootProps = {
  * 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;
+declare const Root: ({ value, defaultValue, onValueChange, currency, locale, min, max, children }: RootProps) => JSX.Element;
+declare const Field: Styled<typeof Input>;
 //#endregion
 export { Field, Root, type RootProps };

package/dist/currency-input-parts.js

@@ -2,8 +2,11 @@
 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";
+import { createRequiredContext } from "@journ/lift/required-context";
+import { useControllableState } from "@journ/lift/use-controllable-state";
+import { clamp } from "@journ/fitter-happier/clamp";
+import { formatPlain, parseLocalizedNumber } from "@journ/fitter-happier/number";
+import { useDraft } from "@journ/lift/use-draft";
 //#region src/currency-input-parts.tsx
 const [CurrencyContext, useCurrency] = createRequiredContext("CurrencyInput.Root");
 /**

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

@@ -1,27 +1,20 @@
+import { Styled } from "./styled.js";
 import { Table } from "./table.js";
-import { ComponentPropsWithRef, ElementType, ReactNode } from "react";
-import { ColumnDef, ReactTable, RowData, RowData as RowData$1, SortingState } from "@tanstack/react-table";
+import { ComponentPropsWithRef, ElementType, JSX, ReactNode } from "react";
+import { ColumnDef, ColumnHelper, ReactTable, RowData, RowData as RowData$1, SortingState, columnVisibilityFeature, createPaginatedRowModel, createSortedRowModel, rowPaginationFeature, rowSelectionFeature, rowSortingFeature } 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 = {
+  rowSortingFeature: typeof rowSortingFeature;
+  sortedRowModel: ReturnType<typeof createSortedRowModel>;
+  rowSelectionFeature: typeof rowSelectionFeature;
+  columnVisibilityFeature: typeof columnVisibilityFeature;
+  rowPaginationFeature: typeof rowPaginationFeature;
+  paginatedRowModel: ReturnType<typeof createPaginatedRowModel>;
 };
-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>;
+declare const dataTableColumns: <TData extends RowData$1>() => ColumnHelper<Features, 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>;
@@ -79,23 +72,23 @@ type RootProps<TData extends RowData$1> = {
   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'> & {
+declare const Root: <TData extends RowData$1>({ data, columns, pageSize, getRowId, initialSorting, onSelectionChange, components, classNames, icons, children }: RootProps<TData>) => JSX.Element;
+declare const Toolbar: Styled<"div">;
+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;
+declare const View: ({ empty, ...props }: TableViewProps) => 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;
+}) => 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;
+declare const Pager: Styled<"nav">;
 /** Appears while rows are selected. Children are the bulk actions. */
-declare const SelectionBar: ({ children, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element | null;
+declare const SelectionBar: ({ children, ...props }: ComponentPropsWithRef<"div">) => ReactNode;
 //#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 };

package/dist/data-table-parts.js

@@ -7,10 +7,9 @@ import { Content, Root as Root$2, Trigger } from "./popover-parts.js";
 import { Table } from "./table.js";
 import { useEffect, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { createRequiredContext } from "@journ/lift";
+import { createRequiredContext } from "@journ/lift/required-context";
 import { columnVisibilityFeature, createColumnHelper, createPaginatedRowModel, createSortedRowModel, rowPaginationFeature, rowSelectionFeature, rowSortingFeature, tableFeatures, useTable } from "@tanstack/react-table";
 //#region src/data-table-parts.tsx
-/** The table features journ turns on. Declared once so every part sees the same types. */
 const features = tableFeatures({
 	rowSortingFeature,
 	sortedRowModel: createSortedRowModel(),

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

@@ -1,5 +1,6 @@
+import { Styled } from "./styled.js";
 import { Input } from "./input.js";
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { JSX, ReactNode } from "react";
 //#region src/date-input-parts.d.ts
 type RootProps = {
   value?: Date | null;
@@ -9,7 +10,7 @@ type RootProps = {
   children?: ReactNode;
 };
 /** Holds the typed text and commits a real date on blur or Enter. */
-declare const Root: ({ value, defaultValue, onValueChange, locale, children }: RootProps) => import("react").JSX.Element;
-declare const Field: ({ onBlur, onKeyDown, ...props }: ComponentPropsWithRef<typeof Input>) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, locale, children }: RootProps) => JSX.Element;
+declare const Field: Styled<typeof Input>;
 //#endregion
 export { Field, Root, type RootProps };

package/dist/date-input-parts.js

@@ -3,8 +3,9 @@ import { Input } from "./input.js";
 import { commitOn } from "./lib/commit-on.js";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
-import { createRequiredContext, useControllableState } from "@journ/lift";
-import { datePlaceholder, formatDate, parseDate } from "@journ/fitter-happier";
+import { createRequiredContext } from "@journ/lift/required-context";
+import { useControllableState } from "@journ/lift/use-controllable-state";
+import { datePlaceholder, formatDate, parseDate } from "@journ/fitter-happier/parse-date";
 //#region src/date-input-parts.tsx
 const [DateInputContext, useDateInput] = createRequiredContext("DateInput.Root");
 /** Holds the typed text and commits a real date on blur or Enter. */

package/dist/date-picker-parts.d.ts

@@ -1,6 +1,6 @@
 import { RootProps as RootProps$1 } from "./calendar-parts.js";
-import { PickerActions, PickerContextValue, PickerProviderProps, PickerState } from "./lib/picker.js";
-import { ReactNode } from "react";
+import { Picker, PickerActions, PickerContextValue, PickerState } from "./lib/picker.js";
+import { JSX, ReactNode } from "react";
 //#region src/date-picker-parts.d.ts
 type DatePickerMeta = {
   locale?: string;
@@ -8,9 +8,10 @@ type DatePickerMeta = {
 type DatePickerState = PickerState<Date>;
 type DatePickerActions = PickerActions<Date>;
 type DatePickerContextValue = PickerContextValue<Date, DatePickerMeta>;
-declare const Provider: ({ children, ...props }: PickerProviderProps<Date, DatePickerMeta>) => import("react").JSX.Element, Trigger: (props: import("react").ComponentPropsWithRef<'button'>) => import("react").JSX.Element, PickerValue: ({ placeholder, children, ...props }: import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
-  placeholder?: string;
-}) => import("react").JSX.Element, useDatePicker: any;
+declare const Provider: Picker<Date, DatePickerMeta>["Provider"];
+declare const Trigger: Picker<Date, DatePickerMeta>["Trigger"];
+declare const PickerValue: Picker<Date, DatePickerMeta>["Value"];
+declare const useDatePicker: Picker<Date, DatePickerMeta>["usePicker"];
 type RootProps = {
   value?: Date | null;
   defaultValue?: Date | null;
@@ -18,12 +19,12 @@ type RootProps = {
   locale?: string;
   children?: ReactNode;
 };
-declare const Root: ({ value, defaultValue, onValueChange, locale, children }: RootProps) => import("react").JSX.Element;
-type ValueProps = Omit<React.ComponentProps<typeof PickerValue>, 'children'> & {
+declare const Root: ({ value, defaultValue, onValueChange, locale, children }: RootProps) => JSX.Element;
+type ValueProps = Omit<React.ComponentProps<typeof PickerValue>, "children"> & {
   format?: Intl.DateTimeFormatOptions;
 };
-declare const Value: ({ format, ...props }: ValueProps) => import("react").JSX.Element;
-type CalendarProps = Omit<RootProps$1, 'value' | 'defaultValue' | 'onValueChange' | 'locale'>;
-declare const Calendar: (props: CalendarProps) => import("react").JSX.Element;
+declare const Value: ({ format, ...props }: ValueProps) => JSX.Element;
+type CalendarProps = Omit<RootProps$1, "value" | "defaultValue" | "onValueChange" | "locale">;
+declare const Calendar: (props: CalendarProps) => JSX.Element;
 //#endregion
 export { Calendar, type DatePickerActions, type DatePickerContextValue, type DatePickerMeta, type DatePickerState, Provider, Root, type RootProps, Trigger, Value, useDatePicker };

package/dist/date-picker-parts.js

@@ -3,7 +3,12 @@ import { Root as Root$1 } from "./calendar-parts.js";
 import { createPicker } from "./lib/picker.js";
 import { jsx } from "react/jsx-runtime";
 //#region src/date-picker-parts.tsx
-const { Provider, Trigger, Value: PickerValue, usePicker: useDatePicker, usePickerState } = createPicker("DatePicker", "date-picker");
+const picker = createPicker("DatePicker", "date-picker");
+const Provider = picker.Provider;
+const Trigger = picker.Trigger;
+const PickerValue = picker.Value;
+const useDatePicker = picker.usePicker;
+const usePickerState = picker.usePickerState;
 const Root = ({ value, defaultValue = null, onValueChange, locale = "en", children }) => {
 	const { state, actions } = usePickerState(value, defaultValue, onValueChange);
 	return /* @__PURE__ */ jsx(Provider, {