@tulip-systems/core 0.4.1 → 0.5.1

package/dist/modules/storage/lib/validators.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"validators.mjs","names":["z"],"sources":["../../../../src/modules/storage/lib/validators.ts"],"sourcesContent":["import { tableQuerySchema } from \"@/modules/data-tables/entry\";\nimport { resolveFiltersSchema } from \"@/modules/data-tables/lib/filters/resolvers\";\nimport { PutObjectCommandInput } from \"@aws-sdk/client-s3\";\nimport { createInsertSchema, createSelectSchema, createUpdateSchema } from \"drizzle-zod\";\nimport { z } from \"zod\";\nimport { nodesTableFilters } from \"../config/filters\";\nimport { imageDispositions, imageVariants } from \"./constants\";\nimport { nodeModeEnum, nodes } from \"./schema\";\n\n/**\n * Nodes\n */\nexport type Node = typeof nodes.$inferSelect;\nexport type FileNode = typeof nodes.$inferSelect & { type: \"file\" };\nexport type FolderNode = typeof nodes.$inferSelect & { type: \"folder\" };\n\n/**\n * Node mode\n */\nexport const nodeModeSchema = z.enum(nodeModeEnum.enumValues);\nexport type NodeMode = z.infer<typeof nodeModeSchema>;\n\n/**\n * Create node\n */\nexport const createNodeSchema = createInsertSchema(nodes, {\n  namespace: z.string(),\n});\n\nexport type CreateNodeInput = z.input<typeof createNodeSchema>;\nexport type CreateNodeSchema = z.infer<typeof createNodeSchema>;\n\n/**\n * Update node\n */\nexport const updateNodeSchema = createUpdateSchema(nodes);\n\nexport type UpdateNodeInput = z.input<typeof updateNodeSchema>;\nexport type UpdateNodeSchema = z.infer<typeof updateNodeSchema>;\n\n/**\n * Create folder node\n */\nexport const createFolderNodeSchema = createNodeSchema.omit({\n  type: true,\n  contentType: true,\n  size: true,\n  subtype: true,\n});\n\nexport type CreateFolderNodeSchema = z.infer<typeof createFolderNodeSchema>;\n\n/**\n * Create file node\n */\nexport const createFileNodeSchema = createNodeSchema.omit({\n  type: true,\n});\nexport type CreateFileNodeSchema = z.infer<typeof createFileNodeSchema>;\n\n/**\n * Select node\n */\nexport const selectNodeSchema = createSelectSchema(nodes);\nexport const selectNodeWithChildrenSchema = selectNodeSchema.extend({\n  children: z.array(selectNodeSchema),\n});\n\nexport type SelectNodeSchema = z.infer<typeof selectNodeSchema>;\nexport type SelectNodeWithChildrenSchema = z.infer<typeof selectNodeWithChildrenSchema>;\n\n/**\n * Where input\n */\nexport const nodesTableFiltersSchema = resolveFiltersSchema(nodesTableFilters)\n  .partial()\n  .extend({\n    namespace: z.string(),\n    parentId: z.string().nullable(),\n  })\n  .transform((input) => ({ ...input, isDeleted: input?.isDeleted ?? false }));\n\nexport type NodesTableFilters = z.input<typeof nodesTableFiltersSchema>;\n\n/**\n * Upload file schema\n */\nexport const uploadFileSchema = z.object({\n  name: z.string().min(1),\n  namespace: z.string(),\n  mode: nodeModeSchema.optional(),\n  parentId: z.uuid().nullable(),\n  size: z.number().optional().default(0),\n  contentType: z.string().optional().default(\"\"),\n});\n\nexport type UploadFileSchema = z.infer<typeof uploadFileSchema>;\n\n/**\n * Presign file schema\n */\nexport const presignFileSchema = uploadFileSchema.extend({ id: z.uuid() });\n\nexport type PresignFileSchema = z.infer<typeof presignFileSchema>;\n\n/**\n * Get file url schema\n */\nexport const getFileURLSchemaDefaults = { variant: \"main\", disposition: \"inline\" } as const;\n\nexport const getFileURLSchema = z.object({\n  variant: z.enum(imageVariants).optional().default(getFileURLSchemaDefaults.variant),\n  disposition: z.enum(imageDispositions).optional().default(getFileURLSchemaDefaults.disposition),\n});\n\nexport type GetFileUrlInput = z.input<typeof getFileURLSchema>;\nexport type GetFileURLSchema = z.infer<typeof getFileURLSchema>;\n\n/**\n * Get by parent id input\n */\nexport const getNodesByParentIdSchema = tableQuerySchema\n  .pick({ order: true, sort: true, search: true })\n  .extend({ filters: nodesTableFiltersSchema });\n\nexport type GetNodesByParentIdInput = z.input<typeof getNodesByParentIdSchema>;\n\n/**\n * Get object input\n */\nexport const getObjectSchema = z.object({\n  id: z.string(),\n  variant: z.enum(imageVariants).optional().default(getFileURLSchemaDefaults.variant),\n  disposition: z.string().optional().default(getFileURLSchemaDefaults.disposition),\n});\n\nexport type GetObjectInput = z.input<typeof getObjectSchema>;\nexport type GetObjectSchema = z.infer<typeof getObjectSchema>;\n\n/**\n * Put object input\n */\nexport const putObjectSchema = z.object({\n  id: z.string(),\n  name: z.string().optional().default(\"\"),\n  variant: z.enum(imageVariants).optional().default(\"main\"),\n  body: z.any().optional(),\n  contentType: z.string().optional().default(\"\"),\n  size: z.number().optional().default(0),\n});\n\nexport type PutObjectInput = z.input<typeof putObjectSchema> & {\n  body?: PutObjectCommandInput[\"Body\"];\n};\n\nexport type PutObjectSchema = z.infer<typeof putObjectSchema>;\n"],"mappings":";;;;;;;;;;;;AAmBA,MAAa,iBAAiBA,IAAE,KAAK,aAAa,WAAW;;;;AAM7D,MAAa,mBAAmB,mBAAmB,OAAO,EACxD,WAAWA,IAAE,QAAQ,EACtB,CAAC;;;;AAQF,MAAa,mBAAmB,mBAAmB,MAAM;;;;AAQzD,MAAa,yBAAyB,iBAAiB,KAAK;CAC1D,MAAM;CACN,aAAa;CACb,MAAM;CACN,SAAS;CACV,CAAC;;;;AAOF,MAAa,uBAAuB,iBAAiB,KAAK,EACxD,MAAM,MACP,CAAC;;;;AAMF,MAAa,mBAAmB,mBAAmB,MAAM;AACzD,MAAa,+BAA+B,iBAAiB,OAAO,EAClE,UAAUA,IAAE,MAAM,iBAAiB,EACpC,CAAC;;;;AAQF,MAAa,0BAA0B,qBAAqB,kBAAkB,CAC3E,SAAS,CACT,OAAO;CACN,WAAWA,IAAE,QAAQ;CACrB,UAAUA,IAAE,QAAQ,CAAC,UAAU;CAChC,CAAC,CACD,WAAW,WAAW;CAAE,GAAG;CAAO,WAAW,OAAO,aAAa;CAAO,EAAE;;;;AAO7E,MAAa,mBAAmBA,IAAE,OAAO;CACvC,MAAMA,IAAE,QAAQ,CAAC,IAAI,EAAE;CACvB,WAAWA,IAAE,QAAQ;CACrB,MAAM,eAAe,UAAU;CAC/B,UAAUA,IAAE,MAAM,CAAC,UAAU;CAC7B,MAAMA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,EAAE;CACtC,aAAaA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,GAAG;CAC/C,CAAC;;;;AAOF,MAAa,oBAAoB,iBAAiB,OAAO,EAAE,IAAIA,IAAE,MAAM,EAAE,CAAC;;;;AAO1E,MAAa,2BAA2B;CAAE,SAAS;CAAQ,aAAa;CAAU;AAElF,MAAa,mBAAmBA,IAAE,OAAO;CACvC,SAASA,IAAE,KAAK,cAAc,CAAC,UAAU,CAAC,QAAQ,yBAAyB,QAAQ;CACnF,aAAaA,IAAE,KAAK,kBAAkB,CAAC,UAAU,CAAC,QAAQ,yBAAyB,YAAY;CAChG,CAAC;;;;AAQF,MAAa,2BAA2B,iBACrC,KAAK;CAAE,OAAO;CAAM,MAAM;CAAM,QAAQ;CAAM,CAAC,CAC/C,OAAO,EAAE,SAAS,yBAAyB,CAAC;;;;AAO/C,MAAa,kBAAkBA,IAAE,OAAO;CACtC,IAAIA,IAAE,QAAQ;CACd,SAASA,IAAE,KAAK,cAAc,CAAC,UAAU,CAAC,QAAQ,yBAAyB,QAAQ;CACnF,aAAaA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,yBAAyB,YAAY;CACjF,CAAC;;;;AAQF,MAAa,kBAAkBA,IAAE,OAAO;CACtC,IAAIA,IAAE,QAAQ;CACd,MAAMA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,GAAG;CACvC,SAASA,IAAE,KAAK,cAAc,CAAC,UAAU,CAAC,QAAQ,OAAO;CACzD,MAAMA,IAAE,KAAK,CAAC,UAAU;CACxB,aAAaA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,GAAG;CAC9C,MAAMA,IAAE,QAAQ,CAAC,UAAU,CAAC,QAAQ,EAAE;CACvC,CAAC"}

package/dist/storage/client.d.mts

@@ -0,0 +1,6 @@
+import { DropzoneContext, useDropzoneContext } from "../modules/storage/components/dropzone-context.client.mjs";
+import { Dropzone, DropzoneContent, DropzoneContentProps, DropzoneEmptyState, DropzoneEmptyStateProps, DropzoneProps } from "../modules/storage/components/dropzone.client.mjs";
+import { ImageGrid, ImageGridSkeleton } from "../modules/storage/components/image-grid.client.mjs";
+import { UploadZoneContext, UploadZoneContextValue, useUploadZone } from "../modules/storage/components/upload-zone-context.client.mjs";
+import { UploadZone, UploadZoneProps } from "../modules/storage/components/upload-zone.client.mjs";
+export { Dropzone, DropzoneContent, DropzoneContentProps, DropzoneContext, DropzoneEmptyState, DropzoneEmptyStateProps, DropzoneProps, ImageGrid, ImageGridSkeleton, UploadZone, UploadZoneContext, UploadZoneContextValue, UploadZoneProps, useDropzoneContext, useUploadZone };

package/dist/storage/client.mjs

@@ -0,0 +1,14 @@
+import { DropzoneContext, useDropzoneContext } from "../modules/storage/components/dropzone-context.client.mjs";
+import { Dropzone, DropzoneContent, DropzoneEmptyState } from "../modules/storage/components/dropzone.client.mjs";
+import { UploadZoneContext, useUploadZone } from "../modules/storage/components/upload-zone-context.client.mjs";
+import { ImageGrid, ImageGridSkeleton } from "../modules/storage/components/image-grid.client.mjs";
+import { UploadZone } from "../modules/storage/components/upload-zone.client.mjs";
+
+//#region src/modules/storage/entry.client.ts
+/**
+* Hooks
+*/
+
+//#endregion
+export { Dropzone, DropzoneContent, DropzoneContext, DropzoneEmptyState, ImageGrid, ImageGridSkeleton, UploadZone, UploadZoneContext, useDropzoneContext, useUploadZone };
+//# sourceMappingURL=client.mjs.map

package/dist/storage/client.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.mjs","names":[],"sources":["../../src/modules/storage/entry.client.ts"],"sourcesContent":["/**\n * Components\n */\nexport * from \"./components/dropzone-context.client\";\nexport * from \"./components/dropzone.client\";\nexport * from \"./components/image-grid.client\";\nexport * from \"./components/upload-zone-context.client\";\nexport * from \"./components/upload-zone.client\";\n\n/**\n * Hooks\n */\n"],"mappings":""}

package/dist/storage/server.d.mts

@@ -0,0 +1,4 @@
+import { StorageClient, createStorageClient } from "../modules/storage/lib/create-client.server.mjs";
+import { createDriveProxyRoute } from "../modules/storage/lib/proxy.server.mjs";
+import { createDriveBaseProcedures } from "../modules/storage/lib/router.server.mjs";
+export { StorageClient, createDriveBaseProcedures, createDriveProxyRoute, createStorageClient };

package/dist/storage/server.mjs

@@ -0,0 +1,5 @@
+import { createStorageClient } from "../modules/storage/lib/create-client.server.mjs";
+import { createDriveProxyRoute } from "../modules/storage/lib/proxy.server.mjs";
+import { createDriveBaseProcedures } from "../modules/storage/lib/router.server.mjs";
+
+export { createDriveBaseProcedures, createDriveProxyRoute, createStorageClient };

package/dist/storage.d.mts

@@ -0,0 +1,6 @@
+import { DriveSchema, nodeModeEnum, nodePresignedUrls, nodePresignedUrlsRelations, nodeTypeEnum, nodeVariants, nodeVariantsRelations, nodes, nodesRelations } from "./modules/storage/lib/schema.mjs";
+import { CreateFileNodeSchema, CreateFolderNodeSchema, CreateNodeInput, CreateNodeSchema, FileNode, FolderNode, GetFileURLSchema, GetFileUrlInput, GetNodesByParentIdInput, GetObjectInput, GetObjectSchema, Node, NodeMode, NodesTableFilters, PresignFileSchema, PutObjectInput, PutObjectSchema, SelectNodeSchema, SelectNodeWithChildrenSchema, UpdateNodeInput, UpdateNodeSchema, UploadFileSchema, createFileNodeSchema, createFolderNodeSchema, createNodeSchema, getFileURLSchema, getFileURLSchemaDefaults, getNodesByParentIdSchema, getObjectSchema, nodeModeSchema, nodesTableFiltersSchema, presignFileSchema, putObjectSchema, selectNodeSchema, selectNodeWithChildrenSchema, updateNodeSchema, uploadFileSchema } from "./modules/storage/lib/validators.mjs";
+import { nodesTableFilters } from "./modules/storage/config/filters.mjs";
+import { ImageDisposition, ImageVariant, deviceSizes, imageDispositions, imageSizes, imageVariants } from "./modules/storage/lib/constants.mjs";
+import { NodeSubtype, getDriveBucketKey, getFileUrl, imageLoader, inferNodeSubtype, isFile, isFolder, nodeSubtypes, renderBytes } from "./modules/storage/lib/helpers.mjs";
+export { CreateFileNodeSchema, CreateFolderNodeSchema, CreateNodeInput, CreateNodeSchema, DriveSchema, FileNode, FolderNode, GetFileURLSchema, GetFileUrlInput, GetNodesByParentIdInput, GetObjectInput, GetObjectSchema, ImageDisposition, ImageVariant, Node, NodeMode, NodeSubtype, NodesTableFilters, PresignFileSchema, PutObjectInput, PutObjectSchema, SelectNodeSchema, SelectNodeWithChildrenSchema, UpdateNodeInput, UpdateNodeSchema, UploadFileSchema, createFileNodeSchema, createFolderNodeSchema, createNodeSchema, deviceSizes, getDriveBucketKey, getFileURLSchema, getFileURLSchemaDefaults, getFileUrl, getNodesByParentIdSchema, getObjectSchema, imageDispositions, imageLoader, imageSizes, imageVariants, inferNodeSubtype, isFile, isFolder, nodeModeEnum, nodeModeSchema, nodePresignedUrls, nodePresignedUrlsRelations, nodeSubtypes, nodeTypeEnum, nodeVariants, nodeVariantsRelations, nodes, nodesRelations, nodesTableFilters, nodesTableFiltersSchema, presignFileSchema, putObjectSchema, renderBytes, selectNodeSchema, selectNodeWithChildrenSchema, updateNodeSchema, uploadFileSchema };

package/dist/storage.mjs

@@ -0,0 +1,7 @@
+import { deviceSizes, imageDispositions, imageSizes, imageVariants } from "./modules/storage/lib/constants.mjs";
+import { getDriveBucketKey, getFileUrl, imageLoader, inferNodeSubtype, isFile, isFolder, nodeSubtypes, renderBytes } from "./modules/storage/lib/helpers.mjs";
+import { nodeModeEnum, nodePresignedUrls, nodePresignedUrlsRelations, nodeTypeEnum, nodeVariants, nodeVariantsRelations, nodes, nodesRelations } from "./modules/storage/lib/schema.mjs";
+import { nodesTableFilters } from "./modules/storage/config/filters.mjs";
+import { createFileNodeSchema, createFolderNodeSchema, createNodeSchema, getFileURLSchema, getFileURLSchemaDefaults, getNodesByParentIdSchema, getObjectSchema, nodeModeSchema, nodesTableFiltersSchema, presignFileSchema, putObjectSchema, selectNodeSchema, selectNodeWithChildrenSchema, updateNodeSchema, uploadFileSchema } from "./modules/storage/lib/validators.mjs";
+
+export { createFileNodeSchema, createFolderNodeSchema, createNodeSchema, deviceSizes, getDriveBucketKey, getFileURLSchema, getFileURLSchemaDefaults, getFileUrl, getNodesByParentIdSchema, getObjectSchema, imageDispositions, imageLoader, imageSizes, imageVariants, inferNodeSubtype, isFile, isFolder, nodeModeEnum, nodeModeSchema, nodePresignedUrls, nodePresignedUrlsRelations, nodeSubtypes, nodeTypeEnum, nodeVariants, nodeVariantsRelations, nodes, nodesRelations, nodesTableFilters, nodesTableFiltersSchema, presignFileSchema, putObjectSchema, renderBytes, selectNodeSchema, selectNodeWithChildrenSchema, updateNodeSchema, uploadFileSchema };

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@tulip-systems/core",
-  "version": "0.4.1",
+  "version": "0.5.1",
   "type": "module",
   "sideEffects": false,
   "license": "MIT",
   "devDependencies": {
-    "@types/react": "^19.2.7",
-    "@types/react-dom": "^19.2.3",
+    "@types/react": "19.2.7",
+    "@types/react-dom": "19.2.3",
     "eslint": "^9.39.1",
     "tailwindcss": "^4.1.17",
     "tsdown": "^0.17.1",
@@ -62,36 +62,48 @@
     "@tanstack/react-query-devtools": "^5.91.1",
     "@tanstack/react-table": "^8.21.2",
     "@tanstack/react-virtual": "^3.13.13",
-    "@tiptap/extension-color": "^3.13.0",
-    "@tiptap/extension-highlight": "^3.13.0",
-    "@tiptap/extension-image": "^3.13.0",
-    "@tiptap/extension-link": "^3.13.0",
-    "@tiptap/extension-text-style": "^3.13.0",
-    "@tiptap/extension-underline": "^3.13.0",
-    "@tiptap/html": "^3.13.0",
-    "@tiptap/pm": "^3.13.0",
-    "@tiptap/react": "^3.13.0",
-    "@tiptap/starter-kit": "^3.13.0",
-    "@vercel/blob": "^0.27.3",
+    "@tiptap/core": "^3.14.0",
+    "@tiptap/extension-blockquote": "^3.14.0",
+    "@tiptap/extension-bold": "^3.14.0",
+    "@tiptap/extension-color": "^3.14.0",
+    "@tiptap/extension-document": "^3.14.0",
+    "@tiptap/extension-hard-break": "^3.14.0",
+    "@tiptap/extension-heading": "^3.14.0",
+    "@tiptap/extension-highlight": "^3.14.0",
+    "@tiptap/extension-horizontal-rule": "^3.14.0",
+    "@tiptap/extension-image": "^3.14.0",
+    "@tiptap/extension-italic": "^3.14.0",
+    "@tiptap/extension-link": "^3.14.0",
+    "@tiptap/extension-list": "^3.14.0",
+    "@tiptap/extension-paragraph": "^3.14.0",
+    "@tiptap/extension-strike": "^3.14.0",
+    "@tiptap/extension-text": "^3.14.0",
+    "@tiptap/extension-text-style": "^3.14.0",
+    "@tiptap/extension-underline": "^3.14.0",
+    "@tiptap/extensions": "^3.14.0",
+    "@tiptap/html": "^3.14.0",
+    "@tiptap/pm": "^3.14.0",
+    "@tiptap/react": "^3.14.0",
     "better-auth": "^1.4.5",
     "class-variance-authority": "^0.7.1",
     "client-only": "^0.0.1",
     "clsx": "^2.1.1",
     "cmdk": "1.1.1",
     "date-fns": "^4.1.0",
+    "deepmerge": "^4.3.1",
     "drizzle-orm": "^0.45.0",
     "drizzle-zod": "^0.8.3",
     "embla-carousel-react": "^8.5.2",
     "lucide-react": "^0.556.0",
     "motion": "^12.23.25",
-    "next": "16.0.9",
+    "next": "16.1.1",
     "next-themes": "^0.4.6",
     "nuqs": "2.8.3",
     "postgres": "^3.4.5",
-    "react": "^19.2.1",
+    "react": "19.2.3",
     "react-colorful": "^5.6.1",
     "react-day-picker": "9.12.0",
-    "react-dom": "^19.2.1",
+    "react-dom": "19.2.3",
     "react-dropzone": "^14.3.8",
     "react-email": "^5.0.6",
     "react-hook-form": "^7.68.0",
@@ -150,9 +162,9 @@
     "./router": "./dist/router.mjs",
     "./router/client": "./dist/router/client.mjs",
     "./router/server": "./dist/router/server.mjs",
-    "./uploads": "./dist/uploads.mjs",
-    "./uploads/client": "./dist/uploads/client.mjs",
-    "./uploads/server": "./dist/uploads/server.mjs",
+    "./storage": "./dist/storage.mjs",
+    "./storage/client": "./dist/storage/client.mjs",
+    "./storage/server": "./dist/storage/server.mjs",
     "./package.json": "./package.json",
     "./styles.css": "./src/styles.css"
   },

package/src/components/editor/components/content.client.tsx

@@ -3,7 +3,7 @@
 import { TooltipProvider } from "@/components/ui/tooltip.client";
 import { EditorContent as TiptapEditorContent } from "@tiptap/react";
 import { useContext } from "react";
-import { EditorContext } from "../context.client";
+import { EditorContext } from "./editor.client";
 
 export function EditorContent() {
   const { editor } = useContext(EditorContext);

package/src/components/editor/components/editor.client.tsx

@@ -0,0 +1,95 @@
+"use client";
+
+import { cn } from "@/lib/utils/cn";
+import { Content, Editor as TiptapEditor, useEditor } from "@tiptap/react";
+import { cva, VariantProps } from "class-variance-authority";
+import { createContext, PropsWithChildren } from "react";
+import {
+  EditorExtensionsConfig,
+  EditorExtensionsConfigResult,
+  editorExtensionsConfigToExtensions,
+  flattenEditorExtensionsConfig,
+} from "../lib/extensions";
+import { EditorJSONContent } from "../lib/types";
+import { editorProseVariants } from "../lib/variants";
+
+/**
+ * Editor context
+ */
+type EditorContextValue = {
+  editor: TiptapEditor;
+  extensions: EditorExtensionsConfigResult;
+};
+
+export const EditorContext = createContext({} as EditorContextValue);
+
+/**
+ * Editor variants
+ */
+export const editorVariants = cva("", {
+  variants: {
+    variant: {
+      default:
+        "border-input rounded-lg border [&_.editor-content]:p-3 [&_.editor-content[contenteditable='false']]:pointer-events-none [&_.editor-content[contenteditable='false']]:cursor-not-allowed [&_.editor-content[contenteditable='false']]:opacity-50",
+      table:
+        "[&_.editor-content[contenteditable='false']]:pointer-events-none [&_.editor-content[contenteditable='false']]:cursor-not-allowed [&_.editor-content[contenteditable='false']]:opacity-50",
+      preview: "bg-transparent [&_.editor-content]:p-0 [&_.editor-content]:min-h-0",
+    },
+  },
+  defaultVariants: {
+    variant: "default",
+  },
+});
+
+/**
+ * Editor context provider
+ */
+export type EditorProps = VariantProps<typeof editorVariants> &
+  PropsWithChildren<{
+    value?: Content;
+    extensions?: Partial<EditorExtensionsConfig>;
+    onUpdate?: (value: EditorJSONContent) => void;
+    onBlur?: (value: EditorJSONContent) => void;
+    disabled?: boolean;
+    className?: string;
+  }>;
+
+export function Editor({
+  value,
+  extensions,
+  onUpdate,
+  onBlur,
+  disabled,
+  variant,
+  className,
+  children,
+}: EditorProps) {
+  const editor = useEditor({
+    extensions: editorExtensionsConfigToExtensions(extensions),
+    content: value,
+    onUpdate: ({ editor }) => onUpdate?.(editor.getJSON()),
+    onBlur: ({ editor }) => onBlur?.(editor.getJSON()),
+    editable: !disabled,
+    injectCSS: false,
+    immediatelyRender: false,
+    editorProps: {
+      transformPastedHTML: (html) => html.replace(/<img.*?>/g, ""),
+      attributes: {
+        class: cn("editor-content text-sm max-w-full focus:outline-none", editorProseVariants(), className),
+      },
+    },
+  });
+
+  if (!editor) return null;
+
+  return (
+    <EditorContext.Provider
+      value={{
+        editor,
+        extensions: flattenEditorExtensionsConfig(extensions),
+      }}
+    >
+      <div className={editorVariants({ variant })}>{children}</div>
+    </EditorContext.Provider>
+  );
+}

package/src/components/editor/components/{block-dropdown.tsx → menu-nodes.client.tsx}

@@ -18,7 +18,8 @@ import {
   TextIcon,
 } from "lucide-react";
 import { useContext } from "react";
-import { EditorContext } from "../context.client";
+import { EditorExtensionsConfigResult } from "../lib/extensions";
+import { EditorContext } from "./editor.client";
 
 const blocks = [
   {
@@ -26,57 +27,69 @@ const blocks = [
     icon: TextIcon,
     selected: (editor: Editor) => editor.isActive("paragraph"),
     handler: (editor: Editor) => editor.commands.setParagraph(),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.paragraph,
   },
   {
     label: "Titel 1",
     icon: Heading1Icon,
     selected: (editor: Editor) => editor.isActive("heading", { level: 1 }),
     handler: (editor: Editor) => editor.commands.setHeading({ level: 1 }),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,
   },
   {
     label: "Titel 2",
     icon: Heading2Icon,
     selected: (editor: Editor) => editor.isActive("heading", { level: 2 }),
     handler: (editor: Editor) => editor.commands.setHeading({ level: 2 }),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,
   },
   {
     label: "Titel 3",
     icon: Heading3Icon,
     selected: (editor: Editor) => editor.isActive("heading", { level: 3 }),
     handler: (editor: Editor) => editor.commands.setHeading({ level: 3 }),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,
   },
   {
     label: "Titel 4",
     icon: Heading4Icon,
     selected: (editor: Editor) => editor.isActive("heading", { level: 4 }),
     handler: (editor: Editor) => editor.commands.setHeading({ level: 4 }),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,
   },
   {
     label: "Titel 5",
     icon: Heading5Icon,
     selected: (editor: Editor) => editor.isActive("heading", { level: 5 }),
     handler: (editor: Editor) => editor.commands.setHeading({ level: 5 }),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,
   },
   {
     label: "Numbered List",
     icon: ListOrderedIcon,
     selected: (editor: Editor) => editor.isActive("orderedList"),
     handler: (editor: Editor) => editor.commands.toggleOrderedList(),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.orderedList,
   },
   {
     label: "Bulleted List",
     icon: ListIcon,
     selected: (editor: Editor) => editor.isActive("bulletList"),
     handler: (editor: Editor) => editor.commands.toggleBulletList(),
+    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.bulletList,
   },
 ];
 
-export function BlockDropdown() {
-  const { editor } = useContext(EditorContext);
+export function EditorMenuNodes() {
+  const { editor, extensions } = useContext(EditorContext);
 
   const selectedBlock = blocks.find((block) => block.selected(editor));
   const Icon = selectedBlock?.icon;
 
+  const filteredBlocks = blocks.filter((block) => !block.hidden(extensions));
+
+  if (filteredBlocks.length === 0) return null;
+
   return (
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
@@ -91,7 +104,7 @@ export function BlockDropdown() {
       </DropdownMenuTrigger>
 
       <DropdownMenuContent>
-        {blocks.map(({ label, icon: Icon, handler }, index) => (
+        {filteredBlocks.map(({ label, icon: Icon, handler }, index) => (
           <DropdownMenuItem
             key={index}
             onClick={() => handler(editor)}

package/src/components/editor/components/menu.client.tsx

@@ -0,0 +1,214 @@
+import { Button } from "@/components/ui/button";
+import { ColorPicker } from "@/components/ui/color-picker.client";
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
+import { cn } from "@/lib/entry";
+import { BubbleMenu } from "@tiptap/react/menus";
+import {
+  BaselineIcon,
+  BoldIcon,
+  EraserIcon,
+  ItalicIcon,
+  PaintBucketIcon,
+  RedoIcon,
+  StrikethroughIcon,
+  UnderlineIcon,
+  UndoIcon,
+} from "lucide-react";
+import { ComponentProps, PropsWithChildren, useContext } from "react";
+import { EditorContext } from "./editor.client";
+import { EditorMenuNodes } from "./menu-nodes.client";
+
+export function EditorMenuFixed(props: React.ComponentProps<"div">) {
+  return (
+    <div
+      {...props}
+      className={cn("border-input bg-muted/30 z-10 overflow-auto border-b p-2", props.className)}
+    >
+      <EditorMenuContent>
+        <EditorMenuUndoRedo />
+        <EditorMenuNodes />
+        <EditorMenuMarks />
+        <EditorMenuColor />
+      </EditorMenuContent>
+    </div>
+  );
+}
+
+export function EditorMenuBubble(props: ComponentProps<typeof BubbleMenu>) {
+  const { editor } = useContext(EditorContext);
+
+  return (
+    <BubbleMenu
+      {...props}
+      editor={editor}
+      options={{ ...props.options, strategy: "fixed" }}
+      className={cn("border-input bg-muted z-10 rounded-lg border p-2", props.className)}
+    >
+      <EditorMenuContent>
+        <EditorMenuMarks />
+      </EditorMenuContent>
+    </BubbleMenu>
+  );
+}
+
+function EditorMenuContent(props: PropsWithChildren) {
+  return <div className="flex items-center gap-6">{props.children}</div>;
+}
+
+/**
+ * Editor menu undo/redo
+ */
+function EditorMenuUndoRedo() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.undoRedo) return null;
+
+  return (
+    <div className="flex items-center gap-1">
+      <Button
+        onClick={() => editor.commands.undo()}
+        disabled={!editor?.can().undo()}
+        type="button"
+        aria-label="Undo"
+        size="icon"
+        className="p-2"
+        variant="outline"
+      >
+        <UndoIcon className="size-3.5" />
+      </Button>
+
+      <Button
+        onClick={() => editor.commands.redo()}
+        disabled={!editor?.can().redo()}
+        type="button"
+        aria-label="Redo"
+        size="icon"
+        className="p-2"
+        variant="outline"
+      >
+        <RedoIcon className="size-3.5" />
+      </Button>
+    </div>
+  );
+}
+
+/**
+ * Editor menu marks
+ */
+function EditorMenuMarks() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.bold && !extensions.italic && !extensions.underline && !extensions.strike) {
+    return null;
+  }
+
+  return (
+    <div className="flex items-center gap-1">
+      {extensions.bold && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("bold") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleBold().run()}
+          className="border"
+        >
+          <BoldIcon className="h-3.5 w-3.5" />
+        </Button>
+      )}
+
+      {extensions.italic && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("italic") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleItalic().run()}
+          className="border"
+        >
+          <ItalicIcon className="size-3.5" />
+        </Button>
+      )}
+
+      {extensions.underline && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("underline") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleUnderline().run()}
+          className="border"
+        >
+          <UnderlineIcon className="size-3.5" />
+        </Button>
+      )}
+
+      {extensions.strike && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("strike") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleStrike().run()}
+          className="border"
+        >
+          <StrikethroughIcon className="size-3.5" />
+        </Button>
+      )}
+    </div>
+  );
+}
+
+/**
+ * Editor menu alignment
+ */
+function EditorMenuColor() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.color && !extensions.highlight) {
+    return null;
+  }
+
+  return (
+    <div className="flex items-center gap-1">
+      {extensions.color && (
+        <Popover>
+          <PopoverTrigger asChild>
+            <Button size="icon" variant="outline">
+              <BaselineIcon className="size-3.5" />
+            </Button>
+          </PopoverTrigger>
+
+          <PopoverContent className="w-fit p-0">
+            <ColorPicker onValueChange={(color) => editor.chain().focus().setColor(color).run()} />
+          </PopoverContent>
+        </Popover>
+      )}
+
+      {extensions.highlight && (
+        <Popover>
+          <PopoverTrigger asChild>
+            <Button size="icon" variant="outline" disabled={!editor?.can().setHighlight()}>
+              <PaintBucketIcon className="size-3.5" />
+            </Button>
+          </PopoverTrigger>
+
+          <PopoverContent className="w-fit p-0">
+            <ColorPicker
+              onValueChange={(color) => editor.chain().focus().setHighlight({ color }).run()}
+            />
+          </PopoverContent>
+        </Popover>
+      )}
+
+      <Button
+        type="button"
+        size="icon"
+        variant="outline"
+        className="border"
+        onClick={() => {
+          editor.commands.unsetColor();
+          editor.commands.unsetHighlight();
+        }}
+      >
+        <EraserIcon className="h-4 w-4" />
+      </Button>
+    </div>
+  );
+}

package/src/components/editor/components/spinner.tsx

@@ -17,12 +17,12 @@ export function SpinnerComponent({ ref, className, ...props }: React.SVGProps<SV
         r="10"
         stroke="currentColor"
         strokeWidth="4"
-      ></circle>
+      />
       <path
         className="opacity-75"
         fill="currentColor"
         d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
-      ></path>
+      />
     </svg>
   );
 }