@sd-angular/core 19.0.0-beta.63 → 19.0.0-beta.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.
|
@@ -34,11 +34,11 @@ class SdSection extends SdBaseSecureComponent {
|
|
|
34
34
|
}
|
|
35
35
|
};
|
|
36
36
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdSection, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
37
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdSection, isStandalone: true, selector: "sd-section", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, collapsable: { classPropertyName: "collapsable", publicName: "collapsable", isSignal: true, isRequired: false, transformFunction: null }, hideHeader: { classPropertyName: "hideHeader", publicName: "hideHeader", isSignal: true, isRequired: false, transformFunction: null }, noPaddingBody: { classPropertyName: "noPaddingBody", publicName: "noPaddingBody", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, usesInheritance: true, ngImport: i0, template: "@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- N\u1EBFu header b\u1ECB \u1EA9n th\u00EC kh\u00F4ng c\u1EA7n border top -->\r\n <div class
|
|
37
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: SdSection, isStandalone: true, selector: "sd-section", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, collapsable: { classPropertyName: "collapsable", publicName: "collapsable", isSignal: true, isRequired: false, transformFunction: null }, hideHeader: { classPropertyName: "hideHeader", publicName: "hideHeader", isSignal: true, isRequired: false, transformFunction: null }, noPaddingBody: { classPropertyName: "noPaddingBody", publicName: "noPaddingBody", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, usesInheritance: true, ngImport: i0, template: "@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- N\u1EBFu header b\u1ECB \u1EA9n th\u00EC kh\u00F4ng c\u1EA7n border top -->\r\n <div [class.p-16]=\"!noPaddingBody()\" [class.c-no-padding-body]=\"noPaddingBody()\" [style.border-top]=\"_hideHeader ? 'none' : '1px solid #e6e6e6'\">\r\n <ng-content></ng-content>\r\n </div>\r\n }\r\n</div>\r\n", styles: [":host{width:100%;display:block}.c-no-padding-body{padding:0!important}.c-shadow-section{box-shadow:-1px 0 #f2f2f2 inset,1px 0 #f2f2f2 inset,0 1px #f2f2f2 inset,0 -1px #f2f2f2 inset,0 1px 2px #2f31361a}.cursor-pointer{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
38
38
|
}
|
|
39
39
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdSection, decorators: [{
|
|
40
40
|
type: Component,
|
|
41
|
-
args: [{ selector: 'sd-section', imports: [MatIconModule], template: "@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- N\u1EBFu header b\u1ECB \u1EA9n th\u00EC kh\u00F4ng c\u1EA7n border top -->\r\n <div class
|
|
41
|
+
args: [{ selector: 'sd-section', imports: [MatIconModule], template: "@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- N\u1EBFu header b\u1ECB \u1EA9n th\u00EC kh\u00F4ng c\u1EA7n border top -->\r\n <div [class.p-16]=\"!noPaddingBody()\" [class.c-no-padding-body]=\"noPaddingBody()\" [style.border-top]=\"_hideHeader ? 'none' : '1px solid #e6e6e6'\">\r\n <ng-content></ng-content>\r\n </div>\r\n }\r\n</div>\r\n", styles: [":host{width:100%;display:block}.c-no-padding-body{padding:0!important}.c-shadow-section{box-shadow:-1px 0 #f2f2f2 inset,1px 0 #f2f2f2 inset,0 1px #f2f2f2 inset,0 -1px #f2f2f2 inset,0 1px 2px #2f31361a}.cursor-pointer{cursor:pointer}\n"] }]
|
|
42
42
|
}], ctorParameters: () => [] });
|
|
43
43
|
|
|
44
44
|
class SdSectionItem {
|
|
@@ -49,11 +49,11 @@ class SdSectionItem {
|
|
|
49
49
|
},
|
|
50
50
|
});
|
|
51
51
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdSectionItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
52
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.17", type: SdSectionItem, isStandalone: true, selector: "sd-section-item", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"c-item\">\r\n <div class=\"T14R text-black400\" [style.width]=\"labelWidth()\">{{ label() }}</div>\r\n <div style=\"flex: 1;\"><ng-content></ng-content></div>\r\n</div>", styles: [":host{width:100%;display:block}.c-item{display:flex;flex-direction:row;align-items:center;column-gap:8px;border-bottom:1px solid #f2f2f2}\n"] });
|
|
52
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.17", type: SdSectionItem, isStandalone: true, selector: "sd-section-item", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"c-item\">\r\n <div class=\"T14R text-black400\" [style.width]=\"labelWidth()\">{{ label() }}</div>\r\n <div style=\"flex: 1;\"><ng-content></ng-content></div>\r\n</div>", styles: [":host{width:100%;display:block}.c-item{display:flex;flex-direction:row;align-items:center;column-gap:8px;padding:8px 16px;border-bottom:1px solid #f2f2f2}\n"] });
|
|
53
53
|
}
|
|
54
54
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: SdSectionItem, decorators: [{
|
|
55
55
|
type: Component,
|
|
56
|
-
args: [{ selector: 'sd-section-item', standalone: true, template: "<div class=\"c-item\">\r\n <div class=\"T14R text-black400\" [style.width]=\"labelWidth()\">{{ label() }}</div>\r\n <div style=\"flex: 1;\"><ng-content></ng-content></div>\r\n</div>", styles: [":host{width:100%;display:block}.c-item{display:flex;flex-direction:row;align-items:center;column-gap:8px;border-bottom:1px solid #f2f2f2}\n"] }]
|
|
56
|
+
args: [{ selector: 'sd-section-item', standalone: true, template: "<div class=\"c-item\">\r\n <div class=\"T14R text-black400\" [style.width]=\"labelWidth()\">{{ label() }}</div>\r\n <div style=\"flex: 1;\"><ng-content></ng-content></div>\r\n</div>", styles: [":host{width:100%;display:block}.c-item{display:flex;flex-direction:row;align-items:center;column-gap:8px;padding:8px 16px;border-bottom:1px solid #f2f2f2}\n"] }]
|
|
57
57
|
}] });
|
|
58
58
|
|
|
59
59
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-angular-core-components-section.mjs","sources":["../../../projects/sd-angular/components/section/src/section.component.ts","../../../projects/sd-angular/components/section/src/section.component.html","../../../projects/sd-angular/components/section/src/section-item/section-item.component.ts","../../../projects/sd-angular/components/section/src/section-item/section-item.component.html","../../../projects/sd-angular/components/section/sd-angular-core-components-section.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { booleanAttribute, Component, effect, ElementRef, inject, input, model } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SdBaseSecureComponent } from '@sd-angular/core/components/base';\r\nimport { SdColor } from '@sd-angular/core/utilities';\r\n\r\n@Component({\r\n selector: 'sd-section',\r\n templateUrl: './section.component.html',\r\n styleUrls: ['./section.component.scss'],\r\n imports: [MatIconModule],\r\n})\r\nexport class SdSection extends SdBaseSecureComponent {\r\n #el = inject(ElementRef);\r\n\r\n title = input<string | null>('', { alias: 'title' });\r\n subTitle = input<string>('', { alias: 'subTitle' });\r\n icon = input<string | null>(null, { alias: 'icon' });\r\n iconColor = input<SdColor>('primary', { alias: 'iconColor' });\r\n\r\n collapsed = model<boolean>(false, { alias: 'collapsed' });\r\n collapsable = input(false, { transform: booleanAttribute, alias: 'collapsable' });\r\n hideHeader = input(false, { transform: booleanAttribute, alias: 'hideHeader' });\r\n noPaddingBody = input(false, { transform: booleanAttribute });\r\n\r\n constructor() {\r\n super();\r\n effect(() => {\r\n if (this.title()) {\r\n this.#el.nativeElement.removeAttribute('title');\r\n }\r\n });\r\n }\r\n\r\n toggleCollapse = () => {\r\n if (this.collapsable()) {\r\n this.collapsed.set(!this.collapsed());\r\n } else {\r\n if (this.collapsed()) {\r\n this.collapsed.set(false);\r\n }\r\n }\r\n };\r\n}\r\n","@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- Nếu header bị ẩn thì không cần border top -->\r\n <div class
|
|
1
|
+
{"version":3,"file":"sd-angular-core-components-section.mjs","sources":["../../../projects/sd-angular/components/section/src/section.component.ts","../../../projects/sd-angular/components/section/src/section.component.html","../../../projects/sd-angular/components/section/src/section-item/section-item.component.ts","../../../projects/sd-angular/components/section/src/section-item/section-item.component.html","../../../projects/sd-angular/components/section/sd-angular-core-components-section.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { booleanAttribute, Component, effect, ElementRef, inject, input, model } from '@angular/core';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SdBaseSecureComponent } from '@sd-angular/core/components/base';\r\nimport { SdColor } from '@sd-angular/core/utilities';\r\n\r\n@Component({\r\n selector: 'sd-section',\r\n templateUrl: './section.component.html',\r\n styleUrls: ['./section.component.scss'],\r\n imports: [MatIconModule],\r\n})\r\nexport class SdSection extends SdBaseSecureComponent {\r\n #el = inject(ElementRef);\r\n\r\n title = input<string | null>('', { alias: 'title' });\r\n subTitle = input<string>('', { alias: 'subTitle' });\r\n icon = input<string | null>(null, { alias: 'icon' });\r\n iconColor = input<SdColor>('primary', { alias: 'iconColor' });\r\n\r\n collapsed = model<boolean>(false, { alias: 'collapsed' });\r\n collapsable = input(false, { transform: booleanAttribute, alias: 'collapsable' });\r\n hideHeader = input(false, { transform: booleanAttribute, alias: 'hideHeader' });\r\n noPaddingBody = input(false, { transform: booleanAttribute });\r\n\r\n constructor() {\r\n super();\r\n effect(() => {\r\n if (this.title()) {\r\n this.#el.nativeElement.removeAttribute('title');\r\n }\r\n });\r\n }\r\n\r\n toggleCollapse = () => {\r\n if (this.collapsable()) {\r\n this.collapsed.set(!this.collapsed());\r\n } else {\r\n if (this.collapsed()) {\r\n this.collapsed.set(false);\r\n }\r\n }\r\n };\r\n}\r\n","@let _hideHeader = hideHeader();\r\n@let _collapsed = collapsed();\r\n@let _title = title();\r\n@let _subTitle = subTitle();\r\n@let _iconColor = iconColor();\r\n<div class=\"rounded-8 bg-white\" [class.c-shadow-section]=\"!_collapsed\">\r\n @if (!_hideHeader) {\r\n <div\r\n class=\"d-flex align-items-center justify-content-between w-full px-16 py-8 cursor-pointer\"\r\n (click)=\"toggleCollapse()\"\r\n aria-hidden=\"true\">\r\n <div class=\"d-flex align-items-center\">\r\n <ng-content select=\"[sdHeaderLeft]\">\r\n @if (icon()) {\r\n <span\r\n class=\"mr-8 material-icons-outlined\"\r\n [class.text-primary]=\"_iconColor === 'primary'\"\r\n [class.text-secondary]=\"_iconColor === 'secondary'\"\r\n [class.text-error]=\"_iconColor === 'error'\"\r\n [class.text-warning]=\"_iconColor === 'warning'\"\r\n [class.text-success]=\"_iconColor === 'success'\">\r\n {{ icon() }}\r\n </span>\r\n }\r\n <div>\r\n @if (_title) {\r\n <div class=\"T16M\">{{ _title }}</div>\r\n }\r\n @if (_subTitle) {\r\n <div class=\"T12R text-secondary\">{{ _subTitle }}</div>\r\n }\r\n </div>\r\n </ng-content>\r\n </div>\r\n <div class=\"d-flex\">\r\n <ng-content select=\"[sdHeaderRight]\"></ng-content>\r\n @if (_collapsed) {\r\n <div class=\"d-flex align-items-center\">\r\n @if (_collapsed) {\r\n <mat-icon>expand_more</mat-icon>\r\n } @else {\r\n <mat-icon>expand_less</mat-icon>\r\n }\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @if (!_collapsed || _hideHeader) {\r\n <!-- Nếu header bị ẩn thì không cần border top -->\r\n <div [class.p-16]=\"!noPaddingBody()\" [class.c-no-padding-body]=\"noPaddingBody()\" [style.border-top]=\"_hideHeader ? 'none' : '1px solid #e6e6e6'\">\r\n <ng-content></ng-content>\r\n </div>\r\n }\r\n</div>\r\n","import { Component, input } from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sd-section-item',\r\n templateUrl: './section-item.component.html',\r\n styleUrls: ['section-item.component.scss'],\r\n standalone: true,\r\n})\r\nexport class SdSectionItem {\r\n label = input.required<string>();\r\n labelWidth = input<string, string | null | undefined>('150px', {\r\n transform: (val: any): string => {\r\n return val || '150px';\r\n },\r\n });\r\n}\r\n","<div class=\"c-item\">\r\n <div class=\"T14R text-black400\" [style.width]=\"labelWidth()\">{{ label() }}</div>\r\n <div style=\"flex: 1;\"><ng-content></ng-content></div>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sd-angular/core",
|
|
3
|
-
"version": "19.0.0-beta.
|
|
3
|
+
"version": "19.0.0-beta.65",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/common": "^19.0.0 || ^20.0.0 || ^21.0.0",
|
|
6
6
|
"@angular/core": "^19.0.0 || ^20.0.0 || ^21.0.0",
|
|
@@ -30,6 +30,10 @@
|
|
|
30
30
|
"types": "./index.d.ts",
|
|
31
31
|
"default": "./fesm2022/sd-angular-core.mjs"
|
|
32
32
|
},
|
|
33
|
+
"./directives": {
|
|
34
|
+
"types": "./directives/index.d.ts",
|
|
35
|
+
"default": "./fesm2022/sd-angular-core-directives.mjs"
|
|
36
|
+
},
|
|
33
37
|
"./components": {
|
|
34
38
|
"types": "./components/index.d.ts",
|
|
35
39
|
"default": "./fesm2022/sd-angular-core-components.mjs"
|
|
@@ -38,18 +42,14 @@
|
|
|
38
42
|
"types": "./configurations/index.d.ts",
|
|
39
43
|
"default": "./fesm2022/sd-angular-core-configurations.mjs"
|
|
40
44
|
},
|
|
41
|
-
"./
|
|
42
|
-
"types": "./
|
|
43
|
-
"default": "./fesm2022/sd-angular-core-
|
|
45
|
+
"./guards": {
|
|
46
|
+
"types": "./guards/index.d.ts",
|
|
47
|
+
"default": "./fesm2022/sd-angular-core-guards.mjs"
|
|
44
48
|
},
|
|
45
49
|
"./forms": {
|
|
46
50
|
"types": "./forms/index.d.ts",
|
|
47
51
|
"default": "./fesm2022/sd-angular-core-forms.mjs"
|
|
48
52
|
},
|
|
49
|
-
"./guards": {
|
|
50
|
-
"types": "./guards/index.d.ts",
|
|
51
|
-
"default": "./fesm2022/sd-angular-core-guards.mjs"
|
|
52
|
-
},
|
|
53
53
|
"./handlers": {
|
|
54
54
|
"types": "./handlers/index.d.ts",
|
|
55
55
|
"default": "./fesm2022/sd-angular-core-handlers.mjs"
|
|
@@ -86,14 +86,14 @@
|
|
|
86
86
|
"types": "./components/badge/index.d.ts",
|
|
87
87
|
"default": "./fesm2022/sd-angular-core-components-badge.mjs"
|
|
88
88
|
},
|
|
89
|
-
"./components/avatar": {
|
|
90
|
-
"types": "./components/avatar/index.d.ts",
|
|
91
|
-
"default": "./fesm2022/sd-angular-core-components-avatar.mjs"
|
|
92
|
-
},
|
|
93
89
|
"./components/base": {
|
|
94
90
|
"types": "./components/base/index.d.ts",
|
|
95
91
|
"default": "./fesm2022/sd-angular-core-components-base.mjs"
|
|
96
92
|
},
|
|
93
|
+
"./components/avatar": {
|
|
94
|
+
"types": "./components/avatar/index.d.ts",
|
|
95
|
+
"default": "./fesm2022/sd-angular-core-components-avatar.mjs"
|
|
96
|
+
},
|
|
97
97
|
"./components/button": {
|
|
98
98
|
"types": "./components/button/index.d.ts",
|
|
99
99
|
"default": "./fesm2022/sd-angular-core-components-button.mjs"
|
|
@@ -102,6 +102,10 @@
|
|
|
102
102
|
"types": "./components/code-editor/index.d.ts",
|
|
103
103
|
"default": "./fesm2022/sd-angular-core-components-code-editor.mjs"
|
|
104
104
|
},
|
|
105
|
+
"./components/import-excel": {
|
|
106
|
+
"types": "./components/import-excel/index.d.ts",
|
|
107
|
+
"default": "./fesm2022/sd-angular-core-components-import-excel.mjs"
|
|
108
|
+
},
|
|
105
109
|
"./components/history": {
|
|
106
110
|
"types": "./components/history/index.d.ts",
|
|
107
111
|
"default": "./fesm2022/sd-angular-core-components-history.mjs"
|
|
@@ -110,22 +114,22 @@
|
|
|
110
114
|
"types": "./components/document-builder/index.d.ts",
|
|
111
115
|
"default": "./fesm2022/sd-angular-core-components-document-builder.mjs"
|
|
112
116
|
},
|
|
113
|
-
"./components/
|
|
114
|
-
"types": "./components/
|
|
115
|
-
"default": "./fesm2022/sd-angular-core-components-
|
|
117
|
+
"./components/mini-editor": {
|
|
118
|
+
"types": "./components/mini-editor/index.d.ts",
|
|
119
|
+
"default": "./fesm2022/sd-angular-core-components-mini-editor.mjs"
|
|
116
120
|
},
|
|
117
121
|
"./components/modal": {
|
|
118
122
|
"types": "./components/modal/index.d.ts",
|
|
119
123
|
"default": "./fesm2022/sd-angular-core-components-modal.mjs"
|
|
120
124
|
},
|
|
125
|
+
"./components/section": {
|
|
126
|
+
"types": "./components/section/index.d.ts",
|
|
127
|
+
"default": "./fesm2022/sd-angular-core-components-section.mjs"
|
|
128
|
+
},
|
|
121
129
|
"./components/preview": {
|
|
122
130
|
"types": "./components/preview/index.d.ts",
|
|
123
131
|
"default": "./fesm2022/sd-angular-core-components-preview.mjs"
|
|
124
132
|
},
|
|
125
|
-
"./components/mini-editor": {
|
|
126
|
-
"types": "./components/mini-editor/index.d.ts",
|
|
127
|
-
"default": "./fesm2022/sd-angular-core-components-mini-editor.mjs"
|
|
128
|
-
},
|
|
129
133
|
"./components/query-builder": {
|
|
130
134
|
"types": "./components/query-builder/index.d.ts",
|
|
131
135
|
"default": "./fesm2022/sd-angular-core-components-query-builder.mjs"
|
|
@@ -134,18 +138,10 @@
|
|
|
134
138
|
"types": "./components/quick-action/index.d.ts",
|
|
135
139
|
"default": "./fesm2022/sd-angular-core-components-quick-action.mjs"
|
|
136
140
|
},
|
|
137
|
-
"./components/section": {
|
|
138
|
-
"types": "./components/section/index.d.ts",
|
|
139
|
-
"default": "./fesm2022/sd-angular-core-components-section.mjs"
|
|
140
|
-
},
|
|
141
141
|
"./components/side-drawer": {
|
|
142
142
|
"types": "./components/side-drawer/index.d.ts",
|
|
143
143
|
"default": "./fesm2022/sd-angular-core-components-side-drawer.mjs"
|
|
144
144
|
},
|
|
145
|
-
"./components/tab-router": {
|
|
146
|
-
"types": "./components/tab-router/index.d.ts",
|
|
147
|
-
"default": "./fesm2022/sd-angular-core-components-tab-router.mjs"
|
|
148
|
-
},
|
|
149
145
|
"./components/table": {
|
|
150
146
|
"types": "./components/table/index.d.ts",
|
|
151
147
|
"default": "./fesm2022/sd-angular-core-components-table.mjs"
|
|
@@ -154,14 +150,22 @@
|
|
|
154
150
|
"types": "./components/upload-file/index.d.ts",
|
|
155
151
|
"default": "./fesm2022/sd-angular-core-components-upload-file.mjs"
|
|
156
152
|
},
|
|
157
|
-
"./components/
|
|
158
|
-
"types": "./components/
|
|
159
|
-
"default": "./fesm2022/sd-angular-core-components-
|
|
153
|
+
"./components/view": {
|
|
154
|
+
"types": "./components/view/index.d.ts",
|
|
155
|
+
"default": "./fesm2022/sd-angular-core-components-view.mjs"
|
|
160
156
|
},
|
|
161
157
|
"./forms/autocomplete": {
|
|
162
158
|
"types": "./forms/autocomplete/index.d.ts",
|
|
163
159
|
"default": "./fesm2022/sd-angular-core-forms-autocomplete.mjs"
|
|
164
160
|
},
|
|
161
|
+
"./guards/permission": {
|
|
162
|
+
"types": "./guards/permission/index.d.ts",
|
|
163
|
+
"default": "./fesm2022/sd-angular-core-guards-permission.mjs"
|
|
164
|
+
},
|
|
165
|
+
"./components/workflow": {
|
|
166
|
+
"types": "./components/workflow/index.d.ts",
|
|
167
|
+
"default": "./fesm2022/sd-angular-core-components-workflow.mjs"
|
|
168
|
+
},
|
|
165
169
|
"./forms/checkbox": {
|
|
166
170
|
"types": "./forms/checkbox/index.d.ts",
|
|
167
171
|
"default": "./fesm2022/sd-angular-core-forms-checkbox.mjs"
|
|
@@ -186,14 +190,14 @@
|
|
|
186
190
|
"types": "./forms/datetime/index.d.ts",
|
|
187
191
|
"default": "./fesm2022/sd-angular-core-forms-datetime.mjs"
|
|
188
192
|
},
|
|
189
|
-
"./forms/directives": {
|
|
190
|
-
"types": "./forms/directives/index.d.ts",
|
|
191
|
-
"default": "./fesm2022/sd-angular-core-forms-directives.mjs"
|
|
192
|
-
},
|
|
193
193
|
"./forms/input": {
|
|
194
194
|
"types": "./forms/input/index.d.ts",
|
|
195
195
|
"default": "./fesm2022/sd-angular-core-forms-input.mjs"
|
|
196
196
|
},
|
|
197
|
+
"./forms/directives": {
|
|
198
|
+
"types": "./forms/directives/index.d.ts",
|
|
199
|
+
"default": "./fesm2022/sd-angular-core-forms-directives.mjs"
|
|
200
|
+
},
|
|
197
201
|
"./forms/input-number": {
|
|
198
202
|
"types": "./forms/input-number/index.d.ts",
|
|
199
203
|
"default": "./fesm2022/sd-angular-core-forms-input-number.mjs"
|
|
@@ -222,10 +226,6 @@
|
|
|
222
226
|
"types": "./forms/textarea/index.d.ts",
|
|
223
227
|
"default": "./fesm2022/sd-angular-core-forms-textarea.mjs"
|
|
224
228
|
},
|
|
225
|
-
"./guards/permission": {
|
|
226
|
-
"types": "./guards/permission/index.d.ts",
|
|
227
|
-
"default": "./fesm2022/sd-angular-core-guards-permission.mjs"
|
|
228
|
-
},
|
|
229
229
|
"./modules/auth": {
|
|
230
230
|
"types": "./modules/auth/index.d.ts",
|
|
231
231
|
"default": "./fesm2022/sd-angular-core-modules-auth.mjs"
|
|
@@ -246,14 +246,14 @@
|
|
|
246
246
|
"types": "./services/api/index.d.ts",
|
|
247
247
|
"default": "./fesm2022/sd-angular-core-services-api.mjs"
|
|
248
248
|
},
|
|
249
|
-
"./services/confirm": {
|
|
250
|
-
"types": "./services/confirm/index.d.ts",
|
|
251
|
-
"default": "./fesm2022/sd-angular-core-services-confirm.mjs"
|
|
252
|
-
},
|
|
253
249
|
"./services/cache": {
|
|
254
250
|
"types": "./services/cache/index.d.ts",
|
|
255
251
|
"default": "./fesm2022/sd-angular-core-services-cache.mjs"
|
|
256
252
|
},
|
|
253
|
+
"./services/confirm": {
|
|
254
|
+
"types": "./services/confirm/index.d.ts",
|
|
255
|
+
"default": "./fesm2022/sd-angular-core-services-confirm.mjs"
|
|
256
|
+
},
|
|
257
257
|
"./services/docx": {
|
|
258
258
|
"types": "./services/docx/index.d.ts",
|
|
259
259
|
"default": "./fesm2022/sd-angular-core-services-docx.mjs"
|
|
@@ -262,17 +262,13 @@
|
|
|
262
262
|
"types": "./services/excel/index.d.ts",
|
|
263
263
|
"default": "./fesm2022/sd-angular-core-services-excel.mjs"
|
|
264
264
|
},
|
|
265
|
-
"./services/firebase": {
|
|
266
|
-
"types": "./services/firebase/index.d.ts",
|
|
267
|
-
"default": "./fesm2022/sd-angular-core-services-firebase.mjs"
|
|
268
|
-
},
|
|
269
265
|
"./services/license": {
|
|
270
266
|
"types": "./services/license/index.d.ts",
|
|
271
267
|
"default": "./fesm2022/sd-angular-core-services-license.mjs"
|
|
272
268
|
},
|
|
273
|
-
"./services/
|
|
274
|
-
"types": "./services/
|
|
275
|
-
"default": "./fesm2022/sd-angular-core-services-
|
|
269
|
+
"./services/firebase": {
|
|
270
|
+
"types": "./services/firebase/index.d.ts",
|
|
271
|
+
"default": "./fesm2022/sd-angular-core-services-firebase.mjs"
|
|
276
272
|
},
|
|
277
273
|
"./services/notify": {
|
|
278
274
|
"types": "./services/notify/index.d.ts",
|
|
@@ -290,9 +286,13 @@
|
|
|
290
286
|
"types": "./utilities/models/index.d.ts",
|
|
291
287
|
"default": "./fesm2022/sd-angular-core-utilities-models.mjs"
|
|
292
288
|
},
|
|
293
|
-
"./
|
|
294
|
-
"types": "./
|
|
295
|
-
"default": "./fesm2022/sd-angular-core-
|
|
289
|
+
"./services/loading": {
|
|
290
|
+
"types": "./services/loading/index.d.ts",
|
|
291
|
+
"default": "./fesm2022/sd-angular-core-services-loading.mjs"
|
|
292
|
+
},
|
|
293
|
+
"./components/tab-router": {
|
|
294
|
+
"types": "./components/tab-router/index.d.ts",
|
|
295
|
+
"default": "./fesm2022/sd-angular-core-components-tab-router.mjs"
|
|
296
296
|
}
|
|
297
297
|
}
|
|
298
298
|
}
|
|
index 62470ea..af5bc8d 100644
|
|
|
Binary file
|