@pixpilot/shadcn-ui 0.31.1 → 0.33.0

package/dist/index.cjs

@@ -59,6 +59,7 @@ const require_ThemeModeSwitchOutside = require('./theme-toggle/ThemeModeSwitchOu
 const require_ThemeModeToggleButton = require('./theme-toggle/ThemeModeToggleButton.cjs');
 require('./theme-toggle/index.cjs');
 const require_toast = require('./toast/toast.cjs');
+const require_ToastProvider = require('./toast/ToastProvider.cjs');
 require('./toast/index.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
@@ -107,6 +108,7 @@ exports.ThemeModeSwitchInside = require_ThemeModeSwitchInside.ThemeModeSwitchIns
 exports.ThemeModeSwitchOutside = require_ThemeModeSwitchOutside.ThemeModeSwitchOutside;
 exports.ThemeModeToggleButton = require_ThemeModeToggleButton.ThemeModeToggleButton;
 exports.ThemeProvider = require_ThemeProvider.ThemeProvider;
+exports.Toaster = require_ToastProvider.Toaster;
 exports.cn = __pixpilot_shadcn.cn;
 exports.showConfirmDialog = require_confirmation_dialogs.showConfirmDialog;
 exports.toast = require_toast.toast;

package/dist/index.d.cts

@@ -40,7 +40,7 @@ import "./layout/index.cjs";
 import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.cjs";
 import { Pagination, PaginationProps } from "./pagination/Pagination.cjs";
 import "./pagination/index.cjs";
-import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./rich-text-editor/RichTextEditor.cjs";
+import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption } from "./rich-text-editor/RichTextEditor.cjs";
 import "./rich-text-editor/index.cjs";
 import { ScaledPreview, ScaledPreviewProps, ScaledPreviewSize } from "./ScaledPreview.cjs";
 import { Select, SelectOption } from "./Select.cjs";
@@ -64,6 +64,7 @@ import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-tog
 import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.cjs";
 import "./theme-toggle/index.cjs";
 import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.cjs";
+import { Toaster } from "./toast/ToastProvider.cjs";
 import "./toast/index.cjs";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.d.ts

@@ -42,7 +42,7 @@ import "./layout/index.js";
 import { LoaderProps, LoadingOverlay } from "./LoadingOverlay.js";
 import { Pagination, PaginationProps } from "./pagination/Pagination.js";
 import "./pagination/index.js";
-import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./rich-text-editor/RichTextEditor.js";
+import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption } from "./rich-text-editor/RichTextEditor.js";
 import "./rich-text-editor/index.js";
 import { ScaledPreview, ScaledPreviewProps, ScaledPreviewSize } from "./ScaledPreview.js";
 import { Select, SelectOption } from "./Select.js";
@@ -66,6 +66,7 @@ import { ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps } from "./theme-tog
 import { ThemeModeToggleButton, ThemeModeToggleButtonProps } from "./theme-toggle/ThemeModeToggleButton.js";
 import "./theme-toggle/index.js";
 import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
+import { Toaster } from "./toast/ToastProvider.js";
 import "./toast/index.js";
 import { cn } from "@pixpilot/shadcn";
-export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AlertBaseProps, AlertProps, AlertVariant, AvatarUpload, AvatarUploadProps, BaseTabsTriggerProps, Button, ButtonLoaderProps, ButtonProps, CircleLoader, CircleLoaderProps, CloseButtonAbsolute, CloseButtonRounded, CloseButtonRoundedProps, ColorPicker, ColorPickerBase, ColorPickerBaseProps, ColorPickerBaseSection, ColorPickerProps, ColorSelect, ColorSelectOption, BaseColorSelectProps as ColorSelectProps, Combobox, ConfirmationDialogProps, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DatePickerProps, DialogProvider, DialogProviderProps, type FileMetadata, FileUpload, FileUploadBaseProps, FileUploadInline, FileUploadInlineBaseProps, FileUploadInlineProps, type FileUploadProgressCallBacks, type FileUploadProps, IconPicker, IconPickerProps, IconPickerVariant, IconProvider, IconProviderLoader, IconProviderProps, Input, InputProps, Layout, LayoutFooter, LayoutFooterProps, LayoutHeader, LayoutHeaderProps, LayoutMain, LayoutMainProps, LayoutProps, LoaderProps, LoadingOverlay, MultiFileUploadProps, OnChangeMultipleFiles, OnChangeSingleFile, Pagination, PaginationProps, PopoverCloseButtonProps, PresetColor, RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ScaledPreview, ScaledPreviewProps, ScaledPreviewSize, Select, SelectOption, SingleFileUploadProps, Slider, SliderInput, SliderInputProps, SliderProps, SliderSelect, SliderSelectOption, SliderSelectProps, SliderSelectValue, Tabs, TabsContent, TabsContext, TabsContextValue, TabsList, TabsListProps, TabsTrigger, TabsTriggerProps, TabsVariant, TagsInput, TagsInputProps, ThemeModeDropdown, ThemeModeDropdownProps, ThemeModeSwitchInside, ThemeModeSwitchInsideProps, ThemeModeSwitchInsideSize, ThemeModeSwitchOutside, ThemeModeSwitchOutsideProps, ThemeModeToggleButton, ThemeModeToggleButtonProps, ThemeProvider, ThemeProviderProps, ToastMessage, Toaster, ToolbarOption, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/index.js

@@ -60,7 +60,8 @@ import { ThemeModeSwitchOutside } from "./theme-toggle/ThemeModeSwitchOutside.js
 import { ThemeModeToggleButton } from "./theme-toggle/ThemeModeToggleButton.js";
 import "./theme-toggle/index.js";
 import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast/toast.js";
+import { Toaster } from "./toast/ToastProvider.js";
 import "./toast/index.js";
 import { cn } from "@pixpilot/shadcn";
 
-export { AbsoluteFill, Alert, AvatarUpload, Button, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };
+export { AbsoluteFill, Alert, AvatarUpload, Button, CircleLoader, CloseButtonAbsolute, CloseButtonRounded, ColorPicker, ColorPickerBase, ColorSelect, Combobox, ContentCard, DEFAULT_ALERT_DURATION, DatePicker, DialogProvider, FileUpload, FileUploadInline, IconPicker, Input, Layout, LayoutFooter, LayoutHeader, LayoutMain, LoadingOverlay, Pagination, RichTextEditor, ScaledPreview, Select, Slider, SliderInput, SliderSelect, Tabs, TabsContent, TabsContext, TabsList, TabsTrigger, TagsInput, ThemeModeDropdown, ThemeModeSwitchInside, ThemeModeSwitchOutside, ThemeModeToggleButton, ThemeProvider, Toaster, cn, showConfirmDialog, toast, toastError, toastInfo, toastSuccess, toastWarning, useMediaQuery, useSelectKeyboard, useTabsContext, useTheme };

package/dist/rich-text-editor/RichTextEditor.cjs

@@ -1,5 +1,6 @@
 const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
 const require_predefined_toolbar_options = require('./predefined-toolbar-options.cjs');
+const require_ToolbarButton = require('./ToolbarButton.cjs');
 let __pixpilot_shadcn = require("@pixpilot/shadcn");
 __pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
 let react = require("react");
@@ -12,21 +13,6 @@ let __tiptap_starter_kit = require("@tiptap/starter-kit");
 __tiptap_starter_kit = require_rolldown_runtime.__toESM(__tiptap_starter_kit);
 
 //#region src/rich-text-editor/RichTextEditor.tsx
-const ToolbarButton = ({ onClick, isActive, disabled, children, tooltip }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipTrigger, {
-	asChild: true,
-	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Button, {
-		type: "button",
-		variant: isActive ? "default" : "ghost",
-		size: "sm",
-		onMouseDown: (event) => {
-			event.preventDefault();
-		},
-		onClick,
-		disabled,
-		className: "h-8 w-8 p-0",
-		children
-	})
-}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipContent, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: tooltip }) })] });
 const defaultExtensions = [];
 const defaultToolbarOptions = [
 	"bold",
@@ -45,9 +31,9 @@ const defaultToolbarOptions = [
 	"blockquote",
 	"codeBlock"
 ];
-const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, editable = true, className, contentClassName, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps }) => {
+const RichTextEditor = ({ value, onChange, extensions = defaultExtensions, editable = true, slots, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps, immediatelyRender = false }) => {
 	const [, forceRender] = react.default.useReducer((x) => x + 1, 0);
-	const defaultEditorProps = { attributes: { class: (0, __pixpilot_shadcn.cn)("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:my-2", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:my-2", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:my-2", "[&_p]:my-2", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:my-2", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:my-2", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:my-2 [&_blockquote]:italic", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono", contentClassName) } };
+	const defaultEditorProps = { attributes: { class: (0, __pixpilot_shadcn.cn)("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:mt-8 [&_h1]:mb-4 [&_h1:first-child]:mt-0", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:mt-6 [&_h2]:mb-3 [&_h2:first-child]:mt-0", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:mt-4 [&_h3]:mb-2 [&_h3:first-child]:mt-0", "[&_p]:mb-3", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:mb-3", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:mb-3", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:mb-4 [&_blockquote]:italic [&_blockquote:first-child]:mt-0", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono [&_pre]:mb-4", "[&_*:last-child]:mb-0", slots?.content?.className) } };
 	const mergedEditorProps = {
 		...defaultEditorProps,
 		...customEditorProps,
@@ -59,11 +45,12 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 	};
 	const editorInstance = (0, __tiptap_react.useEditor)({
 		extensions: [__tiptap_starter_kit.default].concat(extensions),
-		content,
+		content: value,
 		editable,
 		onUpdate: ({ editor: updatedEditor }) => {
 			onChange?.(updatedEditor.getHTML());
 		},
+		immediatelyRender,
 		editorProps: mergedEditorProps
 	});
 	react.default.useEffect(() => {
@@ -83,9 +70,9 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 		};
 	}, [editorInstance]);
 	if (editorInstance == null) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", className),
-		children: [showToolbar && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex flex-wrap items-center gap-1 border-b p-2 h-10" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "min-h-[200px] p-4 text-sm leading-relaxed",
+		className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", slots?.root?.className),
+		children: [showToolbar && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, __pixpilot_shadcn.cn)("flex flex-wrap items-center gap-1 border-b p-2 h-10", slots?.toolbar?.className) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: (0, __pixpilot_shadcn.cn)("min-h-[200px] p-4 text-sm leading-relaxed", slots?.content?.className),
 			children: "Loading editor..."
 		})]
 	});
@@ -97,32 +84,40 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 	const renderToolbar = () => {
 		if (!showToolbar) return null;
 		const isEditorFocused = editorInstance.isFocused;
+		let separatorCount = 0;
+		let customCount = 0;
 		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: "flex flex-wrap items-center gap-1 border-b p-2",
-			children: toolbarOptions.map((option, index) => {
-				if (option === "|") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mx-1 h-6 w-px bg-border" }, `separator-${index}`);
+			className: (0, __pixpilot_shadcn.cn)("flex flex-wrap items-center gap-1 border-b p-2", slots?.toolbar?.className),
+			children: toolbarOptions.map((option) => {
+				if (option === "|") {
+					separatorCount += 1;
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, __pixpilot_shadcn.cn)("mx-1 h-6 w-px bg-border", slots?.toolbar?.separator?.className) }, `separator-${separatorCount}`);
+				}
 				if (typeof option === "string") {
 					const predefinedOption = require_predefined_toolbar_options.predefinedToolbarOptions[option];
 					if (!predefinedOption) return null;
-					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
+					return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToolbarButton.ToolbarButton, {
 						onClick: () => handleCommand(() => predefinedOption.onClick(editorInstance)),
 						isActive: isEditorFocused && (predefinedOption.isActive?.(editorInstance) ?? false),
 						tooltip: predefinedOption.tooltip,
+						className: slots?.toolbar?.button?.className,
 						children: predefinedOption.icon
 					}, option);
 				}
 				const customOption = option;
-				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
+				customCount += 1;
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ToolbarButton.ToolbarButton, {
 					onClick: () => handleCommand(() => customOption.onClick(editorInstance)),
 					isActive: isEditorFocused && (customOption.isActive?.(editorInstance) ?? false),
 					tooltip: customOption.tooltip,
+					className: slots?.toolbar?.button?.className,
 					children: customOption.icon
-				}, `custom-${index}-${customOption.tooltip}`);
+				}, `custom-${customCount}-${customOption.tooltip}`);
 			})
 		});
 	};
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", className),
+		className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", slots?.root?.className),
 		children: [renderToolbar(), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tiptap_react.EditorContent, { editor: editorInstance })]
 	});
 };

package/dist/rich-text-editor/RichTextEditor.d.cts

@@ -1,5 +1,6 @@
 import React from "react";
 import { Editor, Extension } from "@tiptap/core";
+import { UseEditorOptions } from "@tiptap/react";
 
 //#region src/rich-text-editor/RichTextEditor.d.ts
 type EditorProps = Editor['options']['editorProps'];
@@ -9,11 +10,29 @@ type ToolbarOption = string | '|' | {
   onClick: (editor: any) => void;
   isActive?: (editor: any) => boolean;
 };
+interface RichTextEditorSlots {
+  root?: {
+    className?: string;
+  };
+  toolbar?: {
+    className?: string;
+    button?: {
+      className?: string;
+    };
+    separator?: {
+      className?: string;
+    };
+  };
+  content?: {
+    className?: string;
+  };
+}
 interface RichTextEditorProps {
   /**
-   * The initial content of the editor
+   * The HTML value of the editor.
+   * TipTap uses `content` internally, but this component follows React input conventions.
    */
-  content?: string;
+  value?: string;
   /**
    * Callback when the content changes
    */
@@ -28,13 +47,15 @@ interface RichTextEditorProps {
    */
   editable?: boolean;
   /**
-   * Custom class name for the editor container
-   */
-  className?: string;
-  /**
-   * Custom class name for the editor content
+   * Slots for styling different parts of the editor.
+   *
+   * - `slots.root.className`: outer container
+   * - `slots.toolbar.className`: toolbar wrapper
+   * - `slots.toolbar.button.className`: each toolbar button
+   * - `slots.toolbar.separator.className`: separators (`|`)
+   * - `slots.content.className`: editor content area (merged into TipTap `editorProps.attributes.class`)
    */
-  contentClassName?: string;
+  slots?: RichTextEditorSlots;
   /**
    * Whether to show the toolbar
    * @default true
@@ -49,7 +70,13 @@ interface RichTextEditorProps {
    * Custom editor props to pass to the editor
    */
   editorProps?: EditorProps;
+  /**
+   * If true, the editor will render immediately on mount.
+   * This can help with SSR or hydration issues in some cases.
+   * @default false
+   */
+  immediatelyRender?: UseEditorOptions['immediatelyRender'];
 }
 declare const RichTextEditor: React.FC<RichTextEditorProps>;
 //#endregion
-export { RichTextEditor, RichTextEditorProps, ToolbarOption };
+export { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption };

package/dist/rich-text-editor/RichTextEditor.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { UseEditorOptions } from "@tiptap/react";
 import { Editor, Extension } from "@tiptap/core";
 
 //#region src/rich-text-editor/RichTextEditor.d.ts
@@ -9,11 +10,29 @@ type ToolbarOption = string | '|' | {
   onClick: (editor: any) => void;
   isActive?: (editor: any) => boolean;
 };
+interface RichTextEditorSlots {
+  root?: {
+    className?: string;
+  };
+  toolbar?: {
+    className?: string;
+    button?: {
+      className?: string;
+    };
+    separator?: {
+      className?: string;
+    };
+  };
+  content?: {
+    className?: string;
+  };
+}
 interface RichTextEditorProps {
   /**
-   * The initial content of the editor
+   * The HTML value of the editor.
+   * TipTap uses `content` internally, but this component follows React input conventions.
    */
-  content?: string;
+  value?: string;
   /**
    * Callback when the content changes
    */
@@ -28,13 +47,15 @@ interface RichTextEditorProps {
    */
   editable?: boolean;
   /**
-   * Custom class name for the editor container
-   */
-  className?: string;
-  /**
-   * Custom class name for the editor content
+   * Slots for styling different parts of the editor.
+   *
+   * - `slots.root.className`: outer container
+   * - `slots.toolbar.className`: toolbar wrapper
+   * - `slots.toolbar.button.className`: each toolbar button
+   * - `slots.toolbar.separator.className`: separators (`|`)
+   * - `slots.content.className`: editor content area (merged into TipTap `editorProps.attributes.class`)
    */
-  contentClassName?: string;
+  slots?: RichTextEditorSlots;
   /**
    * Whether to show the toolbar
    * @default true
@@ -49,7 +70,13 @@ interface RichTextEditorProps {
    * Custom editor props to pass to the editor
    */
   editorProps?: EditorProps;
+  /**
+   * If true, the editor will render immediately on mount.
+   * This can help with SSR or hydration issues in some cases.
+   * @default false
+   */
+  immediatelyRender?: UseEditorOptions['immediatelyRender'];
 }
 declare const RichTextEditor: React.FC<RichTextEditorProps>;
 //#endregion
-export { RichTextEditor, RichTextEditorProps, ToolbarOption };
+export { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption };

package/dist/rich-text-editor/RichTextEditor.js

@@ -1,26 +1,12 @@
 import { predefinedToolbarOptions } from "./predefined-toolbar-options.js";
-import { Button, Tooltip, TooltipContent, TooltipTrigger, cn } from "@pixpilot/shadcn";
+import { ToolbarButton } from "./ToolbarButton.js";
+import { cn } from "@pixpilot/shadcn";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { EditorContent, useEditor } from "@tiptap/react";
 import StarterKit from "@tiptap/starter-kit";
 
 //#region src/rich-text-editor/RichTextEditor.tsx
-const ToolbarButton = ({ onClick, isActive, disabled, children, tooltip }) => /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
-	asChild: true,
-	children: /* @__PURE__ */ jsx(Button, {
-		type: "button",
-		variant: isActive ? "default" : "ghost",
-		size: "sm",
-		onMouseDown: (event) => {
-			event.preventDefault();
-		},
-		onClick,
-		disabled,
-		className: "h-8 w-8 p-0",
-		children
-	})
-}), /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: tooltip }) })] });
 const defaultExtensions = [];
 const defaultToolbarOptions = [
 	"bold",
@@ -39,9 +25,9 @@ const defaultToolbarOptions = [
 	"blockquote",
 	"codeBlock"
 ];
-const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, editable = true, className, contentClassName, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps }) => {
+const RichTextEditor = ({ value, onChange, extensions = defaultExtensions, editable = true, slots, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps, immediatelyRender = false }) => {
 	const [, forceRender] = React.useReducer((x) => x + 1, 0);
-	const defaultEditorProps = { attributes: { class: cn("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:my-2", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:my-2", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:my-2", "[&_p]:my-2", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:my-2", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:my-2", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:my-2 [&_blockquote]:italic", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono", contentClassName) } };
+	const defaultEditorProps = { attributes: { class: cn("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:mt-8 [&_h1]:mb-4 [&_h1:first-child]:mt-0", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:mt-6 [&_h2]:mb-3 [&_h2:first-child]:mt-0", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:mt-4 [&_h3]:mb-2 [&_h3:first-child]:mt-0", "[&_p]:mb-3", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:mb-3", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:mb-3", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:mb-4 [&_blockquote]:italic [&_blockquote:first-child]:mt-0", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono [&_pre]:mb-4", "[&_*:last-child]:mb-0", slots?.content?.className) } };
 	const mergedEditorProps = {
 		...defaultEditorProps,
 		...customEditorProps,
@@ -53,11 +39,12 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 	};
 	const editorInstance = useEditor({
 		extensions: [StarterKit].concat(extensions),
-		content,
+		content: value,
 		editable,
 		onUpdate: ({ editor: updatedEditor }) => {
 			onChange?.(updatedEditor.getHTML());
 		},
+		immediatelyRender,
 		editorProps: mergedEditorProps
 	});
 	React.useEffect(() => {
@@ -77,9 +64,9 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 		};
 	}, [editorInstance]);
 	if (editorInstance == null) return /* @__PURE__ */ jsxs("div", {
-		className: cn("border rounded-md bg-background", className),
-		children: [showToolbar && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-1 border-b p-2 h-10" }), /* @__PURE__ */ jsx("div", {
-			className: "min-h-[200px] p-4 text-sm leading-relaxed",
+		className: cn("border rounded-md bg-background", slots?.root?.className),
+		children: [showToolbar && /* @__PURE__ */ jsx("div", { className: cn("flex flex-wrap items-center gap-1 border-b p-2 h-10", slots?.toolbar?.className) }), /* @__PURE__ */ jsx("div", {
+			className: cn("min-h-[200px] p-4 text-sm leading-relaxed", slots?.content?.className),
 			children: "Loading editor..."
 		})]
 	});
@@ -91,10 +78,15 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 	const renderToolbar = () => {
 		if (!showToolbar) return null;
 		const isEditorFocused = editorInstance.isFocused;
+		let separatorCount = 0;
+		let customCount = 0;
 		return /* @__PURE__ */ jsx("div", {
-			className: "flex flex-wrap items-center gap-1 border-b p-2",
-			children: toolbarOptions.map((option, index) => {
-				if (option === "|") return /* @__PURE__ */ jsx("div", { className: "mx-1 h-6 w-px bg-border" }, `separator-${index}`);
+			className: cn("flex flex-wrap items-center gap-1 border-b p-2", slots?.toolbar?.className),
+			children: toolbarOptions.map((option) => {
+				if (option === "|") {
+					separatorCount += 1;
+					return /* @__PURE__ */ jsx("div", { className: cn("mx-1 h-6 w-px bg-border", slots?.toolbar?.separator?.className) }, `separator-${separatorCount}`);
+				}
 				if (typeof option === "string") {
 					const predefinedOption = predefinedToolbarOptions[option];
 					if (!predefinedOption) return null;
@@ -102,21 +94,24 @@ const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, edi
 						onClick: () => handleCommand(() => predefinedOption.onClick(editorInstance)),
 						isActive: isEditorFocused && (predefinedOption.isActive?.(editorInstance) ?? false),
 						tooltip: predefinedOption.tooltip,
+						className: slots?.toolbar?.button?.className,
 						children: predefinedOption.icon
 					}, option);
 				}
 				const customOption = option;
+				customCount += 1;
 				return /* @__PURE__ */ jsx(ToolbarButton, {
 					onClick: () => handleCommand(() => customOption.onClick(editorInstance)),
 					isActive: isEditorFocused && (customOption.isActive?.(editorInstance) ?? false),
 					tooltip: customOption.tooltip,
+					className: slots?.toolbar?.button?.className,
 					children: customOption.icon
-				}, `custom-${index}-${customOption.tooltip}`);
+				}, `custom-${customCount}-${customOption.tooltip}`);
 			})
 		});
 	};
 	return /* @__PURE__ */ jsxs("div", {
-		className: cn("border rounded-md bg-background", className),
+		className: cn("border rounded-md bg-background", slots?.root?.className),
 		children: [renderToolbar(), /* @__PURE__ */ jsx(EditorContent, { editor: editorInstance })]
 	});
 };

package/dist/rich-text-editor/ToolbarButton.cjs

@@ -0,0 +1,50 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let __pixpilot_shadcn = require("@pixpilot/shadcn");
+__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
+let react = require("react");
+react = require_rolldown_runtime.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
+
+//#region src/rich-text-editor/ToolbarButton.tsx
+function isSvgMarkupString(value) {
+	if (typeof value !== "string") return false;
+	const trimmed = value.trim();
+	return trimmed.startsWith("<svg") && trimmed.endsWith("</svg>");
+}
+function svgMarkupToMaskUrl(svgMarkup) {
+	return `url("data:image/svg+xml,${encodeURIComponent(svgMarkup).replace(/'/gu, "%27").replace(/"/gu, "%22")}")`;
+}
+const ToolbarButton = ({ onClick, isActive, disabled, className, children, tooltip }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipTrigger, {
+	asChild: true,
+	children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Button, {
+		type: "button",
+		variant: isActive ? "default" : "ghost",
+		size: "sm",
+		onMouseDown: (event) => {
+			event.preventDefault();
+		},
+		onClick,
+		disabled,
+		className: (0, __pixpilot_shadcn.cn)("h-8 w-8 p-0", className),
+		children: isSvgMarkupString(children) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			"data-slot": "svg-mask",
+			"aria-hidden": "true",
+			className: "inline-block h-4 w-4",
+			style: {
+				backgroundColor: "currentColor",
+				WebkitMaskImage: svgMarkupToMaskUrl(children),
+				maskImage: svgMarkupToMaskUrl(children),
+				WebkitMaskRepeat: "no-repeat",
+				maskRepeat: "no-repeat",
+				WebkitMaskPosition: "center",
+				maskPosition: "center",
+				WebkitMaskSize: "contain",
+				maskSize: "contain"
+			}
+		}) : children
+	})
+}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipContent, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: tooltip }) })] });
+
+//#endregion
+exports.ToolbarButton = ToolbarButton;

package/dist/rich-text-editor/ToolbarButton.js

@@ -0,0 +1,46 @@
+import { Button, Tooltip, TooltipContent, TooltipTrigger, cn } from "@pixpilot/shadcn";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/rich-text-editor/ToolbarButton.tsx
+function isSvgMarkupString(value) {
+	if (typeof value !== "string") return false;
+	const trimmed = value.trim();
+	return trimmed.startsWith("<svg") && trimmed.endsWith("</svg>");
+}
+function svgMarkupToMaskUrl(svgMarkup) {
+	return `url("data:image/svg+xml,${encodeURIComponent(svgMarkup).replace(/'/gu, "%27").replace(/"/gu, "%22")}")`;
+}
+const ToolbarButton = ({ onClick, isActive, disabled, className, children, tooltip }) => /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
+	asChild: true,
+	children: /* @__PURE__ */ jsx(Button, {
+		type: "button",
+		variant: isActive ? "default" : "ghost",
+		size: "sm",
+		onMouseDown: (event) => {
+			event.preventDefault();
+		},
+		onClick,
+		disabled,
+		className: cn("h-8 w-8 p-0", className),
+		children: isSvgMarkupString(children) ? /* @__PURE__ */ jsx("span", {
+			"data-slot": "svg-mask",
+			"aria-hidden": "true",
+			className: "inline-block h-4 w-4",
+			style: {
+				backgroundColor: "currentColor",
+				WebkitMaskImage: svgMarkupToMaskUrl(children),
+				maskImage: svgMarkupToMaskUrl(children),
+				WebkitMaskRepeat: "no-repeat",
+				maskRepeat: "no-repeat",
+				WebkitMaskPosition: "center",
+				maskPosition: "center",
+				WebkitMaskSize: "contain",
+				maskSize: "contain"
+			}
+		}) : children
+	})
+}), /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: tooltip }) })] });
+
+//#endregion
+export { ToolbarButton };

package/dist/rich-text-editor/index.d.cts

@@ -1 +1 @@
-import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./RichTextEditor.cjs";
+import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption } from "./RichTextEditor.cjs";

package/dist/rich-text-editor/index.d.ts

@@ -1 +1 @@
-import { RichTextEditor, RichTextEditorProps, ToolbarOption } from "./RichTextEditor.js";
+import { RichTextEditor, RichTextEditorProps, RichTextEditorSlots, ToolbarOption } from "./RichTextEditor.js";

package/dist/theme-toggle/ThemeModeDropdown.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime9 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeDropdown.d.ts
 interface ThemeModeDropdownProps {
@@ -17,7 +17,7 @@ interface ThemeModeDropdownProps {
  * Provides Light / Dark / System options.
  * Pure component - requires themeValue and onChange props.
  */
-declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime10.JSX.Element;
+declare function ThemeModeDropdown(props: ThemeModeDropdownProps): react_jsx_runtime9.JSX.Element;
 declare namespace ThemeModeDropdown {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchInside.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime11 from "react/jsx-runtime";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -25,7 +25,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime11.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime10.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime12 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -22,7 +22,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime12.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime11.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -13,7 +13,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime9.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime12.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/dist/toast/ToastProvider.cjs

@@ -0,0 +1,9 @@
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+let sonner = require("sonner");
+sonner = require_rolldown_runtime.__toESM(sonner);
+
+//#region src/toast/ToastProvider.tsx
+const Toaster = sonner.Toaster;
+
+//#endregion
+exports.Toaster = Toaster;

package/dist/toast/ToastProvider.d.cts

@@ -0,0 +1,7 @@
+import * as react0 from "react";
+import * as sonner0 from "sonner";
+
+//#region src/toast/ToastProvider.d.ts
+declare const Toaster: react0.ForwardRefExoticComponent<sonner0.ToasterProps & react0.RefAttributes<HTMLElement>>;
+//#endregion
+export { Toaster };

package/dist/toast/ToastProvider.d.ts

@@ -0,0 +1,7 @@
+import * as react0 from "react";
+import * as sonner0 from "sonner";
+
+//#region src/toast/ToastProvider.d.ts
+declare const Toaster$1: react0.ForwardRefExoticComponent<sonner0.ToasterProps & react0.RefAttributes<HTMLElement>>;
+//#endregion
+export { Toaster$1 as Toaster };

package/dist/toast/ToastProvider.js

@@ -0,0 +1,7 @@
+import { Toaster } from "sonner";
+
+//#region src/toast/ToastProvider.tsx
+const Toaster$1 = Toaster;
+
+//#endregion
+export { Toaster$1 as Toaster };

package/dist/toast/index.cjs

@@ -1 +1,2 @@
 const require_toast = require('./toast.cjs');
+const require_ToastProvider = require('./ToastProvider.cjs');

package/dist/toast/index.d.cts

@@ -1 +1,2 @@
-import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.cjs";
+import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.cjs";
+import { Toaster } from "./ToastProvider.cjs";

package/dist/toast/index.d.ts

@@ -1 +1,2 @@
-import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.js";
+import { DEFAULT_ALERT_DURATION, ToastMessage, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.js";
+import { Toaster } from "./ToastProvider.js";

package/dist/toast/index.js

@@ -1 +1,2 @@
 import { DEFAULT_ALERT_DURATION, toast, toastError, toastInfo, toastSuccess, toastWarning } from "./toast.js";
+import { Toaster } from "./ToastProvider.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "0.31.1",
+  "version": "0.33.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",