@design.estate/dees-catalog 3.63.0 → 3.64.0

package/dist_bundle/bundle.js

@@ -163996,6 +163996,7 @@ var tableStyles = [
       tbody tr {
         transition: background-color 0.15s ease;
         position: relative;
+        user-select: none;
       }
       
       /* Default horizontal lines (bottom border only) */
@@ -164549,7 +164550,7 @@ __name(compileLucenePredicate, "compileLucenePredicate");
 init_dist_ts30();
 init_dist_ts29();
 init_theme();
-var _selectedIds_dec, _selectionMode_dec, _searchMode_dec, _fixedHeight_dec, _showColumnFilters_dec, _columnFilters_dec, _filterText_dec, _sortBy_dec, _showGrid_dec, _showHorizontalLines_dec, _showVerticalLines_dec, _editableFields_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, _editableFields, _showVerticalLines, _showHorizontalLines, _showGrid, _sortBy, _filterText, _columnFilters, _showColumnFilters, _fixedHeight, _searchMode, _selectionMode, _selectedIds;
+var _selectedIds_dec, _selectionMode_dec, _searchMode_dec, _fixedHeight_dec, _showSelectionCheckbox_dec, _showColumnFilters_dec, _columnFilters_dec, _filterText_dec, _sortBy_dec, _showGrid_dec, _showHorizontalLines_dec, _showVerticalLines_dec, _editableFields_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, _editableFields, _showVerticalLines, _showHorizontalLines, _showGrid, _sortBy, _filterText, _columnFilters, _showColumnFilters, _showSelectionCheckbox, _fixedHeight, _searchMode, _selectionMode, _selectedIds;
 function ordinalLabel(n12) {
   const s10 = ["th", "st", "nd", "rd"];
   const v5 = n12 % 100;
@@ -164598,7 +164599,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
   type: Boolean,
   reflect: true,
   attribute: "show-grid"
-})], _sortBy_dec = [n5({ attribute: false })], _filterText_dec = [n5({ type: String })], _columnFilters_dec = [n5({ attribute: false })], _showColumnFilters_dec = [n5({ type: Boolean, attribute: "show-column-filters" })], _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 })], _a42) {
+})], _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 })], _a42) {
   constructor() {
     super();
     __privateAdd(this, _heading1, __runInitializers(_init39, 8, this, "heading 1")), __runInitializers(_init39, 11, this);
@@ -164629,26 +164630,84 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
     __privateAdd(this, _filterText, __runInitializers(_init39, 92, this, "")), __runInitializers(_init39, 95, this);
     __privateAdd(this, _columnFilters, __runInitializers(_init39, 96, this, {})), __runInitializers(_init39, 99, this);
     __privateAdd(this, _showColumnFilters, __runInitializers(_init39, 100, this, false)), __runInitializers(_init39, 103, this);
-    __privateAdd(this, _fixedHeight, __runInitializers(_init39, 104, this, false)), __runInitializers(_init39, 107, this);
-    __privateAdd(this, _searchMode, __runInitializers(_init39, 108, this, "table")), __runInitializers(_init39, 111, this);
+    __privateAdd(this, _showSelectionCheckbox, __runInitializers(_init39, 104, this, false)), __runInitializers(_init39, 107, this);
+    __privateAdd(this, _fixedHeight, __runInitializers(_init39, 108, this, false)), __runInitializers(_init39, 111, this);
+    __privateAdd(this, _searchMode, __runInitializers(_init39, 112, this, "table")), __runInitializers(_init39, 115, this);
     __publicField(this, "__searchTextSub");
     __publicField(this, "__searchModeSub");
-    __privateAdd(this, _selectionMode, __runInitializers(_init39, 112, this, "none")), __runInitializers(_init39, 115, this);
-    __privateAdd(this, _selectedIds, __runInitializers(_init39, 116, this, /* @__PURE__ */ new Set())), __runInitializers(_init39, 119, this);
+    __privateAdd(this, _selectionMode, __runInitializers(_init39, 116, this, "none")), __runInitializers(_init39, 119, this);
+    __privateAdd(this, _selectedIds, __runInitializers(_init39, 120, this, /* @__PURE__ */ new Set())), __runInitializers(_init39, 123, this);
     __publicField(this, "_rowIdMap", /* @__PURE__ */ new WeakMap());
     __publicField(this, "_rowIdCounter", 0);
+    /**
+     * Anchor row id for shift+click range selection. Set whenever the user
+     * makes a non-range click (plain or cmd/ctrl) so the next shift+click
+     * can compute a contiguous range from this anchor.
+     */
+    __publicField(this, "__selectionAnchorId");
+    /**
+     * Ctrl/Cmd+C copies the currently selected rows as a JSON array. Falls
+     * back to copying the focused-row (`selectedDataRow`) if no multi
+     * selection exists. No-op if a focused input/textarea would normally
+     * receive the copy.
+     */
+    __publicField(this, "__handleHostKeydown", /* @__PURE__ */ __name((eventArg) => {
+      const isCopy = (eventArg.metaKey || eventArg.ctrlKey) && (eventArg.key === "c" || eventArg.key === "C");
+      if (!isCopy) return;
+      const path2 = eventArg.composedPath?.() || [];
+      for (const t9 of path2) {
+        const tag = t9?.tagName;
+        if (tag === "INPUT" || tag === "TEXTAREA") return;
+        if (t9?.isContentEditable) return;
+      }
+      const rows = [];
+      if (this.selectedIds.size > 0) {
+        for (const r11 of this.data) if (this.selectedIds.has(this.getRowId(r11))) rows.push(r11);
+      } else if (this.selectedDataRow) {
+        rows.push(this.selectedDataRow);
+      }
+      if (rows.length === 0) return;
+      eventArg.preventDefault();
+      this.__writeRowsAsJson(rows);
+    }, "__handleHostKeydown"));
     // ─── Floating header (page-sticky) lifecycle ─────────────────────────
     __publicField(this, "__floatingResizeObserver");
     __publicField(this, "__floatingScrollHandler");
     __publicField(this, "__floatingActive", false);
     __publicField(this, "__scrollAncestors", []);
     __publicField(this, "__debounceTimer");
+    if (!this.hasAttribute("tabindex")) this.setAttribute("tabindex", "0");
+    this.addEventListener("keydown", this.__handleHostKeydown);
   }
   get value() {
     return this.data;
   }
   set value(_valueArg) {
   }
+  /**
+   * Copies the current selection as a JSON array. If `fallbackRow` is given
+   * and there is no multi-selection, that row is copied instead. Used both
+   * by the Ctrl/Cmd+C handler and by the default context-menu action.
+   */
+  copySelectionAsJson(fallbackRow) {
+    const rows = [];
+    if (this.selectedIds.size > 0) {
+      for (const r11 of this.data) if (this.selectedIds.has(this.getRowId(r11))) rows.push(r11);
+    } else if (fallbackRow) {
+      rows.push(fallbackRow);
+    } else if (this.selectedDataRow) {
+      rows.push(this.selectedDataRow);
+    }
+    if (rows.length === 0) return;
+    this.__writeRowsAsJson(rows);
+  }
+  __writeRowsAsJson(rows) {
+    try {
+      const json = JSON.stringify(rows, null, 2);
+      navigator.clipboard?.writeText(json);
+    } catch {
+    }
+  }
   render() {
     const usingColumns = Array.isArray(this.columns) && this.columns.length > 0;
     const effectiveColumns = usingColumns ? computeEffectiveColumns(this.columns, this.augmentFromDisplayFunction, this.displayFunction, this.data) : computeColumnsFromDisplayFunction(this.displayFunction, this.data);
@@ -164745,15 +164804,9 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
       }, "getTr");
       return b2`
                       <tr
-                        @click=${() => {
-        this.selectedDataRow = itemArg;
-        if (this.selectionMode === "single") {
-          const id = this.getRowId(itemArg);
-          this.selectedIds.clear();
-          this.selectedIds.add(id);
-          this.emitSelectionChange();
-          this.requestUpdate();
-        }
+                        @click=${(e11) => this.handleRowClick(e11, itemArg, rowIndex, viewData)}
+                        @mousedown=${(e11) => {
+        if (e11.shiftKey && this.selectionMode !== "single") e11.preventDefault();
       }}
                         @dragenter=${async (eventArg) => {
         eventArg.preventDefault();
@@ -164788,27 +164841,43 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
         }
       }}
                         @contextmenu=${async (eventArg) => {
-        DeesContextmenu.openContextMenuWithOptions(
-          eventArg,
-          this.getActionsForType("contextmenu").map((action) => {
-            const menuItem = {
-              name: action.name,
-              iconName: action.iconName,
-              action: /* @__PURE__ */ __name(async () => {
-                await action.actionFunc({
-                  item: itemArg,
-                  table: this
-                });
-                return null;
-              }, "action")
-            };
-            return menuItem;
-          })
-        );
+        if (!this.isRowSelected(itemArg)) {
+          this.selectedDataRow = itemArg;
+          this.selectedIds.clear();
+          this.selectedIds.add(this.getRowId(itemArg));
+          this.__selectionAnchorId = this.getRowId(itemArg);
+          this.emitSelectionChange();
+          this.requestUpdate();
+        }
+        const userItems = this.getActionsForType("contextmenu").map((action) => ({
+          name: action.name,
+          iconName: action.iconName,
+          action: /* @__PURE__ */ __name(async () => {
+            await action.actionFunc({
+              item: itemArg,
+              table: this
+            });
+            return null;
+          }, "action")
+        }));
+        const defaultItems = [
+          {
+            name: this.selectedIds.size > 1 ? `Copy ${this.selectedIds.size} rows as JSON` : "Copy row as JSON",
+            iconName: "lucide:Copy",
+            action: /* @__PURE__ */ __name(async () => {
+              this.copySelectionAsJson(itemArg);
+              return null;
+            }, "action")
+          }
+        ];
+        DeesContextmenu.openContextMenuWithOptions(eventArg, [
+          ...userItems,
+          ...defaultItems
+        ]);
       }}
-                        class="${itemArg === this.selectedDataRow ? "selected" : ""}"
+                        class="${itemArg === this.selectedDataRow || this.isRowSelected(itemArg) ? "selected" : ""}"
                       >
-                        ${this.selectionMode !== "none" ? b2`<td style="width:42px; text-align:center;">
+                        ${this.showSelectionCheckbox ? b2`<td style="width:42px; text-align:center;">
                               <dees-input-checkbox
                                 .value=${this.isRowSelected(itemArg)}
                                 @newValue=${(e11) => {
@@ -164915,7 +164984,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
   renderHeaderRows(effectiveColumns) {
     return b2`
       <tr>
-        ${this.selectionMode !== "none" ? b2`
+        ${this.showSelectionCheckbox ? b2`
               <th style="width:42px; text-align:center;">
                 ${this.selectionMode === "multi" ? b2`
                       <dees-input-checkbox
@@ -164947,7 +165016,7 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
         ${this.dataActions && this.dataActions.length > 0 ? b2`<th class="actionsCol">Actions</th>` : b2``}
       </tr>
       ${this.showColumnFilters ? b2`<tr class="filtersRow">
-            ${this.selectionMode !== "none" ? b2`<th style="width:42px;"></th>` : b2``}
+            ${this.showSelectionCheckbox ? b2`<th style="width:42px;"></th>` : b2``}
             ${effectiveColumns.filter((c11) => !c11.hidden).map((col) => {
       const key2 = String(col.key);
       if (col.filterable === false) return b2`<th></th>`;
@@ -165571,6 +165640,64 @@ var _DeesTable = class _DeesTable extends (_a42 = DeesElement, _heading1_dec = [
     this.emitSelectionChange();
     this.requestUpdate();
   }
+  /**
+   * Handles row clicks with file-manager style selection semantics:
+   *  - plain click: select only this row, set anchor
+   *  - cmd/ctrl+click: toggle this row in/out, set anchor
+   *  - shift+click: select the contiguous range from the anchor to this row
+   *
+   * Multi-row click selection is always available (`selectionMode === 'none'`
+   * and `'multi'` both behave this way) so consumers can always copy a set
+   * of rows. Only `selectionMode === 'single'` restricts to one row.
+   */
+  handleRowClick(eventArg, item, rowIndex, view) {
+    const id = this.getRowId(item);
+    if (this.selectionMode === "single") {
+      this.selectedDataRow = item;
+      this.selectedIds.clear();
+      this.selectedIds.add(id);
+      this.__selectionAnchorId = id;
+      this.emitSelectionChange();
+      this.requestUpdate();
+      return;
+    }
+    const isToggle = eventArg.metaKey || eventArg.ctrlKey;
+    const isRange = eventArg.shiftKey;
+    if (isRange && this.__selectionAnchorId !== void 0) {
+      window.getSelection?.()?.removeAllRanges();
+      const anchorIdx = view.findIndex((r11) => this.getRowId(r11) === this.__selectionAnchorId);
+      if (anchorIdx >= 0) {
+        const [a5, b5] = anchorIdx <= rowIndex ? [anchorIdx, rowIndex] : [rowIndex, anchorIdx];
+        this.selectedIds.clear();
+        for (let i11 = a5; i11 <= b5; i11++) this.selectedIds.add(this.getRowId(view[i11]));
+      } else {
+        this.selectedIds.clear();
+        this.selectedIds.add(id);
+        this.__selectionAnchorId = id;
+      }
+      this.selectedDataRow = item;
+    } else if (isToggle) {
+      const wasSelected = this.selectedIds.has(id);
+      if (wasSelected) {
+        this.selectedIds.delete(id);
+        if (this.selectedDataRow === item) {
+          const remaining = view.find((r11) => this.selectedIds.has(this.getRowId(r11)));
+          this.selectedDataRow = remaining;
+        }
+      } else {
+        this.selectedIds.add(id);
+        this.selectedDataRow = item;
+      }
+      this.__selectionAnchorId = id;
+    } else {
+      this.selectedDataRow = item;
+      this.selectedIds.clear();
+      this.selectedIds.add(id);
+      this.__selectionAnchorId = id;
+    }
+    this.emitSelectionChange();
+    this.requestUpdate();
+  }
   setRowSelected(row, checked) {
     const id = this.getRowId(row);
     if (this.selectionMode === "single") {
@@ -165687,6 +165814,7 @@ _sortBy = new WeakMap();
 _filterText = new WeakMap();
 _columnFilters = new WeakMap();
 _showColumnFilters = new WeakMap();
+_showSelectionCheckbox = new WeakMap();
 _fixedHeight = new WeakMap();
 _searchMode = new WeakMap();
 _selectionMode = new WeakMap();
@@ -165715,6 +165843,7 @@ __decorateElement(_init39, 4, "sortBy", _sortBy_dec, _DeesTable, _sortBy);
 __decorateElement(_init39, 4, "filterText", _filterText_dec, _DeesTable, _filterText);
 __decorateElement(_init39, 4, "columnFilters", _columnFilters_dec, _DeesTable, _columnFilters);
 __decorateElement(_init39, 4, "showColumnFilters", _showColumnFilters_dec, _DeesTable, _showColumnFilters);
+__decorateElement(_init39, 4, "showSelectionCheckbox", _showSelectionCheckbox_dec, _DeesTable, _showSelectionCheckbox);
 __decorateElement(_init39, 4, "fixedHeight", _fixedHeight_dec, _DeesTable, _fixedHeight);
 __decorateElement(_init39, 4, "searchMode", _searchMode_dec, _DeesTable, _searchMode);
 __decorateElement(_init39, 4, "selectionMode", _selectionMode_dec, _DeesTable, _selectionMode);
@@ -199565,7 +199694,7 @@ init_group_runtime();
 // ts_web/00_commitinfo_data.ts
 var commitinfo = {
   name: "@design.estate/dees-catalog",
-  version: "3.63.0",
+  version: "3.64.0",
   description: "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript."
 };
 export {
@@ -201538,4 +201667,4 @@ ibantools/jsnext/ibantools.js:
    * @preferred
    *)
 */
-//# sourceMappingURL=bundle-1775570157836.js.map
+//# sourceMappingURL=bundle-1775572474370.js.map

package/dist_ts_web/00_commitinfo_data.js

@@ -3,7 +3,7 @@
  */
 export const commitinfo = {
     name: '@design.estate/dees-catalog',
-    version: '3.63.0',
+    version: '3.64.0',
     description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 };
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMDBfY29tbWl0aW5mb19kYXRhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vdHNfd2ViLzAwX2NvbW1pdGluZm9fZGF0YS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRztJQUN4QixJQUFJLEVBQUUsNkJBQTZCO0lBQ25DLE9BQU8sRUFBRSxRQUFRO0lBQ2pCLFdBQVcsRUFBRSxzSkFBc0o7Q0FDcEssQ0FBQSJ9

package/dist_ts_web/elements/00group-dataview/dees-table/dees-table.d.ts

@@ -56,6 +56,12 @@ export declare class DeesTable<T> extends DeesElement {
     accessor filterText: string;
     accessor columnFilters: Record<string, string>;
     accessor showColumnFilters: boolean;
+    /**
+     * When true, the table renders a leftmost checkbox column for click-driven
+     * (de)selection. Row selection by mouse (plain/shift/ctrl click) is always
+     * available regardless of this flag.
+     */
+    accessor showSelectionCheckbox: boolean;
     /**
      * When set, the table renders inside a fixed-height scroll container
      * (`max-height: var(--table-max-height, 360px)`) and the header sticks
@@ -73,7 +79,27 @@ export declare class DeesTable<T> extends DeesElement {
     accessor selectedIds: Set<string>;
     private _rowIdMap;
     private _rowIdCounter;
+    /**
+     * Anchor row id for shift+click range selection. Set whenever the user
+     * makes a non-range click (plain or cmd/ctrl) so the next shift+click
+     * can compute a contiguous range from this anchor.
+     */
+    private __selectionAnchorId?;
     constructor();
+    /**
+     * Ctrl/Cmd+C copies the currently selected rows as a JSON array. Falls
+     * back to copying the focused-row (`selectedDataRow`) if no multi
+     * selection exists. No-op if a focused input/textarea would normally
+     * receive the copy.
+     */
+    private __handleHostKeydown;
+    /**
+     * Copies the current selection as a JSON array. If `fallbackRow` is given
+     * and there is no multi-selection, that row is copied instead. Used both
+     * by the Ctrl/Cmd+C handler and by the default context-menu action.
+     */
+    copySelectionAsJson(fallbackRow?: T): void;
+    private __writeRowsAsJson;
     static styles: import("@design.estate/dees-element").CSSResult[];
     render(): TemplateResult;
     /**
@@ -182,6 +208,17 @@ export declare class DeesTable<T> extends DeesElement {
     private getRowId;
     private isRowSelected;
     private toggleRowSelected;
+    /**
+     * Handles row clicks with file-manager style selection semantics:
+     *  - plain click: select only this row, set anchor
+     *  - cmd/ctrl+click: toggle this row in/out, set anchor
+     *  - shift+click: select the contiguous range from the anchor to this row
+     *
+     * Multi-row click selection is always available (`selectionMode === 'none'`
+     * and `'multi'` both behave this way) so consumers can always copy a set
+     * of rows. Only `selectionMode === 'single'` restricts to one row.
+     */
+    private handleRowClick;
     private setRowSelected;
     private areAllVisibleSelected;
     private isVisibleSelectionIndeterminate;