@journ/nude 0.1.0 → 0.1.2

package/dist/dialog-parts.d.ts

@@ -1,12 +1,13 @@
-import { ModalContentProps } from "./lib/modal-content.js";
+import { Styled } from "./styled.js";
+import { ModalContentPart } from "./lib/modal-content.js";
 import { Actions, Body } from "./lib/modal-parts.js";
 import * as RadixDialog from "@radix-ui/react-dialog";
 //#region src/dialog-parts.d.ts
-declare const Root: import("react").FC<RadixDialog.DialogProps>;
-declare const Trigger: import("react").ForwardRefExoticComponent<RadixDialog.DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const Close: import("react").ForwardRefExoticComponent<RadixDialog.DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const Content: ({ classNames, overlayRef, ...props }: ModalContentProps<typeof RadixDialog>) => import("react").JSX.Element;
-declare const Title: (props: RadixDialog.DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>) => import("react").ReactNode;
-declare const Description: (props: RadixDialog.DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>) => import("react").ReactNode;
+declare const Root: typeof RadixDialog.Root;
+declare const Trigger: typeof RadixDialog.Trigger;
+declare const Close: typeof RadixDialog.Close;
+declare const Content: ModalContentPart<typeof RadixDialog>;
+declare const Title: Styled<typeof RadixDialog.Title>;
+declare const Description: Styled<typeof RadixDialog.Description>;
 //#endregion
 export { Actions, Body, Close, Content, Description, Root, Title, Trigger };

package/dist/dialog.d.ts

@@ -1,14 +1,15 @@
-import { ModalContentProps } from "./lib/modal-content.js";
+import { Actions, Body } from "./lib/modal-parts.js";
+import { Close, Content, Description, Root, Title, Trigger } from "./dialog-parts.js";
 //#region src/dialog.d.ts
 declare const Dialog: {
-  Root: import("react").FC<import("@radix-ui/react-dialog").DialogProps>;
-  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-  Close: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-  Content: ({ classNames, overlayRef, ...props }: ModalContentProps<typeof import("@radix-ui/react-dialog")>) => 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;
-  Body: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
-  Actions: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Root: typeof Root;
+  Trigger: typeof Trigger;
+  Close: typeof Close;
+  Content: typeof Content;
+  Title: typeof Title;
+  Description: typeof Description;
+  Body: typeof Body;
+  Actions: typeof Actions;
 };
 //#endregion
 export { Dialog };

package/dist/divider.d.ts

@@ -1,5 +1,6 @@
+import { Styled } from "./styled.js";
 import * as Separator from "@radix-ui/react-separator";
 //#region src/divider.d.ts
-declare const Divider: (props: Separator.SeparatorProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+declare const Divider: Styled<typeof Separator.Root>;
 //#endregion
 export { Divider };

package/dist/drawer-parts.d.ts

@@ -1,24 +1,13 @@
-import { ModalContentProps } from "./lib/modal-content.js";
+import { Styled } from "./styled.js";
+import { ModalContentPart } from "./lib/modal-content.js";
 import { Actions, Body } from "./lib/modal-parts.js";
+import { Drawer } from "vaul";
 //#region src/drawer-parts.d.ts
-declare const Root: typeof import("vaul").Root;
-declare const Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const Close: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const 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;
-declare const Title: (props: import("@radix-ui/react-dialog").DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>) => import("react").ReactNode;
-declare const Description: (props: import("@radix-ui/react-dialog").DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>) => import("react").ReactNode;
+declare const Root: typeof Drawer.Root;
+declare const Trigger: typeof Drawer.Trigger;
+declare const Close: typeof Drawer.Close;
+declare const Content: ModalContentPart<typeof Drawer>;
+declare const Title: Styled<typeof Drawer.Title>;
+declare const Description: Styled<typeof Drawer.Description>;
 //#endregion
 export { Actions, Body, Close, Content, Description, Root, Title, Trigger };

package/dist/drawer.d.ts

@@ -1,27 +1,15 @@
-import { ModalContentProps } from "./lib/modal-content.js";
+import { Actions, Body } from "./lib/modal-parts.js";
+import { Close, Content, Description, Root, Title, Trigger } from "./drawer-parts.js";
 //#region src/drawer.d.ts
 declare const Drawer: {
-  Root: typeof import("vaul").Root;
-  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-  Close: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
-  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;
-  Body: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
-  Actions: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Root: typeof Root;
+  Trigger: typeof Trigger;
+  Close: typeof Close;
+  Content: typeof Content;
+  Title: typeof Title;
+  Description: typeof Description;
+  Body: typeof Body;
+  Actions: typeof Actions;
 };
 //#endregion
 export { Drawer };

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

@@ -1,8 +1,12 @@
+import { Styled } from "./styled.js";
 import * as RadixMenu from "@radix-ui/react-dropdown-menu";
 //#region src/dropdown-menu-parts.d.ts
-declare const Root: import("react").FC<RadixMenu.DropdownMenuProps>;
-declare const Trigger: import("react").ForwardRefExoticComponent<RadixMenu.DropdownMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const Group: import("react").ForwardRefExoticComponent<RadixMenu.DropdownMenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
-declare const Content: (props: RadixMenu.DropdownMenuContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element, Item: (props: RadixMenu.DropdownMenuItemProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode, Label: (props: RadixMenu.DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode, Separator: (props: RadixMenu.DropdownMenuSeparatorProps & 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/dropdown-menu-parts.js

@@ -5,6 +5,10 @@ import * as RadixMenu from "@radix-ui/react-dropdown-menu";
 const Root = RadixMenu.Root;
 const Trigger = RadixMenu.Trigger;
 const Group = RadixMenu.Group;
-const { Content, Item, Label, Separator } = createMenuParts(RadixMenu, "dropdown-menu");
+const menu = createMenuParts(RadixMenu, "dropdown-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/dropdown-menu.d.ts

@@ -1,12 +1,13 @@
+import { Content, Group, Item, Label, Root, Separator, Trigger } from "./dropdown-menu-parts.js";
 //#region src/dropdown-menu.d.ts
 declare const DropdownMenu: {
-  Root: import("react").FC<import("@radix-ui/react-dropdown-menu").DropdownMenuProps>;
-  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dropdown-menu").DropdownMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-  Content: (props: import("@radix-ui/react-dropdown-menu").DropdownMenuContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").JSX.Element;
-  Group: import("react").ForwardRefExoticComponent<import("@radix-ui/react-dropdown-menu").DropdownMenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
-  Label: (props: import("@radix-ui/react-dropdown-menu").DropdownMenuLabelProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-  Item: (props: import("@radix-ui/react-dropdown-menu").DropdownMenuItemProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-  Separator: (props: import("@radix-ui/react-dropdown-menu").DropdownMenuSeparatorProps & 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 { DropdownMenu };

package/dist/empty-state.d.ts

@@ -1,10 +1,16 @@
+import { Styled } from "./styled.js";
 //#region src/empty-state.d.ts
+declare const Root: Styled<"div">;
+declare const Icon: Styled<"span">;
+declare const Title: Styled<"h3">;
+declare const Description: Styled<"p">;
+declare const Actions: Styled<"div">;
 declare const EmptyState: {
-  Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
-  Icon: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
-  Title: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>) => import("react").ReactNode;
-  Description: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
-  Actions: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+  Root: typeof Root;
+  Icon: typeof Icon;
+  Title: typeof Title;
+  Description: typeof Description;
+  Actions: typeof Actions;
 };
 //#endregion
 export { EmptyState };

package/dist/field-parts.d.ts

@@ -1,15 +1,16 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
+import { ComponentPropsWithRef, JSX, ReactNode } from "react";
 import * as RadixLabel from "@radix-ui/react-label";
 import { Slot } from "@radix-ui/react-slot";
 //#region src/field-parts.d.ts
-type RootProps = ComponentPropsWithRef<'div'> & {
+type RootProps = ComponentPropsWithRef<"div"> & {
   invalid?: boolean;
 };
-declare const Root: ({ invalid, ...props }: RootProps) => import("react").JSX.Element;
-declare const Label: (props: ComponentPropsWithRef<typeof RadixLabel.Root>) => import("react").JSX.Element;
-declare const Description: (props: ComponentPropsWithRef<'p'>) => import("react").JSX.Element;
-declare const FieldError: (props: ComponentPropsWithRef<'p'>) => import("react").JSX.Element | null;
+declare const Root: ({ invalid, ...props }: RootProps) => JSX.Element;
+declare const Label: Styled<typeof RadixLabel.Root>;
+declare const Description: Styled<"p">;
+declare const FieldError: (props: ComponentPropsWithRef<"p">) => ReactNode;
 /** Passes the id and aria wiring to its single child, which is usually the input. */
-declare const Control: (props: ComponentPropsWithRef<typeof Slot>) => import("react").JSX.Element;
+declare const Control: Styled<typeof Slot>;
 //#endregion
 export { Control, Description, FieldError as Error, type RootProps as FieldProps, Label, Root };

package/dist/file-dropzone-parts.d.ts

@@ -1,6 +1,7 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/file-dropzone-parts.d.ts
-type RejectionReason = 'type' | 'size' | 'count';
+type RejectionReason = "type" | "size" | "count";
 type FileRejection = {
   file: File;
   reason: RejectionReason;
@@ -15,7 +16,7 @@ declare const sortFiles: (files: File[], { accept, maxSize, multiple }: {
   accepted: File[];
   rejected: FileRejection[];
 };
-type RootProps = Omit<ComponentPropsWithRef<'div'>, 'onDrop' | 'onChange'> & {
+type RootProps = Omit<ComponentPropsWithRef<"div">, "onDrop" | "onChange"> & {
   /** Same syntax as the native input: `image/*,.pdf`. */
   accept?: string;
   /** Largest allowed file in bytes. */
@@ -26,9 +27,9 @@ type RootProps = Omit<ComponentPropsWithRef<'div'>, 'onDrop' | 'onChange'> & {
   onFilesRejected?: (rejections: FileRejection[]) => void;
 };
 /** A drop target that is also a button: click or press Enter to open the file picker. */
-declare const Root: ({ accept, maxSize, multiple, disabled, onFilesAccepted, onFilesRejected, children, ...props }: RootProps) => import("react").JSX.Element;
-declare const Icon: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
-declare const Title: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
-declare const Description: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
+declare const Root: ({ accept, maxSize, multiple, disabled, onFilesAccepted, onFilesRejected, children, ...props }: RootProps) => JSX.Element;
+declare const Icon: Styled<"span">;
+declare const Title: Styled<"p">;
+declare const Description: Styled<"p">;
 //#endregion
 export { Description, type FileRejection, Icon, type RejectionReason, Root, type RootProps, Title, matchesAccept, sortFiles };

package/dist/file-dropzone.d.ts

@@ -1,10 +1,10 @@
-import { FileRejection, RejectionReason, Root } from "./file-dropzone-parts.js";
+import { Description, FileRejection, Icon, RejectionReason, Root, Title } from "./file-dropzone-parts.js";
 //#region src/file-dropzone.d.ts
 declare const FileDropzone: {
   Root: typeof Root;
-  Icon: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
-  Title: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
-  Description: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>) => import("react").ReactNode;
+  Icon: typeof Icon;
+  Title: typeof Title;
+  Description: typeof Description;
 };
 //#endregion
 export { FileDropzone, type FileRejection, type RejectionReason };

package/dist/heading.d.ts

@@ -1,9 +1,9 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/heading.d.ts
-type HeadingProps = ComponentPropsWithRef<'h1'> & {
+type HeadingProps = ComponentPropsWithRef<"h1"> & {
   level?: 1 | 2 | 3 | 4 | 5 | 6;
 };
 /** `level` sets the document outline. */
-declare const Heading: ({ level, ...props }: HeadingProps) => import("react").JSX.Element;
+declare const Heading: ({ level, ...props }: HeadingProps) => JSX.Element;
 //#endregion
 export { Heading, type HeadingProps };

package/dist/hover-card-parts.d.ts

@@ -1,8 +1,8 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
 import * as RadixHoverCard from "@radix-ui/react-hover-card";
 //#region src/hover-card-parts.d.ts
-declare const Root: import("react").FC<RadixHoverCard.HoverCardProps>;
-declare const Trigger: import("react").ForwardRefExoticComponent<RadixHoverCard.HoverCardTriggerProps & import("react").RefAttributes<HTMLAnchorElement>>;
-declare const Content: (props: ComponentPropsWithRef<typeof RadixHoverCard.Content>) => import("react").JSX.Element;
+declare const Root: typeof RadixHoverCard.Root;
+declare const Trigger: typeof RadixHoverCard.Trigger;
+declare const Content: Styled<typeof RadixHoverCard.Content>;
 //#endregion
 export { Content, Root, Trigger };

package/dist/hover-card.d.ts

@@ -1,8 +1,8 @@
-import { Content } from "./hover-card-parts.js";
+import { Content, Root, Trigger } from "./hover-card-parts.js";
 //#region src/hover-card.d.ts
 declare const HoverCard: {
-  Root: import("react").FC<import("@radix-ui/react-hover-card").HoverCardProps>;
-  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-hover-card").HoverCardTriggerProps & import("react").RefAttributes<HTMLAnchorElement>>;
+  Root: typeof Root;
+  Trigger: typeof Trigger;
   Content: typeof Content;
 };
 //#endregion

package/dist/icon-button.d.ts

@@ -1,6 +1,7 @@
+import { Styled } from "./styled.js";
 import { ComponentPropsWithRef } from "react";
 //#region src/icon-button.d.ts
-type IconButtonProps = ComponentPropsWithRef<'button'>;
-declare const IconButton: (props: import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>) => import("react").ReactNode;
+type IconButtonProps = ComponentPropsWithRef<"button">;
+declare const IconButton: Styled<"button">;
 //#endregion
 export { IconButton, type IconButtonProps };

package/dist/icon.d.ts

@@ -1,7 +1,7 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/icon.d.ts
-type IconProps = ComponentPropsWithRef<'span'>;
+type IconProps = ComponentPropsWithRef<"span">;
 /** Wraps any svg child and hides it from assistive tech unless a label is given. */
-declare const Icon: ({ 'aria-label': label, ...props }: IconProps) => import("react").JSX.Element;
+declare const Icon: ({ "aria-label": label, ...props }: IconProps) => JSX.Element;
 //#endregion
 export { Icon, type IconProps };

package/dist/input.d.ts

@@ -1,4 +1,5 @@
+import { Styled } from "./styled.js";
 //#region src/input.d.ts
-declare const Input: (props: import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>) => import("react").ReactNode;
+declare const Input: Styled<"input">;
 //#endregion
 export { Input };

package/dist/lib/commit-on.d.ts

@@ -1,5 +1,9 @@
-import { FocusEvent, FocusEventHandler, KeyboardEvent, KeyboardEventHandler } from "react";
+import { FocusEventHandler, KeyboardEventHandler } from "react";
 //#region src/lib/commit-on.d.ts
+type CommitHandlers<T extends HTMLElement> = {
+  onBlur: FocusEventHandler<T>;
+  onKeyDown: KeyboardEventHandler<T>;
+};
 /**
  * Handlers that commit typed text on blur and on Enter, after the caller's own
  * handlers have run. Spread them on a text field.
@@ -7,9 +11,6 @@ import { FocusEvent, FocusEventHandler, KeyboardEvent, KeyboardEventHandler } fr
 declare const commitOn: <T extends HTMLElement>(commit: () => void, { onBlur, onKeyDown }?: {
   onBlur?: FocusEventHandler<T>;
   onKeyDown?: KeyboardEventHandler<T>;
-}) => {
-  onBlur: (event: FocusEvent<T>) => void;
-  onKeyDown: (event: KeyboardEvent<T>) => void;
-};
+}) => CommitHandlers<T>;
 //#endregion
 export { commitOn };

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

@@ -1,4 +1,5 @@
-import { ComponentPropsWithRef, ElementType } from "react";
+import { Styled } from "../styled.js";
+import { ElementType } from "react";
 //#region src/lib/menu-parts.d.ts
 type MenuPrimitive = {
   Portal: ElementType;
@@ -7,15 +8,16 @@ type MenuPrimitive = {
   Label: ElementType;
   Separator: ElementType;
 };
+type MenuParts<P extends MenuPrimitive> = {
+  Content: Styled<P["Content"]>;
+  Item: Styled<P["Item"]>;
+  Label: Styled<P["Label"]>;
+  Separator: Styled<P["Separator"]>;
+};
 /**
  * Content, Item, Label and Separator for any Radix menu-like primitive
  * (dropdown menu, context menu, select). `slot` prefixes each `data-slot`.
  */
-declare const createMenuParts: <P extends MenuPrimitive>(primitive: P, slot: string) => {
-  Content: (props: ComponentPropsWithRef<P['Content']>) => import("react").JSX.Element;
-  Item: (props: ComponentPropsWithRef<P["Item"]>) => import("react").ReactNode;
-  Label: (props: ComponentPropsWithRef<P["Label"]>) => import("react").ReactNode;
-  Separator: (props: ComponentPropsWithRef<P["Separator"]>) => import("react").ReactNode;
-};
+declare const createMenuParts: <P extends MenuPrimitive>(primitive: P, slot: string) => MenuParts<P>;
 //#endregion
 export { createMenuParts };

package/dist/lib/modal-content.d.ts

@@ -1,17 +1,18 @@
-import { ComponentPropsWithRef, ElementType, Ref } from "react";
+import { ComponentPropsWithRef, ElementType, JSX, Ref } from "react";
 //#region src/lib/modal-content.d.ts
 type ModalPrimitive = {
   Portal: ElementType;
   Overlay: ElementType;
   Content: ElementType;
 };
-type ModalContentProps<P extends ModalPrimitive> = ComponentPropsWithRef<P['Content']> & {
+type ModalContentProps<P extends ModalPrimitive> = ComponentPropsWithRef<P["Content"]> & {
   classNames?: {
     overlay?: string;
   };
   overlayRef?: Ref<HTMLDivElement>;
 };
+type ModalContentPart<P extends ModalPrimitive> = (props: ModalContentProps<P>) => JSX.Element;
 /** Opens in a portal over an overlay. `slot` prefixes each `data-slot`, e.g. `dialog` gives `dialog` and `dialog-overlay`. */
-declare const createModalContent: <P extends ModalPrimitive>(primitive: P, slot: string) => ({ classNames, overlayRef, ...props }: ModalContentProps<P>) => import("react").JSX.Element;
+declare const createModalContent: <P extends ModalPrimitive>(primitive: P, slot: string) => ModalContentPart<P>;
 //#endregion
-export { type ModalContentProps, createModalContent };
+export { type ModalContentPart, type ModalContentProps, createModalContent };

package/dist/lib/modal-parts.d.ts

@@ -1,6 +1,7 @@
+import { Styled } from "../styled.js";
 //#region src/lib/modal-parts.d.ts
 /** Shared by Dialog, AlertDialog, Sheet and Drawer. */
-declare const Body: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
-declare const Actions: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
+declare const Body: Styled<"div">;
+declare const Actions: Styled<"div">;
 //#endregion
 export { Actions, Body };

package/dist/lib/part.d.ts

@@ -1,6 +1,7 @@
-import { ComponentPropsWithRef, ElementType, ReactNode } from "react";
+import { Styled } from "../styled.js";
+import { ComponentPropsWithRef, ElementType } from "react";
 //#region src/lib/part.d.ts
 /** A part that tags its element with `data-slot` and applies default props. Props given by the caller win. */
-declare const part: <T extends ElementType>(element: T, slot: string, defaults?: Partial<ComponentPropsWithRef<T>>) => (props: ComponentPropsWithRef<T>) => ReactNode;
+declare const part: <T extends ElementType>(element: T, slot: string, defaults?: Partial<ComponentPropsWithRef<T>>) => Styled<T>;
 //#endregion
 export { part };

package/dist/lib/picker.d.ts

@@ -1,4 +1,5 @@
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { Styled } from "../styled.js";
+import { ComponentPropsWithRef, JSX, ReactNode } from "react";
 //#region src/lib/picker.d.ts
 type PickerState<V> = {
   value: V | null;
@@ -13,7 +14,7 @@ type PickerContextValue<V, M> = {
   actions: PickerActions<V>;
   meta: M;
 };
-type PickerProviderProps<V, M> = Omit<PickerContextValue<V, M>, 'meta'> & {
+type PickerProviderProps<V, M> = Omit<PickerContextValue<V, M>, "meta"> & {
   meta?: M;
   children?: ReactNode;
 };
@@ -23,22 +24,24 @@ type PickerOptions<V> = {
   /** When the value counts as empty and `Value` shows its placeholder. */
   isEmpty?: (value: V | null) => boolean;
 };
-/**
- * The state, trigger and value shared by every picker that opens in a drawer
- * (combobox, date picker, date range picker). `slot` prefixes each `data-slot`.
- */
-declare const createPicker: <V, M extends object = object>(name: string, slot: string, { closeOnSelect, isEmpty }?: PickerOptions<V>) => {
-  ContextProvider: ({ state, actions, meta, children }: PickerProviderProps<V, M>) => import("react").JSX.Element;
-  Provider: ({ children, ...props }: PickerProviderProps<V, M>) => import("react").JSX.Element;
-  Trigger: (props: ComponentPropsWithRef<'button'>) => import("react").JSX.Element;
-  Value: ({ placeholder, children, ...props }: ComponentPropsWithRef<'span'> & {
-    placeholder?: string;
-  }) => import("react").JSX.Element;
-  usePicker: any;
+type PickerValueProps = ComponentPropsWithRef<"span"> & {
+  placeholder?: string;
+};
+type Picker<V, M extends object = object> = {
+  ContextProvider: (props: PickerProviderProps<V, M>) => JSX.Element;
+  Provider: (props: PickerProviderProps<V, M>) => JSX.Element;
+  Trigger: Styled<"button">;
+  Value: (props: PickerValueProps) => JSX.Element;
+  usePicker: () => PickerContextValue<V, M>;
   usePickerState: (value: V | null | undefined, defaultValue: V | null, onValueChange?: (value: V) => void) => {
     state: PickerState<V>;
     actions: PickerActions<V>;
   };
 };
+/**
+ * The state, trigger and value shared by every picker that opens in a drawer
+ * (combobox, date picker, date range picker). `slot` prefixes each `data-slot`.
+ */
+declare const createPicker: <V, M extends object = object>(name: string, slot: string, { closeOnSelect, isEmpty }?: PickerOptions<V>) => Picker<V, M>;
 //#endregion
-export { type PickerActions, type PickerContextValue, type PickerProviderProps, type PickerState, createPicker };
+export { type Picker, type PickerActions, type PickerContextValue, type PickerProviderProps, type PickerState, type PickerValueProps, createPicker };

package/dist/link.d.ts

@@ -1,9 +1,9 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/link.d.ts
-type LinkProps = ComponentPropsWithRef<'a'> & {
+type LinkProps = ComponentPropsWithRef<"a"> & {
   asChild?: boolean;
 };
 /** Pass `asChild` to render your router's link component instead of a plain anchor. */
-declare const Link: ({ asChild, ...props }: LinkProps) => import("react").JSX.Element;
+declare const Link: ({ asChild, ...props }: LinkProps) => JSX.Element;
 //#endregion
 export { Link, type LinkProps };

package/dist/markdown.d.ts

@@ -1,10 +1,10 @@
-import { ComponentProps } from "react";
+import { ComponentProps, JSX } from "react";
 import ReactMarkdown, { Components as MarkdownComponents } from "react-markdown";
 //#region src/markdown.d.ts
 type MarkdownProps = ComponentProps<typeof ReactMarkdown> & {
   /** Applied to the wrapper. */
   className?: string;
 };
-declare const Markdown: ({ className, ...props }: MarkdownProps) => import("react").JSX.Element;
+declare const Markdown: ({ className, ...props }: MarkdownProps) => JSX.Element;
 //#endregion
 export { Markdown, type MarkdownComponents, type MarkdownProps };

package/dist/message.d.ts

@@ -1,13 +1,16 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/message.d.ts
-type RootProps = ComponentPropsWithRef<'div'> & {
-  from?: 'agent' | 'user';
+type RootProps = ComponentPropsWithRef<"div"> & {
+  from?: "agent" | "user";
 };
-declare const Root: ({ from, ...props }: RootProps) => import("react").JSX.Element;
+declare const Root: ({ from, ...props }: RootProps) => JSX.Element;
+declare const Bubble: Styled<"div">;
+declare const Highlight: Styled<"span">;
 declare const Message: {
   Root: typeof Root;
-  Bubble: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => import("react").ReactNode;
-  Highlight: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>) => import("react").ReactNode;
+  Bubble: typeof Bubble;
+  Highlight: typeof Highlight;
 };
 //#endregion
 export { Message, type RootProps as MessageProps };

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

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import { JSX, ReactNode } from "react";
 //#region src/month-picker-parts.d.ts
 type RootProps = {
   /** Any day in the selected month. Reported back as the first of the month. */
@@ -14,6 +14,6 @@ type RootProps = {
  * A calendar that stops at months: it reuses the Calendar parts (Frame, Header,
  * Heading, Previous, Next, Months, Years) and never shows days.
  */
-declare const Root: ({ value, defaultValue, onValueChange, defaultMonth, locale, children }: RootProps) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, defaultMonth, locale, children }: RootProps) => JSX.Element;
 //#endregion
 export { Root, type RootProps };

package/dist/month-stepper-parts.d.ts

@@ -1,16 +1,17 @@
+import { Styled } from "./styled.js";
 import { IconButtonProps } from "./icon-button.js";
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 //#region src/month-stepper-parts.d.ts
-type RootProps = Omit<ComponentPropsWithRef<'div'>, 'defaultValue'> & {
+type RootProps = Omit<ComponentPropsWithRef<"div">, "defaultValue"> & {
   value?: Date;
   defaultValue?: Date;
   onValueChange?: (month: Date) => void;
   locale?: string;
 };
 /** Always reports the first day of the month. */
-declare const Root: ({ value, defaultValue, onValueChange, locale, ...props }: RootProps) => import("react").JSX.Element;
-declare const Previous: (props: IconButtonProps) => import("react").JSX.Element;
-declare const Next: (props: IconButtonProps) => import("react").JSX.Element;
-declare const Label: (props: ComponentPropsWithRef<'span'>) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, locale, ...props }: RootProps) => JSX.Element;
+declare const Previous: (props: IconButtonProps) => JSX.Element;
+declare const Next: (props: IconButtonProps) => JSX.Element;
+declare const Label: Styled<"span">;
 //#endregion
 export { Label, Next, Previous, Root, type RootProps };