@choice-ui/react 1.9.9 → 2.0.1

package/dist/components/splitter/dist/index.d.ts

@@ -1 +1 @@
-export { AllotmentProps, Allotment as Splitter, AllotmentHandle as SplitterHandle } from 'allotment';
+export { Allotment as Splitter, AllotmentHandle as SplitterHandle, AllotmentProps as SplitterProps } from 'allotment';

package/dist/components/text-field/dist/index.d.ts

@@ -1,3 +1,4 @@
+import { Description } from '../../description/src';
 import { InputProps } from '../../input/src';
 import { Label } from '../../label/src';
 import { default as react__default, HTMLProps, ReactNode } from 'react';
@@ -10,13 +11,11 @@ interface FieldAddonProps extends HTMLProps<HTMLDivElement> {
 }
 declare const FieldAddon: react.MemoExoticComponent<react.ForwardRefExoticComponent<Omit<FieldAddonProps, "ref"> & react.RefAttributes<HTMLDivElement>>>;
 
-declare const FieldDescription: react.MemoExoticComponent<react.ForwardRefExoticComponent<Omit<HTMLProps<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>>;
-
 interface TextFieldProps extends Omit<InputProps, "children"> {
     children?: ReactNode;
 }
 interface TextFieldComponent extends react__default.ForwardRefExoticComponent<TextFieldProps & react__default.RefAttributes<HTMLInputElement>> {
-    Description: typeof FieldDescription;
+    Description: typeof Description;
     Label: typeof Label;
     Prefix: typeof FieldAddon;
     Suffix: typeof FieldAddon;

package/dist/components/text-field/dist/index.js

@@ -1,6 +1,7 @@
+import { Description } from "../../description/dist/index.js";
 import { Input } from "../../input/dist/index.js";
 import { Label } from "../../label/dist/index.js";
-import { forwardRef, memo, Children, isValidElement, useId, cloneElement } from "react";
+import { forwardRef, Children, isValidElement, useId, cloneElement, memo } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { tcv, tcx } from "../../../shared/utils/tcx/tcx.js";
 var FieldAddon = memo(
@@ -17,17 +18,6 @@ var FieldAddon = memo(
   })
 );
 FieldAddon.displayName = "FieldAddon";
-var FieldDescription = memo(
-  forwardRef(function FieldDescription2(props, ref) {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        ref,
-        ...props
-      }
-    );
-  })
-);
 var TextFieldTv = tcv({
   slots: {
     container: ["flex min-w-0 flex-col items-start gap-2"],
@@ -41,12 +31,7 @@ var TextFieldTv = tcv({
     input: "[grid-area:input]",
     prefix: "[grid-area:prefix]",
     suffix: "[grid-area:suffix]",
-    description: [
-      "text-body-medium mt-1",
-      "px-0.5",
-      "break-words whitespace-pre-wrap",
-      "text-secondary-foreground"
-    ]
+    description: ""
   },
   variants: {
     variant: {
@@ -257,7 +242,7 @@ var TextField = Object.assign(TextFieldBase, {
   Prefix: PrefixComponent,
   Suffix: SuffixComponent,
   Label,
-  Description: FieldDescription
+  Description
 });
 export {
   TextField

package/dist/components/toast/dist/index.d.ts

@@ -0,0 +1,274 @@
+import { ReactNode } from 'react';
+import * as react from 'react';
+
+type ToastType = "info" | "success" | "warning" | "error" | "loading" | "default";
+type ToastVariant = "default" | "accent" | "success" | "warning" | "error" | "assistive" | "reset";
+type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+
+interface ToastAction {
+    label: ReactNode;
+    onClick: () => void;
+}
+interface ToastCancel {
+    label: ReactNode;
+    onClick?: () => void;
+}
+/**
+ * Props for Toaster.Item slot component
+ */
+interface ToasterItemSlotProps {
+    className?: string;
+    style?: React.CSSProperties;
+    children?: ReactNode;
+}
+/**
+ * Slot component for customizing toast item container
+ */
+declare const ToasterItemSlot: react.ForwardRefExoticComponent<ToasterItemSlotProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Props for Toaster.Icon slot component
+ */
+interface ToasterIconSlotProps {
+    className?: string;
+    style?: React.CSSProperties;
+    /** Custom render function - receives type and default icon */
+    children?: (type: ToastType, defaultIcon: ReactNode) => ReactNode;
+}
+/**
+ * Slot component for customizing toast icon
+ */
+declare const ToasterIconSlot: react.ForwardRefExoticComponent<ToasterIconSlotProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Props for Toaster.Title slot component
+ */
+interface ToasterTitleSlotProps {
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Slot component for customizing toast title
+ */
+declare const ToasterTitleSlot: react.ForwardRefExoticComponent<ToasterTitleSlotProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Props for Toaster.Description slot component
+ */
+interface ToasterDescriptionSlotProps {
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Slot component for customizing toast description
+ */
+declare const ToasterDescriptionSlot: react.ForwardRefExoticComponent<ToasterDescriptionSlotProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Props for Toaster.Actions slot component
+ */
+interface ToasterActionsSlotProps {
+    className?: string;
+    style?: React.CSSProperties;
+    /** Custom render function for actions */
+    children?: (action: ToastAction | undefined, cancel: ToastCancel | undefined, close: () => void) => ReactNode;
+}
+/**
+ * Slot component for customizing toast actions
+ */
+declare const ToasterActionsSlot: react.ForwardRefExoticComponent<ToasterActionsSlotProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ToastData {
+    id: string;
+    type: ToastType;
+    variant?: ToastVariant;
+    /**
+     * Title content. Supports:
+     * - Plain string: rendered as text
+     * - HTML string (containing tags like `<b>`, `<strong>`, etc.): rendered as HTML
+     * - ReactNode: rendered as React component
+     */
+    title?: React.ReactNode;
+    /**
+     * Description content. Supports:
+     * - Plain string: rendered as text
+     * - HTML string (containing tags like `<b>`, `<strong>`, etc.): rendered as HTML
+     * - ReactNode: rendered as React component
+     */
+    description?: React.ReactNode;
+    duration?: number;
+    icon?: React.ReactNode;
+    action?: {
+        label: React.ReactNode;
+        onClick: () => void;
+    };
+    cancel?: {
+        label: React.ReactNode;
+        onClick?: () => void;
+    };
+    onClose?: () => void;
+    onAutoClose?: () => void;
+    dismissible?: boolean;
+    /**
+     * Show progress bar for this toast. Overrides Toaster's showProgress setting.
+     * - `true`: Always show progress bar
+     * - `false`: Never show progress bar
+     * - `undefined`: Use Toaster's showProgress setting
+     */
+    progress?: boolean;
+    createdAt: number;
+    height?: number;
+    removing?: boolean;
+    swipeDirection?: "left" | "right" | "up" | "down";
+}
+interface ToastOptions {
+    id?: string;
+    variant?: ToastVariant;
+    /**
+     * Description content. Supports:
+     * - Plain string: rendered as text
+     * - HTML string (containing tags like `<b>`, `<strong>`, etc.): rendered as HTML
+     * - ReactNode: rendered as React component
+     */
+    description?: React.ReactNode;
+    duration?: number;
+    icon?: React.ReactNode;
+    action?: {
+        label: React.ReactNode;
+        onClick: () => void;
+    };
+    cancel?: {
+        label: React.ReactNode;
+        onClick?: () => void;
+    };
+    onClose?: () => void;
+    onAutoClose?: () => void;
+    dismissible?: boolean;
+    /**
+     * Show progress bar for this toast. Overrides Toaster's showProgress setting.
+     * - `true`: Always show progress bar
+     * - `false`: Never show progress bar
+     * - `undefined`: Use Toaster's showProgress setting
+     */
+    progress?: boolean;
+}
+interface PromiseOptions<T> {
+    loading: string | (ToastOptions & {
+        title: string;
+    });
+    success: string | (ToastOptions & {
+        title: string;
+    }) | ((data: T) => string | (ToastOptions & {
+        title: string;
+    }));
+    error: string | (ToastOptions & {
+        title: string;
+    }) | ((err: unknown) => string | (ToastOptions & {
+        title: string;
+    }));
+}
+type ToastFunction = {
+    (title: string, options?: ToastOptions): string;
+    success: (title: string, options?: ToastOptions) => string;
+    error: (title: string, options?: ToastOptions) => string;
+    warning: (title: string, options?: ToastOptions) => string;
+    info: (title: string, options?: ToastOptions) => string;
+    loading: (title: string, options?: ToastOptions) => string;
+    promise: <T>(promise: Promise<T>, options: PromiseOptions<T>) => Promise<T>;
+    dismiss: (id: string) => void;
+    dismissAll: () => void;
+    use: (toasterId: string) => {
+        (title: string, options?: ToastOptions): string;
+        success: (title: string, options?: ToastOptions) => string;
+        error: (title: string, options?: ToastOptions) => string;
+        warning: (title: string, options?: ToastOptions) => string;
+        info: (title: string, options?: ToastOptions) => string;
+        loading: (title: string, options?: ToastOptions) => string;
+        promise: <T>(promise: Promise<T>, options: PromiseOptions<T>) => Promise<T>;
+        dismiss: (id: string) => void;
+        dismissAll: () => void;
+    };
+};
+declare const toast: ToastFunction;
+
+interface ToasterProps {
+    /**
+     * Unique ID for this Toaster instance
+     * Use this to have multiple Toaster instances in the same app
+     * @default "default"
+     */
+    id?: string;
+    /**
+     * Position of the toaster
+     * @default "bottom-right"
+     */
+    position?: ToastPosition;
+    /**
+     * Render toasts into a custom container
+     */
+    container?: HTMLElement | null;
+    /**
+     * Label for accessibility
+     * @default "Notifications"
+     */
+    label?: string;
+    /**
+     * Whether to use a portal for rendering
+     * @default true
+     */
+    portal?: boolean;
+    /**
+     * Offset from viewport edges in pixels
+     * @default 16
+     */
+    offset?: number;
+    /**
+     * Default duration for toasts in ms
+     * @default 5000
+     */
+    duration?: number;
+    /**
+     * Maximum number of visible toasts
+     * @default 3
+     */
+    visibleToasts?: number;
+    /**
+     * Additional class name
+     */
+    className?: string;
+    /**
+     * Children - use Toaster.Item to customize toast rendering
+     */
+    children?: ReactNode;
+    /**
+     * Show countdown progress bar at the bottom of each toast
+     * @default false
+     */
+    showProgress?: boolean;
+    /**
+     * Layout mode for toasts
+     * @default "default"
+     */
+    layout?: "default" | "compact";
+}
+interface ToasterComponent extends React.MemoExoticComponent<React.ForwardRefExoticComponent<ToasterProps & React.RefAttributes<HTMLDivElement>>> {
+    Item: typeof ToasterItemSlot;
+    Icon: typeof ToasterIconSlot;
+    Title: typeof ToasterTitleSlot;
+    Description: typeof ToasterDescriptionSlot;
+    Actions: typeof ToasterActionsSlot;
+}
+/**
+ * Toaster component with compound pattern
+ *
+ * @example
+ * ```tsx
+ * <Toaster id="my-toaster">
+ *   <Toaster.Item className="custom-class">
+ *     <Toaster.Icon>{(type, defaultIcon) => <CustomIcon type={type} />}</Toaster.Icon>
+ *     <Toaster.Title className="font-bold uppercase" />
+ *     <Toaster.Description className="text-sm" />
+ *     <Toaster.Actions>{(action, cancel, close) => <CustomActions />}</Toaster.Actions>
+ *   </Toaster.Item>
+ * </Toaster>
+ * ```
+ */
+declare const Toaster: ToasterComponent;
+
+export { type ToastData, type ToastOptions, type ToastPosition, type ToastType, type ToastVariant, Toaster, type ToasterProps, toast };

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@choice-ui/react",
-  "version": "1.9.9",
+  "version": "2.0.1",
   "description": "A desktop-first React UI component library built for professional desktop applications with comprehensive documentation",
   "sideEffects": false,
   "type": "module",
   "source": "./app/index.ts",
   "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
+  "types": "./app/index.ts",
   "files": [
     "dist",
     "README.md",
@@ -14,7 +14,7 @@
   ],
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
+      "types": "./app/index.ts",
       "import": "./dist/index.js"
     },
     "./styles/*": "./dist/styles/*",
@@ -22,10 +22,36 @@
     "./llms.txt": "./dist/llms.txt"
   },
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "types": "./dist/index.d.ts",
+    "main": "./dist/index.js",
+    "exports": {
+      ".": {
+        "types": "./dist/index.d.ts",
+        "import": "./dist/index.js"
+      },
+      "./styles/*": "./dist/styles/*",
+      "./tailwind.css": "./dist/tailwind.css",
+      "./llms.txt": "./dist/llms.txt"
+    }
+  },
+  "scripts": {
+    "build": "pnpm run clean && pnpm --filter @choice-ui/shared build && vite build",
+    "build:watch": "vite build --watch",
+    "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,md}\"",
+    "lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
+    "lint:types": "tsc",
+    "clean": "rimraf dist",
+    "prepublishOnly": "pnpm run build",
+    "plop": "pnpm dlx plop",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage",
+    "madge": "npx madge --circular --extensions ts app/"
   },
   "dependencies": {
     "@choiceform/icons-react": "^1.3.8",
+    "@choice-ui/design-tokens": "workspace:*",
     "classnames": "^2.5.1",
     "tailwind-merge": "^3.3.1",
     "tailwind-variants": "^3.1.0",
@@ -54,13 +80,12 @@
     "use-stick-to-bottom": "^1.0.43",
     "usehooks-ts": "^3.1.0",
     "zod": "^4.0.5",
-    "react-markdown": "^9.0.3",
+    "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1",
     "remark-breaks": "^4.0.0",
     "remark-math": "^6.0.0",
-    "harden-react-markdown": "^1.0.4",
-    "shiki": "^3.9.2",
-    "@choice-ui/design-tokens": "0.2.16"
+    "harden-react-markdown": "^1.1.8",
+    "shiki": "^3.9.2"
   },
   "devDependencies": {
     "@babel/core": "^7.27.1",
@@ -111,18 +136,5 @@
   "peerDependencies": {
     "react": ">=18.0.0",
     "react-dom": ">=18.0.0"
-  },
-  "scripts": {
-    "build": "pnpm run clean && pnpm --filter @choice-ui/shared build && vite build",
-    "build:watch": "vite build --watch",
-    "format": "prettier --write \"**/*.{js,jsx,ts,tsx,json,css,md}\"",
-    "lint": "eslint --ignore-path .gitignore --cache --cache-location ./node_modules/.cache/eslint .",
-    "lint:types": "tsc",
-    "clean": "rimraf dist",
-    "plop": "pnpm dlx plop",
-    "test": "jest",
-    "test:watch": "jest --watch",
-    "test:coverage": "jest --coverage",
-    "madge": "npx madge --circular --extensions ts app/"
   }
 }