@object-ui/plugin-aggrid 0.4.0 → 0.5.0

package/dist/ObjectAgGridImpl-CGFeGvOH.js

@@ -0,0 +1,372 @@
+import { j as d } from "./index-CLKYMco3.js";
+import { useRef as ne, useState as y, useEffect as B, useMemo as P, useCallback as g } from "react";
+import { AgGridReact as ae } from "ag-grid-react";
+const le = {
+  text: "agTextColumnFilter",
+  textarea: "agTextColumnFilter",
+  number: "agNumberColumnFilter",
+  currency: "agNumberColumnFilter",
+  percent: "agNumberColumnFilter",
+  boolean: "agSetColumnFilter",
+  date: "agDateColumnFilter",
+  datetime: "agDateColumnFilter",
+  time: "agTextColumnFilter",
+  email: "agTextColumnFilter",
+  phone: "agTextColumnFilter",
+  url: "agTextColumnFilter",
+  select: "agSetColumnFilter"
+};
+function fe({
+  objectName: a,
+  dataSource: l,
+  fields: e,
+  fieldNames: t,
+  filters: i,
+  sort: h,
+  pageSize: F = 10,
+  pagination: A = !0,
+  domLayout: k = "normal",
+  animateRows: N = !0,
+  rowSelection: D,
+  theme: J = "quartz",
+  height: w = 500,
+  className: K = "",
+  editable: E = !1,
+  editType: V,
+  singleClickEdit: I = !1,
+  stopEditingWhenCellsLoseFocus: L = !0,
+  exportConfig: m,
+  statusBar: S,
+  callbacks: o,
+  columnConfig: v,
+  enableRangeSelection: O = !1,
+  enableCharts: U = !1,
+  contextMenu: f
+}) {
+  const c = ne(null), [Q, x] = y(!0), [_, C] = y(null), [b, W] = y(null), [T, X] = y([]), [ue, Z] = y(0);
+  B(() => {
+    if (!l) {
+      C(new Error("DataSource is required")), x(!1);
+      return;
+    }
+    (async () => {
+      try {
+        x(!0), C(null);
+        const r = await l.getObjectSchema(a);
+        W(r);
+      } catch (r) {
+        const s = r instanceof Error ? r : new Error(String(r));
+        C(s), o?.onDataError?.(s);
+      } finally {
+        x(!1);
+      }
+    })();
+  }, [a, l, o]), B(() => {
+    if (!l || !b) return;
+    (async () => {
+      try {
+        x(!0), C(null);
+        const r = {
+          $top: F,
+          $skip: 0
+        };
+        i && (r.$filter = i), h && (r.$orderby = h);
+        const s = await l.find(a, r);
+        X(s.data || []), Z(s.total || 0), o?.onDataLoaded?.(s.data || []);
+      } catch (r) {
+        const s = r instanceof Error ? r : new Error(String(r));
+        C(s), o?.onDataError?.(s);
+      } finally {
+        x(!1);
+      }
+    })();
+  }, [a, l, b, i, h, F, o]);
+  const ee = P(() => {
+    if (!b?.fields) return [];
+    const n = e || Object.values(b.fields);
+    return (t ? n.filter((s) => t.includes(s.name)) : n).map((s) => {
+      const u = {
+        field: s.name,
+        headerName: s.label || s.name,
+        sortable: s.sortable !== !1,
+        filter: se(s),
+        editable: E && !s.readonly
+        // visible_on will be evaluated by the core renderer
+        // For now, we just show all fields. Conditional visibility
+        // should be handled at a higher level or via dynamic column updates
+      };
+      return v && (v.resizable !== void 0 && (u.resizable = v.resizable), v.sortable !== void 0 && u.sortable === void 0 && (u.sortable = v.sortable)), oe(u, s), u;
+    });
+  }, [b, e, t, E, v]), R = P(() => {
+    if (!S?.enabled) return;
+    const n = S.aggregations || ["count", "sum", "avg"], r = [];
+    return n.includes("count") && r.push({ statusPanel: "agAggregationComponent", statusPanelParams: { aggFuncs: ["count"] } }), n.includes("sum") && r.push({ statusPanel: "agAggregationComponent", statusPanelParams: { aggFuncs: ["sum"] } }), n.includes("avg") && r.push({ statusPanel: "agAggregationComponent", statusPanelParams: { aggFuncs: ["avg"] } }), n.includes("min") && r.push({ statusPanel: "agAggregationComponent", statusPanelParams: { aggFuncs: ["min"] } }), n.includes("max") && r.push({ statusPanel: "agAggregationComponent", statusPanelParams: { aggFuncs: ["max"] } }), r;
+  }, [S]), $ = g(() => {
+    if (!c.current?.api) return;
+    const n = {
+      fileName: m?.fileName || `${a}-export.csv`,
+      skipColumnHeaders: m?.skipColumnHeaders || !1,
+      allColumns: m?.allColumns || !1,
+      onlySelected: m?.onlySelected || !1
+    };
+    if (c.current.api.exportDataAsCsv(n), o?.onExport) {
+      const r = m?.onlySelected ? c.current.api.getSelectedRows() : T;
+      o.onExport(r || [], "csv");
+    }
+  }, [m, o, T, a]), z = g((n) => {
+    if (!f?.enabled) return [];
+    const r = [];
+    return (f.items || ["copy", "copyWithHeaders", "separator", "export"]).forEach((u) => {
+      u === "export" ? r.push({
+        name: "Export CSV",
+        icon: "<span>📥</span>",
+        action: () => $()
+      }) : u === "autoSizeAll" ? r.push({
+        name: "Auto-size All Columns",
+        action: () => {
+          c.current?.api && c.current.api.autoSizeAllColumns();
+        }
+      }) : u === "resetColumns" ? r.push({
+        name: "Reset Columns",
+        action: () => {
+          c.current?.api && c.current.api.resetColumnState();
+        }
+      }) : r.push(u);
+    }), f.customItems && (r.length > 0 && r.push("separator"), f.customItems.forEach((u) => {
+      r.push({
+        name: u.name,
+        disabled: u.disabled,
+        action: () => {
+          o?.onContextMenuAction && o.onContextMenuAction(u.action, n.node?.data);
+        }
+      });
+    })), r;
+  }, [f, $, o]), H = g((n) => {
+    o?.onCellClicked?.(n);
+  }, [o]), M = g((n) => {
+    o?.onRowClicked?.(n);
+  }, [o]), q = g((n) => {
+    o?.onSelectionChanged?.(n);
+  }, [o]), G = g(async (n) => {
+    if (o?.onCellValueChanged?.(n), l && n.data && n.data.id)
+      try {
+        await l.update(a, n.data.id, {
+          [n.colDef.field]: n.newValue
+        });
+      } catch (r) {
+        console.error("Failed to update record:", r), n.node.setDataValue(n.colDef.field, n.oldValue);
+      }
+  }, [o, l, a]), Y = g((n) => {
+    c.current = n;
+  }, []), te = P(() => ({
+    pagination: A,
+    paginationPageSize: F,
+    domLayout: k,
+    animateRows: N,
+    rowSelection: D,
+    editType: V,
+    singleClickEdit: I,
+    stopEditingWhenCellsLoseFocus: L,
+    statusBar: R ? { statusPanels: R } : void 0,
+    enableRangeSelection: O,
+    enableCharts: U,
+    getContextMenuItems: f?.enabled ? z : void 0,
+    suppressCellFocus: !E,
+    enableCellTextSelection: !0,
+    ensureDomOrder: !0,
+    onCellClicked: H,
+    onRowClicked: M,
+    onSelectionChanged: q,
+    onCellValueChanged: G,
+    onGridReady: Y
+  }), [
+    A,
+    F,
+    k,
+    N,
+    D,
+    V,
+    I,
+    L,
+    R,
+    O,
+    U,
+    f,
+    z,
+    E,
+    H,
+    M,
+    q,
+    G,
+    Y
+  ]), j = P(() => ({
+    height: typeof w == "number" ? `${w}px` : w,
+    width: "100%"
+  }), [w]), re = [
+    `ag-theme-${J}`,
+    "rounded-xl",
+    "border",
+    "border-border",
+    "overflow-hidden",
+    "shadow-lg",
+    K
+  ].filter(Boolean).join(" ");
+  return Q ? /* @__PURE__ */ d.jsx("div", { className: "flex items-center justify-center", style: j, children: /* @__PURE__ */ d.jsxs("div", { className: "text-muted-foreground", children: [
+    "Loading ",
+    a,
+    "..."
+  ] }) }) : _ ? /* @__PURE__ */ d.jsx("div", { className: "flex items-center justify-center", style: j, children: /* @__PURE__ */ d.jsxs("div", { className: "text-destructive", children: [
+    "Error loading data: ",
+    _.message
+  ] }) }) : /* @__PURE__ */ d.jsxs("div", { className: "object-aggrid-container", children: [
+    m?.enabled && /* @__PURE__ */ d.jsx("div", { className: "mb-2 flex gap-2", children: /* @__PURE__ */ d.jsx(
+      "button",
+      {
+        onClick: $,
+        className: "px-3 py-1.5 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-md transition-colors",
+        children: "Export CSV"
+      }
+    ) }),
+    /* @__PURE__ */ d.jsx(
+      "div",
+      {
+        className: re,
+        style: j,
+        children: /* @__PURE__ */ d.jsx(
+          ae,
+          {
+            ref: c,
+            rowData: T,
+            columnDefs: ee,
+            gridOptions: te
+          }
+        )
+      }
+    )
+  ] });
+}
+function p(a) {
+  const l = document.createElement("div");
+  return l.textContent = a, l.innerHTML;
+}
+function se(a) {
+  return a.filterable === !1 ? !1 : le[a.type] || "agTextColumnFilter";
+}
+function oe(a, l) {
+  switch (l.type) {
+    case "boolean":
+      a.cellRenderer = (e) => e.value === !0 ? "✓ Yes" : e.value === !1 ? "✗ No" : "";
+      break;
+    case "currency":
+      a.valueFormatter = (e) => {
+        if (e.value == null) return "";
+        const t = l.currency || "USD", i = l.precision || 2;
+        return new Intl.NumberFormat("en-US", {
+          style: "currency",
+          currency: t,
+          minimumFractionDigits: i,
+          maximumFractionDigits: i
+        }).format(e.value);
+      };
+      break;
+    case "percent":
+      a.valueFormatter = (e) => {
+        if (e.value == null) return "";
+        const t = l.precision || 2;
+        return `${(e.value * 100).toFixed(t)}%`;
+      };
+      break;
+    case "date":
+      a.valueFormatter = (e) => {
+        if (!e.value) return "";
+        try {
+          const t = new Date(e.value);
+          return isNaN(t.getTime()) ? "" : t.toLocaleDateString();
+        } catch {
+          return "";
+        }
+      };
+      break;
+    case "datetime":
+      a.valueFormatter = (e) => {
+        if (!e.value) return "";
+        try {
+          const t = new Date(e.value);
+          return isNaN(t.getTime()) ? "" : t.toLocaleString();
+        } catch {
+          return "";
+        }
+      };
+      break;
+    case "time":
+      a.valueFormatter = (e) => e.value ? e.value : "";
+      break;
+    case "email":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = p(e.value);
+        return `<a href="mailto:${t}" class="text-blue-600 hover:underline">${t}</a>`;
+      };
+      break;
+    case "url":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = p(e.value);
+        return `<a href="${t}" target="_blank" rel="noopener noreferrer" class="text-blue-600 hover:underline">${t}</a>`;
+      };
+      break;
+    case "phone":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = p(e.value);
+        return `<a href="tel:${t}" class="text-blue-600 hover:underline">${t}</a>`;
+      };
+      break;
+    case "select":
+      a.valueFormatter = (e) => e.value ? (l.options || []).find((h) => h.value === e.value)?.label || e.value : "";
+      break;
+    case "lookup":
+    case "master_detail":
+      a.valueFormatter = (e) => e.value ? typeof e.value == "object" ? e.value.name || e.value.label || e.value.id || "" : String(e.value) : "";
+      break;
+    case "number": {
+      const e = l.precision;
+      e !== void 0 && (a.valueFormatter = (t) => t.value == null ? "" : Number(t.value).toFixed(e));
+      break;
+    }
+    case "color":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = p(e.value);
+        return `<div class="flex items-center gap-2">
+          <div style="width: 16px; height: 16px; background-color: ${t}; border: 1px solid #ccc; border-radius: 2px;"></div>
+          <span>${t}</span>
+        </div>`;
+      };
+      break;
+    case "rating":
+      a.cellRenderer = (e) => {
+        if (e.value == null) return "";
+        const t = l.max || 5;
+        return "⭐".repeat(Math.min(e.value, t));
+      };
+      break;
+    case "image":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = typeof e.value == "string" ? e.value : e.value.url;
+        return t ? `<img src="${p(t)}" alt="" style="width: 40px; height: 40px; object-fit: cover; border-radius: 4px;" />` : "";
+      };
+      break;
+    case "avatar":
+      a.cellRenderer = (e) => {
+        if (!e.value) return "";
+        const t = typeof e.value == "string" ? e.value : e.value.url;
+        return t ? `<img src="${p(t)}" alt="" style="width: 32px; height: 32px; object-fit: cover; border-radius: 50%;" />` : "";
+      };
+      break;
+  }
+}
+export {
+  fe as default
+};