@journ/bloom 0.1.1 → 0.1.3

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

@@ -1,11 +1,12 @@
 import { IconButtonProps } from "./icon-button.js";
-import { ComponentPropsWithRef } from "react";
+import { JSX } from "react";
 import * as Nude from "@journ/nude/quantity-input-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/quantity-input-parts.d.ts
 type RootProps = Nude.RootProps;
-declare const Root: ({ className, ...props }: RootProps) => import("react").JSX.Element;
-declare const Decrement: ({ tone, size, className, children, ...props }: IconButtonProps) => import("react").JSX.Element;
-declare const Increment: ({ tone, size, className, children, ...props }: IconButtonProps) => import("react").JSX.Element;
-declare const Field: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Field>) => import("react").JSX.Element;
+declare const Root: ({ className, ...props }: RootProps) => JSX.Element;
+declare const Decrement: ({ tone, size, className, children, ...props }: IconButtonProps) => JSX.Element;
+declare const Increment: ({ tone, size, className, children, ...props }: IconButtonProps) => JSX.Element;
+declare const Field: Styled<typeof Nude.Field>;
 //#endregion
 export { Decrement, Field, Increment, Root, type RootProps };

package/dist/radio-parts.d.ts

@@ -1,7 +1,8 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 import * as Nude from "@journ/nude/radio-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/radio-parts.d.ts
-declare const Group: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Group>) => import("react").JSX.Element;
-declare const Item: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Item>, 'classNames' | 'children'>) => import("react").JSX.Element;
+declare const Group: Styled<typeof Nude.Group>;
+declare const Item: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Item>, "classNames" | "children">) => JSX.Element;
 //#endregion
 export { Group, Item };

package/dist/scroll-area-parts.d.ts

@@ -1,9 +1,10 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 import * as Nude from "@journ/nude/scroll-area-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/scroll-area-parts.d.ts
-declare const Root: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Root>) => import("react").JSX.Element;
-declare const Viewport: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Viewport>) => import("react").JSX.Element;
-declare const Scrollbar: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Scrollbar>, 'classNames' | 'children'>) => import("react").JSX.Element;
-declare const Corner: any;
+declare const Root: Styled<typeof Nude.Root>;
+declare const Viewport: Styled<typeof Nude.Viewport>;
+declare const Scrollbar: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Scrollbar>, "classNames" | "children">) => JSX.Element;
+declare const Corner: typeof Nude.Corner;
 //#endregion
 export { Corner, Root, Scrollbar, Viewport };

package/dist/scroll-area.d.ts

@@ -1,10 +1,10 @@
-import { Root, Scrollbar, Viewport } from "./scroll-area-parts.js";
+import { Corner, Root, Scrollbar, Viewport } from "./scroll-area-parts.js";
 //#region src/scroll-area.d.ts
 declare const ScrollArea: {
   Root: typeof Root;
   Viewport: typeof Viewport;
   Scrollbar: typeof Scrollbar;
-  Corner: any;
+  Corner: typeof Corner;
 };
 //#endregion
 export { ScrollArea };

package/dist/select-parts.d.ts

@@ -1,13 +1,14 @@
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 import * as Nude from "@journ/nude/select-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/select-parts.d.ts
-declare const Root: any;
-declare const Group: any;
-declare const Value: any;
-declare const Trigger: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Trigger>, 'icon'>) => import("react").JSX.Element;
-declare const Content: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Content>, 'classNames'>) => import("react").JSX.Element;
-declare const Item: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Item>, 'indicator'>) => import("react").JSX.Element;
-declare const Label: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Label>) => import("react").JSX.Element;
-declare const Separator: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Separator>) => import("react").JSX.Element;
+declare const Root: typeof Nude.Root;
+declare const Group: typeof Nude.Group;
+declare const Value: typeof Nude.Value;
+declare const Trigger: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Trigger>, "icon">) => JSX.Element;
+declare const Content: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Content>, "classNames">) => JSX.Element;
+declare const Item: ({ className, ...props }: Omit<ComponentPropsWithRef<typeof Nude.Item>, "indicator">) => JSX.Element;
+declare const Label: Styled<typeof Nude.Label>;
+declare const Separator: Styled<typeof Nude.Separator>;
 //#endregion
 export { Content, Group, Item, Label, Root, Separator, Trigger, Value };

package/dist/select.d.ts

@@ -1,11 +1,11 @@
-import { Content, Item, Label, Separator, Trigger } from "./select-parts.js";
+import { Content, Group, Item, Label, Root, Separator, Trigger, Value } from "./select-parts.js";
 //#region src/select.d.ts
 declare const Select: {
-  Root: any;
+  Root: typeof Root;
   Trigger: typeof Trigger;
-  Value: any;
+  Value: typeof Value;
   Content: typeof Content;
-  Group: any;
+  Group: typeof Group;
   Label: typeof Label;
   Item: typeof Item;
   Separator: typeof Separator;

package/dist/sheet-parts.d.ts

@@ -1,33 +1,12 @@
 import { Actions, Body } from "./lib/modal-parts.js";
-import { VariantProps } from "./lib/tv.js";
 import { Close, Description, Root, Title, Trigger } from "./dialog-parts.js";
-import { ComponentPropsWithRef } from "react";
+import { ComponentPropsWithRef, JSX } from "react";
 import * as Nude from "@journ/nude/sheet-parts";
 //#region src/sheet-parts.d.ts
 type Side = Nude.SheetSide;
-declare const sheetContent: import("tailwind-variants").TVReturnType<{
-  side: {
-    right: "inset-y-0 right-0 w-full max-w-lg md:inset-y-4 md:right-4";
-    left: "inset-y-0 left-0 w-full max-w-lg md:inset-y-4 md:left-4";
-    top: "inset-x-0 top-0 max-h-[85dvh] md:inset-x-4 md:top-4";
-    bottom: "inset-x-0 bottom-0 max-h-[85dvh] md:inset-x-4 md:bottom-4";
-  };
-}, undefined, string[], {
-  side: {
-    right: "inset-y-0 right-0 w-full max-w-lg md:inset-y-4 md:right-4";
-    left: "inset-y-0 left-0 w-full max-w-lg md:inset-y-4 md:left-4";
-    top: "inset-x-0 top-0 max-h-[85dvh] md:inset-x-4 md:top-4";
-    bottom: "inset-x-0 bottom-0 max-h-[85dvh] md:inset-x-4 md:bottom-4";
-  };
-}, undefined, import("tailwind-variants").TVReturnTypeLike<{
-  side: {
-    right: "inset-y-0 right-0 w-full max-w-lg md:inset-y-4 md:right-4";
-    left: "inset-y-0 left-0 w-full max-w-lg md:inset-y-4 md:left-4";
-    top: "inset-x-0 top-0 max-h-[85dvh] md:inset-x-4 md:top-4";
-    bottom: "inset-x-0 bottom-0 max-h-[85dvh] md:inset-x-4 md:bottom-4";
-  };
-}, undefined>>;
-type ContentProps = Omit<ComponentPropsWithRef<typeof Nude.Content>, 'classNames' | 'overlayRef' | 'side'> & VariantProps<typeof sheetContent>;
-declare const Content: ({ side, className, ...props }: ContentProps) => import("react").JSX.Element;
+type ContentProps = Omit<ComponentPropsWithRef<typeof Nude.Content>, "classNames" | "overlayRef" | "side"> & {
+  side?: Side;
+};
+declare const Content: ({ side, className, ...props }: ContentProps) => JSX.Element;
 //#endregion
 export { Actions, Body, Close, Content, Description, Root, type ContentProps as SheetContentProps, type Side as SheetSide, Title, Trigger };

package/dist/sheet.d.ts

@@ -1,11 +1,11 @@
 import { Actions, Body } from "./lib/modal-parts.js";
-import { Description, Title } from "./dialog-parts.js";
+import { Close, Description, Root, Title, Trigger } from "./dialog-parts.js";
 import { Content, SheetContentProps as ContentProps, SheetSide as Side } from "./sheet-parts.js";
 //#region src/sheet.d.ts
 declare const Sheet: {
-  Root: any;
-  Trigger: any;
-  Close: any;
+  Root: typeof Root;
+  Trigger: typeof Trigger;
+  Close: typeof Close;
   Content: typeof Content;
   Title: typeof Title;
   Description: typeof Description;

package/dist/sidebar.d.ts

@@ -1,14 +1,14 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "@journ/nude/styled";
 //#region src/sidebar.d.ts
-declare const Layout: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
-declare const Content: ({ className, ...props }: ComponentPropsWithRef<'main'>) => import("react").JSX.Element;
-declare const Root: ({ className, ...props }: ComponentPropsWithRef<'aside'>) => import("react").JSX.Element;
-declare const Header: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
-declare const Body: ({ className, ...props }: ComponentPropsWithRef<'nav'>) => import("react").JSX.Element;
-declare const Section: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
-declare const Heading: ({ className, ...props }: ComponentPropsWithRef<'h3'>) => import("react").JSX.Element;
-declare const Item: ({ className, children, ...props }: ComponentPropsWithRef<'a'>) => import("react").JSX.Element;
-declare const Footer: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
+declare const Layout: Styled<"div">;
+declare const Content: Styled<"main">;
+declare const Root: Styled<"aside">;
+declare const Header: Styled<"div">;
+declare const Body: Styled<"nav">;
+declare const Section: Styled<"div">;
+declare const Heading: Styled<"h3">;
+declare const Item: Styled<"a">;
+declare const Footer: Styled<"div">;
 declare const Sidebar: {
   Layout: typeof Layout;
   Root: typeof Root;

package/dist/skeleton.d.ts

@@ -1,5 +1,5 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "@journ/nude/styled";
 //#region src/skeleton.d.ts
-declare const Skeleton: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
+declare const Skeleton: Styled<"div">;
 //#endregion
 export { Skeleton };

package/dist/slider-parts.d.ts

@@ -1,9 +1,9 @@
-import { ComponentPropsWithRef } from "react";
 import * as Nude from "@journ/nude/slider-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/slider-parts.d.ts
-declare const Root: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Root>) => import("react").JSX.Element;
-declare const Track: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Track>) => import("react").JSX.Element;
-declare const Range: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Range>) => import("react").JSX.Element;
-declare const Thumb: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Thumb>) => import("react").JSX.Element;
+declare const Root: Styled<typeof Nude.Root>;
+declare const Track: Styled<typeof Nude.Track>;
+declare const Range: Styled<typeof Nude.Range>;
+declare const Thumb: Styled<typeof Nude.Thumb>;
 //#endregion
 export { Range, Root, Thumb, Track };

package/dist/spinner.d.ts

@@ -1,5 +1,5 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "@journ/nude/styled";
 //#region src/spinner.d.ts
-declare const Spinner: ({ className, ...props }: ComponentPropsWithRef<'svg'>) => import("react").JSX.Element;
+declare const Spinner: Styled<"svg">;
 //#endregion
 export { Spinner };

package/dist/stack-parts.d.ts

@@ -1,39 +1,14 @@
-import { VariantProps } from "./lib/tv.js";
-import { ComponentPropsWithRef } from "react";
+import { SurfaceTone } from "./lib/tones.js";
+import { JSX } from "react";
 import * as Nude from "@journ/nude/stack-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/stack-parts.d.ts
-declare const Root: ({ className, ...props }: Nude.RootProps) => import("react").JSX.Element;
-declare const stackItem: import("tailwind-variants").TVReturnType<{
-  tone: {
-    readonly surface: "bg-bloom-surface dark:bg-bloom-surface-dark font-bloom-display text-bloom-foreground dark:text-bloom-foreground-dark border border-bloom-line dark:border-bloom-line-dark";
-    readonly coral: string;
-    readonly yellow: string;
-    readonly indigo: string;
-    readonly mint: string;
-    readonly sky: string;
-  };
-}, undefined, "rounded-bloom relative -mt-6 flex flex-col gap-3 p-5 pb-9 data-[active=true]:pb-5", {
-  tone: {
-    readonly surface: "bg-bloom-surface dark:bg-bloom-surface-dark font-bloom-display text-bloom-foreground dark:text-bloom-foreground-dark border border-bloom-line dark:border-bloom-line-dark";
-    readonly coral: string;
-    readonly yellow: string;
-    readonly indigo: string;
-    readonly mint: string;
-    readonly sky: string;
-  };
-}, undefined, import("tailwind-variants").TVReturnTypeLike<{
-  tone: {
-    readonly surface: "bg-bloom-surface dark:bg-bloom-surface-dark font-bloom-display text-bloom-foreground dark:text-bloom-foreground-dark border border-bloom-line dark:border-bloom-line-dark";
-    readonly coral: string;
-    readonly yellow: string;
-    readonly indigo: string;
-    readonly mint: string;
-    readonly sky: string;
-  };
-}, undefined>>;
-type ItemProps = Nude.ItemProps & VariantProps<typeof stackItem>;
-declare const Item: ({ tone, className, ...props }: ItemProps) => import("react").JSX.Element;
-declare const Trigger: ({ className, ...props }: ComponentPropsWithRef<'button'>) => import("react").JSX.Element;
-declare const Content: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
+declare const Root: ({ className, ...props }: Nude.RootProps) => JSX.Element;
+type ItemProps = Nude.ItemProps & {
+  tone?: SurfaceTone;
+};
+declare const Item: ({ tone, className, ...props }: ItemProps) => JSX.Element;
+declare const Trigger: Styled<"button">;
+declare const Content: Styled<"div">;
 //#endregion
 export { Content, Item, Root, Trigger };

package/dist/stat.d.ts

@@ -1,9 +1,9 @@
-import { ComponentPropsWithRef } from "react";
+import { Styled } from "@journ/nude/styled";
 //#region src/stat.d.ts
-declare const Root: ({ className, ...props }: ComponentPropsWithRef<'div'>) => import("react").JSX.Element;
-declare const Label: ({ className, ...props }: ComponentPropsWithRef<'p'>) => import("react").JSX.Element;
-declare const Value: ({ className, ...props }: ComponentPropsWithRef<'p'>) => import("react").JSX.Element;
-declare const Hint: ({ className, ...props }: ComponentPropsWithRef<'p'>) => import("react").JSX.Element;
+declare const Root: Styled<"div">;
+declare const Label: Styled<"p">;
+declare const Value: Styled<"p">;
+declare const Hint: Styled<"p">;
 declare const Stat: {
   Root: typeof Root;
   Label: typeof Label;

package/dist/step-button.d.ts

@@ -1,10 +1,12 @@
 import { IconButtonProps } from "./icon-button.js";
 import { LucideIcon } from "lucide-react";
+import { JSX } from "react";
 //#region src/step-button.d.ts
-type StepButtonStyle = Pick<IconButtonProps, 'tone' | 'size' | 'className' | 'children'>;
-declare const stepButton: (Icon: LucideIcon, { tone, size, className, children }: StepButtonStyle) => {
+type StepButtonStyle = Pick<IconButtonProps, "tone" | "size" | "className" | "children">;
+type StepButtonProps = {
   className: string;
-  children: import("react").JSX.Element;
+  children: JSX.Element;
 };
+declare const stepButton: (Icon: LucideIcon, { tone, size, className, children }: StepButtonStyle) => StepButtonProps;
 //#endregion
 export { stepButton };

package/dist/stepper-parts.d.ts

@@ -1,10 +1,10 @@
-import { ComponentPropsWithRef } from "react";
 import * as Nude from "@journ/nude/stepper-parts";
+import { Styled } from "@journ/nude/styled";
 //#region src/stepper-parts.d.ts
-declare const Root: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Root>) => import("react").JSX.Element;
-declare const Item: ({ className, ...props }: ComponentPropsWithRef<typeof Nude.Item>) => import("react").JSX.Element;
-declare const Indicator: ({ className, children, ...props }: ComponentPropsWithRef<'span'>) => import("react").JSX.Element;
-declare const Label: ({ className, ...props }: ComponentPropsWithRef<'span'>) => import("react").JSX.Element;
-declare const Description: ({ className, ...props }: ComponentPropsWithRef<'span'>) => import("react").JSX.Element;
+declare const Root: Styled<typeof Nude.Root>;
+declare const Item: Styled<typeof Nude.Item>;
+declare const Indicator: Styled<"span">;
+declare const Label: Styled<"span">;
+declare const Description: Styled<"span">;
 //#endregion
 export { Description, Indicator, Item, Label, Root };