@design.estate/dees-catalog 3.65.0 → 3.67.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist_bundle/bundle.js +495 -153
- package/dist_ts_web/00_commitinfo_data.js +1 -1
- package/dist_ts_web/elements/00group-dataview/dees-table/dees-table.d.ts +71 -2
- package/dist_ts_web/elements/00group-dataview/dees-table/dees-table.demo.js +3 -2
- package/dist_ts_web/elements/00group-dataview/dees-table/dees-table.js +528 -155
- package/dist_ts_web/elements/00group-dataview/dees-table/styles.js +3 -1
- package/dist_ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.d.ts +1 -0
- package/dist_ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.js +43 -2
- package/dist_ts_web/elements/00group-input/dees-input-text/dees-input-text.d.ts +1 -0
- package/dist_ts_web/elements/00group-input/dees-input-text/dees-input-text.js +43 -2
- package/dist_watch/bundle.js +493 -151
- package/dist_watch/bundle.js.map +3 -3
- package/package.json +1 -1
- package/ts_web/00_commitinfo_data.ts +1 -1
- package/ts_web/elements/00group-dataview/dees-table/dees-table.demo.ts +2 -1
- package/ts_web/elements/00group-dataview/dees-table/dees-table.ts +530 -160
- package/ts_web/elements/00group-dataview/dees-table/styles.ts +5 -0
- package/ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.ts +36 -0
- package/ts_web/elements/00group-input/dees-input-text/dees-input-text.ts +36 -0
package/dist_bundle/bundle.js
CHANGED
|
@@ -143197,7 +143197,7 @@ var demoFunc13 = /* @__PURE__ */ __name(() => b2`
|
|
|
143197
143197
|
// ts_web/elements/00group-input/dees-input-text/dees-input-text.ts
|
|
143198
143198
|
init_dist_ts30();
|
|
143199
143199
|
init_theme();
|
|
143200
|
-
var _validationFunction_dec, _validationText_dec, _validationState_dec, _showPasswordBool_dec, _isPasswordBool_dec, _value_dec4, _a21, _DeesInputText_decorators, _init19, _value4, _isPasswordBool, _showPasswordBool, _validationState, _validationText, _validationFunction;
|
|
143200
|
+
var _vintegrated_dec, _validationFunction_dec, _validationText_dec, _validationState_dec, _showPasswordBool_dec, _isPasswordBool_dec, _value_dec4, _a21, _DeesInputText_decorators, _init19, _value4, _isPasswordBool, _showPasswordBool, _validationState, _validationText, _validationFunction, _vintegrated;
|
|
143201
143201
|
_DeesInputText_decorators = [customElement("dees-input-text")];
|
|
143202
143202
|
var _DeesInputText = class _DeesInputText extends (_a21 = DeesInputBase, _value_dec4 = [n5({
|
|
143203
143203
|
type: String,
|
|
@@ -143213,7 +143213,10 @@ var _DeesInputText = class _DeesInputText extends (_a21 = DeesInputBase, _value_
|
|
|
143213
143213
|
reflect: true
|
|
143214
143214
|
})], _validationText_dec = [n5({
|
|
143215
143215
|
reflect: true
|
|
143216
|
-
})], _validationFunction_dec = [n5({})],
|
|
143216
|
+
})], _validationFunction_dec = [n5({})], _vintegrated_dec = [n5({
|
|
143217
|
+
type: Boolean,
|
|
143218
|
+
reflect: true
|
|
143219
|
+
})], _a21) {
|
|
143217
143220
|
constructor() {
|
|
143218
143221
|
super(...arguments);
|
|
143219
143222
|
__privateAdd(this, _value4, __runInitializers(_init19, 8, this, "")), __runInitializers(_init19, 11, this);
|
|
@@ -143222,6 +143225,7 @@ var _DeesInputText = class _DeesInputText extends (_a21 = DeesInputBase, _value_
|
|
|
143222
143225
|
__privateAdd(this, _validationState, __runInitializers(_init19, 20, this)), __runInitializers(_init19, 23, this);
|
|
143223
143226
|
__privateAdd(this, _validationText, __runInitializers(_init19, 24, this, "")), __runInitializers(_init19, 27, this);
|
|
143224
143227
|
__privateAdd(this, _validationFunction, __runInitializers(_init19, 28, this)), __runInitializers(_init19, 31, this);
|
|
143228
|
+
__privateAdd(this, _vintegrated, __runInitializers(_init19, 32, this, false)), __runInitializers(_init19, 35, this);
|
|
143225
143229
|
}
|
|
143226
143230
|
render() {
|
|
143227
143231
|
return b2`
|
|
@@ -143302,12 +143306,14 @@ _showPasswordBool = new WeakMap();
|
|
|
143302
143306
|
_validationState = new WeakMap();
|
|
143303
143307
|
_validationText = new WeakMap();
|
|
143304
143308
|
_validationFunction = new WeakMap();
|
|
143309
|
+
_vintegrated = new WeakMap();
|
|
143305
143310
|
__decorateElement(_init19, 4, "value", _value_dec4, _DeesInputText, _value4);
|
|
143306
143311
|
__decorateElement(_init19, 4, "isPasswordBool", _isPasswordBool_dec, _DeesInputText, _isPasswordBool);
|
|
143307
143312
|
__decorateElement(_init19, 4, "showPasswordBool", _showPasswordBool_dec, _DeesInputText, _showPasswordBool);
|
|
143308
143313
|
__decorateElement(_init19, 4, "validationState", _validationState_dec, _DeesInputText, _validationState);
|
|
143309
143314
|
__decorateElement(_init19, 4, "validationText", _validationText_dec, _DeesInputText, _validationText);
|
|
143310
143315
|
__decorateElement(_init19, 4, "validationFunction", _validationFunction_dec, _DeesInputText, _validationFunction);
|
|
143316
|
+
__decorateElement(_init19, 4, "vintegrated", _vintegrated_dec, _DeesInputText, _vintegrated);
|
|
143311
143317
|
_DeesInputText = __decorateElement(_init19, 0, "DeesInputText", _DeesInputText_decorators, _DeesInputText);
|
|
143312
143318
|
__name(_DeesInputText, "DeesInputText");
|
|
143313
143319
|
__publicField(_DeesInputText, "demo", demoFunc13);
|
|
@@ -143449,6 +143455,36 @@ __publicField(_DeesInputText, "styles", [
|
|
|
143449
143455
|
border-color: ${cssManager.bdTheme("hsl(142.1 76.2% 36.3%)", "hsl(142.1 70.6% 45.3%)")};
|
|
143450
143456
|
box-shadow: 0 0 0 2px ${cssManager.bdTheme("hsl(142.1 76.2% 36.3% / 0.05)", "hsl(142.1 70.6% 45.3% / 0.05)")};
|
|
143451
143457
|
}
|
|
143458
|
+
|
|
143459
|
+
/* Visually integrated mode: shed chrome to blend into a host component
|
|
143460
|
+
(e.g. a dees-table cell in edit mode). */
|
|
143461
|
+
:host([vintegrated]) dees-label,
|
|
143462
|
+
:host([vintegrated]) .validationContainer {
|
|
143463
|
+
display: none;
|
|
143464
|
+
}
|
|
143465
|
+
:host([vintegrated]) .maincontainer {
|
|
143466
|
+
height: 40px;
|
|
143467
|
+
}
|
|
143468
|
+
:host([vintegrated]) input {
|
|
143469
|
+
height: 40px;
|
|
143470
|
+
line-height: 24px;
|
|
143471
|
+
padding: 0 16px;
|
|
143472
|
+
font-size: 13px;
|
|
143473
|
+
border: none;
|
|
143474
|
+
border-radius: 0;
|
|
143475
|
+
background: transparent;
|
|
143476
|
+
box-shadow: none;
|
|
143477
|
+
transition: none;
|
|
143478
|
+
}
|
|
143479
|
+
:host([vintegrated]) input:hover:not(:disabled):not(:focus),
|
|
143480
|
+
:host([vintegrated]) input:focus {
|
|
143481
|
+
border: none;
|
|
143482
|
+
box-shadow: none;
|
|
143483
|
+
background: transparent;
|
|
143484
|
+
}
|
|
143485
|
+
:host([vintegrated]) .showPassword {
|
|
143486
|
+
display: none;
|
|
143487
|
+
}
|
|
143452
143488
|
`
|
|
143453
143489
|
]);
|
|
143454
143490
|
__runInitializers(_init19, 1, _DeesInputText);
|
|
@@ -145824,17 +145860,21 @@ var DeesInputDropdownPopup = _DeesInputDropdownPopup;
|
|
|
145824
145860
|
// ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.ts
|
|
145825
145861
|
init_dist_ts30();
|
|
145826
145862
|
init_theme();
|
|
145827
|
-
var _isOpened_dec2, _enableSearch_dec2, _selectedOption_dec2, _options_dec4, _a27, _DeesInputDropdown_decorators, _init25, _options4, _selectedOption2, _enableSearch2, _isOpened2;
|
|
145863
|
+
var _isOpened_dec2, _vintegrated_dec2, _enableSearch_dec2, _selectedOption_dec2, _options_dec4, _a27, _DeesInputDropdown_decorators, _init25, _options4, _selectedOption2, _enableSearch2, _vintegrated2, _isOpened2;
|
|
145828
145864
|
_DeesInputDropdown_decorators = [customElement("dees-input-dropdown")];
|
|
145829
145865
|
var _DeesInputDropdown = class _DeesInputDropdown extends (_a27 = DeesInputBase, _options_dec4 = [n5()], _selectedOption_dec2 = [n5()], _enableSearch_dec2 = [n5({
|
|
145830
145866
|
type: Boolean
|
|
145867
|
+
})], _vintegrated_dec2 = [n5({
|
|
145868
|
+
type: Boolean,
|
|
145869
|
+
reflect: true
|
|
145831
145870
|
})], _isOpened_dec2 = [r5()], _a27) {
|
|
145832
145871
|
constructor() {
|
|
145833
145872
|
super(...arguments);
|
|
145834
145873
|
__privateAdd(this, _options4, __runInitializers(_init25, 8, this, [])), __runInitializers(_init25, 11, this);
|
|
145835
145874
|
__privateAdd(this, _selectedOption2, __runInitializers(_init25, 12, this, null)), __runInitializers(_init25, 15, this);
|
|
145836
145875
|
__privateAdd(this, _enableSearch2, __runInitializers(_init25, 16, this, true)), __runInitializers(_init25, 19, this);
|
|
145837
|
-
__privateAdd(this,
|
|
145876
|
+
__privateAdd(this, _vintegrated2, __runInitializers(_init25, 20, this, false)), __runInitializers(_init25, 23, this);
|
|
145877
|
+
__privateAdd(this, _isOpened2, __runInitializers(_init25, 24, this, false)), __runInitializers(_init25, 27, this);
|
|
145838
145878
|
__publicField(this, "popupInstance", null);
|
|
145839
145879
|
__publicField(this, "handleOptionSelected", /* @__PURE__ */ __name((event) => {
|
|
145840
145880
|
const detail = event.detail;
|
|
@@ -145976,10 +146016,12 @@ _init25 = __decoratorStart(_a27);
|
|
|
145976
146016
|
_options4 = new WeakMap();
|
|
145977
146017
|
_selectedOption2 = new WeakMap();
|
|
145978
146018
|
_enableSearch2 = new WeakMap();
|
|
146019
|
+
_vintegrated2 = new WeakMap();
|
|
145979
146020
|
_isOpened2 = new WeakMap();
|
|
145980
146021
|
__decorateElement(_init25, 4, "options", _options_dec4, _DeesInputDropdown, _options4);
|
|
145981
146022
|
__decorateElement(_init25, 4, "selectedOption", _selectedOption_dec2, _DeesInputDropdown, _selectedOption2);
|
|
145982
146023
|
__decorateElement(_init25, 4, "enableSearch", _enableSearch_dec2, _DeesInputDropdown, _enableSearch2);
|
|
146024
|
+
__decorateElement(_init25, 4, "vintegrated", _vintegrated_dec2, _DeesInputDropdown, _vintegrated2);
|
|
145983
146025
|
__decorateElement(_init25, 4, "isOpened", _isOpened_dec2, _DeesInputDropdown, _isOpened2);
|
|
145984
146026
|
_DeesInputDropdown = __decorateElement(_init25, 0, "DeesInputDropdown", _DeesInputDropdown_decorators, _DeesInputDropdown);
|
|
145985
146027
|
__name(_DeesInputDropdown, "DeesInputDropdown");
|
|
@@ -146060,6 +146102,36 @@ __publicField(_DeesInputDropdown, "styles", [
|
|
|
146060
146102
|
.selectedBox.open::after {
|
|
146061
146103
|
transform: translateY(-50%) rotate(180deg);
|
|
146062
146104
|
}
|
|
146105
|
+
|
|
146106
|
+
/* Visually integrated mode: shed chrome to blend into a host component
|
|
146107
|
+
(e.g. a dees-table cell in edit mode). */
|
|
146108
|
+
:host([vintegrated]) dees-label {
|
|
146109
|
+
display: none;
|
|
146110
|
+
}
|
|
146111
|
+
:host([vintegrated]) .maincontainer {
|
|
146112
|
+
height: 40px;
|
|
146113
|
+
}
|
|
146114
|
+
:host([vintegrated]) .selectedBox {
|
|
146115
|
+
height: 40px;
|
|
146116
|
+
line-height: 40px;
|
|
146117
|
+
padding: 0 32px 0 16px;
|
|
146118
|
+
font-size: 13px;
|
|
146119
|
+
border: none;
|
|
146120
|
+
border-radius: 0;
|
|
146121
|
+
background: transparent;
|
|
146122
|
+
box-shadow: none;
|
|
146123
|
+
transition: none;
|
|
146124
|
+
}
|
|
146125
|
+
:host([vintegrated]) .selectedBox:hover:not(.disabled),
|
|
146126
|
+
:host([vintegrated]) .selectedBox:focus-visible {
|
|
146127
|
+
border: none;
|
|
146128
|
+
box-shadow: none;
|
|
146129
|
+
background: transparent;
|
|
146130
|
+
}
|
|
146131
|
+
:host([vintegrated]) .selectedBox::after {
|
|
146132
|
+
right: 12px;
|
|
146133
|
+
opacity: 0.6;
|
|
146134
|
+
}
|
|
146063
146135
|
`
|
|
146064
146136
|
]);
|
|
146065
146137
|
__runInitializers(_init25, 1, _DeesInputDropdown);
|
|
@@ -163781,7 +163853,8 @@ var demoFunc29 = /* @__PURE__ */ __name(() => b2`
|
|
|
163781
163853
|
<dees-table
|
|
163782
163854
|
id="scrollSmallHeight"
|
|
163783
163855
|
.fixedHeight=${true}
|
|
163784
|
-
|
|
163856
|
+
.virtualized=${true}
|
|
163857
|
+
heading1="People Directory (Scrollable, Virtualized)"
|
|
163785
163858
|
heading2="Forced scrolling with many items"
|
|
163786
163859
|
.columns=${[
|
|
163787
163860
|
{ key: "id", header: "ID", sortable: true },
|
|
@@ -164216,6 +164289,11 @@ var tableStyles = [
|
|
|
164216
164289
|
}
|
|
164217
164290
|
td.editingCell {
|
|
164218
164291
|
padding: 0;
|
|
164292
|
+
outline: 2px solid ${cssManager.bdTheme(
|
|
164293
|
+
"hsl(222.2 47.4% 51.2% / 0.6)",
|
|
164294
|
+
"hsl(217.2 91.2% 59.8% / 0.6)"
|
|
164295
|
+
)};
|
|
164296
|
+
outline-offset: -2px;
|
|
164219
164297
|
}
|
|
164220
164298
|
td.editingCell .innerCellContainer {
|
|
164221
164299
|
padding: 0;
|
|
@@ -164580,7 +164658,7 @@ __name(compileLucenePredicate, "compileLucenePredicate");
|
|
|
164580
164658
|
init_dist_ts30();
|
|
164581
164659
|
init_dist_ts29();
|
|
164582
164660
|
init_theme();
|
|
164583
|
-
var ___editingCell_dec, ___focusedCell_dec, _selectedIds_dec, _selectionMode_dec, _searchMode_dec, _fixedHeight_dec, _showSelectionCheckbox_dec, _showColumnFilters_dec, _columnFilters_dec, _filterText_dec, _sortBy_dec, _showGrid_dec, _showHorizontalLines_dec, _showVerticalLines_dec, _selectedDataRow_dec, _reverseDisplayFunction_dec, _displayFunction_dec, _augmentFromDisplayFunction_dec, _rowKey_dec, _columns_dec, _dataActions_dec, _searchable_dec, _dataName_dec, _required_dec3, _disabled_dec3, _label_dec3, _key_dec2, _data_dec, _heading2_dec, _heading1_dec, _a42, _DeesTable_decorators, _init39, _heading1, _heading22, _data, _key2, _label3, _disabled3, _required3, _dataName, _searchable, _dataActions, _columns, _rowKey, _augmentFromDisplayFunction, _displayFunction, _reverseDisplayFunction, _selectedDataRow, _showVerticalLines, _showHorizontalLines, _showGrid, _sortBy, _filterText, _columnFilters, _showColumnFilters, _showSelectionCheckbox, _fixedHeight, _searchMode, _selectionMode, _selectedIds, ___focusedCell, ___editingCell;
|
|
164661
|
+
var ___virtualRange_dec, ___floatingActive_dec, ___editingCell_dec, ___focusedCell_dec, _selectedIds_dec, _selectionMode_dec, _searchMode_dec, _fixedHeight_dec, _virtualOverscan_dec, _virtualized_dec, _showSelectionCheckbox_dec, _showColumnFilters_dec, _columnFilters_dec, _filterText_dec, _sortBy_dec, _showGrid_dec, _showHorizontalLines_dec, _showVerticalLines_dec, _selectedDataRow_dec, _reverseDisplayFunction_dec, _displayFunction_dec, _augmentFromDisplayFunction_dec, _rowKey_dec, _columns_dec, _dataActions_dec, _searchable_dec, _dataName_dec, _required_dec3, _disabled_dec3, _label_dec3, _key_dec2, _data_dec, _heading2_dec, _heading1_dec, _a42, _DeesTable_decorators, _init39, _heading1, _heading22, _data, _key2, _label3, _disabled3, _required3, _dataName, _searchable, _dataActions, _columns, _rowKey, _augmentFromDisplayFunction, _displayFunction, _reverseDisplayFunction, _selectedDataRow, _showVerticalLines, _showHorizontalLines, _showGrid, _sortBy, _filterText, _columnFilters, _showColumnFilters, _showSelectionCheckbox, _virtualized, _virtualOverscan, _fixedHeight, _searchMode, _selectionMode, _selectedIds, ___focusedCell, ___editingCell, ___floatingActive, ___virtualRange;
|
|
164584
164662
|
function ordinalLabel(n12) {
|
|
164585
164663
|
const s10 = ["th", "st", "nd", "rd"];
|
|
164586
164664
|
const v5 = n12 % 100;
|
|
@@ -164627,7 +164705,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164627
164705
|
type: Boolean,
|
|
164628
164706
|
reflect: true,
|
|
164629
164707
|
attribute: "show-grid"
|
|
164630
|
-
})], _sortBy_dec = [n5({ attribute: false })], _filterText_dec = [n5({ type: String })], _columnFilters_dec = [n5({ attribute: false })], _showColumnFilters_dec = [n5({ type: Boolean, attribute: "show-column-filters" })], _showSelectionCheckbox_dec = [n5({ type: Boolean, reflect: true, attribute: "show-selection-checkbox" })], _fixedHeight_dec = [n5({ type: Boolean, reflect: true, attribute: "fixed-height" })], _searchMode_dec = [n5({ type: String })], _selectionMode_dec = [n5({ type: String })], _selectedIds_dec = [n5({ attribute: false })], ___focusedCell_dec = [r5()], ___editingCell_dec = [r5()], _a42) {
|
|
164708
|
+
})], _sortBy_dec = [n5({ attribute: false })], _filterText_dec = [n5({ type: String })], _columnFilters_dec = [n5({ attribute: false })], _showColumnFilters_dec = [n5({ type: Boolean, attribute: "show-column-filters" })], _showSelectionCheckbox_dec = [n5({ type: Boolean, reflect: true, attribute: "show-selection-checkbox" })], _virtualized_dec = [n5({ type: Boolean, reflect: true, attribute: "virtualized" })], _virtualOverscan_dec = [n5({ type: Number, attribute: "virtual-overscan" })], _fixedHeight_dec = [n5({ type: Boolean, reflect: true, attribute: "fixed-height" })], _searchMode_dec = [n5({ type: String })], _selectionMode_dec = [n5({ type: String })], _selectedIds_dec = [n5({ attribute: false })], ___focusedCell_dec = [r5()], ___editingCell_dec = [r5()], ___floatingActive_dec = [r5()], ___virtualRange_dec = [r5()], _a42) {
|
|
164631
164709
|
constructor() {
|
|
164632
164710
|
super();
|
|
164633
164711
|
__privateAdd(this, _heading1, __runInitializers(_init39, 8, this, "heading 1")), __runInitializers(_init39, 11, this);
|
|
@@ -164658,12 +164736,14 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164658
164736
|
__privateAdd(this, _columnFilters, __runInitializers(_init39, 92, this, {})), __runInitializers(_init39, 95, this);
|
|
164659
164737
|
__privateAdd(this, _showColumnFilters, __runInitializers(_init39, 96, this, false)), __runInitializers(_init39, 99, this);
|
|
164660
164738
|
__privateAdd(this, _showSelectionCheckbox, __runInitializers(_init39, 100, this, false)), __runInitializers(_init39, 103, this);
|
|
164661
|
-
__privateAdd(this,
|
|
164662
|
-
__privateAdd(this,
|
|
164739
|
+
__privateAdd(this, _virtualized, __runInitializers(_init39, 104, this, false)), __runInitializers(_init39, 107, this);
|
|
164740
|
+
__privateAdd(this, _virtualOverscan, __runInitializers(_init39, 108, this, 8)), __runInitializers(_init39, 111, this);
|
|
164741
|
+
__privateAdd(this, _fixedHeight, __runInitializers(_init39, 112, this, false)), __runInitializers(_init39, 115, this);
|
|
164742
|
+
__privateAdd(this, _searchMode, __runInitializers(_init39, 116, this, "table")), __runInitializers(_init39, 119, this);
|
|
164663
164743
|
__publicField(this, "__searchTextSub");
|
|
164664
164744
|
__publicField(this, "__searchModeSub");
|
|
164665
|
-
__privateAdd(this, _selectionMode, __runInitializers(_init39,
|
|
164666
|
-
__privateAdd(this, _selectedIds, __runInitializers(_init39,
|
|
164745
|
+
__privateAdd(this, _selectionMode, __runInitializers(_init39, 120, this, "none")), __runInitializers(_init39, 123, this);
|
|
164746
|
+
__privateAdd(this, _selectedIds, __runInitializers(_init39, 124, this, /* @__PURE__ */ new Set())), __runInitializers(_init39, 127, this);
|
|
164667
164747
|
__publicField(this, "_rowIdMap", /* @__PURE__ */ new WeakMap());
|
|
164668
164748
|
__publicField(this, "_rowIdCounter", 0);
|
|
164669
164749
|
/**
|
|
@@ -164672,8 +164752,23 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164672
164752
|
* can compute a contiguous range from this anchor.
|
|
164673
164753
|
*/
|
|
164674
164754
|
__publicField(this, "__selectionAnchorId");
|
|
164675
|
-
__privateAdd(this, ___focusedCell, __runInitializers(_init39,
|
|
164676
|
-
__privateAdd(this, ___editingCell, __runInitializers(_init39,
|
|
164755
|
+
__privateAdd(this, ___focusedCell, __runInitializers(_init39, 128, this)), __runInitializers(_init39, 131, this);
|
|
164756
|
+
__privateAdd(this, ___editingCell, __runInitializers(_init39, 132, this)), __runInitializers(_init39, 135, this);
|
|
164757
|
+
__privateAdd(this, ___floatingActive, __runInitializers(_init39, 136, this, false)), __runInitializers(_init39, 139, this);
|
|
164758
|
+
// ─── Render memoization ──────────────────────────────────────────────
|
|
164759
|
+
// These caches let render() short-circuit when the relevant inputs
|
|
164760
|
+
// (by reference) haven't changed. They are NOT @state — mutating them
|
|
164761
|
+
// must never trigger a re-render.
|
|
164762
|
+
__publicField(this, "__memoEffectiveCols");
|
|
164763
|
+
__publicField(this, "__memoViewData");
|
|
164764
|
+
/** Tracks the (data, columns) pair that `determineColumnWidths()` last sized for. */
|
|
164765
|
+
__publicField(this, "__columnsSizedFor");
|
|
164766
|
+
// ─── Virtualization state ────────────────────────────────────────────
|
|
164767
|
+
/** Estimated row height (px). Measured once from the first rendered row. */
|
|
164768
|
+
__publicField(this, "__rowHeight", 36);
|
|
164769
|
+
/** True once we've measured `__rowHeight` from a real DOM row. */
|
|
164770
|
+
__publicField(this, "__rowHeightMeasured", false);
|
|
164771
|
+
__privateAdd(this, ___virtualRange, __runInitializers(_init39, 140, this, { start: 0, end: 0 })), __runInitializers(_init39, 143, this);
|
|
164677
164772
|
/**
|
|
164678
164773
|
* Ctrl/Cmd+C copies the currently selected rows as a JSON array. Falls
|
|
164679
164774
|
* back to copying the focused-row (`selectedDataRow`) if no multi
|
|
@@ -164753,9 +164848,110 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164753
164848
|
// ─── Floating header (page-sticky) lifecycle ─────────────────────────
|
|
164754
164849
|
__publicField(this, "__floatingResizeObserver");
|
|
164755
164850
|
__publicField(this, "__floatingScrollHandler");
|
|
164756
|
-
|
|
164851
|
+
// __floatingActive is declared as a @state field above so its toggle
|
|
164852
|
+
// triggers re-rendering of the floating-header clone subtree.
|
|
164757
164853
|
__publicField(this, "__scrollAncestors", []);
|
|
164758
164854
|
__publicField(this, "__debounceTimer");
|
|
164855
|
+
__publicField(this, "__onTbodyClick", /* @__PURE__ */ __name((eventArg) => {
|
|
164856
|
+
if (this.__isInEditor(eventArg) || this.__isInActionsCol(eventArg)) return;
|
|
164857
|
+
const cell2 = this.__resolveCell(eventArg);
|
|
164858
|
+
if (!cell2) return;
|
|
164859
|
+
const view = this._lastViewData ?? [];
|
|
164860
|
+
if (cell2.col.editable || cell2.col.editor) {
|
|
164861
|
+
this.__focusedCell = {
|
|
164862
|
+
rowId: this.getRowId(cell2.item),
|
|
164863
|
+
colKey: String(cell2.col.key)
|
|
164864
|
+
};
|
|
164865
|
+
}
|
|
164866
|
+
this.handleRowClick(eventArg, cell2.item, cell2.rowIdx, view);
|
|
164867
|
+
}, "__onTbodyClick"));
|
|
164868
|
+
__publicField(this, "__onTbodyDblclick", /* @__PURE__ */ __name((eventArg) => {
|
|
164869
|
+
if (this.__isInEditor(eventArg) || this.__isInActionsCol(eventArg)) return;
|
|
164870
|
+
const cell2 = this.__resolveCell(eventArg);
|
|
164871
|
+
if (!cell2) return;
|
|
164872
|
+
const isEditable = !!(cell2.col.editable || cell2.col.editor);
|
|
164873
|
+
if (isEditable) {
|
|
164874
|
+
eventArg.stopPropagation();
|
|
164875
|
+
this.startEditing(cell2.item, cell2.col);
|
|
164876
|
+
return;
|
|
164877
|
+
}
|
|
164878
|
+
const dblAction = this.dataActions.find((a5) => a5.type?.includes("doubleClick"));
|
|
164879
|
+
if (dblAction) dblAction.actionFunc({ item: cell2.item, table: this });
|
|
164880
|
+
}, "__onTbodyDblclick"));
|
|
164881
|
+
__publicField(this, "__onTbodyMousedown", /* @__PURE__ */ __name((eventArg) => {
|
|
164882
|
+
if (eventArg.shiftKey && this.selectionMode !== "single") eventArg.preventDefault();
|
|
164883
|
+
}, "__onTbodyMousedown"));
|
|
164884
|
+
__publicField(this, "__onTbodyContextmenu", /* @__PURE__ */ __name((eventArg) => {
|
|
164885
|
+
if (this.__isInActionsCol(eventArg)) return;
|
|
164886
|
+
const row = this.__resolveRow(eventArg);
|
|
164887
|
+
if (!row) return;
|
|
164888
|
+
const item = row.item;
|
|
164889
|
+
if (!this.isRowSelected(item)) {
|
|
164890
|
+
this.selectedDataRow = item;
|
|
164891
|
+
this.selectedIds.clear();
|
|
164892
|
+
this.selectedIds.add(this.getRowId(item));
|
|
164893
|
+
this.__selectionAnchorId = this.getRowId(item);
|
|
164894
|
+
this.emitSelectionChange();
|
|
164895
|
+
this.requestUpdate();
|
|
164896
|
+
}
|
|
164897
|
+
const userItems = this.getActionsForType("contextmenu").map(
|
|
164898
|
+
(action) => ({
|
|
164899
|
+
name: action.name,
|
|
164900
|
+
iconName: action.iconName,
|
|
164901
|
+
action: /* @__PURE__ */ __name(async () => {
|
|
164902
|
+
await action.actionFunc({ item, table: this });
|
|
164903
|
+
return null;
|
|
164904
|
+
}, "action")
|
|
164905
|
+
})
|
|
164906
|
+
);
|
|
164907
|
+
const defaultItems = [
|
|
164908
|
+
{
|
|
164909
|
+
name: this.selectedIds.size > 1 ? `Copy ${this.selectedIds.size} rows as JSON` : "Copy row as JSON",
|
|
164910
|
+
iconName: "lucide:Copy",
|
|
164911
|
+
action: /* @__PURE__ */ __name(async () => {
|
|
164912
|
+
this.copySelectionAsJson(item);
|
|
164913
|
+
return null;
|
|
164914
|
+
}, "action")
|
|
164915
|
+
}
|
|
164916
|
+
];
|
|
164917
|
+
DeesContextmenu.openContextMenuWithOptions(eventArg, [...userItems, ...defaultItems]);
|
|
164918
|
+
}, "__onTbodyContextmenu"));
|
|
164919
|
+
__publicField(this, "__onTbodyDragenter", /* @__PURE__ */ __name((eventArg) => {
|
|
164920
|
+
eventArg.preventDefault();
|
|
164921
|
+
eventArg.stopPropagation();
|
|
164922
|
+
const row = this.__resolveRow(eventArg);
|
|
164923
|
+
if (!row) return;
|
|
164924
|
+
const tr3 = (eventArg.composedPath?.() || []).find(
|
|
164925
|
+
(t9) => t9?.tagName === "TR"
|
|
164926
|
+
);
|
|
164927
|
+
if (tr3) setTimeout(() => tr3.classList.add("hasAttachment"), 0);
|
|
164928
|
+
}, "__onTbodyDragenter"));
|
|
164929
|
+
__publicField(this, "__onTbodyDragleave", /* @__PURE__ */ __name((eventArg) => {
|
|
164930
|
+
eventArg.preventDefault();
|
|
164931
|
+
eventArg.stopPropagation();
|
|
164932
|
+
const tr3 = (eventArg.composedPath?.() || []).find(
|
|
164933
|
+
(t9) => t9?.tagName === "TR"
|
|
164934
|
+
);
|
|
164935
|
+
if (tr3) tr3.classList.remove("hasAttachment");
|
|
164936
|
+
}, "__onTbodyDragleave"));
|
|
164937
|
+
__publicField(this, "__onTbodyDragover", /* @__PURE__ */ __name((eventArg) => {
|
|
164938
|
+
eventArg.preventDefault();
|
|
164939
|
+
}, "__onTbodyDragover"));
|
|
164940
|
+
__publicField(this, "__onTbodyDrop", /* @__PURE__ */ __name(async (eventArg) => {
|
|
164941
|
+
eventArg.preventDefault();
|
|
164942
|
+
const row = this.__resolveRow(eventArg);
|
|
164943
|
+
if (!row) return;
|
|
164944
|
+
const item = row.item;
|
|
164945
|
+
const newFiles = [];
|
|
164946
|
+
for (const file of Array.from(eventArg.dataTransfer.files)) {
|
|
164947
|
+
this.files.push(file);
|
|
164948
|
+
newFiles.push(file);
|
|
164949
|
+
this.requestUpdate();
|
|
164950
|
+
}
|
|
164951
|
+
const existing = this.fileWeakMap.get(item);
|
|
164952
|
+
if (!existing) this.fileWeakMap.set(item, newFiles);
|
|
164953
|
+
else existing.push(...newFiles);
|
|
164954
|
+
}, "__onTbodyDrop"));
|
|
164759
164955
|
if (!this.hasAttribute("tabindex")) this.setAttribute("tabindex", "0");
|
|
164760
164956
|
this.addEventListener("keydown", this.__handleHostKeydown);
|
|
164761
164957
|
}
|
|
@@ -164788,24 +164984,83 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164788
164984
|
} catch {
|
|
164789
164985
|
}
|
|
164790
164986
|
}
|
|
164791
|
-
|
|
164987
|
+
/**
|
|
164988
|
+
* Returns the effective column schema, memoized by reference of the inputs
|
|
164989
|
+
* that affect it. Avoids re-running `computeEffectiveColumnsFn` /
|
|
164990
|
+
* `computeColumnsFromDisplayFunctionFn` on every Lit update.
|
|
164991
|
+
*/
|
|
164992
|
+
__getEffectiveColumns() {
|
|
164792
164993
|
const usingColumns = Array.isArray(this.columns) && this.columns.length > 0;
|
|
164793
|
-
const
|
|
164794
|
-
|
|
164795
|
-
|
|
164796
|
-
|
|
164797
|
-
|
|
164798
|
-
|
|
164799
|
-
|
|
164994
|
+
const cache = this.__memoEffectiveCols;
|
|
164995
|
+
if (cache && cache.columns === this.columns && cache.augment === this.augmentFromDisplayFunction && cache.displayFunction === this.displayFunction && cache.data === this.data) {
|
|
164996
|
+
return cache.out;
|
|
164997
|
+
}
|
|
164998
|
+
const out = usingColumns ? computeEffectiveColumns(
|
|
164999
|
+
this.columns,
|
|
165000
|
+
this.augmentFromDisplayFunction,
|
|
165001
|
+
this.displayFunction,
|
|
165002
|
+
this.data
|
|
165003
|
+
) : computeColumnsFromDisplayFunction(this.displayFunction, this.data);
|
|
165004
|
+
this.__memoEffectiveCols = {
|
|
165005
|
+
columns: this.columns,
|
|
165006
|
+
augment: this.augmentFromDisplayFunction,
|
|
165007
|
+
displayFunction: this.displayFunction,
|
|
165008
|
+
data: this.data,
|
|
165009
|
+
out
|
|
165010
|
+
};
|
|
165011
|
+
return out;
|
|
165012
|
+
}
|
|
165013
|
+
/**
|
|
165014
|
+
* Returns the sorted/filtered view of the data, memoized by reference of
|
|
165015
|
+
* everything that affects it. Avoids re-running the lucene compiler and
|
|
165016
|
+
* the sort/filter pipeline on every render.
|
|
165017
|
+
*/
|
|
165018
|
+
__getViewData(effectiveColumns) {
|
|
165019
|
+
const searchMode = this.searchMode === "data" ? "data" : "table";
|
|
165020
|
+
const cache = this.__memoViewData;
|
|
165021
|
+
if (cache && cache.data === this.data && cache.sortBy === this.sortBy && cache.filterText === this.filterText && cache.columnFilters === this.columnFilters && cache.searchMode === searchMode && cache.effectiveColumns === effectiveColumns) {
|
|
165022
|
+
return cache.out;
|
|
165023
|
+
}
|
|
165024
|
+
const lucenePred = compileLucenePredicate(this.filterText, searchMode, effectiveColumns);
|
|
165025
|
+
const out = getViewData(
|
|
164800
165026
|
this.data,
|
|
164801
165027
|
effectiveColumns,
|
|
164802
165028
|
this.sortBy,
|
|
164803
165029
|
this.filterText,
|
|
164804
165030
|
this.columnFilters,
|
|
164805
|
-
|
|
165031
|
+
searchMode,
|
|
164806
165032
|
lucenePred || void 0
|
|
164807
165033
|
);
|
|
165034
|
+
this.__memoViewData = {
|
|
165035
|
+
data: this.data,
|
|
165036
|
+
sortBy: this.sortBy,
|
|
165037
|
+
filterText: this.filterText,
|
|
165038
|
+
columnFilters: this.columnFilters,
|
|
165039
|
+
searchMode,
|
|
165040
|
+
effectiveColumns,
|
|
165041
|
+
out
|
|
165042
|
+
};
|
|
165043
|
+
return out;
|
|
165044
|
+
}
|
|
165045
|
+
render() {
|
|
165046
|
+
const effectiveColumns = this.__getEffectiveColumns();
|
|
165047
|
+
const viewData = this.__getViewData(effectiveColumns);
|
|
164808
165048
|
this._lastViewData = viewData;
|
|
165049
|
+
const useVirtual = this.virtualized && viewData.length > 0;
|
|
165050
|
+
let renderRows = viewData;
|
|
165051
|
+
let renderStart = 0;
|
|
165052
|
+
let topSpacerHeight = 0;
|
|
165053
|
+
let bottomSpacerHeight = 0;
|
|
165054
|
+
if (useVirtual) {
|
|
165055
|
+
const range2 = this.__virtualRange;
|
|
165056
|
+
const start = Math.max(0, range2.start);
|
|
165057
|
+
const end3 = Math.min(viewData.length, range2.end || 0);
|
|
165058
|
+
const initialEnd = end3 > 0 ? end3 : Math.min(viewData.length, this.virtualOverscan * 2 + 16);
|
|
165059
|
+
renderStart = start;
|
|
165060
|
+
renderRows = viewData.slice(start, initialEnd);
|
|
165061
|
+
topSpacerHeight = start * this.__rowHeight;
|
|
165062
|
+
bottomSpacerHeight = Math.max(0, viewData.length - initialEnd) * this.__rowHeight;
|
|
165063
|
+
}
|
|
164809
165064
|
return b2`
|
|
164810
165065
|
<dees-tile>
|
|
164811
165066
|
<div slot="header" class="header">
|
|
@@ -164873,88 +165128,23 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164873
165128
|
<thead>
|
|
164874
165129
|
${this.renderHeaderRows(effectiveColumns)}
|
|
164875
165130
|
</thead>
|
|
164876
|
-
<tbody
|
|
164877
|
-
|
|
164878
|
-
|
|
164879
|
-
|
|
164880
|
-
|
|
164881
|
-
|
|
164882
|
-
|
|
164883
|
-
|
|
164884
|
-
|
|
165131
|
+
<tbody
|
|
165132
|
+
@click=${this.__onTbodyClick}
|
|
165133
|
+
@dblclick=${this.__onTbodyDblclick}
|
|
165134
|
+
@mousedown=${this.__onTbodyMousedown}
|
|
165135
|
+
@contextmenu=${this.__onTbodyContextmenu}
|
|
165136
|
+
@dragenter=${this.__onTbodyDragenter}
|
|
165137
|
+
@dragleave=${this.__onTbodyDragleave}
|
|
165138
|
+
@dragover=${this.__onTbodyDragover}
|
|
165139
|
+
@drop=${this.__onTbodyDrop}
|
|
165140
|
+
>
|
|
165141
|
+
${useVirtual && topSpacerHeight > 0 ? b2`<tr aria-hidden="true" style="height:${topSpacerHeight}px"><td></td></tr>` : b2``}
|
|
165142
|
+
${renderRows.map((itemArg, sliceIdx) => {
|
|
165143
|
+
const rowIndex = renderStart + sliceIdx;
|
|
165144
|
+
const rowId = this.getRowId(itemArg);
|
|
164885
165145
|
return b2`
|
|
164886
165146
|
<tr
|
|
164887
|
-
|
|
164888
|
-
@mousedown=${(e11) => {
|
|
164889
|
-
if (e11.shiftKey && this.selectionMode !== "single") e11.preventDefault();
|
|
164890
|
-
}}
|
|
164891
|
-
@dragenter=${async (eventArg) => {
|
|
164892
|
-
eventArg.preventDefault();
|
|
164893
|
-
eventArg.stopPropagation();
|
|
164894
|
-
const realTarget = getTr(eventArg.target);
|
|
164895
|
-
setTimeout(() => {
|
|
164896
|
-
realTarget.classList.add("hasAttachment");
|
|
164897
|
-
}, 0);
|
|
164898
|
-
}}
|
|
164899
|
-
@dragleave=${async (eventArg) => {
|
|
164900
|
-
eventArg.preventDefault();
|
|
164901
|
-
eventArg.stopPropagation();
|
|
164902
|
-
const realTarget = getTr(eventArg.target);
|
|
164903
|
-
realTarget.classList.remove("hasAttachment");
|
|
164904
|
-
}}
|
|
164905
|
-
@dragover=${async (eventArg) => {
|
|
164906
|
-
eventArg.preventDefault();
|
|
164907
|
-
}}
|
|
164908
|
-
@drop=${async (eventArg) => {
|
|
164909
|
-
eventArg.preventDefault();
|
|
164910
|
-
const newFiles = [];
|
|
164911
|
-
for (const file of Array.from(eventArg.dataTransfer.files)) {
|
|
164912
|
-
this.files.push(file);
|
|
164913
|
-
newFiles.push(file);
|
|
164914
|
-
this.requestUpdate();
|
|
164915
|
-
}
|
|
164916
|
-
const result = this.fileWeakMap.get(itemArg);
|
|
164917
|
-
if (!result) {
|
|
164918
|
-
this.fileWeakMap.set(itemArg, newFiles);
|
|
164919
|
-
} else {
|
|
164920
|
-
result.push(...newFiles);
|
|
164921
|
-
}
|
|
164922
|
-
}}
|
|
164923
|
-
@contextmenu=${async (eventArg) => {
|
|
164924
|
-
if (!this.isRowSelected(itemArg)) {
|
|
164925
|
-
this.selectedDataRow = itemArg;
|
|
164926
|
-
this.selectedIds.clear();
|
|
164927
|
-
this.selectedIds.add(this.getRowId(itemArg));
|
|
164928
|
-
this.__selectionAnchorId = this.getRowId(itemArg);
|
|
164929
|
-
this.emitSelectionChange();
|
|
164930
|
-
this.requestUpdate();
|
|
164931
|
-
}
|
|
164932
|
-
const userItems = this.getActionsForType("contextmenu").map((action) => ({
|
|
164933
|
-
name: action.name,
|
|
164934
|
-
iconName: action.iconName,
|
|
164935
|
-
action: /* @__PURE__ */ __name(async () => {
|
|
164936
|
-
await action.actionFunc({
|
|
164937
|
-
item: itemArg,
|
|
164938
|
-
table: this
|
|
164939
|
-
});
|
|
164940
|
-
return null;
|
|
164941
|
-
}, "action")
|
|
164942
|
-
}));
|
|
164943
|
-
const defaultItems = [
|
|
164944
|
-
{
|
|
164945
|
-
name: this.selectedIds.size > 1 ? `Copy ${this.selectedIds.size} rows as JSON` : "Copy row as JSON",
|
|
164946
|
-
iconName: "lucide:Copy",
|
|
164947
|
-
action: /* @__PURE__ */ __name(async () => {
|
|
164948
|
-
this.copySelectionAsJson(itemArg);
|
|
164949
|
-
return null;
|
|
164950
|
-
}, "action")
|
|
164951
|
-
}
|
|
164952
|
-
];
|
|
164953
|
-
DeesContextmenu.openContextMenuWithOptions(eventArg, [
|
|
164954
|
-
...userItems,
|
|
164955
|
-
...defaultItems
|
|
164956
|
-
]);
|
|
164957
|
-
}}
|
|
165147
|
+
data-row-idx=${rowIndex}
|
|
164958
165148
|
class="${itemArg === this.selectedDataRow || this.isRowSelected(itemArg) ? "selected" : ""}"
|
|
164959
165149
|
>
|
|
164960
165150
|
${this.showSelectionCheckbox ? b2`<td style="width:42px; text-align:center;">
|
|
@@ -164971,7 +165161,6 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164971
165161
|
const content3 = col.renderer ? col.renderer(value2, itemArg, { rowIndex, colIndex, column: col }) : value2;
|
|
164972
165162
|
const editKey = String(col.key);
|
|
164973
165163
|
const isEditable = !!(col.editable || col.editor);
|
|
164974
|
-
const rowId = this.getRowId(itemArg);
|
|
164975
165164
|
const isFocused = this.__focusedCell?.rowId === rowId && this.__focusedCell?.colKey === editKey;
|
|
164976
165165
|
const isEditing = this.__editingCell?.rowId === rowId && this.__editingCell?.colKey === editKey;
|
|
164977
165166
|
const cellClasses = [
|
|
@@ -164982,26 +165171,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
164982
165171
|
return b2`
|
|
164983
165172
|
<td
|
|
164984
165173
|
class=${cellClasses}
|
|
164985
|
-
|
|
164986
|
-
if (isEditing) {
|
|
164987
|
-
e11.stopPropagation();
|
|
164988
|
-
return;
|
|
164989
|
-
}
|
|
164990
|
-
if (isEditable) {
|
|
164991
|
-
this.__focusedCell = { rowId, colKey: editKey };
|
|
164992
|
-
}
|
|
164993
|
-
}}
|
|
164994
|
-
@dblclick=${(e11) => {
|
|
164995
|
-
const dblAction = this.dataActions.find(
|
|
164996
|
-
(actionArg) => actionArg.type?.includes("doubleClick")
|
|
164997
|
-
);
|
|
164998
|
-
if (isEditable) {
|
|
164999
|
-
e11.stopPropagation();
|
|
165000
|
-
this.startEditing(itemArg, col);
|
|
165001
|
-
} else if (dblAction) {
|
|
165002
|
-
dblAction.actionFunc({ item: itemArg, table: this });
|
|
165003
|
-
}
|
|
165004
|
-
}}
|
|
165174
|
+
data-col-key=${editKey}
|
|
165005
165175
|
>
|
|
165006
165176
|
<div class="innerCellContainer">
|
|
165007
165177
|
${isEditing ? this.renderCellEditor(itemArg, col) : content3}
|
|
@@ -165034,15 +165204,16 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165034
165204
|
})()}
|
|
165035
165205
|
</tr>`;
|
|
165036
165206
|
})}
|
|
165207
|
+
${useVirtual && bottomSpacerHeight > 0 ? b2`<tr aria-hidden="true" style="height:${bottomSpacerHeight}px"><td></td></tr>` : b2``}
|
|
165037
165208
|
</tbody>
|
|
165038
165209
|
</table>
|
|
165039
165210
|
</div>
|
|
165040
165211
|
<div class="floatingHeader" aria-hidden="true">
|
|
165041
|
-
|
|
165042
|
-
|
|
165043
|
-
|
|
165044
|
-
|
|
165045
|
-
|
|
165212
|
+
${this.__floatingActive ? b2`<table>
|
|
165213
|
+
<thead>
|
|
165214
|
+
${this.renderHeaderRows(effectiveColumns)}
|
|
165215
|
+
</thead>
|
|
165216
|
+
</table>` : b2``}
|
|
165046
165217
|
</div>
|
|
165047
165218
|
` : b2` <div class="noDataSet">No data set!</div> `}
|
|
165048
165219
|
<div slot="footer" class="footer">
|
|
@@ -165202,24 +165373,33 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165202
165373
|
}
|
|
165203
165374
|
setupFloatingHeader() {
|
|
165204
165375
|
this.teardownFloatingHeader();
|
|
165205
|
-
if (this.fixedHeight) return;
|
|
165376
|
+
if (this.fixedHeight && !this.virtualized) return;
|
|
165206
165377
|
const realTable = this.__realTableEl;
|
|
165207
165378
|
if (!realTable) return;
|
|
165208
165379
|
this.__scrollAncestors = this.__collectScrollAncestors();
|
|
165209
165380
|
const tableScrollEl = this.shadowRoot?.querySelector(".tableScroll");
|
|
165210
165381
|
if (tableScrollEl) {
|
|
165211
|
-
this.__scrollAncestors.unshift({
|
|
165382
|
+
this.__scrollAncestors.unshift({
|
|
165383
|
+
target: tableScrollEl,
|
|
165384
|
+
scrollsY: this.fixedHeight,
|
|
165385
|
+
scrollsX: true
|
|
165386
|
+
});
|
|
165212
165387
|
}
|
|
165213
165388
|
this.__floatingResizeObserver = new ResizeObserver(() => {
|
|
165214
|
-
this.__syncFloatingHeader();
|
|
165389
|
+
if (!this.fixedHeight) this.__syncFloatingHeader();
|
|
165390
|
+
if (this.virtualized) this.__computeVirtualRange();
|
|
165215
165391
|
});
|
|
165216
165392
|
this.__floatingResizeObserver.observe(realTable);
|
|
165217
|
-
this.__floatingScrollHandler = () =>
|
|
165393
|
+
this.__floatingScrollHandler = () => {
|
|
165394
|
+
if (!this.fixedHeight) this.__syncFloatingHeader();
|
|
165395
|
+
if (this.virtualized) this.__computeVirtualRange();
|
|
165396
|
+
};
|
|
165218
165397
|
for (const a5 of this.__scrollAncestors) {
|
|
165219
165398
|
a5.target.addEventListener("scroll", this.__floatingScrollHandler, { passive: true });
|
|
165220
165399
|
}
|
|
165221
165400
|
window.addEventListener("resize", this.__floatingScrollHandler, { passive: true });
|
|
165222
|
-
this.__syncFloatingHeader();
|
|
165401
|
+
if (!this.fixedHeight) this.__syncFloatingHeader();
|
|
165402
|
+
if (this.virtualized) this.__computeVirtualRange();
|
|
165223
165403
|
}
|
|
165224
165404
|
teardownFloatingHeader() {
|
|
165225
165405
|
this.__floatingResizeObserver?.disconnect();
|
|
@@ -165236,24 +165416,106 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165236
165416
|
const fh = this.__floatingHeaderEl;
|
|
165237
165417
|
if (fh) fh.classList.remove("active");
|
|
165238
165418
|
}
|
|
165419
|
+
// ─── Virtualization ─────────────────────────────────────────────────
|
|
165420
|
+
/**
|
|
165421
|
+
* Computes the visible row range based on the table's position in its
|
|
165422
|
+
* nearest vertical scroll ancestor (or the viewport). Updates
|
|
165423
|
+
* `__virtualRange` if it changed; that triggers a Lit re-render.
|
|
165424
|
+
*/
|
|
165425
|
+
__computeVirtualRange() {
|
|
165426
|
+
if (!this.virtualized) return;
|
|
165427
|
+
const view = this._lastViewData ?? [];
|
|
165428
|
+
const total = view.length;
|
|
165429
|
+
if (total === 0) {
|
|
165430
|
+
if (this.__virtualRange.start !== 0 || this.__virtualRange.end !== 0) {
|
|
165431
|
+
this.__virtualRange = { start: 0, end: 0 };
|
|
165432
|
+
}
|
|
165433
|
+
return;
|
|
165434
|
+
}
|
|
165435
|
+
const realTable = this.__realTableEl;
|
|
165436
|
+
if (!realTable) return;
|
|
165437
|
+
const tableRect = realTable.getBoundingClientRect();
|
|
165438
|
+
let viewportTop = 0;
|
|
165439
|
+
let viewportBottom = window.innerHeight;
|
|
165440
|
+
for (const a5 of this.__scrollAncestors) {
|
|
165441
|
+
if (a5.target === window || !a5.scrollsY) continue;
|
|
165442
|
+
const r11 = a5.target.getBoundingClientRect();
|
|
165443
|
+
const cs = getComputedStyle(a5.target);
|
|
165444
|
+
const bt = parseFloat(cs.borderTopWidth) || 0;
|
|
165445
|
+
const bb = parseFloat(cs.borderBottomWidth) || 0;
|
|
165446
|
+
viewportTop = Math.max(viewportTop, r11.top + bt);
|
|
165447
|
+
viewportBottom = Math.min(viewportBottom, r11.bottom - bb);
|
|
165448
|
+
}
|
|
165449
|
+
const rowH = Math.max(1, this.__rowHeight);
|
|
165450
|
+
const headerHeight = realTable.tHead?.getBoundingClientRect().height ?? 0;
|
|
165451
|
+
const bodyTop = tableRect.top + headerHeight;
|
|
165452
|
+
const offsetIntoBody = Math.max(0, viewportTop - bodyTop);
|
|
165453
|
+
const visiblePx = Math.max(0, viewportBottom - Math.max(viewportTop, bodyTop));
|
|
165454
|
+
const startRaw = Math.floor(offsetIntoBody / rowH);
|
|
165455
|
+
const visibleCount = Math.ceil(visiblePx / rowH) + 1;
|
|
165456
|
+
const start = Math.max(0, startRaw - this.virtualOverscan);
|
|
165457
|
+
const end3 = Math.min(total, startRaw + visibleCount + this.virtualOverscan);
|
|
165458
|
+
if (start !== this.__virtualRange.start || end3 !== this.__virtualRange.end) {
|
|
165459
|
+
this.__virtualRange = { start, end: end3 };
|
|
165460
|
+
}
|
|
165461
|
+
}
|
|
165462
|
+
/**
|
|
165463
|
+
* Measures the height of the first rendered body row and stores it for
|
|
165464
|
+
* subsequent virtualization math. Idempotent — only measures once per
|
|
165465
|
+
* `data`/`columns` pair (cleared in `updated()` when those change).
|
|
165466
|
+
*/
|
|
165467
|
+
__measureRowHeight() {
|
|
165468
|
+
if (!this.virtualized || this.__rowHeightMeasured) return;
|
|
165469
|
+
const tbody3 = this.shadowRoot?.querySelector("tbody");
|
|
165470
|
+
if (!tbody3) return;
|
|
165471
|
+
const firstRow = Array.from(tbody3.rows).find((r11) => r11.hasAttribute("data-row-idx"));
|
|
165472
|
+
if (!firstRow) return;
|
|
165473
|
+
const h8 = firstRow.getBoundingClientRect().height;
|
|
165474
|
+
if (h8 > 0) {
|
|
165475
|
+
this.__rowHeight = h8;
|
|
165476
|
+
this.__rowHeightMeasured = true;
|
|
165477
|
+
}
|
|
165478
|
+
}
|
|
165239
165479
|
/**
|
|
165240
165480
|
* Single function that drives both activation and geometry of the floating
|
|
165241
|
-
* header. Called on scroll, resize, table-resize, and after
|
|
165481
|
+
* header. Called on scroll, resize, table-resize, and after relevant
|
|
165482
|
+
* renders.
|
|
165483
|
+
*
|
|
165484
|
+
* Activation is decided from the *real* header geometry, so this function
|
|
165485
|
+
* works even when the clone subtree hasn't been rendered yet (it's only
|
|
165486
|
+
* rendered when `__floatingActive` is true). The first activation flips
|
|
165487
|
+
* `__floatingActive`; the next render materializes the clone; the next
|
|
165488
|
+
* call here mirrors widths and positions.
|
|
165242
165489
|
*/
|
|
165243
165490
|
__syncFloatingHeader() {
|
|
165244
165491
|
const fh = this.__floatingHeaderEl;
|
|
165245
165492
|
const realTable = this.__realTableEl;
|
|
165246
|
-
|
|
165247
|
-
if (!fh || !realTable || !floatTable) return;
|
|
165493
|
+
if (!fh || !realTable) return;
|
|
165248
165494
|
const tableRect = realTable.getBoundingClientRect();
|
|
165249
165495
|
const stick = this.__getStickContext();
|
|
165250
|
-
floatTable.style.tableLayout = realTable.style.tableLayout || "auto";
|
|
165251
165496
|
const realHeadRows = realTable.tHead?.rows;
|
|
165252
|
-
const floatHeadRows = floatTable.tHead?.rows;
|
|
165253
165497
|
let headerHeight = 0;
|
|
165498
|
+
if (realHeadRows) {
|
|
165499
|
+
for (let r11 = 0; r11 < realHeadRows.length; r11++) {
|
|
165500
|
+
headerHeight += realHeadRows[r11].getBoundingClientRect().height;
|
|
165501
|
+
}
|
|
165502
|
+
}
|
|
165503
|
+
const shouldBeActive = tableRect.top < stick.top && tableRect.bottom > stick.top + Math.min(headerHeight, 1);
|
|
165504
|
+
if (shouldBeActive !== this.__floatingActive) {
|
|
165505
|
+
this.__floatingActive = shouldBeActive;
|
|
165506
|
+
fh.classList.toggle("active", shouldBeActive);
|
|
165507
|
+
if (shouldBeActive) {
|
|
165508
|
+
this.updateComplete.then(() => this.__syncFloatingHeader());
|
|
165509
|
+
return;
|
|
165510
|
+
}
|
|
165511
|
+
}
|
|
165512
|
+
if (!shouldBeActive) return;
|
|
165513
|
+
const floatTable = this.__floatingTableEl;
|
|
165514
|
+
if (!floatTable) return;
|
|
165515
|
+
floatTable.style.tableLayout = realTable.style.tableLayout || "auto";
|
|
165516
|
+
const floatHeadRows = floatTable.tHead?.rows;
|
|
165254
165517
|
if (realHeadRows && floatHeadRows) {
|
|
165255
165518
|
for (let r11 = 0; r11 < realHeadRows.length && r11 < floatHeadRows.length; r11++) {
|
|
165256
|
-
headerHeight += realHeadRows[r11].getBoundingClientRect().height;
|
|
165257
165519
|
const realCells = realHeadRows[r11].cells;
|
|
165258
165520
|
const floatCells = floatHeadRows[r11].cells;
|
|
165259
165521
|
for (let c11 = 0; c11 < realCells.length && c11 < floatCells.length; c11++) {
|
|
@@ -165264,12 +165526,6 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165264
165526
|
}
|
|
165265
165527
|
}
|
|
165266
165528
|
}
|
|
165267
|
-
const shouldBeActive = tableRect.top < stick.top && tableRect.bottom > stick.top + Math.min(headerHeight, 1);
|
|
165268
|
-
if (shouldBeActive !== this.__floatingActive) {
|
|
165269
|
-
this.__floatingActive = shouldBeActive;
|
|
165270
|
-
fh.classList.toggle("active", shouldBeActive);
|
|
165271
|
-
}
|
|
165272
|
-
if (!shouldBeActive) return;
|
|
165273
165529
|
const clipLeft = Math.max(tableRect.left, stick.left);
|
|
165274
165530
|
const clipRight = Math.min(tableRect.right, stick.right);
|
|
165275
165531
|
const clipWidth = Math.max(0, clipRight - clipLeft);
|
|
@@ -165287,15 +165543,25 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165287
165543
|
}
|
|
165288
165544
|
async updated(changedProperties) {
|
|
165289
165545
|
super.updated(changedProperties);
|
|
165290
|
-
this.
|
|
165291
|
-
if (
|
|
165292
|
-
|
|
165546
|
+
const dataOrColsChanged = !this.__columnsSizedFor || this.__columnsSizedFor.data !== this.data || this.__columnsSizedFor.columns !== this.columns;
|
|
165547
|
+
if (dataOrColsChanged) {
|
|
165548
|
+
this.__columnsSizedFor = { data: this.data, columns: this.columns };
|
|
165549
|
+
this.determineColumnWidths();
|
|
165550
|
+
this.__rowHeightMeasured = false;
|
|
165551
|
+
}
|
|
165552
|
+
if (this.virtualized) {
|
|
165553
|
+
this.__measureRowHeight();
|
|
165554
|
+
this.__computeVirtualRange();
|
|
165555
|
+
}
|
|
165556
|
+
if (changedProperties.has("fixedHeight") || changedProperties.has("virtualized") || changedProperties.has("data") || changedProperties.has("columns") || !this.__floatingScrollHandler) {
|
|
165557
|
+
const needsScrollWatchers = (!this.fixedHeight || this.virtualized) && this.data.length > 0;
|
|
165558
|
+
if (needsScrollWatchers) {
|
|
165293
165559
|
this.setupFloatingHeader();
|
|
165294
165560
|
} else {
|
|
165295
165561
|
this.teardownFloatingHeader();
|
|
165296
165562
|
}
|
|
165297
165563
|
}
|
|
165298
|
-
if (!this.fixedHeight && this.data.length > 0) {
|
|
165564
|
+
if (!this.fixedHeight && this.data.length > 0 && (this.__floatingActive || dataOrColsChanged)) {
|
|
165299
165565
|
this.__syncFloatingHeader();
|
|
165300
165566
|
}
|
|
165301
165567
|
if (this.searchable) {
|
|
@@ -165742,6 +166008,65 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165742
166008
|
this.emitSelectionChange();
|
|
165743
166009
|
this.requestUpdate();
|
|
165744
166010
|
}
|
|
166011
|
+
// ─── Delegated tbody event handlers ─────────────────────────────────
|
|
166012
|
+
// Hoisted from per-<tr> closures to a single set of handlers on <tbody>.
|
|
166013
|
+
// Cuts ~7 closure allocations per row per render. Each handler resolves
|
|
166014
|
+
// the source row via `data-row-idx` (and `data-col-key` for cell-level
|
|
166015
|
+
// events) using the latest `_lastViewData`.
|
|
166016
|
+
__resolveRow(eventArg) {
|
|
166017
|
+
const path2 = eventArg.composedPath?.() || [];
|
|
166018
|
+
let tr3 = null;
|
|
166019
|
+
for (const t9 of path2) {
|
|
166020
|
+
const el = t9;
|
|
166021
|
+
if (el?.tagName === "TR" && el.hasAttribute("data-row-idx")) {
|
|
166022
|
+
tr3 = el;
|
|
166023
|
+
break;
|
|
166024
|
+
}
|
|
166025
|
+
}
|
|
166026
|
+
if (!tr3) return null;
|
|
166027
|
+
const rowIdx = Number(tr3.getAttribute("data-row-idx"));
|
|
166028
|
+
const view = this._lastViewData ?? [];
|
|
166029
|
+
const item = view[rowIdx];
|
|
166030
|
+
if (!item) return null;
|
|
166031
|
+
return { item, rowIdx };
|
|
166032
|
+
}
|
|
166033
|
+
__resolveCell(eventArg) {
|
|
166034
|
+
const row = this.__resolveRow(eventArg);
|
|
166035
|
+
if (!row) return null;
|
|
166036
|
+
const path2 = eventArg.composedPath?.() || [];
|
|
166037
|
+
let td = null;
|
|
166038
|
+
for (const t9 of path2) {
|
|
166039
|
+
const el = t9;
|
|
166040
|
+
if (el?.tagName === "TD" && el.hasAttribute("data-col-key")) {
|
|
166041
|
+
td = el;
|
|
166042
|
+
break;
|
|
166043
|
+
}
|
|
166044
|
+
}
|
|
166045
|
+
if (!td) return null;
|
|
166046
|
+
const colKey = td.getAttribute("data-col-key");
|
|
166047
|
+
const cols = this.__getEffectiveColumns();
|
|
166048
|
+
const col = cols.find((c11) => String(c11.key) === colKey);
|
|
166049
|
+
if (!col) return null;
|
|
166050
|
+
return { item: row.item, rowIdx: row.rowIdx, col };
|
|
166051
|
+
}
|
|
166052
|
+
__isInActionsCol(eventArg) {
|
|
166053
|
+
const path2 = eventArg.composedPath?.() || [];
|
|
166054
|
+
for (const t9 of path2) {
|
|
166055
|
+
const el = t9;
|
|
166056
|
+
if (el?.classList?.contains("actionsCol")) return true;
|
|
166057
|
+
}
|
|
166058
|
+
return false;
|
|
166059
|
+
}
|
|
166060
|
+
__isInEditor(eventArg) {
|
|
166061
|
+
const path2 = eventArg.composedPath?.() || [];
|
|
166062
|
+
for (const t9 of path2) {
|
|
166063
|
+
const el = t9;
|
|
166064
|
+
const tag = el?.tagName;
|
|
166065
|
+
if (tag === "INPUT" || tag === "TEXTAREA" || el?.isContentEditable) return true;
|
|
166066
|
+
if (tag && tag.startsWith("DEES-INPUT-")) return true;
|
|
166067
|
+
}
|
|
166068
|
+
return false;
|
|
166069
|
+
}
|
|
165745
166070
|
/**
|
|
165746
166071
|
* Handles row clicks with file-manager style selection semantics:
|
|
165747
166072
|
* - plain click: select only this row, set anchor
|
|
@@ -165882,6 +166207,9 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165882
166207
|
".editingCell dees-input-text, .editingCell dees-input-checkbox, .editingCell dees-input-dropdown, .editingCell dees-input-datepicker, .editingCell dees-input-tags"
|
|
165883
166208
|
);
|
|
165884
166209
|
el?.focus?.();
|
|
166210
|
+
if (el?.tagName === "DEES-INPUT-DROPDOWN") {
|
|
166211
|
+
el.updateComplete?.then(() => el.toggleSelectionBox?.());
|
|
166212
|
+
}
|
|
165885
166213
|
});
|
|
165886
166214
|
}
|
|
165887
166215
|
/** Closes the editor without committing. */
|
|
@@ -165943,8 +166271,13 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165943
166271
|
></dees-input-checkbox>`;
|
|
165944
166272
|
case "dropdown": {
|
|
165945
166273
|
const options2 = col.editorOptions?.options ?? [];
|
|
165946
|
-
const selected = options2.find((o13) =>
|
|
166274
|
+
const selected = options2.find((o13) => {
|
|
166275
|
+
if (o13 == null) return false;
|
|
166276
|
+
if (typeof o13 === "string") return o13 === raw2;
|
|
166277
|
+
return o13.key === raw2 || o13.option === raw2;
|
|
166278
|
+
}) ?? null;
|
|
165947
166279
|
return b2`<dees-input-dropdown
|
|
166280
|
+
.vintegrated=${true}
|
|
165948
166281
|
.options=${options2}
|
|
165949
166282
|
.selectedOption=${selected}
|
|
165950
166283
|
@selectedOption=${(e11) => {
|
|
@@ -165971,6 +166304,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
|
|
|
165971
166304
|
case "text":
|
|
165972
166305
|
default:
|
|
165973
166306
|
return b2`<dees-input-text
|
|
166307
|
+
.vintegrated=${true}
|
|
165974
166308
|
.value=${value2 == null ? "" : String(value2)}
|
|
165975
166309
|
@focusout=${(e11) => onTextCommit(e11.target)}
|
|
165976
166310
|
@keydown=${(e11) => this.__handleEditorKey(e11, item, col)}
|
|
@@ -166071,12 +166405,16 @@ _filterText = new WeakMap();
|
|
|
166071
166405
|
_columnFilters = new WeakMap();
|
|
166072
166406
|
_showColumnFilters = new WeakMap();
|
|
166073
166407
|
_showSelectionCheckbox = new WeakMap();
|
|
166408
|
+
_virtualized = new WeakMap();
|
|
166409
|
+
_virtualOverscan = new WeakMap();
|
|
166074
166410
|
_fixedHeight = new WeakMap();
|
|
166075
166411
|
_searchMode = new WeakMap();
|
|
166076
166412
|
_selectionMode = new WeakMap();
|
|
166077
166413
|
_selectedIds = new WeakMap();
|
|
166078
166414
|
___focusedCell = new WeakMap();
|
|
166079
166415
|
___editingCell = new WeakMap();
|
|
166416
|
+
___floatingActive = new WeakMap();
|
|
166417
|
+
___virtualRange = new WeakMap();
|
|
166080
166418
|
__decorateElement(_init39, 4, "heading1", _heading1_dec, _DeesTable, _heading1);
|
|
166081
166419
|
__decorateElement(_init39, 4, "heading2", _heading2_dec, _DeesTable, _heading22);
|
|
166082
166420
|
__decorateElement(_init39, 4, "data", _data_dec, _DeesTable, _data);
|
|
@@ -166101,12 +166439,16 @@ __decorateElement(_init39, 4, "filterText", _filterText_dec, _DeesTable, _filter
|
|
|
166101
166439
|
__decorateElement(_init39, 4, "columnFilters", _columnFilters_dec, _DeesTable, _columnFilters);
|
|
166102
166440
|
__decorateElement(_init39, 4, "showColumnFilters", _showColumnFilters_dec, _DeesTable, _showColumnFilters);
|
|
166103
166441
|
__decorateElement(_init39, 4, "showSelectionCheckbox", _showSelectionCheckbox_dec, _DeesTable, _showSelectionCheckbox);
|
|
166442
|
+
__decorateElement(_init39, 4, "virtualized", _virtualized_dec, _DeesTable, _virtualized);
|
|
166443
|
+
__decorateElement(_init39, 4, "virtualOverscan", _virtualOverscan_dec, _DeesTable, _virtualOverscan);
|
|
166104
166444
|
__decorateElement(_init39, 4, "fixedHeight", _fixedHeight_dec, _DeesTable, _fixedHeight);
|
|
166105
166445
|
__decorateElement(_init39, 4, "searchMode", _searchMode_dec, _DeesTable, _searchMode);
|
|
166106
166446
|
__decorateElement(_init39, 4, "selectionMode", _selectionMode_dec, _DeesTable, _selectionMode);
|
|
166107
166447
|
__decorateElement(_init39, 4, "selectedIds", _selectedIds_dec, _DeesTable, _selectedIds);
|
|
166108
166448
|
__decorateElement(_init39, 4, "__focusedCell", ___focusedCell_dec, _DeesTable, ___focusedCell);
|
|
166109
166449
|
__decorateElement(_init39, 4, "__editingCell", ___editingCell_dec, _DeesTable, ___editingCell);
|
|
166450
|
+
__decorateElement(_init39, 4, "__floatingActive", ___floatingActive_dec, _DeesTable, ___floatingActive);
|
|
166451
|
+
__decorateElement(_init39, 4, "__virtualRange", ___virtualRange_dec, _DeesTable, ___virtualRange);
|
|
166110
166452
|
_DeesTable = __decorateElement(_init39, 0, "DeesTable", _DeesTable_decorators, _DeesTable);
|
|
166111
166453
|
__name(_DeesTable, "DeesTable");
|
|
166112
166454
|
__publicField(_DeesTable, "demo", demoFunc29);
|
|
@@ -199953,7 +200295,7 @@ init_group_runtime();
|
|
|
199953
200295
|
// ts_web/00_commitinfo_data.ts
|
|
199954
200296
|
var commitinfo = {
|
|
199955
200297
|
name: "@design.estate/dees-catalog",
|
|
199956
|
-
version: "3.
|
|
200298
|
+
version: "3.67.0",
|
|
199957
200299
|
description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
|
|
199958
200300
|
};
|
|
199959
200301
|
export {
|
|
@@ -201926,4 +202268,4 @@ ibantools/jsnext/ibantools.js:
|
|
|
201926
202268
|
* @preferred
|
|
201927
202269
|
*)
|
|
201928
202270
|
*/
|
|
201929
|
-
//# sourceMappingURL=bundle-
|
|
202271
|
+
//# sourceMappingURL=bundle-1775595907478.js.map
|