@simplysm/angular 14.0.1 → 14.0.5

package/dist/ui/data/list/sd-list-item.control.d.ts

@@ -0,0 +1,18 @@
+import { TemplateRef } from "@angular/core";
+import * as i0 from "@angular/core";
+export declare class SdListItemControl {
+    layout: import("@angular/core").InputSignal<"flat" | "accordion">;
+    open: import("@angular/core").ModelSignal<boolean>;
+    selected: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    selectedIcon: import("@angular/core").InputSignal<string | undefined>;
+    readonly: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    toolTpl: import("@angular/core").Signal<TemplateRef<void> | undefined>;
+    private readonly _childLists;
+    hasChildren: import("@angular/core").Signal<boolean>;
+    childrenOpen: import("@angular/core").Signal<boolean>;
+    constructor();
+    onContentClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdListItemControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdListItemControl, "sd-list-item", never, { "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "open": { "alias": "open"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "selectedIcon": { "alias": "selectedIcon"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, ["toolTpl", "_childLists"], ["*", "sd-list"], true, never>;
+}
+//# sourceMappingURL=sd-list-item.control.d.ts.map

package/dist/ui/data/list/sd-list-item.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-list-item.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\data\\list\\sd-list-item.control.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,WAAW,EAEZ,MAAM,eAAe,CAAC;;AAQvB,qBAgGa,iBAAiB;IAC5B,MAAM,4DAA4C;IAClD,IAAI,+CAAgB;IACpB,QAAQ,qEAAiD;IACzD,YAAY,0DAAmB;IAC/B,QAAQ,qEAAiD;IAEzD,OAAO,gEAA8C;IAErD,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAkC;IAE9D,WAAW,0CAAiD;IAE5D,YAAY,0CAET;;IAMH,cAAc,IAAI,IAAI;yCArBX,iBAAiB;2CAAjB,iBAAiB;CA2B7B"}

package/dist/ui/data/list/sd-list-item.control.js

@@ -0,0 +1,130 @@
+import { booleanAttribute, ChangeDetectionStrategy, Component, computed, contentChild, contentChildren, input, model, TemplateRef, ViewEncapsulation, } from "@angular/core";
+import { NgTemplateOutlet } from "@angular/common";
+import { NgIcon } from "@ng-icons/core";
+import { SdCollapseControl } from "../../navigation/collapse/sd-collapse.control";
+import { SdCollapseIconControl } from "../../navigation/collapse/sd-collapse-icon.control";
+import { SdListControl } from "./sd-list.control";
+import { setupRipple } from "../../../core/utils/setups/setupRipple";
+import * as i0 from "@angular/core";
+const _c0 = ["toolTpl"];
+const _c1 = ["*", [["sd-list"]]];
+const _c2 = ["*", "sd-list"];
+function SdListItemControl_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "sd-collapse-icon", 1);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("open", ctx_r0.open());
+} }
+function SdListItemControl_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ng-icon", 5);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("tx-theme-primary-default", ctx_r0.selected())("tx-trans-lightest", !ctx_r0.selected());
+    i0.ɵɵproperty("svg", ctx_r0.selectedIcon());
+} }
+function SdListItemControl_Conditional_5_ng_template_1_Template(rf, ctx) { }
+function SdListItemControl_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 4);
+    i0.ɵɵtemplate(1, SdListItemControl_Conditional_5_ng_template_1_Template, 0, 0, "ng-template", 6);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.toolTpl());
+} }
+function SdListItemControl_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-collapse", 1);
+    i0.ɵɵprojection(1, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("open", ctx_r0.childrenOpen());
+} }
+export class SdListItemControl {
+    layout = input("accordion", ...(ngDevMode ? [{ debugName: "layout" }] : /* istanbul ignore next */ []));
+    open = model(false, ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    selected = input(false, { ...(ngDevMode ? { debugName: "selected" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    selectedIcon = input(...(ngDevMode ? [undefined, { debugName: "selectedIcon" }] : /* istanbul ignore next */ []));
+    readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    toolTpl = contentChild("toolTpl", ...(ngDevMode ? [{ debugName: "toolTpl" }] : /* istanbul ignore next */ []));
+    _childLists = contentChildren(SdListControl, ...(ngDevMode ? [{ debugName: "_childLists" }] : /* istanbul ignore next */ []));
+    hasChildren = computed(() => this._childLists().length > 0, ...(ngDevMode ? [{ debugName: "hasChildren" }] : /* istanbul ignore next */ []));
+    childrenOpen = computed(() => {
+        return this.layout() === "flat" ? true : this.open();
+    }, ...(ngDevMode ? [{ debugName: "childrenOpen" }] : /* istanbul ignore next */ []));
+    constructor() {
+        setupRipple(() => !this.readonly() && !(this.layout() === "flat" && this.hasChildren()));
+    }
+    onContentClick() {
+        if (this.readonly())
+            return;
+        if (this.layout() === "accordion" && this.hasChildren()) {
+            this.open.update((v) => !v);
+        }
+    }
+    static ɵfac = function SdListItemControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdListItemControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdListItemControl, selectors: [["sd-list-item"]], contentQueries: function SdListItemControl_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuerySignal(dirIndex, ctx.toolTpl, _c0, 5)(dirIndex, ctx._childLists, SdListControl, 4);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance(2);
+        } }, hostVars: 4, hostBindings: function SdListItemControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-layout", ctx.layout())("data-sd-selected", ctx.selected())("data-sd-readonly", ctx.readonly())("data-sd-has-children", ctx.hasChildren());
+        } }, inputs: { layout: [1, "layout"], open: [1, "open"], selected: [1, "selected"], selectedIcon: [1, "selectedIcon"], readonly: [1, "readonly"] }, outputs: { open: "openChange" }, ngContentSelectors: _c2, decls: 7, vars: 4, consts: [["tabindex", "0", 1, "_content", 3, "click", "keydown.enter"], [3, "open"], [3, "tx-theme-primary-default", "tx-trans-lightest", "svg"], [1, "_label"], [1, "_tool"], [3, "svg"], [3, "ngTemplateOutlet"]], template: function SdListItemControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef(_c1);
+            i0.ɵɵelementStart(0, "div", 0);
+            i0.ɵɵlistener("click", function SdListItemControl_Template_div_click_0_listener() { return ctx.onContentClick(); })("keydown.enter", function SdListItemControl_Template_div_keydown_enter_0_listener() { return ctx.onContentClick(); });
+            i0.ɵɵconditionalCreate(1, SdListItemControl_Conditional_1_Template, 1, 1, "sd-collapse-icon", 1);
+            i0.ɵɵconditionalCreate(2, SdListItemControl_Conditional_2_Template, 1, 5, "ng-icon", 2);
+            i0.ɵɵelementStart(3, "div", 3);
+            i0.ɵɵprojection(4);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(5, SdListItemControl_Conditional_5_Template, 2, 1, "div", 4);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(6, SdListItemControl_Conditional_6_Template, 2, 1, "sd-collapse", 1);
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.layout() === "accordion" && ctx.hasChildren() ? 1 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.selectedIcon() !== undefined && !ctx.hasChildren() ? 2 : -1);
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.toolTpl() ? 5 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.hasChildren() ? 6 : -1);
+        } }, dependencies: [SdCollapseControl, SdCollapseIconControl, NgTemplateOutlet, NgIcon], styles: ["sd-list-item {\n  display: block;\n}\nsd-list-item > ._content {\n  display: flex;\n  align-items: center;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  gap: var(--gap-sm);\n}\nsd-list-item > ._content > ._label {\n  flex: 1;\n}\nsd-list-item:hover > ._content {\n  background: var(--trans-lighter);\n}\nsd-list-item[data-sd-selected=true] > ._content {\n  background: var(--trans-lighter);\n  font-weight: bold;\n}\nsd-list-item[data-sd-readonly=true] > ._content {\n  cursor: default;\n}\nsd-list-item[data-sd-readonly=true]:hover > ._content {\n  background: transparent;\n}\nsd-list-item[data-sd-layout=flat] > ._content {\n  font-size: 0.85em;\n  opacity: 0.7;\n  cursor: default;\n}\nsd-list-item[data-sd-layout=flat]:hover > ._content {\n  background: transparent;\n}\nsd-list-item[data-sd-has-children=false] > ._content {\n  padding-left: calc(var(--gap-default) + var(--gap-sm) + 0.75em);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdListItemControl, [{
+        type: Component,
+        args: [{ selector: "sd-list-item", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdCollapseControl, SdCollapseIconControl, NgTemplateOutlet, NgIcon], template: `
+    <div class="_content" tabindex="0" (click)="onContentClick()" (keydown.enter)="onContentClick()">
+      @if (layout() === "accordion" && hasChildren()) {
+        <sd-collapse-icon [open]="open()" />
+      }
+      @if (selectedIcon() !== undefined && !hasChildren()) {
+        <ng-icon
+          [class.tx-theme-primary-default]="selected()"
+          [class.tx-trans-lightest]="!selected()"
+          [svg]="selectedIcon()!"
+        />
+      }
+      <div class="_label">
+        <ng-content />
+      </div>
+      @if (toolTpl()) {
+        <div class="_tool">
+          <ng-template [ngTemplateOutlet]="toolTpl()!" />
+        </div>
+      }
+    </div>
+    @if (hasChildren()) {
+      <sd-collapse [open]="childrenOpen()">
+        <ng-content select="sd-list" />
+      </sd-collapse>
+    }
+  `, host: {
+                    "[attr.data-sd-layout]": "layout()",
+                    "[attr.data-sd-selected]": "selected()",
+                    "[attr.data-sd-readonly]": "readonly()",
+                    "[attr.data-sd-has-children]": "hasChildren()",
+                }, styles: ["sd-list-item {\n  display: block;\n}\nsd-list-item > ._content {\n  display: flex;\n  align-items: center;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  gap: var(--gap-sm);\n}\nsd-list-item > ._content > ._label {\n  flex: 1;\n}\nsd-list-item:hover > ._content {\n  background: var(--trans-lighter);\n}\nsd-list-item[data-sd-selected=true] > ._content {\n  background: var(--trans-lighter);\n  font-weight: bold;\n}\nsd-list-item[data-sd-readonly=true] > ._content {\n  cursor: default;\n}\nsd-list-item[data-sd-readonly=true]:hover > ._content {\n  background: transparent;\n}\nsd-list-item[data-sd-layout=flat] > ._content {\n  font-size: 0.85em;\n  opacity: 0.7;\n  cursor: default;\n}\nsd-list-item[data-sd-layout=flat]:hover > ._content {\n  background: transparent;\n}\nsd-list-item[data-sd-has-children=false] > ._content {\n  padding-left: calc(var(--gap-default) + var(--gap-sm) + 0.75em);\n}"] }]
+    }], () => [], { layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], selected: [{ type: i0.Input, args: [{ isSignal: true, alias: "selected", required: false }] }], selectedIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedIcon", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], toolTpl: [{ type: i0.ContentChild, args: ["toolTpl", { isSignal: true }] }], _childLists: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdListControl), { isSignal: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdListItemControl, { className: "SdListItemControl", filePath: "packages/angular/src/ui/data/list/sd-list-item.control.ts", lineNumber: 116 }); })();

package/dist/ui/data/list/sd-list.control.d.ts

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class SdListControl {
+    inset: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdListControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdListControl, "sd-list", never, { "inset": { "alias": "inset"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-list.control.d.ts.map

package/dist/ui/data/list/sd-list.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-list.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\data\\list\\sd-list.control.ts"],"names":[],"mappings":";AAQA,qBA8Ba,aAAa;IACxB,KAAK,qEAAiD;yCAD3C,aAAa;2CAAb,aAAa;CAEzB"}

package/dist/ui/data/list/sd-list.control.js

@@ -0,0 +1,22 @@
+import { booleanAttribute, ChangeDetectionStrategy, Component, input, ViewEncapsulation, } from "@angular/core";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdListControl {
+    inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    static ɵfac = function SdListControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdListControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdListControl, selectors: [["sd-list"]], hostVars: 1, hostBindings: function SdListControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-inset", ctx.inset());
+        } }, inputs: { inset: [1, "inset"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdListControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-list {\n  display: block;\n  user-select: none;\n  background: var(--control-color);\n}\nsd-list[data-sd-inset=true] {\n  background: transparent;\n}\nsd-list[data-sd-inset=true] sd-list {\n  background: transparent;\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdListControl, [{
+        type: Component,
+        args: [{ selector: "sd-list", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
+    <ng-content />
+  `, host: {
+                    "[attr.data-sd-inset]": "inset()",
+                }, styles: ["sd-list {\n  display: block;\n  user-select: none;\n  background: var(--control-color);\n}\nsd-list[data-sd-inset=true] {\n  background: transparent;\n}\nsd-list[data-sd-inset=true] sd-list {\n  background: transparent;\n}"] }]
+    }], null, { inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdListControl, { className: "SdListControl", filePath: "packages/angular/src/ui/data/list/sd-list.control.ts", lineNumber: 39 }); })();

package/dist/ui/data/sheet/sd-sheet-column.directive.d.ts

@@ -0,0 +1,18 @@
+import { TemplateRef } from "@angular/core";
+import * as i0 from "@angular/core";
+export declare class SdSheetColumnDirective {
+    key: import("@angular/core").InputSignal<string>;
+    header: import("@angular/core").InputSignal<string | string[]>;
+    width: import("@angular/core").InputSignal<string | undefined>;
+    fixed: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    hidden: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    collapse: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    disableSorting: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    disableResizing: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    ordering: import("@angular/core").InputSignal<number>;
+    cellTplRef: import("@angular/core").Signal<TemplateRef<void> | undefined>;
+    summaryTplRef: import("@angular/core").Signal<TemplateRef<void> | undefined>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSheetColumnDirective, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<SdSheetColumnDirective, "sd-sheet-column", never, { "key": { "alias": "key"; "required": true; "isSignal": true; }; "header": { "alias": "header"; "required": false; "isSignal": true; }; "width": { "alias": "width"; "required": false; "isSignal": true; }; "fixed": { "alias": "fixed"; "required": false; "isSignal": true; }; "hidden": { "alias": "hidden"; "required": false; "isSignal": true; }; "collapse": { "alias": "collapse"; "required": false; "isSignal": true; }; "disableSorting": { "alias": "disableSorting"; "required": false; "isSignal": true; }; "disableResizing": { "alias": "disableResizing"; "required": false; "isSignal": true; }; "ordering": { "alias": "ordering"; "required": false; "isSignal": true; }; }, {}, ["cellTplRef", "summaryTplRef"], never, true, never>;
+}
+//# sourceMappingURL=sd-sheet-column.directive.d.ts.map

package/dist/ui/data/sheet/sd-sheet-column.directive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sheet-column.directive.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\data\\sheet\\sd-sheet-column.directive.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,WAAW,EACZ,MAAM,eAAe,CAAC;;AAEvB,qBAIa,sBAAsB;IACjC,GAAG,8CAA4B;IAC/B,MAAM,yDAAgC;IACtC,KAAK,0DAAmB;IACxB,KAAK,qEAAiD;IACtD,MAAM,qEAAiD;IACvD,QAAQ,qEAAiD;IACzD,cAAc,qEAAiD;IAC/D,eAAe,qEAAiD;IAChE,QAAQ,8CAAY;IAEpB,UAAU,gEAA8C;IACxD,aAAa,gEAAiD;yCAZnD,sBAAsB;2CAAtB,sBAAsB;CAalC"}

package/dist/ui/data/sheet/sd-sheet-column.directive.js

@@ -0,0 +1,30 @@
+import { booleanAttribute, contentChild, Directive, input, TemplateRef, } from "@angular/core";
+import * as i0 from "@angular/core";
+const _c0 = ["cellTpl"];
+const _c1 = ["summaryTpl"];
+export class SdSheetColumnDirective {
+    key = input.required(...(ngDevMode ? [{ debugName: "key" }] : /* istanbul ignore next */ []));
+    header = input("", ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
+    width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
+    fixed = input(false, { ...(ngDevMode ? { debugName: "fixed" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    hidden = input(false, { ...(ngDevMode ? { debugName: "hidden" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    collapse = input(false, { ...(ngDevMode ? { debugName: "collapse" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disableSorting = input(false, { ...(ngDevMode ? { debugName: "disableSorting" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    disableResizing = input(false, { ...(ngDevMode ? { debugName: "disableResizing" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    ordering = input(0, ...(ngDevMode ? [{ debugName: "ordering" }] : /* istanbul ignore next */ []));
+    cellTplRef = contentChild("cellTpl", ...(ngDevMode ? [{ debugName: "cellTplRef" }] : /* istanbul ignore next */ []));
+    summaryTplRef = contentChild("summaryTpl", ...(ngDevMode ? [{ debugName: "summaryTplRef" }] : /* istanbul ignore next */ []));
+    static ɵfac = function SdSheetColumnDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSheetColumnDirective)(); };
+    static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: SdSheetColumnDirective, selectors: [["sd-sheet-column"]], contentQueries: function SdSheetColumnDirective_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuerySignal(dirIndex, ctx.cellTplRef, _c0, 5)(dirIndex, ctx.summaryTplRef, _c1, 5);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance(2);
+        } }, inputs: { key: [1, "key"], header: [1, "header"], width: [1, "width"], fixed: [1, "fixed"], hidden: [1, "hidden"], collapse: [1, "collapse"], disableSorting: [1, "disableSorting"], disableResizing: [1, "disableResizing"], ordering: [1, "ordering"] } });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSheetColumnDirective, [{
+        type: Directive,
+        args: [{
+                selector: "sd-sheet-column",
+                standalone: true,
+            }]
+    }], null, { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "key", required: true }] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], fixed: [{ type: i0.Input, args: [{ isSignal: true, alias: "fixed", required: false }] }], hidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "hidden", required: false }] }], collapse: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapse", required: false }] }], disableSorting: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableSorting", required: false }] }], disableResizing: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableResizing", required: false }] }], ordering: [{ type: i0.Input, args: [{ isSignal: true, alias: "ordering", required: false }] }], cellTplRef: [{ type: i0.ContentChild, args: ["cellTpl", { isSignal: true }] }], summaryTplRef: [{ type: i0.ContentChild, args: ["summaryTpl", { isSignal: true }] }] }); })();

package/dist/ui/data/sheet/sd-sheet-config.modal.d.ts

@@ -0,0 +1,39 @@
+import type { ISdModal } from "../../overlay/modal/sd-modal.provider";
+import type { ISdSheetConfig } from "./types";
+import type { SdSheetColumnDirective } from "./sd-sheet-column.directive";
+import * as i0 from "@angular/core";
+interface IConfigItem {
+    key: string;
+    header: string;
+    fixed: boolean;
+    hidden: boolean;
+    width: string;
+    ordering: number;
+}
+export declare class SdSheetConfigModal implements ISdModal<ISdSheetConfig | undefined> {
+    initialized: import("@angular/core").WritableSignal<boolean>;
+    close: import("@angular/core").OutputEmitterRef<ISdSheetConfig | undefined>;
+    controls: import("@angular/core").InputSignal<readonly SdSheetColumnDirective[]>;
+    config: import("@angular/core").InputSignal<ISdSheetConfig | undefined>;
+    _icons: {
+        tablerArrowUp: string;
+        tablerArrowDown: string;
+    };
+    private readonly _initialItems;
+    private readonly _editItems;
+    _items: import("@angular/core").Signal<IConfigItem[]>;
+    onFixedToggle(idx: number): void;
+    onHiddenToggle(idx: number): void;
+    onWidthChange(idx: number, event: Event): void;
+    canMoveUp(idx: number): boolean;
+    canMoveDown(idx: number): boolean;
+    onMoveUp(idx: number): void;
+    onMoveDown(idx: number): void;
+    onOk(): void;
+    onCancel(): void;
+    onReset(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSheetConfigModal, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSheetConfigModal, "sd-sheet-config-modal", never, { "controls": { "alias": "controls"; "required": true; "isSignal": true; }; "config": { "alias": "config"; "required": true; "isSignal": true; }; }, { "close": "close"; }, never, never, true, never>;
+}
+export {};
+//# sourceMappingURL=sd-sheet-config.modal.d.ts.map

package/dist/ui/data/sheet/sd-sheet-config.modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sheet-config.modal.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\data\\sheet\\sd-sheet-config.modal.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;;AAM1E,UAAU,WAAW;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,qBAoHa,kBAAmB,YAAW,QAAQ,CAAC,cAAc,GAAG,SAAS,CAAC;IAC7E,WAAW,kDAAgB;IAC3B,KAAK,uEAAwC;IAE7C,QAAQ,yEAAuD;IAC/D,MAAM,kEAAgD;IAEtD,MAAM;;;MAAsC;IAE5C,OAAO,CAAC,QAAQ,CAAC,aAAa,CAiB3B;IAEH,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAgD;IAE3E,MAAM,gDAEH;IAEH,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAMhC,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAMjC,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG,IAAI;IAO9C,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAU/B,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAUjC,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAO3B,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAO7B,IAAI,IAAI,IAAI;IAeZ,QAAQ,IAAI,IAAI;IAIhB,OAAO,IAAI,IAAI;yCA1GJ,kBAAkB;2CAAlB,kBAAkB;CA6G9B"}

package/dist/ui/data/sheet/sd-sheet-config.modal.js

@@ -0,0 +1,258 @@
+import { ChangeDetectionStrategy, Component, computed, input, output, signal, ViewEncapsulation, } from "@angular/core";
+import { SdButtonControl } from "../../form/button/sd-button.control";
+import { SdCheckboxControl } from "../../form/checkbox/sd-checkbox.control";
+import { NgIcon } from "@ng-icons/core";
+import { tablerArrowUp, tablerArrowDown } from "@ng-icons/tabler-icons";
+import * as i0 from "@angular/core";
+const _forTrack0 = ($index, $item) => $item.key;
+function SdSheetConfigModal_For_16_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "tr")(1, "td")(2, "sd-checkbox", 5);
+    i0.ɵɵlistener("click", function SdSheetConfigModal_For_16_Template_sd_checkbox_click_2_listener() { const ɵ$index_26_r2 = i0.ɵɵrestoreView(_r1).$index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onFixedToggle(ɵ$index_26_r2)); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(3, "td", 6)(4, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdSheetConfigModal_For_16_Template_sd_button_click_4_listener() { const ɵ$index_26_r2 = i0.ɵɵrestoreView(_r1).$index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onMoveUp(ɵ$index_26_r2)); });
+    i0.ɵɵelement(5, "ng-icon", 8);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "sd-button", 7);
+    i0.ɵɵlistener("click", function SdSheetConfigModal_For_16_Template_sd_button_click_6_listener() { const ɵ$index_26_r2 = i0.ɵɵrestoreView(_r1).$index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onMoveDown(ɵ$index_26_r2)); });
+    i0.ɵɵelement(7, "ng-icon", 8);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "td");
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "td")(11, "input", 9);
+    i0.ɵɵlistener("input", function SdSheetConfigModal_For_16_Template_input_input_11_listener($event) { const ɵ$index_26_r2 = i0.ɵɵrestoreView(_r1).$index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onWidthChange(ɵ$index_26_r2, $event)); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(12, "td")(13, "sd-checkbox", 5);
+    i0.ɵɵlistener("click", function SdSheetConfigModal_For_16_Template_sd_checkbox_click_13_listener() { const ɵ$index_26_r2 = i0.ɵɵrestoreView(_r1).$index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onHiddenToggle(ɵ$index_26_r2)); });
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const item_r4 = ctx.$implicit;
+    const ɵ$index_26_r2 = ctx.$index;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("value", item_r4.fixed)("inline", true)("inset", true);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("disabled", !ctx_r2.canMoveUp(ɵ$index_26_r2));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2._icons.tablerArrowUp);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("disabled", !ctx_r2.canMoveDown(ɵ$index_26_r2));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r2._icons.tablerArrowDown);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(item_r4.header);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("value", item_r4.width);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("value", item_r4.hidden)("inline", true)("inset", true);
+} }
+export class SdSheetConfigModal {
+    initialized = signal(true, ...(ngDevMode ? [{ debugName: "initialized" }] : /* istanbul ignore next */ []));
+    close = output();
+    controls = input.required(...(ngDevMode ? [{ debugName: "controls" }] : /* istanbul ignore next */ []));
+    config = input.required(...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
+    _icons = { tablerArrowUp, tablerArrowDown };
+    _initialItems = computed(() => {
+        const cfg = this.config();
+        const controls = this.controls();
+        return controls
+            .map((ctrl) => {
+            const key = ctrl.key();
+            const cfgCol = cfg?.columnRecord[key];
+            return {
+                key,
+                header: Array.isArray(ctrl.header()) ? ctrl.header().join(" > ") : ctrl.header(),
+                fixed: cfgCol?.fixed ?? ctrl.fixed(),
+                hidden: cfgCol?.hidden ?? ctrl.hidden(),
+                width: cfgCol?.width ?? ctrl.width() ?? "",
+                ordering: cfgCol?.ordering ?? ctrl.ordering(),
+            };
+        })
+            .sort((a, b) => a.ordering - b.ordering);
+    }, ...(ngDevMode ? [{ debugName: "_initialItems" }] : /* istanbul ignore next */ []));
+    _editItems = signal(undefined, ...(ngDevMode ? [{ debugName: "_editItems" }] : /* istanbul ignore next */ []));
+    _items = computed(() => {
+        return this._editItems() ?? this._initialItems();
+    }, ...(ngDevMode ? [{ debugName: "_items" }] : /* istanbul ignore next */ []));
+    onFixedToggle(idx) {
+        const items = [...this._items()];
+        items[idx] = { ...items[idx], fixed: !items[idx].fixed };
+        this._editItems.set(items);
+    }
+    onHiddenToggle(idx) {
+        const items = [...this._items()];
+        items[idx] = { ...items[idx], hidden: !items[idx].hidden };
+        this._editItems.set(items);
+    }
+    onWidthChange(idx, event) {
+        const inputEl = event.target;
+        const items = [...this._items()];
+        items[idx] = { ...items[idx], width: inputEl.value };
+        this._editItems.set(items);
+    }
+    canMoveUp(idx) {
+        if (idx <= 0)
+            return false;
+        const items = this._items();
+        const current = items[idx];
+        const above = items[idx - 1];
+        // Cannot move non-fixed above fixed
+        if (!current.fixed && above.fixed)
+            return false;
+        return true;
+    }
+    canMoveDown(idx) {
+        const items = this._items();
+        if (idx >= items.length - 1)
+            return false;
+        const current = items[idx];
+        const below = items[idx + 1];
+        // Cannot move fixed below non-fixed
+        if (current.fixed && !below.fixed)
+            return false;
+        return true;
+    }
+    onMoveUp(idx) {
+        if (!this.canMoveUp(idx))
+            return;
+        const items = [...this._items()];
+        [items[idx - 1], items[idx]] = [items[idx], items[idx - 1]];
+        this._editItems.set(items);
+    }
+    onMoveDown(idx) {
+        if (!this.canMoveDown(idx))
+            return;
+        const items = [...this._items()];
+        [items[idx], items[idx + 1]] = [items[idx + 1], items[idx]];
+        this._editItems.set(items);
+    }
+    onOk() {
+        const items = this._items();
+        const columnRecord = {};
+        for (let i = 0; i < items.length; i++) {
+            const item = items[i];
+            columnRecord[item.key] = {
+                fixed: item.fixed,
+                hidden: item.hidden,
+                width: item.width !== "" ? item.width : undefined,
+                ordering: i,
+            };
+        }
+        this.close.emit({ columnRecord });
+    }
+    onCancel() {
+        this.close.emit(undefined);
+    }
+    onReset() {
+        this.close.emit({ columnRecord: {} });
+    }
+    static ɵfac = function SdSheetConfigModal_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSheetConfigModal)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSheetConfigModal, selectors: [["sd-sheet-config-modal"]], inputs: { controls: [1, "controls"], config: [1, "config"] }, outputs: { close: "close" }, decls: 24, vars: 1, consts: [[1, "_sd-sheet-config-modal"], [1, "_config-table"], [1, "_actions"], [3, "click", "theme"], [3, "click"], [3, "click", "value", "inline", "inset"], [1, "_order-col"], [3, "click", "disabled"], [3, "svg"], ["type", "text", 1, "_width-input", 3, "input", "value"]], template: function SdSheetConfigModal_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "table", 1)(2, "thead")(3, "tr")(4, "th");
+            i0.ɵɵtext(5, "Fix");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(6, "th");
+            i0.ɵɵtext(7, "Order");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "th");
+            i0.ɵɵtext(9, "Header");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(10, "th");
+            i0.ɵɵtext(11, "Width");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(12, "th");
+            i0.ɵɵtext(13, "Hidden");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(14, "tbody");
+            i0.ɵɵrepeaterCreate(15, SdSheetConfigModal_For_16_Template, 14, 12, "tr", null, _forTrack0);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(17, "div", 2)(18, "sd-button", 3);
+            i0.ɵɵlistener("click", function SdSheetConfigModal_Template_sd_button_click_18_listener() { return ctx.onOk(); });
+            i0.ɵɵtext(19, "OK");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(20, "sd-button", 4);
+            i0.ɵɵlistener("click", function SdSheetConfigModal_Template_sd_button_click_20_listener() { return ctx.onCancel(); });
+            i0.ɵɵtext(21, "Cancel");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(22, "sd-button", 4);
+            i0.ɵɵlistener("click", function SdSheetConfigModal_Template_sd_button_click_22_listener() { return ctx.onReset(); });
+            i0.ɵɵtext(23, "Reset");
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(15);
+            i0.ɵɵrepeater(ctx._items());
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("theme", "primary");
+        } }, dependencies: [SdButtonControl, SdCheckboxControl, NgIcon], styles: ["sd-sheet-config-modal {\n  display: block;\n  padding: var(--gap-default);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table {\n  width: 100%;\n  border-collapse: collapse;\n  margin-bottom: var(--gap-default);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table th,\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table td {\n  border: 1px solid var(--trans-lighter);\n  padding: var(--gap-sm) var(--gap-default);\n  text-align: left;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table th {\n  background: var(--theme-secondary-lightest);\n  font-weight: bold;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table ._order-col {\n  white-space: nowrap;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table ._width-input {\n  width: 80px;\n  padding: 2px 4px;\n  border: 1px solid var(--trans-lighter);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: var(--gap-sm);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSheetConfigModal, [{
+        type: Component,
+        args: [{ selector: "sd-sheet-config-modal", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdButtonControl, SdCheckboxControl, NgIcon], template: `
+    <div class="_sd-sheet-config-modal">
+      <table class="_config-table">
+        <thead>
+          <tr>
+            <th>Fix</th>
+            <th>Order</th>
+            <th>Header</th>
+            <th>Width</th>
+            <th>Hidden</th>
+          </tr>
+        </thead>
+        <tbody>
+          @for (item of _items(); track item.key; let idx = $index) {
+            <tr>
+              <td>
+                <sd-checkbox
+                  [value]="item.fixed"
+                  (click)="onFixedToggle(idx)"
+                  [inline]="true"
+                  [inset]="true"
+                />
+              </td>
+              <td class="_order-col">
+                <sd-button
+                  [disabled]="!canMoveUp(idx)"
+                  (click)="onMoveUp(idx)"
+                >
+                  <ng-icon [svg]="_icons.tablerArrowUp" />
+                </sd-button>
+                <sd-button
+                  [disabled]="!canMoveDown(idx)"
+                  (click)="onMoveDown(idx)"
+                >
+                  <ng-icon [svg]="_icons.tablerArrowDown" />
+                </sd-button>
+              </td>
+              <td>{{ item.header }}</td>
+              <td>
+                <input
+                  type="text"
+                  class="_width-input"
+                  [value]="item.width"
+                  (input)="onWidthChange(idx, $event)"
+                />
+              </td>
+              <td>
+                <sd-checkbox
+                  [value]="item.hidden"
+                  (click)="onHiddenToggle(idx)"
+                  [inline]="true"
+                  [inset]="true"
+                />
+              </td>
+            </tr>
+          }
+        </tbody>
+      </table>
+      <div class="_actions">
+        <sd-button [theme]="'primary'" (click)="onOk()">OK</sd-button>
+        <sd-button (click)="onCancel()">Cancel</sd-button>
+        <sd-button (click)="onReset()">Reset</sd-button>
+      </div>
+    </div>
+  `, styles: ["sd-sheet-config-modal {\n  display: block;\n  padding: var(--gap-default);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table {\n  width: 100%;\n  border-collapse: collapse;\n  margin-bottom: var(--gap-default);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table th,\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table td {\n  border: 1px solid var(--trans-lighter);\n  padding: var(--gap-sm) var(--gap-default);\n  text-align: left;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table th {\n  background: var(--theme-secondary-lightest);\n  font-weight: bold;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table ._order-col {\n  white-space: nowrap;\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._config-table ._width-input {\n  width: 80px;\n  padding: 2px 4px;\n  border: 1px solid var(--trans-lighter);\n}\nsd-sheet-config-modal > ._sd-sheet-config-modal > ._actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: var(--gap-sm);\n}"] }]
+    }], null, { close: [{ type: i0.Output, args: ["close"] }], controls: [{ type: i0.Input, args: [{ isSignal: true, alias: "controls", required: true }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSheetConfigModal, { className: "SdSheetConfigModal", filePath: "packages/angular/src/ui/data/sheet/sd-sheet-config.modal.ts", lineNumber: 143 }); })();