@journ/nude 0.1.1 → 0.1.3

package/dist/tabs-parts.d.ts

@@ -1,8 +1,9 @@
+import { Styled } from "./styled.js";
 import * as RadixTabs from "@radix-ui/react-tabs";
 //#region src/tabs-parts.d.ts
-declare const Root: (props: RadixTabs.TabsProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-declare const List: (props: RadixTabs.TabsListProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-declare const Trigger: (props: RadixTabs.TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
-declare const Content: (props: RadixTabs.TabsContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+declare const Root: Styled<typeof RadixTabs.Root>;
+declare const List: Styled<typeof RadixTabs.List>;
+declare const Trigger: Styled<typeof RadixTabs.Trigger>;
+declare const Content: Styled<typeof RadixTabs.Content>;
 //#endregion
 export { Content, List, Root, Trigger };

package/dist/tabs.d.ts

@@ -1,9 +1,10 @@
+import { Content, List, Root, Trigger } from "./tabs-parts.js";
 //#region src/tabs.d.ts
 declare const Tabs: {
-  Root: (props: import("@radix-ui/react-tabs").TabsProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-  List: (props: import("@radix-ui/react-tabs").TabsListProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-  Trigger: (props: import("@radix-ui/react-tabs").TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
-  Content: (props: import("@radix-ui/react-tabs").TabsContentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
+  Root: typeof Root;
+  List: typeof List;
+  Trigger: typeof Trigger;
+  Content: typeof Content;
 };
 //#endregion
 export { Tabs };

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

@@ -1,9 +1,19 @@
+import { Styled } from "./styled.js";
 import { ChipTagProps as TagProps$1 } from "./chip.js";
 import { Composer } from "./composer.js";
-import { ComponentPropsWithRef, ElementType, ReactNode } from "react";
+import { ComponentPropsWithRef, ElementType, JSX, ReactNode } from "react";
 //#region src/tag-input-parts.d.ts
-declare const useTagInput: any;
-type RootProps = Omit<ComponentPropsWithRef<'div'>, 'defaultValue' | 'onChange'> & {
+type TagInputContextValue = {
+  tags: string[];
+  text: string;
+  invalid: boolean;
+  setText: (text: string) => void;
+  add: (...tags: string[]) => void;
+  remove: (tag: string) => void;
+  removeLast: () => void;
+};
+declare const useTagInput: () => TagInputContextValue;
+type RootProps = Omit<ComponentPropsWithRef<"div">, "defaultValue" | "onChange"> & {
   value?: string[];
   defaultValue?: string[];
   onValueChange?: (tags: string[]) => void;
@@ -12,19 +22,19 @@ type RootProps = Omit<ComponentPropsWithRef<'div'>, 'defaultValue' | 'onChange'>
   children?: ReactNode;
 };
 /** Tags are trimmed, unique (ignoring case) and never empty. */
-declare const Root: ({ value, defaultValue, onValueChange, validate, children, ...props }: RootProps) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, validate, children, ...props }: RootProps) => JSX.Element;
 type TagComponents = {
   /** The chip rendered per tag. It receives `removeLabel`, `onRemove` and the tag as children. */
   components?: {
     Tag?: ElementType;
   };
 };
-type TagProps = Omit<TagProps$1, 'children' | 'onRemove'> & TagComponents & {
+type TagProps = Omit<TagProps$1, "children" | "onRemove"> & TagComponents & {
   value: string;
 };
-declare const Tag: ({ value, components, ...props }: TagProps) => import("react").JSX.Element;
+declare const Tag: ({ value, components, ...props }: TagProps) => JSX.Element;
 /** One `Tag` per value. Use `useTagInput` and `Tag` yourself for a custom list. */
-declare const Tags: ({ components }: TagComponents) => any;
-declare const Field: ({ onKeyDown, onBlur, onPaste, ...props }: ComponentPropsWithRef<typeof Composer.Input>) => import("react").JSX.Element;
+declare const Tags: ({ components }: TagComponents) => ReactNode;
+declare const Field: Styled<typeof Composer.Input>;
 //#endregion
 export { Field, Root, type RootProps, Tag, type TagProps, Tags, useTagInput };

package/dist/tag-input-parts.js

@@ -3,9 +3,11 @@ import { Chip } from "./chip.js";
 import { Composer } from "./composer.js";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
-import { createRequiredContext, useControllableState } from "@journ/lift";
+import { createRequiredContext } from "@journ/lift/required-context";
+import { useControllableState } from "@journ/lift/use-controllable-state";
 //#region src/tag-input-parts.tsx
-const [TagInputContext, useTagInput] = createRequiredContext("TagInput.Root");
+const [TagInputContext, useTagInputContext] = createRequiredContext("TagInput.Root");
+const useTagInput = useTagInputContext;
 const none = [];
 /** Tags are trimmed, unique (ignoring case) and never empty. */
 const Root = ({ value, defaultValue = none, onValueChange, validate, children, ...props }) => {

package/dist/text-morph.d.ts

@@ -1,6 +1,6 @@
-import { ComponentPropsWithRef, ElementType } from "react";
+import { ComponentPropsWithRef, ElementType, JSX } from "react";
 //#region src/text-morph.d.ts
-type TextMorphProps = Omit<ComponentPropsWithRef<'span'>, 'children'> & {
+type TextMorphProps = Omit<ComponentPropsWithRef<"span">, "children"> & {
   children: string;
   as?: ElementType;
   classNames?: {
@@ -12,6 +12,6 @@ type TextMorphProps = Omit<ComponentPropsWithRef<'span'>, 'children'> & {
  * Plays text one character at a time. When the text changes, only the characters
  * that differ drop in again. Screen readers get the whole string once.
  */
-declare const TextMorph: ({ children: text, as: Component, classNames, style, ...props }: TextMorphProps) => import("react").JSX.Element;
+declare const TextMorph: ({ children: text, as: Component, classNames, style, ...props }: TextMorphProps) => JSX.Element;
 //#endregion
 export { TextMorph, type TextMorphProps };

package/dist/text-morph.js

@@ -2,7 +2,7 @@
 import { visuallyHidden } from "./lib/visually-hidden.js";
 import { useLayoutEffect, useRef } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { prefersReducedMotion } from "@journ/lift";
+import { prefersReducedMotion } from "@journ/lift/prefers-reduced-motion";
 import { animate } from "animejs";
 //#region src/text-morph.tsx
 /**

package/dist/text-shimmer.d.ts

@@ -1,9 +1,9 @@
-import { ComponentPropsWithRef, ElementType } from "react";
+import { ComponentPropsWithRef, ElementType, JSX } from "react";
 //#region src/text-shimmer.d.ts
-type TextShimmerProps = ComponentPropsWithRef<'span'> & {
+type TextShimmerProps = ComponentPropsWithRef<"span"> & {
   /** The element to render, `span` by default. */
   as?: ElementType;
 };
-declare const TextShimmer: ({ as: Component, ...props }: TextShimmerProps) => import("react").JSX.Element;
+declare const TextShimmer: ({ as: Component, ...props }: TextShimmerProps) => JSX.Element;
 //#endregion
 export { TextShimmer, type TextShimmerProps };

package/dist/text.d.ts

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

package/dist/textarea.d.ts

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

package/dist/time-range-parts.d.ts

@@ -1,5 +1,5 @@
 import { Input } from "./input.js";
-import { ComponentPropsWithRef, ReactNode } from "react";
+import { ComponentPropsWithRef, JSX, ReactNode } from "react";
 //#region src/time-range-parts.d.ts
 type TimeRangeValue = {
   start: string;
@@ -12,11 +12,11 @@ type RootProps = {
   onValueChange?: (value: TimeRangeValue) => void;
   children?: ReactNode;
 };
-declare const Root: ({ value, defaultValue, onValueChange, children }: RootProps) => import("react").JSX.Element;
-type TimeFieldProps = Omit<ComponentPropsWithRef<typeof Input>, 'type' | 'value'>;
-declare const Start: (props: TimeFieldProps) => import("react").JSX.Element;
-declare const Stop: (props: TimeFieldProps) => import("react").JSX.Element;
+declare const Root: ({ value, defaultValue, onValueChange, children }: RootProps) => JSX.Element;
+type TimeFieldProps = Omit<ComponentPropsWithRef<typeof Input>, "type" | "value">;
+declare const Start: (props: TimeFieldProps) => JSX.Element;
+declare const Stop: (props: TimeFieldProps) => JSX.Element;
 /** The time between start and stop. A stop before the start means the next day. */
-declare const Duration: (props: Omit<ComponentPropsWithRef<'output'>, 'children'>) => import("react").JSX.Element;
+declare const Duration: (props: Omit<ComponentPropsWithRef<"output">, "children">) => JSX.Element;
 //#endregion
 export { Duration, Root, type RootProps, Start, Stop, type TimeRangeValue };

package/dist/time-range-parts.js

@@ -1,8 +1,9 @@
 "use client";
 import { Input } from "./input.js";
 import { jsx } from "react/jsx-runtime";
-import { createRequiredContext, useControllableState } from "@journ/lift";
-import { formatDuration, minutesBetween } from "@journ/fitter-happier";
+import { createRequiredContext } from "@journ/lift/required-context";
+import { useControllableState } from "@journ/lift/use-controllable-state";
+import { formatDuration, minutesBetween } from "@journ/fitter-happier/time";
 //#region src/time-range-parts.tsx
 const [TimeRangeContext, useTimeRange] = createRequiredContext("TimeRange.Root");
 const empty = {

package/dist/toast-parts.d.ts

@@ -1,12 +1,13 @@
-import { ComponentProps } from "react";
+import { Styled } from "./styled.js";
+import { ComponentProps, JSX } from "react";
 import { Toaster, toast } from "sonner";
 //#region src/toast-parts.d.ts
 /** Unstyled: sonner's own look is turned off. Pass `toastOptions.classNames` to style it. */
-declare const Provider: ({ toastOptions, ...props }: ComponentProps<typeof Toaster>) => import("react").JSX.Element;
+declare const Provider: ({ toastOptions, ...props }: ComponentProps<typeof Toaster>) => JSX.Element;
 declare const show: typeof toast;
-declare const Root: (props: import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => 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 Action: (props: import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>) => import("react").ReactNode;
+declare const Root: Styled<"div">;
+declare const Title: Styled<"p">;
+declare const Description: Styled<"p">;
+declare const Action: Styled<"button">;
 //#endregion
 export { Action, Description, Provider, Root, Title, show };

package/dist/toggle-group-parts.d.ts

@@ -1,6 +1,7 @@
+import { Styled } from "./styled.js";
 import * as RadixToggleGroup from "@radix-ui/react-toggle-group";
 //#region src/toggle-group-parts.d.ts
-declare const Root: (props: (RadixToggleGroup.ToggleGroupMultipleProps | RadixToggleGroup.ToggleGroupSingleProps) & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-declare const Item: (props: RadixToggleGroup.ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
+declare const Root: Styled<typeof RadixToggleGroup.Root>;
+declare const Item: Styled<typeof RadixToggleGroup.Item>;
 //#endregion
 export { Item, Root };

package/dist/toggle-group.d.ts

@@ -1,7 +1,8 @@
+import { Item, Root } from "./toggle-group-parts.js";
 //#region src/toggle-group.d.ts
 declare const ToggleGroup: {
-  Root: (props: (import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps | import("@radix-ui/react-toggle-group").ToggleGroupSingleProps) & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactNode;
-  Item: (props: import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactNode;
+  Root: typeof Root;
+  Item: typeof Item;
 };
 //#endregion
 export { ToggleGroup };

package/dist/tooltip-parts.d.ts

@@ -1,10 +1,10 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
 import * as RadixTooltip from "@radix-ui/react-tooltip";
 //#region src/tooltip-parts.d.ts
-declare const Provider: import("react").FC<RadixTooltip.TooltipProviderProps>;
+declare const Provider: typeof RadixTooltip.Provider;
 /** Includes its own provider so a tooltip works without extra setup. */
-declare const Root: ({ delayDuration, ...props }: ComponentPropsWithRef<typeof RadixTooltip.Root>) => import("react").JSX.Element;
-declare const Trigger: import("react").ForwardRefExoticComponent<RadixTooltip.TooltipTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
-declare const Content: (props: ComponentPropsWithRef<typeof RadixTooltip.Content>) => import("react").JSX.Element;
+declare const Root: Styled<typeof RadixTooltip.Root>;
+declare const Trigger: typeof RadixTooltip.Trigger;
+declare const Content: Styled<typeof RadixTooltip.Content>;
 //#endregion
 export { Content, Provider, Root, Trigger };

package/dist/tooltip.d.ts

@@ -1,9 +1,9 @@
-import { Content, Root } from "./tooltip-parts.js";
+import { Content, Provider, Root, Trigger } from "./tooltip-parts.js";
 //#region src/tooltip.d.ts
 declare const Tooltip: {
-  Provider: import("react").FC<import("@radix-ui/react-tooltip").TooltipProviderProps>;
+  Provider: typeof Provider;
   Root: typeof Root;
-  Trigger: import("react").ForwardRefExoticComponent<import("@radix-ui/react-tooltip").TooltipTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+  Trigger: typeof Trigger;
   Content: typeof Content;
 };
 //#endregion

package/dist/touch-target.d.ts

@@ -1,6 +1,6 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "./styled.js";
 //#region src/touch-target.d.ts
 /** A hit-area element rendered before its children. Style it to grow the touch area without changing layout. */
-declare const TouchTarget: ({ children, ...props }: ComponentPropsWithRef<'span'>) => import("react").JSX.Element;
+declare const TouchTarget: Styled<"span">;
 //#endregion
 export { TouchTarget };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@journ/nude",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Unstyled, accessible React primitives for the web. They own behavior, state, focus and ARIA, and leave every visual decision to you.",
   "license": "MIT",
   "repository": {
@@ -61,8 +61,8 @@
     "react-markdown": "^10.1.0",
     "sonner": "^2.0.8",
     "vaul": "^1.1.2",
-    "@journ/fitter-happier": "0.1.1",
-    "@journ/lift": "0.1.1"
+    "@journ/fitter-happier": "0.2.0",
+    "@journ/lift": "0.2.0"
   },
   "peerDependencies": {
     "react": "^19.0.0",