@nestledjs/data-browser 0.1.7 → 0.1.9

package/lib/components/shared/AdminStatusDisplay.js

@@ -1,205 +1,215 @@
-import { jsxDEV as o, Fragment as I } from "react/jsx-dev-runtime";
-import { QuestionMarkCircleIcon as S, PauseCircleIcon as $, CheckCircleIcon as b, XCircleIcon as u, ExclamationTriangleIcon as A, ClockIcon as D } from "@heroicons/react/24/solid";
-const L = (e) => ({
-  active: {
-    icon: b,
-    bgColor: "bg-green-100",
-    textColor: "text-green-800",
-    borderColor: "border-green-200",
-    defaultLabel: "Active"
-  },
-  inactive: {
-    icon: u,
-    bgColor: "bg-gray-100",
-    textColor: "text-gray-800",
-    borderColor: "border-gray-200",
-    defaultLabel: "Inactive"
-  },
-  pending: {
-    icon: D,
-    bgColor: "bg-yellow-100",
-    textColor: "text-yellow-800",
-    borderColor: "border-yellow-200",
-    defaultLabel: "Pending"
-  },
-  approved: {
-    icon: b,
-    bgColor: "bg-green-100",
-    textColor: "text-green-800",
-    borderColor: "border-green-200",
-    defaultLabel: "Approved"
-  },
-  rejected: {
-    icon: u,
-    bgColor: "bg-red-100",
-    textColor: "text-red-800",
-    borderColor: "border-red-200",
-    defaultLabel: "Rejected"
-  },
-  warning: {
-    icon: A,
-    bgColor: "bg-yellow-100",
-    textColor: "text-yellow-800",
-    borderColor: "border-yellow-200",
-    defaultLabel: "Warning"
-  },
-  error: {
-    icon: u,
-    bgColor: "bg-red-100",
-    textColor: "text-red-800",
-    borderColor: "border-red-200",
-    defaultLabel: "Error"
-  },
-  success: {
-    icon: b,
-    bgColor: "bg-green-100",
-    textColor: "text-green-800",
-    borderColor: "border-green-200",
-    defaultLabel: "Success"
-  },
-  paused: {
-    icon: $,
-    bgColor: "bg-blue-100",
-    textColor: "text-blue-800",
-    borderColor: "border-blue-200",
-    defaultLabel: "Paused"
-  },
-  unknown: {
-    icon: S,
-    bgColor: "bg-gray-100",
-    textColor: "text-gray-800",
-    borderColor: "border-gray-200",
-    defaultLabel: "Unknown"
-  }
-})[e], x = (e) => ({
-  small: {
-    text: "text-xs",
-    padding: "px-2 py-1",
-    icon: "h-3 w-3",
-    dot: "h-2 w-2"
-  },
-  medium: {
-    text: "text-sm",
-    padding: "px-2.5 py-1.5",
-    icon: "h-4 w-4",
-    dot: "h-3 w-3"
-  },
-  large: {
-    text: "text-base",
-    padding: "px-3 py-2",
-    icon: "h-5 w-5",
-    dot: "h-4 w-4"
-  }
-})[e], P = (e) => ({
-  badge: "inline-flex items-center rounded border font-medium",
-  pill: "inline-flex items-center rounded-full border font-medium",
-  dot: "inline-flex items-center font-medium",
-  full: "flex items-center justify-center rounded border font-medium w-full"
-})[e], U = (e) => ({
-  online: {
-    color: "bg-green-400",
-    label: "Online"
-  },
-  offline: {
-    color: "bg-gray-400",
-    label: "Offline"
-  },
-  away: {
-    color: "bg-yellow-400",
-    label: "Away"
-  },
-  busy: {
-    color: "bg-red-400",
-    label: "Busy"
-  }
-})[e];
-function O({
-  status: e,
-  label: t,
-  size: c = "medium",
-  variant: n = "badge",
-  showIcon: r = !0,
-  className: a = "",
-  onClick: s,
-  tooltip: i
-}) {
-  const l = L(e), d = x(c), y = P(n), h = l.icon, m = t || l.defaultLabel, g = n === "dot", N = r && !g, f = !!s, C = `${`${y} ${d.text} ${d.padding} ${l.bgColor} ${l.textColor} ${l.borderColor}`} ${f ? "cursor-pointer hover:opacity-80" : ""} ${a}`.trim(), j = () => g ? /* @__PURE__ */ o("span", { className: `inline-block rounded-full mr-2 ${l.bgColor.replace("bg-", "bg-").replace("-100", "-400")} ${d.dot}` }, void 0, !1, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
-    lineNumber: 221,
-    columnNumber: 7
-  }, this) : null, v = () => N ? /* @__PURE__ */ o(h, { className: `${d.icon} ${m ? "mr-1.5" : ""}` }, void 0, !1, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
-    lineNumber: 229,
-    columnNumber: 7
-  }, this) : null, p = /* @__PURE__ */ o(I, { children: [
-    j(),
-    v(),
-    m
-  ] }, void 0, !0, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
-    lineNumber: 234,
-    columnNumber: 5
-  }, this), w = () => {
-    s && s();
+import React from "react";
+import { QuestionMarkCircleIcon, PauseCircleIcon, CheckCircleIcon, XCircleIcon, ExclamationTriangleIcon, ClockIcon } from "@heroicons/react/24/solid";
+var _jsxFileName = "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx";
+const getStatusConfig = (status) => {
+  const configs = {
+    active: {
+      icon: CheckCircleIcon,
+      bgColor: "bg-green-100",
+      textColor: "text-green-800",
+      borderColor: "border-green-200",
+      defaultLabel: "Active"
+    },
+    inactive: {
+      icon: XCircleIcon,
+      bgColor: "bg-gray-100",
+      textColor: "text-gray-800",
+      borderColor: "border-gray-200",
+      defaultLabel: "Inactive"
+    },
+    pending: {
+      icon: ClockIcon,
+      bgColor: "bg-yellow-100",
+      textColor: "text-yellow-800",
+      borderColor: "border-yellow-200",
+      defaultLabel: "Pending"
+    },
+    approved: {
+      icon: CheckCircleIcon,
+      bgColor: "bg-green-100",
+      textColor: "text-green-800",
+      borderColor: "border-green-200",
+      defaultLabel: "Approved"
+    },
+    rejected: {
+      icon: XCircleIcon,
+      bgColor: "bg-red-100",
+      textColor: "text-red-800",
+      borderColor: "border-red-200",
+      defaultLabel: "Rejected"
+    },
+    warning: {
+      icon: ExclamationTriangleIcon,
+      bgColor: "bg-yellow-100",
+      textColor: "text-yellow-800",
+      borderColor: "border-yellow-200",
+      defaultLabel: "Warning"
+    },
+    error: {
+      icon: XCircleIcon,
+      bgColor: "bg-red-100",
+      textColor: "text-red-800",
+      borderColor: "border-red-200",
+      defaultLabel: "Error"
+    },
+    success: {
+      icon: CheckCircleIcon,
+      bgColor: "bg-green-100",
+      textColor: "text-green-800",
+      borderColor: "border-green-200",
+      defaultLabel: "Success"
+    },
+    paused: {
+      icon: PauseCircleIcon,
+      bgColor: "bg-blue-100",
+      textColor: "text-blue-800",
+      borderColor: "border-blue-200",
+      defaultLabel: "Paused"
+    },
+    unknown: {
+      icon: QuestionMarkCircleIcon,
+      bgColor: "bg-gray-100",
+      textColor: "text-gray-800",
+      borderColor: "border-gray-200",
+      defaultLabel: "Unknown"
+    }
+  };
+  return configs[status];
+};
+const getSizeClasses = (size) => {
+  const sizeClasses = {
+    small: {
+      text: "text-xs",
+      padding: "px-2 py-1",
+      icon: "h-3 w-3",
+      dot: "h-2 w-2"
+    },
+    medium: {
+      text: "text-sm",
+      padding: "px-2.5 py-1.5",
+      icon: "h-4 w-4",
+      dot: "h-3 w-3"
+    },
+    large: {
+      text: "text-base",
+      padding: "px-3 py-2",
+      icon: "h-5 w-5",
+      dot: "h-4 w-4"
+    }
   };
-  return f ? /* @__PURE__ */ o(
-    "button",
-    {
-      type: "button",
-      onClick: w,
-      className: C,
-      title: i,
-      children: p
+  return sizeClasses[size];
+};
+const getVariantClasses = (variant) => {
+  const variantClasses = {
+    badge: "inline-flex items-center rounded border font-medium",
+    pill: "inline-flex items-center rounded-full border font-medium",
+    dot: "inline-flex items-center font-medium",
+    full: "flex items-center justify-center rounded border font-medium w-full"
+  };
+  return variantClasses[variant];
+};
+const getUserStatusConfig = (status) => {
+  const configs = {
+    online: {
+      color: "bg-green-400",
+      label: "Online"
     },
-    void 0,
-    !1,
-    {
-      fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
+    offline: {
+      color: "bg-gray-400",
+      label: "Offline"
+    },
+    away: {
+      color: "bg-yellow-400",
+      label: "Away"
+    },
+    busy: {
+      color: "bg-red-400",
+      label: "Busy"
+    }
+  };
+  return configs[status];
+};
+function AdminStatusDisplay({
+  status,
+  label,
+  size = "medium",
+  variant = "badge",
+  showIcon = true,
+  className = "",
+  onClick,
+  tooltip
+}) {
+  const config = getStatusConfig(status);
+  const sizeClasses = getSizeClasses(size);
+  const variantClasses = getVariantClasses(variant);
+  const IconComponent = config.icon;
+  const displayLabel = label || config.defaultLabel;
+  const shouldShowDot = variant === "dot";
+  const shouldShowIcon = showIcon && !shouldShowDot;
+  const isClickable = !!onClick;
+  const baseClasses = `${variantClasses} ${sizeClasses.text} ${sizeClasses.padding} ${config.bgColor} ${config.textColor} ${config.borderColor}`;
+  const interactiveClasses = isClickable ? "cursor-pointer hover:opacity-80" : "";
+  const finalClasses = `${baseClasses} ${interactiveClasses} ${className}`.trim();
+  const renderDot = () => {
+    if (!shouldShowDot) return null;
+    return /* @__PURE__ */ React.createElement("span", { className: `inline-block rounded-full mr-2 ${config.bgColor.replace("bg-", "bg-").replace("-100", "-400")} ${sizeClasses.dot}`, __self: this, __source: {
+      fileName: _jsxFileName,
+      lineNumber: 221,
+      columnNumber: 7
+    } });
+  };
+  const renderIcon = () => {
+    if (!shouldShowIcon) return null;
+    return /* @__PURE__ */ React.createElement(IconComponent, { className: `${sizeClasses.icon} ${displayLabel ? "mr-1.5" : ""}`, __self: this, __source: {
+      fileName: _jsxFileName,
+      lineNumber: 229,
+      columnNumber: 7
+    } });
+  };
+  const content = /* @__PURE__ */ React.createElement(React.Fragment, null, renderDot(), renderIcon(), displayLabel);
+  const handleClick = () => {
+    if (onClick) {
+      onClick();
+    }
+  };
+  if (isClickable) {
+    return /* @__PURE__ */ React.createElement("button", { type: "button", onClick: handleClick, className: finalClasses, title: tooltip, __self: this, __source: {
+      fileName: _jsxFileName,
       lineNumber: 249,
       columnNumber: 7
-    },
-    this
-  ) : /* @__PURE__ */ o("span", { className: C, title: i, children: p }, void 0, !1, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
+    } }, content);
+  }
+  return /* @__PURE__ */ React.createElement("span", { className: finalClasses, title: tooltip, __self: this, __source: {
+    fileName: _jsxFileName,
     lineNumber: 261,
     columnNumber: 5
-  }, this);
+  } }, content);
 }
-function V({
-  status: e,
-  showLabel: t = !1,
-  size: c = "medium",
-  className: n = ""
+function AdminUserStatus({
+  status,
+  showLabel = false,
+  size = "medium",
+  className = ""
 }) {
-  const r = U(e), a = x(c), s = a.dot, i = t ? a.text : "";
-  return /* @__PURE__ */ o("div", { className: `inline-flex items-center ${n}`, children: [
-    /* @__PURE__ */ o(
-      "span",
-      {
-        className: `inline-block rounded-full ${r.color} ${s}`,
-        "aria-label": r.label
-      },
-      void 0,
-      !1,
-      {
-        fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
-        lineNumber: 281,
-        columnNumber: 7
-      },
-      this
-    ),
-    t && /* @__PURE__ */ o("span", { className: `ml-2 text-gray-700 ${i}`, children: r.label }, void 0, !1, {
-      fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
-      lineNumber: 286,
-      columnNumber: 9
-    }, this)
-  ] }, void 0, !0, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/components/shared/AdminStatusDisplay.tsx",
+  const config = getUserStatusConfig(status);
+  const sizeClasses = getSizeClasses(size);
+  const dotSizeClass = sizeClasses.dot;
+  const textSizeClass = showLabel ? sizeClasses.text : "";
+  return /* @__PURE__ */ React.createElement("div", { className: `inline-flex items-center ${className}`, __self: this, __source: {
+    fileName: _jsxFileName,
     lineNumber: 280,
     columnNumber: 5
-  }, this);
+  } }, /* @__PURE__ */ React.createElement("span", { className: `inline-block rounded-full ${config.color} ${dotSizeClass}`, "aria-label": config.label, __self: this, __source: {
+    fileName: _jsxFileName,
+    lineNumber: 281,
+    columnNumber: 7
+  } }), showLabel && /* @__PURE__ */ React.createElement("span", { className: `ml-2 text-gray-700 ${textSizeClass}`, __self: this, __source: {
+    fileName: _jsxFileName,
+    lineNumber: 286,
+    columnNumber: 9
+  } }, config.label));
 }
 export {
-  O as AdminStatusDisplay,
-  V as AdminUserStatus
+  AdminStatusDisplay,
+  AdminUserStatus
 };

package/lib/context/AdminDataContext.js

@@ -1,28 +1,32 @@
-import { jsxDEV as o } from "react/jsx-dev-runtime";
-import { createContext as d, useContext as m } from "react";
-const e = d(null);
-function l({
-  children: t,
-  sdk: n,
-  databaseModels: a,
-  basePath: r = "/admin/data",
-  formTheme: i
+import React, { createContext, useContext } from "react";
+var _jsxFileName = "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/context/AdminDataContext.tsx";
+const AdminDataContext = createContext(null);
+function AdminDataProvider({
+  children,
+  sdk,
+  databaseModels,
+  basePath = "/admin/data",
+  formTheme
 }) {
-  return /* @__PURE__ */ o(e.Provider, { value: { sdk: n, databaseModels: a, basePath: r, formTheme: i }, children: t }, void 0, !1, {
-    fileName: "/Users/justinhandley/IdeaProjects/nestled_template/libs/admin-data/src/lib/context/AdminDataContext.tsx",
+  return /* @__PURE__ */ React.createElement(AdminDataContext.Provider, { value: {
+    sdk,
+    databaseModels,
+    basePath,
+    formTheme
+  }, __self: this, __source: {
+    fileName: _jsxFileName,
     lineNumber: 55,
     columnNumber: 5
-  }, this);
+  } }, children);
 }
-function x() {
-  const t = m(e);
-  if (!t)
-    throw new Error(
-      "useAdminDataContext must be used within AdminDataProvider. Make sure to wrap your admin data routes with <AdminDataProvider>."
-    );
-  return t;
+function useAdminDataContext() {
+  const context = useContext(AdminDataContext);
+  if (!context) {
+    throw new Error("useAdminDataContext must be used within AdminDataProvider. Make sure to wrap your admin data routes with <AdminDataProvider>.");
+  }
+  return context;
 }
 export {
-  l as AdminDataProvider,
-  x as useAdminDataContext
+  AdminDataProvider,
+  useAdminDataContext
 };

package/lib/hooks/useAdminList.js

@@ -1,41 +1,41 @@
-import { useReducer as S } from "react";
-import { initialState as E } from "../types/index.js";
-function u(r, e) {
-  switch (e.type) {
+import { useReducer } from "react";
+import { initialState } from "../types/index.js";
+function adminListReducer(state, action) {
+  switch (action.type) {
     case "SET_SEARCH":
-      return { ...r, search: e.payload };
+      return { ...state, search: action.payload };
     case "SET_DEBOUNCED_SEARCH":
-      return { ...r, debouncedSearch: e.payload };
+      return { ...state, debouncedSearch: action.payload };
     case "SET_SKIP":
-      return { ...r, skip: e.payload };
+      return { ...state, skip: action.payload };
     case "SET_PAGE_SIZE":
-      return { ...r, pageSize: e.payload };
+      return { ...state, pageSize: action.payload };
     case "SET_SORT":
-      return { ...r, sort: e.payload };
+      return { ...state, sort: action.payload };
     case "SET_VISIBLE_COLUMNS":
-      return { ...r, visibleColumns: e.payload };
+      return { ...state, visibleColumns: action.payload };
     case "TOGGLE_COLUMN_SELECTOR":
-      return { ...r, showColumnSelector: !r.showColumnSelector };
+      return { ...state, showColumnSelector: !state.showColumnSelector };
     case "SET_SEARCH_FIELDS":
-      return { ...r, searchFields: e.payload };
+      return { ...state, searchFields: action.payload };
     case "TOGGLE_SEARCH_FIELD_SELECTOR":
-      return { ...r, showSearchFieldSelector: !r.showSearchFieldSelector };
+      return { ...state, showSearchFieldSelector: !state.showSearchFieldSelector };
     case "SET_FILTERS":
-      return { ...r, filters: e.payload };
+      return { ...state, filters: action.payload };
     case "TOGGLE_FILTERS":
-      return { ...r, showFilters: !r.showFilters };
+      return { ...state, showFilters: !state.showFilters };
     case "RESET_PAGINATION":
-      return { ...r, skip: 0 };
+      return { ...state, skip: 0 };
     case "RESET_FILTERS":
-      return { ...r, filters: {} };
+      return { ...state, filters: {} };
     default:
-      return r;
+      return state;
   }
 }
-function s() {
-  const [r, e] = S(u, E);
-  return { state: r, dispatch: e };
+function useAdminList() {
+  const [state, dispatch] = useReducer(adminListReducer, initialState);
+  return { state, dispatch };
 }
 export {
-  s as useAdminList
+  useAdminList
 };

package/lib/hooks/useClickOutside.js

@@ -1,13 +1,16 @@
-import { useEffect as o } from "react";
-function i(e, t, n = !0) {
-  o(() => {
-    if (!n) return;
-    const r = (u) => {
-      e.current && !e.current.contains(u.target) && t();
+import { useEffect } from "react";
+function useClickOutside(ref, handler, isActive = true) {
+  useEffect(() => {
+    if (!isActive) return;
+    const handleClickOutside = (event) => {
+      if (ref.current && !ref.current.contains(event.target)) {
+        handler();
+      }
     };
-    return document.addEventListener("mousedown", r), () => document.removeEventListener("mousedown", r);
-  }, [t, n]);
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [handler, isActive]);
 }
 export {
-  i as useClickOutside
+  useClickOutside
 };

package/lib/hooks/useDebounce.js

@@ -1,13 +1,14 @@
-import { useState as r, useEffect as c } from "react";
-function i(e, t) {
-  const [o, u] = r(e);
-  return c(() => {
-    const n = setTimeout(() => {
-      u(e);
-    }, t);
-    return () => clearTimeout(n);
-  }, [e, t]), o;
+import { useState, useEffect } from "react";
+function useDebounce(value, delay) {
+  const [debouncedValue, setDebouncedValue] = useState(value);
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delay);
+    return () => clearTimeout(timer);
+  }, [value, delay]);
+  return debouncedValue;
 }
 export {
-  i as useDebounce
+  useDebounce
 };