@open-kingdom/shared-frontend-ui-datagrid 0.0.2-0

package/dist/index.d.ts

@@ -0,0 +1,5 @@
+export * from './lib/datagrid';
+export * from './lib/datagrid.constants';
+export * from './lib/datagrid.types';
+export * from './lib/theme';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,aAAa,CAAC"}

package/dist/index.js

@@ -0,0 +1,140 @@
+import { jsx as u } from "react/jsx-runtime";
+import { AgGridReact as d } from "ag-grid-react";
+import { themeQuartz as a, colorSchemeLight as m, colorSchemeDark as p, ModuleRegistry as f, AllCommunityModule as S } from "ag-grid-community";
+export * from "ag-grid-community";
+const h = 20, g = [10, 20, 50, 100], T = 100, D = 500, C = "autoHeight", _ = "singleRow", b = "multiRow", E = {
+  // Column defaults
+  defaultColDef: {
+    sortable: !0,
+    filter: !0,
+    resizable: !0,
+    floatingFilter: !0,
+    minWidth: T
+  },
+  // Pagination
+  pagination: !0,
+  paginationPageSize: h,
+  paginationPageSizeSelector: g,
+  // UX
+  animateRows: !0,
+  enableCellTextSelection: !0,
+  ensureDomOrder: !0,
+  tooltipShowDelay: D,
+  suppressDragLeaveHidesColumns: !0,
+  domLayout: C,
+  // Auto-size
+  onFirstDataRendered: (s) => s.api.sizeColumnsToFit(),
+  // Loading states
+  overlayLoadingTemplate: `
+    <div class="ag-custom-loading">
+      <div class="ag-spinner"></div>
+      <span>Loading data...</span>
+    </div>
+  `,
+  overlayNoRowsTemplate: `
+    <div class="ag-custom-no-rows">
+      <span>No data to display</span>
+    </div>
+  `
+}, L = {
+  mode: b,
+  checkboxes: !0,
+  headerCheckbox: !0,
+  selectAll: "currentPage",
+  enableClickSelection: !1
+}, O = {
+  mode: _,
+  checkboxes: !1,
+  enableSelectionWithoutKeys: !0,
+  hideDisabledCheckboxes: !0
+}, w = {
+  height: "auto"
+};
+class y {
+  /**
+   * Adapts a UI-Theme to AG Grid theme format
+   * @param theme - UI-Theme object or undefined (uses AG Grid default)
+   * @param mode - Light or dark mode
+   * @returns AG Grid theme
+   */
+  static adapt(e, t) {
+    if (!e)
+      return a;
+    const o = this.applyColorScheme(e, t), r = {
+      ...this.extractColors(e.colors),
+      ...this.extractTypography(e.typography)
+    };
+    return Object.keys(r).length > 0 ? o.withParams(r) : o;
+  }
+  // Apply light/dark color scheme
+  static applyColorScheme(e, t) {
+    if (!(e.colors || t))
+      return a;
+    const o = t === "dark" ? m : p;
+    return a.withPart(o);
+  }
+  // Extract color parameters from theme
+  static extractColors(e) {
+    if (!e) return {};
+    const t = {
+      accentColor: e.primary?.["500"],
+      successColor: e.success?.["500"],
+      warningColor: e.warning?.["500"],
+      errorColor: e.error?.["500"]
+    };
+    return Object.fromEntries(
+      Object.entries(t).filter(([o, r]) => r !== void 0)
+    );
+  }
+  // Extract typography parameters from theme
+  static extractTypography(e) {
+    if (!e) return {};
+    const t = {};
+    if (e.fontFamily?.sans && (t.fontFamily = e.fontFamily.sans.join(", ")), e.fontSize?.base) {
+      const o = e.fontSize.base, r = typeof o == "string" ? o : o[0], i = this.parseSize(r);
+      i !== void 0 && (t.fontSize = i);
+    }
+    return t;
+  }
+  // Helper to parse size values
+  static parseSize(e) {
+    if (!e) return;
+    const t = parseFloat(e);
+    if (!isNaN(t))
+      return e.endsWith("rem") || e.endsWith("em") ? t * 16 : t;
+  }
+}
+f.registerModules([S]);
+const F = ({
+  className: s,
+  rowSelection: e,
+  containerStyle: t = w,
+  enableRowSelection: o = !1,
+  mode: r,
+  theme: i,
+  ...n
+}) => {
+  const c = e || (o ? L : O), l = y.adapt(i, r);
+  return /* @__PURE__ */ u(
+    d,
+    {
+      ...E,
+      ...n,
+      theme: l,
+      className: s,
+      containerStyle: t,
+      rowSelection: c
+    }
+  );
+};
+export {
+  T as DEFAULT_MIN_WIDTH,
+  h as DEFAULT_PAGE_SIZE,
+  g as DEFAULT_PAGE_SIZE_OPTIONS,
+  D as DEFAULT_TOOLTIP_DELAY,
+  C as DOM_LAYOUT_AUTO_HEIGHT,
+  F as DataGrid,
+  y as DataGridThemeAdapter,
+  b as ROW_SELECTION_MULTI,
+  _ as ROW_SELECTION_SINGLE
+};

package/dist/lib/datagrid.config.d.ts

@@ -0,0 +1,28 @@
+import { RowSelectionOptions, FirstDataRenderedEvent } from './datagrid.types';
+export declare const gridDefaults: {
+    defaultColDef: {
+        sortable: boolean;
+        filter: boolean;
+        resizable: boolean;
+        floatingFilter: boolean;
+        minWidth: number;
+    };
+    pagination: boolean;
+    paginationPageSize: number;
+    paginationPageSizeSelector: number[];
+    animateRows: boolean;
+    enableCellTextSelection: boolean;
+    ensureDomOrder: boolean;
+    tooltipShowDelay: number;
+    suppressDragLeaveHidesColumns: boolean;
+    domLayout: "autoHeight";
+    onFirstDataRendered: (params: FirstDataRenderedEvent) => void;
+    overlayLoadingTemplate: string;
+    overlayNoRowsTemplate: string;
+};
+export declare const multiRowSelectionDefaults: RowSelectionOptions;
+export declare const singleRowSelectionDefaults: RowSelectionOptions;
+export declare const containerDefaults: {
+    height: string;
+};
+//# sourceMappingURL=datagrid.config.d.ts.map

package/dist/lib/datagrid.config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid.config.d.ts","sourceRoot":"","sources":["../../src/lib/datagrid.config.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,KAAK,sBAAsB,EAC5B,MAAM,kBAAkB,CAAC;AAW1B,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;kCAwBO,sBAAsB;;;CAgBrD,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,mBAMvC,CAAC;AAEF,eAAO,MAAM,0BAA0B,EAAE,mBAKxC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;CAE7B,CAAC"}

package/dist/lib/datagrid.constants.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Grid Configuration Constants
+ */
+export declare const DEFAULT_PAGE_SIZE = 20;
+export declare const DEFAULT_PAGE_SIZE_OPTIONS: number[];
+export declare const DEFAULT_MIN_WIDTH = 100;
+export declare const DEFAULT_TOOLTIP_DELAY = 500;
+export declare const DOM_LAYOUT_AUTO_HEIGHT: "autoHeight";
+export declare const ROW_SELECTION_SINGLE: "singleRow";
+export declare const ROW_SELECTION_MULTI: "multiRow";
+//# sourceMappingURL=datagrid.constants.d.ts.map

package/dist/lib/datagrid.constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid.constants.d.ts","sourceRoot":"","sources":["../../src/lib/datagrid.constants.ts"],"names":[],"mappings":"AAAA;;GAEG;AAGH,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,yBAAyB,UAAoB,CAAC;AAG3D,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,qBAAqB,MAAM,CAAC;AAGzC,eAAO,MAAM,sBAAsB,EAAG,YAAqB,CAAC;AAG5D,eAAO,MAAM,oBAAoB,EAAG,WAAoB,CAAC;AACzD,eAAO,MAAM,mBAAmB,EAAG,UAAmB,CAAC"}

package/dist/lib/datagrid.d.ts

@@ -0,0 +1,3 @@
+import { DataGridProps } from './datagrid.types';
+export declare const DataGrid: ({ className, rowSelection, containerStyle, enableRowSelection, mode, theme, ...props }: DataGridProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=datagrid.d.ts.map

package/dist/lib/datagrid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid.d.ts","sourceRoot":"","sources":["../../src/lib/datagrid.tsx"],"names":[],"mappings":"AAOA,OAAO,EAGL,aAAa,EACd,MAAM,kBAAkB,CAAC;AAK1B,eAAO,MAAM,QAAQ,GAAI,wFAQtB,aAAa,4CAmBf,CAAC"}

package/dist/lib/datagrid.types.d.ts

@@ -0,0 +1,12 @@
+import { AgGridReactProps } from 'ag-grid-react';
+import { CSSProperties } from 'react';
+import { DataGridTheme, ThemeMode } from './theme';
+export interface DataGridProps extends Omit<AgGridReactProps, 'theme'> {
+    className?: string;
+    containerStyle?: CSSProperties;
+    enableRowSelection?: boolean;
+    mode?: ThemeMode;
+    theme?: DataGridTheme;
+}
+export * from 'ag-grid-community';
+//# sourceMappingURL=datagrid.types.d.ts.map

package/dist/lib/datagrid.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datagrid.types.d.ts","sourceRoot":"","sources":["../../src/lib/datagrid.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAE7D,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAED,cAAc,mBAAmB,CAAC"}

package/dist/lib/theme/index.d.ts

@@ -0,0 +1,3 @@
+export * from './theme.types';
+export * from './theme.adapter';
+//# sourceMappingURL=index.d.ts.map

package/dist/lib/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC"}

package/dist/lib/theme/theme.adapter.d.ts

@@ -0,0 +1,19 @@
+import { Theme as AgTheme } from '../datagrid.types';
+import { DataGridTheme, ThemeMode } from './theme.types';
+/**
+ * Theme adapter that converts UI-Theme format to AG Grid themes
+ */
+export declare class DataGridThemeAdapter {
+    /**
+     * Adapts a UI-Theme to AG Grid theme format
+     * @param theme - UI-Theme object or undefined (uses AG Grid default)
+     * @param mode - Light or dark mode
+     * @returns AG Grid theme
+     */
+    static adapt(theme: DataGridTheme, mode?: ThemeMode): AgTheme;
+    private static applyColorScheme;
+    private static extractColors;
+    private static extractTypography;
+    private static parseSize;
+}
+//# sourceMappingURL=theme.adapter.d.ts.map

package/dist/lib/theme/theme.adapter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.adapter.d.ts","sourceRoot":"","sources":["../../../src/lib/theme/theme.adapter.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,KAAK,IAAI,OAAO,EACtB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAW,MAAM,eAAe,CAAC;AAEvE;;GAEG;AACH,qBAAa,oBAAoB;IAC/B;;;;;OAKG;IACH,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE,aAAa,EAAE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO;IAsB7D,OAAO,CAAC,MAAM,CAAC,gBAAgB;IAa/B,OAAO,CAAC,MAAM,CAAC,aAAa;IAmB5B,OAAO,CAAC,MAAM,CAAC,iBAAiB;IA2BhC,OAAO,CAAC,MAAM,CAAC,SAAS;CAczB"}

package/dist/lib/theme/theme.types.d.ts

@@ -0,0 +1,23 @@
+export type ThemeMode = 'light' | 'dark';
+/**
+ * Theme structure for DataGrid - subset of UI-Theme library
+ * Only includes properties that can be mapped to AG Grid theme parameters
+ */
+export interface UITheme {
+    colors?: {
+        primary?: Record<string, string>;
+        success?: Record<string, string>;
+        warning?: Record<string, string>;
+        error?: Record<string, string>;
+    };
+    typography?: {
+        fontFamily?: {
+            sans?: string[];
+        };
+        fontSize?: Record<string, string | [string, {
+            lineHeight: string;
+        }]>;
+    };
+}
+export type DataGridTheme = UITheme | undefined;
+//# sourceMappingURL=theme.types.d.ts.map

package/dist/lib/theme/theme.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.types.d.ts","sourceRoot":"","sources":["../../../src/lib/theme/theme.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAEzC;;;GAGG;AACH,MAAM,WAAW,OAAO;IACtB,MAAM,CAAC,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACjC,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACjC,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;QACjC,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;KAChC,CAAC;IACF,UAAU,CAAC,EAAE;QACX,UAAU,CAAC,EAAE;YACX,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;SACjB,CAAC;QACF,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE;YAAE,UAAU,EAAE,MAAM,CAAA;SAAE,CAAC,CAAC,CAAC;KACtE,CAAC;CACH;AAGD,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,SAAS,CAAC"}

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@open-kingdom/shared-frontend-ui-datagrid",
+  "version": "0.0.2-0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "development": "./src/index.ts",
+      "default": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "!**/*.tsbuildinfo"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "nx": {
+    "name": "@open-kingdom/shared-frontend-ui-datagrid",
+    "tags": [
+      "scope:shared",
+      "type:ui",
+      "environment:frontend"
+    ]
+  },
+  "dependencies": {
+    "ag-grid-react": "^34.3.1",
+    "ag-grid-community": "^34.3.1"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  }
+}