@sd-angular/core 19.0.0-beta.102 → 19.0.0-beta.104

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.
Files changed (17) hide show
  1. package/components/query-bar/src/actions-bar.component.d.ts +7 -10
  2. package/components/query-bar/src/inline-chip.component.d.ts +6 -1
  3. package/fesm2022/sd-angular-core-components-button.mjs +2 -2
  4. package/fesm2022/sd-angular-core-components-button.mjs.map +1 -1
  5. package/fesm2022/sd-angular-core-components-query-bar.mjs +33 -28
  6. package/fesm2022/sd-angular-core-components-query-bar.mjs.map +1 -1
  7. package/fesm2022/sd-angular-core-components-upload-file.mjs +14 -13
  8. package/fesm2022/sd-angular-core-components-upload-file.mjs.map +1 -1
  9. package/fesm2022/sd-angular-core-forms-checkbox.mjs +11 -2
  10. package/fesm2022/sd-angular-core-forms-checkbox.mjs.map +1 -1
  11. package/fesm2022/sd-angular-core-forms-radio.mjs +11 -2
  12. package/fesm2022/sd-angular-core-forms-radio.mjs.map +1 -1
  13. package/fesm2022/sd-angular-core-forms-switch.mjs +12 -2
  14. package/fesm2022/sd-angular-core-forms-switch.mjs.map +1 -1
  15. package/package.json +48 -48
  16. package/sd-angular-core-19.0.0-beta.104.tgz +0 -0
  17. package/sd-angular-core-19.0.0-beta.102.tgz +0 -0
package/components/query-bar/src/actions-bar.component.d.ts CHANGED
@@ -1,14 +1,14 @@
1
1
  import { SdQuery, SdQueryLogic, SdSavedFilter } from './query-bar.model';
2
2
  import * as i0 from "@angular/core";
3
3
  /**
4
- * Right-pinned toolbar for `sd-query-bar`: AND/OR connector toggle, saved-filters
5
- * dropdown, clear-all, a save-filter shortcut, and the deferred Search trigger.
6
- * Owns no business logic — just routes user intent back via outputs
7
- * (`(logic)` model, `(clear)`, `(search)`, `(applyFilter)`).
4
+ * Right-pinned toolbar for `sd-query-bar`: AND/OR connector toggle, clear-all,
5
+ * saved-filters dropdown (with footer "Lưu bộ lọc hiện tại"), and the deferred
6
+ * Search trigger. Owns no business logic — just routes user intent back via
7
+ * outputs (`(logic)` model, `(clear)`, `(search)`, `(applyFilter)`).
8
8
  *
9
- * The "save filter" button forwards to `SdQuerySavedFiltersMenu.promptSave()` so
10
- * the user can save the current query without first opening the saved-filters
11
- * dropdown — keeps the save action adjacent to the Search trigger.
9
+ * The "save current query" action lives INSIDE the saved-filters mat-menu
10
+ * footer (one zone for both apply + save). The dropdown trigger sits
11
+ * immediately before Search so the user sees one filter-cluster on the right.
12
12
  */
13
13
  export declare class SdQueryActionsBar {
14
14
  readonly showLogicToggle: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
@@ -22,10 +22,7 @@ export declare class SdQueryActionsBar {
22
22
  readonly clear: import("@angular/core").OutputEmitterRef<void>;
23
23
  readonly canSearch: import("@angular/core").InputSignal<boolean>;
24
24
  readonly search: import("@angular/core").OutputEmitterRef<void>;
25
- private readonly savedFiltersMenu;
26
25
  setLogic(value: SdQueryLogic): void;
27
- /** Trigger save-current-query via the saved-filters child (no-op when menu absent / no key). */
28
- promptSave(): void;
29
26
  static ɵfac: i0.ɵɵFactoryDeclaration<SdQueryActionsBar, never>;
30
27
  static ɵcmp: i0.ɵɵComponentDeclaration<SdQueryActionsBar, "sd-query-actions-bar", never, { "showLogicToggle": { "alias": "showLogicToggle"; "required": false; "isSignal": true; }; "logic": { "alias": "logic"; "required": false; "isSignal": true; }; "filtersCount": { "alias": "filtersCount"; "required": false; "isSignal": true; }; "showSavedFilters": { "alias": "showSavedFilters"; "required": false; "isSignal": true; }; "savedFiltersKey": { "alias": "savedFiltersKey"; "required": false; "isSignal": true; }; "query": { "alias": "query"; "required": false; "isSignal": true; }; "showClearAll": { "alias": "showClearAll"; "required": false; "isSignal": true; }; "canSearch": { "alias": "canSearch"; "required": false; "isSignal": true; }; }, { "logic": "logicChange"; "applyFilter": "applyFilter"; "clear": "clear"; "search": "search"; }, never, never, true, never>;
31
28
  }
package/components/query-bar/src/inline-chip.component.d.ts CHANGED
@@ -67,7 +67,12 @@ export declare class SdQueryInlineChip {
67
67
  onFocusOutForTest(ev: FocusEvent): void;
68
68
  /** Single-value commit (sd-date, sd-datetime, single sd-select). */
69
69
  emitSingleCommit(v: unknown): void;
70
- /** BETWEEN commit — sd-date-range emits {from, to}. */
70
+ /**
71
+ * BETWEEN commit — sd-date-range emits {from, to}.
72
+ * why: nếu cả from + to đều có giá trị → coi như range đã chọn xong → exit edit
73
+ * ngay tại commit (đồng bộ với model.set của parent), không chờ focusout. Tránh
74
+ * race "focusout firing trước sdChange" làm viewed text render với model cũ.
75
+ */
71
76
  emitRangeCommit(ev: {
72
77
  from: unknown;
73
78
  to: unknown;
package/fesm2022/sd-angular-core-components-button.mjs CHANGED
@@ -98,7 +98,7 @@ class SdButton extends SdBaseSecureComponent {
98
98
  this.#subscription.unsubscribe();
99
99
  }
100
100
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
101
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdButton, isStandalone: true, selector: "sd-button", inputs: { autoIdInput: { classPropertyName: "autoIdInput", publicName: "autoId", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fontSet: { classPropertyName: "fontSet", publicName: "fontSet", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, prefixIcon: { classPropertyName: "prefixIcon", publicName: "prefixIcon", isSignal: true, isRequired: false, transformFunction: null }, suffixIcon: { classPropertyName: "suffixIcon", publicName: "suffixIcon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, htmlType: { classPropertyName: "htmlType", publicName: "htmlType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, host: { properties: { "class.sd-disabled": "disabled()", "class.sd-loading": "loading()", "class.sd-block": "block()", "attr.disabled": "disabled() ? \"true\" : null" } }, usesInheritance: true, ngImport: i0, template: "@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{display:inline-block;pointer-events:auto}:host.sd-disabled{cursor:not-allowed}:host.sd-loading{cursor:wait}:host.sd-block{display:block;width:100%}:host.sd-block button{width:100%}:host ::ng-deep button.c-button{pointer-events:auto;min-width:auto}:host ::ng-deep button.c-button .mat-button-wrapper,:host ::ng-deep button.c-button .mdc-button__label{display:flex;align-items:center;justify-content:center;width:100%}:host ::ng-deep button.c-button[disabled],:host ::ng-deep button.c-button.mat-button-disabled{pointer-events:none;color:#a6a6a6!important;background-color:#e9e9e9!important}:host ::ng-deep button.c-button.c-square{min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-sm{font-size:14px!important;height:32px;line-height:20px!important;padding:2px 12px!important;font-weight:400}:host ::ng-deep button.c-button.c-sm mat-icon{height:16px!important;width:16px!important;font-size:16px!important}:host ::ng-deep button.c-button.c-sm.c-square{width:32px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-md{font-size:16px;height:40px;line-height:20px;padding:2px 16px!important;font-weight:400}:host ::ng-deep button.c-button.c-md mat-icon{height:20px!important;width:20px!important;font-size:20px!important}:host ::ng-deep button.c-button.c-md.c-square{width:40px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-lg{font-size:16px!important;line-height:20px!important;padding:2px 16px!important;height:48px}:host ::ng-deep button.c-button.c-lg.c-square{width:48px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button:focus{outline:none}:host ::ng-deep button.c-button.c-disabled{opacity:.5}:host ::ng-deep button.c-button.c-block{width:100%!important}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-secondary{background-color:#000!important;color:#fff}:host ::ng-deep button.c-button.c-fill .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#fff!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary-light);color:var(--sd-primary)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info-light);color:var(--sd-info)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success-light);color:var(--sd-success)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning-light);color:var(--sd-warning)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error-light);color:var(--sd-error)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary{background-color:var(--sd-secondary-light);color:#000!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button{border-color:#d3d3d3}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-button-disabled{background:transparent!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep .c-button-content-wrapper{display:flex;align-items:center;justify-content:center;width:100%;pointer-events:none}:host ::ng-deep .c-spinner{display:inline-block}:host.sd-loading ::ng-deep button.c-button{pointer-events:none;opacity:.85}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
101
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.21", type: SdButton, isStandalone: true, selector: "sd-button", inputs: { autoIdInput: { classPropertyName: "autoIdInput", publicName: "autoId", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, fontSet: { classPropertyName: "fontSet", publicName: "fontSet", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, prefixIcon: { classPropertyName: "prefixIcon", publicName: "prefixIcon", isSignal: true, isRequired: false, transformFunction: null }, suffixIcon: { classPropertyName: "suffixIcon", publicName: "suffixIcon", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, htmlType: { classPropertyName: "htmlType", publicName: "htmlType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { click: "click" }, host: { properties: { "class.sd-disabled": "disabled()", "class.sd-loading": "loading()", "class.sd-block": "block()", "attr.disabled": "disabled() ? \"true\" : null" } }, usesInheritance: true, ngImport: i0, template: "@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{display:inline-block;pointer-events:auto}:host.sd-disabled{cursor:not-allowed}:host.sd-loading{cursor:wait}:host.sd-block{display:block;width:100%}:host.sd-block button{width:100%}:host ::ng-deep button.c-button{pointer-events:auto;min-width:auto;white-space:nowrap}:host ::ng-deep button.c-button .mat-button-wrapper,:host ::ng-deep button.c-button .mdc-button__label{display:flex;align-items:center;justify-content:center;width:100%;min-width:0}:host ::ng-deep button.c-button[disabled],:host ::ng-deep button.c-button.mat-button-disabled{pointer-events:none;color:#a6a6a6!important;background-color:#e9e9e9!important}:host ::ng-deep button.c-button.c-square{min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-sm{font-size:14px!important;height:32px;line-height:20px!important;padding:2px 12px!important;font-weight:400}:host ::ng-deep button.c-button.c-sm mat-icon{height:16px!important;width:16px!important;font-size:16px!important}:host ::ng-deep button.c-button.c-sm.c-square{width:32px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-md{font-size:16px;height:40px;line-height:20px;padding:2px 16px!important;font-weight:400}:host ::ng-deep button.c-button.c-md mat-icon{height:20px!important;width:20px!important;font-size:20px!important}:host ::ng-deep button.c-button.c-md.c-square{width:40px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-lg{font-size:16px!important;line-height:20px!important;padding:2px 16px!important;height:48px}:host ::ng-deep button.c-button.c-lg.c-square{width:48px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button:focus{outline:none}:host ::ng-deep button.c-button.c-disabled{opacity:.5}:host ::ng-deep button.c-button.c-block{width:100%!important}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-secondary{background-color:#000!important;color:#fff}:host ::ng-deep button.c-button.c-fill .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#fff!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary-light);color:var(--sd-primary)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info-light);color:var(--sd-info)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success-light);color:var(--sd-success)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning-light);color:var(--sd-warning)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error-light);color:var(--sd-error)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary{background-color:var(--sd-secondary-light);color:#000!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button{border-color:#d3d3d3}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-button-disabled{background:transparent!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep .c-button-content-wrapper{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;pointer-events:none}:host ::ng-deep .c-title{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .c-spinner{display:inline-block}:host.sd-loading ::ng-deep button.c-button{pointer-events:none;opacity:.85}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i4.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
102
102
  }
103
103
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImport: i0, type: SdButton, decorators: [{
104
104
  type: Component,
@@ -107,7 +107,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.21", ngImpo
107
107
  '[class.sd-loading]': 'loading()',
108
108
  '[class.sd-block]': 'block()',
109
109
  '[attr.disabled]': 'disabled() ? "true" : null',
110
- }, template: "@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{display:inline-block;pointer-events:auto}:host.sd-disabled{cursor:not-allowed}:host.sd-loading{cursor:wait}:host.sd-block{display:block;width:100%}:host.sd-block button{width:100%}:host ::ng-deep button.c-button{pointer-events:auto;min-width:auto}:host ::ng-deep button.c-button .mat-button-wrapper,:host ::ng-deep button.c-button .mdc-button__label{display:flex;align-items:center;justify-content:center;width:100%}:host ::ng-deep button.c-button[disabled],:host ::ng-deep button.c-button.mat-button-disabled{pointer-events:none;color:#a6a6a6!important;background-color:#e9e9e9!important}:host ::ng-deep button.c-button.c-square{min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-sm{font-size:14px!important;height:32px;line-height:20px!important;padding:2px 12px!important;font-weight:400}:host ::ng-deep button.c-button.c-sm mat-icon{height:16px!important;width:16px!important;font-size:16px!important}:host ::ng-deep button.c-button.c-sm.c-square{width:32px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-md{font-size:16px;height:40px;line-height:20px;padding:2px 16px!important;font-weight:400}:host ::ng-deep button.c-button.c-md mat-icon{height:20px!important;width:20px!important;font-size:20px!important}:host ::ng-deep button.c-button.c-md.c-square{width:40px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-lg{font-size:16px!important;line-height:20px!important;padding:2px 16px!important;height:48px}:host ::ng-deep button.c-button.c-lg.c-square{width:48px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button:focus{outline:none}:host ::ng-deep button.c-button.c-disabled{opacity:.5}:host ::ng-deep button.c-button.c-block{width:100%!important}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-secondary{background-color:#000!important;color:#fff}:host ::ng-deep button.c-button.c-fill .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#fff!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary-light);color:var(--sd-primary)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info-light);color:var(--sd-info)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success-light);color:var(--sd-success)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning-light);color:var(--sd-warning)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error-light);color:var(--sd-error)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary{background-color:var(--sd-secondary-light);color:#000!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button{border-color:#d3d3d3}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-button-disabled{background:transparent!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep .c-button-content-wrapper{display:flex;align-items:center;justify-content:center;width:100%;pointer-events:none}:host ::ng-deep .c-spinner{display:inline-block}:host.sd-loading ::ng-deep button.c-button{pointer-events:none;opacity:.85}\n"] }]
110
+ }, template: "@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n", styles: [".text-primary{color:var(--sd-primary)!important}.bg-primary{background:var(--sd-primary)!important}.border-primary{border-color:var(--sd-primary)!important}.text-primary-light{color:var(--sd-primary-light)!important}.bg-primary-light{background:var(--sd-primary-light)!important}.border-primary-light{border-color:var(--sd-primary-light)!important}.text-primary-dark{color:var(--sd-primary-dark)!important}.bg-primary-dark{background:var(--sd-primary-dark)!important}.border-primary-dark{border-color:var(--sd-primary-dark)!important}.text-info{color:var(--sd-info)!important}.bg-info{background:var(--sd-info)!important}.border-info{border-color:var(--sd-info)!important}.text-info-light{color:var(--sd-info-light)!important}.bg-info-light{background:var(--sd-info-light)!important}.border-info-light{border-color:var(--sd-info-light)!important}.text-info-dark{color:var(--sd-info-dark)!important}.bg-info-dark{background:var(--sd-info-dark)!important}.border-info-dark{border-color:var(--sd-info-dark)!important}.text-success{color:var(--sd-success)!important}.bg-success{background:var(--sd-success)!important}.border-success{border-color:var(--sd-success)!important}.text-success-light{color:var(--sd-success-light)!important}.bg-success-light{background:var(--sd-success-light)!important}.border-success-light{border-color:var(--sd-success-light)!important}.text-success-dark{color:var(--sd-success-dark)!important}.bg-success-dark{background:var(--sd-success-dark)!important}.border-success-dark{border-color:var(--sd-success-dark)!important}.text-warning{color:var(--sd-warning)!important}.bg-warning{background:var(--sd-warning)!important}.border-warning{border-color:var(--sd-warning)!important}.text-warning-light{color:var(--sd-warning-light)!important}.bg-warning-light{background:var(--sd-warning-light)!important}.border-warning-light{border-color:var(--sd-warning-light)!important}.text-warning-dark{color:var(--sd-warning-dark)!important}.bg-warning-dark{background:var(--sd-warning-dark)!important}.border-warning-dark{border-color:var(--sd-warning-dark)!important}.text-error{color:var(--sd-error)!important}.bg-error{background:var(--sd-error)!important}.border-error{border-color:var(--sd-error)!important}.text-error-light{color:var(--sd-error-light)!important}.bg-error-light{background:var(--sd-error-light)!important}.border-error-light{border-color:var(--sd-error-light)!important}.text-error-dark{color:var(--sd-error-dark)!important}.bg-error-dark{background:var(--sd-error-dark)!important}.border-error-dark{border-color:var(--sd-error-dark)!important}.text-secondary{color:var(--sd-secondary)!important}.bg-secondary{background:var(--sd-secondary)!important}.border-secondary{border-color:var(--sd-secondary)!important}.text-secondary-light{color:var(--sd-secondary-light)!important}.bg-secondary-light{background:var(--sd-secondary-light)!important}.border-secondary-light{border-color:var(--sd-secondary-light)!important}.text-secondary-dark{color:var(--sd-secondary-dark)!important}.bg-secondary-dark{background:var(--sd-secondary-dark)!important}.border-secondary-dark{border-color:var(--sd-secondary-dark)!important}.text-light{color:var(--sd-light)!important}.bg-light{background:var(--sd-light)!important}.border-light{border-color:var(--sd-light)!important}.text-dark{color:var(--sd-dark)!important}.bg-dark{background:var(--sd-dark)!important}.border-dark{border-color:var(--sd-dark)!important}.text-black500{color:var(--sd-black500)!important}.bg-black500{background:var(--sd-black500)!important}.border-black500{border-color:var(--sd-black500)!important}.text-black400{color:var(--sd-black400)!important}.bg-black400{background:var(--sd-black400)!important}.border-black400{border-color:var(--sd-black400)!important}.text-black300{color:var(--sd-black300)!important}.bg-black300{background:var(--sd-black300)!important}.border-black300{border-color:var(--sd-black300)!important}.text-black200{color:var(--sd-black200)!important}.bg-black200{background:var(--sd-black200)!important}.border-black200{border-color:var(--sd-black200)!important}.text-black100{color:var(--sd-black100)!important}.bg-black100{background:var(--sd-black100)!important}.border-black100{border-color:var(--sd-black100)!important}.text-white{color:#fff!important}.bg-white{background:#fff!important}.border-white{border-color:#fff!important}.text-black{color:#000!important}.bg-black{background:#000!important}.border-black{border-color:#000!important}:host{display:inline-block;pointer-events:auto}:host.sd-disabled{cursor:not-allowed}:host.sd-loading{cursor:wait}:host.sd-block{display:block;width:100%}:host.sd-block button{width:100%}:host ::ng-deep button.c-button{pointer-events:auto;min-width:auto;white-space:nowrap}:host ::ng-deep button.c-button .mat-button-wrapper,:host ::ng-deep button.c-button .mdc-button__label{display:flex;align-items:center;justify-content:center;width:100%;min-width:0}:host ::ng-deep button.c-button[disabled],:host ::ng-deep button.c-button.mat-button-disabled{pointer-events:none;color:#a6a6a6!important;background-color:#e9e9e9!important}:host ::ng-deep button.c-button.c-square{min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-sm{font-size:14px!important;height:32px;line-height:20px!important;padding:2px 12px!important;font-weight:400}:host ::ng-deep button.c-button.c-sm mat-icon{height:16px!important;width:16px!important;font-size:16px!important}:host ::ng-deep button.c-button.c-sm.c-square{width:32px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-md{font-size:16px;height:40px;line-height:20px;padding:2px 16px!important;font-weight:400}:host ::ng-deep button.c-button.c-md mat-icon{height:20px!important;width:20px!important;font-size:20px!important}:host ::ng-deep button.c-button.c-md.c-square{width:40px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button.c-lg{font-size:16px!important;line-height:20px!important;padding:2px 16px!important;height:48px}:host ::ng-deep button.c-button.c-lg.c-square{width:48px!important;min-width:auto!important;padding:0!important}:host ::ng-deep button.c-button:focus{outline:none}:host ::ng-deep button.c-button.c-disabled{opacity:.5}:host ::ng-deep button.c-button.c-block{width:100%!important}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error);color:#fff}:host ::ng-deep button.c-button.c-fill.mat-mdc-unelevated-button.mat-secondary{background-color:#000!important;color:#fff}:host ::ng-deep button.c-button.c-fill .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#fff!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary{background-color:var(--sd-primary-light);color:var(--sd-primary)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info{background-color:var(--sd-info-light);color:var(--sd-info)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success{background-color:var(--sd-success-light);color:var(--sd-success)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning{background-color:var(--sd-warning-light);color:var(--sd-warning)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error{background-color:var(--sd-error-light);color:var(--sd-error)}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary{background-color:var(--sd-secondary-light);color:#000!important}:host ::ng-deep button.c-button.c-light.mat-mdc-unelevated-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button{border-color:#d3d3d3}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep button.c-button.c-outline.mat-mdc-outlined-button.mat-button-disabled{background:transparent!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary{color:var(--sd-primary)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-primary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-primary)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info{color:var(--sd-info)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-info .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-info)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success{color:var(--sd-success)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-success .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-success)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning{color:var(--sd-warning)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-warning .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-warning)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error{color:var(--sd-error)}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-error .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:var(--sd-error)!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary{color:#000!important}:host ::ng-deep button.c-button.c-link.mat-mdc-button.mat-secondary .mat-mdc-progress-spinner .mdc-circular-progress__indeterminate-circle-graphic circle{stroke:#000!important}:host ::ng-deep .c-button-content-wrapper{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;pointer-events:none}:host ::ng-deep .c-title{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host ::ng-deep .c-spinner{display:inline-block}:host.sd-loading ::ng-deep button.c-button{pointer-events:none;opacity:.85}\n"] }]
111
111
  }], ctorParameters: () => [] });
112
112
 
113
113
  /**
package/fesm2022/sd-angular-core-components-button.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sd-angular-core-components-button.mjs","sources":["../../../projects/sd-angular/components/button/src/button.component.ts","../../../projects/sd-angular/components/button/src/button.component.html","../../../projects/sd-angular/components/button/sd-angular-core-components-button.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ElementRef,\r\n OnDestroy,\r\n OnInit,\r\n booleanAttribute,\r\n computed,\r\n inject,\r\n input,\r\n output,\r\n} from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdBaseSecureComponent } from '@sd-angular/core/components/base';\r\nimport { DefaultMaterialIconFontSet, MaterialIconFontSet, SdColor } from '@sd-angular/core/utilities/models';\r\nimport { Subject, Subscription } from 'rxjs';\r\nimport { filter, throttleTime } from 'rxjs/operators';\r\n\r\n// Export các Type ra ngoài để tái sử dụng ở file config/interface\r\nexport type SdButtonType = 'fill' | 'light' | 'outline' | 'link';\r\nexport type SdButtonSize = 'sm' | 'md' | 'lg';\r\nexport type SdButtonHtmlType = 'button' | 'submit' | 'reset';\r\n\r\n@Component({\r\n selector: 'sd-button',\r\n templateUrl: './button.component.html',\r\n styleUrls: ['./button.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatButtonModule, MatProgressSpinnerModule, MatTooltipModule],\r\n host: {\r\n '[class.sd-disabled]': 'disabled()',\r\n '[class.sd-loading]': 'loading()',\r\n '[class.sd-block]': 'block()',\r\n '[attr.disabled]': 'disabled() ? \"true\" : null',\r\n }\r\n})\r\nexport class SdButton extends SdBaseSecureComponent implements OnInit, OnDestroy {\r\n // ==========================================\r\n // 1. INJECTS\r\n // ==========================================\r\n private el = inject(ElementRef);\r\n\r\n // ==========================================\r\n // 2. SIGNAL INPUTS (Bảo mật 100% với Null/Undefined)\r\n // ==========================================\r\n autoIdInput = input<string | undefined | null>(undefined, { alias: 'autoId' });\r\n \r\n type = input<SdButtonType, SdButtonType | undefined | null>('light', {\r\n transform: (value) => value || 'light'\r\n });\r\n\r\n color = input<SdColor, SdColor | undefined | null>('secondary', {\r\n transform: (value) => value || 'secondary'\r\n });\r\n\r\n size = input<SdButtonSize, SdButtonSize | undefined | null>('sm', {\r\n transform: (value) => value || 'sm'\r\n });\r\n\r\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>(DefaultMaterialIconFontSet, {\r\n transform: (value) => value || DefaultMaterialIconFontSet\r\n });\r\n\r\n title = input<string | undefined | null>(undefined);\r\n width = input<string | undefined | null>(undefined);\r\n tooltip = input<string | undefined | null>(undefined);\r\n prefixIcon = input<string | undefined | null>(undefined);\r\n suffixIcon = input<string | undefined | null>(undefined);\r\n\r\n disabled = input(false, { transform: booleanAttribute });\r\n loading = input(false, { transform: booleanAttribute });\r\n block = input(false, { transform: booleanAttribute });\r\n\r\n htmlType = input<SdButtonHtmlType, SdButtonHtmlType | undefined | null>('button', {\r\n transform: (value) => value || 'button'\r\n });\r\n\r\n // ==========================================\r\n // 3. COMPUTED STATE\r\n // ==========================================\r\n autoId = computed(() => this.autoIdInput() ? `components-button-${this.autoIdInput()}` : undefined);\r\n \r\n buttonClasses = computed(() => ({\r\n 'c-square': (this.prefixIcon() || this.suffixIcon()) && !this.title(),\r\n 'c-sm': this.size() === 'sm',\r\n 'c-md': this.size() === 'md',\r\n 'c-lg': this.size() === 'lg',\r\n 'c-disabled': this.disabled(),\r\n 'c-block': this.block(),\r\n }));\r\n\r\n // ==========================================\r\n // 4. OUTPUT & RXJS STREAMS\r\n // ==========================================\r\n click = output<Event>();\r\n\r\n #clickSubject = new Subject<Event>();\r\n #subscription = new Subscription();\r\n\r\n constructor() {\r\n super();\r\n\r\n // Kỹ thuật Đánh chặn sự kiện (Capture Phase)\r\n // Tóm sống mọi sự kiện click ngay khi nó vừa chạm vào component\r\n this.el.nativeElement.addEventListener(\r\n 'click',\r\n (event: Event) => {\r\n if (this.disabled() || this.loading()) {\r\n // Nghiền nát sự kiện, không cho Angular phát (click) ra component cha\r\n event.preventDefault();\r\n event.stopPropagation();\r\n event.stopImmediatePropagation();\r\n }\r\n },\r\n { capture: true }\r\n );\r\n }\r\n\r\n ngOnInit() {\r\n this.#subscription.add(\r\n this.#clickSubject\r\n .pipe(\r\n throttleTime(300, undefined, { leading: true, trailing: false }),\r\n filter(() => !this.disabled() && !this.loading())\r\n )\r\n .subscribe(event => {\r\n this.click.emit(event);\r\n })\r\n );\r\n }\r\n\r\n // Nhận click từ thẻ button con bên trong\r\n onInternalClick(event: Event) {\r\n event.stopPropagation();\r\n \r\n if (this.disabled() || this.loading()) {\r\n return;\r\n }\r\n\r\n this.#clickSubject.next(event);\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n }\r\n}","@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"sd-angular-core-components-button.mjs","sources":["../../../projects/sd-angular/components/button/src/button.component.ts","../../../projects/sd-angular/components/button/src/button.component.html","../../../projects/sd-angular/components/button/sd-angular-core-components-button.ts"],"sourcesContent":["/* eslint-disable @angular-eslint/no-input-rename */\r\nimport { CommonModule } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ElementRef,\r\n OnDestroy,\r\n OnInit,\r\n booleanAttribute,\r\n computed,\r\n inject,\r\n input,\r\n output,\r\n} from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatProgressSpinnerModule } from '@angular/material/progress-spinner';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { SdBaseSecureComponent } from '@sd-angular/core/components/base';\r\nimport { DefaultMaterialIconFontSet, MaterialIconFontSet, SdColor } from '@sd-angular/core/utilities/models';\r\nimport { Subject, Subscription } from 'rxjs';\r\nimport { filter, throttleTime } from 'rxjs/operators';\r\n\r\n// Export các Type ra ngoài để tái sử dụng ở file config/interface\r\nexport type SdButtonType = 'fill' | 'light' | 'outline' | 'link';\r\nexport type SdButtonSize = 'sm' | 'md' | 'lg';\r\nexport type SdButtonHtmlType = 'button' | 'submit' | 'reset';\r\n\r\n@Component({\r\n selector: 'sd-button',\r\n templateUrl: './button.component.html',\r\n styleUrls: ['./button.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n imports: [CommonModule, MatIconModule, MatButtonModule, MatProgressSpinnerModule, MatTooltipModule],\r\n host: {\r\n '[class.sd-disabled]': 'disabled()',\r\n '[class.sd-loading]': 'loading()',\r\n '[class.sd-block]': 'block()',\r\n '[attr.disabled]': 'disabled() ? \"true\" : null',\r\n }\r\n})\r\nexport class SdButton extends SdBaseSecureComponent implements OnInit, OnDestroy {\r\n // ==========================================\r\n // 1. INJECTS\r\n // ==========================================\r\n private el = inject(ElementRef);\r\n\r\n // ==========================================\r\n // 2. SIGNAL INPUTS (Bảo mật 100% với Null/Undefined)\r\n // ==========================================\r\n autoIdInput = input<string | undefined | null>(undefined, { alias: 'autoId' });\r\n \r\n type = input<SdButtonType, SdButtonType | undefined | null>('light', {\r\n transform: (value) => value || 'light'\r\n });\r\n\r\n color = input<SdColor, SdColor | undefined | null>('secondary', {\r\n transform: (value) => value || 'secondary'\r\n });\r\n\r\n size = input<SdButtonSize, SdButtonSize | undefined | null>('sm', {\r\n transform: (value) => value || 'sm'\r\n });\r\n\r\n fontSet = input<MaterialIconFontSet, MaterialIconFontSet | undefined | null>(DefaultMaterialIconFontSet, {\r\n transform: (value) => value || DefaultMaterialIconFontSet\r\n });\r\n\r\n title = input<string | undefined | null>(undefined);\r\n width = input<string | undefined | null>(undefined);\r\n tooltip = input<string | undefined | null>(undefined);\r\n prefixIcon = input<string | undefined | null>(undefined);\r\n suffixIcon = input<string | undefined | null>(undefined);\r\n\r\n disabled = input(false, { transform: booleanAttribute });\r\n loading = input(false, { transform: booleanAttribute });\r\n block = input(false, { transform: booleanAttribute });\r\n\r\n htmlType = input<SdButtonHtmlType, SdButtonHtmlType | undefined | null>('button', {\r\n transform: (value) => value || 'button'\r\n });\r\n\r\n // ==========================================\r\n // 3. COMPUTED STATE\r\n // ==========================================\r\n autoId = computed(() => this.autoIdInput() ? `components-button-${this.autoIdInput()}` : undefined);\r\n \r\n buttonClasses = computed(() => ({\r\n 'c-square': (this.prefixIcon() || this.suffixIcon()) && !this.title(),\r\n 'c-sm': this.size() === 'sm',\r\n 'c-md': this.size() === 'md',\r\n 'c-lg': this.size() === 'lg',\r\n 'c-disabled': this.disabled(),\r\n 'c-block': this.block(),\r\n }));\r\n\r\n // ==========================================\r\n // 4. OUTPUT & RXJS STREAMS\r\n // ==========================================\r\n click = output<Event>();\r\n\r\n #clickSubject = new Subject<Event>();\r\n #subscription = new Subscription();\r\n\r\n constructor() {\r\n super();\r\n\r\n // Kỹ thuật Đánh chặn sự kiện (Capture Phase)\r\n // Tóm sống mọi sự kiện click ngay khi nó vừa chạm vào component\r\n this.el.nativeElement.addEventListener(\r\n 'click',\r\n (event: Event) => {\r\n if (this.disabled() || this.loading()) {\r\n // Nghiền nát sự kiện, không cho Angular phát (click) ra component cha\r\n event.preventDefault();\r\n event.stopPropagation();\r\n event.stopImmediatePropagation();\r\n }\r\n },\r\n { capture: true }\r\n );\r\n }\r\n\r\n ngOnInit() {\r\n this.#subscription.add(\r\n this.#clickSubject\r\n .pipe(\r\n throttleTime(300, undefined, { leading: true, trailing: false }),\r\n filter(() => !this.disabled() && !this.loading())\r\n )\r\n .subscribe(event => {\r\n this.click.emit(event);\r\n })\r\n );\r\n }\r\n\r\n // Nhận click từ thẻ button con bên trong\r\n onInternalClick(event: Event) {\r\n event.stopPropagation();\r\n \r\n if (this.disabled() || this.loading()) {\r\n return;\r\n }\r\n\r\n this.#clickSubject.next(event);\r\n }\r\n\r\n ngOnDestroy() {\r\n this.#subscription.unsubscribe();\r\n }\r\n}","@let btnType = type();\r\n@let btnLoad = loading();\r\n@let btnTitle = title();\r\n@let pIcon = prefixIcon();\r\n@let sIcon = suffixIcon();\r\n@let fSet = fontSet();\r\n@let hType = htmlType();\r\n\r\n@if (btnType === 'fill') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-fill\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'light') {\r\n <button\r\n mat-flat-button\r\n class=\"c-button c-light\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'outline') {\r\n <button\r\n mat-stroked-button\r\n class=\"c-button c-outline\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n} @else if (btnType === 'link') {\r\n <button\r\n mat-button\r\n class=\"c-button c-link\"\r\n [type]=\"hType\"\r\n [ngClass]=\"buttonClasses()\"\r\n [disabled]=\"disabled()\"\r\n [color]=\"color()\"\r\n [attr.data-autoId]=\"autoId()\"\r\n [attr.data-disabled]=\"disabled() ? 'true' : 'false'\"\r\n [attr.data-loading]=\"loading() ? 'true' : 'false'\"\r\n [style.width]=\"width()\"\r\n [matTooltip]=\"tooltip() || ''\"\r\n matTooltipPosition=\"above\"\r\n (click)=\"onInternalClick($event)\">\r\n <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n </button>\r\n}\r\n\r\n<ng-template #contentTpl>\r\n <div class=\"c-button-content-wrapper\">\r\n @if (btnLoad) {\r\n <mat-spinner mode=\"indeterminate\" diameter=\"18\" strokeWidth=\"2\" class=\"c-spinner\"></mat-spinner>\r\n } @else if (pIcon) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-prefix\">{{ pIcon }}</mat-icon>\r\n }\r\n\r\n @if (btnTitle) {\r\n <span class=\"c-title\" [class.ml-8]=\"btnLoad || pIcon\" [class.mr-8]=\"sIcon && !btnLoad\">\r\n {{ btnTitle }}\r\n </span>\r\n }\r\n\r\n @if (sIcon && !btnLoad) {\r\n <mat-icon [fontSet]=\"fSet\" class=\"c-icon-suffix\">{{ sIcon }}</mat-icon>\r\n }\r\n\r\n @if (!btnTitle && !pIcon && !btnLoad && sIcon) {\r\n <mat-icon [fontSet]=\"fSet\">{{ sIcon }}</mat-icon>\r\n }\r\n </div>\r\n</ng-template>\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}