@tulip-systems/core 0.6.0 → 0.7.0

package/dist/modules/storage/components/upload-zone.client.d.mts

@@ -5,7 +5,7 @@ import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { ComponentProps } from "react";
 
 //#region src/modules/storage/components/upload-zone.client.d.ts
-type UploadZoneProps = ComponentProps<"div"> & Pick<UploadZoneContextValue, "optimistic" | "uploadClient"> & {
+type UploadZoneProps = ComponentProps<"div"> & Pick<UploadZoneContextValue, "optimistic" | "uploadClient" | "disabled"> & {
   variables: Pick<UploadFileSchema, "namespace" | "parentId" | "mode" | "hidden" | "readonly">;
   uploadHooks?: UploadHooks;
   onUploadCompleted?: (node: Node) => Promise<void> | void;
@@ -18,6 +18,7 @@ declare function UploadZone({
   uploadHooks,
   onUploadCompleted,
   onUploadFailed,
+  disabled,
   children,
   className,
   ...props

package/dist/modules/storage/components/upload-zone.client.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"upload-zone.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/upload-zone.client.tsx"],"mappings":";;;;;;;KAWY,eAAA,GAAkB,cAAA,UAC5B,IAAA,CAAK,sBAAA;EACH,SAAA,EAAW,IAAA,CAAK,gBAAA;EAChB,WAAA,GAAc,WAAA;EAEd,iBAAA,IAAqB,IAAA,EAAM,IAAA,KAAS,OAAA;EACpC,cAAA,IAAkB,KAAA,cAAmB,OAAA;AAAA;AAAA,iBAGzB,UAAA,CAAA;EACd,SAAA;EACA,UAAA;EACA,YAAA;EACA,WAAA;EACA,iBAAA;EACA,cAAA;EACA,QAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"upload-zone.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/upload-zone.client.tsx"],"mappings":";;;;;;;KAWY,eAAA,GAAkB,cAAA,UAC5B,IAAA,CAAK,sBAAA;EACH,SAAA,EAAW,IAAA,CAAK,gBAAA;EAChB,WAAA,GAAc,WAAA;EAEd,iBAAA,IAAqB,IAAA,EAAM,IAAA,KAAS,OAAA;EACpC,cAAA,IAAkB,KAAA,cAAmB,OAAA;AAAA;AAAA,iBAGzB,UAAA,CAAA;EACd,SAAA;EACA,UAAA;EACA,YAAA;EACA,WAAA;EACA,iBAAA;EACA,cAAA;EACA,QAAA;EACA,QAAA;EACA,SAAA;EAAA,GACG;AAAA,GACF,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/modules/storage/components/upload-zone.client.mjs

@@ -9,7 +9,7 @@ import { useCallback } from "react";
 import { useDropzone } from "react-dropzone";
 
 //#region src/modules/storage/components/upload-zone.client.tsx
-function UploadZone({ variables, optimistic, uploadClient, uploadHooks, onUploadCompleted, onUploadFailed, children, className, ...props }) {
+function UploadZone({ variables, optimistic, uploadClient, uploadHooks, onUploadCompleted, onUploadFailed, disabled = false, children, className, ...props }) {
 	/**
 	* Delete mutation
 	*/
@@ -76,7 +76,8 @@ function UploadZone({ variables, optimistic, uploadClient, uploadHooks, onUpload
 			if (acceptedFiles.length === 0) return;
 			await Promise.allSettled(acceptedFiles.map(onUpload));
 		}, [onUpload]),
-		noClick: true
+		noClick: true,
+		disabled
 	});
 	return /* @__PURE__ */ jsxs("div", {
 		...props,
@@ -84,13 +85,14 @@ function UploadZone({ variables, optimistic, uploadClient, uploadHooks, onUpload
 		className: cn("relative z-0", className),
 		children: [
 			/* @__PURE__ */ jsx("input", { ...getInputProps() }),
-			isDragActive && /* @__PURE__ */ jsx("div", { className: "bg-primary/20 absolute inset-0 z-10 rounded-md opacity-70 backdrop-blur-3xl" }),
+			isDragActive && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10 rounded-md bg-primary/20 opacity-70 backdrop-blur-3xl" }),
 			/* @__PURE__ */ jsx(UploadZoneContext, {
 				value: {
 					uploadClient,
 					onUpload,
 					onRemove: deleteMutation.mutateAsync,
-					optimistic
+					optimistic,
+					disabled
 				},
 				children
 			})

package/dist/modules/storage/components/upload-zone.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"upload-zone.client.mjs","names":[],"sources":["../../../../src/modules/storage/components/upload-zone.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentProps, useCallback } from \"react\";\nimport { useDropzone } from \"react-dropzone\";\nimport { toast } from \"@/components/ui/sonner.client\";\nimport { useAction } from \"@/lib/hooks/use-action\";\nimport { cn } from \"@/lib/utils/cn\";\nimport type { UploadFileRequest, UploadHooks } from \"../lib/create-upload.client\";\nimport type { FileNode, Node, UploadFileSchema } from \"../lib/validators\";\nimport { UploadZoneContext, type UploadZoneContextValue } from \"./upload-zone-context.client\";\n\nexport type UploadZoneProps = ComponentProps<\"div\"> &\n  Pick<UploadZoneContextValue, \"optimistic\" | \"uploadClient\"> & {\n    variables: Pick<UploadFileSchema, \"namespace\" | \"parentId\" | \"mode\" | \"hidden\" | \"readonly\">;\n    uploadHooks?: UploadHooks;\n\n    onUploadCompleted?: (node: Node) => Promise<void> | void;\n    onUploadFailed?: (error: unknown) => Promise<void> | void;\n  };\n\nexport function UploadZone({\n  variables,\n  optimistic,\n  uploadClient,\n  uploadHooks,\n  onUploadCompleted,\n  onUploadFailed,\n  children,\n  className,\n  ...props\n}: UploadZoneProps) {\n  /**\n   * Delete mutation\n   */\n  const deleteMutation = useAction({\n    mutationFn: async (ids: string[]) => uploadClient.deleteFiles(ids),\n    onMutate: async (ids) => {\n      await optimistic?.cancel?.();\n      await optimistic?.remove?.(ids);\n    },\n    onError: async (error) => {\n      console.error(\"Delete failed upload error: \", error);\n      await onUploadFailed?.(error);\n    },\n    onSettled: () => {\n      optimistic?.invalidate?.();\n    },\n  });\n\n  /**\n   * Upload mutation\n   */\n  const uploadMutation = useAction({\n    mutationFn: async (params: UploadFileRequest) => uploadClient.upload(params, uploadHooks),\n    onMutate: async (variables) => {\n      // Generate a new node\n      const newNode = {\n        ...variables,\n        type: \"file\",\n        isPending: true,\n      } as FileNode;\n\n      await optimistic?.cancel?.();\n      await optimistic?.add?.(newNode);\n    },\n    onSuccess: async (data) => {\n      await onUploadCompleted?.(data);\n      toast.success(`Succesvol geupload: ${data.name}`);\n    },\n    onError: async (error, variables) => {\n      await onUploadFailed?.(error);\n\n      console.error(\"Upload error: \", error);\n      toast.error(\"Bestand uploaden mislukt\", {\n        description: error instanceof Error ? error.message : undefined,\n      });\n\n      console.info(\"Deleting failed upload\");\n      await deleteMutation.mutateAsync([variables.id]);\n    },\n    onSettled: () => {\n      optimistic?.invalidate?.();\n    },\n  });\n\n  /**\n   * Upload file handler\n   */\n  const onUpload = useCallback(\n    async (file: File) => {\n      console.info(\"Uploading file\", file);\n      const req = uploadClient.prepareUpload({ ...variables, file });\n      return await uploadMutation.mutateAsync(req);\n    },\n    [uploadClient, variables, uploadMutation],\n  );\n\n  /**\n   * Drop handler\n   */\n  const onDrop = useCallback(\n    async (acceptedFiles: File[]) => {\n      if (acceptedFiles.length === 0) return;\n      await Promise.allSettled(acceptedFiles.map(onUpload));\n    },\n    [onUpload],\n  );\n\n  const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop, noClick: true });\n\n  return (\n    <div {...props} {...getRootProps()} className={cn(\"relative z-0\", className)}>\n      <input {...getInputProps()} />\n\n      {/* Show drag overlay when drag is active */}\n      {isDragActive && (\n        <div className=\"bg-primary/20 absolute inset-0 z-10 rounded-md opacity-70 backdrop-blur-3xl\" />\n      )}\n\n      <UploadZoneContext\n        value={{\n          uploadClient,\n          onUpload,\n          onRemove: deleteMutation.mutateAsync,\n          optimistic,\n        }}\n      >\n        {children}\n      </UploadZoneContext>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAoBA,SAAgB,WAAW,EACzB,WACA,YACA,cACA,aACA,mBACA,gBACA,UACA,WACA,GAAG,SACe;;;;CAIlB,MAAM,iBAAiB,UAAU;EAC/B,YAAY,OAAO,QAAkB,aAAa,YAAY,IAAI;EAClE,UAAU,OAAO,QAAQ;AACvB,SAAM,YAAY,UAAU;AAC5B,SAAM,YAAY,SAAS,IAAI;;EAEjC,SAAS,OAAO,UAAU;AACxB,WAAQ,MAAM,gCAAgC,MAAM;AACpD,SAAM,iBAAiB,MAAM;;EAE/B,iBAAiB;AACf,eAAY,cAAc;;EAE7B,CAAC;;;;CAKF,MAAM,iBAAiB,UAAU;EAC/B,YAAY,OAAO,WAA8B,aAAa,OAAO,QAAQ,YAAY;EACzF,UAAU,OAAO,cAAc;GAE7B,MAAM,UAAU;IACd,GAAG;IACH,MAAM;IACN,WAAW;IACZ;AAED,SAAM,YAAY,UAAU;AAC5B,SAAM,YAAY,MAAM,QAAQ;;EAElC,WAAW,OAAO,SAAS;AACzB,SAAM,oBAAoB,KAAK;AAC/B,SAAM,QAAQ,uBAAuB,KAAK,OAAO;;EAEnD,SAAS,OAAO,OAAO,cAAc;AACnC,SAAM,iBAAiB,MAAM;AAE7B,WAAQ,MAAM,kBAAkB,MAAM;AACtC,SAAM,MAAM,4BAA4B,EACtC,aAAa,iBAAiB,QAAQ,MAAM,UAAU,QACvD,CAAC;AAEF,WAAQ,KAAK,yBAAyB;AACtC,SAAM,eAAe,YAAY,CAAC,UAAU,GAAG,CAAC;;EAElD,iBAAiB;AACf,eAAY,cAAc;;EAE7B,CAAC;;;;CAKF,MAAM,WAAW,YACf,OAAO,SAAe;AACpB,UAAQ,KAAK,kBAAkB,KAAK;EACpC,MAAM,MAAM,aAAa,cAAc;GAAE,GAAG;GAAW;GAAM,CAAC;AAC9D,SAAO,MAAM,eAAe,YAAY,IAAI;IAE9C;EAAC;EAAc;EAAW;EAAe,CAC1C;CAaD,MAAM,EAAE,cAAc,eAAe,iBAAiB,YAAY;EAAE,QARrD,YACb,OAAO,kBAA0B;AAC/B,OAAI,cAAc,WAAW,EAAG;AAChC,SAAM,QAAQ,WAAW,cAAc,IAAI,SAAS,CAAC;KAEvD,CAAC,SAAS,CACX;EAE2E,SAAS;EAAM,CAAC;AAE5F,QACE,qBAAC;EAAI,GAAI;EAAO,GAAI,cAAc;EAAE,WAAW,GAAG,gBAAgB,UAAU;;GAC1E,oBAAC,WAAM,GAAI,eAAe,GAAI;GAG7B,gBACC,oBAAC,SAAI,WAAU,gFAAgF;GAGjG,oBAAC;IACC,OAAO;KACL;KACA;KACA,UAAU,eAAe;KACzB;KACD;IAEA;KACiB;;GAChB"}
+{"version":3,"file":"upload-zone.client.mjs","names":[],"sources":["../../../../src/modules/storage/components/upload-zone.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { type ComponentProps, useCallback } from \"react\";\nimport { useDropzone } from \"react-dropzone\";\nimport { toast } from \"@/components/ui/sonner.client\";\nimport { useAction } from \"@/lib/hooks/use-action\";\nimport { cn } from \"@/lib/utils/cn\";\nimport type { UploadFileRequest, UploadHooks } from \"../lib/create-upload.client\";\nimport type { FileNode, Node, UploadFileSchema } from \"../lib/validators\";\nimport { UploadZoneContext, type UploadZoneContextValue } from \"./upload-zone-context.client\";\n\nexport type UploadZoneProps = ComponentProps<\"div\"> &\n  Pick<UploadZoneContextValue, \"optimistic\" | \"uploadClient\" | \"disabled\"> & {\n    variables: Pick<UploadFileSchema, \"namespace\" | \"parentId\" | \"mode\" | \"hidden\" | \"readonly\">;\n    uploadHooks?: UploadHooks;\n\n    onUploadCompleted?: (node: Node) => Promise<void> | void;\n    onUploadFailed?: (error: unknown) => Promise<void> | void;\n  };\n\nexport function UploadZone({\n  variables,\n  optimistic,\n  uploadClient,\n  uploadHooks,\n  onUploadCompleted,\n  onUploadFailed,\n  disabled = false,\n  children,\n  className,\n  ...props\n}: UploadZoneProps) {\n  /**\n   * Delete mutation\n   */\n  const deleteMutation = useAction({\n    mutationFn: async (ids: string[]) => uploadClient.deleteFiles(ids),\n    onMutate: async (ids) => {\n      await optimistic?.cancel?.();\n      await optimistic?.remove?.(ids);\n    },\n    onError: async (error) => {\n      console.error(\"Delete failed upload error: \", error);\n      await onUploadFailed?.(error);\n    },\n    onSettled: () => {\n      optimistic?.invalidate?.();\n    },\n  });\n\n  /**\n   * Upload mutation\n   */\n  const uploadMutation = useAction({\n    mutationFn: async (params: UploadFileRequest) => uploadClient.upload(params, uploadHooks),\n    onMutate: async (variables) => {\n      // Generate a new node\n      const newNode = {\n        ...variables,\n        type: \"file\",\n        isPending: true,\n      } as FileNode;\n\n      await optimistic?.cancel?.();\n      await optimistic?.add?.(newNode);\n    },\n    onSuccess: async (data) => {\n      await onUploadCompleted?.(data);\n      toast.success(`Succesvol geupload: ${data.name}`);\n    },\n    onError: async (error, variables) => {\n      await onUploadFailed?.(error);\n\n      console.error(\"Upload error: \", error);\n      toast.error(\"Bestand uploaden mislukt\", {\n        description: error instanceof Error ? error.message : undefined,\n      });\n\n      console.info(\"Deleting failed upload\");\n      await deleteMutation.mutateAsync([variables.id]);\n    },\n    onSettled: () => {\n      optimistic?.invalidate?.();\n    },\n  });\n\n  /**\n   * Upload file handler\n   */\n  const onUpload = useCallback(\n    async (file: File) => {\n      console.info(\"Uploading file\", file);\n      const req = uploadClient.prepareUpload({ ...variables, file });\n      return await uploadMutation.mutateAsync(req);\n    },\n    [uploadClient, variables, uploadMutation],\n  );\n\n  /**\n   * Drop handler\n   */\n  const onDrop = useCallback(\n    async (acceptedFiles: File[]) => {\n      if (acceptedFiles.length === 0) return;\n      await Promise.allSettled(acceptedFiles.map(onUpload));\n    },\n    [onUpload],\n  );\n\n  const { getRootProps, getInputProps, isDragActive } = useDropzone({\n    onDrop,\n    noClick: true,\n    disabled,\n  });\n\n  return (\n    <div {...props} {...getRootProps()} className={cn(\"relative z-0\", className)}>\n      <input {...getInputProps()} />\n\n      {/* Show drag overlay when drag is active */}\n      {isDragActive && (\n        <div className=\"absolute inset-0 z-10 rounded-md bg-primary/20 opacity-70 backdrop-blur-3xl\" />\n      )}\n\n      <UploadZoneContext\n        value={{\n          uploadClient,\n          onUpload,\n          onRemove: deleteMutation.mutateAsync,\n          optimistic,\n          disabled,\n        }}\n      >\n        {children}\n      </UploadZoneContext>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAoBA,SAAgB,WAAW,EACzB,WACA,YACA,cACA,aACA,mBACA,gBACA,WAAW,OACX,UACA,WACA,GAAG,SACe;;;;CAIlB,MAAM,iBAAiB,UAAU;EAC/B,YAAY,OAAO,QAAkB,aAAa,YAAY,IAAI;EAClE,UAAU,OAAO,QAAQ;AACvB,SAAM,YAAY,UAAU;AAC5B,SAAM,YAAY,SAAS,IAAI;;EAEjC,SAAS,OAAO,UAAU;AACxB,WAAQ,MAAM,gCAAgC,MAAM;AACpD,SAAM,iBAAiB,MAAM;;EAE/B,iBAAiB;AACf,eAAY,cAAc;;EAE7B,CAAC;;;;CAKF,MAAM,iBAAiB,UAAU;EAC/B,YAAY,OAAO,WAA8B,aAAa,OAAO,QAAQ,YAAY;EACzF,UAAU,OAAO,cAAc;GAE7B,MAAM,UAAU;IACd,GAAG;IACH,MAAM;IACN,WAAW;IACZ;AAED,SAAM,YAAY,UAAU;AAC5B,SAAM,YAAY,MAAM,QAAQ;;EAElC,WAAW,OAAO,SAAS;AACzB,SAAM,oBAAoB,KAAK;AAC/B,SAAM,QAAQ,uBAAuB,KAAK,OAAO;;EAEnD,SAAS,OAAO,OAAO,cAAc;AACnC,SAAM,iBAAiB,MAAM;AAE7B,WAAQ,MAAM,kBAAkB,MAAM;AACtC,SAAM,MAAM,4BAA4B,EACtC,aAAa,iBAAiB,QAAQ,MAAM,UAAU,QACvD,CAAC;AAEF,WAAQ,KAAK,yBAAyB;AACtC,SAAM,eAAe,YAAY,CAAC,UAAU,GAAG,CAAC;;EAElD,iBAAiB;AACf,eAAY,cAAc;;EAE7B,CAAC;;;;CAKF,MAAM,WAAW,YACf,OAAO,SAAe;AACpB,UAAQ,KAAK,kBAAkB,KAAK;EACpC,MAAM,MAAM,aAAa,cAAc;GAAE,GAAG;GAAW;GAAM,CAAC;AAC9D,SAAO,MAAM,eAAe,YAAY,IAAI;IAE9C;EAAC;EAAc;EAAW;EAAe,CAC1C;CAaD,MAAM,EAAE,cAAc,eAAe,iBAAiB,YAAY;EAChE,QATa,YACb,OAAO,kBAA0B;AAC/B,OAAI,cAAc,WAAW,EAAG;AAChC,SAAM,QAAQ,WAAW,cAAc,IAAI,SAAS,CAAC;KAEvD,CAAC,SAAS,CACX;EAIC,SAAS;EACT;EACD,CAAC;AAEF,QACE,qBAAC;EAAI,GAAI;EAAO,GAAI,cAAc;EAAE,WAAW,GAAG,gBAAgB,UAAU;;GAC1E,oBAAC,WAAM,GAAI,eAAe,GAAI;GAG7B,gBACC,oBAAC,SAAI,WAAU,gFAAgF;GAGjG,oBAAC;IACC,OAAO;KACL;KACA;KACA,UAAU,eAAe;KACzB;KACA;KACD;IAEA;KACiB;;GAChB"}

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@tulip-systems/core",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "type": "module",
   "sideEffects": false,
-  "license": "MIT",
+  "license": "AGPL-3.0",
   "devDependencies": {
     "@types/pg": "^8.16.0",
     "@types/react": "19.2.14",
@@ -27,34 +27,7 @@
     "@orpc/contract": "^1.13.5",
     "@orpc/server": "^1.13.5",
     "@orpc/tanstack-query": "^1.13.5",
-    "@radix-ui/react-accordion": "^1.2.12",
-    "@radix-ui/react-alert-dialog": "^1.1.15",
-    "@radix-ui/react-aspect-ratio": "^1.1.8",
-    "@radix-ui/react-avatar": "^1.1.11",
-    "@radix-ui/react-checkbox": "^1.3.3",
-    "@radix-ui/react-collapsible": "^1.1.12",
-    "@radix-ui/react-context-menu": "^2.2.16",
-    "@radix-ui/react-dialog": "^1.1.15",
-    "@radix-ui/react-dropdown-menu": "^2.1.16",
-    "@radix-ui/react-hover-card": "^1.1.15",
-    "@radix-ui/react-label": "^2.1.8",
-    "@radix-ui/react-menubar": "^1.1.16",
-    "@radix-ui/react-navigation-menu": "^1.2.14",
-    "@radix-ui/react-popover": "^1.1.15",
-    "@radix-ui/react-progress": "^1.1.8",
-    "@radix-ui/react-radio-group": "^1.3.8",
-    "@radix-ui/react-scroll-area": "^1.2.10",
-    "@radix-ui/react-select": "^2.2.6",
-    "@radix-ui/react-separator": "^1.1.8",
-    "@radix-ui/react-slider": "^1.3.6",
-    "@radix-ui/react-slot": "^1.2.4",
-    "@radix-ui/react-switch": "^1.2.6",
-    "@radix-ui/react-tabs": "^1.1.13",
-    "@radix-ui/react-toggle": "^1.1.10",
-    "@radix-ui/react-toggle-group": "^1.1.11",
-    "@radix-ui/react-tooltip": "^1.2.8",
     "@react-email/components": "^1.0.8",
-    "@tailwindcss/typography": "^0.5.19",
     "@tanstack/react-query": "^5.90.21",
     "@tanstack/react-query-devtools": "^5.91.3",
     "@tanstack/react-table": "^8.21.3",
@@ -94,6 +67,7 @@
     "lucide-react": "^0.575.0",
     "motion": "^12.34.3",
     "next-themes": "^0.4.6",
+    "radix-ui": "^1.4.3",
     "react-colorful": "^5.6.1",
     "react-day-picker": "9.13.2",
     "react-dropzone": "^15.0.0",
@@ -119,8 +93,9 @@
     "pg": "8.18.0",
     "react": "19.2.4",
     "react-dom": "19.2.4",
-    "recharts": "3.7.0",
-    "sharp": "^0.34.5"
+    "recharts": "2.15.4",
+    "sharp": "^0.34.5",
+    "@tailwindcss/typography": "^0.5.19"
   },
   "publishConfig": {
     "access": "public"

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

@@ -17,7 +17,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
+} from "@/components/ui/dropdown-menu.client";
 import type { EditorExtensionsConfigResult } from "../lib/extensions";
 import { EditorContext } from "./editor.client";
 
@@ -104,9 +104,9 @@ export function EditorMenuNodes() {
       </DropdownMenuTrigger>
 
       <DropdownMenuContent>
-        {filteredBlocks.map(({ label, icon: Icon, handler }, index) => (
+        {filteredBlocks.map(({ label, icon: Icon, handler }) => (
           <DropdownMenuItem
-            key={index}
+            key={label}
             onClick={() => handler(editor)}
             className="flex items-center gap-2"
           >

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

@@ -13,7 +13,7 @@ import {
 import { type ComponentProps, type PropsWithChildren, useContext } from "react";
 import { Button } from "@/components/ui/button";
 import { ColorPicker } from "@/components/ui/color-picker.client";
-import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover.client";
 import { cn } from "@/lib/entry";
 import { EditorContext } from "./editor.client";
 import { EditorMenuNodes } from "./menu-nodes.client";
@@ -22,7 +22,7 @@ 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)}
+      className={cn("z-10 overflow-auto border-input border-b bg-muted/30 p-2", props.className)}
     >
       <EditorMenuContent>
         <EditorMenuUndoRedo />
@@ -42,7 +42,7 @@ export function EditorMenuBubble(props: ComponentProps<typeof BubbleMenu>) {
       {...props}
       editor={editor}
       options={{ ...props.options, strategy: "fixed" }}
-      className={cn("border-input bg-muted z-10 rounded-lg border p-2", props.className)}
+      className={cn("z-10 rounded-lg border border-input bg-muted p-2", props.className)}
     >
       <EditorMenuContent>
         <EditorMenuMarks />

package/src/components/emails/forget-password-email.tsx

@@ -25,21 +25,21 @@ export function ForgetPasswordEmail({ resetPasswordHref }: ForgetPasswordEmailPr
 
       <Tailwind>
         <Body className="mx-auto my-auto bg-white px-2 font-sans">
-          <Container className="mx-auto my-[40px] max-w-[465px] rounded border border-solid border-[#eaeaea] p-[20px]">
+          <Container className="mx-auto my-[40px] max-w-[465px] rounded border border-[#eaeaea] border-solid p-[20px]">
             <Icons.logo className="w-8" />
 
             <Section className="my-[15px]">
-              <Heading className="mx-0 my-[20px] p-0 text-[24px] font-bold text-black">
+              <Heading className="mx-0 my-[20px] p-0 font-bold text-[24px] text-black">
                 Herstel uw wachtwoord
               </Heading>
 
-              <Text className="text-[14px] leading-[24px] text-black">
+              <Text className="text-[14px] text-black leading-[24px]">
                 Iemand heeft onlangs een wachtwoordwijziging voor uw account gevraagd. Als u dit
                 was, kunt u hier een nieuw wachtwoord instellen:
               </Text>
 
               <Button
-                className="rounded bg-[#000000] px-5 py-3 text-center text-[12px] font-semibold text-white no-underline"
+                className="rounded bg-[#000000] px-5 py-3 text-center font-semibold text-[12px] text-white no-underline"
                 href={resetPasswordHref}
               >
                 Reset password
@@ -47,12 +47,12 @@ export function ForgetPasswordEmail({ resetPasswordHref }: ForgetPasswordEmailPr
             </Section>
 
             <Section>
-              <Text className="text-[12px] leading-[20px] text-black">
+              <Text className="text-[12px] text-black leading-[20px]">
                 Als u uw wachtwoord niet wilt wijzigen of dit niet heeft gevraagd, negeer en
                 verwijder dit bericht gewoon en verwijdert u.
               </Text>
 
-              <Text className="text-[12px] leading-[20px] text-black">
+              <Text className="text-[12px] text-black leading-[20px]">
                 Stuur deze e-mail niet door om uw account veilig te houden.
               </Text>
             </Section>

package/src/components/entry.client.ts

@@ -29,22 +29,38 @@ export * from "./navigation/admin-sidebar-paths.client";
 /**
  * Components UI
  */
+export * from "./ui/accordion.client";
+export * from "./ui/alert-dialog.client";
+export * from "./ui/aspect-ratio.client";
 export * from "./ui/avatar.client";
+export * from "./ui/calendar.client";
+export * from "./ui/carousel.client";
 export * from "./ui/chart.client";
+export * from "./ui/checkbox.client";
 export * from "./ui/collapsible.client";
 export * from "./ui/color-picker.client";
 export * from "./ui/combobox.client";
 export * from "./ui/combobox-dropdown.client";
+export * from "./ui/command.client";
+export * from "./ui/context-menu.client";
 export * from "./ui/date-picker.client";
 export * from "./ui/dialog.client";
 export * from "./ui/drawer.client";
+export * from "./ui/dropdown-menu.client";
+export * from "./ui/field.client";
 export * from "./ui/form.client";
 export * from "./ui/hover-card.client";
+export * from "./ui/input-date-time.client";
+export * from "./ui/input-group.client";
+export * from "./ui/popover.client";
 export * from "./ui/progress.client";
 export * from "./ui/resizable.client";
 export * from "./ui/select.client";
 export * from "./ui/sheet.client";
 export * from "./ui/sidebar.client";
 export * from "./ui/sonner.client";
+export * from "./ui/switch.client";
+export * from "./ui/tabs.client";
+export * from "./ui/toggle.client";
 export * from "./ui/toggle-group.client";
 export * from "./ui/tooltip.client";

package/src/components/entry.ts

@@ -29,34 +29,26 @@ export * from "./lists/data-stack";
 /**
  * Components UI
  */
-export * from "./ui/accordion";
 export * from "./ui/alert";
-export * from "./ui/alert-dialog";
-export * from "./ui/aspect-ratio";
 export * from "./ui/badge";
 export * from "./ui/breadcrumb";
 export * from "./ui/button";
-export * from "./ui/calendar";
+export * from "./ui/button-group";
 export * from "./ui/card";
-export * from "./ui/carousel";
-export * from "./ui/checkbox";
-export * from "./ui/command";
-export * from "./ui/context-menu";
-export * from "./ui/dropdown-menu";
+export * from "./ui/empty";
 export * from "./ui/input";
 export * from "./ui/input-date";
-export * from "./ui/input-date-time";
 export * from "./ui/input-time";
+export * from "./ui/item";
+export * from "./ui/kbd";
 export * from "./ui/label";
+export * from "./ui/loader";
 export * from "./ui/navigation-menu";
 export * from "./ui/pagination";
-export * from "./ui/popover";
 export * from "./ui/radio-group";
 export * from "./ui/scroll-area";
 export * from "./ui/separator";
 export * from "./ui/skeleton";
 export * from "./ui/slider";
-export * from "./ui/switch";
-export * from "./ui/tabs";
+export * from "./ui/spinner";
 export * from "./ui/textarea";
-export * from "./ui/toggle";

package/src/components/header/back-button.client.tsx

@@ -8,7 +8,7 @@ import {
   ContextMenuContent,
   ContextMenuItem,
   ContextMenuTrigger,
-} from "@/components/ui/context-menu";
+} from "@/components/ui/context-menu.client";
 import { cn } from "@/lib/utils/cn";
 
 export function HeaderTopbarBackButton({
@@ -25,7 +25,7 @@ export function HeaderTopbarBackButton({
           variant="ghost"
           onClick={() => router.back()}
           className={cn(
-            "text-muted-foreground hover:text-foreground w-content h-full rounded-none border-r p-0",
+            "h-full w-content rounded-none border-r border-r-border p-0 text-muted-foreground hover:text-foreground",
             className,
           )}
         >

package/src/components/header/bottom-bar.client.tsx

@@ -37,7 +37,7 @@ export function BottomBarLinks({ paths, className, ...props }: BottomBarLinksPro
   return (
     <ul
       {...props}
-      className={cn("px-content flex flex-row items-center gap-6 text-sm font-medium", className)}
+      className={cn("flex flex-row items-center gap-6 px-content font-medium text-sm", className)}
     >
       {paths.map(({ href, name, segment, permission }) => {
         const children = (
@@ -45,7 +45,7 @@ export function BottomBarLinks({ paths, className, ...props }: BottomBarLinksPro
             key={href}
             href={href}
             className={cn(
-              "text-muted-foreground hover:text-foreground w-fit text-nowrap break-keep transition-colors",
+              "w-fit text-nowrap break-keep text-muted-foreground transition-colors hover:text-foreground",
               currentSegment === segment && "text-primary",
             )}
           >

package/src/components/header/breadcrumbs.client.tsx

@@ -14,7 +14,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
+} from "@/components/ui/dropdown-menu.client";
 import { ScrollArea } from "@/components/ui/scroll-area";
 
 export type HeaderBreadcrumb = {

package/src/components/header/header.client.tsx

@@ -3,7 +3,7 @@ import { cn } from "@/lib/utils/cn";
 
 export function Header({ children, className, ...props }: ComponentProps<"header">) {
   return (
-    <header className={cn("bg-sidebar sticky top-0 z-30 backdrop-blur-3xl", className)} {...props}>
+    <header className={cn("sticky top-0 z-30 bg-sidebar backdrop-blur-3xl", className)} {...props}>
       {children}
     </header>
   );

package/src/components/layouts/empty-page.tsx

@@ -27,7 +27,7 @@ export function EmptyPage({ className, children, ...props }: ComponentProps<"div
 
 export function EmptyPageTitle({ className, children, ...props }: ComponentProps<"h2">) {
   return (
-    <h2 className={cn("text-lg font-bold tracking-tight", className)} {...props}>
+    <h2 className={cn("font-bold text-lg tracking-tight", className)} {...props}>
       {children}
     </h2>
   );
@@ -35,7 +35,7 @@ export function EmptyPageTitle({ className, children, ...props }: ComponentProps
 
 export function EmptyPageDescription({ className, children, ...props }: ComponentProps<"p">) {
   return (
-    <p className={cn("text-muted-foreground max-w-[40ch] text-sm", className)} {...props}>
+    <p className={cn("max-w-[40ch] text-muted-foreground text-sm", className)} {...props}>
       {children}
     </p>
   );

package/src/components/layouts/error-page.tsx

@@ -10,7 +10,7 @@ export function ErrorPage({ className, children, ...props }: ComponentProps<"div
     <div
       {...props}
       className={cn(
-        "min-h-120 flex h-full w-full flex-col items-center justify-center gap-y-3 border border-dashed text-center",
+        "flex h-full min-h-120 w-full flex-col items-center justify-center gap-y-3 border border-dashed text-center",
         className,
       )}
     >
@@ -24,7 +24,7 @@ export function ErrorPage({ className, children, ...props }: ComponentProps<"div
  */
 export function ErrorPageCode({ className, children, ...props }: ComponentProps<"h2">) {
   return (
-    <h2 className={cn("text-9xl font-bold leading-none", className)} {...props}>
+    <h2 className={cn("font-bold text-9xl leading-none", className)} {...props}>
       {children}
     </h2>
   );
@@ -55,7 +55,7 @@ export function ErrorPageIcon({
  */
 export function ErrorPageDescription({ className, children, ...props }: ComponentProps<"p">) {
   return (
-    <p className={cn("text-2xl font-bold lg:text-3xl", className)} {...props}>
+    <p className={cn("font-bold text-2xl lg:text-3xl", className)} {...props}>
       {children}
     </p>
   );

package/src/components/layouts/providers.client.tsx

@@ -8,6 +8,7 @@ import type { PropsWithChildren } from "react";
 import { Toaster } from "@/components/ui/sonner.client";
 import { IndicatorContextProvider } from "@/lib/hooks/use-indicator";
 import { getQueryClient } from "@/modules/router/lib/query-client";
+import { TooltipProvider } from "../ui/tooltip.client";
 
 export function Providers({ children }: PropsWithChildren) {
   const queryClient = getQueryClient();
@@ -16,12 +17,14 @@ export function Providers({ children }: PropsWithChildren) {
     <QueryClientProvider client={queryClient}>
       <NuqsAdapter>
         <IndicatorContextProvider>
-          <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-            {children}
+          <TooltipProvider>
+            <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+              {children}
 
-            <Toaster />
-            <ReactQueryDevtools />
-          </ThemeProvider>
+              <Toaster />
+              <ReactQueryDevtools />
+            </ThemeProvider>
+          </TooltipProvider>
         </IndicatorContextProvider>
       </NuqsAdapter>
     </QueryClientProvider>

package/src/components/layouts/root-loading.tsx

@@ -1,9 +1,9 @@
-import { Spinner } from "../ui/spinner";
+import { Loader } from "../ui/loader";
 
 export function RootLoading() {
   return (
     <div className="grid h-dvh w-full place-items-center">
-      <Spinner />
+      <Loader />
     </div>
   );
 }

package/src/components/layouts/tab-layout.tsx

@@ -3,7 +3,7 @@
 import type { Route } from "next";
 import { useRouter, useSelectedLayoutSegment } from "next/navigation";
 import { useState } from "react";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs.client";
 import { Allowed } from "@/modules/auth/components/allowed.client";
 import type { Permission } from "@/modules/auth/lib/permissions";
 import { ListLayout } from "./list-layout";

package/src/components/lists/data-list.tsx

@@ -31,7 +31,7 @@ export type DataListTitleProps = React.HTMLAttributes<HTMLElement>;
 
 export function DataListTitle({ children, className, ...props }: DataListTitleProps) {
   return (
-    <dt {...props} className={cn("text-sm font-semibold leading-6", className)}>
+    <dt {...props} className={cn("font-semibold text-sm leading-6", className)}>
       {children}
     </dt>
   );

package/src/components/lists/data-stack.tsx

@@ -54,7 +54,7 @@ export type DataStackTitleProps = React.HTMLAttributes<HTMLElement>;
 
 export function DataStackTitle({ children, className, ...props }: DataStackTitleProps) {
   return (
-    <dt {...props} className={cn("text-sm font-medium leading-none", className)}>
+    <dt {...props} className={cn("font-medium text-sm leading-none", className)}>
       {children}
     </dt>
   );

package/src/components/navigation/admin-sidebar-header.client.tsx

@@ -24,7 +24,7 @@ import {
   DropdownMenuSubContent,
   DropdownMenuSubTrigger,
   DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
+} from "@/components/ui/dropdown-menu.client";
 import { cn } from "@/lib/utils/cn";
 import { useAuthClient } from "@/modules/auth/hooks/use-auth-client";
 import { useSession } from "@/modules/auth/hooks/use-session";
@@ -54,12 +54,12 @@ export function AdminSidebarHeader() {
                 />
                 <AvatarFallback>{sessionQuery.data?.user.name?.[0] ?? ""}</AvatarFallback>
               </Avatar>
-              <span className="text-md text-muted-foreground font-bold">
+              <span className="font-bold text-md text-muted-foreground">
                 {sessionQuery.data?.user.name}
               </span>
             </div>
 
-            <ChevronsUpDownIcon className="text-muted-foreground h-4 w-4" />
+            <ChevronsUpDownIcon className="h-4 w-4 text-muted-foreground" />
           </Button>
         </DropdownMenuTrigger>
 

package/src/components/navigation/admin-sidebar-skeleton.tsx

@@ -1,6 +1,6 @@
 import { Suspense } from "react";
 import { Button } from "@/components/ui/button";
-import { DropdownMenu, DropdownMenuTrigger } from "@/components/ui/dropdown-menu";
+import { DropdownMenu, DropdownMenuTrigger } from "@/components/ui/dropdown-menu.client";
 import {
   SidebarHeader,
   SidebarMenu,

package/src/components/navigation/admin-sidebar.client.tsx

@@ -29,6 +29,7 @@ import {
 
 /**
  * AdminSidebar
+ * @deprecated
  */
 export function AdminSidebar({
   paths,

package/src/components/ui/accordion.client.tsx

@@ -0,0 +1,83 @@
+"use client";
+
+import { ChevronDownIcon, ChevronUpIcon } from "lucide-react";
+import { Accordion as AccordionPrimitive } from "radix-ui";
+import type * as React from "react";
+import { cn } from "@/lib/utils/cn";
+
+function Accordion({ className, ...props }: React.ComponentProps<typeof AccordionPrimitive.Root>) {
+  return (
+    <AccordionPrimitive.Root
+      data-slot="accordion"
+      className={cn("flex w-full flex-col", className)}
+      {...props}
+    />
+  );
+}
+
+function AccordionItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof AccordionPrimitive.Item>) {
+  return (
+    <AccordionPrimitive.Item
+      data-slot="accordion-item"
+      className={cn("not-last:border-b", className)}
+      {...props}
+    />
+  );
+}
+
+function AccordionTrigger({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {
+  return (
+    <AccordionPrimitive.Header className="flex">
+      <AccordionPrimitive.Trigger
+        data-slot="accordion-trigger"
+        className={cn(
+          "group/accordion-trigger relative flex flex-1 items-start justify-between rounded-lg border border-transparent py-2.5 text-left font-medium text-sm outline-none transition-all hover:underline focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:after:border-ring disabled:pointer-events-none disabled:opacity-50 **:data-[slot=accordion-trigger-icon]:ml-auto **:data-[slot=accordion-trigger-icon]:size-4 **:data-[slot=accordion-trigger-icon]:text-muted-foreground",
+          className,
+        )}
+        {...props}
+      >
+        {children}
+        <ChevronDownIcon
+          data-slot="accordion-trigger-icon"
+          className="pointer-events-none shrink-0 group-aria-expanded/accordion-trigger:hidden"
+        />
+        <ChevronUpIcon
+          data-slot="accordion-trigger-icon"
+          className="pointer-events-none hidden shrink-0 group-aria-expanded/accordion-trigger:inline"
+        />
+      </AccordionPrimitive.Trigger>
+    </AccordionPrimitive.Header>
+  );
+}
+
+function AccordionContent({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof AccordionPrimitive.Content>) {
+  return (
+    <AccordionPrimitive.Content
+      data-slot="accordion-content"
+      className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+      {...props}
+    >
+      <div
+        className={cn(
+          "pt-0 pb-2.5 [&_a]:underline [&_a]:underline-offset-3 [&_a]:hover:text-foreground [&_p:not(:last-child)]:mb-4",
+          className,
+        )}
+      >
+        {children}
+      </div>
+    </AccordionPrimitive.Content>
+  );
+}
+
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };