@highcharts/grid-pro 2.0.0 → 2.1.0

package/es-modules/Grid/Pro/CellRendering/ContentTypes/DateInputContentBase.d.ts

@@ -1,4 +1,4 @@
-import type DateInputRendererBase from '../Renderers/DateInputRendererBase';
+import type { DateInputRendererBaseOptions } from '../Renderers/DateInputRendererBase';
 import type { EditModeContent } from '../../CellEditing/CellEditMode';
 import type TableCell from '../../../Core/Table/Body/TableCell';
 import CellContentPro from '../CellContentPro.js';
@@ -17,7 +17,7 @@ declare abstract class DateInputContentBase extends CellContentPro implements Ed
     /**
      * Options of the renderer.
      */
-    options: DateInputRendererBase.Options;
+    options: DateInputRendererBaseOptions;
     /**
      * The HTML input element representing the date input.
      */

package/es-modules/Grid/Pro/CellRendering/ContentTypes/DateInputContentBase.js

@@ -14,6 +14,7 @@
  * */
 'use strict';
 import CellContentPro from '../CellContentPro.js';
+import Globals from '../../../Core/Globals.js';
 /* *
  *
  *  Class
@@ -50,7 +51,7 @@ class DateInputContentBase extends CellContentPro {
             }
             if (e.key === 'Enter') {
                 this.cell.htmlElement.focus();
-                void this.cell.setValue(this.value, true);
+                void this.cell.editValue(this.value);
             }
         };
         this.onBlur = (e) => {
@@ -58,7 +59,7 @@ class DateInputContentBase extends CellContentPro {
                 this.blurHandler(e);
                 return;
             }
-            void this.cell.setValue(this.value, true);
+            void this.cell.editValue(this.value);
         };
         this.onCellKeyDown = (e) => {
             if (e.key === ' ') {
@@ -85,6 +86,7 @@ class DateInputContentBase extends CellContentPro {
         input.tabIndex = -1;
         input.type = this.getInputType();
         input.name = cell.column.id + '-' + cell.row.id;
+        input.classList.add(Globals.getClassName('input'));
         if (options.attributes) {
             Object.entries(options.attributes).forEach(([key, value]) => {
                 input.setAttribute(key, value);

package/es-modules/Grid/Pro/CellRendering/ContentTypes/DateTimeInputContent.d.ts

@@ -1,11 +1,11 @@
 import type { EditModeContent } from '../../CellEditing/CellEditMode.js';
-import type DateTimeInputRenderer from '../Renderers/DateTimeInputRenderer.js';
+import type { DateTimeInputRendererOptions } from '../Renderers/DateTimeInputRenderer.js';
 import DateInputContentBase from './DateInputContentBase.js';
 /**
  * Represents a datetime input type of cell content.
  */
 declare class DateTimeInputContent extends DateInputContentBase implements EditModeContent {
-    options: DateTimeInputRenderer.Options;
+    options: DateTimeInputRendererOptions;
     protected getInputType(): 'datetime-local';
     protected convertToInputValue(): string;
 }

package/es-modules/Grid/Pro/CellRendering/ContentTypes/NumberInputContent.js

@@ -15,6 +15,7 @@
 'use strict';
 import CellContentPro from '../CellContentPro.js';
 import U from '../../../../Core/Utilities.js';
+import Globals from '../../../Core/Globals.js';
 const { defined } = U;
 /* *
  *
@@ -45,7 +46,7 @@ class NumberInputContent extends CellContentPro {
                 this.changeHandler(e);
                 return;
             }
-            void this.cell.setValue(this.value, true);
+            void this.cell.editValue(this.value);
         };
         this.onKeyDown = (e) => {
             e.stopPropagation();
@@ -90,6 +91,7 @@ class NumberInputContent extends CellContentPro {
         input.type = 'number';
         input.tabIndex = -1;
         input.name = cell.column.id + '-' + cell.row.id;
+        input.classList.add(Globals.getClassName('input'));
         if (options.attributes) {
             Object.entries(options.attributes).forEach(([key, value]) => {
                 input.setAttribute(key, value);

package/es-modules/Grid/Pro/CellRendering/ContentTypes/SelectContent.js

@@ -16,6 +16,7 @@
 'use strict';
 import CellContentPro from '../CellContentPro.js';
 import AST from '../../../../Core/Renderer/HTML/AST.js';
+import Globals from '../../../Core/Globals.js';
 /* *
  *
  *  Class
@@ -46,7 +47,7 @@ class SelectContent extends CellContentPro {
             }
             else {
                 this.cell.htmlElement.focus();
-                void this.cell.setValue(this.value, true);
+                void this.cell.editValue(this.value);
             }
         };
         this.onKeyDown = (e) => {
@@ -86,6 +87,7 @@ class SelectContent extends CellContentPro {
         const select = this.select = document.createElement('select');
         select.tabIndex = -1;
         select.name = cell.column.id + '-' + cell.row.id;
+        select.classList.add(Globals.getClassName('input'));
         if (options.attributes) {
             Object.entries(options.attributes).forEach(([key, value]) => {
                 select.setAttribute(key, value);

package/es-modules/Grid/Pro/CellRendering/ContentTypes/SparklineContent.d.ts

@@ -7,8 +7,27 @@ import CellContentPro from '../CellContentPro.js';
  * Represents a sparkline type of cell content.
  */
 declare class SparklineContent extends CellContentPro {
+    /**
+     * Highcharts namespace used by the Sparkline Renderer.
+     * This is set to `undefined` by default, and should be set to the
+     * Highcharts namespace before using the Sparkline Renderer.
+     */
+    static H: undefined | typeof HighchartsNamespace;
+    /**
+     * The default chart options for the sparkline content.
+     */
     static defaultChartOptions: DeepPartial<HighchartsNamespace.Options>;
+    /**
+     * The Highcharts chart instance.
+     */
     chart?: HighchartsNamespace.Chart;
+    /**
+     * The parent element for the sparkline content.
+     */
+    private parentElement;
+    /**
+     * The HTML container element for the chart.
+     */
     private chartContainer?;
     constructor(cell: TableCell, renderer: SparklineRenderer, parentElement?: HTMLElement);
     protected add(parentElement?: HTMLElement): void;
@@ -17,12 +36,4 @@ declare class SparklineContent extends CellContentPro {
     private getProcessedOptions;
     private onKeyDown;
 }
-declare namespace SparklineContent {
-    /**
-     * Highcharts namespace used by the Sparkline Renderer.
-     * This is set to `undefined` by default, and should be set to the
-     * Highcharts namespace before using the Sparkline Renderer.
-     */
-    let H: undefined | typeof HighchartsNamespace;
-}
 export default SparklineContent;

package/es-modules/Grid/Pro/CellRendering/ContentTypes/SparklineContent.js

@@ -37,7 +37,8 @@ class SparklineContent extends CellContentPro {
         this.onKeyDown = () => {
             this.cell.htmlElement.focus();
         };
-        this.add(parentElement);
+        this.parentElement = parentElement ?? this.cell.htmlElement;
+        this.add(this.parentElement);
     }
     /* *
      *
@@ -49,15 +50,22 @@ class SparklineContent extends CellContentPro {
         if (!H || !defined(this.cell.value)) {
             return;
         }
+        this.parentElement = parentElement;
         this.chartContainer = document.createElement('div');
-        parentElement.classList.add(Globals.getClassName('noPadding'));
-        parentElement.appendChild(this.chartContainer);
+        this.parentElement.classList.add(Globals.getClassName('noPadding'));
+        this.parentElement.appendChild(this.chartContainer);
         this.chart = H.Chart.chart(this.chartContainer, merge(SparklineContent.defaultChartOptions, this.getProcessedOptions()));
         this.chartContainer.addEventListener('click', this.onKeyDown);
     }
     update() {
-        const chartOptions = this.getProcessedOptions();
-        this.chart?.update(chartOptions, true, false, chartOptions.chart?.animation);
+        if (this.chart) {
+            const chartOptions = this.getProcessedOptions();
+            this.chart.update(chartOptions, true, false, chartOptions.chart?.animation);
+        }
+        else {
+            this.destroy();
+            this.add(this.parentElement);
+        }
     }
     destroy() {
         this.chartContainer?.removeEventListener('keydown', this.onKeyDown);
@@ -65,7 +73,7 @@ class SparklineContent extends CellContentPro {
         this.chartContainer?.remove();
         delete this.chart;
         delete this.chartContainer;
-        this.cell.htmlElement.classList.remove(Globals.getClassName('noPadding'));
+        this.parentElement.classList.remove(Globals.getClassName('noPadding'));
     }
     getProcessedOptions() {
         const renderer = this.renderer;
@@ -89,6 +97,9 @@ class SparklineContent extends CellContentPro {
         return options;
     }
 }
+/**
+ * The default chart options for the sparkline content.
+ */
 SparklineContent.defaultChartOptions = {
     chart: {
         height: 40,
@@ -142,13 +153,6 @@ SparklineContent.defaultChartOptions = {
         }
     }
 };
-/* *
- *
- *  Namespace
- *
- * */
-(function (SparklineContent) {
-})(SparklineContent || (SparklineContent = {}));
 /* *
  *
  *  Default Export

package/es-modules/Grid/Pro/CellRendering/ContentTypes/TextInputContent.js

@@ -16,6 +16,7 @@
 'use strict';
 import CellContentPro from '../CellContentPro.js';
 import U from '../../../../Core/Utilities.js';
+import Globals from '../../../Core/Globals.js';
 const { defined } = U;
 /* *
  *
@@ -42,7 +43,7 @@ class TextInputContent extends CellContentPro {
                 this.changeHandler(e);
                 return;
             }
-            void this.cell.setValue(e.target.value, true);
+            void this.cell.editValue(e.target.value);
         };
         this.onKeyDown = (e) => {
             e.stopPropagation();
@@ -86,6 +87,7 @@ class TextInputContent extends CellContentPro {
         const { options } = this.renderer;
         input.tabIndex = -1;
         input.name = cell.column.id + '-' + cell.row.id;
+        input.classList.add(Globals.getClassName('input'));
         if (options.attributes) {
             Object.entries(options.attributes).forEach(([key, value]) => {
                 input.setAttribute(key, value);

package/es-modules/Grid/Pro/CellRendering/ContentTypes/TimeInputContent.d.ts

@@ -1,11 +1,11 @@
 import type { EditModeContent } from '../../CellEditing/CellEditMode.js';
-import type TimeInputRenderer from '../Renderers/TimeInputRenderer.js';
+import type { TimeInputRendererOptions } from '../Renderers/TimeInputRenderer.js';
 import DateInputContentBase from './DateInputContentBase.js';
 /**
  * Represents a time input type of cell content.
  */
 declare class TimeInputContent extends DateInputContentBase implements EditModeContent {
-    options: TimeInputRenderer.Options;
+    options: TimeInputRendererOptions;
     protected getInputType(): 'time';
     get value(): number;
     protected convertToInputValue(): string;

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

@@ -2,7 +2,7 @@ import type Column from '../../../Core/Table/Column';
 import type { EditModeRenderer } from '../../CellEditing/CellEditMode';
 import type TableCell from '../../../Core/Table/Body/TableCell';
 import type { EditModeRendererTypeName } from '../../CellEditing/CellEditingComposition';
-import CellRenderer from '../CellRenderer.js';
+import { CellRenderer, CellRendererOptions } from '../CellRenderer.js';
 import CheckboxContent from '../ContentTypes/CheckboxContent.js';
 /**
  * Renderer for the Checkbox in a column.
@@ -15,32 +15,30 @@ declare class CheckboxRenderer extends CellRenderer implements EditModeRenderer
     /**
      * Default options for the checkbox renderer.
      */
-    static defaultOptions: CheckboxRenderer.Options;
-    options: CheckboxRenderer.Options;
-    constructor(column: Column, options: Partial<CellRenderer.Options>);
+    static defaultOptions: CheckboxRendererOptions;
+    options: CheckboxRendererOptions;
+    constructor(column: Column, options: Partial<CellRendererOptions>);
     render(cell: TableCell, parentElement?: HTMLElement): CheckboxContent;
 }
-declare namespace CheckboxRenderer {
+/**
+ * Options to control the checkbox renderer content.
+ */
+export interface CheckboxRendererOptions extends CellRendererOptions {
+    type: 'checkbox';
     /**
-     * Options to control the checkbox renderer content.
+     * Whether the checkbox is disabled.
      */
-    interface Options extends CellRenderer.Options {
-        type: 'checkbox';
-        /**
-         * Whether the checkbox is disabled.
-         */
-        disabled?: boolean;
-        /**
-         * Attributes to control the checkbox.
-         */
-        attributes?: CheckboxAttributes;
-    }
+    disabled?: boolean;
     /**
      * Attributes to control the checkbox.
      */
-    interface CheckboxAttributes {
-        checked?: boolean;
-    }
+    attributes?: CheckboxAttributes;
+}
+/**
+ * Attributes to control the checkbox.
+ */
+export interface CheckboxAttributes {
+    checked?: boolean;
 }
 declare module '../CellRendererType' {
     interface CellRendererTypeRegistry {

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

@@ -14,8 +14,8 @@
  *
  * */
 'use strict';
-import CellRenderer from '../CellRenderer.js';
-import CellRendererRegistry from '../CellRendererRegistry.js';
+import { CellRenderer } from '../CellRenderer.js';
+import { registerRenderer } from '../CellRendererRegistry.js';
 import CheckboxContent from '../ContentTypes/CheckboxContent.js';
 import U from '../../../../Core/Utilities.js';
 const { merge } = U;
@@ -56,7 +56,7 @@ CheckboxRenderer.defaultEditingRenderer = 'checkbox';
 CheckboxRenderer.defaultOptions = {
     type: 'checkbox'
 };
-CellRendererRegistry.registerRenderer('checkbox', CheckboxRenderer);
+registerRenderer('checkbox', CheckboxRenderer);
 /* *
  *
  *  Default Export

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

@@ -1,9 +1,9 @@
 import type Column from '../../../Core/Table/Column';
-import type DateInputRendererBase from './DateInputRendererBase';
+import type { DateInputRendererBaseOptions } from './DateInputRendererBase';
 import type TableCell from '../../../Core/Table/Body/TableCell';
 import type { EditModeRenderer } from '../../CellEditing/CellEditMode';
 import type { EditModeRendererTypeName } from '../../CellEditing/CellEditingComposition';
-import CellRenderer from '../CellRenderer.js';
+import { CellRenderer, CellRendererOptions } from '../CellRenderer.js';
 import DateInputContent from '../ContentTypes/DateInputContent.js';
 /**
  * Renderer for the Select in a column..
@@ -16,18 +16,16 @@ declare class DateInputRenderer extends CellRenderer implements EditModeRenderer
     /**
      * Default options for the date input renderer.
      */
-    static defaultOptions: DateInputRenderer.Options;
-    options: DateInputRenderer.Options;
-    constructor(column: Column, options: Partial<CellRenderer.Options>);
+    static defaultOptions: DateInputRendererOptions;
+    options: DateInputRendererOptions;
+    constructor(column: Column, options: Partial<CellRendererOptions>);
     render(cell: TableCell, parentElement?: HTMLElement): DateInputContent;
 }
-declare namespace DateInputRenderer {
-    /**
-     * Options to control the date input renderer content.
-     */
-    interface Options extends DateInputRendererBase.Options {
-        type: 'dateInput';
-    }
+/**
+ * Options to control the date input renderer content.
+ */
+export interface DateInputRendererOptions extends DateInputRendererBaseOptions {
+    type: 'dateInput';
 }
 declare module '../CellRendererType' {
     interface CellRendererTypeRegistry {

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

@@ -14,8 +14,8 @@
  *
  * */
 'use strict';
-import CellRenderer from '../CellRenderer.js';
-import CellRendererRegistry from '../CellRendererRegistry.js';
+import { CellRenderer } from '../CellRenderer.js';
+import { registerRenderer } from '../CellRendererRegistry.js';
 import DateInputContent from '../ContentTypes/DateInputContent.js';
 import U from '../../../../Core/Utilities.js';
 const { merge } = U;
@@ -56,7 +56,7 @@ DateInputRenderer.defaultEditingRenderer = 'dateInput';
 DateInputRenderer.defaultOptions = {
     type: 'dateInput'
 };
-CellRendererRegistry.registerRenderer('dateInput', DateInputRenderer);
+registerRenderer('dateInput', DateInputRenderer);
 /* *
  *
  *  Default Export

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

@@ -1,26 +1,23 @@
-import type CellRenderer from '../CellRenderer.js';
-declare namespace DateInputRendererBase {
+import type { CellRendererOptions } from '../CellRenderer.js';
+/**
+ * Options to control the date input renderer content.
+ */
+export interface DateInputRendererBaseOptions extends CellRendererOptions {
+    type: 'dateInput' | 'dateTimeInput' | 'timeInput';
     /**
-     * Options to control the date input renderer content.
+     * Whether the date input is disabled.
      */
-    interface Options extends CellRenderer.Options {
-        type: 'dateInput' | 'dateTimeInput' | 'timeInput';
-        /**
-         * Whether the date input is disabled.
-         */
-        disabled?: boolean;
-        /**
-         * Attributes to control the date input.
-         */
-        attributes?: DateInputAttributes;
-    }
+    disabled?: boolean;
     /**
      * Attributes to control the date input.
      */
-    interface DateInputAttributes {
-        min?: string;
-        max?: string;
-        step?: string;
-    }
+    attributes?: DateInputAttributes;
+}
+/**
+ * Attributes to control the date input.
+ */
+export interface DateInputAttributes {
+    min?: string;
+    max?: string;
+    step?: string;
 }
-export default DateInputRendererBase;

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

@@ -1,9 +1,9 @@
 import type Column from '../../../Core/Table/Column';
-import type DateInputRendererBase from './DateInputRendererBase';
+import type { DateInputRendererBaseOptions } from './DateInputRendererBase';
 import type TableCell from '../../../Core/Table/Body/TableCell';
 import type { EditModeRenderer } from '../../CellEditing/CellEditMode';
 import type { EditModeRendererTypeName } from '../../CellEditing/CellEditingComposition';
-import CellRenderer from '../CellRenderer.js';
+import { CellRenderer, CellRendererOptions } from '../CellRenderer.js';
 import DateTimeInputContent from '../ContentTypes/DateTimeInputContent.js';
 /**
  * Renderer for the Select in a column..
@@ -16,18 +16,16 @@ declare class DateTimeInputRenderer extends CellRenderer implements EditModeRend
     /**
      * Default options for the date input renderer.
      */
-    static defaultOptions: DateTimeInputRenderer.Options;
-    options: DateTimeInputRenderer.Options;
-    constructor(column: Column, options: Partial<CellRenderer.Options>);
+    static defaultOptions: DateTimeInputRendererOptions;
+    options: DateTimeInputRendererOptions;
+    constructor(column: Column, options: Partial<CellRendererOptions>);
     render(cell: TableCell, parentElement?: HTMLElement): DateTimeInputContent;
 }
-declare namespace DateTimeInputRenderer {
-    /**
-     * Options to control the date input renderer content.
-     */
-    interface Options extends DateInputRendererBase.Options {
-        type: 'dateTimeInput';
-    }
+/**
+ * Options to control the date time input renderer content.
+ */
+export interface DateTimeInputRendererOptions extends DateInputRendererBaseOptions {
+    type: 'dateTimeInput';
 }
 declare module '../CellRendererType' {
     interface CellRendererTypeRegistry {

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

@@ -13,8 +13,8 @@
  *
  * */
 'use strict';
-import CellRenderer from '../CellRenderer.js';
-import CellRendererRegistry from '../CellRendererRegistry.js';
+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;
@@ -55,7 +55,7 @@ DateTimeInputRenderer.defaultEditingRenderer = 'dateTimeInput';
 DateTimeInputRenderer.defaultOptions = {
     type: 'dateTimeInput'
 };
-CellRendererRegistry.registerRenderer('dateTimeInput', DateTimeInputRenderer);
+registerRenderer('dateTimeInput', DateTimeInputRenderer);
 /* *
  *
  *  Default Export

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

@@ -2,7 +2,7 @@ import type Column from '../../../Core/Table/Column';
 import type TableCell from '../../../Core/Table/Body/TableCell';
 import type { EditModeRenderer } from '../../CellEditing/CellEditMode';
 import type { EditModeRendererTypeName } from '../../CellEditing/CellEditingComposition';
-import CellRenderer from '../CellRenderer.js';
+import { CellRenderer, CellRendererOptions } from '../CellRenderer.js';
 import NumberInputContent from '../ContentTypes/NumberInputContent.js';
 /**
  * Renderer for the Select in a column..
@@ -15,34 +15,32 @@ declare class NumberInputRenderer extends CellRenderer implements EditModeRender
     /**
      * Default options for the date input renderer.
      */
-    static defaultOptions: NumberInputRenderer.Options;
-    options: NumberInputRenderer.Options;
-    constructor(column: Column, options: Partial<CellRenderer.Options>);
+    static defaultOptions: NumberInputRendererOptions;
+    options: NumberInputRendererOptions;
+    constructor(column: Column, options: Partial<CellRendererOptions>);
     render(cell: TableCell, parentElement?: HTMLElement): NumberInputContent;
 }
-declare namespace NumberInputRenderer {
+/**
+ * Options to control the number input renderer content.
+ */
+export interface NumberInputRendererOptions extends CellRendererOptions {
+    type: 'numberInput';
     /**
-     * Options to control the number input renderer content.
+     * Whether the number input is disabled.
      */
-    interface Options extends CellRenderer.Options {
-        type: 'numberInput';
-        /**
-         * Whether the number input is disabled.
-         */
-        disabled?: boolean;
-        /**
-         * Attributes to control the number input.
-         */
-        attributes?: NumberInputAttributes;
-    }
+    disabled?: boolean;
     /**
      * Attributes to control the number input.
      */
-    interface NumberInputAttributes {
-        min?: number;
-        max?: number;
-        step?: number;
-    }
+    attributes?: NumberInputAttributes;
+}
+/**
+ * Attributes to control the number input.
+ */
+export interface NumberInputAttributes {
+    min?: number;
+    max?: number;
+    step?: number;
 }
 declare module '../CellRendererType' {
     interface CellRendererTypeRegistry {

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

@@ -13,8 +13,8 @@
  *
  * */
 'use strict';
-import CellRenderer from '../CellRenderer.js';
-import CellRendererRegistry from '../CellRendererRegistry.js';
+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;
@@ -55,7 +55,7 @@ NumberInputRenderer.defaultEditingRenderer = 'numberInput';
 NumberInputRenderer.defaultOptions = {
     type: 'numberInput'
 };
-CellRendererRegistry.registerRenderer('numberInput', NumberInputRenderer);
+registerRenderer('numberInput', NumberInputRenderer);
 /* *
  *
  *  Default Export