@sdcorejs/angular 19.0.4 → 19.0.5
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/assets/{scss/README.md → STYLE-GUIDE.md} +3 -0
- package/components/index.d.ts +2 -0
- package/components/org-chart/index.d.ts +3 -0
- package/components/org-chart/src/org-chart-item-def.directive.d.ts +9 -0
- package/components/org-chart/src/org-chart.component.d.ts +26 -0
- package/components/org-chart/src/org-chart.model.d.ts +32 -0
- package/components/query-bar/src/query-bar.component.d.ts +15 -2
- package/components/query-bar/src/query-bar.model.d.ts +22 -0
- package/components/query-builder/src/query-builder.component.d.ts +23 -6
- package/components/query-builder/src/query-builder.model.d.ts +71 -23
- package/components/section/src/section.component.d.ts +4 -1
- package/components/splitter/src/splitter.component.d.ts +8 -2
- package/components/splitter/src/splitter.models.d.ts +13 -0
- package/components/table/src/services/table-filter/table-filter.model.d.ts +2 -0
- package/components/tree/index.d.ts +3 -0
- package/components/tree/src/tree-item-def.directive.d.ts +9 -0
- package/components/tree/src/tree.component.d.ts +102 -0
- package/components/tree/src/tree.model.d.ts +142 -0
- package/fesm2022/sdcorejs-angular-components-form-generic.mjs +2 -2
- package/fesm2022/sdcorejs-angular-components-form-generic.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-org-chart.mjs +110 -0
- package/fesm2022/sdcorejs-angular-components-org-chart.mjs.map +1 -0
- package/fesm2022/sdcorejs-angular-components-query-bar.mjs +37 -8
- package/fesm2022/sdcorejs-angular-components-query-bar.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-query-builder.mjs +257 -59
- package/fesm2022/sdcorejs-angular-components-query-builder.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-section.mjs +7 -4
- package/fesm2022/sdcorejs-angular-components-section.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-splitter.mjs +23 -12
- package/fesm2022/sdcorejs-angular-components-splitter.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-table.mjs +6 -2
- package/fesm2022/sdcorejs-angular-components-table.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-components-tree.mjs +526 -0
- package/fesm2022/sdcorejs-angular-components-tree.mjs.map +1 -0
- package/fesm2022/sdcorejs-angular-components.mjs +2 -0
- package/fesm2022/sdcorejs-angular-components.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-forms-autocomplete.mjs +2 -2
- package/fesm2022/sdcorejs-angular-forms-autocomplete.mjs.map +1 -1
- package/fesm2022/sdcorejs-angular-forms-select.mjs +33 -3
- package/fesm2022/sdcorejs-angular-forms-select.mjs.map +1 -1
- package/forms/select/src/select.component.d.ts +9 -1
- package/package.json +13 -5
|
@@ -0,0 +1,142 @@
|
|
|
1
|
+
import { Signal, TemplateRef } from '@angular/core';
|
|
2
|
+
import { SdButton } from '@sdcorejs/angular/components/button';
|
|
3
|
+
import { MaterialIconFontSet, SdUnwrapSignal } from '@sdcorejs/angular/utilities/models';
|
|
4
|
+
import { Color } from '@sdcorejs/utils/models';
|
|
5
|
+
export type SdTreeDataSource<TItem = any> = TItem[] | Signal<TItem[]> | (() => TItem[] | Promise<TItem[]>);
|
|
6
|
+
export type SdTreeLoadType = 'static' | 'lazy';
|
|
7
|
+
export type SdTreeOption<T = any> = SdTreeStaticOption<T> | SdTreeLazyOption<T>;
|
|
8
|
+
export type SdTreeItem<T = any> = SdTreeItemStatic<T> | SdTreeItemLazy<T>;
|
|
9
|
+
export type SdTreeItemByLoadType<T = any, TLoadType extends SdTreeLoadType = SdTreeLoadType> = TLoadType extends 'lazy' ? SdTreeItemLazy<T> : SdTreeItemStatic<T>;
|
|
10
|
+
export interface SdTreeItemBase<T = any> {
|
|
11
|
+
/** Stable node id used for expansion, selection, filtering ancestry, and auto-id generation. */
|
|
12
|
+
id: string;
|
|
13
|
+
/** Text shown by the default tree row. Custom templates can still read `item` / `treeItem`. */
|
|
14
|
+
label: string;
|
|
15
|
+
/**
|
|
16
|
+
* Optional node icon override.
|
|
17
|
+
* - Branch without `icon`: tree renders the default folder icon (`folder` / `folder_open`).
|
|
18
|
+
* - Leaf without `icon`: tree renders no icon.
|
|
19
|
+
* This replaces the old `leafIcon` split. One field is enough because each node decides its own icon.
|
|
20
|
+
*/
|
|
21
|
+
icon?: string | null;
|
|
22
|
+
/** Consumer payload. Commands, selection callbacks, and `$implicit` template context receive this value. */
|
|
23
|
+
data: T;
|
|
24
|
+
/** Initial expansion state for this node. Component state wins after the user toggles. */
|
|
25
|
+
expanded?: boolean;
|
|
26
|
+
}
|
|
27
|
+
export interface SdTreeItemStatic<T = any> extends SdTreeItemBase<T> {
|
|
28
|
+
/** Static-mode children. Lazy mode does not use this field. */
|
|
29
|
+
children?: SdTreeItemStatic<T>[];
|
|
30
|
+
/** `hasChildren` belongs to lazy mode only; static mode derives branches from `children`. */
|
|
31
|
+
hasChildren?: never;
|
|
32
|
+
}
|
|
33
|
+
export interface SdTreeItemLazy<T = any> extends SdTreeItemBase<T> {
|
|
34
|
+
/** Lazy-mode hint. Set `false` for known leaf nodes that do not need `onExpandChildren`. */
|
|
35
|
+
hasChildren?: boolean;
|
|
36
|
+
/** `children` belongs to static mode only; lazy loaded children are cached inside the component. */
|
|
37
|
+
children?: never;
|
|
38
|
+
}
|
|
39
|
+
export interface SdTreeBaseOption {
|
|
40
|
+
maxDepth?: number;
|
|
41
|
+
indentSize?: number;
|
|
42
|
+
}
|
|
43
|
+
export interface SdTreeStaticOption<T = any> extends SdTreeBaseOption {
|
|
44
|
+
loadType: 'static';
|
|
45
|
+
/** Expand all (`true`), none (`false`), or root levels where `level < number`. */
|
|
46
|
+
defaultExpanded?: boolean | number;
|
|
47
|
+
}
|
|
48
|
+
export interface SdTreeLazyOption<T = any> extends SdTreeBaseOption {
|
|
49
|
+
loadType: 'lazy';
|
|
50
|
+
/**
|
|
51
|
+
* Called once when a lazy node is first expanded. Return wrapped `SdTreeItemLazy<T>` children,
|
|
52
|
+
* not raw data, so each child has a stable id/label/icon contract.
|
|
53
|
+
*/
|
|
54
|
+
onExpandChildren: (item: SdTreeItemLazy<T>) => Promise<SdTreeItemLazy<T>[]> | SdTreeItemLazy<T>[];
|
|
55
|
+
}
|
|
56
|
+
export interface SdTreeCommand<T = any> {
|
|
57
|
+
key: string;
|
|
58
|
+
title: string | ((item: T) => string);
|
|
59
|
+
icon?: string | ((item: T) => string | undefined | null);
|
|
60
|
+
color?: Color;
|
|
61
|
+
fontSet?: MaterialIconFontSet;
|
|
62
|
+
disabled?: boolean | ((item: T) => boolean);
|
|
63
|
+
hidden?: boolean | ((item: T) => boolean);
|
|
64
|
+
click: (item: T) => void;
|
|
65
|
+
}
|
|
66
|
+
export interface SdTreeSelectorOption<T = any> {
|
|
67
|
+
visible?: boolean;
|
|
68
|
+
actions?: SdTreeSelectionAction<T>[];
|
|
69
|
+
message?: string | ((selectedItems: T[]) => string);
|
|
70
|
+
disabled?: (item: T, selectedItems: T[]) => boolean;
|
|
71
|
+
}
|
|
72
|
+
export interface SdTreeSelectionAction<T = any> {
|
|
73
|
+
icon?: string;
|
|
74
|
+
fontSet?: SdUnwrapSignal<SdButton['fontSet']>;
|
|
75
|
+
tooltip?: SdUnwrapSignal<SdButton['tooltip']>;
|
|
76
|
+
title?: SdUnwrapSignal<SdButton['title']>;
|
|
77
|
+
color?: SdUnwrapSignal<SdButton['color']>;
|
|
78
|
+
type?: SdUnwrapSignal<SdButton['type']>;
|
|
79
|
+
hidden?: boolean | ((selectedItems: T[]) => boolean);
|
|
80
|
+
click: (selectedItems: T[]) => void;
|
|
81
|
+
}
|
|
82
|
+
export interface SdTreeComponentOptionBase<T = any, TItem extends SdTreeItem<T> = SdTreeItem<T>> {
|
|
83
|
+
autoId?: string | null;
|
|
84
|
+
/** Root nodes can be an array, a signal, a sync loader, or an async loader. Call `reload()` to rerun loader sources. */
|
|
85
|
+
items: SdTreeDataSource<TItem>;
|
|
86
|
+
selectedItems?: T[] | null;
|
|
87
|
+
selector?: SdTreeSelectorOption<T> | null;
|
|
88
|
+
commands?: SdTreeCommand<T>[] | null;
|
|
89
|
+
itemTemplate?: SdTreeItemTemplate<T> | null;
|
|
90
|
+
selectable?: boolean;
|
|
91
|
+
onSelectedItemsChange?: (items: T[]) => void;
|
|
92
|
+
onSelect?: (event: SdTreeSelectionEvent<T>) => void;
|
|
93
|
+
onExpand?: (event: SdTreeToggleEvent<T>) => void;
|
|
94
|
+
onCollapse?: (event: SdTreeToggleEvent<T>) => void;
|
|
95
|
+
}
|
|
96
|
+
export interface SdTreeStaticComponentOption<T = any> extends SdTreeComponentOptionBase<T, SdTreeItemStatic<T>> {
|
|
97
|
+
/** Static tree is the default when `tree` is omitted. */
|
|
98
|
+
tree?: SdTreeStaticOption<T>;
|
|
99
|
+
}
|
|
100
|
+
export interface SdTreeLazyComponentOption<T = any> extends SdTreeComponentOptionBase<T, SdTreeItemLazy<T>> {
|
|
101
|
+
tree: SdTreeLazyOption<T>;
|
|
102
|
+
}
|
|
103
|
+
export type SdTreeComponentOption<T = any> = SdTreeStaticComponentOption<T> | SdTreeLazyComponentOption<T>;
|
|
104
|
+
export interface SdTreeNode<T = any> {
|
|
105
|
+
/** Wrapped tree item containing id/label/icon/data plus mode-specific tree metadata. */
|
|
106
|
+
treeItem: SdTreeItem<T>;
|
|
107
|
+
/** Raw consumer payload. Kept as a shortcut because most callbacks operate on data, not wrapper metadata. */
|
|
108
|
+
data: T;
|
|
109
|
+
id: string;
|
|
110
|
+
label: string;
|
|
111
|
+
level: number;
|
|
112
|
+
parent: SdTreeNode<T> | null;
|
|
113
|
+
children: SdTreeNode<T>[];
|
|
114
|
+
hasChildren: boolean;
|
|
115
|
+
isExpanded: boolean;
|
|
116
|
+
isLoading: boolean;
|
|
117
|
+
}
|
|
118
|
+
export interface SdTreeItemContext<T = any> {
|
|
119
|
+
$implicit: T;
|
|
120
|
+
item: T;
|
|
121
|
+
treeItem: SdTreeItem<T>;
|
|
122
|
+
node: SdTreeNode<T>;
|
|
123
|
+
level: number;
|
|
124
|
+
expanded: boolean;
|
|
125
|
+
selected: boolean;
|
|
126
|
+
loading: boolean;
|
|
127
|
+
hasChildren: boolean;
|
|
128
|
+
isLeaf: boolean;
|
|
129
|
+
toggle: () => void;
|
|
130
|
+
select: () => void;
|
|
131
|
+
}
|
|
132
|
+
export type SdTreeItemTemplate<T = any> = TemplateRef<SdTreeItemContext<T>>;
|
|
133
|
+
export interface SdTreeSelectionEvent<T = any> {
|
|
134
|
+
item: T;
|
|
135
|
+
selected: boolean;
|
|
136
|
+
selectedItems: T[];
|
|
137
|
+
}
|
|
138
|
+
export interface SdTreeToggleEvent<T = any> {
|
|
139
|
+
item: T;
|
|
140
|
+
expanded: boolean;
|
|
141
|
+
node: SdTreeNode<T>;
|
|
142
|
+
}
|
|
@@ -3063,7 +3063,7 @@ class SdFormRender {
|
|
|
3063
3063
|
return messages;
|
|
3064
3064
|
};
|
|
3065
3065
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdFormRender, deps: [{ token: i0.ChangeDetectorRef }, { token: SD_FORM_GENERIC_CONFIGURATION, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
3066
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdFormRender, isStandalone: true, selector: "sd-form-render", inputs: { form: "form", _configuration: ["configuration", "_configuration"], _default: ["defaultEntity", "_default"], _entity: ["entity", "_entity"], _properties: ["properties", "_properties"], _viewed: ["viewed", "_viewed"] }, viewQueries: [{ propertyName: "formRenderItems", predicate: LibItemComponent, descendants: true }], ngImport: i0, template: "@if (form && loadCompleted && hashedValues) {\n <div class=\"row mx-0\">\n @for (component of configuration.components; track component.id) {\n @let expression = hashedValues | whenExpression: component : formValue;\n @if (!expression.hidden) {\n @if (component.type === 'group') {\n @if (!!component.components.length) {\n <div class=\"col-12 mt-16\">\n <sd-section [title]=\"component.label\" [icon]=\"component.properties.icon\">\n <div class=\"row mx-0\">\n @for (childComponent of component.components; track childComponent.id) {\n @let childExpression = hashedValues | whenExpression: childComponent : formValue;\n @if (!childExpression.hidden) {\n <lib-item\n [setVariables]=\"setVariables\"\n [form]=\"form\"\n [entity]=\"entity\"\n [component]=\"childComponent\"\n [required]=\"childExpression.required\"\n [disabled]=\"childExpression.disabled\"\n [viewed]=\"viewed\"></lib-item>\n }\n }\n </div>\n </sd-section>\n </div>\n }\n } @else {\n <lib-item\n [setVariables]=\"setVariables\"\n [form]=\"form\"\n [entity]=\"entity\"\n [component]=\"component\"\n [required]=\"expression.required\"\n [disabled]=\"expression.disabled\"\n [viewed]=\"viewed\"></lib-item>\n }\n }\n }\n <variable [variables]=\"configuration.variables\" [setVariables]=\"setVariables\" [form]=\"form\" [entity]=\"entity\" ></variable>\n </div>\n}\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: SdSection, selector: "sd-section", inputs: ["title", "subTitle", "icon", "iconColor", "collapsed", "collapsable", "hideHeader", "noPaddingBody"], outputs: ["collapsedChange"] }, { kind: "component", type: LibItemComponent, selector: "lib-item", inputs: ["setVariables", "form", "entity", "component", "disabled", "required", "viewed", "validator"] }, { kind: "pipe", type: WhenExpressionPipe, name: "whenExpression" }, { kind: "component", type: VariableComponent, selector: "variable", inputs: ["variables", "setVariables", "form", "entity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3066
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdFormRender, isStandalone: true, selector: "sd-form-render", inputs: { form: "form", _configuration: ["configuration", "_configuration"], _default: ["defaultEntity", "_default"], _entity: ["entity", "_entity"], _properties: ["properties", "_properties"], _viewed: ["viewed", "_viewed"] }, viewQueries: [{ propertyName: "formRenderItems", predicate: LibItemComponent, descendants: true }], ngImport: i0, template: "@if (form && loadCompleted && hashedValues) {\n <div class=\"row mx-0\">\n @for (component of configuration.components; track component.id) {\n @let expression = hashedValues | whenExpression: component : formValue;\n @if (!expression.hidden) {\n @if (component.type === 'group') {\n @if (!!component.components.length) {\n <div class=\"col-12 mt-16\">\n <sd-section [title]=\"component.label\" [icon]=\"component.properties.icon\">\n <div class=\"row mx-0\">\n @for (childComponent of component.components; track childComponent.id) {\n @let childExpression = hashedValues | whenExpression: childComponent : formValue;\n @if (!childExpression.hidden) {\n <lib-item\n [setVariables]=\"setVariables\"\n [form]=\"form\"\n [entity]=\"entity\"\n [component]=\"childComponent\"\n [required]=\"childExpression.required\"\n [disabled]=\"childExpression.disabled\"\n [viewed]=\"viewed\"></lib-item>\n }\n }\n </div>\n </sd-section>\n </div>\n }\n } @else {\n <lib-item\n [setVariables]=\"setVariables\"\n [form]=\"form\"\n [entity]=\"entity\"\n [component]=\"component\"\n [required]=\"expression.required\"\n [disabled]=\"expression.disabled\"\n [viewed]=\"viewed\"></lib-item>\n }\n }\n }\n <variable [variables]=\"configuration.variables\" [setVariables]=\"setVariables\" [form]=\"form\" [entity]=\"entity\" ></variable>\n </div>\n}\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "component", type: SdSection, selector: "sd-section", inputs: ["title", "subTitle", "icon", "iconColor", "collapsed", "collapsible", "collapsable", "hideHeader", "noPaddingBody"], outputs: ["collapsedChange"] }, { kind: "component", type: LibItemComponent, selector: "lib-item", inputs: ["setVariables", "form", "entity", "component", "disabled", "required", "viewed", "validator"] }, { kind: "pipe", type: WhenExpressionPipe, name: "whenExpression" }, { kind: "component", type: VariableComponent, selector: "variable", inputs: ["variables", "setVariables", "form", "entity"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3067
3067
|
}
|
|
3068
3068
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdFormRender, decorators: [{
|
|
3069
3069
|
type: Component,
|
|
@@ -4590,7 +4590,7 @@ class AttributeSelection {
|
|
|
4590
4590
|
this.ref.markForCheck();
|
|
4591
4591
|
};
|
|
4592
4592
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: AttributeSelection, deps: [{ token: i0.ChangeDetectorRef }, { token: FormGenericService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4593
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: AttributeSelection, isStandalone: true, selector: "attribute-selection", inputs: { components: "components", variables: "variables", component: "component", _valuesKey: ["valuesKey", "_valuesKey"], _values: ["values", "_values"] }, outputs: { valuesKeyChange: "valuesKeyChange", valuesChange: "valuesChange", sdChange: "sdChange" }, ngImport: i0, template: "<sd-section class=\"mt-8\" [title]=\"'core.component.form-builder.data' | translate\" icon=\"format_list_bulleted\">\n @if (selections.length) {\n <div class=\"d-flex align-items-center py-4\">\n <div class=\"T14M\" style=\"flex: 1\">{{ 'core.component.form-builder.data-api' | translate }}</div>\n <sd-autocomplete\n style=\"width: 200px\"\n size=\"sm\"\n [(model)]=\"valuesKey\"\n [items]=\"selections\"\n valueField=\"value\"\n displayField=\"display\"\n (sdChange)=\"onChangeValuesKey($event)\"\n hideInlineError></sd-autocomplete>\n </div>\n <!-- N\u1EBFu l\u00E0 select t\u1EEB API th\u00EC cho ph\u00E9p truy\u1EC1n th\u00EAm Query -->\n\n @if (component.type === 'select' && !!valuesKey) {\n <build-queries\n [label]=\"'core.component.form-builder.query-condition' | translate\"\n [selections]=\"selections\"\n [valuesKey]=\"valuesKey\"\n [components]=\"components\"\n [variables]=\"variables\"\n [(model)]=\"component.properties!.query\"></build-queries>\n <build-variables\n [label]=\"'core.component.form-builder.assign-value' | translate\"\n [selections]=\"selections\"\n [valuesKey]=\"valuesKey\"\n [components]=\"components\"\n [variables]=\"variables\"\n [(model)]=\"component.properties!.setVariables\"></build-variables>\n <!-- <div class=\"d-flex align-items-center py-4\">\n <div class=\"T14M\" style=\"flex: 1\">\u0110i\u1EC1u ki\u1EC7n truy v\u1EA5n</div>\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"component.properties!.query\" hideInlineError></sd-input>\n </div> -->\n }\n }\n @if (!valuesKey) {\n <div class=\"d-flex flex-column\" style=\"gap: 4px\">\n <div class=\"T14M\">{{ 'core.component.form-builder.data-static' | translate }}</div>\n @for (item of values; track item.value; let idx = $index) {\n <div class=\"d-flex align-items-end py-4\" style=\"gap: 4px\">\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"item.value\" (sdChange)=\"onChangeValues()\" hideInlineError></sd-input>\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"item.label\" (sdChange)=\"onChangeValues()\" hideInlineError></sd-input>\n <sd-button prefixIcon=\"delete\" (click)=\"removeItem(idx)\" color=\"error\"></sd-button>\n </div>\n }\n <sd-button prefixIcon=\"add\" [title]=\"'core.component.form-builder.add-data' | translate\" (click)=\"addItem()\" color=\"primary\"></sd-button>\n </div>\n }\n</sd-section>\n", dependencies: [{ kind: "component", type: SdInput$1, selector: "sd-input", inputs: ["autoId", "name", "appearance", "floatLabel", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "required", "readonly", "disabled", "viewed", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "hyperlink", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdAutocomplete$1, selector: "sd-autocomplete", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "valueField", "displayField", "disabledField", "limit", "cacheChecksum", "hyperlink", "items", "hideInlineError", "addable", "required", "disabled", "viewed", "clearable", "validator", "inlineError", "appearance", "model"], outputs: ["modelChange", "sdChange", "sdSelection", "sdAdd"] }, { kind: "component", type: SdButton, selector: "sd-button", inputs: ["autoId", "type", "color", "size", "fontSet", "title", "width", "tooltip", "prefixIcon", "suffixIcon", "disabled", "loading", "block", "htmlType"], outputs: ["click"] }, { kind: "component", type: SdSection, selector: "sd-section", inputs: ["title", "subTitle", "icon", "iconColor", "collapsed", "collapsable", "hideHeader", "noPaddingBody"], outputs: ["collapsedChange"] }, { kind: "component", type: BuildQueries$1, selector: "build-queries", inputs: ["components", "variables", "label", "selections", "valuesKey", "model"], outputs: ["modelChange"] }, { kind: "component", type: BuildVariables, selector: "build-variables", inputs: ["components", "variables", "label", "selections", "valuesKey", "model"], outputs: ["modelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4593
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: AttributeSelection, isStandalone: true, selector: "attribute-selection", inputs: { components: "components", variables: "variables", component: "component", _valuesKey: ["valuesKey", "_valuesKey"], _values: ["values", "_values"] }, outputs: { valuesKeyChange: "valuesKeyChange", valuesChange: "valuesChange", sdChange: "sdChange" }, ngImport: i0, template: "<sd-section class=\"mt-8\" [title]=\"'core.component.form-builder.data' | translate\" icon=\"format_list_bulleted\">\n @if (selections.length) {\n <div class=\"d-flex align-items-center py-4\">\n <div class=\"T14M\" style=\"flex: 1\">{{ 'core.component.form-builder.data-api' | translate }}</div>\n <sd-autocomplete\n style=\"width: 200px\"\n size=\"sm\"\n [(model)]=\"valuesKey\"\n [items]=\"selections\"\n valueField=\"value\"\n displayField=\"display\"\n (sdChange)=\"onChangeValuesKey($event)\"\n hideInlineError></sd-autocomplete>\n </div>\n <!-- N\u1EBFu l\u00E0 select t\u1EEB API th\u00EC cho ph\u00E9p truy\u1EC1n th\u00EAm Query -->\n\n @if (component.type === 'select' && !!valuesKey) {\n <build-queries\n [label]=\"'core.component.form-builder.query-condition' | translate\"\n [selections]=\"selections\"\n [valuesKey]=\"valuesKey\"\n [components]=\"components\"\n [variables]=\"variables\"\n [(model)]=\"component.properties!.query\"></build-queries>\n <build-variables\n [label]=\"'core.component.form-builder.assign-value' | translate\"\n [selections]=\"selections\"\n [valuesKey]=\"valuesKey\"\n [components]=\"components\"\n [variables]=\"variables\"\n [(model)]=\"component.properties!.setVariables\"></build-variables>\n <!-- <div class=\"d-flex align-items-center py-4\">\n <div class=\"T14M\" style=\"flex: 1\">\u0110i\u1EC1u ki\u1EC7n truy v\u1EA5n</div>\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"component.properties!.query\" hideInlineError></sd-input>\n </div> -->\n }\n }\n @if (!valuesKey) {\n <div class=\"d-flex flex-column\" style=\"gap: 4px\">\n <div class=\"T14M\">{{ 'core.component.form-builder.data-static' | translate }}</div>\n @for (item of values; track item.value; let idx = $index) {\n <div class=\"d-flex align-items-end py-4\" style=\"gap: 4px\">\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"item.value\" (sdChange)=\"onChangeValues()\" hideInlineError></sd-input>\n <sd-input style=\"width: 200px\" size=\"sm\" [(model)]=\"item.label\" (sdChange)=\"onChangeValues()\" hideInlineError></sd-input>\n <sd-button prefixIcon=\"delete\" (click)=\"removeItem(idx)\" color=\"error\"></sd-button>\n </div>\n }\n <sd-button prefixIcon=\"add\" [title]=\"'core.component.form-builder.add-data' | translate\" (click)=\"addItem()\" color=\"primary\"></sd-button>\n </div>\n }\n</sd-section>\n", dependencies: [{ kind: "component", type: SdInput$1, selector: "sd-input", inputs: ["autoId", "name", "appearance", "floatLabel", "size", "form", "label", "helperText", "placeholder", "type", "hideInlineError", "blurOnEnter", "required", "readonly", "disabled", "viewed", "minlength", "maxlength", "pattern", "patternErrorMessage", "validator", "inlineError", "hyperlink", "model"], outputs: ["modelChange", "sdChange", "sdFocus", "sdBlur", "keyupEnter", "cleared", "sdFocusForceBlur"] }, { kind: "component", type: SdAutocomplete$1, selector: "sd-autocomplete", inputs: ["autoId", "name", "size", "form", "label", "helperText", "placeholder", "valueField", "displayField", "disabledField", "limit", "cacheChecksum", "hyperlink", "items", "hideInlineError", "addable", "required", "disabled", "viewed", "clearable", "validator", "inlineError", "appearance", "model"], outputs: ["modelChange", "sdChange", "sdSelection", "sdAdd"] }, { kind: "component", type: SdButton, selector: "sd-button", inputs: ["autoId", "type", "color", "size", "fontSet", "title", "width", "tooltip", "prefixIcon", "suffixIcon", "disabled", "loading", "block", "htmlType"], outputs: ["click"] }, { kind: "component", type: SdSection, selector: "sd-section", inputs: ["title", "subTitle", "icon", "iconColor", "collapsed", "collapsible", "collapsable", "hideHeader", "noPaddingBody"], outputs: ["collapsedChange"] }, { kind: "component", type: BuildQueries$1, selector: "build-queries", inputs: ["components", "variables", "label", "selections", "valuesKey", "model"], outputs: ["modelChange"] }, { kind: "component", type: BuildVariables, selector: "build-variables", inputs: ["components", "variables", "label", "selections", "valuesKey", "model"], outputs: ["modelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4594
4594
|
}
|
|
4595
4595
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: AttributeSelection, decorators: [{
|
|
4596
4596
|
type: Component,
|