@simplysm/angular 14.0.30 → 14.0.33

package/dist/data/data-detail/sd-data-detail.js

@@ -0,0 +1,491 @@
+import { NgTemplateOutlet } from "@angular/common";
+import { ChangeDetectionStrategy, Component, contentChild, effect, TemplateRef, viewChild, ViewEncapsulation, } from "@angular/core";
+import { FormatPipe } from "../../core/format.pipe";
+import { injectParent } from "../../core/injectParent";
+import { SdButton } from "../../controls/button/sd-button";
+import { SdAnchor } from "../../controls/button/sd-anchor";
+import { SdForm } from "../../controls/form/sd-form";
+import { SdBaseContainer } from "../../layout/base-container/sd-base-container";
+import { NgIcon } from "@ng-icons/core";
+import { tablerDeviceFloppy, tablerEraser, tablerRefresh, tablerRestore, } from "@ng-icons/tabler-icons";
+import { SdDataDetailBase } from "./sd-data-detail.base";
+import * as i0 from "@angular/core";
+const _c0 = ["toolTpl"];
+const _c1 = ["prevTpl"];
+const _c2 = ["contentTpl"];
+const _c3 = ["nextTpl"];
+const _c4 = ["formCtrl"];
+const _c5 = ["modalActionTpl"];
+function SdDataDetail_ng_template_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_1_Conditional_0_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r2); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onSubmitButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 8);
+    i0.ɵɵtext(2, " \uC800\uC7A5 ");
+    i0.ɵɵelementStart(3, "small");
+    i0.ɵɵtext(4, "(CTRL+S)");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("theme", "link-primary");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerDeviceFloppy);
+} }
+function SdDataDetail_ng_template_1_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵconditionalCreate(0, SdDataDetail_ng_template_1_Conditional_0_Template, 5, 2, "sd-button", 6);
+    i0.ɵɵelementStart(1, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_1_Template_sd_button_click_1_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onRefreshButtonClick()); });
+    i0.ɵɵelement(2, "ng-icon", 8);
+    i0.ɵɵtext(3, " \uC0C8\uB85C\uACE0\uCE68 ");
+    i0.ɵɵelementStart(4, "small");
+    i0.ɵɵtext(5, "(CTRL+ALT+L)");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r2.parent.canEdit() && ctx_r2.parent.submit ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("theme", "link-info");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerRefresh);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_0_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onSubmitButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 8);
+    i0.ɵɵtext(2, " \uC800\uC7A5 ");
+    i0.ɵɵelementStart(3, "small");
+    i0.ɵɵtext(4, "(CTRL+S)");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_0_Template_sd_button_click_5_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onRefreshButtonClick()); });
+    i0.ɵɵelement(6, "ng-icon", 8);
+    i0.ɵɵtext(7, " \uC0C8\uB85C\uACE0\uCE68 ");
+    i0.ɵɵelementStart(8, "small");
+    i0.ɵɵtext(9, "(CTRL+ALT+L)");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("theme", "primary");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerDeviceFloppy);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("theme", "info");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerRefresh);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_0_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r2.onRestoreButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 8);
+    i0.ɵɵtext(2, " \uBCF5\uAD6C ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(5);
+    i0.ɵɵproperty("theme", "warning");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerRestore);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_1_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r7); const ctx_r2 = i0.ɵɵnextContext(5); return i0.ɵɵresetView(ctx_r2.onDeleteButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 8);
+    i0.ɵɵtext(2, " \uC0AD\uC81C ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(5);
+    i0.ɵɵproperty("theme", "danger");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerEraser);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_0_Template, 3, 2, "sd-button", 6)(1, SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Conditional_1_Template, 3, 2, "sd-button", 6);
+} if (rf & 2) {
+    let tmp_8_0;
+    const ctx_r2 = i0.ɵɵnextContext(4);
+    i0.ɵɵconditional(((tmp_8_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_8_0.isDeleted) ? 0 : 1);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_0_Template, 10, 4);
+    i0.ɵɵconditionalCreate(1, SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Conditional_1_Template, 2, 1);
+} if (rf & 2) {
+    let tmp_8_0;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵconditional(ctx_r2.parent.submit ? 0 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!((tmp_8_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_8_0.isNew) && ctx_r2.parent.toggleDelete && (!ctx_r2.parent.canDelete || ctx_r2.parent.canDelete()) ? 1 : -1);
+} }
+function SdDataDetail_ng_template_3_Conditional_1_ng_template_2_Template(rf, ctx) { }
+function SdDataDetail_ng_template_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 10);
+    i0.ɵɵconditionalCreate(1, SdDataDetail_ng_template_3_Conditional_1_Conditional_1_Template, 2, 2);
+    i0.ɵɵtemplate(2, SdDataDetail_ng_template_3_Conditional_1_ng_template_2_Template, 0, 0, "ng-template", 13);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.parent.viewType() === "control" && ctx_r2.parent.canEdit() ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.toolTplRef() ?? null);
+} }
+function SdDataDetail_ng_template_3_Conditional_2_ng_template_1_Template(rf, ctx) { }
+function SdDataDetail_ng_template_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵtemplate(1, SdDataDetail_ng_template_3_Conditional_2_ng_template_1_Template, 0, 0, "ng-template", 13);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.prevTplRef() ?? null);
+} }
+function SdDataDetail_ng_template_3_ng_template_6_Template(rf, ctx) { }
+function SdDataDetail_ng_template_3_Conditional_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+    i0.ɵɵpipe(1, "format");
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(1, 1, ctx_r2.parent.dataInfo().lastModifiedAt, "yyyy-MM-dd HH:mm"), " ");
+} }
+function SdDataDetail_ng_template_3_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    let tmp_7_0;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵtextInterpolate1(" (", (tmp_7_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_7_0.lastModifiedBy, ") ");
+} }
+function SdDataDetail_ng_template_3_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵtext(1, " \uCD5C\uC885\uC218\uC815: ");
+    i0.ɵɵconditionalCreate(2, SdDataDetail_ng_template_3_Conditional_7_Conditional_2_Template, 2, 4);
+    i0.ɵɵconditionalCreate(3, SdDataDetail_ng_template_3_Conditional_7_Conditional_3_Template, 1, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_7_0;
+    let tmp_8_0;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("bg-theme-gray-lightest", ctx_r2.parent.viewType() === "modal");
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(((tmp_7_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_7_0.lastModifiedAt) ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(((tmp_8_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_8_0.lastModifiedBy) ? 3 : -1);
+} }
+function SdDataDetail_ng_template_3_Conditional_8_ng_template_1_Template(rf, ctx) { }
+function SdDataDetail_ng_template_3_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵtemplate(1, SdDataDetail_ng_template_3_Conditional_8_ng_template_1_Template, 0, 0, "ng-template", 13);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.nextTplRef() ?? null);
+} }
+function SdDataDetail_ng_template_3_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵconditionalCreate(1, SdDataDetail_ng_template_3_Conditional_1_Template, 3, 2, "div", 10);
+    i0.ɵɵconditionalCreate(2, SdDataDetail_ng_template_3_Conditional_2_Template, 2, 1, "div");
+    i0.ɵɵelementStart(3, "div", 11)(4, "sd-form", 12, 3);
+    i0.ɵɵlistener("formSubmit", function SdDataDetail_ng_template_3_Template_sd_form_formSubmit_4_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onSubmit()); });
+    i0.ɵɵtemplate(6, SdDataDetail_ng_template_3_ng_template_6_Template, 0, 0, "ng-template", 13);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(7, SdDataDetail_ng_template_3_Conditional_7_Template, 4, 4, "div", 14);
+    i0.ɵɵconditionalCreate(8, SdDataDetail_ng_template_3_Conditional_8_Template, 2, 1, "div");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_8_0;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.parent.viewType() === "control" && ctx_r2.parent.canEdit() || ctx_r2.toolTplRef() ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.prevTplRef() ? 2 : -1);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.contentTplRef());
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(((tmp_8_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_8_0.lastModifiedAt) || ((tmp_8_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_8_0.lastModifiedBy) ? 7 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r2.nextTplRef() ? 8 : -1);
+} }
+function SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 18);
+    i0.ɵɵlistener("click", function SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_0_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onRestoreButtonClick()); });
+    i0.ɵɵtext(1, " \uBCF5\uAD6C ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵproperty("size", "sm")("theme", "warning");
+} }
+function SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 18);
+    i0.ɵɵlistener("click", function SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_1_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r2 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r2.onDeleteButtonClick()); });
+    i0.ɵɵtext(1, " \uC0AD\uC81C ");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    i0.ɵɵproperty("size", "sm")("theme", "danger");
+} }
+function SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_0_Template, 2, 2, "sd-button", 19)(1, SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Conditional_1_Template, 2, 2, "sd-button", 19);
+} if (rf & 2) {
+    let tmp_7_0;
+    const ctx_r2 = i0.ɵɵnextContext(3);
+    i0.ɵɵconditional(((tmp_7_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_7_0.isDeleted) ? 0 : 1);
+} }
+function SdDataDetail_Conditional_5_ng_template_0_Template(rf, ctx) { if (rf & 1) {
+    const _r8 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 16);
+    i0.ɵɵconditionalCreate(1, SdDataDetail_Conditional_5_ng_template_0_Conditional_1_Template, 2, 1);
+    i0.ɵɵelementStart(2, "div", 17)(3, "sd-button", 18);
+    i0.ɵɵlistener("click", function SdDataDetail_Conditional_5_ng_template_0_Template_sd_button_click_3_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onSubmitButtonClick()); });
+    i0.ɵɵtext(4, " \uD655\uC778 ");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    let tmp_6_0;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!((tmp_6_0 = ctx_r2.parent.dataInfo()) == null ? null : tmp_6_0.isNew) && ctx_r2.parent.toggleDelete && (!ctx_r2.parent.canDelete || ctx_r2.parent.canDelete()) ? 1 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("size", "sm")("theme", "primary");
+} }
+function SdDataDetail_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, SdDataDetail_Conditional_5_ng_template_0_Template, 5, 3, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
+} }
+function SdDataDetail_ng_template_6_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-anchor", 20);
+    i0.ɵɵlistener("click", function SdDataDetail_ng_template_6_Template_sd_anchor_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onRefreshButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 8);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("theme", "gray");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2.icons.tablerRefresh);
+} }
+//#region SdDataDetail
+export class SdDataDetail {
+    parent = injectParent();
+    formCtrl = viewChild("formCtrl", ...(ngDevMode ? [{ debugName: "formCtrl" }] : /* istanbul ignore next */ []));
+    toolTplRef = contentChild("toolTpl", { ...(ngDevMode ? { debugName: "toolTplRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
+    prevTplRef = contentChild("prevTpl", { ...(ngDevMode ? { debugName: "prevTplRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
+    contentTplRef = contentChild.required("contentTpl", { read: TemplateRef });
+    nextTplRef = contentChild("nextTpl", { ...(ngDevMode ? { debugName: "nextTplRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
+    modalActionTplRef = viewChild("modalActionTpl", { ...(ngDevMode ? { debugName: "modalActionTplRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
+    constructor() {
+        effect(() => {
+            this.parent.actionTplRef = this.modalActionTplRef();
+        });
+    }
+    async onRefreshButtonClick() {
+        await this.parent.doRefresh();
+    }
+    async onDeleteButtonClick() {
+        await this.parent.doToggleDelete(true);
+    }
+    async onRestoreButtonClick() {
+        await this.parent.doToggleDelete(false);
+    }
+    onSubmitButtonClick() {
+        this.formCtrl()?.requestSubmit();
+    }
+    async onSubmit() {
+        await this.parent.doSubmit({ permCheck: true });
+    }
+    icons = {
+        tablerDeviceFloppy,
+        tablerRefresh,
+        tablerRestore,
+        tablerEraser,
+    };
+    static ɵfac = function SdDataDetail_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdDataDetail)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdDataDetail, selectors: [["sd-data-detail"]], contentQueries: function SdDataDetail_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuerySignal(dirIndex, ctx.toolTplRef, _c0, 5, TemplateRef)(dirIndex, ctx.prevTplRef, _c1, 5, TemplateRef)(dirIndex, ctx.contentTplRef, _c2, 5, TemplateRef)(dirIndex, ctx.nextTplRef, _c3, 5, TemplateRef);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance(4);
+        } }, viewQuery: function SdDataDetail_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuerySignal(ctx.formCtrl, _c4, 5)(ctx.modalActionTplRef, _c5, 5, TemplateRef);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance(2);
+        } }, hostBindings: function SdDataDetail_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("sdRefreshCommand", function SdDataDetail_sdRefreshCommand_HostBindingHandler() { return ctx.onRefreshButtonClick(); })("sdSaveCommand", function SdDataDetail_sdSaveCommand_HostBindingHandler() { return ctx.onSubmitButtonClick(); });
+        } }, decls: 8, vars: 6, consts: [["pageTopbarTpl", ""], ["contentTpl", ""], ["modalActionTpl", ""], ["formCtrl", ""], ["modalBottomTpl", ""], [3, "busy", "busyMessage", "viewType", "initialized", "restricted"], [3, "theme"], [3, "click", "theme"], [3, "svg"], [1, "flex-column", "fill"], [1, "p-default", "flex-row", "gap-default", "bdb", "bdb-theme-gray-lightest"], [1, "flex-fill"], [3, "formSubmit"], [3, "ngTemplateOutlet"], [1, "p-sm-default", 3, "bg-theme-gray-lightest"], [1, "p-sm-default"], [1, "p-sm-default", "flex-row", "gap-sm"], [1, "flex-fill", "flex-row", "gap-sm", "main-align-end"], [3, "click", "size", "theme"], [3, "size", "theme"], ["title", "\uC0C8\uB85C\uACE0\uCE68(CTRL+ALT+L)", 1, "p-sm-default", 3, "click", "theme"]], template: function SdDataDetail_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "sd-base-container", 5);
+            i0.ɵɵtemplate(1, SdDataDetail_ng_template_1_Template, 6, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(3, SdDataDetail_ng_template_3_Template, 9, 5, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵconditionalCreate(5, SdDataDetail_Conditional_5_Template, 2, 0);
+            i0.ɵɵtemplate(6, SdDataDetail_ng_template_6_Template, 2, 2, "ng-template", null, 2, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵproperty("busy", ctx.parent.busyCount() > 0)("busyMessage", ctx.parent.busyMessage())("viewType", ctx.parent.viewType())("initialized", ctx.parent.initialized())("restricted", !ctx.parent.canUse());
+            i0.ɵɵadvance(5);
+            i0.ɵɵconditional(ctx.parent.canEdit() ? 5 : -1);
+        } }, dependencies: [SdBaseContainer,
+            SdForm,
+            SdButton,
+            NgTemplateOutlet,
+            SdAnchor,
+            NgIcon,
+            FormatPipe], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdDataDetail, [{
+        type: Component,
+        args: [{
+                selector: "sd-data-detail",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                encapsulation: ViewEncapsulation.None,
+                standalone: true,
+                imports: [
+                    SdBaseContainer,
+                    SdForm,
+                    SdButton,
+                    NgTemplateOutlet,
+                    FormatPipe,
+                    SdAnchor,
+                    NgIcon,
+                ],
+                host: {
+                    "(sdRefreshCommand)": "onRefreshButtonClick()",
+                    "(sdSaveCommand)": "onSubmitButtonClick()",
+                },
+                template: `
+    <sd-base-container
+      [busy]="parent.busyCount() > 0"
+      [busyMessage]="parent.busyMessage()"
+      [viewType]="parent.viewType()"
+      [initialized]="parent.initialized()"
+      [restricted]="!parent.canUse()"
+    >
+      <ng-template #pageTopbarTpl>
+        @if (parent.canEdit() && parent.submit) {
+          <sd-button [theme]="'link-primary'" (click)="onSubmitButtonClick()">
+            <ng-icon [svg]="icons.tablerDeviceFloppy" />
+            저장
+            <small>(CTRL+S)</small>
+          </sd-button>
+        }
+        <sd-button [theme]="'link-info'" (click)="onRefreshButtonClick()">
+          <ng-icon [svg]="icons.tablerRefresh" />
+          새로고침
+          <small>(CTRL+ALT+L)</small>
+        </sd-button>
+      </ng-template>
+
+      <ng-template #contentTpl>
+        <div class="flex-column fill">
+          @if ((parent.viewType() === "control" && parent.canEdit()) || toolTplRef()) {
+            <div class="p-default flex-row gap-default bdb bdb-theme-gray-lightest">
+              @if (parent.viewType() === "control" && parent.canEdit()) {
+                @if (parent.submit) {
+                  <sd-button [theme]="'primary'" (click)="onSubmitButtonClick()">
+                    <ng-icon [svg]="icons.tablerDeviceFloppy" />
+                    저장
+                    <small>(CTRL+S)</small>
+                  </sd-button>
+                  <sd-button [theme]="'info'" (click)="onRefreshButtonClick()">
+                    <ng-icon [svg]="icons.tablerRefresh" />
+                    새로고침
+                    <small>(CTRL+ALT+L)</small>
+                  </sd-button>
+                }
+                @if (
+                  !parent.dataInfo()?.isNew &&
+                  parent.toggleDelete &&
+                  (!parent.canDelete || parent.canDelete())
+                ) {
+                  @if (parent.dataInfo()?.isDeleted) {
+                    <sd-button [theme]="'warning'" (click)="onRestoreButtonClick()">
+                      <ng-icon [svg]="icons.tablerRestore" />
+                      복구
+                    </sd-button>
+                  } @else {
+                    <sd-button [theme]="'danger'" (click)="onDeleteButtonClick()">
+                      <ng-icon [svg]="icons.tablerEraser" />
+                      삭제
+                    </sd-button>
+                  }
+                }
+              }
+
+              <ng-template [ngTemplateOutlet]="toolTplRef() ?? null" />
+            </div>
+          }
+
+          @if (prevTplRef()) {
+            <div>
+              <ng-template [ngTemplateOutlet]="prevTplRef() ?? null" />
+            </div>
+          }
+
+          <div class="flex-fill">
+            <sd-form #formCtrl (formSubmit)="onSubmit()">
+              <ng-template [ngTemplateOutlet]="contentTplRef()" />
+            </sd-form>
+          </div>
+
+          @if (parent.dataInfo()?.lastModifiedAt || parent.dataInfo()?.lastModifiedBy) {
+            <div
+              class="p-sm-default"
+              [class.bg-theme-gray-lightest]="parent.viewType() === 'modal'"
+            >
+              최종수정:
+              @if (parent.dataInfo()?.lastModifiedAt) {
+                {{ parent.dataInfo()!.lastModifiedAt | format: "yyyy-MM-dd HH:mm" }}
+              }
+              @if (parent.dataInfo()?.lastModifiedBy) {
+                ({{ parent.dataInfo()?.lastModifiedBy }})
+              }
+            </div>
+          }
+
+          @if (nextTplRef()) {
+            <div>
+              <ng-template [ngTemplateOutlet]="nextTplRef() ?? null" />
+            </div>
+          }
+        </div>
+      </ng-template>
+
+      @if (parent.canEdit()) {
+        <ng-template #modalBottomTpl>
+          <div class="p-sm-default flex-row gap-sm">
+            @if (
+              !parent.dataInfo()?.isNew &&
+              parent.toggleDelete &&
+              (!parent.canDelete || parent.canDelete())
+            ) {
+              @if (parent.dataInfo()?.isDeleted) {
+                <sd-button [size]="'sm'" [theme]="'warning'" (click)="onRestoreButtonClick()">
+                  복구
+                </sd-button>
+              } @else {
+                <sd-button [size]="'sm'" [theme]="'danger'" (click)="onDeleteButtonClick()">
+                  삭제
+                </sd-button>
+              }
+            }
+
+            <div class="flex-fill flex-row gap-sm main-align-end">
+              <sd-button [size]="'sm'" [theme]="'primary'" (click)="onSubmitButtonClick()">
+                확인
+              </sd-button>
+            </div>
+          </div>
+        </ng-template>
+      }
+
+      <ng-template #modalActionTpl>
+        <sd-anchor
+          [theme]="'gray'"
+          class="p-sm-default"
+          (click)="onRefreshButtonClick()"
+          title="새로고침(CTRL+ALT+L)"
+        >
+          <ng-icon [svg]="icons.tablerRefresh" />
+        </sd-anchor>
+      </ng-template>
+    </sd-base-container>
+  `,
+            }]
+    }], () => [], { formCtrl: [{ type: i0.ViewChild, args: ["formCtrl", { isSignal: true }] }], toolTplRef: [{ type: i0.ContentChild, args: ["toolTpl", { ...{ read: TemplateRef }, isSignal: true }] }], prevTplRef: [{ type: i0.ContentChild, args: ["prevTpl", { ...{ read: TemplateRef }, isSignal: true }] }], contentTplRef: [{ type: i0.ContentChild, args: ["contentTpl", { ...{ read: TemplateRef }, isSignal: true }] }], nextTplRef: [{ type: i0.ContentChild, args: ["nextTpl", { ...{ read: TemplateRef }, isSignal: true }] }], modalActionTplRef: [{ type: i0.ViewChild, args: ["modalActionTpl", { ...{ read: TemplateRef }, isSignal: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdDataDetail, { className: "SdDataDetail", filePath: "packages/angular/src/data/data-detail/sd-data-detail.ts", lineNumber: 187, forbidOrphanRendering: true }); })();

package/dist/data/data-select-button/sd-data-select-button.base.d.ts

@@ -0,0 +1,24 @@
+import { type Signal } from "@angular/core";
+import type { SelectModeValue } from "../../controls/select/sd-select";
+import { type SdModalOptions } from "../../core/modal/sd-modal.provider";
+import type { SdSelectModal, SdSelectModalInfo } from "../../controls/button/sd-modal-select-button";
+import * as i0 from "@angular/core";
+export declare abstract class SdDataSelectButtonBase<TItem extends object, TKey, TMode extends keyof SelectModeValue<TKey> = keyof SelectModeValue<TKey>> {
+    abstract modal: Signal<SdSelectModalInfo<SdSelectModal<any>>>;
+    abstract load(keys: TKey[]): Promise<TItem[]> | TItem[];
+    private readonly _sdModal;
+    value: import("@angular/core").ModelSignal<SelectModeValue<TKey>[TMode] | undefined>;
+    disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    required: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    inset: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    size: import("@angular/core").InputSignal<"sm" | "lg" | undefined>;
+    selectMode: import("@angular/core").InputSignal<TMode>;
+    isNoValue: Signal<boolean>;
+    selectedItems: import("@angular/core").WritableSignal<TItem[]>;
+    constructor();
+    doShowModal(options?: SdModalOptions): Promise<void>;
+    doInitialValue(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDataSelectButtonBase<any, any, any>, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdDataSelectButtonBase<any, any, any>, never, never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "inset": { "alias": "inset"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "selectMode": { "alias": "selectMode"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
+}
+//# sourceMappingURL=sd-data-select-button.base.d.ts.map

package/dist/data/data-select-button/sd-data-select-button.base.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-data-select-button.base.d.ts","sourceRoot":"","sources":["../../../src/data/data-select-button/sd-data-select-button.base.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,MAAM,EACZ,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAEL,KAAK,cAAc,EACpB,MAAM,oCAAoC,CAAC;AAC5C,OAAO,KAAK,EACV,aAAa,EACb,iBAAiB,EAClB,MAAM,8CAA8C,CAAC;;AAGtD,8BACsB,sBAAsB,CAC1C,KAAK,SAAS,MAAM,EACpB,IAAI,EACJ,KAAK,SAAS,MAAM,eAAe,CAAC,IAAI,CAAC,GAAG,MAAM,eAAe,CAAC,IAAI,CAAC;IAGvE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,iBAAiB,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;IAC9D,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,OAAO,CAAC,KAAK,EAAE,CAAC,GAAG,KAAK,EAAE;IAIvD,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA2B;IAEpD,KAAK,gFAAyC;IAE9C,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,KAAK,qEAAiD;IACtD,IAAI,+DAAwB;IAC5B,UAAU,6CAAmC;IAE7C,SAAS,kBAKN;IAEH,aAAa,kDAAuB;;IAyB9B,WAAW,CAAC,OAAO,CAAC,EAAE,cAAc,GAAG,OAAO,CAAC,IAAI,CAAC;IAwB1D,cAAc,IAAI,IAAI;yCA7EF,sBAAsB;2CAAtB,sBAAsB;CAgF3C"}

package/dist/data/data-select-button/sd-data-select-button.base.js

@@ -0,0 +1,68 @@
+import { booleanAttribute, computed, Directive, effect, inject, input, model, signal, } from "@angular/core";
+import { SdModalProvider, } from "../../core/modal/sd-modal.provider";
+import { setupInvalid } from "../../core/validation/setupInvalid";
+import * as i0 from "@angular/core";
+export class SdDataSelectButtonBase {
+    //-- implement
+    _sdModal = inject(SdModalProvider);
+    value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
+    selectMode = input("single", ...(ngDevMode ? [{ debugName: "selectMode" }] : /* istanbul ignore next */ []));
+    isNoValue = computed(() => {
+        const v = this.value();
+        if (v == null)
+            return true;
+        if (Array.isArray(v))
+            return v.length === 0;
+        return false;
+    }, ...(ngDevMode ? [{ debugName: "isNoValue" }] : /* istanbul ignore next */ []));
+    selectedItems = signal([], ...(ngDevMode ? [{ debugName: "selectedItems" }] : /* istanbul ignore next */ []));
+    constructor() {
+        setupInvalid(() => (this.required() && this.value() == null ? "값을 입력하세요." : ""));
+        effect(() => {
+            const value = this.value();
+            const selectMode = this.selectMode();
+            queueMicrotask(async () => {
+                if (selectMode === "multi" &&
+                    Array.isArray(value) &&
+                    value.filterExists().length > 0) {
+                    this.selectedItems.set(await this.load(value.filterExists()));
+                }
+                else if (selectMode === "single" && !Array.isArray(value) && value != null) {
+                    this.selectedItems.set(await this.load([value]));
+                }
+                else {
+                    this.selectedItems.set([]);
+                }
+            });
+        });
+    }
+    async doShowModal(options) {
+        const modal = this.modal();
+        const result = await this._sdModal.showAsync({
+            ...modal,
+            inputs: {
+                selectMode: this.selectMode(),
+                selectedItemKeys: (this.selectMode() === "multi"
+                    ? (this.value() ?? [])
+                    : [this.value()]).filterExists(),
+                ...modal.inputs,
+            },
+        }, options);
+        if (result) {
+            const newValue = this.selectMode() === "multi" ? result.selectedItemKeys : result.selectedItemKeys[0];
+            this.value.set(newValue);
+        }
+    }
+    doInitialValue() {
+        this.value.set((this.selectMode() === "multi" ? [] : undefined));
+    }
+    static ɵfac = function SdDataSelectButtonBase_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdDataSelectButtonBase)(); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SdDataSelectButtonBase, inputs: { value: [1, "value"], disabled: [1, "disabled"], required: [1, "required"], inset: [1, "inset"], size: [1, "size"], selectMode: [1, "selectMode"] }, outputs: { value: "valueChange" } });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdDataSelectButtonBase, [{
+        type: Directive
+    }], () => [], { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], selectMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMode", required: false }] }] }); })();

package/dist/data/data-select-button/sd-data-select-button.d.ts

@@ -0,0 +1,15 @@
+import { TemplateRef } from "@angular/core";
+import { type SdItemOfTemplateContext } from "../../core/template/sd-item-of-template";
+import { SdDataSelectButtonBase } from "./sd-data-select-button.base";
+import * as i0 from "@angular/core";
+export declare class SdDataSelectButton {
+    parent: SdDataSelectButtonBase<any, any, keyof import("../..").SelectModeValue<TKey>>;
+    itemTplRef: import("@angular/core").Signal<TemplateRef<SdItemOfTemplateContext<any>> | undefined>;
+    onSearchClick(event: MouseEvent): Promise<void>;
+    onEraseClick(): void;
+    protected readonly tablerEraser = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"></path><path d=\"M19 20h-10.5l-4.21 -4.3a1 1 0 0 1 0 -1.41l10 -10a1 1 0 0 1 1.41 0l5 5a1 1 0 0 1 0 1.41l-9.2 9.3\"></path><path d=\"M18 13.3l-6.3 -6.3\"></path></svg>";
+    protected readonly tablerSearch = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"></path><path d=\"M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0\"></path><path d=\"M21 21l-6 -6\"></path></svg>";
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDataSelectButton, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdDataSelectButton, "sd-data-select-button", never, {}, {}, ["itemTplRef"], ["*"], true, never>;
+}
+//# sourceMappingURL=sd-data-select-button.d.ts.map

package/dist/data/data-select-button/sd-data-select-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-data-select-button.d.ts","sourceRoot":"","sources":["../../../src/data/data-select-button/sd-data-select-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,WAAW,EAEZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAEL,KAAK,uBAAuB,EAC7B,MAAM,yCAAyC,CAAC;AAQjD,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAC;;AAItE,qBA4Da,kBAAkB;IAC7B,MAAM,gFAAoD;IAE1D,UAAU,wFAGR;IAEI,aAAa,CAAC,KAAK,EAAE,UAAU,GAAG,OAAO,CAAC,IAAI,CAAC;IAMrD,YAAY,IAAI,IAAI;IAIpB,SAAS,CAAC,QAAQ,CAAC,YAAY,obAAgB;IAC/C,SAAS,CAAC,QAAQ,CAAC,YAAY,yXAAgB;yCAnBpC,kBAAkB;2CAAlB,kBAAkB;CAoB9B"}