@webdevarif/dashui 1.2.0 → 1.2.2

package/dist/index.d.mts

@@ -645,6 +645,29 @@ type ColorPickerFormatProps = HTMLAttributes<HTMLInputElement>;
 declare const ColorPickerFormat: ({ className, ...props }: ColorPickerFormatProps) => react_jsx_runtime.JSX.Element;
 declare const ColorPickerHexOutput: ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
 
+/**
+ * TiptapEditor — Rich text editor with live editing
+ *
+ * Presentation-only. Consumer handles:
+ * - Saving (getJSON() when ready)
+ * - Upload handling
+ * - Validation
+ *
+ * Props:
+ * - value: Record<string, any> | string | null — JSON content from editor.getJSON()
+ * - onChange: (json: Record<string, any>) => void — called on every change
+ * - placeholder?: string — placeholder text
+ * - disabled?: boolean
+ * - className?: string — wrapper classes
+ */
+declare function TiptapEditor({ value, onChange, placeholder, disabled, className, }: {
+    value: Record<string, any> | string | null;
+    onChange: (json: Record<string, any>) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    className?: string;
+}): react_jsx_runtime.JSX.Element | null;
+
 declare function useDisclosure(initial?: boolean): {
     isOpen: boolean;
     open: () => void;
@@ -729,4 +752,4 @@ interface SkeletonProps {
 }
 declare function Skeleton({ width, height, rounded, style }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };
+export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, TiptapEditor, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };

package/dist/index.d.ts

@@ -645,6 +645,29 @@ type ColorPickerFormatProps = HTMLAttributes<HTMLInputElement>;
 declare const ColorPickerFormat: ({ className, ...props }: ColorPickerFormatProps) => react_jsx_runtime.JSX.Element;
 declare const ColorPickerHexOutput: ({ className, ...props }: HTMLAttributes<HTMLDivElement>) => react_jsx_runtime.JSX.Element;
 
+/**
+ * TiptapEditor — Rich text editor with live editing
+ *
+ * Presentation-only. Consumer handles:
+ * - Saving (getJSON() when ready)
+ * - Upload handling
+ * - Validation
+ *
+ * Props:
+ * - value: Record<string, any> | string | null — JSON content from editor.getJSON()
+ * - onChange: (json: Record<string, any>) => void — called on every change
+ * - placeholder?: string — placeholder text
+ * - disabled?: boolean
+ * - className?: string — wrapper classes
+ */
+declare function TiptapEditor({ value, onChange, placeholder, disabled, className, }: {
+    value: Record<string, any> | string | null;
+    onChange: (json: Record<string, any>) => void;
+    placeholder?: string;
+    disabled?: boolean;
+    className?: string;
+}): react_jsx_runtime.JSX.Element | null;
+
 declare function useDisclosure(initial?: boolean): {
     isOpen: boolean;
     open: () => void;
@@ -729,4 +752,4 @@ interface SkeletonProps {
 }
 declare function Skeleton({ width, height, rounded, style }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
-export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };
+export { Alert, type AlertProps, AppShell, type AppShellProps, AuthButton, AuthCard, AuthDivider, AuthField, AuthFootnote, AuthHeader, AuthLogo, AuthShell, Badge, type BadgeProps, type Breadcrumb, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColorPicker, ColorPickerAlpha, ColorPickerEyeDropper, ColorPickerFormat, ColorPickerHexOutput, ColorPickerHue, ColorPickerOutput, ColorPickerSelection, type Column, ConfirmDialog, type ConfirmDialogProps, DEVICES, DEVICE_ICONS, DashboardLayout, type DashboardLayoutProps, DataTable, type DataTableProps, type DeviceKey, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EmptyState, type EmptyStateProps, FormField, type FormFieldProps, FormLayout, type FormLayoutProps, FormSection, type FormSectionProps, HslColorInput, ImagePickerField, Input, type InputProps, Label, LoadingSpinner, type LoadingSpinnerProps, LocalInput, MediaCard, type NavItem, NotificationBell, type NotificationBellProps, Page, type PageProps, PageSection, type PageSectionProps, Pagination, type PaginationProps, PlanBadge, type PlanBadgeProps, type PlanId, Popover, PopoverContent, PopoverTrigger, PostEditorShell, type PostEditorShellProps, PostFiltersBar, type PostFiltersBarProps, type PostListItem, PostListTable, type PostListTableProps, PostSidebarSection, type PostSidebarSectionProps, type PostStatus, PostStatusBadge, type PostStatusBadgeProps, ResponsiveSizeDeviceIcon, ResponsiveSizeField, SearchBar, type SearchBarProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sidebar, type SidebarItem, type SidebarProps, Skeleton, SlugInput, type SlugInputProps, type Stat, Stats, type StatsProps, StorageBar, type StorageBarProps, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, type TextareaProps, ThemeToggle, type ThemeToggleProps, TiptapEditor, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TopBar, type TopBarProps, type UploadProgressItem, UploadProgressPanel, UploadZone, badgeVariants, buttonVariants, cn, useColorPicker, useDisclosure, usePagination };

package/dist/index.js

@@ -138,6 +138,7 @@ __export(index_exports, {
   Textarea: () => Textarea,
   ThemeProvider: () => import_next_themes2.ThemeProvider,
   ThemeToggle: () => ThemeToggle,
+  TiptapEditor: () => TiptapEditor,
   Tooltip: () => Tooltip,
   TooltipContent: () => TooltipContent,
   TooltipProvider: () => TooltipProvider,
@@ -3708,10 +3709,170 @@ function HslColorInput({ value, onChange, className, inputClassName, disabled })
   ] });
 }
 
+// src/components/editors/tiptap-editor.tsx
+var import_react7 = require("@tiptap/react");
+var import_starter_kit = __toESM(require("@tiptap/starter-kit"));
+var import_extension_placeholder = __toESM(require("@tiptap/extension-placeholder"));
+var import_jsx_runtime55 = require("react/jsx-runtime");
+function TiptapEditor({
+  value,
+  onChange,
+  placeholder = "Start writing\u2026",
+  disabled = false,
+  className = ""
+}) {
+  const editor = (0, import_react7.useEditor)({
+    immediatelyRender: false,
+    extensions: [
+      import_starter_kit.default.configure({
+        heading: { levels: [1, 2, 3] }
+      }),
+      import_extension_placeholder.default.configure({ placeholder })
+    ],
+    content: value,
+    editable: !disabled,
+    editorProps: {
+      attributes: {
+        class: "prose prose-sm max-w-none min-h-[400px] p-4 outline-none focus:outline-none bg-white dark:bg-slate-900 text-slate-900 dark:text-white rounded-lg border border-gray-200 dark:border-slate-700"
+      }
+    },
+    onUpdate: ({ editor: editor2 }) => {
+      onChange(editor2.getJSON());
+    }
+  });
+  if (!editor) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: `tiptap-wrapper ${className}`.trim(), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex gap-1 p-2 border-b border-gray-200 dark:border-slate-700 bg-gray-50 dark:bg-slate-800 rounded-t-lg", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleBold().run(),
+          active: editor.isActive("bold"),
+          title: "Bold (Ctrl+B)",
+          children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("strong", { children: "B" })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleItalic().run(),
+          active: editor.isActive("italic"),
+          title: "Italic (Ctrl+I)",
+          children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("em", { children: "I" })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleStrike().run(),
+          active: editor.isActive("strike"),
+          title: "Strikethrough",
+          children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("s", { children: "S" })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "w-px bg-gray-300 dark:bg-slate-600 mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleHeading({ level: 1 }).run(),
+          active: editor.isActive("heading", { level: 1 }),
+          title: "Heading 1",
+          children: "H1"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleHeading({ level: 2 }).run(),
+          active: editor.isActive("heading", { level: 2 }),
+          title: "Heading 2",
+          children: "H2"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleHeading({ level: 3 }).run(),
+          active: editor.isActive("heading", { level: 3 }),
+          title: "Heading 3",
+          children: "H3"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "w-px bg-gray-300 dark:bg-slate-600 mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleBulletList().run(),
+          active: editor.isActive("bulletList"),
+          title: "Bullet list",
+          children: "\u2022"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleOrderedList().run(),
+          active: editor.isActive("orderedList"),
+          title: "Ordered list",
+          children: "1."
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "w-px bg-gray-300 dark:bg-slate-600 mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleCodeBlock().run(),
+          active: editor.isActive("codeBlock"),
+          title: "Code block",
+          children: "<>"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().toggleCode().run(),
+          active: editor.isActive("code"),
+          title: "Inline code",
+          children: "`"
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { className: "w-px bg-gray-300 dark:bg-slate-600 mx-1" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        ToolbarButton,
+        {
+          onClick: () => editor.chain().focus().setHorizontalRule().run(),
+          title: "Horizontal rule",
+          children: "\u2014"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_react7.EditorContent, { editor })
+  ] });
+}
+function ToolbarButton({
+  onClick,
+  active,
+  title,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+    "button",
+    {
+      onClick,
+      title,
+      className: `
+        px-2 py-1 rounded text-sm font-medium transition-colors
+        ${active ? "bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400" : "bg-transparent text-gray-600 dark:text-gray-400 hover:bg-gray-200 dark:hover:bg-slate-700"}
+      `,
+      children
+    }
+  );
+}
+
 // src/hooks/index.ts
-var import_react7 = require("react");
+var import_react8 = require("react");
 function useDisclosure(initial = false) {
-  const [isOpen, setIsOpen] = (0, import_react7.useState)(initial);
+  const [isOpen, setIsOpen] = (0, import_react8.useState)(initial);
   return {
     isOpen,
     open: () => setIsOpen(true),
@@ -3721,15 +3882,15 @@ function useDisclosure(initial = false) {
   };
 }
 function usePagination(total, pageSize = 20) {
-  const [page, setPage] = (0, import_react7.useState)(1);
+  const [page, setPage] = (0, import_react8.useState)(1);
   const totalPages = Math.ceil(total / pageSize);
   return { page, setPage, pageSize, total, totalPages };
 }
 
 // src/components/auth/AuthShell.tsx
-var import_jsx_runtime55 = require("react/jsx-runtime");
+var import_jsx_runtime56 = require("react/jsx-runtime");
 function AuthShell({ children, pattern = "dots", maxWidth = "520px" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
     "div",
     {
       style: {
@@ -3744,7 +3905,7 @@ function AuthShell({ children, pattern = "dots", maxWidth = "520px" }) {
         overflow: "hidden"
       },
       children: [
-        pattern === "dots" && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        pattern === "dots" && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -3758,7 +3919,7 @@ function AuthShell({ children, pattern = "dots", maxWidth = "520px" }) {
             }
           }
         ),
-        pattern === "grid" && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        pattern === "grid" && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -3772,16 +3933,16 @@ function AuthShell({ children, pattern = "dots", maxWidth = "520px" }) {
             }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("div", { style: { position: "relative", zIndex: 1, width: "100%", maxWidth }, children })
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { style: { position: "relative", zIndex: 1, width: "100%", maxWidth }, children })
       ]
     }
   );
 }
 
 // src/components/auth/AuthCard.tsx
-var import_jsx_runtime56 = require("react/jsx-runtime");
+var import_jsx_runtime57 = require("react/jsx-runtime");
 function AuthCard({ children, padding = "24px 28px" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
     "div",
     {
       style: {
@@ -3798,10 +3959,10 @@ function AuthCard({ children, padding = "24px 28px" }) {
 }
 
 // src/components/auth/AuthLogo.tsx
-var import_jsx_runtime57 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 function AuthLogo({ appName = "Builify CMS", letter = "B", imageUrl, size = 36 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: "10px", marginBottom: "28px" }, children: [
-    imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: "10px", marginBottom: "28px" }, children: [
+    imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       "img",
       {
         src: imageUrl,
@@ -3810,7 +3971,7 @@ function AuthLogo({ appName = "Builify CMS", letter = "B", imageUrl, size = 36 }
         height: size,
         style: { borderRadius: "calc(var(--radius, 0.5rem) * 1.2)", flexShrink: 0, display: "block" }
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       "div",
       {
         style: {
@@ -3829,7 +3990,7 @@ function AuthLogo({ appName = "Builify CMS", letter = "B", imageUrl, size = 36 }
         children: letter
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       "span",
       {
         style: {
@@ -3845,10 +4006,10 @@ function AuthLogo({ appName = "Builify CMS", letter = "B", imageUrl, size = 36 }
 }
 
 // src/components/auth/AuthHeader.tsx
-var import_jsx_runtime58 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function AuthHeader({ title, description }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { style: { marginBottom: "24px", textAlign: "center" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { style: { marginBottom: "24px", textAlign: "center" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       "h1",
       {
         style: {
@@ -3861,7 +4022,7 @@ function AuthHeader({ title, description }) {
         children: title
       }
     ),
-    description && /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
+    description && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
       "p",
       {
         style: {
@@ -3877,12 +4038,12 @@ function AuthHeader({ title, description }) {
 }
 
 // src/components/auth/AuthField.tsx
-var import_jsx_runtime59 = require("react/jsx-runtime");
+var import_jsx_runtime60 = require("react/jsx-runtime");
 function AuthField({ label, error, hint, rightLabel, id, ...props }) {
   const fieldId = id ?? label.toLowerCase().replace(/\s+/g, "-");
-  return /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsxs)("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
         "label",
         {
           htmlFor: fieldId,
@@ -3894,9 +4055,9 @@ function AuthField({ label, error, hint, rightLabel, id, ...props }) {
           children: label
         }
       ),
-      rightLabel && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { style: { fontSize: "0.8125rem" }, children: rightLabel })
+      rightLabel && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("span", { style: { fontSize: "0.8125rem" }, children: rightLabel })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
       "input",
       {
         id: fieldId,
@@ -3926,13 +4087,13 @@ function AuthField({ label, error, hint, rightLabel, id, ...props }) {
         ...props
       }
     ),
-    error && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { style: { fontSize: "0.8rem", color: "var(--destructive)", margin: 0 }, children: error }),
-    hint && !error && /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("p", { style: { fontSize: "0.8rem", color: "var(--muted-foreground)", margin: 0 }, children: hint })
+    error && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { style: { fontSize: "0.8rem", color: "var(--destructive)", margin: 0 }, children: error }),
+    hint && !error && /* @__PURE__ */ (0, import_jsx_runtime60.jsx)("p", { style: { fontSize: "0.8rem", color: "var(--muted-foreground)", margin: 0 }, children: hint })
   ] });
 }
 
 // src/components/auth/AuthButton.tsx
-var import_jsx_runtime60 = require("react/jsx-runtime");
+var import_jsx_runtime61 = require("react/jsx-runtime");
 function AuthButton({
   loading,
   variant = "primary",
@@ -3975,7 +4136,7 @@ function AuthButton({
       color: "var(--foreground)"
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
     "button",
     {
       disabled: loading || disabled,
@@ -3987,8 +4148,8 @@ function AuthButton({
         e.currentTarget.style.filter = "none";
       },
       ...props,
-      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime60.jsxs)(import_jsx_runtime60.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime60.jsx)(
+      children: loading ? /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)(import_jsx_runtime61.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
           "span",
           {
             style: {
@@ -4009,19 +4170,19 @@ function AuthButton({
 }
 
 // src/components/auth/AuthDivider.tsx
-var import_jsx_runtime61 = require("react/jsx-runtime");
+var import_jsx_runtime62 = require("react/jsx-runtime");
 function AuthDivider({ label = "or" }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px", margin: "20px 0" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { style: { flex: 1, height: 1, background: "var(--border)" } }),
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { style: { fontSize: "0.75rem", color: "var(--muted-foreground)", userSelect: "none" }, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("div", { style: { flex: 1, height: 1, background: "var(--border)" } })
+  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: "12px", margin: "20px 0" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { style: { flex: 1, height: 1, background: "var(--border)" } }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { style: { fontSize: "0.75rem", color: "var(--muted-foreground)", userSelect: "none" }, children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { style: { flex: 1, height: 1, background: "var(--border)" } })
   ] });
 }
 
 // src/components/auth/AuthFootnote.tsx
-var import_jsx_runtime62 = require("react/jsx-runtime");
+var import_jsx_runtime63 = require("react/jsx-runtime");
 function AuthFootnote({ text, linkText, linkHref }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("p", { style: {
+  return /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("p", { style: {
     textAlign: "center",
     marginTop: "20px",
     fontSize: "0.8125rem",
@@ -4029,7 +4190,7 @@ function AuthFootnote({ text, linkText, linkHref }) {
   }, children: [
     text,
     " ",
-    /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
       "a",
       {
         href: linkHref,
@@ -4158,6 +4319,7 @@ var import_next_themes2 = require("next-themes");
   Textarea,
   ThemeProvider,
   ThemeToggle,
+  TiptapEditor,
   Tooltip,
   TooltipContent,
   TooltipProvider,