@simplysm/angular 14.0.63 → 14.0.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/controls/select/sd-select.d.ts +1 -1
- package/dist/controls/select/sd-select.d.ts.map +1 -1
- package/dist/controls/select/sd-select.js +30 -47
- package/dist/core/shared-data/sd-shared-data.provider.d.ts +1 -1
- package/dist/core/shared-data/sd-shared-data.provider.d.ts.map +1 -1
- package/dist/core/shared-data/sd-shared-data.provider.js +2 -4
- package/package.json +25 -25
- package/src/controls/select/sd-select.ts +25 -51
- package/src/core/shared-data/sd-shared-data.provider.ts +3 -5
|
@@ -31,7 +31,7 @@ export declare class SdSelect<M extends "single" | "multi", T> {
|
|
|
31
31
|
_beforeTpl: import("@angular/core").Signal<TemplateRef<void> | undefined>;
|
|
32
32
|
_itemOfTpl: import("@angular/core").Signal<TemplateRef<any> | undefined>;
|
|
33
33
|
private readonly _sanitizer;
|
|
34
|
-
_selectedItemContentHTML: import("@angular/core").
|
|
34
|
+
_selectedItemContentHTML: import("@angular/core").Signal<SafeHtml | undefined>;
|
|
35
35
|
_flatItems: import("@angular/core").Signal<{
|
|
36
36
|
data: T;
|
|
37
37
|
index: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-select.d.ts","sourceRoot":"","sources":["../../../src/controls/select/sd-select.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"sd-select.d.ts","sourceRoot":"","sources":["../../../src/controls/select/sd-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAYL,WAAW,EAGZ,MAAM,eAAe,CAAC;AAEvB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAI1D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;;AAUhD,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,MAAM,EAAE,CAAC,CAAC;CACX,CAAC;AAEF,qBA4Na,QAAQ,CAAC,CAAC,SAAS,QAAQ,GAAG,OAAO,EAAE,CAAC;IACnD,UAAU,yCAAwB;IAClC,KAAK,2EAAoC;IACzC,WAAW,0DAAmB;IAC9B,QAAQ,qEAAiD;IACzD,MAAM,qEAAiD;IACvD,KAAK,qEAAiD;IACtD,IAAI,+DAAwB;IAC5B,QAAQ,qEAAiD;IAEzD,aAAa,qEAAiD;IAC9D,8BAA8B,8DAAuB;IAErD,KAAK,uDAAgB;IACrB,SAAS,6CAAgB,CAAC,SAAS,MAAM,KAAK,OAAO,EAAkB;IACvE,aAAa,8CAAgB,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,eAAI;IAEtD,YAAY,0DAAmB;IAC/B,YAAY,0DAAmB;IAE/B,YAAY,+CAAgB;IAE5B,SAAS,CAAC,QAAQ,CAAC,eAAe,iUAAmB;IAErD,aAAa,+DAAiC;IAC9C,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAAkC;IACnE,OAAO,CAAC,QAAQ,CAAC,cAAc,CAG7B;IAEF,UAAU,gEAAgD;IAC1D,UAAU,gEAAgD;IAC1D,UAAU,+DAAyD;IAEnE,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAwB;IAEnD,wBAAwB,uDAwBrB;IAEH,UAAU;cAIY,CAAC;eAAS,MAAM;eAAS,MAAM;SAelD;;IAmDH,UAAU,CAAC,SAAS,EAAE,CAAC,GAAG,SAAS,GAAG,IAAI;IAO1C,UAAU,CAAC,SAAS,EAAE,CAAC,GAAG,SAAS,GAAG,IAAI;IAI1C,OAAO,CAAC,YAAY;IAepB,WAAW,IAAI,IAAI;IAQnB,aAAa,IAAI,IAAI;IAIrB,aAAa,IAAI,IAAI;IAIrB,YAAY,IAAI,IAAI;yCA/KT,QAAQ;2CAAR,QAAQ;CAmLpB"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { booleanAttribute, ChangeDetectionStrategy, Component, computed, contentChild, contentChildren, effect, ElementRef, inject, input, model,
|
|
1
|
+
import { booleanAttribute, ChangeDetectionStrategy, Component, computed, contentChild, contentChildren, effect, ElementRef, inject, input, model, TemplateRef, viewChild, ViewEncapsulation, } from "@angular/core";
|
|
2
2
|
import { NgTemplateOutlet } from "@angular/common";
|
|
3
3
|
import { DomSanitizer } from "@angular/platform-browser";
|
|
4
4
|
import { SdDropdown } from "../dropdown/sd-dropdown";
|
|
@@ -122,7 +122,34 @@ export class SdSelect {
|
|
|
122
122
|
_beforeTpl = contentChild("beforeTpl", ...(ngDevMode ? [{ debugName: "_beforeTpl" }] : /* istanbul ignore next */ []));
|
|
123
123
|
_itemOfTpl = contentChild(SdItemOfTemplate, { ...(ngDevMode ? { debugName: "_itemOfTpl" } : /* istanbul ignore next */ {}), read: TemplateRef });
|
|
124
124
|
_sanitizer = inject(DomSanitizer);
|
|
125
|
-
_selectedItemContentHTML =
|
|
125
|
+
_selectedItemContentHTML = computed(() => {
|
|
126
|
+
const items = this._itemControls();
|
|
127
|
+
const currentValue = this.value();
|
|
128
|
+
if (this.selectMode() === "multi") {
|
|
129
|
+
if (!Array.isArray(currentValue) || currentValue.length === 0)
|
|
130
|
+
return undefined;
|
|
131
|
+
const arr = currentValue;
|
|
132
|
+
const selectedItems = items.filter((item) => arr.includes(item.value()));
|
|
133
|
+
const isVertical = this.multiSelectionDisplayDirection() === "vertical";
|
|
134
|
+
const separator = isVertical ? "<div class='p-sm-0'></div>" : ", ";
|
|
135
|
+
const htmlParts = [];
|
|
136
|
+
for (const item of selectedItems) {
|
|
137
|
+
const html = item.contentHTML();
|
|
138
|
+
if (html !== "")
|
|
139
|
+
htmlParts.push(`<span style="display: inline">${html}</span>`);
|
|
140
|
+
}
|
|
141
|
+
if (htmlParts.length === 0)
|
|
142
|
+
return undefined;
|
|
143
|
+
return this._sanitizer.bypassSecurityTrustHtml(htmlParts.join(separator));
|
|
144
|
+
}
|
|
145
|
+
const selectedItem = items.find((item) => item.value() === currentValue);
|
|
146
|
+
if (selectedItem == null)
|
|
147
|
+
return undefined;
|
|
148
|
+
const html = selectedItem.contentHTML();
|
|
149
|
+
if (html === "")
|
|
150
|
+
return undefined;
|
|
151
|
+
return this._sanitizer.bypassSecurityTrustHtml(html);
|
|
152
|
+
}, ...(ngDevMode ? [{ debugName: "_selectedItemContentHTML" }] : /* istanbul ignore next */ []));
|
|
126
153
|
_flatItems = computed(() => {
|
|
127
154
|
const items = this.items();
|
|
128
155
|
if (items == null)
|
|
@@ -191,50 +218,6 @@ export class SdSelect {
|
|
|
191
218
|
});
|
|
192
219
|
}
|
|
193
220
|
});
|
|
194
|
-
// Mirror selected item's contentHTML to the trigger display area
|
|
195
|
-
// PERF-004: item.value() reads are untracked to reduce signal subscriptions from O(N) to O(K).
|
|
196
|
-
// _itemControls() already tracks item additions/removals, value() tracks selection changes.
|
|
197
|
-
effect(() => {
|
|
198
|
-
const items = this._itemControls();
|
|
199
|
-
const currentValue = this.value();
|
|
200
|
-
if (this.selectMode() === "multi") {
|
|
201
|
-
if (!Array.isArray(currentValue) || currentValue.length === 0) {
|
|
202
|
-
this._selectedItemContentHTML.set(undefined);
|
|
203
|
-
return;
|
|
204
|
-
}
|
|
205
|
-
const arr = currentValue;
|
|
206
|
-
const selectedItems = untracked(() => items.filter((item) => arr.includes(item.value())));
|
|
207
|
-
const isVertical = this.multiSelectionDisplayDirection() === "vertical";
|
|
208
|
-
const separator = isVertical ? "<div class='p-sm-0'></div>" : ", ";
|
|
209
|
-
const htmlParts = [];
|
|
210
|
-
for (const item of selectedItems) {
|
|
211
|
-
const html = item.contentHTML();
|
|
212
|
-
if (html !== "") {
|
|
213
|
-
htmlParts.push(`<span style="display: inline">${html}</span>`);
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
if (htmlParts.length > 0) {
|
|
217
|
-
this._selectedItemContentHTML.set(this._sanitizer.bypassSecurityTrustHtml(htmlParts.join(separator)));
|
|
218
|
-
}
|
|
219
|
-
else {
|
|
220
|
-
this._selectedItemContentHTML.set(undefined);
|
|
221
|
-
}
|
|
222
|
-
return;
|
|
223
|
-
}
|
|
224
|
-
const selectedItem = untracked(() => items.find((item) => item.value() === currentValue));
|
|
225
|
-
if (selectedItem != null) {
|
|
226
|
-
const html = selectedItem.contentHTML();
|
|
227
|
-
if (html !== "") {
|
|
228
|
-
this._selectedItemContentHTML.set(this._sanitizer.bypassSecurityTrustHtml(html));
|
|
229
|
-
}
|
|
230
|
-
else {
|
|
231
|
-
this._selectedItemContentHTML.set(undefined);
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
else {
|
|
235
|
-
this._selectedItemContentHTML.set(undefined);
|
|
236
|
-
}
|
|
237
|
-
});
|
|
238
221
|
}
|
|
239
222
|
selectItem(itemValue) {
|
|
240
223
|
this._setOrToggle(itemValue);
|
|
@@ -406,4 +389,4 @@ export class SdSelect {
|
|
|
406
389
|
"[attr.data-sd-disabled]": "disabled()",
|
|
407
390
|
}, styles: ["sd-select {\n display: block;\n position: relative;\n width: 100%;\n min-width: 10em;\n}\nsd-select > sd-dropdown {\n display: flex;\n overflow: hidden;\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: var(--theme-secondary-lightest);\n}\nsd-select > sd-dropdown:focus, sd-select > sd-dropdown:focus-within {\n border-color: var(--theme-primary-default);\n}\nsd-select > sd-dropdown > ._sd-select-control {\n display: flex;\n position: relative;\n gap: var(--gap-default);\n flex-grow: 1;\n padding: var(--gap-sm) var(--gap-default);\n cursor: pointer;\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-content {\n flex: 1;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n}\nsd-select > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n opacity: 0.3;\n}\nsd-select > sd-dropdown > ._sd-select-control:hover > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:focus > ._sd-select-control-icon, sd-select > sd-dropdown > ._sd-select-control:active > ._sd-select-control-icon {\n opacity: 1;\n}\nsd-select > sd-dropdown > sd-select-button {\n padding: var(--gap-sm);\n border-left: 1px solid var(--theme-gray-lightest);\n}\nsd-select > sd-dropdown > sd-select-button:last-of-type {\n border-top-right-radius: var(--border-radius-default);\n border-bottom-right-radius: var(--border-radius-default);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown {\n background: var(--theme-gray-lightest);\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--text-trans-light);\n cursor: default;\n}\nsd-select[data-sd-disabled=true] > sd-dropdown > ._sd-select-control > ._sd-select-control-icon {\n display: none;\n}\nsd-select[data-sd-inline=true] {\n display: inline-block;\n width: auto;\n vertical-align: top;\n}\nsd-select[data-sd-size=sm] > sd-dropdown > ._sd-select-control {\n padding: var(--gap-xs) var(--gap-sm);\n gap: var(--gap-sm);\n}\nsd-select[data-sd-size=sm] > sd-dropdown > sd-select-button {\n padding: var(--gap-xs);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > ._sd-select-control {\n padding: var(--gap-default) var(--gap-lg);\n gap: var(--gap-lg);\n}\nsd-select[data-sd-size=lg] > sd-dropdown > sd-select-button {\n padding: var(--gap-default);\n}\nsd-select[data-sd-inset=true] {\n min-width: auto;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown {\n border: none;\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown > sd-select-button {\n border-radius: 0;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus, sd-select[data-sd-inset=true] > sd-dropdown:focus-within {\n outline: 1px solid var(--theme-primary-default);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true] > sd-dropdown:focus > sd-select-button, sd-select[data-sd-inset=true] > sd-dropdown:focus-within > sd-select-button {\n outline: 1px solid var(--theme-primary-default);\n outline-offset: -1px;\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown {\n background: var(--control-color);\n}\nsd-select[data-sd-inset=true][data-sd-disabled=true] > sd-dropdown > ._sd-select-control {\n color: var(--text-trans-default);\n}\n\n._sd-select-all-bar {\n display: flex;\n padding: var(--gap-sm) var(--gap-default);\n border-bottom: 1px solid var(--border-color-light);\n}"] }]
|
|
408
391
|
}], () => [], { selectMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMode", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], inline: [{ type: i0.Input, args: [{ isSignal: true, alias: "inline", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], hideSelectAll: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideSelectAll", required: false }] }], multiSelectionDisplayDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "multiSelectionDisplayDirection", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], trackByFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackByFn", required: false }] }], getChildrenFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getChildrenFn", required: false }] }], contentClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentClass", required: false }] }], contentStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentStyle", required: false }] }], dropdownOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "dropdownOpen", required: false }] }, { type: i0.Output, args: ["dropdownOpenChange"] }], _itemControls: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdSelectItem), { isSignal: true }] }], _dropdownControl: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SdDropdown), { isSignal: true }] }], _dropdownElRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SdDropdown), { ...{ read: ElementRef }, isSignal: true }] }], _headerTpl: [{ type: i0.ContentChild, args: ["headerTpl", { isSignal: true }] }], _beforeTpl: [{ type: i0.ContentChild, args: ["beforeTpl", { isSignal: true }] }], _itemOfTpl: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdItemOfTemplate), { ...{ read: TemplateRef }, isSignal: true }] }] }); })();
|
|
409
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelect, { className: "SdSelect", filePath: "packages/angular/src/controls/select/sd-select.ts", lineNumber:
|
|
392
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSelect, { className: "SdSelect", filePath: "packages/angular/src/controls/select/sd-select.ts", lineNumber: 257 }); })();
|
|
@@ -12,7 +12,7 @@ export interface SharedDataInfo<T extends SharedDataBase<string | number>> {
|
|
|
12
12
|
serviceKey: string;
|
|
13
13
|
getter: (changeKeys?: (string | number)[]) => Promise<T[]>;
|
|
14
14
|
filter?: unknown;
|
|
15
|
-
orderBy?: (
|
|
15
|
+
orderBy?: (item: T) => any;
|
|
16
16
|
}
|
|
17
17
|
export interface SharedDataHandle<T extends SharedDataBase<string | number>> {
|
|
18
18
|
items: Signal<T[]>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-shared-data.provider.d.ts","sourceRoot":"","sources":["../../../src/core/shared-data/sd-shared-data.provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,YAAY,EAA8B,KAAK,MAAM,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAGrH,OAAO,EAAE,8BAA8B,EAAE,MAAM,sDAAsD,CAAC;AACtG,OAAO,uBAAuB,CAAC;;AAE/B,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,MAAM;IAC1D,UAAU,EAAE,IAAI,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC;IACvE,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,
|
|
1
|
+
{"version":3,"file":"sd-shared-data.provider.d.ts","sourceRoot":"","sources":["../../../src/core/shared-data/sd-shared-data.provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,YAAY,EAA8B,KAAK,MAAM,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AAGrH,OAAO,EAAE,8BAA8B,EAAE,MAAM,sDAAsD,CAAC;AACtG,OAAO,uBAAuB,CAAC;;AAE/B,MAAM,WAAW,cAAc,CAAC,IAAI,SAAS,MAAM,GAAG,MAAM;IAC1D,UAAU,EAAE,IAAI,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,IAAI,CAAC;CACpB;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC;IACvE,UAAU,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC,EAAE,CAAC,CAAC;IAC3D,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC;CAC5B;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,SAAS,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC;IACzE,KAAK,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC;IACnB,GAAG,CAAC,GAAG,EAAE,CAAC,CAAC,YAAY,CAAC,GAAG,SAAS,GAAG,CAAC,GAAG,SAAS,CAAC;CACtD;AAED,eAAO,MAAM,uBAAuB;UAC1B,MAAM;YAAU,OAAO;mCAEV,CAAC;AAYxB,8BACsB,oBAAoB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IAClG,SAAS,CAAC,QAAQ,CAAC,uBAAuB,iCAA0C;IACpF,SAAS,CAAC,QAAQ,CAAC,aAAa,eAAwB;IAExD,QAAQ,CAAC,YAAY,EAAE,cAAc,CAAC,MAAM,CAAC,CAAa;IAE1D,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA2C;IAEpE,QAAQ,CAAC,UAAU,IAAI,IAAI;IAE3B,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;IAqC/E,SAAS,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAAC,EAAE,IAAI,EAAE,CAAC,GAAG,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IAchE,SAAS,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,CAAC,EACxC,IAAI,EAAE,CAAC,EACP,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,GAC/B,OAAO,CAAC,IAAI,CAAC;IAcV,IAAI,IAAI,OAAO,CAAC,IAAI,CAAC;IAI3B,OAAO,CAAC,cAAc;YAuCR,QAAQ;yCAzHF,oBAAoB;6CAApB,oBAAoB;CAgKzC"}
|
|
@@ -120,10 +120,8 @@ export class SdSharedDataProvider {
|
|
|
120
120
|
const filtered = currentItems.filter((item) => !changeKeySet.has(String(item.__valueKey)));
|
|
121
121
|
const merged = [...filtered, ...newItems];
|
|
122
122
|
// orderBy 적용
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
}
|
|
126
|
-
entry.itemsSignal.set(merged);
|
|
123
|
+
const ordered = entry.info.orderBy != null ? merged.orderBy(entry.info.orderBy) : merged;
|
|
124
|
+
entry.itemsSignal.set(ordered);
|
|
127
125
|
}
|
|
128
126
|
}
|
|
129
127
|
catch (err) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@simplysm/angular",
|
|
3
|
-
"version": "14.0.
|
|
3
|
+
"version": "14.0.65",
|
|
4
4
|
"description": "심플리즘 패키지 - Angular",
|
|
5
5
|
"author": "심플리즘",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -24,40 +24,40 @@
|
|
|
24
24
|
"./dist/**/*.css"
|
|
25
25
|
],
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@angular/animations": "^21.2.
|
|
28
|
-
"@angular/common": "^21.2.
|
|
29
|
-
"@angular/core": "^21.2.
|
|
30
|
-
"@angular/platform-browser": "^21.2.
|
|
31
|
-
"@angular/router": "^21.2.
|
|
32
|
-
"@angular/service-worker": "^21.2.
|
|
27
|
+
"@angular/animations": "^21.2.11",
|
|
28
|
+
"@angular/common": "^21.2.11",
|
|
29
|
+
"@angular/core": "^21.2.11",
|
|
30
|
+
"@angular/platform-browser": "^21.2.11",
|
|
31
|
+
"@angular/router": "^21.2.11",
|
|
32
|
+
"@angular/service-worker": "^21.2.11",
|
|
33
33
|
"@ng-icons/core": "^33.2.2",
|
|
34
34
|
"@ng-icons/tabler-icons": "^33.2.2",
|
|
35
|
-
"@tiptap/core": "^3.22.
|
|
36
|
-
"@tiptap/extension-color": "^3.22.
|
|
37
|
-
"@tiptap/extension-document": "^3.22.
|
|
38
|
-
"@tiptap/extension-highlight": "^3.22.
|
|
39
|
-
"@tiptap/extension-image": "^3.22.
|
|
40
|
-
"@tiptap/extension-paragraph": "^3.22.
|
|
41
|
-
"@tiptap/extension-placeholder": "^3.22.
|
|
42
|
-
"@tiptap/extension-text": "^3.22.
|
|
43
|
-
"@tiptap/extension-text-align": "^3.22.
|
|
44
|
-
"@tiptap/extension-text-style": "^3.22.
|
|
45
|
-
"@tiptap/extension-underline": "^3.22.
|
|
46
|
-
"@tiptap/starter-kit": "^3.22.
|
|
35
|
+
"@tiptap/core": "^3.22.5",
|
|
36
|
+
"@tiptap/extension-color": "^3.22.5",
|
|
37
|
+
"@tiptap/extension-document": "^3.22.5",
|
|
38
|
+
"@tiptap/extension-highlight": "^3.22.5",
|
|
39
|
+
"@tiptap/extension-image": "^3.22.5",
|
|
40
|
+
"@tiptap/extension-paragraph": "^3.22.5",
|
|
41
|
+
"@tiptap/extension-placeholder": "^3.22.5",
|
|
42
|
+
"@tiptap/extension-text": "^3.22.5",
|
|
43
|
+
"@tiptap/extension-text-align": "^3.22.5",
|
|
44
|
+
"@tiptap/extension-text-style": "^3.22.5",
|
|
45
|
+
"@tiptap/extension-underline": "^3.22.5",
|
|
46
|
+
"@tiptap/starter-kit": "^3.22.5",
|
|
47
47
|
"bwip-js": "^4.10.1",
|
|
48
48
|
"echarts": "^6.0.0",
|
|
49
49
|
"html-to-image": "^1.11.13",
|
|
50
50
|
"jspdf": "^4.2.1",
|
|
51
51
|
"rxjs": "^7.8.2",
|
|
52
52
|
"tabbable": "^6.4.0",
|
|
53
|
-
"@simplysm/core-
|
|
54
|
-
"@simplysm/core-
|
|
55
|
-
"@simplysm/service-client": "14.0.
|
|
56
|
-
"@simplysm/service-common": "14.0.
|
|
53
|
+
"@simplysm/core-common": "14.0.65",
|
|
54
|
+
"@simplysm/core-browser": "14.0.65",
|
|
55
|
+
"@simplysm/service-client": "14.0.65",
|
|
56
|
+
"@simplysm/service-common": "14.0.65"
|
|
57
57
|
},
|
|
58
58
|
"devDependencies": {
|
|
59
|
-
"@angular/compiler": "^21.2.
|
|
60
|
-
"@angular/platform-browser-dynamic": "^21.2.
|
|
59
|
+
"@angular/compiler": "^21.2.11",
|
|
60
|
+
"@angular/platform-browser-dynamic": "^21.2.11"
|
|
61
61
|
},
|
|
62
62
|
"scripts": {}
|
|
63
63
|
}
|
|
@@ -10,9 +10,7 @@ import {
|
|
|
10
10
|
inject,
|
|
11
11
|
input,
|
|
12
12
|
model,
|
|
13
|
-
signal,
|
|
14
13
|
TemplateRef,
|
|
15
|
-
untracked,
|
|
16
14
|
viewChild,
|
|
17
15
|
ViewEncapsulation,
|
|
18
16
|
} from "@angular/core";
|
|
@@ -293,7 +291,31 @@ export class SdSelect<M extends "single" | "multi", T> {
|
|
|
293
291
|
|
|
294
292
|
private readonly _sanitizer = inject(DomSanitizer);
|
|
295
293
|
|
|
296
|
-
_selectedItemContentHTML =
|
|
294
|
+
_selectedItemContentHTML = computed<SafeHtml | undefined>(() => {
|
|
295
|
+
const items = this._itemControls();
|
|
296
|
+
const currentValue = this.value();
|
|
297
|
+
|
|
298
|
+
if (this.selectMode() === "multi") {
|
|
299
|
+
if (!Array.isArray(currentValue) || currentValue.length === 0) return undefined;
|
|
300
|
+
const arr: T[] = currentValue;
|
|
301
|
+
const selectedItems = items.filter((item) => arr.includes(item.value()));
|
|
302
|
+
const isVertical = this.multiSelectionDisplayDirection() === "vertical";
|
|
303
|
+
const separator = isVertical ? "<div class='p-sm-0'></div>" : ", ";
|
|
304
|
+
const htmlParts: string[] = [];
|
|
305
|
+
for (const item of selectedItems) {
|
|
306
|
+
const html = item.contentHTML();
|
|
307
|
+
if (html !== "") htmlParts.push(`<span style="display: inline">${html}</span>`);
|
|
308
|
+
}
|
|
309
|
+
if (htmlParts.length === 0) return undefined;
|
|
310
|
+
return this._sanitizer.bypassSecurityTrustHtml(htmlParts.join(separator));
|
|
311
|
+
}
|
|
312
|
+
|
|
313
|
+
const selectedItem = items.find((item) => item.value() === currentValue);
|
|
314
|
+
if (selectedItem == null) return undefined;
|
|
315
|
+
const html = selectedItem.contentHTML();
|
|
316
|
+
if (html === "") return undefined;
|
|
317
|
+
return this._sanitizer.bypassSecurityTrustHtml(html);
|
|
318
|
+
});
|
|
297
319
|
|
|
298
320
|
_flatItems = computed(() => {
|
|
299
321
|
const items = this.items();
|
|
@@ -363,54 +385,6 @@ export class SdSelect<M extends "single" | "multi", T> {
|
|
|
363
385
|
});
|
|
364
386
|
}
|
|
365
387
|
});
|
|
366
|
-
|
|
367
|
-
// Mirror selected item's contentHTML to the trigger display area
|
|
368
|
-
// PERF-004: item.value() reads are untracked to reduce signal subscriptions from O(N) to O(K).
|
|
369
|
-
// _itemControls() already tracks item additions/removals, value() tracks selection changes.
|
|
370
|
-
effect(() => {
|
|
371
|
-
const items = this._itemControls();
|
|
372
|
-
const currentValue = this.value();
|
|
373
|
-
|
|
374
|
-
if (this.selectMode() === "multi") {
|
|
375
|
-
if (!Array.isArray(currentValue) || currentValue.length === 0) {
|
|
376
|
-
this._selectedItemContentHTML.set(undefined);
|
|
377
|
-
return;
|
|
378
|
-
}
|
|
379
|
-
|
|
380
|
-
const arr: T[] = currentValue;
|
|
381
|
-
const selectedItems = untracked(() => items.filter((item) => arr.includes(item.value())));
|
|
382
|
-
|
|
383
|
-
const isVertical = this.multiSelectionDisplayDirection() === "vertical";
|
|
384
|
-
const separator = isVertical ? "<div class='p-sm-0'></div>" : ", ";
|
|
385
|
-
const htmlParts: string[] = [];
|
|
386
|
-
for (const item of selectedItems) {
|
|
387
|
-
const html = item.contentHTML();
|
|
388
|
-
if (html !== "") {
|
|
389
|
-
htmlParts.push(`<span style="display: inline">${html}</span>`);
|
|
390
|
-
}
|
|
391
|
-
}
|
|
392
|
-
if (htmlParts.length > 0) {
|
|
393
|
-
this._selectedItemContentHTML.set(
|
|
394
|
-
this._sanitizer.bypassSecurityTrustHtml(htmlParts.join(separator)),
|
|
395
|
-
);
|
|
396
|
-
} else {
|
|
397
|
-
this._selectedItemContentHTML.set(undefined);
|
|
398
|
-
}
|
|
399
|
-
return;
|
|
400
|
-
}
|
|
401
|
-
|
|
402
|
-
const selectedItem = untracked(() => items.find((item) => item.value() === currentValue));
|
|
403
|
-
if (selectedItem != null) {
|
|
404
|
-
const html = selectedItem.contentHTML();
|
|
405
|
-
if (html !== "") {
|
|
406
|
-
this._selectedItemContentHTML.set(this._sanitizer.bypassSecurityTrustHtml(html));
|
|
407
|
-
} else {
|
|
408
|
-
this._selectedItemContentHTML.set(undefined);
|
|
409
|
-
}
|
|
410
|
-
} else {
|
|
411
|
-
this._selectedItemContentHTML.set(undefined);
|
|
412
|
-
}
|
|
413
|
-
});
|
|
414
388
|
}
|
|
415
389
|
|
|
416
390
|
selectItem(itemValue: T | undefined): void {
|
|
@@ -15,7 +15,7 @@ export interface SharedDataInfo<T extends SharedDataBase<string | number>> {
|
|
|
15
15
|
serviceKey: string;
|
|
16
16
|
getter: (changeKeys?: (string | number)[]) => Promise<T[]>;
|
|
17
17
|
filter?: unknown;
|
|
18
|
-
orderBy?: (
|
|
18
|
+
orderBy?: (item: T) => any;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
export interface SharedDataHandle<T extends SharedDataBase<string | number>> {
|
|
@@ -189,11 +189,9 @@ export abstract class SdSharedDataProvider<T extends Record<string, SharedDataBa
|
|
|
189
189
|
const merged = [...filtered, ...newItems];
|
|
190
190
|
|
|
191
191
|
// orderBy 적용
|
|
192
|
-
|
|
193
|
-
merged.sort(entry.info.orderBy);
|
|
194
|
-
}
|
|
192
|
+
const ordered = entry.info.orderBy != null ? merged.orderBy(entry.info.orderBy) : merged;
|
|
195
193
|
|
|
196
|
-
entry.itemsSignal.set(
|
|
194
|
+
entry.itemsSignal.set(ordered);
|
|
197
195
|
}
|
|
198
196
|
} catch (err) {
|
|
199
197
|
this._errorHandler.handleError(err);
|