@tinya-code/gas-admin-ui 0.2.0-alpha.12 → 0.2.0-alpha.15

package/fesm2022/tinya-code-gas-admin-ui-key-value-nVdgg5at.mjs

@@ -1,513 +0,0 @@
-import { t as Button } from "./tinya-code-gas-admin-ui-button-BQjNW8KB.mjs";
-import { t as NotificationService } from "./tinya-code-gas-admin-ui-notification.service-LjSULER6.mjs";
-import { n as FieldAria } from "./tinya-code-gas-admin-ui-field-aria-BD1Wiggc.mjs";
-import { i as listTree, r as itemTree, t as childTree } from "./tinya-code-gas-admin-ui-field-node-CIK6KNN_.mjs";
-import { n as appendPosition, r as computeMove, t as GAP } from "./tinya-code-gas-admin-ui-gap-sorting-iTdy_DYG.mjs";
-import * as i0 from "@angular/core";
-import { Component, computed, inject, input } from "@angular/core";
-import { LucideArrowDown, LucideArrowUp, LucideGripVertical, LucideTrash2 } from "@lucide/angular";
-import { FormField } from "@angular/forms/signals";
-import { CdkDrag, CdkDragHandle, CdkDropList, moveItemInArray } from "@angular/cdk/drag-drop";
-var FieldKeyValue = class FieldKeyValue {
-	field = input.required(...ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []);
-	tree = input.required(...ngDevMode ? [{ debugName: "tree" }] : /* istanbul ignore next */ []);
-	notifications = inject(NotificationService);
-	itemsNode = computed(() => listTree(this.tree(), this.field().key), ...ngDevMode ? [{ debugName: "itemsNode" }] : /* istanbul ignore next */ []);
-	state = computed(() => this.itemsNode()(), ...ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []);
-	idPrefix = computed(() => this.state().name(), ...ngDevMode ? [{ debugName: "idPrefix" }] : /* istanbul ignore next */ []);
-	items = computed(() => this.state().value() ?? [], ...ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []);
-	sortable = computed(() => this.field().sortable ?? true, ...ngDevMode ? [{ debugName: "sortable" }] : /* istanbul ignore next */ []);
-	fieldNode(index, column) {
-		return childTree(itemTree(this.itemsNode(), index), column);
-	}
-	canAdd() {
-		const max = this.field().max;
-		return max === void 0 || this.items().length < max;
-	}
-	canRemove() {
-		return this.items().length > (this.field().min ?? 0);
-	}
-	add() {
-		if (!this.canAdd()) return;
-		const positionKey = this.field().positionField;
-		const row = {
-			key: "",
-			value: ""
-		};
-		if (positionKey !== void 0) row[positionKey] = appendPosition(this.positioned());
-		this.updateItems((next) => {
-			next.push(row);
-		});
-	}
-	move(index, direction) {
-		const target = index + direction;
-		if (target < 0 || target >= this.items().length) return;
-		this.applyMove(index, target);
-	}
-	onDrop(event) {
-		if (event.previousIndex === event.currentIndex) return;
-		this.applyMove(event.previousIndex, event.currentIndex);
-	}
-	async remove(index) {
-		if (!this.canRemove()) return;
-		const row = this.items()[index];
-		if (row !== void 0 && (row.key.trim() !== "" || row.value.trim() !== "")) {
-			if (!await this.notifications.confirm({
-				title: `Eliminar fila ${index + 1}`,
-				message: "Esta acción no se puede deshacer.",
-				confirmLabel: "Eliminar",
-				cancelLabel: "Cancelar"
-			})) return;
-		}
-		this.updateItems((next) => {
-			next.splice(index, 1);
-		});
-	}
-	applyMove(from, to) {
-		const positionKey = this.field().positionField;
-		this.updateItems((next) => {
-			if (positionKey !== void 0) {
-				const result = computeMove(this.positioned(), String(from), to);
-				for (const change of result.changes) {
-					const row = next[Number(change.key)];
-					if (row !== void 0) row[positionKey] = change.position;
-				}
-			}
-			moveItemInArray(next, from, to);
-		});
-	}
-	positioned() {
-		const positionKey = this.field().positionField;
-		return this.items().map((item, index) => {
-			const raw = positionKey !== void 0 ? item[positionKey] : void 0;
-			return {
-				key: String(index),
-				position: typeof raw === "number" ? raw : (index + 1) * GAP
-			};
-		});
-	}
-	updateItems(mutator) {
-		this.state().controlValue.update((current) => {
-			const next = [...current];
-			mutator(next);
-			return next;
-		});
-	}
-	static ɵfac = i0.ɵɵngDeclareFactory({
-		minVersion: "12.0.0",
-		version: "22.2.3",
-		ngImport: i0,
-		type: FieldKeyValue,
-		deps: [],
-		target: i0.ɵɵFactoryTarget.Component
-	});
-	static ɵcmp = i0.ɵɵngDeclareComponent({
-		minVersion: "17.0.0",
-		version: "22.2.3",
-		type: FieldKeyValue,
-		isStandalone: true,
-		selector: "app-field-key-value",
-		inputs: {
-			field: {
-				classPropertyName: "field",
-				publicName: "field",
-				isSignal: true,
-				isRequired: true,
-				transformFunction: null
-			},
-			tree: {
-				classPropertyName: "tree",
-				publicName: "tree",
-				isSignal: true,
-				isRequired: true,
-				transformFunction: null
-			}
-		},
-		ngImport: i0,
-		template: `
-    @if (items().length === 0) {
-      <p
-        class="rounded-lg border border-dashed border-neutral/30 px-4 py-6 text-center text-sm text-neutral"
-      >
-        {{ field().emptyText ?? 'Sin elementos.' }}
-      </p>
-    } @else {
-      <div class="overflow-x-auto rounded-xl border border-neutral/20 bg-surface">
-        <table class="w-full text-sm">
-          <thead>
-            <tr class="border-b border-neutral/20 text-left text-xs font-medium text-neutral">
-              <th class="w-10 px-3 py-2" scope="col"><span class="sr-only">Orden</span></th>
-              <th class="px-3 py-2" scope="col">Clave</th>
-              <th class="px-3 py-2" scope="col">Valor</th>
-              <th class="w-28 px-3 py-2" scope="col"><span class="sr-only">Acciones</span></th>
-            </tr>
-          </thead>
-          <tbody
-            cdkDropList
-            [cdkDropListData]="items()"
-            [cdkDropListDisabled]="!sortable()"
-            (cdkDropListDropped)="onDrop($event)"
-          >
-            @for (item of items(); track $index; let i = $index) {
-              <tr
-                class="border-b border-neutral/10 last:border-b-0"
-                cdkDrag
-                [cdkDragDisabled]="!sortable()"
-              >
-                <td class="px-3 py-2 align-middle">
-                  @if (sortable()) {
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      class="cursor-grab"
-                      cdkDragHandle
-                      [attr.aria-label]="'Reordenar fila ' + (i + 1)"
-                      title="Arrastrar para reordenar"
-                    >
-                      <svg lucideGripVertical size="16" />
-                    </button>
-                  }
-                </td>
-                <td class="px-3 py-2">
-                  <input
-                    class="field-input"
-                    type="text"
-                    placeholder="Clave"
-                    [attr.aria-label]="'Clave, fila ' + (i + 1)"
-                    [id]="idPrefix() + '-key-' + i"
-                    [formField]="fieldNode(i, 'key')"
-                  />
-                </td>
-                <td class="px-3 py-2">
-                  <input
-                    class="field-input"
-                    type="text"
-                    placeholder="Valor"
-                    [attr.aria-label]="'Valor, fila ' + (i + 1)"
-                    [id]="idPrefix() + '-value-' + i"
-                    [formField]="fieldNode(i, 'value')"
-                  />
-                </td>
-                <td class="px-3 py-2">
-                  <span class="flex items-center justify-end gap-2 lg:gap-1">
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="i === 0"
-                      [attr.aria-label]="'Subir fila ' + (i + 1)"
-                      (click)="move(i, -1)"
-                    >
-                      <svg lucideArrowUp size="16" />
-                    </button>
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="i === items().length - 1"
-                      [attr.aria-label]="'Bajar fila ' + (i + 1)"
-                      (click)="move(i, 1)"
-                    >
-                      <svg lucideArrowDown size="16" />
-                    </button>
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="!canRemove()"
-                      [attr.aria-label]="'Eliminar fila ' + (i + 1)"
-                      (click)="remove(i)"
-                    >
-                      <svg lucideTrash2 size="16" />
-                    </button>
-                  </span>
-                </td>
-              </tr>
-            }
-          </tbody>
-        </table>
-      </div>
-    }
-
-    <div class="mt-3">
-      <button app-button variant="outline" type="button" [disabled]="!canAdd()" (click)="add()">
-        + {{ field().addLabel ?? 'Agregar especificación' }}
-      </button>
-    </div>
-  `,
-		isInline: true,
-		dependencies: [
-			{
-				kind: "directive",
-				type: FieldAria,
-				selector: "input[id], select[id], textarea[id], output[id]"
-			},
-			{
-				kind: "component",
-				type: Button,
-				selector: "button[app-button]",
-				inputs: [
-					"variant",
-					"size",
-					"type",
-					"disabled",
-					"loading"
-				]
-			},
-			{
-				kind: "directive",
-				type: CdkDrag,
-				selector: "[cdkDrag]",
-				inputs: [
-					"cdkDragData",
-					"cdkDragLockAxis",
-					"cdkDragRootElement",
-					"cdkDragBoundary",
-					"cdkDragStartDelay",
-					"cdkDragFreeDragPosition",
-					"cdkDragDisabled",
-					"cdkDragConstrainPosition",
-					"cdkDragPreviewClass",
-					"cdkDragPreviewContainer",
-					"cdkDragScale"
-				],
-				outputs: [
-					"cdkDragStarted",
-					"cdkDragReleased",
-					"cdkDragEnded",
-					"cdkDragEntered",
-					"cdkDragExited",
-					"cdkDragDropped",
-					"cdkDragMoved"
-				],
-				exportAs: ["cdkDrag"]
-			},
-			{
-				kind: "directive",
-				type: CdkDragHandle,
-				selector: "[cdkDragHandle]",
-				inputs: ["cdkDragHandleDisabled"]
-			},
-			{
-				kind: "directive",
-				type: CdkDropList,
-				selector: "[cdkDropList], cdk-drop-list",
-				inputs: [
-					"cdkDropListConnectedTo",
-					"cdkDropListData",
-					"cdkDropListOrientation",
-					"id",
-					"cdkDropListLockAxis",
-					"cdkDropListDisabled",
-					"cdkDropListSortingDisabled",
-					"cdkDropListEnterPredicate",
-					"cdkDropListSortPredicate",
-					"cdkDropListAutoScrollDisabled",
-					"cdkDropListAutoScrollStep",
-					"cdkDropListElementContainer",
-					"cdkDropListHasAnchor"
-				],
-				outputs: [
-					"cdkDropListDropped",
-					"cdkDropListEntered",
-					"cdkDropListExited",
-					"cdkDropListSorted"
-				],
-				exportAs: ["cdkDropList"]
-			},
-			{
-				kind: "directive",
-				type: FormField,
-				selector: "[formField]",
-				inputs: ["formField"],
-				exportAs: ["formField"]
-			},
-			{
-				kind: "component",
-				type: LucideArrowDown,
-				selector: "svg[lucideArrowDown]"
-			},
-			{
-				kind: "component",
-				type: LucideArrowUp,
-				selector: "svg[lucideArrowUp]"
-			},
-			{
-				kind: "component",
-				type: LucideGripVertical,
-				selector: "svg[lucideGripVertical]"
-			},
-			{
-				kind: "component",
-				type: LucideTrash2,
-				selector: "svg[lucideTrash], svg[lucideTrash2]"
-			}
-		]
-	});
-};
-i0.ɵɵngDeclareClassMetadata({
-	minVersion: "12.0.0",
-	version: "22.2.3",
-	ngImport: i0,
-	type: FieldKeyValue,
-	decorators: [{
-		type: Component,
-		args: [{
-			selector: "app-field-key-value",
-			imports: [
-				FieldAria,
-				Button,
-				CdkDrag,
-				CdkDragHandle,
-				CdkDropList,
-				FormField,
-				LucideArrowDown,
-				LucideArrowUp,
-				LucideGripVertical,
-				LucideTrash2
-			],
-			template: `
-    @if (items().length === 0) {
-      <p
-        class="rounded-lg border border-dashed border-neutral/30 px-4 py-6 text-center text-sm text-neutral"
-      >
-        {{ field().emptyText ?? 'Sin elementos.' }}
-      </p>
-    } @else {
-      <div class="overflow-x-auto rounded-xl border border-neutral/20 bg-surface">
-        <table class="w-full text-sm">
-          <thead>
-            <tr class="border-b border-neutral/20 text-left text-xs font-medium text-neutral">
-              <th class="w-10 px-3 py-2" scope="col"><span class="sr-only">Orden</span></th>
-              <th class="px-3 py-2" scope="col">Clave</th>
-              <th class="px-3 py-2" scope="col">Valor</th>
-              <th class="w-28 px-3 py-2" scope="col"><span class="sr-only">Acciones</span></th>
-            </tr>
-          </thead>
-          <tbody
-            cdkDropList
-            [cdkDropListData]="items()"
-            [cdkDropListDisabled]="!sortable()"
-            (cdkDropListDropped)="onDrop($event)"
-          >
-            @for (item of items(); track $index; let i = $index) {
-              <tr
-                class="border-b border-neutral/10 last:border-b-0"
-                cdkDrag
-                [cdkDragDisabled]="!sortable()"
-              >
-                <td class="px-3 py-2 align-middle">
-                  @if (sortable()) {
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      class="cursor-grab"
-                      cdkDragHandle
-                      [attr.aria-label]="'Reordenar fila ' + (i + 1)"
-                      title="Arrastrar para reordenar"
-                    >
-                      <svg lucideGripVertical size="16" />
-                    </button>
-                  }
-                </td>
-                <td class="px-3 py-2">
-                  <input
-                    class="field-input"
-                    type="text"
-                    placeholder="Clave"
-                    [attr.aria-label]="'Clave, fila ' + (i + 1)"
-                    [id]="idPrefix() + '-key-' + i"
-                    [formField]="fieldNode(i, 'key')"
-                  />
-                </td>
-                <td class="px-3 py-2">
-                  <input
-                    class="field-input"
-                    type="text"
-                    placeholder="Valor"
-                    [attr.aria-label]="'Valor, fila ' + (i + 1)"
-                    [id]="idPrefix() + '-value-' + i"
-                    [formField]="fieldNode(i, 'value')"
-                  />
-                </td>
-                <td class="px-3 py-2">
-                  <span class="flex items-center justify-end gap-2 lg:gap-1">
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="i === 0"
-                      [attr.aria-label]="'Subir fila ' + (i + 1)"
-                      (click)="move(i, -1)"
-                    >
-                      <svg lucideArrowUp size="16" />
-                    </button>
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="i === items().length - 1"
-                      [attr.aria-label]="'Bajar fila ' + (i + 1)"
-                      (click)="move(i, 1)"
-                    >
-                      <svg lucideArrowDown size="16" />
-                    </button>
-                    <button
-                      type="button"
-                      app-button
-                      variant="ghost"
-                      size="icon"
-                      [disabled]="!canRemove()"
-                      [attr.aria-label]="'Eliminar fila ' + (i + 1)"
-                      (click)="remove(i)"
-                    >
-                      <svg lucideTrash2 size="16" />
-                    </button>
-                  </span>
-                </td>
-              </tr>
-            }
-          </tbody>
-        </table>
-      </div>
-    }
-
-    <div class="mt-3">
-      <button app-button variant="outline" type="button" [disabled]="!canAdd()" (click)="add()">
-        + {{ field().addLabel ?? 'Agregar especificación' }}
-      </button>
-    </div>
-  `
-		}]
-	}],
-	propDecorators: {
-		field: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "field",
-				required: true
-			}]
-		}],
-		tree: [{
-			type: i0.Input,
-			args: [{
-				isSignal: true,
-				alias: "tree",
-				required: true
-			}]
-		}]
-	}
-});
-export { FieldKeyValue };
-
-//# sourceMappingURL=tinya-code-gas-admin-ui-key-value-nVdgg5at.mjs.map

package/fesm2022/tinya-code-gas-admin-ui-key-value-nVdgg5at.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"tinya-code-gas-admin-ui-key-value-nVdgg5at.mjs","names":[],"sources":["../../../projects/gas-admin-ui/src/lib/fields/key-value/key-value.ts"],"sourcesContent":["import { Component, computed, inject, input } from '@angular/core';\nimport { FormField } from '@angular/forms/signals';\nimport {\n  CdkDrag,\n  CdkDragDrop,\n  CdkDragHandle,\n  CdkDropList,\n  moveItemInArray,\n} from '@angular/cdk/drag-drop';\n\nimport { LucideArrowDown, LucideArrowUp, LucideGripVertical, LucideTrash2 } from '@lucide/angular';\nimport type { KeyValueField, KeyValueItem } from '../../core/models/schema.model';\nimport { NotificationService } from '../../core/services/notification.service';\nimport { Button } from '../../shared/components/button/button';\nimport {\n  appendPosition,\n  computeMove,\n  GAP,\n  type PositionedItem,\n} from '../../shared/utils/gap-sorting';\nimport { FieldAria } from '../field-aria';\nimport { childTree, itemTree, listTree, type RootTree } from '../field-node';\n\n/**\n * Pares clave→valor (base.md §9 «ficha técnica»). Hoja: tabla con sus\n * propios `<input [formField]>` (nodos `key`/`value` del ítem) y no toca\n * FieldHost. `position` se calcula con gap-sorting igual que en `list`.\n */\n@Component({\n  selector: 'app-field-key-value',\n  imports: [\n    FieldAria,\n    Button,\n    CdkDrag,\n    CdkDragHandle,\n    CdkDropList,\n    FormField,\n    LucideArrowDown,\n    LucideArrowUp,\n    LucideGripVertical,\n    LucideTrash2,\n  ],\n  template: `\n    @if (items().length === 0) {\n      <p\n        class=\"rounded-lg border border-dashed border-neutral/30 px-4 py-6 text-center text-sm text-neutral\"\n      >\n        {{ field().emptyText ?? 'Sin elementos.' }}\n      </p>\n    } @else {\n      <div class=\"overflow-x-auto rounded-xl border border-neutral/20 bg-surface\">\n        <table class=\"w-full text-sm\">\n          <thead>\n            <tr class=\"border-b border-neutral/20 text-left text-xs font-medium text-neutral\">\n              <th class=\"w-10 px-3 py-2\" scope=\"col\"><span class=\"sr-only\">Orden</span></th>\n              <th class=\"px-3 py-2\" scope=\"col\">Clave</th>\n              <th class=\"px-3 py-2\" scope=\"col\">Valor</th>\n              <th class=\"w-28 px-3 py-2\" scope=\"col\"><span class=\"sr-only\">Acciones</span></th>\n            </tr>\n          </thead>\n          <tbody\n            cdkDropList\n            [cdkDropListData]=\"items()\"\n            [cdkDropListDisabled]=\"!sortable()\"\n            (cdkDropListDropped)=\"onDrop($event)\"\n          >\n            @for (item of items(); track $index; let i = $index) {\n              <tr\n                class=\"border-b border-neutral/10 last:border-b-0\"\n                cdkDrag\n                [cdkDragDisabled]=\"!sortable()\"\n              >\n                <td class=\"px-3 py-2 align-middle\">\n                  @if (sortable()) {\n                    <button\n                      type=\"button\"\n                      app-button\n                      variant=\"ghost\"\n                      size=\"icon\"\n                      class=\"cursor-grab\"\n                      cdkDragHandle\n                      [attr.aria-label]=\"'Reordenar fila ' + (i + 1)\"\n                      title=\"Arrastrar para reordenar\"\n                    >\n                      <svg lucideGripVertical size=\"16\" />\n                    </button>\n                  }\n                </td>\n                <td class=\"px-3 py-2\">\n                  <input\n                    class=\"field-input\"\n                    type=\"text\"\n                    placeholder=\"Clave\"\n                    [attr.aria-label]=\"'Clave, fila ' + (i + 1)\"\n                    [id]=\"idPrefix() + '-key-' + i\"\n                    [formField]=\"fieldNode(i, 'key')\"\n                  />\n                </td>\n                <td class=\"px-3 py-2\">\n                  <input\n                    class=\"field-input\"\n                    type=\"text\"\n                    placeholder=\"Valor\"\n                    [attr.aria-label]=\"'Valor, fila ' + (i + 1)\"\n                    [id]=\"idPrefix() + '-value-' + i\"\n                    [formField]=\"fieldNode(i, 'value')\"\n                  />\n                </td>\n                <td class=\"px-3 py-2\">\n                  <span class=\"flex items-center justify-end gap-2 lg:gap-1\">\n                    <button\n                      type=\"button\"\n                      app-button\n                      variant=\"ghost\"\n                      size=\"icon\"\n                      [disabled]=\"i === 0\"\n                      [attr.aria-label]=\"'Subir fila ' + (i + 1)\"\n                      (click)=\"move(i, -1)\"\n                    >\n                      <svg lucideArrowUp size=\"16\" />\n                    </button>\n                    <button\n                      type=\"button\"\n                      app-button\n                      variant=\"ghost\"\n                      size=\"icon\"\n                      [disabled]=\"i === items().length - 1\"\n                      [attr.aria-label]=\"'Bajar fila ' + (i + 1)\"\n                      (click)=\"move(i, 1)\"\n                    >\n                      <svg lucideArrowDown size=\"16\" />\n                    </button>\n                    <button\n                      type=\"button\"\n                      app-button\n                      variant=\"ghost\"\n                      size=\"icon\"\n                      [disabled]=\"!canRemove()\"\n                      [attr.aria-label]=\"'Eliminar fila ' + (i + 1)\"\n                      (click)=\"remove(i)\"\n                    >\n                      <svg lucideTrash2 size=\"16\" />\n                    </button>\n                  </span>\n                </td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n    }\n\n    <div class=\"mt-3\">\n      <button app-button variant=\"outline\" type=\"button\" [disabled]=\"!canAdd()\" (click)=\"add()\">\n        + {{ field().addLabel ?? 'Agregar especificación' }}\n      </button>\n    </div>\n  `,\n})\nexport class FieldKeyValue {\n  readonly field = input.required<KeyValueField>();\n  readonly tree = input.required<RootTree>();\n\n  private readonly notifications = inject(NotificationService);\n\n  private readonly itemsNode = computed(() =>\n    listTree<KeyValueItem>(this.tree(), this.field().key),\n  );\n  private readonly state = computed(() => this.itemsNode()());\n  /** Prefijo estable del campo para los id de cada celda (§8). */\n  protected readonly idPrefix = computed(() => this.state().name());\n  protected readonly items = computed(() => this.state().value() ?? []);\n\n  protected readonly sortable = computed(() => this.field().sortable ?? true);\n\n  /** Nodo de `key`/`value` del ítem; se llama fresco en cada render (NG01904). */\n  protected fieldNode(\n    index: number,\n    column: 'key' | 'value',\n  ): ReturnType<typeof childTree<string>> {\n    return childTree<string>(itemTree(this.itemsNode(), index), column);\n  }\n\n  protected canAdd(): boolean {\n    const max = this.field().max;\n    return max === undefined || this.items().length < max;\n  }\n\n  protected canRemove(): boolean {\n    return this.items().length > (this.field().min ?? 0);\n  }\n\n  protected add(): void {\n    if (!this.canAdd()) {\n      return;\n    }\n    const positionKey = this.field().positionField;\n    const row: KeyValueItem & Record<string, unknown> = { key: '', value: '' };\n    if (positionKey !== undefined) {\n      row[positionKey] = appendPosition(this.positioned());\n    }\n    this.updateItems((next) => {\n      next.push(row);\n    });\n  }\n\n  protected move(index: number, direction: -1 | 1): void {\n    const target = index + direction;\n    if (target < 0 || target >= this.items().length) {\n      return;\n    }\n    this.applyMove(index, target);\n  }\n\n  protected onDrop(event: CdkDragDrop<KeyValueItem[]>): void {\n    if (event.previousIndex === event.currentIndex) {\n      return;\n    }\n    this.applyMove(event.previousIndex, event.currentIndex);\n  }\n\n  protected async remove(index: number): Promise<void> {\n    if (!this.canRemove()) {\n      return;\n    }\n    const row = this.items()[index];\n    if (row !== undefined && (row.key.trim() !== '' || row.value.trim() !== '')) {\n      const accepted = await this.notifications.confirm({\n        title: `Eliminar fila ${index + 1}`,\n        message: 'Esta acción no se puede deshacer.',\n        confirmLabel: 'Eliminar',\n        cancelLabel: 'Cancelar',\n      });\n      if (!accepted) {\n        return;\n      }\n    }\n    this.updateItems((next) => {\n      next.splice(index, 1);\n    });\n  }\n\n  /** Mueve y recalcula `position` (base.md §8): cambios antes del splice. */\n  private applyMove(from: number, to: number): void {\n    const positionKey = this.field().positionField;\n    this.updateItems((next) => {\n      if (positionKey !== undefined) {\n        const result = computeMove(this.positioned(), String(from), to);\n        for (const change of result.changes) {\n          const row = next[Number(change.key)] as\n            (KeyValueItem & Record<string, unknown>) | undefined;\n          if (row !== undefined) {\n            row[positionKey] = change.position;\n          }\n        }\n      }\n      moveItemInArray(next, from, to);\n    });\n  }\n\n  private positioned(): PositionedItem[] {\n    const positionKey = this.field().positionField;\n    return this.items().map((item, index) => {\n      const raw =\n        positionKey !== undefined\n          ? (item as unknown as Record<string, unknown>)[positionKey]\n          : undefined;\n      // Fallback: un registro viejo sin `position` se numera como rebalanceo.\n      return {\n        key: String(index),\n        position: typeof raw === 'number' ? raw : (index + 1) * GAP,\n      };\n    });\n  }\n\n  private updateItems(mutator: (next: KeyValueItem[]) => void): void {\n    this.state().controlValue.update((current) => {\n      const next = [...current];\n      mutator(next);\n      return next;\n    });\n  }\n}\n"],"mappings":"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"}