handsontable 0.0.0-next-5b14d3c-20241107 → 0.0.0-next-6129043-20241108

Sign up to get free protection for your applications and to get access to all the features.

Potentially problematic release.


This version of handsontable might be problematic. Click here for more details.

Files changed (99) hide show
  1. package/3rdparty/walkontable/src/calculator/index.js +1 -2
  2. package/3rdparty/walkontable/src/calculator/index.mjs +2 -2
  3. package/3rdparty/walkontable/src/calculator/viewportRows.js +3 -3
  4. package/3rdparty/walkontable/src/calculator/viewportRows.mjs +3 -3
  5. package/3rdparty/walkontable/src/core/_base.js +3 -0
  6. package/3rdparty/walkontable/src/core/_base.mjs +3 -0
  7. package/3rdparty/walkontable/src/core/clone.js +1 -0
  8. package/3rdparty/walkontable/src/core/clone.mjs +1 -0
  9. package/3rdparty/walkontable/src/core/core.js +2 -0
  10. package/3rdparty/walkontable/src/core/core.mjs +2 -0
  11. package/3rdparty/walkontable/src/facade/core.js +3 -0
  12. package/3rdparty/walkontable/src/facade/core.mjs +3 -0
  13. package/3rdparty/walkontable/src/index.js +0 -1
  14. package/3rdparty/walkontable/src/index.mjs +2 -2
  15. package/3rdparty/walkontable/src/overlay/_base.js +3 -1
  16. package/3rdparty/walkontable/src/overlay/_base.mjs +3 -1
  17. package/3rdparty/walkontable/src/overlay/bottom.js +2 -2
  18. package/3rdparty/walkontable/src/overlay/bottom.mjs +2 -2
  19. package/3rdparty/walkontable/src/overlay/top.js +1 -1
  20. package/3rdparty/walkontable/src/overlay/top.mjs +1 -1
  21. package/3rdparty/walkontable/src/renderer/index.js +4 -2
  22. package/3rdparty/walkontable/src/renderer/index.mjs +4 -2
  23. package/3rdparty/walkontable/src/renderer/table.js +12 -3
  24. package/3rdparty/walkontable/src/renderer/table.mjs +12 -3
  25. package/3rdparty/walkontable/src/settings.js +0 -2
  26. package/3rdparty/walkontable/src/settings.mjs +0 -2
  27. package/3rdparty/walkontable/src/table.js +15 -9
  28. package/3rdparty/walkontable/src/table.mjs +15 -9
  29. package/3rdparty/walkontable/src/types.js +1 -0
  30. package/3rdparty/walkontable/src/types.mjs +1 -0
  31. package/3rdparty/walkontable/src/utils/column.js +1 -1
  32. package/3rdparty/walkontable/src/utils/column.mjs +1 -1
  33. package/3rdparty/walkontable/src/utils/stylesHandler.js +271 -0
  34. package/3rdparty/walkontable/src/utils/stylesHandler.mjs +267 -0
  35. package/3rdparty/walkontable/src/viewport.js +1 -0
  36. package/3rdparty/walkontable/src/viewport.mjs +1 -0
  37. package/base.js +2 -2
  38. package/base.mjs +2 -2
  39. package/core.d.ts +2 -0
  40. package/core.js +46 -0
  41. package/core.mjs +46 -0
  42. package/dataMap/metaManager/metaSchema.js +23 -3
  43. package/dataMap/metaManager/metaSchema.mjs +23 -3
  44. package/dist/handsontable.css +17 -9
  45. package/dist/handsontable.full.css +249 -240
  46. package/dist/handsontable.full.js +4119 -3840
  47. package/dist/handsontable.full.min.css +11 -9
  48. package/dist/handsontable.full.min.js +26 -26
  49. package/dist/handsontable.js +3826 -3541
  50. package/dist/handsontable.min.css +5 -4
  51. package/dist/handsontable.min.js +24 -24
  52. package/editors/autocompleteEditor/autocompleteEditor.js +1 -1
  53. package/editors/autocompleteEditor/autocompleteEditor.mjs +1 -1
  54. package/editors/baseEditor/baseEditor.js +1 -1
  55. package/editors/baseEditor/baseEditor.mjs +1 -1
  56. package/editors/dateEditor/dateEditor.js +2 -0
  57. package/editors/dateEditor/dateEditor.mjs +2 -0
  58. package/editors/handsontableEditor/handsontableEditor.js +2 -1
  59. package/editors/handsontableEditor/handsontableEditor.mjs +2 -1
  60. package/editors/selectEditor/selectEditor.js +20 -9
  61. package/editors/selectEditor/selectEditor.mjs +20 -9
  62. package/editors/textEditor/textEditor.js +4 -11
  63. package/editors/textEditor/textEditor.mjs +4 -11
  64. package/helpers/dom/element.js +31 -0
  65. package/helpers/dom/element.mjs +30 -0
  66. package/helpers/mixed.js +2 -2
  67. package/helpers/mixed.mjs +2 -2
  68. package/helpers/themes.js +17 -0
  69. package/helpers/themes.mjs +13 -0
  70. package/package.json +10 -3
  71. package/plugins/comments/commentEditor.js +9 -0
  72. package/plugins/comments/commentEditor.mjs +9 -0
  73. package/plugins/comments/comments.js +8 -0
  74. package/plugins/comments/comments.mjs +8 -0
  75. package/plugins/contextMenu/menu/menu.js +3 -4
  76. package/plugins/contextMenu/menu/menu.mjs +3 -4
  77. package/plugins/manualRowMove/manualRowMove.js +1 -1
  78. package/plugins/manualRowMove/manualRowMove.mjs +1 -1
  79. package/plugins/manualRowResize/manualRowResize.js +1 -2
  80. package/plugins/manualRowResize/manualRowResize.mjs +2 -3
  81. package/plugins/mergeCells/mergeCells.js +1 -1
  82. package/plugins/mergeCells/mergeCells.mjs +1 -1
  83. package/plugins/nestedRows/ui/headers.js +7 -1
  84. package/plugins/nestedRows/ui/headers.mjs +7 -1
  85. package/plugins/stretchColumns/calculator.js +2 -1
  86. package/plugins/stretchColumns/calculator.mjs +3 -2
  87. package/settings.d.ts +1 -0
  88. package/styles/handsontable.css +2053 -0
  89. package/styles/handsontable.min.css +30 -0
  90. package/styles/ht-theme-horizon.css +571 -0
  91. package/styles/ht-theme-horizon.min.css +30 -0
  92. package/styles/ht-theme-main.css +575 -0
  93. package/styles/ht-theme-main.min.css +30 -0
  94. package/tableView.js +46 -0
  95. package/tableView.mjs +47 -1
  96. package/utils/autoResize.js +4 -1
  97. package/utils/autoResize.mjs +4 -1
  98. package/utils/ghostTable.js +5 -3
  99. package/utils/ghostTable.mjs +5 -3
@@ -0,0 +1,271 @@
1
+ "use strict";
2
+
3
+ exports.__esModule = true;
4
+ require("core-js/modules/es.error.cause.js");
5
+ var _element = require("../../../../helpers/dom/element");
6
+ var _console = require("../../../../helpers/console");
7
+ function _classPrivateMethodInitSpec(e, a) { _checkPrivateRedeclaration(e, a), a.add(e); }
8
+ function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
9
+ function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
10
+ function _classPrivateFieldGet(s, a) { return s.get(_assertClassBrand(s, a)); }
11
+ function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
12
+ function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); }
13
+ const CLASSIC_THEME_DEFAULT_HEIGHT = 23;
14
+
15
+ /**
16
+ * Handles the theme-related style operations.
17
+ */
18
+ var _themeName = /*#__PURE__*/new WeakMap();
19
+ var _rootElement = /*#__PURE__*/new WeakMap();
20
+ var _rootComputedStyle = /*#__PURE__*/new WeakMap();
21
+ var _rootDocument = /*#__PURE__*/new WeakMap();
22
+ var _isClassicTheme = /*#__PURE__*/new WeakMap();
23
+ var _cssVars = /*#__PURE__*/new WeakMap();
24
+ var _computedStyles = /*#__PURE__*/new WeakMap();
25
+ var _StylesHandler_brand = /*#__PURE__*/new WeakSet();
26
+ class StylesHandler {
27
+ /**
28
+ * Initializes a new instance of the `StylesHandler` class.
29
+ *
30
+ * @param {object} domBindings - The DOM bindings for the instance.
31
+ */
32
+ constructor(domBindings) {
33
+ /**
34
+ * Applies the necessary class names to the root element.
35
+ */
36
+ _classPrivateMethodInitSpec(this, _StylesHandler_brand);
37
+ /**
38
+ * The name of the theme.
39
+ *
40
+ * @type {string|undefined}
41
+ */
42
+ _classPrivateFieldInitSpec(this, _themeName, void 0);
43
+ /**
44
+ * The instance's root element.
45
+ *
46
+ * @type {HTMLElement}
47
+ */
48
+ _classPrivateFieldInitSpec(this, _rootElement, void 0);
49
+ /**
50
+ * The computed style of the root element.
51
+ *
52
+ * @type {CSSStyleDeclaration}
53
+ * @private
54
+ */
55
+ _classPrivateFieldInitSpec(this, _rootComputedStyle, void 0);
56
+ /**
57
+ * The root document of the instance.
58
+ *
59
+ * @type {Document}
60
+ * @private
61
+ */
62
+ _classPrivateFieldInitSpec(this, _rootDocument, void 0);
63
+ /**
64
+ * `true` if the classic theme is enabled, `false` otherwise.
65
+ *
66
+ * @type {boolean}
67
+ */
68
+ _classPrivateFieldInitSpec(this, _isClassicTheme, true);
69
+ /**
70
+ * An object to store CSS variable values.
71
+ *
72
+ * @type {object}
73
+ * @private
74
+ */
75
+ _classPrivateFieldInitSpec(this, _cssVars, {});
76
+ /**
77
+ * Stores the computed styles for various elements.
78
+ *
79
+ * @type {object} - An object containing the computed styles if a nested structore of `element: { [element type]: {property: value} }`.
80
+ * @private
81
+ */
82
+ _classPrivateFieldInitSpec(this, _computedStyles, {});
83
+ _classPrivateFieldSet(_rootElement, this, domBindings.rootTable.parentElement.parentElement);
84
+ _classPrivateFieldSet(_rootDocument, this, domBindings.rootDocument);
85
+ }
86
+
87
+ /**
88
+ * Gets the value indicating whether the classic theme is enabled.
89
+ *
90
+ * @returns {boolean} `true` if the classic theme is enabled, `false` otherwise.
91
+ */
92
+ isClassicTheme() {
93
+ return _classPrivateFieldGet(_isClassicTheme, this);
94
+ }
95
+
96
+ /**
97
+ * Retrieves the value of a specified CSS variable.
98
+ *
99
+ * @param {string} variableName - The name of the CSS variable to retrieve.
100
+ * @returns {number|null|undefined} The value of the specified CSS variable, or `undefined` if not found.
101
+ */
102
+ getCSSVariableValue(variableName) {
103
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
104
+ return null;
105
+ }
106
+ if (_classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`]) {
107
+ return _classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`];
108
+ }
109
+ const acquiredValue = _assertClassBrand(_StylesHandler_brand, this, _getParsedCSSValue).call(this, `--ht-${variableName}`);
110
+ if (acquiredValue !== null) {
111
+ _classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`] = acquiredValue;
112
+ return acquiredValue;
113
+ }
114
+ }
115
+
116
+ /**
117
+ * Retrieves the computed style value for a specified CSS property of a `td` element.
118
+ *
119
+ * @param {string} cssProperty - The CSS property to retrieve the value for.
120
+ * @returns {number|string|undefined} The value of the specified CSS property, or `undefined` if not found.
121
+ */
122
+ getStyleForTD(cssProperty) {
123
+ var _classPrivateFieldGet2;
124
+ return (_classPrivateFieldGet2 = _classPrivateFieldGet(_computedStyles, this)) === null || _classPrivateFieldGet2 === void 0 ? void 0 : _classPrivateFieldGet2.td[cssProperty];
125
+ }
126
+
127
+ /**
128
+ * Calculates the row height based on the current theme and CSS variables.
129
+ *
130
+ * @returns {number} The calculated row height.
131
+ */
132
+ getDefaultRowHeight() {
133
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
134
+ return CLASSIC_THEME_DEFAULT_HEIGHT;
135
+ }
136
+ const cssVarRowHeightValue = this.getCSSVariableValue('row-height');
137
+ if (!cssVarRowHeightValue) {
138
+ (0, _console.warn)(`The "${_classPrivateFieldGet(_themeName, this)}" theme is enabled, but its stylesheets are missing. \
139
+ Import the correct CSS files in order to use that theme.`);
140
+ _classPrivateFieldSet(_isClassicTheme, this, true);
141
+ this.useTheme();
142
+ return CLASSIC_THEME_DEFAULT_HEIGHT;
143
+ }
144
+ return cssVarRowHeightValue;
145
+ }
146
+
147
+ /**
148
+ * Checks if the cells are using the `border-box` box-sizing model.
149
+ *
150
+ * @returns {boolean}
151
+ */
152
+ areCellsBorderBox() {
153
+ return this.getStyleForTD('box-sizing') === 'border-box';
154
+ }
155
+
156
+ /**
157
+ * Applies the specified theme to the instance.
158
+ *
159
+ * @param {string|undefined|boolean} [themeName] - The name of the theme to apply.
160
+ */
161
+ useTheme(themeName) {
162
+ if (!themeName) {
163
+ _assertClassBrand(_StylesHandler_brand, this, _cacheStylesheetValues).call(this);
164
+ _classPrivateFieldSet(_isClassicTheme, this, true);
165
+ _classPrivateFieldSet(_themeName, this, themeName || undefined);
166
+ return;
167
+ }
168
+ if (themeName && themeName !== _classPrivateFieldGet(_themeName, this)) {
169
+ if (_classPrivateFieldGet(_themeName, this)) {
170
+ _assertClassBrand(_StylesHandler_brand, this, _clearCachedValues).call(this);
171
+ }
172
+ _classPrivateFieldSet(_themeName, this, themeName);
173
+ _classPrivateFieldSet(_isClassicTheme, this, false);
174
+ _assertClassBrand(_StylesHandler_brand, this, _applyClassNames).call(this);
175
+ _assertClassBrand(_StylesHandler_brand, this, _cacheStylesheetValues).call(this);
176
+ }
177
+ }
178
+
179
+ /**
180
+ * Gets the name of the theme.
181
+ *
182
+ * @returns {string|undefined}
183
+ */
184
+ getThemeName() {
185
+ return _classPrivateFieldGet(_themeName, this);
186
+ }
187
+
188
+ /**
189
+ * Removes the theme-related class names from the root element.
190
+ */
191
+ removeClassNames() {
192
+ if ((0, _element.hasClass)(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this))) {
193
+ (0, _element.removeClass)(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this));
194
+ }
195
+ }
196
+ }
197
+ exports.StylesHandler = StylesHandler;
198
+ function _applyClassNames() {
199
+ if (!(0, _element.hasClass)(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this))) {
200
+ (0, _element.addClass)(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this));
201
+ }
202
+ }
203
+ /**
204
+ * Caches the computed style values for the root element and `td` element.
205
+ */
206
+ function _cacheStylesheetValues() {
207
+ if (!this.isClassicTheme()) {
208
+ _classPrivateFieldSet(_rootComputedStyle, this, getComputedStyle(_classPrivateFieldGet(_rootElement, this)));
209
+ }
210
+ const stylesForTD = _assertClassBrand(_StylesHandler_brand, this, _getStylesForTD).call(this, ['box-sizing']);
211
+ _classPrivateFieldGet(_computedStyles, this).td = {
212
+ ..._classPrivateFieldGet(_computedStyles, this).td,
213
+ ...{
214
+ 'box-sizing': stylesForTD['box-sizing']
215
+ }
216
+ };
217
+ }
218
+ /**
219
+ * Retrieves and processes the computed styles for a `td` element.
220
+ *
221
+ * This method creates a temporary table structure, appends it to the root element,
222
+ * retrieves the computed styles for the `td` element, and then removes the table
223
+ * from the DOM. The computed styles are passed to the provided callback function.
224
+ *
225
+ * @param {Array} cssProps - An array of CSS properties to retrieve.
226
+ * @returns {object} An object containing the requested computed styles for the `td` element.
227
+ * @private
228
+ */
229
+ function _getStylesForTD(cssProps) {
230
+ const rootDocument = _classPrivateFieldGet(_rootDocument, this);
231
+ const rootElement = _classPrivateFieldGet(_rootElement, this);
232
+ const table = rootDocument.createElement('table');
233
+ const tbody = rootDocument.createElement('tbody');
234
+ const tr = rootDocument.createElement('tr');
235
+ // This needs not to be the first row in order to get "regular" vaules.
236
+ const tr2 = rootDocument.createElement('tr');
237
+ const td = rootDocument.createElement('td');
238
+ tr2.appendChild(td);
239
+ tbody.appendChild(tr);
240
+ tbody.appendChild(tr2);
241
+ table.appendChild(tbody);
242
+ rootElement.appendChild(table);
243
+ const computedStyle = getComputedStyle(td);
244
+ const returnObject = {};
245
+ cssProps.forEach(prop => {
246
+ returnObject[prop] = computedStyle.getPropertyValue(prop);
247
+ });
248
+ rootElement.removeChild(table);
249
+ return returnObject;
250
+ }
251
+ /**
252
+ * Parses the value of a specified CSS property from the root element's computed style.
253
+ *
254
+ * @param {string} property - The CSS property to retrieve and parse.
255
+ * @returns {number|null} The parsed value of the CSS property.
256
+ */
257
+ function _getParsedCSSValue(property) {
258
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
259
+ return null;
260
+ }
261
+ const parsedValue = parseInt(_classPrivateFieldGet(_rootComputedStyle, this).getPropertyValue(property), 10);
262
+ return Number.isNaN(parsedValue) ? null : parsedValue;
263
+ }
264
+ /**
265
+ * Clears the cached values.
266
+ */
267
+ function _clearCachedValues() {
268
+ _classPrivateFieldSet(_computedStyles, this, {});
269
+ _classPrivateFieldSet(_cssVars, this, {});
270
+ _classPrivateFieldSet(_isClassicTheme, this, true);
271
+ }
@@ -0,0 +1,267 @@
1
+ import "core-js/modules/es.error.cause.js";
2
+ function _classPrivateMethodInitSpec(e, a) { _checkPrivateRedeclaration(e, a), a.add(e); }
3
+ function _classPrivateFieldInitSpec(e, t, a) { _checkPrivateRedeclaration(e, t), t.set(e, a); }
4
+ function _checkPrivateRedeclaration(e, t) { if (t.has(e)) throw new TypeError("Cannot initialize the same private elements twice on an object"); }
5
+ function _classPrivateFieldGet(s, a) { return s.get(_assertClassBrand(s, a)); }
6
+ function _classPrivateFieldSet(s, a, r) { return s.set(_assertClassBrand(s, a), r), r; }
7
+ function _assertClassBrand(e, t, n) { if ("function" == typeof e ? e === t : e.has(t)) return arguments.length < 3 ? t : n; throw new TypeError("Private element is not present on this object"); }
8
+ import { addClass, hasClass, removeClass } from "../../../../helpers/dom/element.mjs";
9
+ import { warn } from "../../../../helpers/console.mjs";
10
+ const CLASSIC_THEME_DEFAULT_HEIGHT = 23;
11
+
12
+ /**
13
+ * Handles the theme-related style operations.
14
+ */
15
+ var _themeName = /*#__PURE__*/new WeakMap();
16
+ var _rootElement = /*#__PURE__*/new WeakMap();
17
+ var _rootComputedStyle = /*#__PURE__*/new WeakMap();
18
+ var _rootDocument = /*#__PURE__*/new WeakMap();
19
+ var _isClassicTheme = /*#__PURE__*/new WeakMap();
20
+ var _cssVars = /*#__PURE__*/new WeakMap();
21
+ var _computedStyles = /*#__PURE__*/new WeakMap();
22
+ var _StylesHandler_brand = /*#__PURE__*/new WeakSet();
23
+ export class StylesHandler {
24
+ /**
25
+ * Initializes a new instance of the `StylesHandler` class.
26
+ *
27
+ * @param {object} domBindings - The DOM bindings for the instance.
28
+ */
29
+ constructor(domBindings) {
30
+ /**
31
+ * Applies the necessary class names to the root element.
32
+ */
33
+ _classPrivateMethodInitSpec(this, _StylesHandler_brand);
34
+ /**
35
+ * The name of the theme.
36
+ *
37
+ * @type {string|undefined}
38
+ */
39
+ _classPrivateFieldInitSpec(this, _themeName, void 0);
40
+ /**
41
+ * The instance's root element.
42
+ *
43
+ * @type {HTMLElement}
44
+ */
45
+ _classPrivateFieldInitSpec(this, _rootElement, void 0);
46
+ /**
47
+ * The computed style of the root element.
48
+ *
49
+ * @type {CSSStyleDeclaration}
50
+ * @private
51
+ */
52
+ _classPrivateFieldInitSpec(this, _rootComputedStyle, void 0);
53
+ /**
54
+ * The root document of the instance.
55
+ *
56
+ * @type {Document}
57
+ * @private
58
+ */
59
+ _classPrivateFieldInitSpec(this, _rootDocument, void 0);
60
+ /**
61
+ * `true` if the classic theme is enabled, `false` otherwise.
62
+ *
63
+ * @type {boolean}
64
+ */
65
+ _classPrivateFieldInitSpec(this, _isClassicTheme, true);
66
+ /**
67
+ * An object to store CSS variable values.
68
+ *
69
+ * @type {object}
70
+ * @private
71
+ */
72
+ _classPrivateFieldInitSpec(this, _cssVars, {});
73
+ /**
74
+ * Stores the computed styles for various elements.
75
+ *
76
+ * @type {object} - An object containing the computed styles if a nested structore of `element: { [element type]: {property: value} }`.
77
+ * @private
78
+ */
79
+ _classPrivateFieldInitSpec(this, _computedStyles, {});
80
+ _classPrivateFieldSet(_rootElement, this, domBindings.rootTable.parentElement.parentElement);
81
+ _classPrivateFieldSet(_rootDocument, this, domBindings.rootDocument);
82
+ }
83
+
84
+ /**
85
+ * Gets the value indicating whether the classic theme is enabled.
86
+ *
87
+ * @returns {boolean} `true` if the classic theme is enabled, `false` otherwise.
88
+ */
89
+ isClassicTheme() {
90
+ return _classPrivateFieldGet(_isClassicTheme, this);
91
+ }
92
+
93
+ /**
94
+ * Retrieves the value of a specified CSS variable.
95
+ *
96
+ * @param {string} variableName - The name of the CSS variable to retrieve.
97
+ * @returns {number|null|undefined} The value of the specified CSS variable, or `undefined` if not found.
98
+ */
99
+ getCSSVariableValue(variableName) {
100
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
101
+ return null;
102
+ }
103
+ if (_classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`]) {
104
+ return _classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`];
105
+ }
106
+ const acquiredValue = _assertClassBrand(_StylesHandler_brand, this, _getParsedCSSValue).call(this, `--ht-${variableName}`);
107
+ if (acquiredValue !== null) {
108
+ _classPrivateFieldGet(_cssVars, this)[`--ht-${variableName}`] = acquiredValue;
109
+ return acquiredValue;
110
+ }
111
+ }
112
+
113
+ /**
114
+ * Retrieves the computed style value for a specified CSS property of a `td` element.
115
+ *
116
+ * @param {string} cssProperty - The CSS property to retrieve the value for.
117
+ * @returns {number|string|undefined} The value of the specified CSS property, or `undefined` if not found.
118
+ */
119
+ getStyleForTD(cssProperty) {
120
+ var _classPrivateFieldGet2;
121
+ return (_classPrivateFieldGet2 = _classPrivateFieldGet(_computedStyles, this)) === null || _classPrivateFieldGet2 === void 0 ? void 0 : _classPrivateFieldGet2.td[cssProperty];
122
+ }
123
+
124
+ /**
125
+ * Calculates the row height based on the current theme and CSS variables.
126
+ *
127
+ * @returns {number} The calculated row height.
128
+ */
129
+ getDefaultRowHeight() {
130
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
131
+ return CLASSIC_THEME_DEFAULT_HEIGHT;
132
+ }
133
+ const cssVarRowHeightValue = this.getCSSVariableValue('row-height');
134
+ if (!cssVarRowHeightValue) {
135
+ warn(`The "${_classPrivateFieldGet(_themeName, this)}" theme is enabled, but its stylesheets are missing. \
136
+ Import the correct CSS files in order to use that theme.`);
137
+ _classPrivateFieldSet(_isClassicTheme, this, true);
138
+ this.useTheme();
139
+ return CLASSIC_THEME_DEFAULT_HEIGHT;
140
+ }
141
+ return cssVarRowHeightValue;
142
+ }
143
+
144
+ /**
145
+ * Checks if the cells are using the `border-box` box-sizing model.
146
+ *
147
+ * @returns {boolean}
148
+ */
149
+ areCellsBorderBox() {
150
+ return this.getStyleForTD('box-sizing') === 'border-box';
151
+ }
152
+
153
+ /**
154
+ * Applies the specified theme to the instance.
155
+ *
156
+ * @param {string|undefined|boolean} [themeName] - The name of the theme to apply.
157
+ */
158
+ useTheme(themeName) {
159
+ if (!themeName) {
160
+ _assertClassBrand(_StylesHandler_brand, this, _cacheStylesheetValues).call(this);
161
+ _classPrivateFieldSet(_isClassicTheme, this, true);
162
+ _classPrivateFieldSet(_themeName, this, themeName || undefined);
163
+ return;
164
+ }
165
+ if (themeName && themeName !== _classPrivateFieldGet(_themeName, this)) {
166
+ if (_classPrivateFieldGet(_themeName, this)) {
167
+ _assertClassBrand(_StylesHandler_brand, this, _clearCachedValues).call(this);
168
+ }
169
+ _classPrivateFieldSet(_themeName, this, themeName);
170
+ _classPrivateFieldSet(_isClassicTheme, this, false);
171
+ _assertClassBrand(_StylesHandler_brand, this, _applyClassNames).call(this);
172
+ _assertClassBrand(_StylesHandler_brand, this, _cacheStylesheetValues).call(this);
173
+ }
174
+ }
175
+
176
+ /**
177
+ * Gets the name of the theme.
178
+ *
179
+ * @returns {string|undefined}
180
+ */
181
+ getThemeName() {
182
+ return _classPrivateFieldGet(_themeName, this);
183
+ }
184
+
185
+ /**
186
+ * Removes the theme-related class names from the root element.
187
+ */
188
+ removeClassNames() {
189
+ if (hasClass(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this))) {
190
+ removeClass(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this));
191
+ }
192
+ }
193
+ }
194
+ function _applyClassNames() {
195
+ if (!hasClass(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this))) {
196
+ addClass(_classPrivateFieldGet(_rootElement, this), _classPrivateFieldGet(_themeName, this));
197
+ }
198
+ }
199
+ /**
200
+ * Caches the computed style values for the root element and `td` element.
201
+ */
202
+ function _cacheStylesheetValues() {
203
+ if (!this.isClassicTheme()) {
204
+ _classPrivateFieldSet(_rootComputedStyle, this, getComputedStyle(_classPrivateFieldGet(_rootElement, this)));
205
+ }
206
+ const stylesForTD = _assertClassBrand(_StylesHandler_brand, this, _getStylesForTD).call(this, ['box-sizing']);
207
+ _classPrivateFieldGet(_computedStyles, this).td = {
208
+ ..._classPrivateFieldGet(_computedStyles, this).td,
209
+ ...{
210
+ 'box-sizing': stylesForTD['box-sizing']
211
+ }
212
+ };
213
+ }
214
+ /**
215
+ * Retrieves and processes the computed styles for a `td` element.
216
+ *
217
+ * This method creates a temporary table structure, appends it to the root element,
218
+ * retrieves the computed styles for the `td` element, and then removes the table
219
+ * from the DOM. The computed styles are passed to the provided callback function.
220
+ *
221
+ * @param {Array} cssProps - An array of CSS properties to retrieve.
222
+ * @returns {object} An object containing the requested computed styles for the `td` element.
223
+ * @private
224
+ */
225
+ function _getStylesForTD(cssProps) {
226
+ const rootDocument = _classPrivateFieldGet(_rootDocument, this);
227
+ const rootElement = _classPrivateFieldGet(_rootElement, this);
228
+ const table = rootDocument.createElement('table');
229
+ const tbody = rootDocument.createElement('tbody');
230
+ const tr = rootDocument.createElement('tr');
231
+ // This needs not to be the first row in order to get "regular" vaules.
232
+ const tr2 = rootDocument.createElement('tr');
233
+ const td = rootDocument.createElement('td');
234
+ tr2.appendChild(td);
235
+ tbody.appendChild(tr);
236
+ tbody.appendChild(tr2);
237
+ table.appendChild(tbody);
238
+ rootElement.appendChild(table);
239
+ const computedStyle = getComputedStyle(td);
240
+ const returnObject = {};
241
+ cssProps.forEach(prop => {
242
+ returnObject[prop] = computedStyle.getPropertyValue(prop);
243
+ });
244
+ rootElement.removeChild(table);
245
+ return returnObject;
246
+ }
247
+ /**
248
+ * Parses the value of a specified CSS property from the root element's computed style.
249
+ *
250
+ * @param {string} property - The CSS property to retrieve and parse.
251
+ * @returns {number|null} The parsed value of the CSS property.
252
+ */
253
+ function _getParsedCSSValue(property) {
254
+ if (_classPrivateFieldGet(_isClassicTheme, this)) {
255
+ return null;
256
+ }
257
+ const parsedValue = parseInt(_classPrivateFieldGet(_rootComputedStyle, this).getPropertyValue(property), 10);
258
+ return Number.isNaN(parsedValue) ? null : parsedValue;
259
+ }
260
+ /**
261
+ * Clears the cached values.
262
+ */
263
+ function _clearCachedValues() {
264
+ _classPrivateFieldSet(_computedStyles, this, {});
265
+ _classPrivateFieldSet(_cssVars, this, {});
266
+ _classPrivateFieldSet(_isClassicTheme, this, true);
267
+ }
@@ -263,6 +263,7 @@ class Viewport {
263
263
  viewportHeight: height,
264
264
  scrollOffset: pos,
265
265
  totalRows: wtSettings.getSetting('totalRows'),
266
+ defaultRowHeight: this.instance.stylesHandler.getDefaultRowHeight(),
266
267
  rowHeightFn: sourceRow => wtTable.getRowHeight(sourceRow),
267
268
  overrideFn: wtSettings.getSettingPure('viewportRowCalculatorOverride'),
268
269
  horizontalScrollbarHeight: scrollbarHeight
@@ -260,6 +260,7 @@ class Viewport {
260
260
  viewportHeight: height,
261
261
  scrollOffset: pos,
262
262
  totalRows: wtSettings.getSetting('totalRows'),
263
+ defaultRowHeight: this.instance.stylesHandler.getDefaultRowHeight(),
263
264
  rowHeightFn: sourceRow => wtTable.getRowHeight(sourceRow),
264
265
  overrideFn: wtSettings.getSettingPure('viewportRowCalculatorOverride'),
265
266
  horizontalScrollbarHeight: scrollbarHeight
package/base.js CHANGED
@@ -45,8 +45,8 @@ Handsontable.hooks = _hooks.Hooks.getSingleton();
45
45
  Handsontable.CellCoords = _src.CellCoords;
46
46
  Handsontable.CellRange = _src.CellRange;
47
47
  Handsontable.packageName = 'handsontable';
48
- Handsontable.buildDate = "07/11/2024 15:22:44";
49
- Handsontable.version = "0.0.0-next-5b14d3c-20241107";
48
+ Handsontable.buildDate = "08/11/2024 09:48:18";
49
+ Handsontable.version = "0.0.0-next-6129043-20241108";
50
50
  Handsontable.languages = {
51
51
  dictionaryKeys: _registry.dictionaryKeys,
52
52
  getLanguageDictionary: _registry.getLanguageDictionary,
package/base.mjs CHANGED
@@ -35,8 +35,8 @@ Handsontable.hooks = Hooks.getSingleton();
35
35
  Handsontable.CellCoords = CellCoords;
36
36
  Handsontable.CellRange = CellRange;
37
37
  Handsontable.packageName = 'handsontable';
38
- Handsontable.buildDate = "07/11/2024 15:22:50";
39
- Handsontable.version = "0.0.0-next-5b14d3c-20241107";
38
+ Handsontable.buildDate = "08/11/2024 09:48:23";
39
+ Handsontable.version = "0.0.0-next-6129043-20241108";
40
40
  Handsontable.languages = {
41
41
  dictionaryKeys,
42
42
  getLanguageDictionary,
package/core.d.ts CHANGED
@@ -73,6 +73,7 @@ export default class Core {
73
73
  getCoords(element: Element | null): CellCoords;
74
74
  getCopyableData(row: number, column: number): string;
75
75
  getCopyableText(startRow: number, startColumn: number, endRow: number, endColumn: number): string;
76
+ getCurrentThemeName(): string | undefined;
76
77
  getData(row?: number, column?: number, row2?: number, column2?: number): CellValue[];
77
78
  getDataAtCell(row: number, column: number): CellValue;
78
79
  getDataAtCol(column: number): CellValue[];
@@ -179,6 +180,7 @@ export default class Core {
179
180
  unlisten(): void;
180
181
  updateData(data: CellValue[][] | RowObject[], source?: string): void;
181
182
  updateSettings(settings: GridSettings, init?: boolean): void;
183
+ useTheme(themeName: string|undefined): void;
182
184
  validateCell(value: any, cellProperties: CellProperties, callback: (valid: boolean) => void, source: string): void;
183
185
  validateCells(callback?: (valid: boolean) => void): void;
184
186
  validateColumns(columns: number[], callback?: (valid: boolean) => void): void;
package/core.js CHANGED
@@ -43,6 +43,7 @@ var _index3 = require("./core/index");
43
43
  var _uniqueMap = require("./utils/dataStructures/uniqueMap");
44
44
  var _shortcuts = require("./shortcuts");
45
45
  var _shortcutContexts = require("./shortcutContexts");
46
+ var _themes = require("./helpers/themes");
46
47
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
47
48
  let activeGuid = null;
48
49
 
@@ -230,6 +231,7 @@ function Core(rootElement, userSettings) {
230
231
  rootElement.insertBefore(this.container, rootElement.firstChild);
231
232
  if ((0, _rootInstance.isRootInstance)(this)) {
232
233
  (0, _mixed._injectProductInfo)(userSettings.licenseKey, rootElement);
234
+ (0, _element.addClass)(rootElement, 'ht-wrapper');
233
235
  }
234
236
  this.guid = `ht_${(0, _string.randomString)()}`; // this is the namespace for global events
235
237
 
@@ -1030,6 +1032,13 @@ function Core(rootElement, userSettings) {
1030
1032
  }
1031
1033
  this.updateSettings(tableMeta, true);
1032
1034
  this.view = new _tableView.default(this);
1035
+ const themeName = tableMeta.themeName || (0, _themes.getThemeClassName)(instance.rootElement);
1036
+
1037
+ // Use the theme defined as a root element class or in the settings (in that order).
1038
+ instance.useTheme(themeName);
1039
+
1040
+ // Add the theme class name to the license info element.
1041
+ instance.view.addClassNameToLicenseElement(instance.getCurrentThemeName());
1033
1042
  editorManager = _editorManager.default.getInstance(instance, tableMeta, selection);
1034
1043
  viewportScroller = (0, _index3.createViewportScroller)(instance);
1035
1044
  focusManager = new _focusManager.FocusManager(instance);
@@ -2383,6 +2392,19 @@ function Core(rootElement, userSettings) {
2383
2392
  if (instance.view) {
2384
2393
  instance.view._wt.wtViewport.resetHasOversizedColumnHeadersMarked();
2385
2394
  instance.view._wt.exportSettingsAsClassNames();
2395
+ const currentThemeName = instance.getCurrentThemeName();
2396
+ const themeNameOptionExists = (0, _object.hasOwnProperty)(settings, 'themeName');
2397
+ if (currentThemeName && themeNameOptionExists) {
2398
+ instance.view.getStylesHandler().removeClassNames();
2399
+ instance.view.removeClassNameFromLicenseElement(currentThemeName);
2400
+ }
2401
+ const themeName = themeNameOptionExists && settings.themeName || (0, _themes.getThemeClassName)(instance.rootElement);
2402
+
2403
+ // Use the theme defined as a root element class or in the settings (in that order).
2404
+ instance.useTheme(themeName);
2405
+
2406
+ // Add the theme class name to the license info element.
2407
+ instance.view.addClassNameToLicenseElement(instance.getCurrentThemeName());
2386
2408
  }
2387
2409
  instance.runHooks('afterUpdateSettings', settings);
2388
2410
  }
@@ -4586,6 +4608,30 @@ function Core(rootElement, userSettings) {
4586
4608
  };
4587
4609
  this.timeouts = [];
4588
4610
 
4611
+ /**
4612
+ * Use the theme specified by the provided name.
4613
+ *
4614
+ * @memberof Core#
4615
+ * @function useTheme
4616
+ * @since 15.0.0
4617
+ * @param {string|boolean|undefined} themeName The name of the theme to use.
4618
+ */
4619
+ this.useTheme = themeName => {
4620
+ this.view.getStylesHandler().useTheme(themeName);
4621
+ };
4622
+
4623
+ /**
4624
+ * Gets the name of the currently used theme.
4625
+ *
4626
+ * @memberof Core#
4627
+ * @function getCurrentThemeName
4628
+ * @since 15.0.0
4629
+ * @returns {string|undefined} The name of the currently used theme.
4630
+ */
4631
+ this.getCurrentThemeName = () => {
4632
+ return this.view.getStylesHandler().getThemeName();
4633
+ };
4634
+
4589
4635
  /**
4590
4636
  * Sets timeout. Purpose of this method is to clear all known timeouts when `destroy` method is called.
4591
4637
  *