@melv1c/rich-text-editor 0.0.0 → 1.0.1

package/dist/index.d.mts

@@ -1 +1,196 @@
-export { };
+import * as react from "react";
+import { ComponentProps, HTMLAttributes } from "react";
+import { Button, Toggle } from "@melv1c/ui-core";
+import { Editor, EditorContent, useEditor } from "@tiptap/react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import StarterKit from "@tiptap/starter-kit";
+
+//#region src/content.d.ts
+type RichTextEditorContentProps = Omit<ComponentProps<typeof EditorContent>, 'editor'> & {
+  /**
+   * Minimum height of the editor content area.
+   * Accepts a number (treated as pixels) or any valid CSS size string.
+   * @default 180
+   */
+  minHeight?: number | string;
+  /**
+   * Maximum height of the editor content area. When set, the content area becomes
+   * scrollable once the content exceeds this height.
+   * Accepts a number (treated as pixels) or any valid CSS size string.
+   */
+  maxHeight?: number | string;
+};
+declare function RichTextEditorContent({
+  className,
+  minHeight,
+  maxHeight,
+  style,
+  ...props
+}: RichTextEditorContentProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/editor.d.ts
+type RichTextEditorProps = HTMLAttributes<HTMLDivElement> & {
+  value?: string;
+  defaultValue?: string;
+  onValueChange?: (value: string, editor: Editor) => void;
+  editable?: boolean;
+  extensions?: Parameters<typeof useEditor>[0]['extensions'];
+  starterKit?: Parameters<typeof StarterKit.configure>[0];
+};
+declare function RichTextEditor({
+  children,
+  className,
+  value,
+  defaultValue,
+  onValueChange,
+  editable,
+  extensions,
+  starterKit,
+  ...props
+}: RichTextEditorProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/built-in.d.ts
+/**
+ * Built-in editor presets:
+ * - `"minimal"`: Formatting controls (bold, italic, strike, code) + undo/redo
+ * - `"simple"` (default): Heading select + formatting + undo/redo
+ * - `"complete"`: Heading toggles + formatting + lists + undo/redo
+ * - `"oneline"`: No toolbar, single-line (Enter is blocked)
+ */
+type RichTextEditorPreset = 'minimal' | 'simple' | 'complete' | 'oneline';
+type RichTextEditorBuiltInProps = Omit<RichTextEditorProps, 'children'> & {
+  contentClassName?: string;
+  toolbarClassName?: string;
+  /**
+   * Selects a built-in toolbar / behaviour configuration.
+   * @default "complete"
+   */
+  preset?: RichTextEditorPreset;
+  /**
+   * Minimum height of the editor content area.
+   * Accepts a number (px) or any valid CSS size string.
+   * Forwarded to `RichTextEditorContent`.
+   */
+  minHeight?: RichTextEditorContentProps['minHeight'];
+  /**
+   * Maximum height of the editor content area. When set the content area becomes
+   * scrollable once the content exceeds this height.
+   * Accepts a number (px) or any valid CSS size string.
+   * Forwarded to `RichTextEditorContent`.
+   */
+  maxHeight?: RichTextEditorContentProps['maxHeight'];
+};
+declare function RichTextEditorBuiltIn({
+  className,
+  contentClassName,
+  toolbarClassName,
+  preset,
+  minHeight,
+  maxHeight,
+  extensions,
+  ...props
+}: RichTextEditorBuiltInProps): react_jsx_runtime0.JSX.Element;
+/** @deprecated Use `RichTextEditorBuiltIn` instead. */
+declare const RichTextEditorSimple: typeof RichTextEditorBuiltIn;
+/** @deprecated Use `RichTextEditorBuiltInProps` instead. */
+type RichTextEditorSimpleProps = RichTextEditorBuiltInProps;
+//#endregion
+//#region src/context.d.ts
+type RichTextEditorContextValue = {
+  editor: Editor | null;
+};
+declare const RichTextEditorContext: react.Context<RichTextEditorContextValue | null>;
+declare function useRichTextEditor(): RichTextEditorContextValue;
+//#endregion
+//#region src/toolbar/formatting-buttons.d.ts
+type FormattingButtonProps = Omit<ComponentProps<typeof Toggle>, 'pressed' | 'defaultPressed' | 'onPressedChange'>;
+declare function BoldButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function ItalicButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function StrikethroughButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function CodeButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: FormattingButtonProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/toolbar/heading-buttons.d.ts
+type HeadingButtonProps = Omit<ComponentProps<typeof Toggle>, 'pressed' | 'defaultPressed' | 'onPressedChange'>;
+type RichTextEditorHeadingLevel = 1 | 2 | 3;
+declare function Heading1Button(props: HeadingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function Heading2Button(props: HeadingButtonProps): react_jsx_runtime0.JSX.Element;
+declare function Heading3Button(props: HeadingButtonProps): react_jsx_runtime0.JSX.Element;
+type RichTextEditorHeadingSelectProps = {
+  levels?: RichTextEditorHeadingLevel[];
+  includeParagraphOption?: boolean;
+  paragraphLabel?: string;
+  selectPlaceholder?: string;
+};
+declare function RichTextEditorHeadingSelect({
+  levels,
+  includeParagraphOption,
+  paragraphLabel,
+  selectPlaceholder
+}: RichTextEditorHeadingSelectProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/toolbar/history-buttons.d.ts
+type HistoryButtonProps = ComponentProps<typeof Button>;
+declare function UndoButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: HistoryButtonProps): react_jsx_runtime0.JSX.Element;
+declare function RedoButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: HistoryButtonProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/toolbar/list-buttons.d.ts
+type ListButtonProps = Omit<ComponentProps<typeof Toggle>, 'pressed' | 'defaultPressed' | 'onPressedChange'>;
+declare function BulletListButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: ListButtonProps): react_jsx_runtime0.JSX.Element;
+declare function OrderedListButton({
+  children,
+  className,
+  variant,
+  size,
+  ...props
+}: ListButtonProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/toolbar/toolbar.d.ts
+type RichTextEditorToolbarProps = HTMLAttributes<HTMLDivElement>;
+declare function RichTextEditorToolbar({
+  className,
+  ...props
+}: RichTextEditorToolbarProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { BoldButton, BulletListButton, CodeButton, FormattingButtonProps, Heading1Button, Heading2Button, Heading3Button, HeadingButtonProps, HistoryButtonProps, ItalicButton, ListButtonProps, OrderedListButton, RedoButton, RichTextEditor, RichTextEditorBuiltIn, RichTextEditorBuiltInProps, RichTextEditorContent, RichTextEditorContentProps, RichTextEditorContext, RichTextEditorContextValue, RichTextEditorHeadingLevel, RichTextEditorHeadingSelect, RichTextEditorHeadingSelectProps, RichTextEditorPreset, RichTextEditorProps, RichTextEditorSimple, RichTextEditorSimpleProps, RichTextEditorToolbar, RichTextEditorToolbarProps, StrikethroughButton, UndoButton, useRichTextEditor };

package/dist/index.mjs

@@ -1 +1,374 @@
-export {  };
+import { Extension } from "@tiptap/core";
+import { createContext, useContext, useEffect, useMemo } from "react";
+import { Button, ButtonGroup, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Toggle, cn } from "@melv1c/ui-core";
+import { EditorContent, useEditor, useEditorState } from "@tiptap/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import StarterKit from "@tiptap/starter-kit";
+import { Bold, Code, Heading1, Heading2, Heading3, Italic, List, ListOrdered, Redo2, Strikethrough, Undo2 } from "lucide-react";
+
+//#region src/context.tsx
+const RichTextEditorContext = createContext(null);
+function useRichTextEditor() {
+	const context = useContext(RichTextEditorContext);
+	if (!context) throw new Error("useRichTextEditor must be used within RichTextEditor.");
+	return context;
+}
+
+//#endregion
+//#region src/content.tsx
+function toSize(value) {
+	if (value === void 0) return void 0;
+	return typeof value === "number" ? `${value}px` : value;
+}
+function RichTextEditorContent({ className, minHeight = 180, maxHeight, style, ...props }) {
+	const { editor } = useRichTextEditor();
+	const heightStyles = {
+		minHeight: toSize(minHeight),
+		maxHeight: toSize(maxHeight),
+		overflowY: maxHeight !== void 0 ? "auto" : void 0
+	};
+	return /* @__PURE__ */ jsx(EditorContent, {
+		"data-slot": "rich-text-editor-content",
+		editor,
+		className: cn("text-foreground [&_.ProseMirror]:px-2 [&_.ProseMirror]:py-1 [&_.ProseMirror]:outline-none [&_.ProseMirror_p.is-editor-empty:first-child::before]:text-muted-foreground [&_.ProseMirror_p.is-editor-empty:first-child::before]:pointer-events-none [&_.ProseMirror_p.is-editor-empty:first-child::before]:float-left [&_.ProseMirror_p.is-editor-empty:first-child::before]:h-0 [&_.ProseMirror_p.is-editor-empty:first-child::before]:content-[attr(data-placeholder)]", className),
+		style: {
+			...heightStyles,
+			...style
+		},
+		...props
+	});
+}
+
+//#endregion
+//#region src/editor.tsx
+function RichTextEditor({ children, className, value, defaultValue, onValueChange, editable = true, extensions, starterKit, ...props }) {
+	const mergedExtensions = useMemo(() => [StarterKit.configure(starterKit ?? {}), ...extensions ?? []], [extensions, starterKit]);
+	const editor = useEditor({
+		extensions: mergedExtensions,
+		editable,
+		content: value ?? defaultValue ?? "",
+		onUpdate({ editor: currentEditor }) {
+			onValueChange?.(currentEditor.getHTML(), currentEditor);
+		}
+	}, [mergedExtensions, editable]);
+	useEffect(() => {
+		if (!editor || value === void 0) return;
+		if (editor.getHTML() === value) return;
+		editor.commands.setContent(value, { emitUpdate: false });
+	}, [editor, value]);
+	const contextValue = useMemo(() => ({ editor }), [editor]);
+	return /* @__PURE__ */ jsx(RichTextEditorContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ jsx("div", {
+			"data-slot": "rich-text-editor",
+			className: cn("bg-background border-border rounded-lg border", className),
+			...props,
+			children
+		})
+	});
+}
+
+//#endregion
+//#region src/toolbar/formatting-buttons.tsx
+function BoldButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("bold") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Bold",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleBold().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleBold().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Bold, {})
+	});
+}
+function ItalicButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("italic") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Italic",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleItalic().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleItalic().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Italic, {})
+	});
+}
+function StrikethroughButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("strike") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Strikethrough",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleStrike().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleStrike().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Strikethrough, {})
+	});
+}
+function CodeButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("code") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Inline code",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleCode().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleCode().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Code, {})
+	});
+}
+
+//#endregion
+//#region src/toolbar/heading-buttons.tsx
+const ALL_HEADING_LEVELS = [
+	1,
+	2,
+	3
+];
+const HEADING_ICONS = {
+	1: Heading1,
+	2: Heading2,
+	3: Heading3
+};
+const HEADING_LABELS = {
+	1: "Heading 1",
+	2: "Heading 2",
+	3: "Heading 3"
+};
+function HeadingButton({ level, children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const Icon = HEADING_ICONS[level];
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("heading", { level }) ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": `Heading ${level}`,
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleHeading({ level }).run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleHeading({ level }).run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Icon, {})
+	});
+}
+function Heading1Button(props) {
+	return /* @__PURE__ */ jsx(HeadingButton, {
+		level: 1,
+		...props
+	});
+}
+function Heading2Button(props) {
+	return /* @__PURE__ */ jsx(HeadingButton, {
+		level: 2,
+		...props
+	});
+}
+function Heading3Button(props) {
+	return /* @__PURE__ */ jsx(HeadingButton, {
+		level: 3,
+		...props
+	});
+}
+function RichTextEditorHeadingSelect({ levels, includeParagraphOption = true, paragraphLabel = "Paragraph", selectPlaceholder = "Select heading" }) {
+	const { editor } = useRichTextEditor();
+	const resolvedLevels = levels ?? ALL_HEADING_LEVELS;
+	const visibleLevels = new Set(resolvedLevels);
+	const activeValue = useEditorState({
+		editor,
+		selector: ({ editor: e }) => {
+			if (!e) return "";
+			for (const level of ALL_HEADING_LEVELS) if (e.isActive("heading", { level })) return `heading-${level}`;
+			return "";
+		}
+	});
+	const paragraphItem = includeParagraphOption ? {
+		value: "paragraph",
+		label: paragraphLabel,
+		disabled: editor ? !editor.can().chain().focus().setParagraph().run() : true
+	} : null;
+	const headingItems = ALL_HEADING_LEVELS.filter((level) => visibleLevels.has(level)).map((level) => ({
+		value: `heading-${level}`,
+		label: HEADING_LABELS[level],
+		disabled: editor ? !editor.can().chain().focus().setHeading({ level }).run() : true
+	}));
+	const items = [...paragraphItem ? [paragraphItem] : [], ...headingItems];
+	return /* @__PURE__ */ jsxs(Select, {
+		value: activeValue || (includeParagraphOption ? "paragraph" : void 0),
+		onValueChange: (value) => {
+			if (!editor) return;
+			if (value === "paragraph") {
+				editor.chain().focus().setParagraph().run();
+				return;
+			}
+			const level = Number(value.replace("heading-", ""));
+			editor.chain().focus().setHeading({ level }).run();
+		},
+		children: [/* @__PURE__ */ jsx(SelectTrigger, {
+			"aria-label": "Heading levels",
+			size: "sm",
+			disabled: !editor,
+			className: "shadow-none",
+			children: /* @__PURE__ */ jsx(SelectValue, { placeholder: selectPlaceholder })
+		}), /* @__PURE__ */ jsx(SelectContent, { children: items.map((item) => /* @__PURE__ */ jsx(SelectItem, {
+			value: item.value,
+			disabled: item.disabled,
+			children: item.label
+		}, item.value)) })]
+	});
+}
+
+//#endregion
+//#region src/toolbar/history-buttons.tsx
+function UndoButton({ children, className, variant = "outline", size = "icon-sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	return /* @__PURE__ */ jsx(Button, {
+		"aria-label": "Undo",
+		variant,
+		size,
+		disabled: editor ? !editor.can().chain().focus().undo().run() : true,
+		onClick: () => editor?.chain().focus().undo().run(),
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Undo2, {})
+	});
+}
+function RedoButton({ children, className, variant = "outline", size = "icon-sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	return /* @__PURE__ */ jsx(Button, {
+		"aria-label": "Redo",
+		variant,
+		size,
+		disabled: editor ? !editor.can().chain().focus().redo().run() : true,
+		onClick: () => editor?.chain().focus().redo().run(),
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(Redo2, {})
+	});
+}
+
+//#endregion
+//#region src/toolbar/list-buttons.tsx
+function BulletListButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("bulletList") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Bullet list",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleBulletList().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleBulletList().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(List, {})
+	});
+}
+function OrderedListButton({ children, className, variant = "outline", size = "sm", ...props }) {
+	const { editor } = useRichTextEditor();
+	const isActive = useEditorState({
+		editor,
+		selector: ({ editor: e }) => e?.isActive("orderedList") ?? false
+	});
+	return /* @__PURE__ */ jsx(Toggle, {
+		"aria-label": "Ordered list",
+		pressed: !!isActive,
+		disabled: editor ? !editor.can().chain().focus().toggleOrderedList().run() : true,
+		onPressedChange: () => editor?.chain().focus().toggleOrderedList().run(),
+		variant,
+		size,
+		className: cn("shadow-none", className),
+		...props,
+		children: children ?? /* @__PURE__ */ jsx(ListOrdered, {})
+	});
+}
+
+//#endregion
+//#region src/toolbar/toolbar.tsx
+function RichTextEditorToolbar({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "rich-text-editor-toolbar",
+		className: cn("border-border flex flex-wrap items-center gap-2 border-b p-2", className),
+		...props
+	});
+}
+
+//#endregion
+//#region src/built-in.tsx
+/** Blocks Enter / Shift-Enter so the editor stays on a single line. */
+const OneLinerExtension = Extension.create({
+	name: "oneLiner",
+	addKeyboardShortcuts() {
+		return {
+			Enter: () => true,
+			"Shift-Enter": () => true
+		};
+	}
+});
+function RichTextEditorBuiltIn({ className, contentClassName, toolbarClassName, preset = "complete", minHeight, maxHeight, extensions, ...props }) {
+	const isOneline = preset === "oneline";
+	const resolvedMinHeight = minHeight ?? (isOneline ? 0 : 180);
+	return /* @__PURE__ */ jsxs(RichTextEditor, {
+		className,
+		extensions: useMemo(() => isOneline ? [OneLinerExtension, ...extensions ?? []] : extensions, [isOneline, extensions]),
+		...props,
+		children: [/* @__PURE__ */ jsxs(RichTextEditorToolbar, {
+			className: toolbarClassName,
+			children: [
+				(preset === "complete" || preset === "simple") && /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(UndoButton, {}), /* @__PURE__ */ jsx(RedoButton, {})] }),
+				preset === "simple" && /* @__PURE__ */ jsx(RichTextEditorHeadingSelect, {}),
+				preset === "complete" && /* @__PURE__ */ jsxs(ButtonGroup, { children: [
+					/* @__PURE__ */ jsx(Heading1Button, {}),
+					/* @__PURE__ */ jsx(Heading2Button, {}),
+					/* @__PURE__ */ jsx(Heading3Button, {})
+				] }),
+				/* @__PURE__ */ jsxs(ButtonGroup, { children: [
+					/* @__PURE__ */ jsx(BoldButton, {}),
+					/* @__PURE__ */ jsx(ItalicButton, {}),
+					/* @__PURE__ */ jsx(StrikethroughButton, {}),
+					/* @__PURE__ */ jsx(CodeButton, {})
+				] }),
+				preset === "complete" && /* @__PURE__ */ jsxs(ButtonGroup, { children: [/* @__PURE__ */ jsx(BulletListButton, {}), /* @__PURE__ */ jsx(OrderedListButton, {})] })
+			]
+		}), /* @__PURE__ */ jsx(RichTextEditorContent, {
+			className: contentClassName,
+			minHeight: resolvedMinHeight,
+			maxHeight
+		})]
+	});
+}
+/** @deprecated Use `RichTextEditorBuiltIn` instead. */
+const RichTextEditorSimple = RichTextEditorBuiltIn;
+
+//#endregion
+export { BoldButton, BulletListButton, CodeButton, Heading1Button, Heading2Button, Heading3Button, ItalicButton, OrderedListButton, RedoButton, RichTextEditor, RichTextEditorBuiltIn, RichTextEditorContent, RichTextEditorContext, RichTextEditorHeadingSelect, RichTextEditorSimple, RichTextEditorToolbar, StrikethroughButton, UndoButton, useRichTextEditor };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@melv1c/rich-text-editor",
-  "version": "0.0.0",
+  "version": "1.0.1",
   "description": "A rich text editor component for React, built with TipTap and styled with Tailwind CSS.",
   "repository": {
     "type": "git",
@@ -11,10 +11,10 @@
   ],
   "type": "module",
   "main": "./dist/index.mjs",
-  "types": "./src/index.ts",
+  "types": "./dist/index.d.mts",
   "exports": {
     ".": {
-      "types": "./src/index.ts",
+      "types": "./dist/index.d.mts",
       "import": "./dist/index.mjs",
       "default": "./dist/index.mjs"
     }
@@ -26,7 +26,12 @@
     "build": "tsdown",
     "dev": "tsdown --watch --no-clean"
   },
-  "dependencies": {},
+  "dependencies": {
+    "@tiptap/core": "^3.20.0",
+    "@tiptap/react": "^3.7.2",
+    "@tiptap/starter-kit": "^3.7.2",
+    "lucide-react": "^0.513.0"
+  },
   "devDependencies": {
     "@types/node": "^25.2.3",
     "@types/react": "^19.2.14",
@@ -37,7 +42,7 @@
     "typescript": "~5.9.3"
   },
   "peerDependencies": {
-    "@melv1c/ui-core": ">=1.1.0",
+    "@melv1c/ui-core": ">=1.1.2",
     "react": ">=19",
     "react-dom": ">=19",
     "tailwindcss": "^4.1.17",