@tinya-code/gas-admin-ui 0.2.0-alpha.13 → 0.2.0-alpha.17

package/fesm2022/tinya-code-gas-admin-ui.mjs

@@ -1,6 +1,6 @@
 import { t as __exportAll } from "./tinya-code-gas-admin-ui-rolldown-runtime-DpJrqANO.mjs";
 import { _ as DEFAULT_RESPONSE_UNWRAP, a as provideFirebaseAdapter, b as ApiError, c as ConfigService, d as AuthService, f as LOGIN_PATH, g as API_URL, h as API_DRIVER, i as getSchema, l as ApiService, m as SESSION_USER_KEY, n as allSchemas, o as provideGasAdmin, p as SESSION_TOKEN_KEY, r as getAuth, s as setSchemaCatalog, t as GAS_SCHEMAS, u as apiErrorInterceptor, v as FIREBASE_AUTH_ADAPTER, x as renewedTokenOf, y as VALUE_SOURCES } from "./tinya-code-gas-admin-ui-schema-catalog-D0Pk0wAN.mjs";
-import { a as register, c as unregister, d as SUPPORTED_FIELD_TYPE_LIST, f as fieldDescriptors, i as provideRenderDescriptors, l as viewDescriptors, m as columnFormatDescriptors, n as get, o as renderKinds, p as COLUMN_FORMAT_TYPES, r as isSupported, u as layoutDescriptors } from "./tinya-code-gas-admin-ui-render-registry-CULkxrSt.mjs";
+import { a as register, c as unregister, d as SUPPORTED_FIELD_TYPE_LIST, f as fieldDescriptors, i as provideRenderDescriptors, l as viewDescriptors, m as columnFormatDescriptors, n as get, o as renderKinds, p as COLUMN_FORMAT_TYPES, r as isSupported, u as layoutDescriptors } from "./tinya-code-gas-admin-ui-render-registry-B88Pme-y.mjs";
 import { n as ViewNavigationService, t as evaluateCondition } from "./tinya-code-gas-admin-ui-condition-evaluator-DY2k1M3C.mjs";
 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";
@@ -10,14 +10,14 @@ import { t as ErrorMapperService } from "./tinya-code-gas-admin-ui-error-mapper.
 import { t as UploadService } from "./tinya-code-gas-admin-ui-upload.service-CZPEPCeN.mjs";
 import { t as EmptyState } from "./tinya-code-gas-admin-ui-empty-state-BMc0QtoT.mjs";
 import { a as stringItemTree, i as listTree, n as groupTree, r as itemTree, t as childTree } from "./tinya-code-gas-admin-ui-field-node-CIK6KNN_.mjs";
-import { _ as resolveShare, a as DrawerForm, c as buildFormSchema, d as actionTypes, f as actionsFor, g as isTriggerAction, h as isShareAction, i as CopyShare, l as FieldHost, m as registerAction, o as buildPayload, p as getAction, r as Modal, s as seedModel, t as FormView, u as actionType, v as RenderHost } from "./tinya-code-gas-admin-ui-form-view-C709rc57.mjs";
+import { _ as resolveShare, a as DrawerForm, c as buildFormSchema, d as actionTypes, f as actionsFor, g as isTriggerAction, h as isShareAction, i as CopyShare, l as FieldHost, m as registerAction, o as buildPayload, p as getAction, r as Modal, s as seedModel, t as FormView, u as actionType, v as writeClipboard, y as RenderHost } from "./tinya-code-gas-admin-ui-form-view-CEe7aZ4m.mjs";
 import { t as Skeleton } from "./tinya-code-gas-admin-ui-skeleton-DnWK0tcZ.mjs";
 import { t as getValue } from "./tinya-code-gas-admin-ui-field-path-B4-FTBGZ.mjs";
 import * as i0 from "@angular/core";
 import { ChangeDetectionStrategy, Component, EnvironmentInjector, Injector, Service, ViewContainerRef, computed, effect, inject, input, model, output, resource, signal, viewChild } from "@angular/core";
 import { catchError, combineLatest, distinctUntilChanged, firstValueFrom, map, of, switchMap } from "rxjs";
 import { ActivatedRoute, Router, RouterLink, RouterLinkActive, RouterOutlet, convertToParamMap } from "@angular/router";
-import { LucideArrowLeft, LucideChevronDown, LucideChevronRight, LucideChevronUp, LucideCircleCheck, LucideCircleX, LucideDynamicIcon, LucideExternalLink, LucideEye, LucideGripVertical, LucideInfo, LucideLogOut, LucideMonitor, LucideMoon, LucidePencil, LucidePlus, LucideRotateCw, LucideSun, LucideTrash2, LucideX, LucideZap } from "@lucide/angular";
+import { LucideArrowLeft, LucideCheck, LucideChevronDown, LucideChevronRight, LucideChevronUp, LucideCircleCheck, LucideCircleX, LucideCopy, LucideDynamicIcon, LucideExternalLink, LucideEye, LucideGripVertical, LucideInfo, LucideLogOut, LucideMonitor, LucideMoon, LucidePencil, LucidePlus, LucideRotateCw, LucideSun, LucideTrash2, LucideX, LucideZap } from "@lucide/angular";
 import { takeUntilDestroyed, toObservable, toSignal } from "@angular/core/rxjs-interop";
 import { CdkDrag, CdkDragHandle, CdkDropList } from "@angular/cdk/drag-drop";
 const authGuard = () => {
@@ -2773,6 +2773,129 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}
 });
+var CopyButton = class CopyButton {
+	value = input.required(...ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []);
+	notify = inject(NotificationService);
+	copied = signal(false, ...ngDevMode ? [{ debugName: "copied" }] : /* istanbul ignore next */ []);
+	copied$ = this.copied.asReadonly();
+	async copy() {
+		const text = String(this.value() ?? "");
+		if (await writeClipboard(text)) {
+			this.copied.set(true);
+			this.notify.success("Copiado al portapapeles.");
+			setTimeout(() => this.copied.set(false), 1500);
+		} else this.notify.error("No se pudo copiar.");
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.3",
+		ngImport: i0,
+		type: CopyButton,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.3",
+		type: CopyButton,
+		isStandalone: true,
+		selector: "app-copy-button",
+		inputs: { value: {
+			classPropertyName: "value",
+			publicName: "value",
+			isSignal: true,
+			isRequired: true,
+			transformFunction: null
+		} },
+		ngImport: i0,
+		template: `
+    <button
+      app-button
+      type="button"
+      variant="ghost"
+      size="icon"
+      [disabled]="copied()"
+      (click)="copy()"
+      [title]="'Copiar ' + value()"
+      class="text-neutral hover:text-primary"
+    >
+      @if (copied()) {
+        <svg lucideCheck size="16" class="text-primary" />
+      } @else {
+        <svg lucideCopy size="16" />
+      }
+    </button>
+  `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "component",
+				type: Button,
+				selector: "button[app-button]",
+				inputs: [
+					"variant",
+					"size",
+					"type",
+					"disabled",
+					"loading"
+				]
+			},
+			{
+				kind: "component",
+				type: LucideCopy,
+				selector: "svg[lucideCopy]"
+			},
+			{
+				kind: "component",
+				type: LucideCheck,
+				selector: "svg[lucideCheck]"
+			}
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.3",
+	ngImport: i0,
+	type: CopyButton,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "app-copy-button",
+			imports: [
+				Button,
+				LucideCopy,
+				LucideCheck
+			],
+			template: `
+    <button
+      app-button
+      type="button"
+      variant="ghost"
+      size="icon"
+      [disabled]="copied()"
+      (click)="copy()"
+      [title]="'Copiar ' + value()"
+      class="text-neutral hover:text-primary"
+    >
+      @if (copied()) {
+        <svg lucideCheck size="16" class="text-primary" />
+      } @else {
+        <svg lucideCopy size="16" />
+      }
+    </button>
+  `
+		}]
+	}],
+	propDecorators: { value: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "value",
+			required: true
+		}]
+	}] }
+});
 var DetailView = class DetailView {
 	api = inject(ApiService, { optional: true });
 	actionService = inject(ActionService);
@@ -2930,6 +3053,9 @@ var DetailView = class DetailView {
 	hasLargeContent(section) {
 		return section.fields.some((f) => this.esHistorial(f) || f.key === "description");
 	}
+	colSpanFor(width) {
+		return `lg:col-span-${Math.min(width ?? 6, 9)}`;
+	}
 	shareOf(action) {
 		return resolveShare(action, this.actionService.vars(this.effectiveRecord()));
 	}
@@ -3102,17 +3228,20 @@ var DetailView = class DetailView {
                 <div class="p-5 flex-1 space-y-4">
                   <!-- Grid para campos regulares -->
                   @if (regularFields(section).length > 0) {
-                    <dl class="grid grid-cols-1 gap-x-6 gap-y-4 sm:grid-cols-2">
+                    <dl class="grid grid-cols-1 gap-x-6 gap-y-4 lg:grid-cols-12">
                       @for (campo of regularFields(section); track campo.key) {
                         <div class="space-y-1">
-                          <dt class="text-xs font-medium text-neutral">{{ campo.label }}</dt>
-                          <dd class="text-sm font-medium text-neutral-light break-words">
+                          <dt class="col-span-12 sm:col-span-12 lg:col-span-3 text-xs font-medium text-neutral">{{ campo.label }}</dt>
+                          <dd class="col-span-12 sm:col-span-12 lg:col-span-{{ colSpanFor(campo.field.width) }} text-sm font-medium text-neutral-light break-words">
                             <app-render-host
                               mode="display"
                               [type]="campo.field.type"
                               [config]="campo.field"
                               [value]="campo.raw"
                             />
+                            @if (campo.field.copyable && campo.raw !== null && campo.raw !== undefined && campo.raw !== '') {
+                              <app-copy-button [value]="campo.raw" />
+                            }
                           </dd>
                         </div>
                       }
@@ -3165,6 +3294,12 @@ var DetailView = class DetailView {
 					"shareText"
 				]
 			},
+			{
+				kind: "component",
+				type: CopyButton,
+				selector: "app-copy-button",
+				inputs: ["value"]
+			},
 			{
 				kind: "component",
 				type: EmptyState,
@@ -3236,6 +3371,7 @@ i0.ɵɵngDeclareClassMetadata({
 			imports: [
 				Button,
 				CopyShare,
+				CopyButton,
 				EmptyState,
 				LucideArrowLeft,
 				LucideExternalLink,
@@ -3378,17 +3514,20 @@ i0.ɵɵngDeclareClassMetadata({
                 <div class="p-5 flex-1 space-y-4">
                   <!-- Grid para campos regulares -->
                   @if (regularFields(section).length > 0) {
-                    <dl class="grid grid-cols-1 gap-x-6 gap-y-4 sm:grid-cols-2">
+                    <dl class="grid grid-cols-1 gap-x-6 gap-y-4 lg:grid-cols-12">
                       @for (campo of regularFields(section); track campo.key) {
                         <div class="space-y-1">
-                          <dt class="text-xs font-medium text-neutral">{{ campo.label }}</dt>
-                          <dd class="text-sm font-medium text-neutral-light break-words">
+                          <dt class="col-span-12 sm:col-span-12 lg:col-span-3 text-xs font-medium text-neutral">{{ campo.label }}</dt>
+                          <dd class="col-span-12 sm:col-span-12 lg:col-span-{{ colSpanFor(campo.field.width) }} text-sm font-medium text-neutral-light break-words">
                             <app-render-host
                               mode="display"
                               [type]="campo.field.type"
                               [config]="campo.field"
                               [value]="campo.raw"
                             />
+                            @if (campo.field.copyable && campo.raw !== null && campo.raw !== undefined && campo.raw !== '') {
+                              <app-copy-button [value]="campo.raw" />
+                            }
                           </dd>
                         </div>
                       }