@highcharts/grid-pro 2.2.0 → 2.3.0

package/es-modules/Grid/Pro/CellRendering/Renderers/DateTimeInputRenderer.js

@@ -16,8 +16,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import DateTimeInputContent from '../ContentTypes/DateTimeInputContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/NumberInputRenderer.js

@@ -16,8 +16,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import NumberInputContent from '../ContentTypes/NumberInputContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/SelectRenderer.js

@@ -17,8 +17,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import SelectContent from '../ContentTypes/SelectContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/SparklineRenderer.d.ts

@@ -1,7 +1,7 @@
 import type { AnyRecord } from '../../../../Shared/Types';
 import type Column from '../../../Core/Table/Column';
 import type TableCell from '../../../Core/Table/Body/TableCell';
-import type DataTable from '../../../../Data/DataTable';
+import type { CellType as DataTableCellType } from '../../../../Data/DataTable';
 import type { EditModeRendererTypeName } from '../../CellEditing/CellEditingComposition';
 import { CellRenderer, CellRendererOptions } from '../CellRenderer.js';
 import SparklineContent from '../ContentTypes/SparklineContent.js';
@@ -33,7 +33,7 @@ declare class SparklineRenderer extends CellRenderer {
  */
 export interface SparklineRendererOptions extends CellRendererOptions {
     type: 'sparkline';
-    chartOptions?: (((this: TableCell, data: DataTable.CellType) => AnyRecord) | AnyRecord);
+    chartOptions?: (((this: TableCell, data: DataTableCellType) => AnyRecord) | AnyRecord);
 }
 declare module '../CellRendererType' {
     interface CellRendererTypeRegistry {

package/es-modules/Grid/Pro/CellRendering/Renderers/SparklineRenderer.js

@@ -17,8 +17,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import SparklineContent from '../ContentTypes/SparklineContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/TextInputRenderer.js

@@ -17,8 +17,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import TextInputContent from '../ContentTypes/TextInputContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/TextRenderer.js

@@ -16,8 +16,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import TextContent from '../../../Core/Table/CellContent/TextContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/CellRendering/Renderers/TimeInputRenderer.js

@@ -16,8 +16,7 @@
 import { CellRenderer } from '../CellRenderer.js';
 import { registerRenderer } from '../CellRendererRegistry.js';
 import TimeInputContent from '../ContentTypes/TimeInputContent.js';
-import U from '../../../../Core/Utilities.js';
-const { merge } = U;
+import { merge } from '../../../../Shared/Utilities.js';
 /* *
  *
  *  Class

package/es-modules/Grid/Pro/ColumnTypes/Validator.js

@@ -16,9 +16,8 @@
 import AST from '../../../Core/Renderer/HTML/AST.js';
 import Globals from '../../Core/Globals.js';
 import GridUtils from '../../Core/GridUtils.js';
-import U from '../../../Core/Utilities.js';
+import { defined } from '../../../Shared/Utilities.js';
 const { makeDiv, setHTMLContent } = GridUtils;
-const { defined } = U;
 /* *
  *
  *  Class
@@ -217,32 +216,6 @@ Validator.rulesRegistry = {
             Number(rawValue) === 1 || Number(rawValue) === 0),
         notification: 'Value has to be a boolean.'
     },
-    ignoreCaseUnique: {
-        validate: function ({ rawValue }) {
-            const oldValue = String(this.value).toLowerCase();
-            const rowValueString = rawValue.toLowerCase();
-            if (oldValue === rowValueString) {
-                return true;
-            }
-            const columnData = this.column.data;
-            const isDuplicate = columnData?.some((value) => String(value).toLowerCase() ===
-                rowValueString);
-            return !isDuplicate;
-        },
-        notification: 'Value must be unique within this column (case-insensitive).'
-    },
-    unique: {
-        validate: function ({ rawValue }) {
-            const oldValue = this.value;
-            if (oldValue === rawValue) {
-                return true;
-            }
-            const columnData = this.column.data;
-            const isDuplicate = columnData?.some((value) => value === rawValue);
-            return !isDuplicate;
-        },
-        notification: 'Value must be unique within this column (case-sensitive).'
-    },
     arrayNumber: {
         validate: function ({ rawValue }) {
             return rawValue
@@ -256,9 +229,8 @@ Validator.rulesRegistry = {
             try {
                 JSON.parse(rawValue);
                 return true;
-                // eslint-disable-next-line @typescript-eslint/no-unused-vars
             }
-            catch (e) {
+            catch {
                 return false;
             }
         },
@@ -271,8 +243,38 @@ Validator.rulesRegistry = {
             return arrayNumberValidate({ rawValue }) ||
                 jsonValidate({ rawValue });
         },
-        // eslint-disable-next-line max-len
-        notification: 'Value should be a valid JSON or a list of numbers separated by commas.'
+        notification: 'Value should be a valid JSON or a list of numbers ' +
+            'separated by commas.'
+    },
+    ignoreCaseUnique: {
+        validate: function ({ rawValue }) {
+            const oldValue = String(this.value).toLowerCase();
+            const rowValueString = rawValue.toLowerCase();
+            if (oldValue === rowValueString) {
+                return true;
+            }
+            // Local dataset only
+            // TODO(enhancement): Implement this for remote dataset.
+            const columnData = this.column.data;
+            const isDuplicate = columnData?.some((value) => (String(value).toLowerCase() ===
+                rowValueString));
+            return !isDuplicate;
+        },
+        notification: 'Value must be unique within this column (case-insensitive).'
+    },
+    unique: {
+        validate: function ({ rawValue }) {
+            const oldValue = this.value;
+            if (oldValue === rawValue) {
+                return true;
+            }
+            // Local dataset only
+            // TODO(enhancement): Implement this for remote dataset.
+            const columnData = this.column.data;
+            const isDuplicate = columnData?.some((value) => value === rawValue);
+            return !isDuplicate;
+        },
+        notification: 'Value must be unique within this column (case-sensitive).'
     }
 };
 /**

package/es-modules/Grid/Pro/ColumnTypes/ValidatorComposition.d.ts

@@ -14,7 +14,7 @@ declare module '../../Core/Table/Table' {
         /**
          * The validator object.
          */
-        validator: Validator;
+        validator?: Validator;
     }
 }
 declare module '../../Pro/CellEditing/CellEditingComposition' {

package/es-modules/Grid/Pro/ColumnTypes/ValidatorComposition.js

@@ -15,8 +15,7 @@
 'use strict';
 import Validator from './Validator.js';
 import Globals from '../../Core/Globals.js';
-import U from '../../../Core/Utilities.js';
-const { addEvent, pushUnique } = U;
+import { addEvent, pushUnique } from '../../../Shared/Utilities.js';
 /* *
  *
  *  Composition
@@ -33,7 +32,7 @@ export function compose(TableClass) {
     if (!pushUnique(Globals.composed, 'Validator')) {
         return;
     }
-    addEvent(TableClass, 'afterInit', initValidatorComposition);
+    addEvent(TableClass, 'beforeInit', initValidatorComposition);
     addEvent(TableClass, 'afterDestroy', destroy);
 }
 /**
@@ -46,7 +45,7 @@ function initValidatorComposition() {
  * Callback function called after table destroy.
  */
 function destroy() {
-    this.validator.destroy();
+    this.validator?.destroy();
 }
 /* *
  *

package/es-modules/Grid/Pro/Credits/CreditsProComposition.js

@@ -16,9 +16,8 @@
 'use strict';
 import CreditsPro from './CreditsPro.js';
 import Globals from '../../Core/Globals.js';
-import U from '../../../Core/Utilities.js';
 import { defaultOptions } from '../../Core/Defaults.js';
-const { addEvent, merge, pushUnique } = U;
+import { addEvent, merge, pushUnique } from '../../../Shared/Utilities.js';
 /* *
  *
  *  Composition
@@ -38,7 +37,6 @@ export function compose(GridClass) {
     merge(true, defaultOptions, {
         credits: CreditsPro.defaultOptions
     });
-    // TODO: Change to `beforeLoad` after upgrading grid update.
     addEvent(GridClass, 'afterRenderViewport', initCredits);
 }
 /**

package/es-modules/Grid/Pro/Data/DataSourceHelper.d.ts

@@ -0,0 +1,74 @@
+import type { RemoteFetchCallbackResult } from './RemoteDataProvider';
+import type QueryingController from '../../Core/Querying/QueryingController';
+/**
+ * Builds a URL with query parameters for fetching data from the remote server.
+ *
+ * @param options
+ * The options for building the URL.
+ *
+ * @param state
+ * The query state containing the query, offset and limit.
+ *
+ * @returns
+ * The complete URL string with all query parameters.
+ */
+export declare function buildUrl(options: DataSourceOptions, state: QueryState): string;
+/**
+ * Fetches data from the remote server using the data source options.
+ *
+ * @param options
+ * The options for fetching data from the remote server.
+ *
+ * @param state
+ * The query state containing the query, offset and limit.
+ *
+ * @returns
+ * The fetched data.
+ */
+export declare function dataSourceFetch(options: DataSourceOptions, state: QueryState): Promise<RemoteFetchCallbackResult>;
+/**
+ * Serialized configuration alternatively to `fetchCallback`.
+ */
+export interface DataSourceOptions {
+    /**
+     * The URL template to be used to fetch data from the remote server.
+     * Available template variables:
+     * - `page` - The current page number.
+     * - `pageSize` - The current page size.
+     * - `offset` - The current offset ((page - 1) * pageSize).
+     * - `limit` - Alias to `pageSize`.
+     * - `filter` - The filter conditions.
+     * - `sortBy` - The sort by conditions.
+     * - `sortOrder` - The sort order.
+     *
+     * Example: `https://api.example.com/data?page={page}&pageSize={pageSize}`
+     *
+     * This list can be extended by adding custom template variables to the
+     * `templateVariables` option.
+     */
+    urlTemplate: string;
+    /**
+     * Template variables to be replaced in the urlTemplate.
+     */
+    templateVariables?: Record<string, (state: QueryState) => string>;
+    /**
+     * If `true`, empty query parameters are omitted from the URL.
+     * @default true
+     */
+    omitEmpty?: boolean;
+    /**
+     * Callback to parse the response from the remote server.
+     */
+    parseResponse?: (res: Response) => Promise<RemoteFetchCallbackResult>;
+    /**
+     * Timeout (ms) for the remote request. Set to 0 to disable.
+     * @default 30000
+     */
+    fetchTimeout?: number;
+}
+export interface QueryState {
+    query: QueryingController;
+    offset: number;
+    limit: number;
+    signal?: AbortSignal;
+}

package/es-modules/Grid/Pro/Data/DataSourceHelper.js

@@ -0,0 +1,246 @@
+/* *
+ *
+ *  Remote Data Provider class
+ *
+ *  (c) 2020-2025 Highsoft AS
+ *
+ *  License: www.highcharts.com/license
+ *
+ *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
+ *
+ *  Authors:
+ *  - Dawid Dragula
+ *
+ * */
+'use strict';
+import { defined } from '../../../Shared/Utilities.js';
+import T from '../../../Core/Templating.js';
+const { format } = T;
+/* *
+ *
+ *  Definitions
+ *
+ * */
+/**
+ * Mapping from Grid filter operators to standard API filter conditions.
+ */
+const filterOperatorMap = {
+    '==': 'equals',
+    '===': 'equals',
+    '!=': 'doesNotEqual',
+    '!==': 'doesNotEqual',
+    '>': 'greaterThan',
+    '>=': 'greaterThanOrEqualTo',
+    '<': 'lessThan',
+    '<=': 'lessThanOrEqualTo',
+    contains: 'contains',
+    startsWith: 'beginsWith',
+    endsWith: 'endsWith',
+    empty: 'empty'
+};
+/**
+ * Recursively extracts filter conditions from the Grid's FilterCondition
+ * structure into a flat array of API filter conditions.
+ *
+ * @param condition
+ * The filter condition from the Grid's filtering modifier.
+ *
+ * @param filterColumns
+ * The array to accumulate filter conditions into.
+ *
+ * @returns
+ * The accumulated filter conditions array.
+ */
+function extractFilterConditions(condition, filterColumns = []) {
+    if (!condition) {
+        return filterColumns;
+    }
+    if (condition.operator === 'and' || condition.operator === 'or') {
+        // Logical condition - extract from nested conditions
+        if (condition.conditions) {
+            for (const subCondition of condition.conditions) {
+                extractFilterConditions(subCondition, filterColumns);
+            }
+        }
+    }
+    else if (condition.columnId) {
+        // Single condition
+        const mappedOperator = filterOperatorMap[condition.operator] || condition.operator;
+        filterColumns.push({
+            id: condition.columnId,
+            condition: mappedOperator,
+            value: condition.value
+        });
+    }
+    return filterColumns;
+}
+/**
+ * Returns the active sortings from the query state.
+ *
+ * @param state
+ * The query state.
+ *
+ * @returns
+ * The active sortings.
+ */
+const getActiveSortings = (state) => {
+    const { currentSortings, currentSorting } = state.query.sorting;
+    return (currentSortings ?? (currentSorting ? [currentSorting] : [])).filter((sorting) => defined(sorting?.columnId) && defined(sorting.order));
+};
+const defaultTemplateVariables = {
+    page: (state) => (Math.floor(state.offset / (state.limit || 1)) + 1).toFixed(),
+    pageSize: (state) => state.limit.toFixed(),
+    offset: (state) => state.offset.toFixed(),
+    limit: (state) => state.limit.toFixed(),
+    format: () => 'js',
+    filter: (state) => {
+        const filterColumns = [];
+        const filterCondition = state.query.filtering.modifier?.options?.condition;
+        if (filterCondition) {
+            extractFilterConditions(filterCondition, filterColumns);
+        }
+        if (!filterColumns.length) {
+            return '';
+        }
+        return JSON.stringify({ columns: filterColumns });
+    },
+    sortBy: (state) => {
+        const sortings = getActiveSortings(state);
+        if (!sortings.length) {
+            return '';
+        }
+        return sortings.map((sorting) => sorting.columnId).join(',');
+    },
+    sortOrder: (state) => {
+        const sortings = getActiveSortings(state);
+        if (!sortings.length) {
+            return '';
+        }
+        const sortOrders = sortings.map((sorting) => sorting.order);
+        const uniqueOrders = Array.from(new Set(sortOrders));
+        return uniqueOrders.length === 1 ?
+            uniqueOrders[0] :
+            sortOrders.join(',');
+    }
+};
+const defaultParseResponse = async (res) => {
+    if (!res.ok) {
+        let message = `DataSourceHelper: request failed with status ${res.status} ${res.statusText}`;
+        try {
+            const body = await res.text();
+            if (body) {
+                message += ` - ${body}`;
+            }
+        }
+        catch {
+            // Ignore response body parsing errors for error responses.
+        }
+        throw new Error(message);
+    }
+    const { data, meta } = await res.json();
+    return {
+        columns: data || {},
+        totalRowCount: meta?.totalRowCount || 0,
+        rowIds: meta?.rowIds
+    };
+};
+/**
+ * Builds a URL with query parameters for fetching data from the remote server.
+ *
+ * @param options
+ * The options for building the URL.
+ *
+ * @param state
+ * The query state containing the query, offset and limit.
+ *
+ * @returns
+ * The complete URL string with all query parameters.
+ */
+export function buildUrl(options, state) {
+    const { urlTemplate, templateVariables, omitEmpty } = options;
+    const variables = {
+        ...defaultTemplateVariables,
+        ...templateVariables
+    };
+    const context = {};
+    // Populate context with template variables in form of getter functions
+    // so that only the variables that are actually used in the URL are
+    // evaluated.
+    Object.keys(variables).forEach((key) => {
+        const value = variables[key];
+        Object.defineProperty(context, key, {
+            enumerable: true,
+            get: () => value(state)
+        });
+    });
+    const res = format(urlTemplate, context);
+    if (omitEmpty ?? true) {
+        return res.replace(/&([^=&]+)=([^&]*)/g, (_, key, value) => (value ? `&${key}=${value}` : ''));
+    }
+    return res;
+}
+/**
+ * Fetches data from the remote server using the data source options.
+ *
+ * @param options
+ * The options for fetching data from the remote server.
+ *
+ * @param state
+ * The query state containing the query, offset and limit.
+ *
+ * @returns
+ * The fetched data.
+ */
+export async function dataSourceFetch(options, state) {
+    const { parseResponse = defaultParseResponse, fetchTimeout = 30000 } = options;
+    try {
+        const url = buildUrl(options, state);
+        const controller = fetchTimeout > 0 ? new AbortController() : null;
+        const externalSignal = state.signal;
+        let timeoutId;
+        if (controller && externalSignal) {
+            if (externalSignal.aborted) {
+                controller.abort();
+            }
+            else {
+                externalSignal.addEventListener('abort', () => {
+                    controller.abort();
+                }, { once: true });
+            }
+        }
+        if (controller) {
+            timeoutId = setTimeout(() => {
+                controller.abort();
+            }, fetchTimeout);
+        }
+        try {
+            const signal = controller?.signal ?? externalSignal;
+            const res = signal ?
+                await fetch(url, { signal }) :
+                await fetch(url);
+            const data = await parseResponse(res);
+            return data;
+        }
+        finally {
+            if (timeoutId) {
+                clearTimeout(timeoutId);
+            }
+        }
+    }
+    catch (err) {
+        if (err instanceof DOMException && err.name === 'AbortError') {
+            return {
+                columns: {},
+                totalRowCount: 0,
+                rowIds: []
+            };
+        }
+        // eslint-disable-next-line no-console
+        console.error('Error fetching data from remote server.\n', err);
+        return {
+            columns: {},
+            totalRowCount: 0,
+            rowIds: []
+        };
+    }
+}

package/es-modules/Grid/Pro/Data/QuerySerializer.d.ts

@@ -0,0 +1,46 @@
+export interface QueryFingerprintInput {
+    sorting: {
+        modifier?: {
+            options?: unknown;
+        };
+    };
+    filtering: {
+        modifier?: {
+            options?: unknown;
+        };
+    };
+    pagination: {
+        enabled: boolean;
+        currentPage: number;
+        currentPageSize: number;
+    };
+}
+/**
+ * Creates a deterministic fingerprint of the current query state.
+ *
+ * @param input
+ * Minimal query-like object (duck-typed) containing sorting, filtering and
+ * pagination state.
+ */
+export declare function createQueryFingerprint(input: QueryFingerprintInput): string;
+/**
+ * Serializes a filter condition into a deterministic string.
+ *
+ * @param condition
+ * Filter condition (serializable object, callback, or primitive).
+ */
+export declare function serializeFilterCondition(condition: unknown): string;
+/**
+ * Serializes an arbitrary value into a deterministic string.
+ *
+ * @param value
+ * Value to serialize.
+ */
+export declare function serializeValue(value: unknown): string;
+/**
+ * Small deterministic hash for strings (djb2-ish), returned as base36.
+ *
+ * @param str
+ * String to hash.
+ */
+export declare function hashString(str: string): string;