@nestledjs/data-browser 1.0.15 → 1.0.16

package/lib/components/filters/RelationFilterField.d.ts

@@ -4,5 +4,5 @@ interface RelationFilterFieldProps {
     currentValue: any;
     onChange: (value: any) => void;
 }
-export declare function RelationFilterField({ fieldName, relatedModelName, currentValue, onChange }: Readonly<RelationFilterFieldProps>): import("react/jsx-runtime").JSX.Element;
+export declare function RelationFilterField({ fieldName, relatedModelName, currentValue, onChange, }: Readonly<RelationFilterFieldProps>): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/filters/RelationFilterField.js

@@ -17,7 +17,12 @@ function RelationFilterField({
     setIsOpen(false);
   }, []);
   useClickOutside(dropdownRef, handleCloseDropdown, isOpen);
-  const { relatedItems, loading, error: relationError, hasDocument } = useRelationData(
+  const {
+    relatedItems,
+    loading,
+    error: relationError,
+    hasDocument
+  } = useRelationData(
     relatedModelName,
     searchTerm,
     isOpen,
@@ -28,11 +33,14 @@ function RelationFilterField({
     () => currentValue?.id ? relatedItems.find((item) => item.id === currentValue.id) : null,
     [currentValue?.id, relatedItems]
   );
-  const handleSelect = useCallback((item) => {
-    onChange({ id: item.id });
-    setIsOpen(false);
-    setSearchTerm("");
-  }, [onChange]);
+  const handleSelect = useCallback(
+    (item) => {
+      onChange({ id: item.id });
+      setIsOpen(false);
+      setSearchTerm("");
+    },
+    [onChange]
+  );
   const handleClear = useCallback(() => {
     onChange(void 0);
     setIsOpen(false);

package/lib/components/shared/AdminBreadcrumbs.js

@@ -9,25 +9,10 @@ function AdminBreadcrumbs({
 }) {
   const renderHomeLink = () => {
     if (!showHome) return null;
-    return /* @__PURE__ */ jsx("li", { className: "flex items-center", children: /* @__PURE__ */ jsx(
-      Link,
-      {
-        to: homeHref,
-        className: "text-gray-400 hover:text-gray-500",
-        "aria-label": "Home",
-        children: /* @__PURE__ */ jsx(HomeIcon, { className: "h-5 w-5 flex-shrink-0" })
-      }
-    ) }, "home");
+    return /* @__PURE__ */ jsx("li", { className: "flex items-center", children: /* @__PURE__ */ jsx(Link, { to: homeHref, className: "text-gray-400 hover:text-gray-500", "aria-label": "Home", children: /* @__PURE__ */ jsx(HomeIcon, { className: "h-5 w-5 flex-shrink-0" }) }) }, "home");
   };
   const renderBreadcrumbItem = (item, index, isLast) => {
-    const content = item.href && !item.isActive ? /* @__PURE__ */ jsx(
-      Link,
-      {
-        to: item.href,
-        className: "text-sm font-medium text-gray-500 hover:text-gray-700",
-        children: item.label
-      }
-    ) : /* @__PURE__ */ jsx(
+    const content = item.href && !item.isActive ? /* @__PURE__ */ jsx(Link, { to: item.href, className: "text-sm font-medium text-gray-500 hover:text-gray-700", children: item.label }) : /* @__PURE__ */ jsx(
       "span",
       {
         className: `text-sm font-medium ${item.isActive ? "text-gray-900" : "text-gray-500"}`,

package/lib/components/shared/AdminErrorStates.js

@@ -109,7 +109,12 @@ function AdminLoadingState({
     return sizes[size];
   };
   return /* @__PURE__ */ jsxs("div", { className: `flex flex-col items-center justify-center p-8 ${className}`, children: [
-    /* @__PURE__ */ jsx("div", { className: `animate-spin rounded-full border-b-2 border-green-web ${getSizeClasses()}` }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `animate-spin rounded-full border-b-2 border-green-web ${getSizeClasses()}`
+      }
+    ),
     /* @__PURE__ */ jsx("h3", { className: "mt-4 text-sm font-medium text-gray-900", children: title }),
     message && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm text-gray-500", children: message })
   ] });

package/lib/components/shared/AdminStatusDisplay.js

@@ -151,7 +151,12 @@ function AdminStatusDisplay({
   const finalClasses = `${baseClasses} ${interactiveClasses} ${className}`.trim();
   const renderDot = () => {
     if (!shouldShowDot) return null;
-    return /* @__PURE__ */ jsx("span", { className: `inline-block rounded-full mr-2 ${config.bgColor.replace("bg-", "bg-").replace("-100", "-400")} ${sizeClasses.dot}` });
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        className: `inline-block rounded-full mr-2 ${config.bgColor.replace("bg-", "bg-").replace("-100", "-400")} ${sizeClasses.dot}`
+      }
+    );
   };
   const renderIcon = () => {
     if (!shouldShowIcon) return null;
@@ -168,16 +173,7 @@ function AdminStatusDisplay({
     }
   };
   if (isClickable) {
-    return /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: handleClick,
-        className: finalClasses,
-        title: tooltip,
-        children: content
-      }
-    );
+    return /* @__PURE__ */ jsx("button", { type: "button", onClick: handleClick, className: finalClasses, title: tooltip, children: content });
   }
   return /* @__PURE__ */ jsx("span", { className: finalClasses, title: tooltip, children: content });
 }

package/lib/context/AdminDataContext.d.ts

@@ -42,7 +42,7 @@ export interface AdminDataProviderProps {
  * ```tsx
  * import * as Sdk from '@your-project/shared/sdk'
  * import { DATABASE_MODELS } from '@your-project/shared/sdk'
- * import { AdminDataProvider } from '@nestledjs/admin-data'
+ * import { AdminDataProvider } from '@nestledjs/data-browser'
  *
  * <AdminDataProvider
  *   sdk={Sdk}
@@ -54,7 +54,7 @@ export interface AdminDataProviderProps {
  * </AdminDataProvider>
  * ```
  */
-export declare function AdminDataProvider({ children, sdk, databaseModels, basePath, formTheme, displayFieldConfig }: Readonly<AdminDataProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function AdminDataProvider({ children, sdk, databaseModels, basePath, formTheme, displayFieldConfig, }: Readonly<AdminDataProviderProps>): import("react/jsx-runtime").JSX.Element;
 /**
  * Hook to access the admin data context
  * @throws Error if used outside of AdminDataProvider

package/lib/hooks/useClickOutside.js

@@ -3,7 +3,7 @@ function useClickOutside(ref, handler, isActive = true) {
   useEffect(() => {
     if (!isActive) return;
     const handleClickOutside = (event) => {
-      if (ref.current && !ref.current.contains(event.target)) {
+      if (ref.current && event.target instanceof Node && !ref.current.contains(event.target)) {
         handler();
       }
     };

package/lib/hooks/useRelationData.js

@@ -69,6 +69,7 @@ function useRelationData(relatedModelName, searchTerm, isOpen, currentValueId) {
         return true;
       });
     } catch (error) {
+      console.error("Unexpected error:", error);
       return [];
     }
   }, [relatedData, relatedDataPath, relationError]);

package/lib/layouts/AdminDataLayout.js

@@ -87,14 +87,41 @@ function AdminDataLayout() {
     fileInputRef.current?.click();
   };
   const content = /* @__PURE__ */ jsxs("div", { className: "max-w-full mx-auto flex flex-col p-0.5", children: [
-    notification && /* @__PURE__ */ jsx("div", { className: `mb-4 px-4 py-3 rounded-md border ${notification.type === "success" ? "bg-green-50 border-green-200 text-green-800 dark:bg-green-900/20 dark:border-green-800 dark:text-green-200" : "bg-red-50 border-red-200 text-red-800 dark:bg-red-900/20 dark:border-red-800 dark:text-red-200"}`, children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
-      notification.type === "success" ? /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 mr-2", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z", clipRule: "evenodd" }) }) : /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 mr-2", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z", clipRule: "evenodd" }) }),
-      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: notification.message })
-    ] }) }),
+    notification && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: `mb-4 px-4 py-3 rounded-md border ${notification.type === "success" ? "bg-green-50 border-green-200 text-green-800 dark:bg-green-900/20 dark:border-green-800 dark:text-green-200" : "bg-red-50 border-red-200 text-red-800 dark:bg-red-900/20 dark:border-red-800 dark:text-red-200"}`,
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
+          notification.type === "success" ? /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 mr-2", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx(
+            "path",
+            {
+              fillRule: "evenodd",
+              d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
+              clipRule: "evenodd"
+            }
+          ) }) : /* @__PURE__ */ jsx("svg", { className: "w-5 h-5 mr-2", fill: "currentColor", viewBox: "0 0 20 20", children: /* @__PURE__ */ jsx(
+            "path",
+            {
+              fillRule: "evenodd",
+              d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z",
+              clipRule: "evenodd"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-medium", children: notification.message })
+        ] })
+      }
+    ),
     /* @__PURE__ */ jsxs("div", { className: "mb-6 space-y-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-3", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex-1", children: [
-          /* @__PURE__ */ jsx("label", { htmlFor: "model-selector", className: "block text-sm font-medium text-gray-900 dark:text-gray-100 mb-2", children: "Select Model" }),
+          /* @__PURE__ */ jsx(
+            "label",
+            {
+              htmlFor: "model-selector",
+              className: "block text-sm font-medium text-gray-900 dark:text-gray-100 mb-2",
+              children: "Select Model"
+            }
+          ),
           /* @__PURE__ */ jsxs("div", { className: "relative", children: [
             /* @__PURE__ */ jsxs(
               "select",
@@ -109,7 +136,23 @@ function AdminDataLayout() {
                 ]
               }
             ),
-            /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3", children: /* @__PURE__ */ jsx("svg", { className: "h-5 w-5 text-gray-400", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", children: /* @__PURE__ */ jsx("path", { fillRule: "evenodd", d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z", clipRule: "evenodd" }) }) })
+            /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center pr-3", children: /* @__PURE__ */ jsx(
+              "svg",
+              {
+                className: "h-5 w-5 text-gray-400",
+                xmlns: "http://www.w3.org/2000/svg",
+                viewBox: "0 0 20 20",
+                fill: "currentColor",
+                children: /* @__PURE__ */ jsx(
+                  "path",
+                  {
+                    fillRule: "evenodd",
+                    d: "M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z",
+                    clipRule: "evenodd"
+                  }
+                )
+              }
+            ) })
           ] })
         ] }),
         /* @__PURE__ */ jsx(
@@ -118,7 +161,23 @@ function AdminDataLayout() {
             onClick: toggleFullscreen,
             className: "h-[50px] px-4 py-3 bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm hover:bg-gray-50 dark:hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-green-web focus:border-green-web transition-colors",
             title: isFullscreen ? "Exit fullscreen" : "Enter fullscreen",
-            children: isFullscreen ? /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 9V4.5M9 9H4.5M9 9L3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5l5.25 5.25" }) }) : /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4" }) })
+            children: isFullscreen ? /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                strokeWidth: 2,
+                d: "M9 9V4.5M9 9H4.5M9 9L3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5l5.25 5.25"
+              }
+            ) }) : /* @__PURE__ */ jsx("svg", { className: "w-5 h-5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                strokeWidth: 2,
+                d: "M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"
+              }
+            ) })
           }
         )
       ] }),
@@ -131,7 +190,15 @@ function AdminDataLayout() {
             className: "inline-flex items-center px-3 py-1.5 text-gray-700 dark:text-gray-300 hover:text-green-web dark:hover:text-green-web transition-colors",
             title: "Export your preferences to a file",
             children: [
-              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 mr-1.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" }) }),
+              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 mr-1.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"
+                }
+              ) }),
               "Export"
             ]
           }
@@ -144,7 +211,15 @@ function AdminDataLayout() {
             className: "inline-flex items-center px-3 py-1.5 text-gray-700 dark:text-gray-300 hover:text-green-web dark:hover:text-green-web transition-colors",
             title: "Import preferences from a file",
             children: [
-              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 mr-1.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12" }) }),
+              /* @__PURE__ */ jsx("svg", { className: "w-4 h-4 mr-1.5", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ jsx(
+                "path",
+                {
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: 2,
+                  d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-8l-4-4m0 0L8 8m4-4v12"
+                }
+              ) }),
               "Import"
             ]
           }

package/lib/pages/AdminDataCreatePage.d.ts

@@ -1,4 +1,4 @@
-export declare function AdminDataCreatePage(): import("react/jsx-runtime").JSX.Element;
+export declare function AdminDataCreatePage(): import("react/jsx-runtime").JSX.Element | null;
 export declare function AdminDataCreateErrorBoundary({ error }: Readonly<{
     error: Error;
 }>): import("react/jsx-runtime").JSX.Element;

package/lib/pages/AdminDataCreatePage.js

@@ -7,20 +7,15 @@ import { ErrorBoundary } from "@nestledjs/shared-components";
 import { Form } from "@nestledjs/forms";
 import { useAdminDataContext } from "../context/AdminDataContext.js";
 import { useParams, Link, useNavigate } from "react-router";
-import { getAdminDocuments, buildFormFields, cleanFormInput } from "../utils/graphql-utils.js";
-function toReadableText(text) {
-  return text.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, (str) => str.toUpperCase());
-}
-function sanitizeInput(input) {
-  if (!input || typeof input !== "string") return "";
-  return input.replace(/[<>"'%;()&+]/g, "").replace(/javascript:/gi, "").replace(/on\w+\s*=/gi, "").trim().substring(0, 100);
-}
-const toKebabCase = (str) => {
-  return str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
-};
+import { sanitizeInput, getAdminDocuments, toKebabCase, buildFormFields, toReadableText, cleanFormInput } from "../utils/graphql-utils.js";
 function AdminDataCreatePage() {
   const { dataType } = useParams();
-  const { databaseModels, basePath = "/admin/data", formTheme, displayFieldConfig } = useAdminDataContext();
+  const {
+    databaseModels,
+    basePath = "/admin/data",
+    formTheme,
+    displayFieldConfig
+  } = useAdminDataContext();
   const findModelByName = (name) => {
     return databaseModels.find((model2) => model2.name === name);
   };
@@ -69,9 +64,23 @@ function AdminDataCreatePage() {
       ) })
     ] }) }) }) });
   }
-  return /* @__PURE__ */ jsx(AdminDataCreatePageContent, { model, basePath, formTheme, displayFieldConfig });
+  if (!model) return null;
+  return /* @__PURE__ */ jsx(
+    AdminDataCreatePageContent,
+    {
+      model,
+      basePath,
+      formTheme,
+      displayFieldConfig
+    }
+  );
 }
-function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldConfig }) {
+function AdminDataCreatePageContent({
+  model,
+  basePath,
+  formTheme,
+  displayFieldConfig
+}) {
   const navigate = useNavigate();
   const { sdk, databaseModels } = useAdminDataContext();
   const [submissionState, setSubmissionState] = useState({ status: "idle" });
@@ -79,6 +88,7 @@ function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldCo
     try {
       return getAdminDocuments(sdk, model);
     } catch (error) {
+      console.error("Unexpected error:", error);
       return null;
     }
   }, [sdk, model]);
@@ -90,6 +100,7 @@ function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldCo
       }
       return gql(documents.create);
     } catch (error) {
+      console.error("Unexpected error:", error);
       return null;
     }
   }, [documents]);
@@ -100,6 +111,21 @@ function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldCo
         }
       `
   );
+  useEffect(() => {
+    if (submissionState.status !== "success") return;
+    const timer = setTimeout(() => {
+      navigate(`${basePath}/${toKebabCase(model.pluralName)}`);
+    }, 1500);
+    return () => clearTimeout(timer);
+  }, [submissionState.status, navigate, basePath, model.pluralName]);
+  useEffect(() => {
+    if (submissionState.status === "error") {
+      const timer = setTimeout(() => {
+        setSubmissionState({ status: "idle" });
+      }, 5e3);
+      return () => clearTimeout(timer);
+    }
+  }, [submissionState.status]);
   if (!documents || !CREATE_MUTATION) {
     return /* @__PURE__ */ jsx("div", { className: "min-h-screen bg-gray-50 dark:bg-gray-900 flex flex-col justify-center py-12 sm:px-6 lg:px-8", children: /* @__PURE__ */ jsx("div", { className: "mt-8 sm:mx-auto sm:w-full sm:max-w-2xl", children: /* @__PURE__ */ jsx("div", { className: "bg-white dark:bg-gray-800 py-8 px-4 shadow sm:rounded-lg sm:px-10", children: /* @__PURE__ */ jsxs("div", { className: "text-center", children: [
       /* @__PURE__ */ jsx(ExclamationCircleIcon, { className: "mx-auto h-12 w-12 text-red-400" }),
@@ -148,25 +174,17 @@ function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldCo
       });
     }
   };
-  useEffect(() => {
-    if (submissionState.status !== "success") return;
-    const timer = setTimeout(() => {
-      navigate(`${basePath}/${toKebabCase(model.pluralName)}`);
-    }, 1500);
-    return () => clearTimeout(timer);
-  }, [submissionState.status, navigate, basePath, model.pluralName]);
-  useEffect(() => {
-    if (submissionState.status === "error") {
-      const timer = setTimeout(() => {
-        setSubmissionState({ status: "idle" });
-      }, 5e3);
-      return () => clearTimeout(timer);
-    }
-  }, [submissionState.status]);
   return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
     /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
       /* @__PURE__ */ jsx("nav", { className: "flex mb-6", "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxs("ol", { className: "flex items-center space-x-4", children: [
-        /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Link, { to: basePath, className: "text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-400", children: "Data Browser" }) }),
+        /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          Link,
+          {
+            to: basePath,
+            className: "text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-400",
+            children: "Data Browser"
+          }
+        ) }),
         /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
           /* @__PURE__ */ jsx(
             "svg",
@@ -218,22 +236,24 @@ function AdminDataCreatePageContent({ model, basePath, formTheme, displayFieldCo
         toReadableText(model.name)
       ] })
     ] }),
-    submissionState.status !== "idle" && /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: `mb-6 rounded-md p-4 ${submissionState.status === "success" ? "bg-green-50 border border-green-200" : submissionState.status === "error" ? "bg-red-50 border border-red-200" : "bg-blue-50 border border-blue-200"}`,
-        children: /* @__PURE__ */ jsxs("div", { className: "flex", children: [
-          /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: submissionState.status === "success" ? /* @__PURE__ */ jsx(CheckCircleIcon, { className: "h-5 w-5 text-green-400" }) : submissionState.status === "error" ? /* @__PURE__ */ jsx(ExclamationCircleIcon, { className: "h-5 w-5 text-red-400" }) : /* @__PURE__ */ jsx("div", { className: "h-5 w-5 border-2 border-blue-400 border-t-transparent rounded-full animate-spin" }) }),
-          /* @__PURE__ */ jsx("div", { className: "ml-3", children: /* @__PURE__ */ jsx(
-            "p",
-            {
-              className: `text-sm font-medium ${submissionState.status === "success" ? "text-green-800" : submissionState.status === "error" ? "text-red-800" : "text-blue-800"}`,
-              children: submissionState.status === "loading" ? `Creating ${toReadableText(model.name)}...` : submissionState.message
-            }
-          ) })
-        ] })
-      }
-    ),
+    submissionState.status !== "idle" && (() => {
+      const isSuccess = submissionState.status === "success";
+      const isError = submissionState.status === "error";
+      let bgClass = "bg-blue-50 border border-blue-200";
+      if (isSuccess) bgClass = "bg-green-50 border border-green-200";
+      else if (isError) bgClass = "bg-red-50 border border-red-200";
+      let textClass = "text-blue-800";
+      if (isSuccess) textClass = "text-green-800";
+      else if (isError) textClass = "text-red-800";
+      let icon = /* @__PURE__ */ jsx("div", { className: "h-5 w-5 border-2 border-blue-400 border-t-transparent rounded-full animate-spin" });
+      if (isSuccess) icon = /* @__PURE__ */ jsx(CheckCircleIcon, { className: "h-5 w-5 text-green-400" });
+      else if (isError) icon = /* @__PURE__ */ jsx(ExclamationCircleIcon, { className: "h-5 w-5 text-red-400" });
+      const message = submissionState.status === "loading" ? `Creating ${toReadableText(model.name)}...` : submissionState.message;
+      return /* @__PURE__ */ jsx("div", { className: `mb-6 rounded-md p-4 ${bgClass}`, children: /* @__PURE__ */ jsxs("div", { className: "flex", children: [
+        /* @__PURE__ */ jsx("div", { className: "flex-shrink-0", children: icon }),
+        /* @__PURE__ */ jsx("div", { className: "ml-3", children: /* @__PURE__ */ jsx("p", { className: `text-sm font-medium ${textClass}`, children: message }) })
+      ] }) });
+    })(),
     /* @__PURE__ */ jsx("div", { className: "bg-white dark:bg-gray-800 shadow-sm rounded-lg", children: /* @__PURE__ */ jsx("div", { className: "px-6 py-8", children: /* @__PURE__ */ jsx(
       Form,
       {

package/lib/pages/AdminDataEditPage.js

@@ -10,7 +10,7 @@ import { Form } from "@nestledjs/forms";
 import { useAdminDataContext } from "../context/AdminDataContext.js";
 import { AdminDataStateMessage } from "../components/AdminDataStateMessage.js";
 import { useParams, Link, useNavigate } from "react-router";
-import { getAdminDocuments, buildFormFields, cleanFormInput } from "../utils/graphql-utils.js";
+import { sanitizeInput, getAdminDocuments, toKebabCase, toReadableText, buildFormFields, cleanFormInput } from "../utils/graphql-utils.js";
 function toLowerCamelCase(name) {
   if (!name) return "";
   return name.charAt(0).toLowerCase() + name.slice(1);
@@ -21,20 +21,10 @@ function getModelIdVariableName(modelName) {
 function getModelResponseFieldName(modelName) {
   return toLowerCamelCase(modelName);
 }
-function toReadableText(text) {
-  return text.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, (str) => str.toUpperCase());
-}
 if (process.env.NODE_ENV !== "production") {
   loadDevMessages();
   loadErrorMessages();
 }
-const sanitizeInput = (input) => {
-  if (!input || typeof input !== "string") return "";
-  return input.replace(/[<>"'%;()&+]/g, "").replace(/javascript:/gi, "").replace(/on\w+\s*=/gi, "").trim().substring(0, 100);
-};
-const toKebabCase = (str) => {
-  return str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
-};
 function processRelationFieldValue(field, item) {
   const relationFieldName = field.relationFromFields?.[0] || `${field.name}Id`;
   let value = item[relationFieldName];
@@ -62,6 +52,7 @@ function processDateFieldValue(field, value) {
       return dateValue.toISOString().substring(0, 16);
     }
   } catch (e) {
+    console.error("Unexpected error:", e);
     return "";
   }
 }
@@ -149,7 +140,12 @@ const validateId = (id) => {
 };
 function AdminDataEditPage() {
   const { dataType, id } = useParams();
-  const { databaseModels, basePath = "/admin/data", formTheme, displayFieldConfig } = useAdminDataContext();
+  const {
+    databaseModels,
+    basePath = "/admin/data",
+    formTheme,
+    displayFieldConfig
+  } = useAdminDataContext();
   const findModelByName = (name) => {
     return databaseModels.find((model2) => model2.name === name);
   };
@@ -203,9 +199,24 @@ function AdminDataEditPage() {
       ) })
     ] }) }) }) });
   }
-  return /* @__PURE__ */ jsx(AdminDataEditPageContent, { model, id: validatedId, basePath, formTheme, displayFieldConfig });
+  return /* @__PURE__ */ jsx(
+    AdminDataEditPageContent,
+    {
+      model,
+      id: validatedId,
+      basePath,
+      formTheme,
+      displayFieldConfig
+    }
+  );
 }
-function DeleteConfirmModal({ show, modelName, isDeleting, onConfirm, onCancel }) {
+function DeleteConfirmModal({
+  show,
+  modelName,
+  isDeleting,
+  onConfirm,
+  onCancel
+}) {
   if (!show) return null;
   return /* @__PURE__ */ jsx("div", { className: "fixed inset-0 bg-gray-600 dark:bg-gray-900 bg-opacity-50 dark:bg-opacity-75 overflow-y-auto h-full w-full z-50 flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "bg-white dark:bg-gray-800 p-6 rounded-lg shadow-xl max-w-md w-full mx-4", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
@@ -271,7 +282,13 @@ function getStatusIcon(isSuccess, isError) {
   }
   return /* @__PURE__ */ jsx("div", { className: "h-5 w-5 border-2 border-blue-400 border-t-transparent rounded-full animate-spin" });
 }
-function StatusMessage({ submissionStatus, deleteStatus, submissionMessage, deleteMessage, modelName }) {
+function StatusMessage({
+  submissionStatus,
+  deleteStatus,
+  submissionMessage,
+  deleteMessage,
+  modelName
+}) {
   if (submissionStatus === "idle" && deleteStatus === "idle") return null;
   const isSuccess = submissionStatus === "success" || deleteStatus === "success";
   const isError = submissionStatus === "error" || deleteStatus === "error";
@@ -334,7 +351,13 @@ async function executeDeleteMutation(deleteMutation, id, idVariableName, model)
     };
   }
 }
-function AdminDataEditPageContent({ model, id, basePath, formTheme, displayFieldConfig }) {
+function AdminDataEditPageContent({
+  model,
+  id,
+  basePath,
+  formTheme,
+  displayFieldConfig
+}) {
   const navigate = useNavigate();
   const { sdk, databaseModels } = useAdminDataContext();
   const [submissionState, setSubmissionState] = useState({ status: "idle" });
@@ -344,6 +367,7 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
     try {
       return getAdminDocuments(sdk, model);
     } catch (error2) {
+      console.error("Unexpected error:", error2);
       return null;
     }
   }, [sdk, model]);
@@ -355,6 +379,7 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
       }
       return gql(documents.query);
     } catch (error2) {
+      console.error("Unexpected error:", error2);
       return null;
     }
   }, [documents]);
@@ -366,6 +391,7 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
       }
       return gql(documents.update);
     } catch (error2) {
+      console.error("Unexpected error:", error2);
       return null;
     }
   }, [documents]);
@@ -377,6 +403,7 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
       }
       return gql(documents.delete);
     } catch (error2) {
+      console.error("Unexpected error:", error2);
       return null;
     }
   }, [documents]);
@@ -496,8 +523,8 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
       status: result.success ? "success" : "error",
       message: result.message
     });
-    if (typeof window !== "undefined") {
-      window.scrollTo({ top: 0, behavior: "smooth" });
+    if (globalThis.window !== void 0) {
+      globalThis.scrollTo({ top: 0, behavior: "smooth" });
     }
     if (result.success) {
       await refetch();
@@ -514,7 +541,14 @@ function AdminDataEditPageContent({ model, id, basePath, formTheme, displayField
   return /* @__PURE__ */ jsxs("div", { className: "space-y-6", children: [
     /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
       /* @__PURE__ */ jsx("nav", { className: "flex mb-6", "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsxs("ol", { className: "flex items-center space-x-4", children: [
-        /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(Link, { to: basePath, className: "text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-400", children: "Data Browser" }) }),
+        /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          Link,
+          {
+            to: basePath,
+            className: "text-gray-400 dark:text-gray-500 hover:text-gray-500 dark:hover:text-gray-400",
+            children: "Data Browser"
+          }
+        ) }),
         /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
           /* @__PURE__ */ jsx(
             "svg",