@ixfx/components 0.17.1 → 0.18.1

package/dist/ac-text.js

@@ -1,5 +1,5 @@
 import { r as clearHighlights, t as applyHighlights } from "./highlight-noLHFSKZ.js";
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { n as tickledStyles } from "./tickled-styles-pnieYweS.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { t as popupSurfaceStyles } from "./popup-D8IxN1Eq.js";

package/dist/ac-token.js

@@ -1,6 +1,6 @@
 import { t as DataController } from "./data-controller-q-rXRMzJ.js";
-import { h as createAcCompletionProvider } from "./incr-search-C5114RxZ.js";
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { h as createAcCompletionProvider } from "./incr-search-Bk4acsCM.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-pnieYweS.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-Dxs8sFX8.js";

package/dist/{checked-select-BmwqpgGr.js → checked-select-CC-qSO1P.js}

@@ -1,6 +1,6 @@
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-pnieYweS.js";
-import "./interaction-8Kbbf6xN.js";
+import "./interaction-DNuFnTm0.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { t as handleStyles } from "./handle-BVUWv97X.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-Dxs8sFX8.js";

package/dist/checked-select.js

@@ -1,2 +1,2 @@
 import "./checkbox.js";
-export { t as CheckedSelect } from "./checked-select-BmwqpgGr.js";
+export { t as CheckedSelect } from "./checked-select-CC-qSO1P.js";

package/dist/{crumb-navigation-D7dAC0H-.js → crumb-navigation-C78edQGt.js}

@@ -1,11 +1,11 @@
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-pnieYweS.js";
 import { t as collectDataResult } from "./data-provider-C6ZNAcaT.js";
-import "./interaction-8Kbbf6xN.js";
+import "./interaction-DNuFnTm0.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { t as scrollFadeStyles } from "./scroll-fade-DH8OXSqL.js";
 import { n as safeCustomElement, t as __decorate } from "./decorate-Dxs8sFX8.js";
-import "./menu-item-BSxhlWnW.js";
+import "./menu-item-CbywH4Xo.js";
 import { t as ViewStateController } from "./view-state-controller-DiPAPiA7.js";
 import "./narrowed-text.js";
 import { LitElement, css, html, nothing } from "lit";

package/dist/{crumb-navigation-Tm4fnsvN.d.ts → crumb-navigation-DOfOS7li.d.ts}

@@ -1,4 +1,4 @@
-import { M as TreeDataModel, a as TreeComponent, j as TreeTickleEvent, k as TreeSelectEvent, n as TreeActivateEvent, o as TreeComponentEventMap, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-DNuzfo6R.js";
+import { M as TreeDataModel, a as TreeComponent, j as TreeTickleEvent, k as TreeSelectEvent, n as TreeActivateEvent, o as TreeComponentEventMap, x as TreeItemClickEvent, y as TreeExpandEvent } from "./tree-component-BE7OEIiH.js";
 import { n as TreeExclusivity, o as TreeNode, r as TreeFilterPredicate, s as TreeSelectionFilter, t as LoadChildrenCallback } from "./types-6hpXRKt7.js";
 import { a as ViewStateBase, t as GetViewStateOptions } from "./types-16GC5k1z.js";
 import "./index-Cdcek1Oj.js";

package/dist/crumbs.d.ts

@@ -1,2 +1,2 @@
-import { a as CrumbNavigationExpandDetail, c as CrumbNavigationItemClickEvent, i as CrumbNavigationElementEventMap, l as CrumbNavigationViewState, n as CrumbNavigationChangeEvent, o as CrumbNavigationExpandEvent, r as CrumbNavigationElement, s as CrumbNavigationItemClickDetail, t as CrumbNavigationChangeDetail } from "./crumb-navigation-Tm4fnsvN.js";
+import { a as CrumbNavigationExpandDetail, c as CrumbNavigationItemClickEvent, i as CrumbNavigationElementEventMap, l as CrumbNavigationViewState, n as CrumbNavigationChangeEvent, o as CrumbNavigationExpandEvent, r as CrumbNavigationElement, s as CrumbNavigationItemClickDetail, t as CrumbNavigationChangeDetail } from "./crumb-navigation-DOfOS7li.js";
 export { CrumbNavigationChangeDetail, CrumbNavigationChangeEvent, CrumbNavigationElement, CrumbNavigationElementEventMap, CrumbNavigationExpandDetail, CrumbNavigationExpandEvent, CrumbNavigationItemClickDetail, CrumbNavigationItemClickEvent, type CrumbNavigationViewState };

package/dist/crumbs.js

@@ -1 +1 @@
-export { t as CrumbNavigationElement } from "./crumb-navigation-D7dAC0H-.js";
+export { t as CrumbNavigationElement } from "./crumb-navigation-C78edQGt.js";

package/dist/{data-grid-vasJtjFP.d.ts → data-grid-BYMZZbNc.d.ts}

@@ -1,9 +1,10 @@
-import { L as ListDragPreviewRenderer, R as ListDragPreviewSourceResolver, V as ListNativeDragStartEvent } from "./tree-component-DNuzfo6R.js";
-import { m as ListSelectKeysDetail, u as ListSelectIntentDetail } from "./list-selection-types-CKTt7Rrw.js";
+import { i as ItemTagKeys, n as ItemTagBehaviour } from "./item-tags-Dz-jQq-4.js";
+import { H as ListNativeDragStartEvent, P as ListDragDataTransferWriter, R as ListDragPreviewRenderer, z as ListDragPreviewSourceResolver } from "./tree-component-BE7OEIiH.js";
 import { a as ViewStateBase, t as GetViewStateOptions } from "./types-16GC5k1z.js";
+import { m as ListSelectKeysDetail, u as ListSelectIntentDetail } from "./list-selection-types-CKTt7Rrw.js";
 import { n as ListViewportChangeEvent, t as ListViewportChangeDetail } from "./list-viewport-types-BJ8c6qur.js";
 import "./index-Cdcek1Oj.js";
-import { S as ListSearchController } from "./index-CRLTVAyt.js";
+import { S as ListSearchController } from "./index-BuvySJEc.js";
 import "./icon-Bhz0c6Yf.js";
 import "./index-0smh4WCH.js";
 import "./pan-text-DKe2zinH.js";
@@ -273,6 +274,12 @@ declare class DataGridElement extends LitElement {
    * built-in HTML+canvas preview.
    */
   dragPreviewRenderer: ListDragPreviewRenderer<unknown> | undefined;
+  /**
+   * Write an application payload onto the drag's `DataTransfer` (e.g. a custom
+   * MIME type). Called once per drag, synchronously inside `dragstart`, after a
+   * non-cancelled `list-native-drag-start`.
+   */
+  writeDataTransfer: ListDragDataTransferWriter<unknown> | undefined;
   dragPreviewSource: ListDragPreviewSourceResolver<unknown> | undefined;
   /**
    * Default icon name for column header buttons. Defaults to `ellipsis`.
@@ -356,6 +363,28 @@ declare class DataGridElement extends LitElement {
    */
   get partialKeys(): ReadonlySet<string>;
   set partialKeys(keys: Iterable<string>);
+  /**
+   * Caller-assigned tags for a row (`undefined` ⇒ none). Each tag is exposed on
+   * the row as a `tag-<name>` `part` token (`::part(item tag-foo)`) and in
+   * `data-tags` (`[data-tags~="foo"]`); `tagBehaviour` can switch off selection,
+   * focus, drag or search per tag. `index` is the row's position in the sorted
+   * order. Re-read on every render; call {@link refreshTags} after mutating
+   * data the hook reads.
+   */
+  tags: ((row: unknown, index: number) => readonly string[] | undefined) | undefined;
+  /** Tags by row key, apart from the row data (like {@link partialKeys}): tag name → keys. Merged with the `tags` hook. */
+  get tagKeys(): ItemTagKeys | undefined;
+  set tagKeys(value: ItemTagKeys | undefined);
+  /**
+   * Interaction flags per tag name: `selectable`, `focusable`, `draggable`,
+   * `searchable` (`false` switches one off; omitted keeps the default). With
+   * several tags the most restrictive wins. Rows stay rendered and keep their
+   * place in layout and scroll.
+   */
+  get tagBehaviour(): ItemTagBehaviour | undefined;
+  set tagBehaviour(value: ItemTagBehaviour | undefined);
+  /** Re-evaluate tags and re-render (the `tags` hook is read live; this drops cached cursor state). */
+  refreshTags(): void;
   /** Replace the selection with these row keys (clamped to known rows). */
   set selectedKeys(keys: Iterable<string>);
   /**

package/dist/{data-grid-BcO3SMac.js → data-grid-CJrbLzLr.js}

@@ -1,9 +1,9 @@
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { n as tickledStyles, t as tickledItemStyles } from "./tickled-styles-pnieYweS.js";
 import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-FRO3TRFI.js";
-import { i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES } from "./incr-search-C5114RxZ.js";
-import "./interaction-8Kbbf6xN.js";
-import { a as listItemFadeKeyframes, t as ListNativeDragController } from "./list-native-drag-controller-ByftBooJ.js";
+import { i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES } from "./incr-search-Bk4acsCM.js";
+import "./interaction-DNuFnTm0.js";
+import { a as listItemFadeKeyframes, d as ItemTagResolver, g as sameTagKeys, t as ListNativeDragController, v as tagPartTokens, y as tagsAttribute } from "./list-native-drag-controller-B_INa6_G.js";
 import { i as sameKeySet, r as isPartialKey, t as PARTIAL_DESCRIPTION } from "./partial-keys-D4l_ede_.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { a as capKeys, l as keysToArray, n as EMPTY_KEYS, o as flagsFromRecord, r as MAX_PENDING_KEYS } from "./pending-Afl4LT64.js";
@@ -13,12 +13,13 @@ import { n as safeCustomElement, t as __decorate } from "./decorate-Dxs8sFX8.js"
 import { n as anchorFromRow, o as scrollToOffset, t as ViewStateController } from "./view-state-controller-DiPAPiA7.js";
 import { t as createDragGhost } from "./drag-ghost-DNWu_RyN.js";
 import "./icon-DvTQuylG.js";
-import "./menu-C3DhTjHx.js";
+import "./menu-CgT60B3-.js";
 import "./pan-text-DrJYKQKN.js";
 import { LitElement, css, html, nothing } from "lit";
 import { property, query, state } from "lit/decorators.js";
 import { createCommandRegistry } from "@clinth/ui-commands";
 import { repeat } from "lit/directives/repeat.js";
+import { ifDefined } from "lit/directives/if-defined.js";
 // src/data-grid/data-grid-view-state.ts
 const EMPTY_COLUMNS = /* @__PURE__ */ new Map();
 const EMPTY_ORDER = /* @__PURE__ */ new Map();
@@ -317,10 +318,18 @@ let DataGridElement = class DataGridElement extends LitElement {
 		this._lastClickedCell = null;
 		this._editValue = ``;
 		this._tickled = new TickledController(this, {
-			getItems: () => this.#tickledItems ??= this._flat.map((f) => ({
-				id: f.key,
-				enabled: f.type === `row`
-			})),
+			getItems: () => this.#tickledItems ??= this._flat.map((f) => {
+				if (f.type !== `row`) return {
+					id: f.key,
+					enabled: false
+				};
+				const flags = this.#flagsForEntry(f);
+				return {
+					id: f.key,
+					enabled: flags.selectable,
+					focusable: flags.focusable
+				};
+			}),
 			onStateChange: () => this.requestUpdate(),
 			hoverDisabled: () => this.#nativeDrag.isDragging
 		});
@@ -417,6 +426,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 			});
 		};
 		this._partialKeys = /* @__PURE__ */ new Set();
+		this.#tagResolver = new ItemTagResolver();
 		this._onKeyDown = (e) => {
 			const before = this._tickled.tickledId;
 			this.#handleKeyDown(e);
@@ -657,7 +667,8 @@ let DataGridElement = class DataGridElement extends LitElement {
 	#nativeDrag;
 	#prepareNativeDrag(originKey) {
 		const rows = this._flat.filter((f) => f.type === `row`);
-		if (!rows.some((f) => f.key === originKey)) return void 0;
+		const originEntry = rows.find((f) => f.key === originKey);
+		if (!originEntry || !this.#flagsForEntry(originEntry).draggable || !this.#flagsForEntry(originEntry).selectable) return void 0;
 		if (!this._selectedKeys.has(originKey)) this._replaceSelection(originKey);
 		const selected = [];
 		let displayIndex = 0;
@@ -719,7 +730,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 			getItems: () => {
 				this.#searchKeyByRow.clear();
 				this._sortedRows.forEach((r, i) => this.#searchKeyByRow.set(r, this.getRowKey(r, i)));
-				return this._sortedRows;
+				return this.tagBehaviour === void 0 ? this._sortedRows : this._sortedRows.filter((r, i) => this.#flagsFor(this.#searchKeyByRow.get(r), r, i).searchable);
 			},
 			getLabel: (row) => this.#rowSearchText(row),
 			getKey: (row) => this.#searchKeyByRow.get(row) ?? String(this._sortedRows.indexOf(row)),
@@ -1170,7 +1181,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 	}
 	/** Select only `key`. In `manual` mode (or when cancelled) only the anchor moves. */
 	#requestReplace(key, source) {
-		if (this.selectionMode === `none`) return;
+		if (this.selectionMode === `none` || !this.#canSelectKey(key)) return;
 		if (this.#intercepted({
 			kind: `replace`,
 			keys: [key],
@@ -1183,6 +1194,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 	}
 	/** Flip `key`. `applyInManual`: Space has always toggled in `manual` mode. */
 	#requestToggle(key, source, applyInManual = false) {
+		if (!this.#canSelectKey(key)) return;
 		if (this.#intercepted({
 			kind: `toggle`,
 			keys: [key],
@@ -1193,7 +1205,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 	}
 	/** Extend the range from the anchor to `key`. */
 	#requestExtend(key, source) {
-		if (this.selectionMode === `none`) return;
+		if (this.selectionMode === `none` || !this.#canSelectKey(key)) return;
 		const range = this._anchorKey === void 0 ? void 0 : this.#rangeKeys(key);
 		if (this.#intercepted({
 			kind: `extend`,
@@ -1211,7 +1223,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 	/** Row keys between the anchor and `key` (inclusive), or `undefined` when the range degrades to a replace. */
 	#rangeKeys(key) {
 		if (!this._anchorKey) return void 0;
-		let keys = this._flat.filter((f) => f.type === `row`).map((f) => f.key);
+		let keys = this._flat.filter((f) => f.type === `row` && this.#flagsForEntry(f).selectable).map((f) => f.key);
 		if (this.groupBy && !this.crossGroupSelection) {
 			const group = this._getGroupKey(this._getRowForKey(this._anchorKey) ?? { key: this._anchorKey });
 			if (group !== this._getGroupKey(this._getRowForKey(key) ?? { key })) return void 0;
@@ -1381,6 +1393,50 @@ let DataGridElement = class DataGridElement extends LitElement {
 		const next = new Set(keys);
 		if (!sameKeySet(next, this._partialKeys)) this._partialKeys = next;
 	}
+	#tagResolver;
+	/** Tags by row key, apart from the row data (like {@link partialKeys}): tag name → keys. Merged with the `tags` hook. */
+	get tagKeys() {
+		return this.#tagResolver.tagKeys;
+	}
+	set tagKeys(value) {
+		if (sameTagKeys(value, this.#tagResolver.tagKeys)) return;
+		this.#tagResolver.tagKeys = value;
+		this.refreshTags();
+	}
+	/**
+	* Interaction flags per tag name: `selectable`, `focusable`, `draggable`,
+	* `searchable` (`false` switches one off; omitted keeps the default). With
+	* several tags the most restrictive wins. Rows stay rendered and keep their
+	* place in layout and scroll.
+	*/
+	get tagBehaviour() {
+		return this.#tagResolver.behaviour;
+	}
+	set tagBehaviour(value) {
+		if (value === this.#tagResolver.behaviour) return;
+		this.#tagResolver.behaviour = value;
+		this.refreshTags();
+	}
+	/** Re-evaluate tags and re-render (the `tags` hook is read live; this drops cached cursor state). */
+	refreshTags() {
+		this.#tickledItems = void 0;
+		this.requestUpdate();
+	}
+	#tagsFor(key, row, index) {
+		return this.#tagResolver.tagsFor(key, this.tags?.(row, index));
+	}
+	#flagsFor(key, row, index) {
+		if (this.tags === void 0 && this.#tagResolver.tagKeys === void 0) return this.#tagResolver.flagsFor([]);
+		return this.#tagResolver.flagsFor(this.#tagsFor(key, row, index));
+	}
+	#flagsForEntry(entry) {
+		return this.#flagsFor(entry.key, entry.row, entry.idx);
+	}
+	#canSelectKey(key) {
+		if (this.tags === void 0 && this.#tagResolver.tagKeys === void 0) return true;
+		const entry = this.#rowEntry(key);
+		return entry === void 0 || this.#flagsFor(key, entry.row, entry.idx).selectable;
+	}
 	/** Replace the selection with these row keys (clamped to known rows). */
 	set selectedKeys(keys) {
 		this.selectKeys(keys);
@@ -1393,7 +1449,7 @@ let DataGridElement = class DataGridElement extends LitElement {
 	*/
 	selectKeys(keys) {
 		this.#pendingSelected = EMPTY_KEYS;
-		let next = new Set([...keys].filter((k) => this._getRowForKey(k) !== void 0));
+		let next = new Set([...keys].filter((k) => this._getRowForKey(k) !== void 0 && this.#canSelectKey(k)));
 		if (this.selectionMode === `none`) next = /* @__PURE__ */ new Set();
 		else if (!this.#isMultiSelect() && next.size > 1) {
 			const last = [...next].at(-1);
@@ -1541,8 +1597,8 @@ let DataGridElement = class DataGridElement extends LitElement {
 					source: `keyboard`
 				})) return;
 				const prev = new Set(this._selectedKeys);
-				if (group !== void 0) this._selectedKeys = new Set(this._flat.filter((f) => f.type === `row` && this._getGroupKey(f.row) === group).map((f) => f.key));
-				else this._selectedKeys = new Set(this._flat.filter((f) => f.type === `row`).map((f) => f.key));
+				if (group !== void 0) this._selectedKeys = new Set(this._flat.filter((f) => f.type === `row` && this.#flagsForEntry(f).selectable && this._getGroupKey(f.row) === group).map((f) => f.key));
+				else this._selectedKeys = new Set(this._flat.filter((f) => f.type === `row` && this.#flagsForEntry(f).selectable).map((f) => f.key));
 				this.#dispatchSelect(prev);
 			}
 			return;
@@ -2299,11 +2355,15 @@ let DataGridElement = class DataGridElement extends LitElement {
 			const selected = this._selectedKeys.has(rowKey);
 			const partial = isPartialKey(rowKey, this._partialKeys, selected);
 			const tickled = this._tickled.isTickled(rowKey);
+			const rowTags = this.#tagsFor(rowKey, row, absIdx2);
+			const rowFlags = this.#tagResolver.flagsFor(rowTags);
 			return html`
                 <div class="row item ${selected ? `selected` : ``} ${partial ? `partial` : ``} ${tickled ? `tickled` : ``} ${this.zebraStripes && absIdx2 % 2 === 1 ? `zebra-odd` : ``} ${this.#enteringRowKeys.has(rowKey) ? `entering` : ``} ${this.#nativeDragging && rowKey === this.#dragOriginKey ? `dragging-origin` : ``}" role="row" aria-rowindex=${absIdx + 2} aria-selected=${selected ? `true` : `false`} aria-description=${partial ? PARTIAL_DESCRIPTION : nothing} style="top:${absIdx * rh}px; height:${rh}px"
                   data-key=${rowKey}
+                  part="item${tagPartTokens(rowTags)}"
+                  data-tags=${ifDefined(tagsAttribute(rowTags))}
                   ?data-partial=${partial}
-                  draggable=${this.#nativeDrag.draggableAttr}
+                  draggable=${rowFlags.draggable && rowFlags.selectable ? this.#nativeDrag.draggableAttr : `false`}
                   @click=${(e) => {
 				this._onRowClick(rowKey, null, e);
 				this.dispatchEvent(new CustomEvent(`datagrid-cell-click`, {
@@ -2596,6 +2656,7 @@ __decorate([property({
 	reflect: true
 })], DataGridElement.prototype, "itemsDraggable", void 0);
 __decorate([property({ attribute: false })], DataGridElement.prototype, "dragPreviewRenderer", void 0);
+__decorate([property({ attribute: false })], DataGridElement.prototype, "writeDataTransfer", void 0);
 __decorate([property({ attribute: false })], DataGridElement.prototype, "dragPreviewSource", void 0);
 __decorate([property({
 	type: String,
@@ -2615,5 +2676,6 @@ __decorate([state()], DataGridElement.prototype, "_editValue", void 0);
 __decorate([query(`.viewport`)], DataGridElement.prototype, "_viewportEl", void 0);
 __decorate([query(`.header-row`)], DataGridElement.prototype, "_headerRowEl", void 0);
 __decorate([state()], DataGridElement.prototype, "_partialKeys", void 0);
+__decorate([property({ attribute: false })], DataGridElement.prototype, "tags", void 0);
 DataGridElement = __decorate([safeCustomElement(`ixfx-data-grid`)], DataGridElement);
 export { DataGridElement as t };

package/dist/data-grid.d.ts

@@ -1,3 +1,3 @@
-import { B as ListNativeDragStartDetail, F as ListDragPreview, I as ListDragPreviewContext, L as ListDragPreviewRenderer, P as ListDragEntry, V as ListNativeDragStartEvent, z as ListDragSource } from "./tree-component-DNuzfo6R.js";
-import { A as DataGridColumn, B as DataGridInteractionMode, C as DataGridSortEvent, D as DataGridViewState, E as DataGridColumnViewState, F as DataGridEditorFactory, G as GlobalFormatter, H as DataGridSelectionMode, I as DataGridEditorType, L as DataGridGetRowKey, M as DataGridDataType, N as DataGridEditability, O as BuiltInFormatterName, P as DataGridEditorContext, R as DataGridGroupBy, S as DataGridSortDetail, T as DataGridViewportChangeEvent, U as DataGridSortDirection, V as DataGridRowLook, W as DataGridSortState, _ as DataGridRowActivateDetail, a as DataGridColumnReorderDetail, b as DataGridSelectEvent, c as DataGridColumnResizeEvent, d as DataGridElement, f as DataGridElementEventMap, g as DataGridListSelectEvent, h as DataGridListSelectDetail, i as DataGridCellEditEvent, j as DataGridColumnMenu, k as BuiltInFormatterOptions, l as DataGridColumnVisibilityDetail, m as DataGridGroupChangeEvent, n as DataGridCellClickEvent, o as DataGridColumnReorderEvent, p as DataGridGroupChangeDetail, r as DataGridCellEditDetail, s as DataGridColumnResizeDetail, t as DataGridCellClickDetail, u as DataGridColumnVisibilityEvent, v as DataGridRowActivateEvent, w as DataGridViewportChangeDetail, x as DataGridSelectIntentEvent, y as DataGridSelectDetail, z as DataGridGroupLabel } from "./data-grid-vasJtjFP.js";
+import { B as ListDragSource, F as ListDragEntry, H as ListNativeDragStartEvent, I as ListDragPreview, L as ListDragPreviewContext, R as ListDragPreviewRenderer, V as ListNativeDragStartDetail } from "./tree-component-BE7OEIiH.js";
+import { A as DataGridColumn, B as DataGridInteractionMode, C as DataGridSortEvent, D as DataGridViewState, E as DataGridColumnViewState, F as DataGridEditorFactory, G as GlobalFormatter, H as DataGridSelectionMode, I as DataGridEditorType, L as DataGridGetRowKey, M as DataGridDataType, N as DataGridEditability, O as BuiltInFormatterName, P as DataGridEditorContext, R as DataGridGroupBy, S as DataGridSortDetail, T as DataGridViewportChangeEvent, U as DataGridSortDirection, V as DataGridRowLook, W as DataGridSortState, _ as DataGridRowActivateDetail, a as DataGridColumnReorderDetail, b as DataGridSelectEvent, c as DataGridColumnResizeEvent, d as DataGridElement, f as DataGridElementEventMap, g as DataGridListSelectEvent, h as DataGridListSelectDetail, i as DataGridCellEditEvent, j as DataGridColumnMenu, k as BuiltInFormatterOptions, l as DataGridColumnVisibilityDetail, m as DataGridGroupChangeEvent, n as DataGridCellClickEvent, o as DataGridColumnReorderEvent, p as DataGridGroupChangeDetail, r as DataGridCellEditDetail, s as DataGridColumnResizeDetail, t as DataGridCellClickDetail, u as DataGridColumnVisibilityEvent, v as DataGridRowActivateEvent, w as DataGridViewportChangeDetail, x as DataGridSelectIntentEvent, y as DataGridSelectDetail, z as DataGridGroupLabel } from "./data-grid-BYMZZbNc.js";
 export { type BuiltInFormatterName, type BuiltInFormatterOptions, DataGridCellClickDetail, DataGridCellClickEvent, DataGridCellEditDetail, DataGridCellEditEvent, type DataGridColumn, type DataGridColumnMenu, DataGridColumnReorderDetail, DataGridColumnReorderEvent, DataGridColumnResizeDetail, DataGridColumnResizeEvent, type DataGridColumnViewState, DataGridColumnVisibilityDetail, DataGridColumnVisibilityEvent, type DataGridDataType, type DataGridEditability, type DataGridEditorContext, type DataGridEditorFactory, type DataGridEditorType, DataGridElement, DataGridElementEventMap, type DataGridGetRowKey, type DataGridGroupBy, DataGridGroupChangeDetail, DataGridGroupChangeEvent, type DataGridGroupLabel, type DataGridInteractionMode, DataGridListSelectDetail, DataGridListSelectEvent, DataGridRowActivateDetail, DataGridRowActivateEvent, type DataGridRowLook, DataGridSelectDetail, DataGridSelectEvent, DataGridSelectIntentEvent, type DataGridSelectionMode, DataGridSortDetail, type DataGridSortDirection, DataGridSortEvent, type DataGridSortState, type DataGridViewState, DataGridViewportChangeDetail, DataGridViewportChangeEvent, type GlobalFormatter, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListNativeDragStartDetail, type ListNativeDragStartEvent };

package/dist/data-grid.js

@@ -1 +1 @@
-export { t as DataGridElement } from "./data-grid-BcO3SMac.js";
+export { t as DataGridElement } from "./data-grid-CJrbLzLr.js";

package/dist/{detail-list-E9WdMVbE.d.ts → detail-list-CBgnKkEm.d.ts}

@@ -1,12 +1,13 @@
 import { r as IDataProvider } from "./data-provider-Cq_ylpET.js";
 import { a as ListGroupEventMap, o as ListGroupInfo, s as ListGroupLabel } from "./grouping-OoQ8WaKc.js";
-import { L as ListDragPreviewRenderer, R as ListDragPreviewSourceResolver, V as ListNativeDragStartEvent } from "./tree-component-DNuzfo6R.js";
+import { i as ItemTagKeys, n as ItemTagBehaviour } from "./item-tags-Dz-jQq-4.js";
 import { a as ViewStateBase, s as ViewStateChangeEvent, t as GetViewStateOptions } from "./types-16GC5k1z.js";
+import { H as ListNativeDragStartEvent, P as ListDragDataTransferWriter, R as ListDragPreviewRenderer, z as ListDragPreviewSourceResolver } from "./tree-component-BE7OEIiH.js";
 import { h as ListSelectionMode, i as ListInteractionMode, r as ListElementEventMap } from "./list-selection-types-CKTt7Rrw.js";
 import { n as ListViewportChangeEvent } from "./list-viewport-types-BJ8c6qur.js";
 import "./index-Cdcek1Oj.js";
-import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-BzeXehBt.js";
-import { S as ListSearchController } from "./index-CRLTVAyt.js";
+import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-C4z3La0C.js";
+import { S as ListSearchController } from "./index-BuvySJEc.js";
 import "./icon-Bhz0c6Yf.js";
 import "./list-group-header.js";
 import { LitElement, PropertyValues } from "lit";
@@ -95,6 +96,31 @@ declare class DetailListElement extends LitElement {
    */
   badgeProperty: string;
   keyProperty: string;
+  /**
+   * Caller-assigned tags for an object item (`undefined` ⇒ none). Each tag is
+   * mirrored on the row as `data-tags` (style with `li[data-tags~="foo"]`), and
+   * `tagBehaviour` can switch off selection, focus, drag or search per tag.
+   * Re-evaluated when `items`, `tags`, `tagKeys` or `tagBehaviour` change, or on
+   * {@link refreshTags}.
+   */
+  tags: ((item: unknown, index: number) => readonly string[] | undefined) | undefined;
+  /**
+   * Tags assigned by key, apart from the item data (like `partialKeys`):
+   * tag name → keys carrying it. Merged with the `tags` hook; works for
+   * declarative rows too.
+   */
+  get tagKeys(): ItemTagKeys | undefined;
+  set tagKeys(value: ItemTagKeys | undefined);
+  /**
+   * Interaction flags per tag name: `selectable`, `focusable`, `draggable`,
+   * `searchable` (`false` switches one off; omitted keeps the default). With
+   * several tags the most restrictive wins. Rows stay rendered and keep their
+   * place in layout.
+   */
+  get tagBehaviour(): ItemTagBehaviour | undefined;
+  set tagBehaviour(value: ItemTagBehaviour | undefined);
+  /** Re-evaluate every row's tags (call after mutating data the `tags` hook reads). */
+  refreshTags(): void;
   filterPredicate: ((el: Element) => boolean) | undefined;
   /**
    * Whether keyboard navigation wraps from last to first and vice versa.
@@ -121,6 +147,12 @@ declare class DetailListElement extends LitElement {
    * built-in HTML+canvas preview.
    */
   dragPreviewRenderer: ListDragPreviewRenderer<Element> | undefined;
+  /**
+   * Write an application payload onto the drag's `DataTransfer` (e.g. a custom
+   * MIME type). Called once per drag, synchronously inside `dragstart`, after a
+   * non-cancelled `list-native-drag-start`.
+   */
+  writeDataTransfer: ListDragDataTransferWriter<Element> | undefined;
   dragPreviewSource: ListDragPreviewSourceResolver<Element> | undefined;
   /**
    * Group rows under collapsible headers that flow inline in the columns. A

package/dist/{detail-list-vPVwE1CP.js → detail-list-Dk9oSvAZ.js}

@@ -1,11 +1,11 @@
 import { t as DataController } from "./data-controller-q-rXRMzJ.js";
 import { n as appearanceColor, t as appearanceAbsent } from "./item-appearance-FRO3TRFI.js";
-import { c as createElementListSearchAdapter, d as keysOfElements, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-C5114RxZ.js";
+import { c as createElementListSearchAdapter, d as keysOfElements, i as ListSearchController, n as listSearchStyles, o as registerListSearchCommands, r as LIST_SEARCH_MODES, u as keyForElement } from "./incr-search-Bk4acsCM.js";
 import { a as toGroupKey, r as partitionByGroup } from "./grouping-kENdqzSV.js";
+import { d as ItemTagResolver, g as sameTagKeys, i as animateListItemOut, r as animateListItemIn, t as ListNativeDragController, u as DEFAULT_ITEM_TAG_FLAGS, y as tagsAttribute } from "./list-native-drag-controller-B_INa6_G.js";
 import { i as ListDragSelectController, n as gestureOf, t as ListSelectionController } from "./list-selection-controller-Dkh3m3hX.js";
-import { i as animateListItemOut, r as animateListItemIn, t as ListNativeDragController } from "./list-native-drag-controller-ByftBooJ.js";
 import { i as sameKeySet, n as applyPartialAttributes, r as isPartialKey } from "./partial-keys-D4l_ede_.js";
-import { t as TickledController } from "./tickled-controller-BVhGKzjZ.js";
+import { t as TickledController } from "./tickled-controller-BsFFr_1N.js";
 import { t as themeFallbacks } from "./fallbacks-BPjjBoED.js";
 import { a as capKeys, d as partitionKeys, l as keysToArray, o as flagsFromRecord } from "./pending-Afl4LT64.js";
 import { t as scrollFadeStyles } from "./scroll-fade-DH8OXSqL.js";
@@ -290,6 +290,8 @@ let DetailListElement = class DetailListElement extends LitElement {
 		this.textColorProperty = ``;
 		this.badgeProperty = ``;
 		this.keyProperty = ``;
+		this.#tagResolver = new ItemTagResolver();
+		this.#rowFlags = /* @__PURE__ */ new WeakMap();
 		this.itemWrap = `stop`;
 		this.itemsDraggable = false;
 		this.groupBy = null;
@@ -354,7 +356,8 @@ let DetailListElement = class DetailListElement extends LitElement {
 				const visible = this._getVisibleItems();
 				this.#tickledItemsCache ??= visible.map((el) => ({
 					id: el,
-					enabled: !el.hasAttribute(`not-checked`)
+					enabled: !el.hasAttribute(`not-checked`) && this.#flagsOf(el).selectable,
+					focusable: this.#flagsOf(el).focusable
 				}));
 				return this.#tickledItemsCache;
 			},
@@ -435,6 +438,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 		this.search = new ListSearchController(this, { adapter: createElementListSearchAdapter(this, {
 			itemSelector: ITEM_SELECTOR,
 			getLabel: (el) => el.getAttribute(`data-search-label`) ?? el.textContent?.trim() ?? ``,
+			isSearchable: (el) => this.#flagsOf(el).searchable,
 			highlightKey: SEARCH_HIGHLIGHT_KEY
 		}) });
 		this.#partialKeys = /* @__PURE__ */ new Set();
@@ -544,6 +548,62 @@ let DetailListElement = class DetailListElement extends LitElement {
 			this._listEl.scrollLeft += delta;
 		};
 	}
+	#tagResolver;
+	#rowFlags;
+	/**
+	* Tags assigned by key, apart from the item data (like `partialKeys`):
+	* tag name → keys carrying it. Merged with the `tags` hook; works for
+	* declarative rows too.
+	*/
+	get tagKeys() {
+		return this.#tagResolver.tagKeys;
+	}
+	set tagKeys(value) {
+		if (sameTagKeys(value, this.#tagResolver.tagKeys)) return;
+		this.#tagResolver.tagKeys = value;
+		this.refreshTags();
+	}
+	/**
+	* Interaction flags per tag name: `selectable`, `focusable`, `draggable`,
+	* `searchable` (`false` switches one off; omitted keeps the default). With
+	* several tags the most restrictive wins. Rows stay rendered and keep their
+	* place in layout.
+	*/
+	get tagBehaviour() {
+		return this.#tagResolver.behaviour;
+	}
+	set tagBehaviour(value) {
+		if (value === this.#tagResolver.behaviour) return;
+		this.#tagResolver.behaviour = value;
+		this.refreshTags();
+	}
+	/** Re-evaluate every row's tags (call after mutating data the `tags` hook reads). */
+	refreshTags() {
+		if (!this.isConnected) return;
+		this.#tickledItemsCache = void 0;
+		for (const el of this.#allItems()) {
+			const data = el instanceof HTMLLIElement ? this.#itemData.get(el) : void 0;
+			const index = el instanceof HTMLLIElement ? this.#itemIndex.get(el) : void 0;
+			const hook = data !== void 0 && index !== void 0 ? this.tags?.(data, index) : void 0;
+			const tags = this.#tagResolver.tagsFor(keyForElement(el) ?? void 0, hook);
+			const value = tagsAttribute(tags);
+			if (value === void 0) {
+				if (el.hasAttribute(`data-tags`)) el.removeAttribute(`data-tags`);
+			} else if (el.getAttribute(`data-tags`) !== value) el.setAttribute(`data-tags`, value);
+			const flags = this.#tagResolver.flagsFor(tags);
+			if (flags === DEFAULT_ITEM_TAG_FLAGS) this.#rowFlags.delete(el);
+			else this.#rowFlags.set(el, flags);
+		}
+		this._syncNativeDraggable();
+	}
+	#flagsOf(el) {
+		return this.#rowFlags.get(el) ?? DEFAULT_ITEM_TAG_FLAGS;
+	}
+	/** Keyboard cursor and hover may land here. */
+	#isNavigable(el) {
+		const flags = this.#flagsOf(el);
+		return this._isCheckable(el) && flags.focusable;
+	}
 	#itemData;
 	/** The `index` each object item was formatted with — reuse is only safe at the same index. */
 	#itemIndex;
@@ -607,7 +667,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 	#prepareNativeDrag(originKey) {
 		const visible = this._getVisibleItems();
 		const originEl = visible.find((el) => keyForElement(el) === originKey);
-		if (!originEl || !this._isCheckable(originEl)) return void 0;
+		if (!originEl || !this._isCheckable(originEl) || !this.#flagsOf(originEl).draggable) return void 0;
 		if (!this.selection.selected.has(originEl)) this.selection.replace(originEl);
 		const selected = [];
 		visible.forEach((el, index) => {
@@ -631,7 +691,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 		if (!this.isConnected) return;
 		if (!this.itemsDraggable && !this.#draggableApplied) return;
 		this.#draggableApplied = this.itemsDraggable;
-		for (const el of this.querySelectorAll(`li`)) if (el instanceof HTMLElement) el.draggable = this.itemsDraggable && this._isCheckable(el);
+		for (const el of this.querySelectorAll(`li`)) if (el instanceof HTMLElement) el.draggable = this.itemsDraggable && this._isCheckable(el) && this.#flagsOf(el).draggable;
 	}
 	#startPostDragSuppressTimer() {
 		if (this.#postDragSuppressTimer) clearTimeout(this.#postDragSuppressTimer);
@@ -817,6 +877,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 			}
 		}
 		if (changed.has(`searchModes`)) this.#syncSearchCommands();
+		if (changed.has(`tags`)) this.refreshTags();
 		if (changed.has(`provider`)) {
 			this.#builtFromProvider = [];
 			this.#providerBuilt = 0;
@@ -1185,6 +1246,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 		}
 		if (this.sort !== `none`) this.#applySort();
 		if (this.interactionMode === `checked`) this._syncCheckboxes();
+		this.refreshTags();
 		this._syncItemStates();
 		this.#scheduleGeometry();
 		this.#scheduleGroups();
@@ -1583,16 +1645,16 @@ let DetailListElement = class DetailListElement extends LitElement {
 				continue;
 			}
 			const item = this.#itemAt(col, row);
-			if (item && this._isCheckable(item)) return item;
+			if (item && this.#isNavigable(item)) return item;
 			row += deltaRow;
 		}
 	}
 	#findFirstCheckable() {
-		return this._getVisibleItems().find((item) => this._isCheckable(item));
+		return this._getVisibleItems().find((item) => this.#isNavigable(item));
 	}
 	#findLastCheckable() {
 		const visibleItems = this._getVisibleItems();
-		for (let i = visibleItems.length - 1; i >= 0; i--) if (this._isCheckable(visibleItems[i])) return visibleItems[i];
+		for (let i = visibleItems.length - 1; i >= 0; i--) if (this.#isNavigable(visibleItems[i])) return visibleItems[i];
 	}
 	#navigateDown() {
 		this.#ensureGeometry();
@@ -1629,7 +1691,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 		let best;
 		let bestDelta = Number.POSITIVE_INFINITY;
 		for (const el of column) {
-			if (!this._isCheckable(el)) continue;
+			if (!this.#isNavigable(el)) continue;
 			const delta = Math.abs((this.#geometry.tops.get(el) ?? Number.POSITIVE_INFINITY) - top);
 			if (delta < bestDelta) {
 				best = el;
@@ -1727,6 +1789,7 @@ let DetailListElement = class DetailListElement extends LitElement {
 		return width;
 	}
 	_isCheckable(item) {
+		if (!this.#flagsOf(item).selectable) return false;
 		if (this.interactionMode !== `checked`) return true;
 		return !item.hasAttribute(`not-checked`);
 	}
@@ -2241,6 +2304,7 @@ __decorate([property({
 	type: String,
 	attribute: `key-property`
 })], DetailListElement.prototype, "keyProperty", void 0);
+__decorate([property({ attribute: false })], DetailListElement.prototype, "tags", void 0);
 __decorate([property({ attribute: false })], DetailListElement.prototype, "filterPredicate", void 0);
 __decorate([property({
 	type: String,
@@ -2258,6 +2322,7 @@ __decorate([property({
 	reflect: true
 })], DetailListElement.prototype, "itemsDraggable", void 0);
 __decorate([property({ attribute: false })], DetailListElement.prototype, "dragPreviewRenderer", void 0);
+__decorate([property({ attribute: false })], DetailListElement.prototype, "writeDataTransfer", void 0);
 __decorate([property({ attribute: false })], DetailListElement.prototype, "dragPreviewSource", void 0);
 __decorate([property({ attribute: `group-by` })], DetailListElement.prototype, "groupBy", void 0);
 __decorate([property({ attribute: false })], DetailListElement.prototype, "groupLabel", void 0);

package/dist/detail-list.d.ts

@@ -1,6 +1,6 @@
-import { B as ListNativeDragStartDetail, F as ListDragPreview, I as ListDragPreviewContext, L as ListDragPreviewRenderer, P as ListDragEntry, V as ListNativeDragStartEvent, z as ListDragSource } from "./tree-component-DNuzfo6R.js";
+import { B as ListDragSource, F as ListDragEntry, H as ListNativeDragStartEvent, I as ListDragPreview, L as ListDragPreviewContext, R as ListDragPreviewRenderer, V as ListNativeDragStartDetail } from "./tree-component-BE7OEIiH.js";
 import { n as ListViewportChangeEvent, t as ListViewportChangeDetail } from "./list-viewport-types-BJ8c6qur.js";
 import { i as ListGroupChangeEvent, l as ListGroupToggleDetail, n as ListGroupBy, o as ListGroupInfo, r as ListGroupChangeDetail, s as ListGroupLabel, u as ListGroupToggleEvent } from "./grouping-OoQ8WaKc.js";
-import { a as DetailSortComparator, c as DetailListViewState, i as DetailGroupBy, n as DetailListElementEventMap, o as DetailSortItem, r as DetailFormatter, s as DetailSortMode, t as DetailListElement } from "./detail-list-E9WdMVbE.js";
-import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-BzeXehBt.js";
+import { a as DetailSortComparator, c as DetailListViewState, i as DetailGroupBy, n as DetailListElementEventMap, o as DetailSortItem, r as DetailFormatter, s as DetailSortMode, t as DetailListElement } from "./detail-list-CBgnKkEm.js";
+import { n as CustomCheckboxOptions, t as AddItemOptions } from "./vertical-list-C4z3La0C.js";
 export { type AddItemOptions, type CustomCheckboxOptions, type DetailFormatter, type DetailGroupBy, DetailListElement, DetailListElementEventMap, type DetailListViewState, type DetailSortComparator, type DetailSortItem, type DetailSortMode, type ListDragEntry, type ListDragPreview, type ListDragPreviewContext, type ListDragPreviewRenderer, type ListDragSource, type ListGroupBy, type ListGroupChangeDetail, type ListGroupChangeEvent, type ListGroupInfo, type ListGroupLabel, type ListGroupToggleDetail, type ListGroupToggleEvent, type ListNativeDragStartDetail, type ListNativeDragStartEvent, type ListViewportChangeDetail, type ListViewportChangeEvent };

package/dist/detail-list.js

@@ -1,2 +1,2 @@
-export { t as DetailListElement } from "./detail-list-vPVwE1CP.js";
+export { t as DetailListElement } from "./detail-list-Dk9oSvAZ.js";
 import "./list-group-header.js";