suis 0.22.0 → 0.23.0
Sign up to get free protection for your applications and to get access to all the features.
- package/README.md +1 -0
- package/esm2022/lib/components/index.mjs +2 -1
- package/esm2022/lib/components/suis-button/suis-button.component.mjs +3 -3
- package/esm2022/lib/components/suis-button-link/index.mjs +2 -0
- package/esm2022/lib/components/suis-button-link/suis-button-link.component.mjs +39 -0
- package/esm2022/lib/components/suis-button-outlined/suis-button-outlined.component.mjs +3 -3
- package/esm2022/lib/components/suis-table/suis-table.component.mjs +9 -3
- package/esm2022/lib/shared/classes/suis-button.base.mjs +19 -7
- package/fesm2022/suis.mjs +60 -13
- package/fesm2022/suis.mjs.map +1 -1
- package/lib/components/index.d.ts +1 -0
- package/lib/components/suis-button-link/index.d.ts +1 -0
- package/lib/components/suis-button-link/suis-button-link.component.d.ts +28 -0
- package/lib/components/suis-table/suis-table.component.d.ts +5 -1
- package/lib/shared/classes/suis-button.base.d.ts +11 -6
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -39,6 +39,7 @@ Modern UI component library. Supports Angular in version 16 and uses its latest
|
|
|
39
39
|
| Pagination | SuisPagination | suis-pagination | 0.21.0 |
|
|
40
40
|
| Button | SuisButton | suis-button | 0.22.0 |
|
|
41
41
|
| ButtonOutlined | SuisButtonOutlined | suis-button-outlined | 0.22.0 |
|
|
42
|
+
| ButtonLink | SuisButtonLink | suis-button-link | 0.23.0 |
|
|
42
43
|
|
|
43
44
|
## Pipes
|
|
44
45
|
|
|
@@ -2,6 +2,7 @@ export * from './suis-alert';
|
|
|
2
2
|
export * from './suis-box';
|
|
3
3
|
export * from './suis-breadcrumbs';
|
|
4
4
|
export * from './suis-button';
|
|
5
|
+
export * from './suis-button-link';
|
|
5
6
|
export * from './suis-button-outlined';
|
|
6
7
|
export * from './suis-chip';
|
|
7
8
|
export * from './suis-container';
|
|
@@ -26,4 +27,4 @@ export * from './suis-spinner';
|
|
|
26
27
|
export * from './suis-spinner-container';
|
|
27
28
|
export * from './suis-table';
|
|
28
29
|
export * from './suis-title';
|
|
29
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
30
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsY0FBYyxDQUFDO0FBQzdCLGNBQWMsWUFBWSxDQUFDO0FBQzNCLGNBQWMsb0JBQW9CLENBQUM7QUFDbkMsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxvQkFBb0IsQ0FBQztBQUNuQyxjQUFjLHdCQUF3QixDQUFDO0FBQ3ZDLGNBQWMsYUFBYSxDQUFDO0FBQzVCLGNBQWMsa0JBQWtCLENBQUM7QUFDakMsY0FBYyxtQkFBbUIsQ0FBQztBQUNsQyxjQUFjLGFBQWEsQ0FBQztBQUM1QixjQUFjLG9CQUFvQixDQUFDO0FBQ25DLGNBQWMscUJBQXFCLENBQUM7QUFDcEMsY0FBYyxtQkFBbUIsQ0FBQztBQUNsQyxjQUFjLGNBQWMsQ0FBQztBQUM3QixjQUFjLG1CQUFtQixDQUFDO0FBQ2xDLGNBQWMseUJBQXlCLENBQUM7QUFDeEMsY0FBYyw4QkFBOEIsQ0FBQztBQUM3QyxjQUFjLHdCQUF3QixDQUFDO0FBQ3ZDLGNBQWMscUJBQXFCLENBQUM7QUFDcEMsY0FBYyxzQkFBc0IsQ0FBQztBQUNyQyxjQUFjLG1CQUFtQixDQUFDO0FBQ2xDLGNBQWMscUJBQXFCLENBQUM7QUFDcEMsY0FBYyxlQUFlLENBQUM7QUFDOUIsY0FBYyxzQkFBc0IsQ0FBQztBQUNyQyxjQUFjLHFCQUFxQixDQUFDO0FBQ3BDLGNBQWMsZ0JBQWdCLENBQUM7QUFDL0IsY0FBYywwQkFBMEIsQ0FBQztBQUN6QyxjQUFjLGNBQWMsQ0FBQztBQUM3QixjQUFjLGNBQWMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc3Vpcy1hbGVydCc7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtYm94JztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1icmVhZGNydW1icyc7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtYnV0dG9uJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1idXR0b24tbGluayc7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtYnV0dG9uLW91dGxpbmVkJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1jaGlwJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1jb250YWluZXInO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLWZvcm0tZmllbGQnO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLWljb24nO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLWlucHV0LWNoaXBzJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1pbnB1dC1udW1iZXInO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLWlucHV0LXRleHQnO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLWxhYmVsJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1uYXZpZ2F0aW9uJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1uYXZpZ2F0aW9uLWdyb3VwJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1uYXZpZ2F0aW9uLWdyb3VwLWl0ZW0nO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLW5hdmlnYXRpb24taXRlbSc7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtbm90aWZpY2F0aW9uJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1ub3RpZmljYXRpb25zJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1wYWdpbmF0aW9uJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1wcm9ncmVzcy1iYXInO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLXNlbGVjdCc7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtc2VsZWN0LW9wdGlvbic7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtc2VsZWN0LW11bHRpJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1zcGlubmVyJztcbmV4cG9ydCAqIGZyb20gJy4vc3Vpcy1zcGlubmVyLWNvbnRhaW5lcic7XG5leHBvcnQgKiBmcm9tICcuL3N1aXMtdGFibGUnO1xuZXhwb3J0ICogZnJvbSAnLi9zdWlzLXRpdGxlJztcbiJdfQ==
|
|
@@ -7,11 +7,11 @@ import * as i0 from "@angular/core";
|
|
|
7
7
|
import * as i1 from "@angular/common";
|
|
8
8
|
class SuisButtonComponent extends SuisButtonBase {
|
|
9
9
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonComponent, isStandalone: true, selector: "suis-button", usesInheritance: true, ngImport: i0, template: "<button\n class=\"suis-button\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button--full-width{width:100%}.suis-button:disabled{opacity:.5}.suis-button:hover:not(:disabled){cursor:pointer}.suis-button:hover:disabled{cursor:not-allowed}.suis-button:focus,.suis-button:focus-within{outline:none}.suis-button--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "component", type: SuisSpinnerComponent, selector: "suis-spinner", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonComponent, isStandalone: true, selector: "suis-button", usesInheritance: true, ngImport: i0, template: "<button\n class=\"suis-button\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n [attr.type]=\"type\"\n (click)=\"onClick()\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button--full-width{width:100%}.suis-button:disabled{opacity:.5}.suis-button:hover:not(:disabled){cursor:pointer}.suis-button:hover:disabled{cursor:not-allowed}.suis-button:focus,.suis-button:focus-within{outline:none}.suis-button--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "component", type: SuisSpinnerComponent, selector: "suis-spinner", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
11
11
|
}
|
|
12
12
|
export { SuisButtonComponent };
|
|
13
13
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonComponent, decorators: [{
|
|
14
14
|
type: Component,
|
|
15
|
-
args: [{ selector: 'suis-button', standalone: true, imports: [CommonModule, SuisNgClassPipe, SuisSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"suis-button\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button--full-width{width:100%}.suis-button:disabled{opacity:.5}.suis-button:hover:not(:disabled){cursor:pointer}.suis-button:hover:disabled{cursor:not-allowed}.suis-button:focus,.suis-button:focus-within{outline:none}.suis-button--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
|
15
|
+
args: [{ selector: 'suis-button', standalone: true, imports: [CommonModule, SuisNgClassPipe, SuisSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"suis-button\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n [attr.type]=\"type\"\n (click)=\"onClick()\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button--full-width{width:100%}.suis-button:disabled{opacity:.5}.suis-button:hover:not(:disabled){cursor:pointer}.suis-button:hover:disabled{cursor:not-allowed}.suis-button:focus,.suis-button:focus-within{outline:none}.suis-button--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
|
16
16
|
}] });
|
|
17
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
17
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1idXR0b24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLWJ1dHRvbi9zdWlzLWJ1dHRvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtYnV0dG9uL3N1aXMtYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFDOUMsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDdkQsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHVDQUF1QyxDQUFDOzs7QUFFdkUsTUFRYSxtQkFBb0IsU0FBUSxjQUFjOzhHQUExQyxtQkFBbUI7a0dBQW5CLG1CQUFtQiw4RkNkaEMsMmdCQWdCQSxtdEVEUFksWUFBWSw0TkFBRSxlQUFlLG9EQUFFLG9CQUFvQjs7U0FLbEQsbUJBQW1COzJGQUFuQixtQkFBbUI7a0JBUi9CLFNBQVM7K0JBQ0UsYUFBYSxjQUNYLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxlQUFlLEVBQUUsb0JBQW9CLENBQUMsbUJBRzdDLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgU3Vpc05nQ2xhc3NQaXBlIH0gZnJvbSAnLi4vLi4vcGlwZXMnO1xuaW1wb3J0IHsgU3Vpc1NwaW5uZXJDb21wb25lbnQgfSBmcm9tICcuLi9zdWlzLXNwaW5uZXInO1xuaW1wb3J0IHsgU3Vpc0J1dHRvbkJhc2UgfSBmcm9tICcuLi8uLi9zaGFyZWQvY2xhc3Nlcy9zdWlzLWJ1dHRvbi5iYXNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3Vpcy1idXR0b24nLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBTdWlzTmdDbGFzc1BpcGUsIFN1aXNTcGlubmVyQ29tcG9uZW50XSxcbiAgdGVtcGxhdGVVcmw6ICcuL3N1aXMtYnV0dG9uLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc3Vpcy1idXR0b24uY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIFN1aXNCdXR0b25Db21wb25lbnQgZXh0ZW5kcyBTdWlzQnV0dG9uQmFzZSB7fVxuIiwiPGJ1dHRvblxuICBjbGFzcz1cInN1aXMtYnV0dG9uXCJcbiAgW2NsYXNzLnN1aXMtYnV0dG9uLS1mdWxsLXdpZHRoXT1cImZ1bGxXaWR0aFwiXG4gIFtuZ0NsYXNzXT1cIidzdWlzLWJ1dHRvbicgfCBzdWlzTmdDbGFzcyA6IGNvbG9yXCJcbiAgW2F0dHIuZGlzYWJsZWRdPVwiZGlzYWJsZWQgfHwgbG9hZGluZyA/IHRydWUgOiB1bmRlZmluZWRcIlxuICBbYXR0ci50YWJpbmRleF09XCJkaXNhYmxlZCB8fCBsb2FkaW5nID8gLTEgOiAwXCJcbiAgW2F0dHIudHlwZV09XCJ0eXBlXCJcbiAgKGNsaWNrKT1cIm9uQ2xpY2soKVwiXG4+XG4gIDxuZy1jb250YWluZXIgKm5nSWY9XCIhbG9hZGluZzsgZWxzZSBzcGlubmVyXCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPG5nLXRlbXBsYXRlICNzcGlubmVyPlxuICAgIDxzdWlzLXNwaW5uZXIgc2l6ZT1cInhzXCIgY29sb3I9XCJ3aGl0ZVwiPjwvc3Vpcy1zcGlubmVyPlxuICA8L25nLXRlbXBsYXRlPlxuPC9idXR0b24+XG4iXX0=
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export * from './suis-button-link.component';
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtYnV0dG9uLWxpbmsvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsY0FBYyw4QkFBOEIsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc3Vpcy1idXR0b24tbGluay5jb21wb25lbnQnO1xuIl19
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
3
|
+
import { SuisButtonBase } from '../../shared/classes/suis-button.base';
|
|
4
|
+
import { SuisNgClassPipe } from '../../pipes/suis-ng-class.pipe';
|
|
5
|
+
import { SuisSpinnerComponent } from '../suis-spinner/suis-spinner.component';
|
|
6
|
+
import { ActivatedRoute, RouterModule, } from '@angular/router';
|
|
7
|
+
import * as i0 from "@angular/core";
|
|
8
|
+
import * as i1 from "@angular/common";
|
|
9
|
+
import * as i2 from "@angular/router";
|
|
10
|
+
class SuisButtonLinkComponent extends SuisButtonBase {
|
|
11
|
+
onClick(event) {
|
|
12
|
+
if (this.disabled) {
|
|
13
|
+
event.preventDefault();
|
|
14
|
+
event.stopImmediatePropagation();
|
|
15
|
+
}
|
|
16
|
+
else {
|
|
17
|
+
this.clicked.emit();
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonLinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
21
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonLinkComponent, isStandalone: true, selector: "suis-button-link", inputs: { routerLink: "routerLink", target: "target", queryParams: "queryParams", queryParamsHandling: "queryParamsHandling", relativeTo: "relativeTo" }, usesInheritance: true, ngImport: i0, template: "<a\n class=\"suis-button-link\"\n [class.suis-button--full-width]=\"fullWidth\"\n [routerLink]=\"routerLink\"\n [target]=\"target\"\n [queryParams]=\"queryParams\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [relativeTo]=\"relativeTo\"\n [ngClass]=\"'suis-button-link' | suisNgClass : color\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n (click)=\"onClick($event)\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</a>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-link{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button-link--full-width{width:100%}.suis-button-link:disabled{opacity:.5}.suis-button-link:hover:not(:disabled){cursor:pointer}.suis-button-link:hover:disabled{cursor:not-allowed}.suis-button-link:focus,.suis-button-link:focus-within{outline:none}.suis-button-link--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button-link--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button-link--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-link--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button-link--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button-link--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-link--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button-link--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button-link--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-link--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button-link--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button-link--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-link--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button-link--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button-link--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-link--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button-link--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button-link--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-link--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button-link--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button-link--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "component", type: SuisSpinnerComponent, selector: "suis-spinner", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
22
|
+
}
|
|
23
|
+
export { SuisButtonLinkComponent };
|
|
24
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonLinkComponent, decorators: [{
|
|
25
|
+
type: Component,
|
|
26
|
+
args: [{ selector: 'suis-button-link', standalone: true, imports: [CommonModule, RouterModule, SuisNgClassPipe, SuisSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<a\n class=\"suis-button-link\"\n [class.suis-button--full-width]=\"fullWidth\"\n [routerLink]=\"routerLink\"\n [target]=\"target\"\n [queryParams]=\"queryParams\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [relativeTo]=\"relativeTo\"\n [ngClass]=\"'suis-button-link' | suisNgClass : color\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n (click)=\"onClick($event)\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" color=\"white\"></suis-spinner>\n </ng-template>\n</a>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-link{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid}.suis-button-link--full-width{width:100%}.suis-button-link:disabled{opacity:.5}.suis-button-link:hover:not(:disabled){cursor:pointer}.suis-button-link:hover:disabled{cursor:not-allowed}.suis-button-link:focus,.suis-button-link:focus-within{outline:none}.suis-button-link--primary{background-color:#192a56;border-color:#192a56;color:#fff}.suis-button-link--primary:hover:not(:disabled){background-color:#192a56d9}.suis-button-link--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-link--secondary{background-color:#273c75;border-color:#273c75;color:#fff}.suis-button-link--secondary:hover:not(:disabled){background-color:#273c75d9}.suis-button-link--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-link--tertiary{background-color:#dcdde1;border-color:#dcdde1;color:#2f3640}.suis-button-link--tertiary:hover:not(:disabled){background-color:#dcdde1d9}.suis-button-link--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-link--complementary{background-color:#f5f6fa;border-color:#f5f6fa;color:#2f3640}.suis-button-link--complementary:hover:not(:disabled){background-color:#f5f6fad9}.suis-button-link--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-link--success{background-color:#2ed573;border-color:#2ed573;color:#fff}.suis-button-link--success:hover:not(:disabled){background-color:#2ed573d9}.suis-button-link--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-link--warning{background-color:#ffa502;border-color:#ffa502;color:#fff}.suis-button-link--warning:hover:not(:disabled){background-color:#ffa502d9}.suis-button-link--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-link--danger{background-color:#ff4757;border-color:#ff4757;color:#fff}.suis-button-link--danger:hover:not(:disabled){background-color:#ff4757d9}.suis-button-link--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
|
27
|
+
}], propDecorators: { routerLink: [{
|
|
28
|
+
type: Input,
|
|
29
|
+
args: [{ required: true }]
|
|
30
|
+
}], target: [{
|
|
31
|
+
type: Input
|
|
32
|
+
}], queryParams: [{
|
|
33
|
+
type: Input
|
|
34
|
+
}], queryParamsHandling: [{
|
|
35
|
+
type: Input
|
|
36
|
+
}], relativeTo: [{
|
|
37
|
+
type: Input
|
|
38
|
+
}] } });
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1idXR0b24tbGluay5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtYnV0dG9uLWxpbmsvc3Vpcy1idXR0b24tbGluay5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtYnV0dG9uLWxpbmsvc3Vpcy1idXR0b24tbGluay5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMxRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHVDQUF1QyxDQUFDO0FBQ3ZFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQztBQUNqRSxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUM5RSxPQUFPLEVBQ0wsY0FBYyxFQUdkLFlBQVksR0FDYixNQUFNLGlCQUFpQixDQUFDOzs7O0FBRXpCLE1BUWEsdUJBQXdCLFNBQVEsY0FBYztJQTJCaEQsT0FBTyxDQUFDLEtBQVk7UUFDM0IsSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2pCLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUN2QixLQUFLLENBQUMsd0JBQXdCLEVBQUUsQ0FBQztTQUNsQzthQUFNO1lBQ0wsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLEVBQUUsQ0FBQztTQUNyQjtJQUNILENBQUM7OEdBbENVLHVCQUF1QjtrR0FBdkIsdUJBQXVCLDZQQ3BCcEMsa21CQW1CQSwrMUVESlksWUFBWSxnT0FBRSxZQUFZLG1RQUFFLGVBQWUsb0RBQUUsb0JBQW9COztTQUtoRSx1QkFBdUI7MkZBQXZCLHVCQUF1QjtrQkFSbkMsU0FBUzsrQkFDRSxrQkFBa0IsY0FDaEIsSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLFlBQVksRUFBRSxlQUFlLEVBQUUsb0JBQW9CLENBQUMsbUJBRzNELHVCQUF1QixDQUFDLE1BQU07OEJBT3BCLFVBQVU7c0JBQXBDLEtBQUs7dUJBQUMsRUFBRSxRQUFRLEVBQUUsSUFBSSxFQUFFO2dCQUtoQixNQUFNO3NCQUFkLEtBQUs7Z0JBS0csV0FBVztzQkFBbkIsS0FBSztnQkFLRyxtQkFBbUI7c0JBQTNCLEtBQUs7Z0JBS0csVUFBVTtzQkFBbEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgU3Vpc0J1dHRvbkJhc2UgfSBmcm9tICcuLi8uLi9zaGFyZWQvY2xhc3Nlcy9zdWlzLWJ1dHRvbi5iYXNlJztcbmltcG9ydCB7IFN1aXNOZ0NsYXNzUGlwZSB9IGZyb20gJy4uLy4uL3BpcGVzL3N1aXMtbmctY2xhc3MucGlwZSc7XG5pbXBvcnQgeyBTdWlzU3Bpbm5lckNvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtc3Bpbm5lci9zdWlzLXNwaW5uZXIuY29tcG9uZW50JztcbmltcG9ydCB7XG4gIEFjdGl2YXRlZFJvdXRlLFxuICBQYXJhbXMsXG4gIFF1ZXJ5UGFyYW1zSGFuZGxpbmcsXG4gIFJvdXRlck1vZHVsZSxcbn0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3Vpcy1idXR0b24tbGluaycsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIFJvdXRlck1vZHVsZSwgU3Vpc05nQ2xhc3NQaXBlLCBTdWlzU3Bpbm5lckNvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9zdWlzLWJ1dHRvbi1saW5rLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc3Vpcy1idXR0b24tbGluay5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc0J1dHRvbkxpbmtDb21wb25lbnQgZXh0ZW5kcyBTdWlzQnV0dG9uQmFzZSB7XG4gIC8qKlxuICAgKiBTZXRzIHJvdXRlckxpbmsgb2YgdGhlIGFuY2hvciB0YWcuIE5vIGRlZmF1bHQgdmFsdWUuXG4gICAqL1xuICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLWV4cGxpY2l0LWFueVxuICBASW5wdXQoeyByZXF1aXJlZDogdHJ1ZSB9KSByb3V0ZXJMaW5rPzogc3RyaW5nIHwgYW55W107XG5cbiAgLyoqXG4gICAqIFNldHMgdGFyZ2V0IG9mIHRoZSBhbmNob3IgdGFnLiBObyBkZWZhdWx0IHZhbHVlLlxuICAgKi9cbiAgQElucHV0KCkgdGFyZ2V0Pzogc3RyaW5nO1xuXG4gIC8qKlxuICAgKiBTZXRzIHF1ZXJ5UGFyYW1zIG9mIHRoZSBhbmNob3IgdGFnLiBObyBkZWZhdWx0IHZhbHVlLlxuICAgKi9cbiAgQElucHV0KCkgcXVlcnlQYXJhbXM/OiBQYXJhbXM7XG5cbiAgLyoqXG4gICAqIFNldHMgcXVlcnlQYXJhbXNIYW5kbGluZyBvZiB0aGUgYW5jaG9yIHRhZy4gTm8gZGVmYXVsdCB2YWx1ZS5cbiAgICovXG4gIEBJbnB1dCgpIHF1ZXJ5UGFyYW1zSGFuZGxpbmc/OiBRdWVyeVBhcmFtc0hhbmRsaW5nO1xuXG4gIC8qKlxuICAgKiBTZXRzIHJlbGF0aXZlVG8gb2YgdGhlIGFuY2hvciB0YWcuIE5vIGRlZmF1bHQgdmFsdWUuXG4gICAqL1xuICBASW5wdXQoKSByZWxhdGl2ZVRvPzogQWN0aXZhdGVkUm91dGU7XG5cbiAgb3ZlcnJpZGUgb25DbGljayhldmVudDogRXZlbnQpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5kaXNhYmxlZCkge1xuICAgICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcbiAgICAgIGV2ZW50LnN0b3BJbW1lZGlhdGVQcm9wYWdhdGlvbigpO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLmNsaWNrZWQuZW1pdCgpO1xuICAgIH1cbiAgfVxufVxuIiwiPGFcbiAgY2xhc3M9XCJzdWlzLWJ1dHRvbi1saW5rXCJcbiAgW2NsYXNzLnN1aXMtYnV0dG9uLS1mdWxsLXdpZHRoXT1cImZ1bGxXaWR0aFwiXG4gIFtyb3V0ZXJMaW5rXT1cInJvdXRlckxpbmtcIlxuICBbdGFyZ2V0XT1cInRhcmdldFwiXG4gIFtxdWVyeVBhcmFtc109XCJxdWVyeVBhcmFtc1wiXG4gIFtxdWVyeVBhcmFtc0hhbmRsaW5nXT1cInF1ZXJ5UGFyYW1zSGFuZGxpbmdcIlxuICBbcmVsYXRpdmVUb109XCJyZWxhdGl2ZVRvXCJcbiAgW25nQ2xhc3NdPVwiJ3N1aXMtYnV0dG9uLWxpbmsnIHwgc3Vpc05nQ2xhc3MgOiBjb2xvclwiXG4gIFthdHRyLnRhYmluZGV4XT1cImRpc2FibGVkIHx8IGxvYWRpbmcgPyAtMSA6IDBcIlxuICAoY2xpY2spPVwib25DbGljaygkZXZlbnQpXCJcbj5cbiAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiFsb2FkaW5nOyBlbHNlIHNwaW5uZXJcIj5cbiAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvbmctY29udGFpbmVyPlxuICA8bmctdGVtcGxhdGUgI3NwaW5uZXI+XG4gICAgPHN1aXMtc3Bpbm5lciBzaXplPVwieHNcIiBjb2xvcj1cIndoaXRlXCI+PC9zdWlzLXNwaW5uZXI+XG4gIDwvbmctdGVtcGxhdGU+XG48L2E+XG4iXX0=
|
|
@@ -7,11 +7,11 @@ import * as i0 from "@angular/core";
|
|
|
7
7
|
import * as i1 from "@angular/common";
|
|
8
8
|
class SuisButtonOutlinedComponent extends SuisButtonBase {
|
|
9
9
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonOutlinedComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonOutlinedComponent, isStandalone: true, selector: "suis-button-outlined", usesInheritance: true, ngImport: i0, template: "<button\n class=\"suis-button-outlined\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button-outlined' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" [color]=\"color\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-outlined{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid;background-color:transparent}.suis-button-outlined--full-width{width:100%}.suis-button-outlined:disabled{opacity:.5}.suis-button-outlined:hover:not(:disabled){cursor:pointer}.suis-button-outlined:hover:disabled{cursor:not-allowed}.suis-button-outlined:focus,.suis-button-outlined:focus-within{outline:none}.suis-button-outlined--primary{border-color:#192a56;color:#192a56}.suis-button-outlined--primary:hover:not(:disabled){background-color:#192a56;color:#fff}.suis-button-outlined--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-outlined--secondary{border-color:#273c75;color:#273c75}.suis-button-outlined--secondary:hover:not(:disabled){background-color:#273c75;color:#fff}.suis-button-outlined--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-outlined--tertiary{border-color:#dcdde1;color:#dcdde1}.suis-button-outlined--tertiary:hover:not(:disabled){background-color:#dcdde1;color:#2f3640}.suis-button-outlined--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-outlined--complementary{border-color:#f5f6fa;color:#f5f6fa}.suis-button-outlined--complementary:hover:not(:disabled){background-color:#f5f6fa;color:#2f3640}.suis-button-outlined--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-outlined--success{border-color:#2ed573;color:#2ed573}.suis-button-outlined--success:hover:not(:disabled){background-color:#2ed573;color:#fff}.suis-button-outlined--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-outlined--warning{border-color:#ffa502;color:#ffa502}.suis-button-outlined--warning:hover:not(:disabled){background-color:#ffa502;color:#fff}.suis-button-outlined--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-outlined--danger{border-color:#ff4757;color:#ff4757}.suis-button-outlined--danger:hover:not(:disabled){background-color:#ff4757;color:#fff}.suis-button-outlined--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "component", type: SuisSpinnerComponent, selector: "suis-spinner", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonOutlinedComponent, isStandalone: true, selector: "suis-button-outlined", usesInheritance: true, ngImport: i0, template: "<button\n class=\"suis-button-outlined\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button-outlined' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n [attr.type]=\"type\"\n (click)=\"onClick()\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" [color]=\"color\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-outlined{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid;background-color:transparent}.suis-button-outlined--full-width{width:100%}.suis-button-outlined:disabled{opacity:.5}.suis-button-outlined:hover:not(:disabled){cursor:pointer}.suis-button-outlined:hover:disabled{cursor:not-allowed}.suis-button-outlined:focus,.suis-button-outlined:focus-within{outline:none}.suis-button-outlined--primary{border-color:#192a56;color:#192a56}.suis-button-outlined--primary:hover:not(:disabled){background-color:#192a56;color:#fff}.suis-button-outlined--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-outlined--secondary{border-color:#273c75;color:#273c75}.suis-button-outlined--secondary:hover:not(:disabled){background-color:#273c75;color:#fff}.suis-button-outlined--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-outlined--tertiary{border-color:#dcdde1;color:#dcdde1}.suis-button-outlined--tertiary:hover:not(:disabled){background-color:#dcdde1;color:#2f3640}.suis-button-outlined--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-outlined--complementary{border-color:#f5f6fa;color:#f5f6fa}.suis-button-outlined--complementary:hover:not(:disabled){background-color:#f5f6fa;color:#2f3640}.suis-button-outlined--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-outlined--success{border-color:#2ed573;color:#2ed573}.suis-button-outlined--success:hover:not(:disabled){background-color:#2ed573;color:#fff}.suis-button-outlined--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-outlined--warning{border-color:#ffa502;color:#ffa502}.suis-button-outlined--warning:hover:not(:disabled){background-color:#ffa502;color:#fff}.suis-button-outlined--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-outlined--danger{border-color:#ff4757;color:#ff4757}.suis-button-outlined--danger:hover:not(:disabled){background-color:#ff4757;color:#fff}.suis-button-outlined--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: SuisNgClassPipe, name: "suisNgClass" }, { kind: "component", type: SuisSpinnerComponent, selector: "suis-spinner", inputs: ["size", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
11
11
|
}
|
|
12
12
|
export { SuisButtonOutlinedComponent };
|
|
13
13
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonOutlinedComponent, decorators: [{
|
|
14
14
|
type: Component,
|
|
15
|
-
args: [{ selector: 'suis-button-outlined', standalone: true, imports: [CommonModule, SuisNgClassPipe, SuisSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"suis-button-outlined\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button-outlined' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" [color]=\"color\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-outlined{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid;background-color:transparent}.suis-button-outlined--full-width{width:100%}.suis-button-outlined:disabled{opacity:.5}.suis-button-outlined:hover:not(:disabled){cursor:pointer}.suis-button-outlined:hover:disabled{cursor:not-allowed}.suis-button-outlined:focus,.suis-button-outlined:focus-within{outline:none}.suis-button-outlined--primary{border-color:#192a56;color:#192a56}.suis-button-outlined--primary:hover:not(:disabled){background-color:#192a56;color:#fff}.suis-button-outlined--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-outlined--secondary{border-color:#273c75;color:#273c75}.suis-button-outlined--secondary:hover:not(:disabled){background-color:#273c75;color:#fff}.suis-button-outlined--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-outlined--tertiary{border-color:#dcdde1;color:#dcdde1}.suis-button-outlined--tertiary:hover:not(:disabled){background-color:#dcdde1;color:#2f3640}.suis-button-outlined--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-outlined--complementary{border-color:#f5f6fa;color:#f5f6fa}.suis-button-outlined--complementary:hover:not(:disabled){background-color:#f5f6fa;color:#2f3640}.suis-button-outlined--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-outlined--success{border-color:#2ed573;color:#2ed573}.suis-button-outlined--success:hover:not(:disabled){background-color:#2ed573;color:#fff}.suis-button-outlined--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-outlined--warning{border-color:#ffa502;color:#ffa502}.suis-button-outlined--warning:hover:not(:disabled){background-color:#ffa502;color:#fff}.suis-button-outlined--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-outlined--danger{border-color:#ff4757;color:#ff4757}.suis-button-outlined--danger:hover:not(:disabled){background-color:#ff4757;color:#fff}.suis-button-outlined--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
|
15
|
+
args: [{ selector: 'suis-button-outlined', standalone: true, imports: [CommonModule, SuisNgClassPipe, SuisSpinnerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n class=\"suis-button-outlined\"\n [class.suis-button--full-width]=\"fullWidth\"\n [ngClass]=\"'suis-button-outlined' | suisNgClass : color\"\n [attr.disabled]=\"disabled || loading ? true : undefined\"\n [attr.tabindex]=\"disabled || loading ? -1 : 0\"\n [attr.type]=\"type\"\n (click)=\"onClick()\"\n>\n <ng-container *ngIf=\"!loading; else spinner\">\n <ng-content></ng-content>\n </ng-container>\n <ng-template #spinner>\n <suis-spinner size=\"xs\" [color]=\"color\"></suis-spinner>\n </ng-template>\n</button>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-button-outlined{width:-moz-fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;padding:.375rem 1rem;border-radius:.25rem;text-align:center;text-decoration:none;transition:background-color .25s ease-in-out;border-width:.125rem;border-style:solid;background-color:transparent}.suis-button-outlined--full-width{width:100%}.suis-button-outlined:disabled{opacity:.5}.suis-button-outlined:hover:not(:disabled){cursor:pointer}.suis-button-outlined:hover:disabled{cursor:not-allowed}.suis-button-outlined:focus,.suis-button-outlined:focus-within{outline:none}.suis-button-outlined--primary{border-color:#192a56;color:#192a56}.suis-button-outlined--primary:hover:not(:disabled){background-color:#192a56;color:#fff}.suis-button-outlined--primary:focus:not(:disabled){box-shadow:0 2px 5px #192a56bf}.suis-button-outlined--secondary{border-color:#273c75;color:#273c75}.suis-button-outlined--secondary:hover:not(:disabled){background-color:#273c75;color:#fff}.suis-button-outlined--secondary:focus:not(:disabled){box-shadow:0 2px 5px #273c75bf}.suis-button-outlined--tertiary{border-color:#dcdde1;color:#dcdde1}.suis-button-outlined--tertiary:hover:not(:disabled){background-color:#dcdde1;color:#2f3640}.suis-button-outlined--tertiary:focus:not(:disabled){box-shadow:0 2px 5px #dcdde1bf}.suis-button-outlined--complementary{border-color:#f5f6fa;color:#f5f6fa}.suis-button-outlined--complementary:hover:not(:disabled){background-color:#f5f6fa;color:#2f3640}.suis-button-outlined--complementary:focus:not(:disabled){box-shadow:0 2px 5px #f5f6fabf}.suis-button-outlined--success{border-color:#2ed573;color:#2ed573}.suis-button-outlined--success:hover:not(:disabled){background-color:#2ed573;color:#fff}.suis-button-outlined--success:focus:not(:disabled){box-shadow:0 2px 5px #2ed573bf}.suis-button-outlined--warning{border-color:#ffa502;color:#ffa502}.suis-button-outlined--warning:hover:not(:disabled){background-color:#ffa502;color:#fff}.suis-button-outlined--warning:focus:not(:disabled){box-shadow:0 2px 5px #ffa502bf}.suis-button-outlined--danger{border-color:#ff4757;color:#ff4757}.suis-button-outlined--danger:hover:not(:disabled){background-color:#ff4757;color:#fff}.suis-button-outlined--danger:focus:not(:disabled){box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
|
16
16
|
}] });
|
|
17
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
17
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1idXR0b24tb3V0bGluZWQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9zdWlzL3NyYy9saWIvY29tcG9uZW50cy9zdWlzLWJ1dHRvbi1vdXRsaW5lZC9zdWlzLWJ1dHRvbi1vdXRsaW5lZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtYnV0dG9uLW91dGxpbmVkL3N1aXMtYnV0dG9uLW91dGxpbmVkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxjQUFjLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQztBQUN2RSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDakUsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7OztBQUU5RSxNQVFhLDJCQUE0QixTQUFRLGNBQWM7OEdBQWxELDJCQUEyQjtrR0FBM0IsMkJBQTJCLHVHQ2R4QywraEJBZ0JBLGk1RURQWSxZQUFZLDROQUFFLGVBQWUsb0RBQUUsb0JBQW9COztTQUtsRCwyQkFBMkI7MkZBQTNCLDJCQUEyQjtrQkFSdkMsU0FBUzsrQkFDRSxzQkFBc0IsY0FDcEIsSUFBSSxXQUNQLENBQUMsWUFBWSxFQUFFLGVBQWUsRUFBRSxvQkFBb0IsQ0FBQyxtQkFHN0MsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBTdWlzQnV0dG9uQmFzZSB9IGZyb20gJy4uLy4uL3NoYXJlZC9jbGFzc2VzL3N1aXMtYnV0dG9uLmJhc2UnO1xuaW1wb3J0IHsgU3Vpc05nQ2xhc3NQaXBlIH0gZnJvbSAnLi4vLi4vcGlwZXMvc3Vpcy1uZy1jbGFzcy5waXBlJztcbmltcG9ydCB7IFN1aXNTcGlubmVyQ29tcG9uZW50IH0gZnJvbSAnLi4vc3Vpcy1zcGlubmVyL3N1aXMtc3Bpbm5lci5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzdWlzLWJ1dHRvbi1vdXRsaW5lZCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIFN1aXNOZ0NsYXNzUGlwZSwgU3Vpc1NwaW5uZXJDb21wb25lbnRdLFxuICB0ZW1wbGF0ZVVybDogJy4vc3Vpcy1idXR0b24tb3V0bGluZWQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9zdWlzLWJ1dHRvbi1vdXRsaW5lZC5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc0J1dHRvbk91dGxpbmVkQ29tcG9uZW50IGV4dGVuZHMgU3Vpc0J1dHRvbkJhc2Uge31cbiIsIjxidXR0b25cbiAgY2xhc3M9XCJzdWlzLWJ1dHRvbi1vdXRsaW5lZFwiXG4gIFtjbGFzcy5zdWlzLWJ1dHRvbi0tZnVsbC13aWR0aF09XCJmdWxsV2lkdGhcIlxuICBbbmdDbGFzc109XCInc3Vpcy1idXR0b24tb3V0bGluZWQnIHwgc3Vpc05nQ2xhc3MgOiBjb2xvclwiXG4gIFthdHRyLmRpc2FibGVkXT1cImRpc2FibGVkIHx8IGxvYWRpbmcgPyB0cnVlIDogdW5kZWZpbmVkXCJcbiAgW2F0dHIudGFiaW5kZXhdPVwiZGlzYWJsZWQgfHwgbG9hZGluZyA/IC0xIDogMFwiXG4gIFthdHRyLnR5cGVdPVwidHlwZVwiXG4gIChjbGljayk9XCJvbkNsaWNrKClcIlxuPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwiIWxvYWRpbmc7IGVsc2Ugc3Bpbm5lclwiPlxuICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgPC9uZy1jb250YWluZXI+XG4gIDxuZy10ZW1wbGF0ZSAjc3Bpbm5lcj5cbiAgICA8c3Vpcy1zcGlubmVyIHNpemU9XCJ4c1wiIFtjb2xvcl09XCJjb2xvclwiPjwvc3Vpcy1zcGlubmVyPlxuICA8L25nLXRlbXBsYXRlPlxuPC9idXR0b24+XG4iXX0=
|
|
@@ -25,6 +25,10 @@ class SuisTableComponent {
|
|
|
25
25
|
* Shows loading spinner and blurs data. By default set to false.
|
|
26
26
|
*/
|
|
27
27
|
this.loading = false;
|
|
28
|
+
/**
|
|
29
|
+
* Message shown in table when there is no data to display.
|
|
30
|
+
*/
|
|
31
|
+
this.emptyMessage = 'There is no data to be displayed in the table';
|
|
28
32
|
/**
|
|
29
33
|
* Emits value on sort condition change.
|
|
30
34
|
*/
|
|
@@ -45,12 +49,12 @@ class SuisTableComponent {
|
|
|
45
49
|
}
|
|
46
50
|
}
|
|
47
51
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisTableComponent, isStandalone: true, selector: "suis-table", inputs: { data: "data", orderBy: "orderBy", sortBy: "sortBy", loading: "loading" }, outputs: { sortByChange: "sortByChange", orderByChange: "orderByChange" }, queries: [{ propertyName: "columns", predicate: SuisTableColumnDirective }], ngImport: i0, template: "<table *ngIf=\"columns\" class=\"suis-table\">\n <thead>\n <tr>\n <th\n *ngFor=\"let column of columns\"\n [class.pointer]=\"column.orderProperty\"\n (click)=\"\n column.orderProperty ? onColumnClick(column.orderProperty) : undefined\n \"\n >\n <div class=\"suis-table__header\">\n <span>\n {{ column.name }}\n </span>\n <suis-icon\n *ngIf=\"column.orderProperty && column.orderProperty === orderBy\"\n [type]=\"\n sortBy === 'asc'\n ? SuisIconType.CHEVRON_DOWN\n : SuisIconType.CHEVRON_UP\n \"\n size=\"lg\"\n color=\"white\"\n ></suis-icon>\n </div>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of data\">\n <td *ngFor=\"let column of columns\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cell!.templateRef;\n context: { $implicit: item }\n \"\n ></ng-container>\n </td>\n </tr>\n <suis-spinner-container\n *ngIf=\"loading\"\n [absolute]=\"true\"\n [blur]=\"true\"\n ></suis-spinner-container>\n </tbody>\n</table>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:600;padding:.75rem 1rem}.suis-table thead tr th:first-child{border-top-left-radius:.25rem}.suis-table thead tr th:last-child{border-top-right-radius:.25rem}.suis-table thead tr th.pointer{cursor:pointer}.suis-table thead tr th>.suis-table__header{display:flex;align-items:center}.suis-table thead tr th>.suis-table__header suis-icon{display:block;margin-left:.125rem}.suis-table tbody{position:relative;background-color:#f5f6fa}.suis-table tbody tr{border-bottom:.0625rem solid #dcdde1}.suis-table tbody tr:hover{background-color:#dcdde1d9}.suis-table tbody tr td{padding:.375rem 1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }, { kind: "component", type: SuisSpinnerContainerComponent, selector: "suis-spinner-container", inputs: ["size", "color", "blur", "absolute"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
52
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisTableComponent, isStandalone: true, selector: "suis-table", inputs: { data: "data", orderBy: "orderBy", sortBy: "sortBy", loading: "loading", emptyMessage: "emptyMessage" }, outputs: { sortByChange: "sortByChange", orderByChange: "orderByChange" }, queries: [{ propertyName: "columns", predicate: SuisTableColumnDirective }], ngImport: i0, template: "<table *ngIf=\"columns\" class=\"suis-table\">\n <thead>\n <tr>\n <th\n *ngFor=\"let column of columns\"\n [class.pointer]=\"column.orderProperty\"\n (click)=\"\n column.orderProperty ? onColumnClick(column.orderProperty) : undefined\n \"\n >\n <div class=\"suis-table__header\">\n <span>\n {{ column.name }}\n </span>\n <suis-icon\n *ngIf=\"column.orderProperty && column.orderProperty === orderBy\"\n [type]=\"\n sortBy === 'asc'\n ? SuisIconType.CHEVRON_DOWN\n : SuisIconType.CHEVRON_UP\n \"\n size=\"lg\"\n color=\"white\"\n ></suis-icon>\n </div>\n </th>\n <th *ngIf=\"!columns?.length\"></th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of data\">\n <td *ngFor=\"let column of columns\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cell!.templateRef;\n context: { $implicit: item }\n \"\n ></ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!data?.length\">\n <td class=\"empty\" [attr.colspan]=\"columns ? columns.length : 1\">\n {{ loading ? '' : emptyMessage }}\n </td>\n </tr>\n <suis-spinner-container\n *ngIf=\"loading\"\n [absolute]=\"true\"\n [blur]=\"true\"\n [color]=\"'secondary'\"\n ></suis-spinner-container>\n </tbody>\n</table>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:600;padding:.75rem 1rem}.suis-table thead tr th:first-child{border-top-left-radius:.25rem}.suis-table thead tr th:last-child{border-top-right-radius:.25rem}.suis-table thead tr th.pointer{cursor:pointer}.suis-table thead tr th>.suis-table__header{display:flex;align-items:center}.suis-table thead tr th>.suis-table__header suis-icon{display:block;margin-left:.125rem}.suis-table tbody{position:relative;background-color:#f5f6fa}.suis-table tbody tr{border-bottom:.0625rem solid #dcdde1}.suis-table tbody tr:hover{background-color:#dcdde1d9}.suis-table tbody tr td{padding:.375rem 1rem}.suis-table tbody tr td.empty{text-align:center;padding:1.5rem 1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }, { kind: "component", type: SuisSpinnerContainerComponent, selector: "suis-spinner-container", inputs: ["size", "color", "blur", "absolute"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
49
53
|
}
|
|
50
54
|
export { SuisTableComponent };
|
|
51
55
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTableComponent, decorators: [{
|
|
52
56
|
type: Component,
|
|
53
|
-
args: [{ selector: 'suis-table', standalone: true, imports: [CommonModule, SuisIconComponent, SuisSpinnerContainerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<table *ngIf=\"columns\" class=\"suis-table\">\n <thead>\n <tr>\n <th\n *ngFor=\"let column of columns\"\n [class.pointer]=\"column.orderProperty\"\n (click)=\"\n column.orderProperty ? onColumnClick(column.orderProperty) : undefined\n \"\n >\n <div class=\"suis-table__header\">\n <span>\n {{ column.name }}\n </span>\n <suis-icon\n *ngIf=\"column.orderProperty && column.orderProperty === orderBy\"\n [type]=\"\n sortBy === 'asc'\n ? SuisIconType.CHEVRON_DOWN\n : SuisIconType.CHEVRON_UP\n \"\n size=\"lg\"\n color=\"white\"\n ></suis-icon>\n </div>\n </th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of data\">\n <td *ngFor=\"let column of columns\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cell!.templateRef;\n context: { $implicit: item }\n \"\n ></ng-container>\n </td>\n </tr>\n <suis-spinner-container\n *ngIf=\"loading\"\n [absolute]=\"true\"\n [blur]=\"true\"\n ></suis-spinner-container>\n </tbody>\n</table>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:600;padding:.75rem 1rem}.suis-table thead tr th:first-child{border-top-left-radius:.25rem}.suis-table thead tr th:last-child{border-top-right-radius:.25rem}.suis-table thead tr th.pointer{cursor:pointer}.suis-table thead tr th>.suis-table__header{display:flex;align-items:center}.suis-table thead tr th>.suis-table__header suis-icon{display:block;margin-left:.125rem}.suis-table tbody{position:relative;background-color:#f5f6fa}.suis-table tbody tr{border-bottom:.0625rem solid #dcdde1}.suis-table tbody tr:hover{background-color:#dcdde1d9}.suis-table tbody tr td{padding:.375rem 1rem}\n"] }]
|
|
57
|
+
args: [{ selector: 'suis-table', standalone: true, imports: [CommonModule, SuisIconComponent, SuisSpinnerContainerComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<table *ngIf=\"columns\" class=\"suis-table\">\n <thead>\n <tr>\n <th\n *ngFor=\"let column of columns\"\n [class.pointer]=\"column.orderProperty\"\n (click)=\"\n column.orderProperty ? onColumnClick(column.orderProperty) : undefined\n \"\n >\n <div class=\"suis-table__header\">\n <span>\n {{ column.name }}\n </span>\n <suis-icon\n *ngIf=\"column.orderProperty && column.orderProperty === orderBy\"\n [type]=\"\n sortBy === 'asc'\n ? SuisIconType.CHEVRON_DOWN\n : SuisIconType.CHEVRON_UP\n \"\n size=\"lg\"\n color=\"white\"\n ></suis-icon>\n </div>\n </th>\n <th *ngIf=\"!columns?.length\"></th>\n </tr>\n </thead>\n <tbody>\n <tr *ngFor=\"let item of data\">\n <td *ngFor=\"let column of columns\">\n <ng-container\n *ngTemplateOutlet=\"\n column.cell!.templateRef;\n context: { $implicit: item }\n \"\n ></ng-container>\n </td>\n </tr>\n <tr *ngIf=\"!data?.length\">\n <td class=\"empty\" [attr.colspan]=\"columns ? columns.length : 1\">\n {{ loading ? '' : emptyMessage }}\n </td>\n </tr>\n <suis-spinner-container\n *ngIf=\"loading\"\n [absolute]=\"true\"\n [blur]=\"true\"\n [color]=\"'secondary'\"\n ></suis-spinner-container>\n </tbody>\n</table>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:600;padding:.75rem 1rem}.suis-table thead tr th:first-child{border-top-left-radius:.25rem}.suis-table thead tr th:last-child{border-top-right-radius:.25rem}.suis-table thead tr th.pointer{cursor:pointer}.suis-table thead tr th>.suis-table__header{display:flex;align-items:center}.suis-table thead tr th>.suis-table__header suis-icon{display:block;margin-left:.125rem}.suis-table tbody{position:relative;background-color:#f5f6fa}.suis-table tbody tr{border-bottom:.0625rem solid #dcdde1}.suis-table tbody tr:hover{background-color:#dcdde1d9}.suis-table tbody tr td{padding:.375rem 1rem}.suis-table tbody tr td.empty{text-align:center;padding:1.5rem 1rem}\n"] }]
|
|
54
58
|
}], propDecorators: { columns: [{
|
|
55
59
|
type: ContentChildren,
|
|
56
60
|
args: [SuisTableColumnDirective]
|
|
@@ -63,9 +67,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
|
63
67
|
type: Input
|
|
64
68
|
}], loading: [{
|
|
65
69
|
type: Input
|
|
70
|
+
}], emptyMessage: [{
|
|
71
|
+
type: Input
|
|
66
72
|
}], sortByChange: [{
|
|
67
73
|
type: Output
|
|
68
74
|
}], orderByChange: [{
|
|
69
75
|
type: Output
|
|
70
76
|
}] } });
|
|
71
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
77
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy10YWJsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtdGFibGUvc3Vpcy10YWJsZS5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL3N1aXMvc3JjL2xpYi9jb21wb25lbnRzL3N1aXMtdGFibGUvc3Vpcy10YWJsZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ0wsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxlQUFlLEVBQ2YsWUFBWSxFQUNaLEtBQUssRUFDTCxNQUFNLEVBQ04sU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsNkJBQTZCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUUxRSxPQUFPLEVBQUUsd0JBQXdCLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUN6RSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsWUFBWSxFQUFFLE1BQU0sY0FBYyxDQUFDOzs7QUFFL0QsTUFRYSxrQkFBa0I7SUFSL0I7UUFTRSxnQkFBZ0I7UUFDUCxpQkFBWSxHQUFHLFlBQVksQ0FBQztRQU1yQzs7V0FFRztRQUN3QixTQUFJLEdBQXdCLEVBQUUsQ0FBQztRQUUxRDs7V0FFRztRQUNNLFlBQU8sR0FBVyxFQUFFLENBQUM7UUFFOUI7O1dBRUc7UUFDTSxXQUFNLEdBQW1CLEtBQUssQ0FBQztRQUV4Qzs7V0FFRztRQUNNLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFFbEM7O1dBRUc7UUFDTSxpQkFBWSxHQUNuQiwrQ0FBK0MsQ0FBQztRQUVsRDs7V0FFRztRQUNPLGlCQUFZLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUVwRDs7V0FFRztRQUNPLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztLQVd0RDtJQVRDLGFBQWEsQ0FBQyxRQUFnQjtRQUM1QixJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssUUFBUSxFQUFFO1lBQzdCLElBQUksQ0FBQyxPQUFPLEdBQUcsUUFBUSxDQUFDO1lBQ3hCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztTQUN2QzthQUFNO1lBQ0wsSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsTUFBTSxLQUFLLEtBQUssQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUM7WUFDckQsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1NBQ3JDO0lBQ0gsQ0FBQzs4R0FwRFUsa0JBQWtCO2tHQUFsQixrQkFBa0IsMlJBS1osd0JBQXdCLDZCQzVCM0MsaStDQXFEQSxpOEJEbkNZLFlBQVksdWFBQUUsaUJBQWlCLGtJQUFFLDZCQUE2Qjs7U0FLN0Qsa0JBQWtCOzJGQUFsQixrQkFBa0I7a0JBUjlCLFNBQVM7K0JBQ0UsWUFBWSxjQUNWLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxpQkFBaUIsRUFBRSw2QkFBNkIsQ0FBQyxtQkFHeEQsdUJBQXVCLENBQUMsTUFBTTs4QkFRL0MsT0FBTztzQkFETixlQUFlO3VCQUFDLHdCQUF3QjtnQkFNZCxJQUFJO3NCQUE5QixLQUFLO3VCQUFDLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRTtnQkFLaEIsT0FBTztzQkFBZixLQUFLO2dCQUtHLE1BQU07c0JBQWQsS0FBSztnQkFLRyxPQUFPO3NCQUFmLEtBQUs7Z0JBS0csWUFBWTtzQkFBcEIsS0FBSztnQkFNSSxZQUFZO3NCQUFyQixNQUFNO2dCQUtHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSxcbiAgQ29tcG9uZW50LFxuICBDb250ZW50Q2hpbGRyZW4sXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbiAgUXVlcnlMaXN0LFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBTdWlzU3Bpbm5lckNvbnRhaW5lckNvbXBvbmVudCB9IGZyb20gJy4uL3N1aXMtc3Bpbm5lci1jb250YWluZXInO1xuaW1wb3J0IHsgU3Vpc1RhYmxlRGF0YUl0ZW0gfSBmcm9tICcuL3N1aXMtdGFibGUuaW50ZXJmYWNlcyc7XG5pbXBvcnQgeyBTdWlzVGFibGVDb2x1bW5EaXJlY3RpdmUgfSBmcm9tICcuL3N1aXMtdGFibGUtY29sdW1uLmRpcmVjdGl2ZSc7XG5pbXBvcnQgeyBTdWlzSWNvbkNvbXBvbmVudCwgU3Vpc0ljb25UeXBlIH0gZnJvbSAnLi4vc3Vpcy1pY29uJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3Vpcy10YWJsZScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIFN1aXNJY29uQ29tcG9uZW50LCBTdWlzU3Bpbm5lckNvbnRhaW5lckNvbXBvbmVudF0sXG4gIHRlbXBsYXRlVXJsOiAnLi9zdWlzLXRhYmxlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vc3Vpcy10YWJsZS5jb21wb25lbnQuc2NzcyddLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbn0pXG5leHBvcnQgY2xhc3MgU3Vpc1RhYmxlQ29tcG9uZW50IHtcbiAgLyoqIEBpbnRlcm5hbCAqL1xuICByZWFkb25seSBTdWlzSWNvblR5cGUgPSBTdWlzSWNvblR5cGU7XG5cbiAgLyoqIEBpbnRlcm5hbCAqL1xuICBAQ29udGVudENoaWxkcmVuKFN1aXNUYWJsZUNvbHVtbkRpcmVjdGl2ZSlcbiAgY29sdW1ucz86IFF1ZXJ5TGlzdDxTdWlzVGFibGVDb2x1bW5EaXJlY3RpdmU+O1xuXG4gIC8qKlxuICAgKiBEYXRhIGl0ZW1zIGNvbGxlY3Rpb24uIFR5cGUgb2YgU3Vpc1RhYmxlRGF0YUl0ZW1bXS4gQnkgZGVmYXVsdCBzZXQgdG8gZW1wdHkgYXJyYXkuIFJlcXVpcmVkIGlucHV0LlxuICAgKi9cbiAgQElucHV0KHsgcmVxdWlyZWQ6IHRydWUgfSkgZGF0YTogU3Vpc1RhYmxlRGF0YUl0ZW1bXSA9IFtdO1xuXG4gIC8qKlxuICAgKiBTcGVjaWZpZXMgcHJvcGVydHkgdGhhdCBkYXRhIGlzIG9yZGVyZWQuIEJ5IGRlZmF1bHQgc2V0IHRvIGVtcHR5IHN0cmluZy5cbiAgICovXG4gIEBJbnB1dCgpIG9yZGVyQnk6IHN0cmluZyA9ICcnO1xuXG4gIC8qKlxuICAgKiBTcGVjaWZpZXMgc29ydCBjb25kaXRpb24uIEFjY2VwdGVkIHZhbHVlcyAtICdhc2MnIGFuZCAnZGVzYycuIEJ5IGRlZmF1bHQgc2V0IHRvICdhc2MnLlxuICAgKi9cbiAgQElucHV0KCkgc29ydEJ5OiAnYXNjJyB8ICdkZXNjJyA9ICdhc2MnO1xuXG4gIC8qKlxuICAgKiBTaG93cyBsb2FkaW5nIHNwaW5uZXIgYW5kIGJsdXJzIGRhdGEuIEJ5IGRlZmF1bHQgc2V0IHRvIGZhbHNlLlxuICAgKi9cbiAgQElucHV0KCkgbG9hZGluZzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBNZXNzYWdlIHNob3duIGluIHRhYmxlIHdoZW4gdGhlcmUgaXMgbm8gZGF0YSB0byBkaXNwbGF5LlxuICAgKi9cbiAgQElucHV0KCkgZW1wdHlNZXNzYWdlOiBzdHJpbmcgPVxuICAgICdUaGVyZSBpcyBubyBkYXRhIHRvIGJlIGRpc3BsYXllZCBpbiB0aGUgdGFibGUnO1xuXG4gIC8qKlxuICAgKiBFbWl0cyB2YWx1ZSBvbiBzb3J0IGNvbmRpdGlvbiBjaGFuZ2UuXG4gICAqL1xuICBAT3V0cHV0KCkgc29ydEJ5Q2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgLyoqXG4gICAqIEVtaXRzIHZhbHVlIG9uIG9yZGVyIHByb3BlcnR5IGNoYW5nZS5cbiAgICovXG4gIEBPdXRwdXQoKSBvcmRlckJ5Q2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgb25Db2x1bW5DbGljayhwcm9wZXJ0eTogc3RyaW5nKTogdm9pZCB7XG4gICAgaWYgKHRoaXMub3JkZXJCeSAhPT0gcHJvcGVydHkpIHtcbiAgICAgIHRoaXMub3JkZXJCeSA9IHByb3BlcnR5O1xuICAgICAgdGhpcy5vcmRlckJ5Q2hhbmdlLmVtaXQodGhpcy5vcmRlckJ5KTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5zb3J0QnkgPSB0aGlzLnNvcnRCeSA9PT0gJ2FzYycgPyAnZGVzYycgOiAnYXNjJztcbiAgICAgIHRoaXMuc29ydEJ5Q2hhbmdlLmVtaXQodGhpcy5zb3J0QnkpO1xuICAgIH1cbiAgfVxufVxuIiwiPHRhYmxlICpuZ0lmPVwiY29sdW1uc1wiIGNsYXNzPVwic3Vpcy10YWJsZVwiPlxuICA8dGhlYWQ+XG4gICAgPHRyPlxuICAgICAgPHRoXG4gICAgICAgICpuZ0Zvcj1cImxldCBjb2x1bW4gb2YgY29sdW1uc1wiXG4gICAgICAgIFtjbGFzcy5wb2ludGVyXT1cImNvbHVtbi5vcmRlclByb3BlcnR5XCJcbiAgICAgICAgKGNsaWNrKT1cIlxuICAgICAgICAgIGNvbHVtbi5vcmRlclByb3BlcnR5ID8gb25Db2x1bW5DbGljayhjb2x1bW4ub3JkZXJQcm9wZXJ0eSkgOiB1bmRlZmluZWRcbiAgICAgICAgXCJcbiAgICAgID5cbiAgICAgICAgPGRpdiBjbGFzcz1cInN1aXMtdGFibGVfX2hlYWRlclwiPlxuICAgICAgICAgIDxzcGFuPlxuICAgICAgICAgICAge3sgY29sdW1uLm5hbWUgfX1cbiAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgPHN1aXMtaWNvblxuICAgICAgICAgICAgKm5nSWY9XCJjb2x1bW4ub3JkZXJQcm9wZXJ0eSAmJiBjb2x1bW4ub3JkZXJQcm9wZXJ0eSA9PT0gb3JkZXJCeVwiXG4gICAgICAgICAgICBbdHlwZV09XCJcbiAgICAgICAgICAgICAgc29ydEJ5ID09PSAnYXNjJ1xuICAgICAgICAgICAgICAgID8gU3Vpc0ljb25UeXBlLkNIRVZST05fRE9XTlxuICAgICAgICAgICAgICAgIDogU3Vpc0ljb25UeXBlLkNIRVZST05fVVBcbiAgICAgICAgICAgIFwiXG4gICAgICAgICAgICBzaXplPVwibGdcIlxuICAgICAgICAgICAgY29sb3I9XCJ3aGl0ZVwiXG4gICAgICAgICAgPjwvc3Vpcy1pY29uPlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvdGg+XG4gICAgICA8dGggKm5nSWY9XCIhY29sdW1ucz8ubGVuZ3RoXCI+PC90aD5cbiAgICA8L3RyPlxuICA8L3RoZWFkPlxuICA8dGJvZHk+XG4gICAgPHRyICpuZ0Zvcj1cImxldCBpdGVtIG9mIGRhdGFcIj5cbiAgICAgIDx0ZCAqbmdGb3I9XCJsZXQgY29sdW1uIG9mIGNvbHVtbnNcIj5cbiAgICAgICAgPG5nLWNvbnRhaW5lclxuICAgICAgICAgICpuZ1RlbXBsYXRlT3V0bGV0PVwiXG4gICAgICAgICAgICBjb2x1bW4uY2VsbCEudGVtcGxhdGVSZWY7XG4gICAgICAgICAgICBjb250ZXh0OiB7ICRpbXBsaWNpdDogaXRlbSB9XG4gICAgICAgICAgXCJcbiAgICAgICAgPjwvbmctY29udGFpbmVyPlxuICAgICAgPC90ZD5cbiAgICA8L3RyPlxuICAgIDx0ciAqbmdJZj1cIiFkYXRhPy5sZW5ndGhcIj5cbiAgICAgIDx0ZCBjbGFzcz1cImVtcHR5XCIgW2F0dHIuY29sc3Bhbl09XCJjb2x1bW5zID8gY29sdW1ucy5sZW5ndGggOiAxXCI+XG4gICAgICAgIHt7IGxvYWRpbmcgPyAnJyA6IGVtcHR5TWVzc2FnZSB9fVxuICAgICAgPC90ZD5cbiAgICA8L3RyPlxuICAgIDxzdWlzLXNwaW5uZXItY29udGFpbmVyXG4gICAgICAqbmdJZj1cImxvYWRpbmdcIlxuICAgICAgW2Fic29sdXRlXT1cInRydWVcIlxuICAgICAgW2JsdXJdPVwidHJ1ZVwiXG4gICAgICBbY29sb3JdPVwiJ3NlY29uZGFyeSdcIlxuICAgID48L3N1aXMtc3Bpbm5lci1jb250YWluZXI+XG4gIDwvdGJvZHk+XG48L3RhYmxlPlxuIl19
|
|
@@ -1,11 +1,7 @@
|
|
|
1
|
-
import { Directive,
|
|
1
|
+
import { Directive, EventEmitter, Input, Output } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
class SuisButtonBase {
|
|
4
4
|
constructor() {
|
|
5
|
-
/** @internal */
|
|
6
|
-
this.elementRef = inject(ElementRef);
|
|
7
|
-
/** @internal */
|
|
8
|
-
this.renderer2 = inject(Renderer2);
|
|
9
5
|
/**
|
|
10
6
|
* Sets button's color theme. Type of SuisPalleteColor | SuisInfoColor. By default set to 'primary'.
|
|
11
7
|
*/
|
|
@@ -14,6 +10,10 @@ class SuisButtonBase {
|
|
|
14
10
|
* Sets button's disabled attribute. By default set to false.
|
|
15
11
|
*/
|
|
16
12
|
this.disabled = false;
|
|
13
|
+
/**
|
|
14
|
+
* Sets button's type attribute. By default set to 'button'.
|
|
15
|
+
*/
|
|
16
|
+
this.type = 'button';
|
|
17
17
|
/**
|
|
18
18
|
* Shows loading spinner instead of content projection. By default set to false.
|
|
19
19
|
*/
|
|
@@ -22,9 +22,17 @@ class SuisButtonBase {
|
|
|
22
22
|
* Sets width to 100% instead of fit-content. By default set to false.
|
|
23
23
|
*/
|
|
24
24
|
this.fullWidth = false;
|
|
25
|
+
/**
|
|
26
|
+
* Emits on button click event.
|
|
27
|
+
*/
|
|
28
|
+
this.clicked = new EventEmitter();
|
|
29
|
+
}
|
|
30
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
31
|
+
onClick(event) {
|
|
32
|
+
this.clicked.emit();
|
|
25
33
|
}
|
|
26
34
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
27
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonBase, inputs: { color: "color", disabled: "disabled", loading: "loading", fullWidth: "fullWidth" }, ngImport: i0 }); }
|
|
35
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: SuisButtonBase, inputs: { color: "color", disabled: "disabled", type: "type", loading: "loading", fullWidth: "fullWidth" }, outputs: { clicked: "clicked" }, ngImport: i0 }); }
|
|
28
36
|
}
|
|
29
37
|
export { SuisButtonBase };
|
|
30
38
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisButtonBase, decorators: [{
|
|
@@ -33,9 +41,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
|
33
41
|
type: Input
|
|
34
42
|
}], disabled: [{
|
|
35
43
|
type: Input
|
|
44
|
+
}], type: [{
|
|
45
|
+
type: Input
|
|
36
46
|
}], loading: [{
|
|
37
47
|
type: Input
|
|
38
48
|
}], fullWidth: [{
|
|
39
49
|
type: Input
|
|
50
|
+
}], clicked: [{
|
|
51
|
+
type: Output
|
|
40
52
|
}] } });
|
|
41
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
53
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Vpcy1idXR0b24uYmFzZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvc3Vpcy9zcmMvbGliL3NoYXJlZC9jbGFzc2VzL3N1aXMtYnV0dG9uLmJhc2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFHdkUsTUFDc0IsY0FBYztJQURwQztRQUVFOztXQUVHO1FBQ00sVUFBSyxHQUFxQyxTQUFTLENBQUM7UUFFN0Q7O1dBRUc7UUFDTSxhQUFRLEdBQVksS0FBSyxDQUFDO1FBRW5DOztXQUVHO1FBQ00sU0FBSSxHQUFXLFFBQVEsQ0FBQztRQUVqQzs7V0FFRztRQUNNLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFFbEM7O1dBRUc7UUFDTSxjQUFTLEdBQVksS0FBSyxDQUFDO1FBRXBDOztXQUVHO1FBQ08sWUFBTyxHQUFHLElBQUksWUFBWSxFQUFRLENBQUM7S0FNOUM7SUFKQyw2REFBNkQ7SUFDN0QsT0FBTyxDQUFDLEtBQWE7UUFDbkIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN0QixDQUFDOzhHQWxDbUIsY0FBYztrR0FBZCxjQUFjOztTQUFkLGNBQWM7MkZBQWQsY0FBYztrQkFEbkMsU0FBUzs4QkFLQyxLQUFLO3NCQUFiLEtBQUs7Z0JBS0csUUFBUTtzQkFBaEIsS0FBSztnQkFLRyxJQUFJO3NCQUFaLEtBQUs7Z0JBS0csT0FBTztzQkFBZixLQUFLO2dCQUtHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBS0ksT0FBTztzQkFBaEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWlzSW5mb0NvbG9yLCBTdWlzUGFsbGV0ZUNvbG9yIH0gZnJvbSAnLi4vLi4vdHlwZXMvc3Vpcy1jb2xvci50eXBlJztcblxuQERpcmVjdGl2ZSgpXG5leHBvcnQgYWJzdHJhY3QgY2xhc3MgU3Vpc0J1dHRvbkJhc2Uge1xuICAvKipcbiAgICogU2V0cyBidXR0b24ncyBjb2xvciB0aGVtZS4gVHlwZSBvZiBTdWlzUGFsbGV0ZUNvbG9yIHwgU3Vpc0luZm9Db2xvci4gQnkgZGVmYXVsdCBzZXQgdG8gJ3ByaW1hcnknLlxuICAgKi9cbiAgQElucHV0KCkgY29sb3I6IFN1aXNQYWxsZXRlQ29sb3IgfCBTdWlzSW5mb0NvbG9yID0gJ3ByaW1hcnknO1xuXG4gIC8qKlxuICAgKiBTZXRzIGJ1dHRvbidzIGRpc2FibGVkIGF0dHJpYnV0ZS4gQnkgZGVmYXVsdCBzZXQgdG8gZmFsc2UuXG4gICAqL1xuICBASW5wdXQoKSBkaXNhYmxlZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBTZXRzIGJ1dHRvbidzIHR5cGUgYXR0cmlidXRlLiBCeSBkZWZhdWx0IHNldCB0byAnYnV0dG9uJy5cbiAgICovXG4gIEBJbnB1dCgpIHR5cGU6IHN0cmluZyA9ICdidXR0b24nO1xuXG4gIC8qKlxuICAgKiBTaG93cyBsb2FkaW5nIHNwaW5uZXIgaW5zdGVhZCBvZiBjb250ZW50IHByb2plY3Rpb24uIEJ5IGRlZmF1bHQgc2V0IHRvIGZhbHNlLlxuICAgKi9cbiAgQElucHV0KCkgbG9hZGluZzogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBTZXRzIHdpZHRoIHRvIDEwMCUgaW5zdGVhZCBvZiBmaXQtY29udGVudC4gQnkgZGVmYXVsdCBzZXQgdG8gZmFsc2UuXG4gICAqL1xuICBASW5wdXQoKSBmdWxsV2lkdGg6IGJvb2xlYW4gPSBmYWxzZTtcblxuICAvKipcbiAgICogRW1pdHMgb24gYnV0dG9uIGNsaWNrIGV2ZW50LlxuICAgKi9cbiAgQE91dHB1dCgpIGNsaWNrZWQgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XG5cbiAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby11bnVzZWQtdmFyc1xuICBvbkNsaWNrKGV2ZW50PzogRXZlbnQpOiB2b2lkIHtcbiAgICB0aGlzLmNsaWNrZWQuZW1pdCgpO1xuICB9XG59XG4iXX0=
|