@tulip-systems/core 0.2.0

package/dist/modules/uploads/lib/validators.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"validators.d.ts","names":[],"sources":["../../../../src/modules/uploads/lib/validators.ts"],"sourcesContent":[],"mappings":"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"}

package/dist/modules/uploads/lib/validators.js

@@ -0,0 +1,25 @@
+import { resolveFiltersSchema } from "../../data-tables/lib/filters/resolvers.js";
+import { nodesTableFilters } from "./filters.js";
+import { assets, nodes } from "./schema.js";
+import { createInsertSchema, createSelectSchema } from "drizzle-zod";
+import { z as z$1 } from "zod";
+
+//#region src/modules/uploads/lib/validators.ts
+/**
+* Asset insert schema
+*/
+const createAssetSchema = createInsertSchema(assets);
+const createNodeSchema = createInsertSchema(nodes);
+const selectNodeSchema = createSelectSchema(nodes);
+const selectNodeWithChildrenSchema = selectNodeSchema.extend({ children: z$1.array(selectNodeSchema) });
+/**
+* Project where input
+*/
+const nodesTableFiltersSchema = resolveFiltersSchema(nodesTableFilters).partial().transform((input) => ({
+	...input,
+	isDeleted: input?.isDeleted ?? false
+}));
+
+//#endregion
+export { createAssetSchema, createNodeSchema, nodesTableFiltersSchema, selectNodeSchema, selectNodeWithChildrenSchema };
+//# sourceMappingURL=validators.js.map

package/dist/modules/uploads/lib/validators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validators.js","names":["z"],"sources":["../../../../src/modules/uploads/lib/validators.ts"],"sourcesContent":["import { resolveFiltersSchema } from \"@/modules/data-tables/lib/filters/resolvers\";\nimport { createInsertSchema, createSelectSchema } from \"drizzle-zod\";\nimport { z } from \"zod\";\nimport { nodesTableFilters } from \"./filters\";\nimport { assets, nodes } from \"./schema\";\n\n/**\n * Asset type\n */\nexport type Asset = typeof assets.$inferSelect;\n\n/**\n * Asset insert schema\n */\nexport const createAssetSchema = createInsertSchema(assets);\n\nexport type CreateAssetInput = z.input<typeof createAssetSchema>;\nexport type CreateAssetSchema = z.infer<typeof createAssetSchema>;\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\nexport const createNodeSchema = createInsertSchema(nodes);\n\nexport type CreateNodeInput = z.input<typeof createNodeSchema>;\nexport type CreateNodeSchema = z.infer<typeof createNodeSchema>;\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 * Project where input\n */\nexport const nodesTableFiltersSchema = resolveFiltersSchema(nodesTableFilters)\n  .partial()\n  .transform((input) => ({ ...input, isDeleted: input?.isDeleted ?? false }));\n\nexport type NodesTableFilters = z.input<typeof nodesTableFiltersSchema>;\n"],"mappings":";;;;;;;;;;AAcA,MAAa,oBAAoB,mBAAmB,OAAO;AAY3D,MAAa,mBAAmB,mBAAmB,MAAM;AAKzD,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,WAAW,WAAW;CAAE,GAAG;CAAO,WAAW,OAAO,aAAa;CAAO,EAAE"}

package/dist/uploads/client.d.ts

@@ -0,0 +1,8 @@
+import { UploadButton } from "../modules/uploads/components/button.client.js";
+import { ImageGrid } from "../modules/uploads/components/images/grid.client.js";
+import { ImageInput, ImageInputProps } from "../modules/uploads/components/images/input.client.js";
+import { AssetPreviewDialog, AssetPreviewDialogTrigger } from "../modules/uploads/components/preview-dialog.client.js";
+import { UploadFile, UploadZoneContext, UploadZoneContextValue, useUploadZone } from "../modules/uploads/hooks/use-upload-zone.client.js";
+import { UploadZone } from "../modules/uploads/components/zone.client.js";
+import { useUploadImage } from "../modules/uploads/hooks/use-upload-image.client.js";
+export { AssetPreviewDialog, AssetPreviewDialogTrigger, ImageGrid, ImageInput, ImageInputProps, UploadButton, UploadFile, UploadZone, UploadZoneContext, UploadZoneContextValue, useUploadImage, useUploadZone };

package/dist/uploads/client.js

@@ -0,0 +1,9 @@
+import { UploadZoneContext, useUploadZone } from "../modules/uploads/hooks/use-upload-zone.client.js";
+import { UploadButton } from "../modules/uploads/components/button.client.js";
+import { ImageInput } from "../modules/uploads/components/images/input.client.js";
+import { ImageGrid } from "../modules/uploads/components/images/grid.client.js";
+import { AssetPreviewDialog, AssetPreviewDialogTrigger } from "../modules/uploads/components/preview-dialog.client.js";
+import { UploadZone } from "../modules/uploads/components/zone.client.js";
+import { useUploadImage } from "../modules/uploads/hooks/use-upload-image.client.js";
+
+export { AssetPreviewDialog, AssetPreviewDialogTrigger, ImageGrid, ImageInput, UploadButton, UploadZone, UploadZoneContext, useUploadImage, useUploadZone };

package/dist/uploads/server.d.ts

@@ -0,0 +1,4 @@
+import { GetFileUrlInput, GetFileUrlSchema, createDriveProxyRoute, getFileUrl, getFileUrlInput } from "../modules/uploads/lib/proxy.server.js";
+import { handleUploadRoute } from "../modules/uploads/lib/route.server.js";
+import { createDriveRouter } from "../modules/uploads/lib/router.server.js";
+export { GetFileUrlInput, GetFileUrlSchema, createDriveProxyRoute, createDriveRouter, getFileUrl, getFileUrlInput, handleUploadRoute };

package/dist/uploads/server.js

@@ -0,0 +1,5 @@
+import { handleUploadRoute } from "../modules/uploads/lib/route.server.js";
+import { createDriveProxyRoute, getFileUrl, getFileUrlInput } from "../modules/uploads/lib/proxy.server.js";
+import { createDriveRouter } from "../modules/uploads/lib/router.server.js";
+
+export { createDriveProxyRoute, createDriveRouter, getFileUrl, getFileUrlInput, handleUploadRoute };

package/dist/uploads.d.ts

@@ -0,0 +1,6 @@
+import { ImageDisposition, ImageVariant, deviceSizes, imageDispositions, imageVariants } from "./modules/uploads/lib/constants.js";
+import { nodesTableFilters } from "./modules/uploads/lib/filters.js";
+import { DriveSchema, assets, nodePresignedUrls, nodePresignedUrlsRelations, nodeTypeEnum, nodes, nodesRelations } from "./modules/uploads/lib/schema.js";
+import { Asset, CreateAssetInput, CreateAssetSchema, CreateNodeInput, CreateNodeSchema, FileNode, FolderNode, Node, NodesTableFilters, SelectNodeSchema, SelectNodeWithChildrenSchema, createAssetSchema, createNodeSchema, nodesTableFiltersSchema, selectNodeSchema, selectNodeWithChildrenSchema } from "./modules/uploads/lib/validators.js";
+import { NodeSubtype, getFileUrl, inferNodeSubtype, isFile, isFolder, nodeSubtypes } from "./modules/uploads/lib/helpers.js";
+export { Asset, CreateAssetInput, CreateAssetSchema, CreateNodeInput, CreateNodeSchema, DriveSchema, FileNode, FolderNode, ImageDisposition, ImageVariant, Node, NodeSubtype, NodesTableFilters, SelectNodeSchema, SelectNodeWithChildrenSchema, assets, createAssetSchema, createNodeSchema, deviceSizes, getFileUrl, imageDispositions, imageVariants, inferNodeSubtype, isFile, isFolder, nodePresignedUrls, nodePresignedUrlsRelations, nodeSubtypes, nodeTypeEnum, nodes, nodesRelations, nodesTableFilters, nodesTableFiltersSchema, selectNodeSchema, selectNodeWithChildrenSchema };

package/dist/uploads.js

@@ -0,0 +1,7 @@
+import { deviceSizes, imageDispositions, imageVariants } from "./modules/uploads/lib/constants.js";
+import { nodesTableFilters } from "./modules/uploads/lib/filters.js";
+import { getFileUrl, inferNodeSubtype, isFile, isFolder, nodeSubtypes } from "./modules/uploads/lib/helpers.js";
+import { assets, nodePresignedUrls, nodePresignedUrlsRelations, nodeTypeEnum, nodes, nodesRelations } from "./modules/uploads/lib/schema.js";
+import { createAssetSchema, createNodeSchema, nodesTableFiltersSchema, selectNodeSchema, selectNodeWithChildrenSchema } from "./modules/uploads/lib/validators.js";
+
+export { assets, createAssetSchema, createNodeSchema, deviceSizes, getFileUrl, imageDispositions, imageVariants, inferNodeSubtype, isFile, isFolder, nodePresignedUrls, nodePresignedUrlsRelations, nodeSubtypes, nodeTypeEnum, nodes, nodesRelations, nodesTableFilters, nodesTableFiltersSchema, selectNodeSchema, selectNodeWithChildrenSchema };

package/package.json

@@ -0,0 +1,164 @@
+{
+  "name": "@tulip-systems/core",
+  "version": "0.2.0",
+  "type": "module",
+  "sideEffects": false,
+  "license": "MIT",
+  "devDependencies": {
+    "@types/react": "^19.0.2",
+    "@types/react-dom": "^19.0.2",
+    "eslint": "^9.17.0",
+    "tailwindcss": "^4.0.11",
+    "tsdown": "^0.15.6",
+    "tw-animate-css": "^1.4.0",
+    "typescript": "5.8.2",
+    "vite": "^6.2.1",
+    "@tulip-systems/eslint-config": "0.0.0",
+    "@tulip-systems/typescript-config": "0.0.0"
+  },
+  "dependencies": {
+    "@aws-sdk/client-s3": "^3.810.0",
+    "@aws-sdk/s3-request-presigner": "^3.810.0",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
+    "@dnd-kit/utilities": "^3.2.2",
+    "@headless-tree/core": "^1.0.1",
+    "@headless-tree/react": "^1.0.1",
+    "@hookform/resolvers": "^4.1.3",
+    "@orpc/client": "^1.9.0",
+    "@orpc/contract": "^1.9.0",
+    "@orpc/server": "^1.9.0",
+    "@orpc/tanstack-query": "^1.9.0",
+    "@radix-ui/react-accordion": "^1.2.3",
+    "@radix-ui/react-alert-dialog": "^1.1.6",
+    "@radix-ui/react-aspect-ratio": "^1.1.2",
+    "@radix-ui/react-avatar": "^1.1.3",
+    "@radix-ui/react-checkbox": "^1.1.4",
+    "@radix-ui/react-collapsible": "^1.1.3",
+    "@radix-ui/react-context-menu": "^2.2.6",
+    "@radix-ui/react-dialog": "^1.1.6",
+    "@radix-ui/react-dropdown-menu": "^2.1.6",
+    "@radix-ui/react-hover-card": "^1.1.6",
+    "@radix-ui/react-label": "^2.1.2",
+    "@radix-ui/react-menubar": "^1.1.6",
+    "@radix-ui/react-navigation-menu": "^1.2.5",
+    "@radix-ui/react-popover": "^1.1.6",
+    "@radix-ui/react-progress": "^1.1.2",
+    "@radix-ui/react-radio-group": "^1.2.3",
+    "@radix-ui/react-scroll-area": "^1.2.3",
+    "@radix-ui/react-select": "^2.1.6",
+    "@radix-ui/react-separator": "^1.1.2",
+    "@radix-ui/react-slider": "^1.2.3",
+    "@radix-ui/react-slot": "^1.1.2",
+    "@radix-ui/react-switch": "^1.1.3",
+    "@radix-ui/react-tabs": "^1.1.3",
+    "@radix-ui/react-toggle": "^1.1.2",
+    "@radix-ui/react-toggle-group": "^1.1.2",
+    "@radix-ui/react-tooltip": "^1.1.8",
+    "@react-email/components": "^0.0.33",
+    "@tailwindcss/typography": "^0.5.16",
+    "@tanstack/react-query": "^5.90.2",
+    "@tanstack/react-query-devtools": "^5.90.2",
+    "@tanstack/react-table": "^8.21.2",
+    "@tanstack/react-virtual": "^3.13.12",
+    "@tiptap/extension-color": "^2.11.7",
+    "@tiptap/extension-highlight": "^2.11.7",
+    "@tiptap/extension-image": "^2.11.7",
+    "@tiptap/extension-link": "^2.11.7",
+    "@tiptap/extension-text-style": "^2.11.7",
+    "@tiptap/extension-underline": "^2.11.5",
+    "@tiptap/pm": "^2.11.7",
+    "@tiptap/react": "^2.11.5",
+    "@tiptap/starter-kit": "^2.11.5",
+    "@vercel/blob": "^0.27.3",
+    "better-auth": "^1.3.7",
+    "class-variance-authority": "^0.7.1",
+    "client-only": "^0.0.1",
+    "clsx": "^2.1.1",
+    "cmdk": "1.0.4",
+    "date-fns": "^4.1.0",
+    "drizzle-orm": "^0.44.5",
+    "drizzle-zod": "^0.8.3",
+    "embla-carousel-react": "^8.5.2",
+    "lucide-react": "^0.479.0",
+    "motion": "^12.9.2",
+    "nanostores": "^0.11.4",
+    "next": "15.2.2",
+    "next-themes": "^0.4.6",
+    "nuqs": "2.5.2",
+    "postgres": "^3.4.5",
+    "react": "^19.0.0",
+    "react-colorful": "^5.6.1",
+    "react-day-picker": "8.10.1",
+    "react-dom": "^19.0.0",
+    "react-email": "^3.0.7",
+    "react-hook-form": "^7.54.2",
+    "react-hotkeys-hook": "^4.6.1",
+    "react-resizable-panels": "^2.1.7",
+    "recharts": "^2.15.0",
+    "resend": "^4.1.2",
+    "server-cli-only": "^0.3.2",
+    "server-only": "^0.0.1",
+    "sonner": "^2.0.1",
+    "superjson": "^2.2.2",
+    "tailwind-merge": "^3.0.2",
+    "tailwindcss-animate": "^1.0.7",
+    "use-debounce": "^10.0.4",
+    "uuid": "^13.0.0",
+    "vaul": "^1.1.2",
+    "zod": "^4.1.5"
+  },
+  "peerDependencies": {
+    "next": "15.1.3",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "sharp": "^0.34.2"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "exports": {
+    "./auth": "./dist/auth.js",
+    "./auth/client": "./dist/auth/client.js",
+    "./auth/server": "./dist/auth/server.js",
+    "./commands": "./dist/commands.js",
+    "./commands/client": "./dist/commands/client.js",
+    "./commands/server": "./dist/commands/server.js",
+    "./components": "./dist/components.js",
+    "./components/client": "./dist/components/client.js",
+    "./components/server": "./dist/components/server.js",
+    "./config": "./dist/config.js",
+    "./config/client": "./dist/config/client.js",
+    "./config/server": "./dist/config/server.js",
+    "./data-tables": "./dist/data-tables.js",
+    "./data-tables/client": "./dist/data-tables/client.js",
+    "./data-tables/server": "./dist/data-tables/server.js",
+    "./inline-edit": "./dist/inline-edit.js",
+    "./inline-edit/client": "./dist/inline-edit/client.js",
+    "./inline-edit/server": "./dist/inline-edit/server.js",
+    "./lib": "./dist/lib.js",
+    "./lib/client": "./dist/lib/client.js",
+    "./lib/server": "./dist/lib/server.js",
+    "./uploads": "./dist/uploads.js",
+    "./uploads/client": "./dist/uploads/client.js",
+    "./uploads/server": "./dist/uploads/server.js",
+    "./package.json": "./package.json",
+    "./styles.css": "./src/styles.css"
+  },
+  "main": "./dist/components.js",
+  "module": "./dist/components.js",
+  "types": "./dist/components.d.ts",
+  "scripts": {
+    "dev": "tsdown --watch",
+    "build": "tsdown --config-loader tsdown.config.ts",
+    "lint": "eslint \"src/**/*.ts*\"",
+    "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
+    "ui:add": "pnpm dlx shadcn@latest add",
+    "email": "email dev --port 9090 --dir src/components/emails"
+  }
+}

package/src/components/common/icons.tsx

@@ -0,0 +1,159 @@
+import {
+  AlertTriangle,
+  ArchiveIcon,
+  ArchiveRestore,
+  ArrowDown,
+  ArrowLeft,
+  ArrowRight,
+  ArrowUp,
+  BuildingIcon,
+  Check,
+  ChevronDown,
+  ChevronLeft,
+  ChevronRight,
+  ChevronUp,
+  ClipboardCheck,
+  Copy,
+  CreditCard,
+  Download,
+  ExternalLink,
+  EyeIcon,
+  File,
+  FileText,
+  HelpCircle,
+  HomeIcon,
+  Image,
+  Laptop,
+  LayoutDashboardIcon,
+  Loader2,
+  Moon,
+  MoreVertical,
+  MoveLeft,
+  MoveRight,
+  PencilRuler,
+  PenSquare,
+  Pizza,
+  Plus,
+  RefreshCcw,
+  RotateCw,
+  SaveIcon,
+  ScrollTextIcon,
+  Search,
+  Settings,
+  SunMedium,
+  Trash,
+  User,
+  X,
+  type LucideIcon,
+  type LucideProps,
+} from "lucide-react";
+
+export type Icon = LucideIcon;
+
+export const Icons = {
+  close: X,
+  save: SaveIcon,
+  spinner: Loader2,
+  chevronLeft: ChevronLeft,
+  chevronRight: ChevronRight,
+  chevronDown: ChevronDown,
+  chevronUp: ChevronUp,
+  trash: Trash,
+  post: FileText,
+  page: File,
+  media: Image,
+  download: Download,
+  settings: Settings,
+  billing: CreditCard,
+  ellipsis: MoreVertical,
+  add: Plus,
+  edit: PenSquare,
+  warning: AlertTriangle,
+  user: User,
+  arrowUp: ArrowUp,
+  arrowDown: ArrowDown,
+  arrowRight: ArrowRight,
+  arrowLeft: ArrowLeft,
+  moveLeft: MoveLeft,
+  moveRight: MoveRight,
+  help: HelpCircle,
+  pizza: Pizza,
+  check: Check,
+  copy: Copy,
+  copyDone: ClipboardCheck,
+  refresh: RotateCw,
+  preview: EyeIcon,
+  externalLink: ExternalLink,
+  sun: SunMedium,
+  moon: Moon,
+  search: Search,
+  laptop: Laptop,
+  active: RefreshCcw,
+  draft: PencilRuler,
+  archive: ArchiveIcon,
+  restore: ArchiveRestore,
+  dashboard: LayoutDashboardIcon,
+  regulations: ScrollTextIcon,
+  home: HomeIcon,
+  building: BuildingIcon,
+  logo: (props: LucideProps) => (
+    <svg viewBox="0 0 120.09 141.73" {...props}>
+      <title>Tulip Logo Icon</title>
+      <defs>
+        <linearGradient
+          id="tulip-logo-icon-gradient"
+          x1="60.5"
+          y1="0"
+          x2="60.5"
+          y2="141.73"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop offset="0" stopColor="#ffc754" />
+          <stop offset="1" stopColor="#ff1800" />
+        </linearGradient>
+        <linearGradient
+          id="tulip-logo-icon-gradient-2"
+          x1="72.4"
+          y1="5.81"
+          x2="72.4"
+          y2="141.73"
+          xlinkHref="#tulip-logo-icon-gradient"
+        />
+        <linearGradient
+          id="tulip-logo-icon-gradient-3"
+          x1="47.69"
+          y1="5.81"
+          x2="47.69"
+          y2="141.73"
+          xlinkHref="#tulip-logo-icon-gradient"
+        />
+      </defs>
+
+      <g>
+        <g>
+          <path
+            d="M107.88,93.09c0-35.95-47.38-93.09-47.38-93.09,0,0-47.39,57.14-47.38,93.09,0,26.17,21.21,48.64,47.38,48.64,26.17,0,47.39-22.47,47.38-48.64Z"
+            style={{
+              fill: "url(#tulip-logo-icon-gradient)",
+              opacity: 0.75,
+            }}
+          />
+          <path
+            d="M116.68,109.5c12.3-33.78-12.69-103.68-12.69-103.68,0,0-64.07,37.49-76.37,71.27-8.95,24.59,3.3,52.97,27.89,61.92,24.59,8.95,52.21-4.91,61.16-29.5Z"
+            style={{
+              fill: "url(#tulip-logo-icon-gradient-2)",
+              opacity: 0.75,
+            }}
+          />
+          <path
+            d="M92.46,77.09C80.16,43.3,16.09,5.81,16.09,5.81c0,0-24.98,69.9-12.69,103.68,8.95,24.59,36.57,38.45,61.16,29.5,24.59-8.95,36.84-37.32,27.89-61.92Z"
+            style={{
+              fill: "url(#tulip-logo-icon-gradient-3)",
+              opacity: 0.75,
+            }}
+          />
+        </g>
+      </g>
+    </svg>
+  ),
+};

package/src/components/common/status.tsx

@@ -0,0 +1,88 @@
+import { type ConfigWithIcon } from "@/lib/types/config";
+import { cn } from "@/lib/utils/cn";
+import { Badge } from "../ui/badge";
+
+/**
+ * Create status config
+ */
+export const createStatusConfig = <TStatus extends string>(config: ConfigWithIcon<TStatus>[]) =>
+  config;
+
+/**
+ * Find the status object from the config
+ * @param {TStatus[]} values
+ * @param {string} status
+ * @returns {TStatus | undefined}
+ */
+export function findStatus<TStatus extends { value: string }>(
+  values: TStatus[],
+  status: string,
+): TStatus | undefined {
+  return values.find((s) => s.value === status);
+}
+
+/**
+ * Create status variants
+ * @param {TStatus[]} values
+ * @returns {Record<string, string>}
+ */
+export function createStatusVariants<TStatus extends string>(
+  values: { value: TStatus; className: string }[],
+): Record<TStatus, string> {
+  return values.reduce(
+    (acc, { value, className }) => {
+      acc[value] = className;
+      return acc;
+    },
+    {} as Record<TStatus, string>,
+  );
+}
+
+/**
+ * Create status component props
+ */
+export type CreateStatusComponentProps<TStatus extends string> = {
+  status: TStatus | null;
+};
+
+/**
+ * Status component props
+ */
+type StatusComponentProps<TStatus extends string> = {
+  config: ConfigWithIcon<TStatus>[];
+  variants: (props: { status: TStatus }) => string;
+  status: TStatus | null;
+};
+
+/**
+ * Status column
+ */
+export function StatusField<TStatus extends string>(props: StatusComponentProps<TStatus>) {
+  const status = findStatus(props.config, props.status ?? "");
+  if (!status) return <div />;
+
+  return (
+    <div className={cn("flex items-center gap-2", props.variants({ status: status.value }))}>
+      <status.icon className={cn("size-4", props.variants({ status: status.value }))} />
+      <span>{status.label}</span>
+    </div>
+  );
+}
+
+/**
+ * Status badge
+ */
+export function StatusBadge<TStatus extends string>(props: StatusComponentProps<TStatus>) {
+  const status = findStatus(props.config, props.status ?? "");
+  if (!status) return <div />;
+
+  return (
+    <Badge
+      variant="outline"
+      className={cn("flex items-center gap-2", props.variants({ status: status.value }))}
+    >
+      <status.icon className={cn("size-3", props.variants({ status: status.value }))} />
+      <span>{status.label}</span>
+    </Badge>
+  );
+}

package/src/components/editor/components/block-dropdown.tsx

@@ -0,0 +1,107 @@
+import { Button } from "@/components/ui/button";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { Editor } from "@tiptap/react";
+import {
+  ChevronDown,
+  Heading1Icon,
+  Heading2Icon,
+  Heading3Icon,
+  Heading4Icon,
+  Heading5Icon,
+  ListIcon,
+  ListOrderedIcon,
+  TextIcon,
+} from "lucide-react";
+import { useContext } from "react";
+import { EditorContext } from "../context.client";
+
+const blocks = [
+  {
+    label: "Paragraaf",
+    icon: TextIcon,
+    selected: (editor: Editor) => editor.isActive("paragraph"),
+    handler: (editor: Editor) => editor.commands.setParagraph(),
+  },
+  {
+    label: "Titel 1",
+    icon: Heading1Icon,
+    selected: (editor: Editor) => editor.isActive("heading", { level: 1 }),
+    handler: (editor: Editor) => editor.commands.setHeading({ level: 1 }),
+  },
+  {
+    label: "Titel 2",
+    icon: Heading2Icon,
+    selected: (editor: Editor) => editor.isActive("heading", { level: 2 }),
+    handler: (editor: Editor) => editor.commands.setHeading({ level: 2 }),
+  },
+  {
+    label: "Titel 3",
+    icon: Heading3Icon,
+    selected: (editor: Editor) => editor.isActive("heading", { level: 3 }),
+    handler: (editor: Editor) => editor.commands.setHeading({ level: 3 }),
+  },
+  {
+    label: "Titel 4",
+    icon: Heading4Icon,
+    selected: (editor: Editor) => editor.isActive("heading", { level: 4 }),
+    handler: (editor: Editor) => editor.commands.setHeading({ level: 4 }),
+  },
+  {
+    label: "Titel 5",
+    icon: Heading5Icon,
+    selected: (editor: Editor) => editor.isActive("heading", { level: 5 }),
+    handler: (editor: Editor) => editor.commands.setHeading({ level: 5 }),
+  },
+  {
+    label: "Numbered List",
+    icon: ListOrderedIcon,
+    selected: (editor: Editor) => editor.isActive("orderedList"),
+    handler: (editor: Editor) => editor.commands.toggleOrderedList(),
+  },
+  {
+    label: "Bulleted List",
+    icon: ListIcon,
+    selected: (editor: Editor) => editor.isActive("bulletList"),
+    handler: (editor: Editor) => editor.commands.toggleBulletList(),
+  },
+];
+
+export function BlockDropdown() {
+  const { editor } = useContext(EditorContext);
+
+  const selectedBlock = blocks.find((block) => block.selected(editor));
+  const Icon = selectedBlock?.icon;
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" size="sm" className="flex items-center gap-8 p-2">
+          <span className="flex items-center gap-2">
+            {Icon && <Icon className="size-3.5" />}
+            {selectedBlock?.label ?? "Select a block"}
+          </span>
+
+          <ChevronDown className="size-3.5" />
+        </Button>
+      </DropdownMenuTrigger>
+
+      <DropdownMenuContent>
+        {blocks.map(({ label, icon: Icon, handler }, index) => (
+          <DropdownMenuItem
+            key={index}
+            onClick={() => handler(editor)}
+            className="flex items-center gap-2"
+          >
+            {Icon && <Icon className="size-3.5" />}
+            {label}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}

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

@@ -0,0 +1,16 @@
+"use client";
+
+import { TooltipProvider } from "@/components/ui/tooltip.client";
+import { EditorContent as TiptapEditorContent } from "@tiptap/react";
+import { useContext } from "react";
+import { EditorContext } from "../context.client";
+
+export function EditorContent() {
+  const { editor } = useContext(EditorContext);
+
+  return (
+    <TooltipProvider>
+      <TiptapEditorContent editor={editor} />
+    </TooltipProvider>
+  );
+}