@tulip-systems/core 0.5.1 → 0.5.3

package/dist/modules/inline-edit/hooks/use-inline.client.mjs

@@ -1,51 +1,113 @@
 "use client";
 
+import { useLocalIndicator } from "../../../lib/hooks/use-indicator.mjs";
 import { useAction } from "../../../lib/hooks/use-action.mjs";
 import { usePermission } from "../../auth/hooks/use-permission.mjs";
 import { useInlineEditContext } from "./context.client.mjs";
-import { useState } from "react";
+import { useCallback, useState } from "react";
 import { toast } from "sonner";
+import { useDebouncedCallback } from "use-debounce";
 
 //#region src/modules/inline-edit/hooks/use-inline.client.tsx
+const defaultUpdateStrategy = { mode: "blur" };
+/**
+* Use the inline edit hook.
+*/
 function useInlineEdit(props) {
+	/**
+	* The update strategy.
+	*/
+	const strategy = props.updateStrategy ?? defaultUpdateStrategy;
+	const delay = strategy.mode === "change" ? strategy.delay ?? 0 : 0;
 	/**
 	* The inline edit context.
 	*/
 	const context = useInlineEditContext();
-	const { data } = usePermission(props.permission ?? context.permission);
-	const isAllowed = data?.success;
 	/**
 	* The current value of the inline edit.
 	*/
 	const [value, setValue] = useState(props.initialValue);
 	/**
+	* The indicator status.
+	*/
+	const { status, setStatus } = useLocalIndicator();
+	/**
+	* Permission guard
+	*/
+	const { data } = usePermission(props.permission ?? context.permission);
+	const isAllowed = data?.success;
+	/**
 	* Execute the action to update the value.
 	*/
-	const { mutate, status } = useAction({
+	const mutation = useAction({
 		mutationFn: props.action,
+		onMutate: () => {
+			setStatus("pending");
+		},
+		onSuccess: () => {
+			setStatus("success");
+		},
 		onError: (error) => {
 			setValue(props.initialValue);
 			toast.error("Er is iets misgegaan", { description: error instanceof Error ? error.message : void 0 });
 		}
 	});
 	/**
-	* Handle the update of the value.
+	* Handle instant mutate
 	*/
-	const handleUpdate = (value$1) => {
+	const handleMutateInstant = useCallback((value$1) => {
 		if (!isAllowed) {
 			toast.error("Je hebt geen toestemming om dit te bewerken");
 			return;
 		}
 		if (value$1 === props.initialValue) return;
-		return mutate({
+		return mutation.mutate({
 			id: context.id,
 			value: value$1
 		});
-	};
+	}, [
+		isAllowed,
+		props.initialValue,
+		mutation,
+		context.id
+	]);
+	/**
+	* Handle mutate with debounce
+	*/
+	const handleMutateDebounced = useDebouncedCallback(handleMutateInstant, delay);
+	/**
+	* Handle change updates
+	*/
+	function handleChange(next) {
+		setValue(next ?? void 0);
+		if (strategy.mode !== "change") return;
+		if (props.isRequired && next === null) {
+			setValue(props.initialValue ?? void 0);
+			setStatus("error");
+			toast.error("Dit veld is verplicht");
+			return;
+		}
+		handleMutateDebounced(next);
+	}
+	/**
+	* Handle blur updates
+	*/
+	function handleBlur(next) {
+		setValue(next ?? void 0);
+		if (strategy.mode !== "blur") return;
+		if (props.isRequired && next === null) {
+			setValue(props.initialValue ?? void 0);
+			setStatus("error");
+			toast.error("Dit veld is verplicht");
+			return;
+		}
+		handleMutateInstant(next);
+	}
 	return {
 		value,
 		setValue,
-		handleUpdate,
+		handleChange,
+		handleBlur,
 		status,
 		isAllowed
 	};

package/dist/modules/inline-edit/hooks/use-inline.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-inline.client.mjs","names":["value"],"sources":["../../../../src/modules/inline-edit/hooks/use-inline.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { EditorJSONContent } from \"@/components/entry\";\nimport { useAction } from \"@/lib/hooks/use-action\";\nimport { usePermission } from \"@/modules/auth/hooks/use-permission\";\nimport { Permission } from \"@/modules/auth/lib/permissions\";\nimport { useState } from \"react\";\nimport { toast } from \"sonner\";\nimport { useInlineEditContext } from \"./context.client\";\n\nexport type useInlineEditOptions<TValue> = {\n  initialValue?: TValue;\n  action: (value: { id: string; value: TValue }) => Promise<unknown>;\n  permission?: Permission;\n};\n\nexport function useInlineEdit<\n  TValue extends string | number | Date | boolean | JSON | EditorJSONContent | undefined,\n>(props: useInlineEditOptions<TValue>) {\n  /**\n   * The inline edit context.\n   */\n  const context = useInlineEditContext();\n\n  const { data } = usePermission(props.permission ?? context.permission);\n  const isAllowed = data?.success;\n\n  /**\n   * The current value of the inline edit.\n   */\n  const [value, setValue] = useState(props.initialValue);\n\n  /**\n   * Execute the action to update the value.\n   */\n  const { mutate, status } = useAction({\n    mutationFn: props.action,\n    onError: (error) => {\n      setValue(props.initialValue);\n      toast.error(\"Er is iets misgegaan\", {\n        description: error instanceof Error ? error.message : undefined,\n      });\n    },\n  });\n\n  /**\n   * Handle the update of the value.\n   */\n  const handleUpdate = (value: TValue) => {\n    if (!isAllowed) {\n      toast.error(\"Je hebt geen toestemming om dit te bewerken\");\n      return;\n    }\n\n    // If the value is the same as the initial value, do nothing\n    if (value === props.initialValue) return;\n\n    return mutate({ id: context.id, value });\n  };\n\n  return { value, setValue, handleUpdate, status, isAllowed };\n}\n"],"mappings":";;;;;;;;;AAgBA,SAAgB,cAEd,OAAqC;;;;CAIrC,MAAM,UAAU,sBAAsB;CAEtC,MAAM,EAAE,SAAS,cAAc,MAAM,cAAc,QAAQ,WAAW;CACtE,MAAM,YAAY,MAAM;;;;CAKxB,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM,aAAa;;;;CAKtD,MAAM,EAAE,QAAQ,WAAW,UAAU;EACnC,YAAY,MAAM;EAClB,UAAU,UAAU;AAClB,YAAS,MAAM,aAAa;AAC5B,SAAM,MAAM,wBAAwB,EAClC,aAAa,iBAAiB,QAAQ,MAAM,UAAU,QACvD,CAAC;;EAEL,CAAC;;;;CAKF,MAAM,gBAAgB,YAAkB;AACtC,MAAI,CAAC,WAAW;AACd,SAAM,MAAM,8CAA8C;AAC1D;;AAIF,MAAIA,YAAU,MAAM,aAAc;AAElC,SAAO,OAAO;GAAE,IAAI,QAAQ;GAAI;GAAO,CAAC;;AAG1C,QAAO;EAAE;EAAO;EAAU;EAAc;EAAQ;EAAW"}
+{"version":3,"file":"use-inline.client.mjs","names":["defaultUpdateStrategy: UpdateStrategy","value"],"sources":["../../../../src/modules/inline-edit/hooks/use-inline.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { EditorJSONContent } from \"@/components/entry\";\nimport { useLocalIndicator } from \"@/lib/entry.client\";\nimport { useAction } from \"@/lib/hooks/use-action\";\nimport { usePermission } from \"@/modules/auth/hooks/use-permission\";\nimport { Permission } from \"@/modules/auth/lib/permissions\";\nimport { useCallback, useState } from \"react\";\nimport { toast } from \"sonner\";\nimport { useDebouncedCallback } from \"use-debounce\";\nimport { useInlineEditContext } from \"./context.client\";\n\ntype UpdateStrategy =\n  | {\n      mode: \"change\";\n      delay?: number;\n    }\n  | {\n      mode: \"blur\";\n    };\n\nconst defaultUpdateStrategy: UpdateStrategy = {\n  mode: \"blur\",\n};\n\ntype MaybeValue<TValue, Required extends boolean> = Required extends true ? TValue : TValue | null;\n\n/**\n * Use the inline edit hook options.\n */\nexport type useInlineEditOptions<TValue, Required extends boolean = false> = {\n  /**\n   * Initial value\n   */\n  initialValue?: MaybeValue<TValue, Required>;\n  /**\n   * Action to execute on update\n   */\n  action: (value: { id: string; value: MaybeValue<TValue, Required> }) => Promise<unknown>;\n  /**\n   * Permission required to edit\n   */\n  permission?: Permission;\n  /**\n   * Update strategy\n   * - trigger: when to update the value (default: \"blur\")\n   * - delay: delay in milliseconds before updating the value (only for \"change\" trigger)\n   * @default { trigger: \"blur\" }\n   */\n  updateStrategy?: UpdateStrategy;\n  /**\n   * Is the value required\n   * @default false\n   */\n  isRequired?: Required;\n};\n\n/**\n * Use the inline edit hook.\n */\nexport function useInlineEdit<\n  TValue extends string | number | Date | boolean | JSON | EditorJSONContent,\n  Required extends boolean = false,\n>(props: useInlineEditOptions<TValue, Required>) {\n  /**\n   * The update strategy.\n   */\n  const strategy = props.updateStrategy ?? defaultUpdateStrategy;\n  const delay = strategy.mode === \"change\" ? (strategy.delay ?? 0) : 0;\n\n  /**\n   * The inline edit context.\n   */\n  const context = useInlineEditContext();\n\n  /**\n   * The current value of the inline edit.\n   */\n  const [value, setValue] = useState<MaybeValue<TValue, Required> | undefined>(props.initialValue);\n\n  /**\n   * The indicator status.\n   */\n  const { status, setStatus } = useLocalIndicator();\n\n  /**\n   * Permission guard\n   */\n  const { data } = usePermission(props.permission ?? context.permission);\n  const isAllowed = data?.success;\n\n  /**\n   * Execute the action to update the value.\n   */\n  const mutation = useAction({\n    mutationFn: props.action,\n    onMutate: () => {\n      setStatus(\"pending\");\n    },\n    onSuccess: () => {\n      setStatus(\"success\");\n    },\n    onError: (error) => {\n      setValue(props.initialValue);\n      toast.error(\"Er is iets misgegaan\", {\n        description: error instanceof Error ? error.message : undefined,\n      });\n    },\n  });\n\n  /**\n   * Handle instant mutate\n   */\n  const handleMutateInstant = useCallback(\n    (value: MaybeValue<TValue, Required>) => {\n      // Permission guard\n      if (!isAllowed) {\n        toast.error(\"Je hebt geen toestemming om dit te bewerken\");\n        return;\n      }\n\n      // If the value is the same as the initial value, do nothing\n      if (value === props.initialValue) return;\n\n      // Update the value\n      return mutation.mutate({ id: context.id, value });\n    },\n    [isAllowed, props.initialValue, mutation, context.id],\n  );\n\n  /**\n   * Handle mutate with debounce\n   */\n  const handleMutateDebounced = useDebouncedCallback(handleMutateInstant, delay);\n\n  /**\n   * Handle change updates\n   */\n  function handleChange(next: MaybeValue<TValue, Required> | null) {\n    // Set value in state\n    setValue(next ?? undefined);\n\n    // If the strategy is not change, exit\n    if (strategy.mode !== \"change\") return;\n\n    // If it is required and the value is null or empty, reset to initial value\n    if (props.isRequired && next === null) {\n      setValue(props.initialValue ?? undefined);\n      setStatus(\"error\");\n      toast.error(\"Dit veld is verplicht\");\n      return;\n    }\n\n    // If the strategy is change, update the value after the delay\n    handleMutateDebounced(next as MaybeValue<TValue, Required>);\n  }\n\n  /**\n   * Handle blur updates\n   */\n  function handleBlur(next: MaybeValue<TValue, Required> | null) {\n    // Set value in state\n    setValue(next ?? undefined);\n\n    // If the strategy is not blur, exit\n    if (strategy.mode !== \"blur\") return;\n\n    // If it is required and the value is null or empty, reset to initial value\n    if (props.isRequired && next === null) {\n      setValue(props.initialValue ?? undefined);\n      setStatus(\"error\");\n      toast.error(\"Dit veld is verplicht\");\n      return;\n    }\n\n    // If the strategy is blur, update the value\n    handleMutateInstant(next as MaybeValue<TValue, Required>);\n  }\n\n  return { value, setValue, handleChange, handleBlur, status, isAllowed };\n}\n"],"mappings":";;;;;;;;;;;AAqBA,MAAMA,wBAAwC,EAC5C,MAAM,QACP;;;;AAqCD,SAAgB,cAGd,OAA+C;;;;CAI/C,MAAM,WAAW,MAAM,kBAAkB;CACzC,MAAM,QAAQ,SAAS,SAAS,WAAY,SAAS,SAAS,IAAK;;;;CAKnE,MAAM,UAAU,sBAAsB;;;;CAKtC,MAAM,CAAC,OAAO,YAAY,SAAmD,MAAM,aAAa;;;;CAKhG,MAAM,EAAE,QAAQ,cAAc,mBAAmB;;;;CAKjD,MAAM,EAAE,SAAS,cAAc,MAAM,cAAc,QAAQ,WAAW;CACtE,MAAM,YAAY,MAAM;;;;CAKxB,MAAM,WAAW,UAAU;EACzB,YAAY,MAAM;EAClB,gBAAgB;AACd,aAAU,UAAU;;EAEtB,iBAAiB;AACf,aAAU,UAAU;;EAEtB,UAAU,UAAU;AAClB,YAAS,MAAM,aAAa;AAC5B,SAAM,MAAM,wBAAwB,EAClC,aAAa,iBAAiB,QAAQ,MAAM,UAAU,QACvD,CAAC;;EAEL,CAAC;;;;CAKF,MAAM,sBAAsB,aACzB,YAAwC;AAEvC,MAAI,CAAC,WAAW;AACd,SAAM,MAAM,8CAA8C;AAC1D;;AAIF,MAAIC,YAAU,MAAM,aAAc;AAGlC,SAAO,SAAS,OAAO;GAAE,IAAI,QAAQ;GAAI;GAAO,CAAC;IAEnD;EAAC;EAAW,MAAM;EAAc;EAAU,QAAQ;EAAG,CACtD;;;;CAKD,MAAM,wBAAwB,qBAAqB,qBAAqB,MAAM;;;;CAK9E,SAAS,aAAa,MAA2C;AAE/D,WAAS,QAAQ,OAAU;AAG3B,MAAI,SAAS,SAAS,SAAU;AAGhC,MAAI,MAAM,cAAc,SAAS,MAAM;AACrC,YAAS,MAAM,gBAAgB,OAAU;AACzC,aAAU,QAAQ;AAClB,SAAM,MAAM,wBAAwB;AACpC;;AAIF,wBAAsB,KAAqC;;;;;CAM7D,SAAS,WAAW,MAA2C;AAE7D,WAAS,QAAQ,OAAU;AAG3B,MAAI,SAAS,SAAS,OAAQ;AAG9B,MAAI,MAAM,cAAc,SAAS,MAAM;AACrC,YAAS,MAAM,gBAAgB,OAAU;AACzC,aAAU,QAAQ;AAClB,SAAM,MAAM,wBAAwB;AACpC;;AAIF,sBAAoB,KAAqC;;AAG3D,QAAO;EAAE;EAAO;EAAU;EAAc;EAAY;EAAQ;EAAW"}

package/dist/modules/inline-edit/lib/variants.d.mts

@@ -4,6 +4,7 @@ import * as class_variance_authority_types6 from "class-variance-authority/types
 //#region src/modules/inline-edit/lib/variants.d.ts
 declare const inlineEditVariants: (props?: ({
   variant?: "default" | "table" | null | undefined;
+  status?: "success" | "error" | "idle" | "pending" | null | undefined;
 } & class_variance_authority_types6.ClassProp) | undefined) => string;
 type InlineEditVariantsProps = VariantProps<typeof inlineEditVariants>;
 //#endregion

package/dist/modules/inline-edit/lib/variants.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"variants.d.mts","names":[],"sources":["../../../../src/modules/inline-edit/lib/variants.ts"],"sourcesContent":[],"mappings":";;;;cAEa;;IAWX,+BAAA,CAAA;AAXW,KAaD,uBAAA,GAA0B,YAFpC,CAAA,OAEwD,kBAFxD,CAAA"}
+{"version":3,"file":"variants.d.mts","names":[],"sources":["../../../../src/modules/inline-edit/lib/variants.ts"],"sourcesContent":[],"mappings":";;;;cAEa,0BAkBX;;;AAlBF,CAAA,GAkBE,+BAAA,CAAA,SAAA,CAAA,GAAA,SAAA,EAAA,GAAA,MAAA;AAEU,KAAA,uBAAA,GAA0B,YAAoB,CAAA,OAAA,kBAAR,CAAA"}

package/dist/modules/inline-edit/lib/variants.mjs

@@ -2,10 +2,18 @@ import { cva } from "class-variance-authority";
 
 //#region src/modules/inline-edit/lib/variants.ts
 const inlineEditVariants = cva("", {
-	variants: { variant: {
-		default: "",
-		table: "min-h-9 px-3 py-1 text-base md:text-sm rounded-none h-full w-full border-none outline-none ring-0 focus:border-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0"
-	} },
+	variants: {
+		variant: {
+			default: "",
+			table: "min-h-9 px-3 py-1 text-base md:text-sm rounded-none h-full w-full border-none outline-none ring-0 focus:border-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0"
+		},
+		status: {
+			idle: "",
+			pending: "opacity-70 animate-pulse",
+			success: "",
+			error: "border-destructive text-destructive"
+		}
+	},
 	defaultVariants: { variant: "default" }
 });
 

package/dist/modules/inline-edit/lib/variants.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"variants.mjs","names":[],"sources":["../../../../src/modules/inline-edit/lib/variants.ts"],"sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\n\nexport const inlineEditVariants = cva(\"\", {\n  variants: {\n    variant: {\n      default: \"\",\n      table:\n        \"min-h-9 px-3 py-1 text-base md:text-sm rounded-none h-full w-full border-none outline-none ring-0 focus:border-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n  },\n});\n\nexport type InlineEditVariantsProps = VariantProps<typeof inlineEditVariants>;\n"],"mappings":";;;AAEA,MAAa,qBAAqB,IAAI,IAAI;CACxC,UAAU,EACR,SAAS;EACP,SAAS;EACT,OACE;EACH,EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACF,CAAC"}
+{"version":3,"file":"variants.mjs","names":[],"sources":["../../../../src/modules/inline-edit/lib/variants.ts"],"sourcesContent":["import { cva, VariantProps } from \"class-variance-authority\";\n\nexport const inlineEditVariants = cva(\"\", {\n  variants: {\n    variant: {\n      default: \"\",\n      table:\n        \"min-h-9 px-3 py-1 text-base md:text-sm rounded-none h-full w-full border-none outline-none ring-0 focus:border-0 focus:outline-none focus:ring-0 focus:ring-offset-0 focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-offset-0\",\n    },\n    status: {\n      idle: \"\",\n      pending: \"opacity-70 animate-pulse\",\n      success: \"\",\n      error: \"border-destructive text-destructive\",\n    },\n  },\n  defaultVariants: {\n    variant: \"default\",\n    // status: \"idle\",\n  },\n});\n\nexport type InlineEditVariantsProps = VariantProps<typeof inlineEditVariants>;\n"],"mappings":";;;AAEA,MAAa,qBAAqB,IAAI,IAAI;CACxC,UAAU;EACR,SAAS;GACP,SAAS;GACT,OACE;GACH;EACD,QAAQ;GACN,MAAM;GACN,SAAS;GACT,SAAS;GACT,OAAO;GACR;EACF;CACD,iBAAiB,EACf,SAAS,WAEV;CACF,CAAC"}

package/dist/modules/router/handler/init.server.d.mts

@@ -8,19 +8,19 @@ import { AuthClient } from "../../auth/handler/init.mjs";
 import "../../../auth/server.mjs";
 import { ProtectedRPCContext, RPCContext } from "./context.server.mjs";
 import "server-cli-only";
-import * as _orpc_server29 from "@orpc/server";
+import * as _orpc_server0 from "@orpc/server";
 import * as next_dist_server_web_spec_extension_adapters_headers0 from "next/dist/server/web/spec-extension/adapters/headers";
-import * as _orpc_contract2 from "@orpc/contract";
+import * as _orpc_contract0 from "@orpc/contract";
 
 //#region src/modules/router/handler/init.server.d.ts
 /**
  * Initialize TRPC
  */
 declare function initRPC<TSchema extends TDatabaseSchema>(): {
-  publicProcedure: _orpc_server29.Builder<RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema>, _orpc_contract2.Schema<unknown, unknown>, _orpc_contract2.Schema<unknown, unknown>, Record<never, never>, Record<never, never>>;
-  protectedProcedure: _orpc_server29.BuilderWithMiddlewares<_orpc_server29.MergedInitialContext<RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema>>, _orpc_server29.MergedCurrentContext<RPCContext<TSchema>, ProtectedRPCContext<TSchema>>, _orpc_contract2.Schema<unknown, unknown>, _orpc_contract2.Schema<unknown, unknown>, Record<never, never>, Record<never, never>>;
-  authMiddleware: _orpc_server29.DecoratedMiddleware<RPCContext<TSchema> & Record<never, never>, ProtectedRPCContext<TSchema>, unknown, any, any, Record<never, never>>;
-  permissionMiddleware: (permission: Permission) => _orpc_server29.DecoratedMiddleware<{
+  publicProcedure: _orpc_server0.Builder<RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema>, _orpc_contract0.Schema<unknown, unknown>, _orpc_contract0.Schema<unknown, unknown>, Record<never, never>, Record<never, never>>;
+  protectedProcedure: _orpc_server0.BuilderWithMiddlewares<_orpc_server0.MergedInitialContext<RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema> & Record<never, never>, RPCContext<TSchema>>, _orpc_server0.MergedCurrentContext<RPCContext<TSchema>, ProtectedRPCContext<TSchema>>, _orpc_contract0.Schema<unknown, unknown>, _orpc_contract0.Schema<unknown, unknown>, Record<never, never>, Record<never, never>>;
+  authMiddleware: _orpc_server0.DecoratedMiddleware<RPCContext<TSchema> & Record<never, never>, ProtectedRPCContext<TSchema>, unknown, any, any, Record<never, never>>;
+  permissionMiddleware: (permission: Permission) => _orpc_server0.DecoratedMiddleware<{
     session: {
       session: {
         id: string;

package/dist/modules/router/handler/init.server.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"init.server.d.mts","names":[],"sources":["../../../../src/modules/router/handler/init.server.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;;;;;iBAWgB,wBAAwB;;;;qCAwBI,8BAAU;;;;QAxB/B,SAAA,MAAA;QAAiB,SAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAwBI,SAAA,MAAA"}
+{"version":3,"file":"init.server.d.mts","names":[],"sources":["../../../../src/modules/router/handler/init.server.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;;;;;;iBAWgB,wBAAwB;;;;qCAwBI,6BAAU;;;;QAxB/B,SAAA,MAAA;QAAiB,SAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAwBI,SAAA,MAAA"}

package/dist/modules/router/lib/query-client.server.d.mts

@@ -1,5 +1,5 @@
 import { createQueryClient } from "./query-client.mjs";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import "server-cli-only";
 
 //#region src/modules/router/lib/query-client.server.d.ts
@@ -12,7 +12,7 @@ declare const getQueryClient: typeof createQueryClient;
  */
 declare function HydrateClient(props: {
   children: React.ReactNode;
-}): react_jsx_runtime1.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 //#endregion
 export { HydrateClient, getQueryClient };
 //# sourceMappingURL=query-client.server.d.mts.map

package/dist/modules/storage/components/dropzone-context.client.d.mts

@@ -1,4 +1,4 @@
-import * as react0 from "react";
+import * as react98 from "react";
 import { DropzoneOptions } from "react-dropzone";
 
 //#region src/modules/storage/components/dropzone-context.client.d.ts
@@ -9,7 +9,7 @@ type DropzoneContextType = {
   minSize?: DropzoneOptions["minSize"];
   maxFiles?: DropzoneOptions["maxFiles"];
 };
-declare const DropzoneContext: react0.Context<DropzoneContextType | undefined>;
+declare const DropzoneContext: react98.Context<DropzoneContextType | undefined>;
 /**
  * Dropzone context hook
  */

package/dist/modules/storage/components/dropzone-context.client.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-context.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/dropzone-context.client.tsx"],"sourcesContent":[],"mappings":";;;;KAKK,mBAAA;QACG;WACG;EAFN,OAAA,CAAA,EAGO,eAHY,CAAA,SAAA,CAAA;EAChB,OAAA,CAAA,EAGI,eAHJ,CAAA,SAAA,CAAA;EACG,QAAA,CAAA,EAGE,eAHF,CAAA,UAAA,CAAA;CACC;AACA,cAIC,eAJD,EAIgB,MAAA,CAAA,OAJhB,CAIgB,mBAJhB,GAAA,SAAA,CAAA;;;AAIZ;AAKgB,iBAAA,kBAAA,CAAA,CAAkB,EAAA,mBAAA"}
+{"version":3,"file":"dropzone-context.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/dropzone-context.client.tsx"],"sourcesContent":[],"mappings":";;;;KAKK,mBAAA;QACG;WACG;EAFN,OAAA,CAAA,EAGO,eAHY,CAAA,SAAA,CAAA;EAChB,OAAA,CAAA,EAGI,eAHJ,CAAA,SAAA,CAAA;EACG,QAAA,CAAA,EAGE,eAHF,CAAA,UAAA,CAAA;CACC;AACA,cAIC,eAJD,EAIgB,OAAA,CAAA,OAJhB,CAIgB,mBAJhB,GAAA,SAAA,CAAA;;;AAIZ;AAKgB,iBAAA,kBAAA,CAAA,CAAkB,EAAA,mBAAA"}

package/dist/modules/storage/components/dropzone.client.d.mts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
-import * as react0 from "react";
+import * as react_jsx_runtime240 from "react/jsx-runtime";
+import * as react99 from "react";
 import { ReactNode } from "react";
 import { DropEvent, DropzoneOptions, FileRejection } from "react-dropzone";
 
@@ -25,7 +25,7 @@ declare function Dropzone({
   className,
   children,
   ...props
-}: DropzoneProps): react_jsx_runtime5.JSX.Element;
+}: DropzoneProps): react_jsx_runtime240.JSX.Element;
 /**
  * DropzoneContent
  */
@@ -36,7 +36,7 @@ type DropzoneContentProps = {
 declare function DropzoneContent({
   children,
   className
-}: DropzoneContentProps): string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime5.JSX.Element | null;
+}: DropzoneContentProps): string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react99.ReactPortal | react99.ReactElement<unknown, string | react99.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime240.JSX.Element | null;
 /**
  * DropzoneEmptyState
  */
@@ -47,7 +47,7 @@ type DropzoneEmptyStateProps = {
 declare function DropzoneEmptyState({
   children,
   className
-}: DropzoneEmptyStateProps): string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react0.ReactPortal | react0.ReactElement<unknown, string | react0.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime5.JSX.Element | null;
+}: DropzoneEmptyStateProps): string | number | bigint | true | Iterable<ReactNode> | Promise<string | number | bigint | boolean | react99.ReactPortal | react99.ReactElement<unknown, string | react99.JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | react_jsx_runtime240.JSX.Element | null;
 //#endregion
 export { Dropzone, DropzoneContent, DropzoneContentProps, DropzoneEmptyState, DropzoneEmptyStateProps, DropzoneProps };
 //# sourceMappingURL=dropzone.client.d.mts.map

package/dist/modules/storage/components/dropzone.client.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/dropzone.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;KAcY,aAAA,GAAgB,KAAK;EAArB,GAAA,CAAA,EACJ,IADI,EAAA;EAAqB,SAAA,CAAA,EAAA,MAAA;EAAL,MAAA,CAAA,EAAA,CAAA,aAAA,EAGD,IAHC,EAAA,EAAA,cAAA,EAGuB,aAHvB,EAAA,EAAA,KAAA,EAG+C,SAH/C,EAAA,GAAA,IAAA;EACpB,QAAA,CAAA,EAGK,SAHL;CAEmB;AAAwB,iBAInC,QAAA,CAJmC;EAAA,MAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,GAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAgBhD,aAhBgD,CAAA,EAgBnC,kBAAA,CAAA,GAAA,CAAA,OAhBmC;;;;AAInC,KAsDJ,oBAAA,GAtDY;EACtB,QAAA,CAAA,EAsDW,SAtDX;EACA,SAAA,CAAA,EAAA,MAAA;CACA;AACA,iBAyDc,eAAA,CAzDd;EAAA,QAAA;EAAA;AAAA,CAAA,EAyDuD,oBAzDvD,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,IAAA,GAyD2E,QAzD3E,CAyD2E,SAzD3E,CAAA,GAyD2E,OAzD3E,CAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GAyD2E,MAAA,CAAA,WAAA,GAAA,MAAA,CAAA,YAzD3E,CAAA,OAAA,EAAA,MAAA,GAyD2E,MAAA,CAAA,qBAzD3E,CAAA,GAAA,CAAA,CAAA,GAyD2E,QAzD3E,CAyD2E,SAzD3E,CAAA,GAAA,IAAA,GAAA,SAAA,CAAA,GAyD2E,kBAAA,CAAA,GAAA,CAAA,OAAA,GAzD3E,IAAA;;;;AAIA,KAmFU,uBAAA,GAnFV;EACA,QAAA,CAAA,EAmFW,SAnFX;EACA,SAAA,CAAA,EAAA,MAAA;CAEC;AAAa,iBAoFA,kBAAA,CApFA;EAAA,QAAA;EAAA;AAAA,CAAA,EAoF4C,uBApF5C,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,IAAA,GAoFmE,QApFnE,CAoFmE,SApFnE,CAAA,GAoFmE,OApFnE,CAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GAoFmE,MAAA,CAAA,WAAA,GAAA,MAAA,CAAA,YApFnE,CAAA,OAAA,EAAA,MAAA,GAoFmE,MAAA,CAAA,qBApFnE,CAAA,GAAA,CAAA,CAAA,GAoFmE,QApFnE,CAoFmE,SApFnE,CAAA,GAAA,IAAA,GAAA,SAAA,CAAA,GAoFmE,kBAAA,CAAA,GAAA,CAAA,OAAA,GApFnE,IAAA"}
+{"version":3,"file":"dropzone.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/dropzone.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;KAcY,aAAA,GAAgB,KAAK;EAArB,GAAA,CAAA,EACJ,IADI,EAAA;EAAqB,SAAA,CAAA,EAAA,MAAA;EAAL,MAAA,CAAA,EAAA,CAAA,aAAA,EAGD,IAHC,EAAA,EAAA,cAAA,EAGuB,aAHvB,EAAA,EAAA,KAAA,EAG+C,SAH/C,EAAA,GAAA,IAAA;EACpB,QAAA,CAAA,EAGK,SAHL;CAEmB;AAAwB,iBAInC,QAAA,CAJmC;EAAA,MAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,QAAA;EAAA,GAAA;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAgBhD,aAhBgD,CAAA,EAgBnC,oBAAA,CAAA,GAAA,CAAA,OAhBmC;;;;AAInC,KAsDJ,oBAAA,GAtDY;EACtB,QAAA,CAAA,EAsDW,SAtDX;EACA,SAAA,CAAA,EAAA,MAAA;CACA;AACA,iBAyDc,eAAA,CAzDd;EAAA,QAAA;EAAA;AAAA,CAAA,EAyDuD,oBAzDvD,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,IAAA,GAyD2E,QAzD3E,CAyD2E,SAzD3E,CAAA,GAyD2E,OAzD3E,CAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GAyD2E,OAAA,CAAA,WAAA,GAAA,OAAA,CAAA,YAzD3E,CAAA,OAAA,EAAA,MAAA,GAyD2E,OAAA,CAAA,qBAzD3E,CAAA,GAAA,CAAA,CAAA,GAyD2E,QAzD3E,CAyD2E,SAzD3E,CAAA,GAAA,IAAA,GAAA,SAAA,CAAA,GAyD2E,oBAAA,CAAA,GAAA,CAAA,OAAA,GAzD3E,IAAA;;;;AAIA,KAmFU,uBAAA,GAnFV;EACA,QAAA,CAAA,EAmFW,SAnFX;EACA,SAAA,CAAA,EAAA,MAAA;CAEC;AAAa,iBAoFA,kBAAA,CApFA;EAAA,QAAA;EAAA;AAAA,CAAA,EAoF4C,uBApF5C,CAAA,EAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,IAAA,GAoFmE,QApFnE,CAoFmE,SApFnE,CAAA,GAoFmE,OApFnE,CAAA,MAAA,GAAA,MAAA,GAAA,MAAA,GAAA,OAAA,GAoFmE,OAAA,CAAA,WAAA,GAAA,OAAA,CAAA,YApFnE,CAAA,OAAA,EAAA,MAAA,GAoFmE,OAAA,CAAA,qBApFnE,CAAA,GAAA,CAAA,CAAA,GAoFmE,QApFnE,CAoFmE,SApFnE,CAAA,GAAA,IAAA,GAAA,SAAA,CAAA,GAoFmE,oBAAA,CAAA,GAAA,CAAA,OAAA,GApFnE,IAAA"}

package/dist/modules/storage/components/dropzone.client.mjs

@@ -1,8 +1,8 @@
 "use client";
 
 import { cn } from "../../../lib/utils/cn.mjs";
-import { Button } from "../../../components/ui/button.mjs";
 import { renderBytes } from "../lib/helpers.mjs";
+import { Button } from "../../../components/ui/button.mjs";
 import { DropzoneContext, useDropzoneContext } from "./dropzone-context.client.mjs";
 import { UploadIcon } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/modules/storage/components/image-grid.client.d.mts

@@ -1,5 +1,5 @@
 import { FileNode } from "../lib/validators.mjs";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime243 from "react/jsx-runtime";
 import { ComponentProps } from "react";
 
 //#region src/modules/storage/components/image-grid.client.d.ts
@@ -19,8 +19,8 @@ declare function ImageGrid({
   moveAction,
   disabled,
   ...props
-}: ImageGridProps): react_jsx_runtime8.JSX.Element;
-declare function ImageGridSkeleton(props: ComponentProps<"div">): react_jsx_runtime8.JSX.Element;
+}: ImageGridProps): react_jsx_runtime243.JSX.Element;
+declare function ImageGridSkeleton(props: ComponentProps<"div">): react_jsx_runtime243.JSX.Element;
 //#endregion
 export { ImageGrid, ImageGridSkeleton };
 //# sourceMappingURL=image-grid.client.d.mts.map

package/dist/modules/storage/components/image-grid.client.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"image-grid.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/image-grid.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAuC6C,KAMxC,cAAA,GAAiB,cAAH,CAAA,KAAA,CAAA,GAAA;EAAG,KAAA,EACb,QADa,EAAA;EACb,QAAA,CAAA,EAAA,OAAA;EAEyD,UAAA,EAAA,CAAA,MAAA,EAAA;IAAO,SAAA,EAAA,MAAA;IAGzD,OAAA,EAAS,MAAA;EAAG,CAAA,EAAA,GAHsC,OAGtC,CAAA,IAAA,CAAA;CAAO;AAAY,iBAA/B,SAAA,CAA+B;EAAA,KAAA;EAAA,UAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAAsB,cAAtB,CAAA,EAAoC,kBAAA,CAAA,GAAA,CAAA,OAApC;AAAsB,iBAkKrD,iBAAA,CAlKqD,KAAA,EAkK5B,cAlK4B,CAAA,KAAA,CAAA,CAAA,EAkKP,kBAAA,CAAA,GAAA,CAAA,OAlKO"}
+{"version":3,"file":"image-grid.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/image-grid.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAuC6C,KAMxC,cAAA,GAAiB,cAAH,CAAA,KAAA,CAAA,GAAA;EAAG,KAAA,EACb,QADa,EAAA;EACb,QAAA,CAAA,EAAA,OAAA;EAEyD,UAAA,EAAA,CAAA,MAAA,EAAA;IAAO,SAAA,EAAA,MAAA;IAGzD,OAAA,EAAS,MAAA;EAAG,CAAA,EAAA,GAHsC,OAGtC,CAAA,IAAA,CAAA;CAAO;AAAY,iBAA/B,SAAA,CAA+B;EAAA,KAAA;EAAA,UAAA;EAAA,QAAA;EAAA,GAAA;AAAA,CAAA,EAAsB,cAAtB,CAAA,EAAoC,oBAAA,CAAA,GAAA,CAAA,OAApC;AAAsB,iBAkKrD,iBAAA,CAlKqD,KAAA,EAkK5B,cAlK4B,CAAA,KAAA,CAAA,CAAA,EAkKP,oBAAA,CAAA,GAAA,CAAA,OAlKO"}

package/dist/modules/storage/components/image-grid.client.mjs

@@ -2,6 +2,7 @@
 
 import { Icons } from "../../../components/common/icons.mjs";
 import { cn } from "../../../lib/utils/cn.mjs";
+import { getFileUrl, imageLoader } from "../lib/helpers.mjs";
 import { Skeleton } from "../../../components/ui/skeleton.mjs";
 import { Button } from "../../../components/ui/button.mjs";
 import { Input } from "../../../components/ui/input.mjs";
@@ -10,7 +11,6 @@ import { useAction } from "../../../lib/hooks/use-action.mjs";
 import { arrayMove } from "../../../lib/utils/array-move.mjs";
 import { Card } from "../../../components/ui/card.mjs";
 import { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from "../../../components/ui/carousel.mjs";
-import { getFileUrl, imageLoader } from "../lib/helpers.mjs";
 import { useUploadZone } from "./upload-zone-context.client.mjs";
 import { GripIcon, UploadIcon } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -114,7 +114,7 @@ function ImageGrid({ nodes, moveAction, disabled, ...props }) {
 	});
 }
 function ImageGridItem({ node, index, setCurrent }) {
-	const { deleteMutation } = useUploadZone();
+	const { uploadClient } = useUploadZone();
 	const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: node.id });
 	return /* @__PURE__ */ jsx(Card, {
 		id: node.id,
@@ -149,7 +149,7 @@ function ImageGridItem({ node, index, setCurrent }) {
 				type: "button",
 				variant: "destructive",
 				size: "icon",
-				onClick: () => deleteMutation({ ids: [node.id] }),
+				onClick: () => uploadClient.deleteFiles([node.id]),
 				className: "absolute left-2 top-2 hidden p-1 group-hover:flex",
 				children: /* @__PURE__ */ jsx(Icons.trash, { className: "size-4" })
 			})

package/dist/modules/storage/components/image-grid.client.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image-grid.client.mjs","names":["Image"],"sources":["../../../../src/modules/storage/components/image-grid.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Icons } from \"@/components/common/icons\";\nimport { Button } from \"@/components/ui/button\";\nimport { Card } from \"@/components/ui/card\";\nimport {\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselNext,\n  CarouselPrevious,\n} from \"@/components/ui/carousel\";\nimport { Dialog, DialogContent, DialogTrigger } from \"@/components/ui/dialog.client\";\nimport { Input } from \"@/components/ui/input\";\nimport { Skeleton } from \"@/components/ui/skeleton\";\nimport { useAction } from \"@/lib/entry.client\";\nimport { arrayMove } from \"@/lib/utils/array-move\";\nimport { cn } from \"@/lib/utils/cn\";\nimport {\n  closestCenter,\n  DndContext,\n  DragEndEvent,\n  KeyboardSensor,\n  PointerSensor,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport {\n  rectSortingStrategy,\n  SortableContext,\n  sortableKeyboardCoordinates,\n  useSortable,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { GripIcon, UploadIcon } from \"lucide-react\";\nimport Image from \"next/image\";\nimport React, { ComponentProps } from \"react\";\nimport { getFileUrl, imageLoader } from \"../lib/helpers\";\nimport { FileNode } from \"../lib/validators\";\nimport { useUploadZone } from \"./upload-zone-context.client\";\n\n/**\n * Image Grid\n */\ntype ImageGridProps = ComponentProps<\"div\"> & {\n  nodes: FileNode[];\n  disabled?: boolean;\n  moveAction: (params: { fromIndex: number; toIndex: number }) => Promise<void>;\n};\n\nexport function ImageGrid({ nodes, moveAction, disabled, ...props }: ImageGridProps) {\n  const { onUpload, updateData, invalidateQuery } = useUploadZone();\n\n  const images = nodes.flatMap((node) => ({ ...node, url: getFileUrl(node.id) }));\n\n  const [current, setCurrent] = React.useState<number>(0);\n\n  const { setNodeRef } = useDroppable({ id: \"image-grid\" });\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  const moveMuration = useAction({\n    mutationFn: async ({ active, over }: DragEndEvent) => {\n      if (!moveAction) return Promise.resolve();\n\n      const activeId = active.id;\n      const overId = over?.id;\n      if (!activeId || !overId || activeId === overId) return Promise.resolve();\n\n      const fromIndex = images.findIndex((image) => image.id === activeId);\n      const toIndex = images.findIndex((image) => image.id === overId);\n\n      await updateData((prev) => arrayMove(prev, { fromIndex, toIndex }));\n      await moveAction({ fromIndex, toIndex });\n    },\n    onSuccess: async () => {\n      setCurrent(0);\n      await invalidateQuery();\n    },\n    onError: (error) => {\n      console.error(\"Error moving image:\", error);\n    },\n  });\n\n  return (\n    <Dialog {...props}>\n      <DndContext\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        onDragEnd={moveMuration.mutate}\n      >\n        <div\n          ref={setNodeRef}\n          className=\"grid grid-cols-[repeat(auto-fill,minmax(10rem,1fr))] gap-5\"\n        >\n          <SortableContext items={images.map((image) => image.id)} strategy={rectSortingStrategy}>\n            {images.map((node, index) => (\n              <ImageGridItem key={node.id} node={node} index={index} setCurrent={setCurrent} />\n            ))}\n\n            {!disabled && (\n              <label className=\"border-muted-foreground bg-muted hover:border-primary relative flex aspect-square w-full cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed\">\n                <UploadIcon className=\"h-8 w-8\" />\n                <Input\n                  type=\"file\"\n                  accept=\"image/jpeg, image/png, image/webp, image/gif\"\n                  className=\"absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0\"\n                  multiple\n                  onChange={(e) => {\n                    if (!e.target.files) return;\n                    return Array.from(e.target.files).map(onUpload);\n                  }}\n                />\n              </label>\n            )}\n          </SortableContext>\n        </div>\n      </DndContext>\n\n      <Carousel className=\"w-full\" opts={{ startIndex: current }}>\n        <DialogContent className=\"border-none bg-transparent p-0 shadow-none md:max-w-[80vw] xl:max-w-[60vw]\">\n          <CarouselContent className=\"md:max-h-[80vh]\">\n            {images.map(({ id, url }) => (\n              <CarouselItem key={id} className=\"overflow-hidden rounded-xl\">\n                <Image\n                  src={url}\n                  alt=\"Image Preview\"\n                  width={1920}\n                  height={1080}\n                  className=\"h-full w-full rounded-xl object-contain\"\n                  loader={imageLoader}\n                />\n              </CarouselItem>\n            ))}\n          </CarouselContent>\n          <CarouselPrevious />\n          <CarouselNext />\n        </DialogContent>\n      </Carousel>\n    </Dialog>\n  );\n}\n\n/**\n * Image Grid Item\n */\ntype ImageGridItemProps = {\n  node: FileNode & { url: string };\n  index: number;\n  setCurrent: React.Dispatch<React.SetStateAction<number>>;\n};\n\nfunction ImageGridItem({ node, index, setCurrent }: ImageGridItemProps) {\n  const { deleteMutation } = useUploadZone();\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: node.id });\n\n  return (\n    <Card\n      id={node.id}\n      ref={setNodeRef}\n      style={{\n        transform: CSS.Transform.toString(transform),\n        transition,\n      }}\n      className={cn(\"group relative aspect-square w-full\", node.isPending && \"opacity-30\")}\n    >\n      {!node.isPending ? (\n        <>\n          <DialogTrigger onClick={() => setCurrent(index)}>\n            <Image\n              src={node.url}\n              alt=\"Image Preview\"\n              width={100}\n              height={100}\n              className=\"bg-muted absolute inset-0 h-full w-full cursor-pointer rounded-lg object-contain\"\n              loader={imageLoader}\n            />\n          </DialogTrigger>\n\n          <Button\n            {...attributes}\n            {...listeners}\n            type=\"button\"\n            variant=\"secondary\"\n            size=\"icon\"\n            className=\"absolute right-2 top-2 hidden p-1 group-hover:flex\"\n          >\n            <GripIcon className=\"size-4\" />\n          </Button>\n\n          <Button\n            type=\"button\"\n            variant=\"destructive\"\n            size=\"icon\"\n            onClick={() => deleteMutation({ ids: [node.id] })}\n            className=\"absolute left-2 top-2 hidden p-1 group-hover:flex\"\n          >\n            <Icons.trash className=\"size-4\" />\n          </Button>\n        </>\n      ) : (\n        <Skeleton className=\"absolute inset-0 h-full w-full rounded-lg\" />\n      )}\n    </Card>\n  );\n}\n\nexport function ImageGridSkeleton(props: ComponentProps<\"div\">) {\n  return (\n    <div\n      {...props}\n      className={cn(\"grid grid-cols-[repeat(auto-fill,minmax(10rem,1fr))] gap-5\", props.className)}\n    >\n      {Array.from({ length: 12 }).map((_, index) => (\n        <Skeleton key={index} className=\"aspect-square w-full rounded-lg\" />\n      ))}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"image-grid.client.mjs","names":["Image"],"sources":["../../../../src/modules/storage/components/image-grid.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { Icons } from \"@/components/common/icons\";\nimport { Button } from \"@/components/ui/button\";\nimport { Card } from \"@/components/ui/card\";\nimport {\n  Carousel,\n  CarouselContent,\n  CarouselItem,\n  CarouselNext,\n  CarouselPrevious,\n} from \"@/components/ui/carousel\";\nimport { Dialog, DialogContent, DialogTrigger } from \"@/components/ui/dialog.client\";\nimport { Input } from \"@/components/ui/input\";\nimport { Skeleton } from \"@/components/ui/skeleton\";\nimport { useAction } from \"@/lib/entry.client\";\nimport { arrayMove } from \"@/lib/utils/array-move\";\nimport { cn } from \"@/lib/utils/cn\";\nimport {\n  closestCenter,\n  DndContext,\n  DragEndEvent,\n  KeyboardSensor,\n  PointerSensor,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport {\n  rectSortingStrategy,\n  SortableContext,\n  sortableKeyboardCoordinates,\n  useSortable,\n} from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { GripIcon, UploadIcon } from \"lucide-react\";\nimport Image from \"next/image\";\nimport React, { ComponentProps } from \"react\";\nimport { getFileUrl, imageLoader } from \"../lib/helpers\";\nimport { FileNode } from \"../lib/validators\";\nimport { useUploadZone } from \"./upload-zone-context.client\";\n\n/**\n * Image Grid\n */\ntype ImageGridProps = ComponentProps<\"div\"> & {\n  nodes: FileNode[];\n  disabled?: boolean;\n  moveAction: (params: { fromIndex: number; toIndex: number }) => Promise<void>;\n};\n\nexport function ImageGrid({ nodes, moveAction, disabled, ...props }: ImageGridProps) {\n  const { onUpload, updateData, invalidateQuery } = useUploadZone();\n\n  const images = nodes.flatMap((node) => ({ ...node, url: getFileUrl(node.id) }));\n\n  const [current, setCurrent] = React.useState<number>(0);\n\n  const { setNodeRef } = useDroppable({ id: \"image-grid\" });\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  );\n\n  const moveMuration = useAction({\n    mutationFn: async ({ active, over }: DragEndEvent) => {\n      if (!moveAction) return Promise.resolve();\n\n      const activeId = active.id;\n      const overId = over?.id;\n      if (!activeId || !overId || activeId === overId) return Promise.resolve();\n\n      const fromIndex = images.findIndex((image) => image.id === activeId);\n      const toIndex = images.findIndex((image) => image.id === overId);\n\n      await updateData((prev) => arrayMove(prev, { fromIndex, toIndex }));\n      await moveAction({ fromIndex, toIndex });\n    },\n    onSuccess: async () => {\n      setCurrent(0);\n      await invalidateQuery();\n    },\n    onError: (error) => {\n      console.error(\"Error moving image:\", error);\n    },\n  });\n\n  return (\n    <Dialog {...props}>\n      <DndContext\n        sensors={sensors}\n        collisionDetection={closestCenter}\n        onDragEnd={moveMuration.mutate}\n      >\n        <div\n          ref={setNodeRef}\n          className=\"grid grid-cols-[repeat(auto-fill,minmax(10rem,1fr))] gap-5\"\n        >\n          <SortableContext items={images.map((image) => image.id)} strategy={rectSortingStrategy}>\n            {images.map((node, index) => (\n              <ImageGridItem key={node.id} node={node} index={index} setCurrent={setCurrent} />\n            ))}\n\n            {!disabled && (\n              <label className=\"border-muted-foreground bg-muted hover:border-primary relative flex aspect-square w-full cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed\">\n                <UploadIcon className=\"h-8 w-8\" />\n                <Input\n                  type=\"file\"\n                  accept=\"image/jpeg, image/png, image/webp, image/gif\"\n                  className=\"absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0\"\n                  multiple\n                  onChange={(e) => {\n                    if (!e.target.files) return;\n                    return Array.from(e.target.files).map(onUpload);\n                  }}\n                />\n              </label>\n            )}\n          </SortableContext>\n        </div>\n      </DndContext>\n\n      <Carousel className=\"w-full\" opts={{ startIndex: current }}>\n        <DialogContent className=\"border-none bg-transparent p-0 shadow-none md:max-w-[80vw] xl:max-w-[60vw]\">\n          <CarouselContent className=\"md:max-h-[80vh]\">\n            {images.map(({ id, url }) => (\n              <CarouselItem key={id} className=\"overflow-hidden rounded-xl\">\n                <Image\n                  src={url}\n                  alt=\"Image Preview\"\n                  width={1920}\n                  height={1080}\n                  className=\"h-full w-full rounded-xl object-contain\"\n                  loader={imageLoader}\n                />\n              </CarouselItem>\n            ))}\n          </CarouselContent>\n          <CarouselPrevious />\n          <CarouselNext />\n        </DialogContent>\n      </Carousel>\n    </Dialog>\n  );\n}\n\n/**\n * Image Grid Item\n */\ntype ImageGridItemProps = {\n  node: FileNode & { url: string };\n  index: number;\n  setCurrent: React.Dispatch<React.SetStateAction<number>>;\n};\n\nfunction ImageGridItem({ node, index, setCurrent }: ImageGridItemProps) {\n  const { uploadClient } = useUploadZone();\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: node.id });\n\n  return (\n    <Card\n      id={node.id}\n      ref={setNodeRef}\n      style={{\n        transform: CSS.Transform.toString(transform),\n        transition,\n      }}\n      className={cn(\"group relative aspect-square w-full\", node.isPending && \"opacity-30\")}\n    >\n      {!node.isPending ? (\n        <>\n          <DialogTrigger onClick={() => setCurrent(index)}>\n            <Image\n              src={node.url}\n              alt=\"Image Preview\"\n              width={100}\n              height={100}\n              className=\"bg-muted absolute inset-0 h-full w-full cursor-pointer rounded-lg object-contain\"\n              loader={imageLoader}\n            />\n          </DialogTrigger>\n\n          <Button\n            {...attributes}\n            {...listeners}\n            type=\"button\"\n            variant=\"secondary\"\n            size=\"icon\"\n            className=\"absolute right-2 top-2 hidden p-1 group-hover:flex\"\n          >\n            <GripIcon className=\"size-4\" />\n          </Button>\n\n          <Button\n            type=\"button\"\n            variant=\"destructive\"\n            size=\"icon\"\n            onClick={() => uploadClient.deleteFiles([node.id])}\n            className=\"absolute left-2 top-2 hidden p-1 group-hover:flex\"\n          >\n            <Icons.trash className=\"size-4\" />\n          </Button>\n        </>\n      ) : (\n        <Skeleton className=\"absolute inset-0 h-full w-full rounded-lg\" />\n      )}\n    </Card>\n  );\n}\n\nexport function ImageGridSkeleton(props: ComponentProps<\"div\">) {\n  return (\n    <div\n      {...props}\n      className={cn(\"grid grid-cols-[repeat(auto-fill,minmax(10rem,1fr))] gap-5\", props.className)}\n    >\n      {Array.from({ length: 12 }).map((_, index) => (\n        <Skeleton key={index} className=\"aspect-square w-full rounded-lg\" />\n      ))}\n    </div>\n  );\n}\n"],"mappings":"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"}

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

@@ -1,4 +1,5 @@
-import { FileNode, Node, PresignFileSchema } from "../lib/validators.mjs";
+import { FileNode, Node } from "../lib/validators.mjs";
+import { UploadClient } from "../lib/create-upload.client.mjs";
 import React from "react";
 
 //#region src/modules/storage/components/upload-zone-context.client.d.ts
@@ -7,16 +8,7 @@ import React from "react";
  * Upload Zone Context Value
  */
 type UploadZoneContextValue = {
-  presignMutation: (params: PresignFileSchema) => Promise<{
-    id: string;
-    presignedUrl: string;
-  }>;
-  confirmMutation: (params: {
-    id: string;
-  }) => Promise<Node>;
-  deleteMutation: (params: {
-    ids: string[];
-  }) => Promise<unknown>;
+  uploadClient: UploadClient;
   updateData: (newValue: FileNode[] | ((oldValue: FileNode[]) => FileNode[])) => Promise<void>;
   invalidateQuery: () => Promise<void> | void;
   onUpload: (file: File) => Promise<Node>;

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

@@ -1 +1 @@
-{"version":3,"file":"upload-zone-context.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/upload-zone-context.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;AAQA;AAC4B,KADhB,sBAAA,GACgB;EAAsB,eAAA,EAAA,CAAA,MAAA,EAAtB,iBAAsB,EAAA,GAAA,OAAA,CAAA;IACK,EAAA,EAAA,MAAA;IAAR,YAAA,EAAA,MAAA;EACE,CAAA,CAAA;EACxB,eAAA,EAAA,CAAA,MAAA,EAAA;IAAyB,EAAA,EAAA,MAAA;EAAe,CAAA,EAAA,GAFlB,OAEkB,CAFV,IAEU,CAAA;EAAgB,cAAA,EAAA,CAAA,MAAA,EAAA;IACxD,GAAA,EAAA,MAAA,EAAA;EACN,CAAA,EAAA,GAH8B,OAG9B,CAAA,OAAA,CAAA;EAAiB,UAAA,EAAA,CAAA,QAAA,EAFX,QAEW,EAAA,GAAA,CAAA,CAAA,QAAA,EAFc,QAEd,EAAA,EAAA,GAF6B,QAE7B,EAAA,CAAA,EAAA,GAF6C,OAE7C,CAAA,IAAA,CAAA;EAAR,eAAA,EAAA,GAAA,GADH,OACG,CAAA,IAAA,CAAA,GAAA,IAAA;EAAO,QAAA,EAAA,CAAA,IAAA,EAAhB,IAAgB,EAAA,GAAP,OAAO,CAAC,IAAD,CAAA;AAMnC,CAAA;AAKA;;;cALa,mBAAiB,KAAA,CAAA,QAAA;;;;iBAKd,aAAA,CAAA,GAAa"}
+{"version":3,"file":"upload-zone-context.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/upload-zone-context.client.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AASA;AACgB,KADJ,sBAAA,GACI;EACS,YAAA,EADT,YACS;EAAyB,UAAA,EAAA,CAAA,QAAA,EAAzB,QAAyB,EAAA,GAAA,CAAA,CAAA,QAAA,EAAA,QAAA,EAAA,EAAA,GAAe,QAAf,EAAA,CAAA,EAAA,GAA+B,OAA/B,CAAA,IAAA,CAAA;EAAe,eAAA,EAAA,GAAA,GACxC,OADwC,CAAA,IAAA,CAAA,GAAA,IAAA;EAAgB,QAAA,EAAA,CAAA,IAAA,EAE9D,IAF8D,EAAA,GAErD,OAFqD,CAE7C,IAF6C,CAAA;CACxD;;;;AACU,cAMtB,iBANsB,EAML,KAAA,CAAA,OANK,CAML,sBANK,CAAA;AAMnC;AAKA;;iBAAgB,aAAA,CAAA,GAAa"}

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

@@ -1 +1 @@
-{"version":3,"file":"upload-zone-context.client.mjs","names":[],"sources":["../../../../src/modules/storage/components/upload-zone-context.client.tsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { FileNode, Node, PresignFileSchema } from \"../lib/validators\";\n\n/**\n * Upload Zone Context Value\n */\nexport type UploadZoneContextValue = {\n  presignMutation: (params: PresignFileSchema) => Promise<{ id: string; presignedUrl: string }>;\n  confirmMutation: (params: { id: string }) => Promise<Node>;\n  deleteMutation: (params: { ids: string[] }) => Promise<unknown>;\n  updateData: (newValue: FileNode[] | ((oldValue: FileNode[]) => FileNode[])) => Promise<void>;\n  invalidateQuery: () => Promise<void> | void;\n  onUpload: (file: File) => Promise<Node>;\n};\n\n/**\n * Upload Zone Context\n */\nexport const UploadZoneContext = React.createContext({} as UploadZoneContextValue);\n\n/**\n * Upload Zone Hook\n */\nexport function useUploadZone() {\n  const context = React.useContext(UploadZoneContext);\n  if (!context) {\n    throw new Error(\"useUploadZone must be used within an UploadZoneProvider\");\n  }\n  return context;\n}\n"],"mappings":";;;;;;;;AAoBA,MAAa,oBAAoB,MAAM,cAAc,EAAE,CAA2B;;;;AAKlF,SAAgB,gBAAgB;CAC9B,MAAM,UAAU,MAAM,WAAW,kBAAkB;AACnD,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,0DAA0D;AAE5E,QAAO"}
+{"version":3,"file":"upload-zone-context.client.mjs","names":[],"sources":["../../../../src/modules/storage/components/upload-zone-context.client.tsx"],"sourcesContent":["\"use client\";\n\nimport React from \"react\";\nimport { UploadClient } from \"../lib/create-upload.client\";\nimport { FileNode, Node } from \"../lib/validators\";\n\n/**\n * Upload Zone Context Value\n */\nexport type UploadZoneContextValue = {\n  uploadClient: UploadClient;\n  updateData: (newValue: FileNode[] | ((oldValue: FileNode[]) => FileNode[])) => Promise<void>;\n  invalidateQuery: () => Promise<void> | void;\n  onUpload: (file: File) => Promise<Node>;\n};\n\n/**\n * Upload Zone Context\n */\nexport const UploadZoneContext = React.createContext({} as UploadZoneContextValue);\n\n/**\n * Upload Zone Hook\n */\nexport function useUploadZone() {\n  const context = React.useContext(UploadZoneContext);\n  if (!context) {\n    throw new Error(\"useUploadZone must be used within an UploadZoneProvider\");\n  }\n  return context;\n}\n"],"mappings":";;;;;;;;AAmBA,MAAa,oBAAoB,MAAM,cAAc,EAAE,CAA2B;;;;AAKlF,SAAgB,gBAAgB;CAC9B,MAAM,UAAU,MAAM,WAAW,kBAAkB;AACnD,KAAI,CAAC,QACH,OAAM,IAAI,MAAM,0DAA0D;AAE5E,QAAO"}

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

@@ -1,43 +1,22 @@
-import { Node, PresignFileSchema } from "../lib/validators.mjs";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { Node, UploadFileSchema } from "../lib/validators.mjs";
+import { UploadClient, UploadHooks } from "../lib/create-upload.client.mjs";
+import * as react_jsx_runtime245 from "react/jsx-runtime";
 import { ComponentProps } from "react";
 
 //#region src/modules/storage/components/upload-zone.client.d.ts
 type UploadZoneProps = ComponentProps<"div"> & {
-  namespace: string;
-  parentId: string | null;
   queryKey: readonly unknown[];
-  presignAction: (params: PresignFileSchema) => Promise<{
-    id: string;
-    presignedUrl: string;
-  }>;
-  onPresignStarted?: (file: PresignFileSchema) => Promise<void> | void;
-  onPresignCompleted?: (data: {
-    id: string;
-    presignedUrl: string;
-  }) => Promise<void> | void;
-  confirmAction: (params: {
-    id: string;
-  }) => Promise<Node>;
-  onConfirmStarted?: (id: string) => Promise<void> | void;
-  onConfirmCompleted?: (node: Node) => Promise<void> | void;
-  deleteAction: (params: {
-    ids: string[];
-  }) => Promise<unknown>;
+  variables: Pick<UploadFileSchema, "namespace" | "parentId" | "mode" | "hidden" | "readonly">;
+  uploadClient: UploadClient;
+  uploadHooks?: UploadHooks;
   onUploadCompleted?: (node: Node) => Promise<void> | void;
   onUploadFailed?: (error: unknown) => Promise<void> | void;
 };
 declare function UploadZone({
-  namespace,
-  parentId,
+  variables,
   queryKey,
-  presignAction,
-  confirmAction,
-  deleteAction,
-  onPresignStarted,
-  onPresignCompleted,
-  onConfirmStarted,
-  onConfirmCompleted,
+  uploadClient,
+  uploadHooks,
   onUploadCompleted,
   onUploadFailed,
   children,
@@ -45,7 +24,7 @@ declare function UploadZone({
   onDragOver,
   onDragLeave,
   ...props
-}: UploadZoneProps): react_jsx_runtime0.JSX.Element;
+}: UploadZoneProps): react_jsx_runtime245.JSX.Element;
 //#endregion
 export { UploadZone, UploadZoneProps };
 //# sourceMappingURL=upload-zone.client.d.mts.map

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"],"sourcesContent":[],"mappings":";;;;;KAYY,eAAA,GAAkB;;;EAAlB,QAAA,EAAA,SAAe,OAAA,EAAA;EAAG,aAAA,EAAA,CAAA,MAAA,EAMJ,iBANI,EAAA,GAMkB,OANlB,CAAA;IAMJ,EAAA,EAAA,MAAA;IAAsB,YAAA,EAAA,MAAA;EACpB,CAAA,CAAA;EAAsB,gBAAA,CAAA,EAAA,CAAA,IAAA,EAAtB,iBAAsB,EAAA,GAAA,OAAA,CAAA,IAAA,CAAA,GAAA,IAAA;EACqB,kBAAA,CAAA,EAAA,CAAA,IAAA,EAAA;IAElB,EAAA,EAAA,MAAA;IAAR,YAAA,EAAA,MAAA;EACR,CAAA,EAAA,GAHkC,OAGlC,CAAA,IAAA,CAAA,GAAA,IAAA;EACP,aAAA,EAAA,CAAA,MAAA,EAAA;IAAS,EAAA,EAAA,MAAA;EAEQ,CAAA,EAAA,GAJF,OAIE,CAJM,IAIN,CAAA;EAElB,gBAAA,CAAA,EAAA,CAAA,EAAA,EAAA,MAAA,EAAA,GALQ,OAKR,CAAA,IAAA,CAAA,GAAA,IAAA;EAAS,kBAAA,CAAA,EAAA,CAAA,IAAA,EAJR,IAIQ,EAAA,GAJC,OAID,CAAA,IAAA,CAAA,GAAA,IAAA;EACC,YAAA,EAAA,CAAA,MAAA,EAAA;IAAO,GAAA,EAAA,MAAA,EAAA;EAG9B,CAAA,EAAA,GAN+B,OAMrB,CAAA,OAAA,CAAA;EACxB,iBAAA,CAAA,EAAA,CAAA,IAAA,EAL2B,IAK3B,EAAA,GALoC,OAKpC,CAAA,IAAA,CAAA,GAAA,IAAA;EACA,cAAA,CAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,GALqC,OAKrC,CAAA,IAAA,CAAA,GAAA,IAAA;CACA;AACA,iBAJc,UAAA,CAId;EAAA,SAAA;EAAA,QAAA;EAAA,QAAA;EAAA,aAAA;EAAA,aAAA;EAAA,YAAA;EAAA,gBAAA;EAAA,kBAAA;EAAA,gBAAA;EAAA,kBAAA;EAAA,iBAAA;EAAA,cAAA;EAAA,QAAA;EAAA,SAAA;EAAA,UAAA;EAAA,WAAA;EAAA,GAAA;AAAA,CAAA,EAcC,eAdD,CAAA,EAcgB,kBAAA,CAAA,GAAA,CAAA,OAdhB"}
+{"version":3,"file":"upload-zone.client.d.mts","names":[],"sources":["../../../../src/modules/storage/components/upload-zone.client.tsx"],"sourcesContent":[],"mappings":";;;;;;KAYY,eAAA,GAAkB;;aAGjB,KAAK;EAHN,YAAA,EAII,YAJW;EAAG,WAAA,CAAA,EAKd,WALc;EAGZ,iBAAA,CAAA,EAAA,CAAA,IAAA,EAIW,IAJX,EAAA,GAIoB,OAJpB,CAAA,IAAA,CAAA,GAAA,IAAA;EAAL,cAAA,CAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,GAK0B,OAL1B,CAAA,IAAA,CAAA,GAAA,IAAA;CACG;AACA,iBAMA,UAAA,CANA;EAAA,SAAA;EAAA,QAAA;EAAA,YAAA;EAAA,WAAA;EAAA,iBAAA;EAAA,cAAA;EAAA,QAAA;EAAA,SAAA;EAAA,UAAA;EAAA,WAAA;EAAA,GAAA;AAAA,CAAA,EAkBb,eAlBa,CAAA,EAkBE,oBAAA,CAAA,GAAA,CAAA,OAlBF"}