suis 0.24.0 → 0.26.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -1
- package/esm2022/lib/components/index.mjs +4 -2
- package/esm2022/lib/components/suis-box/suis-box.component.mjs +2 -2
- package/esm2022/lib/components/suis-breadcrumbs/suis-breadcrumbs.component.mjs +3 -9
- package/esm2022/lib/components/suis-form-field/suis-form-field.component.mjs +3 -11
- package/esm2022/lib/components/suis-input/index.mjs +3 -0
- package/esm2022/lib/components/suis-input/suis-input.component.mjs +66 -0
- package/esm2022/lib/components/suis-input/suis-input.types.mjs +2 -0
- package/esm2022/lib/components/suis-input-checkbox/index.mjs +2 -0
- package/esm2022/lib/components/suis-input-checkbox/suis-input-checkbox.component.mjs +55 -0
- package/esm2022/lib/components/suis-input-chips/suis-input-chips.component.mjs +5 -5
- package/esm2022/lib/components/suis-input-number/suis-input-number.component.mjs +3 -3
- package/esm2022/lib/components/suis-label/suis-label.component.mjs +15 -7
- package/esm2022/lib/components/suis-pagination/suis-pagination.component.mjs +3 -9
- package/esm2022/lib/components/suis-table/suis-table.component.mjs +3 -3
- package/esm2022/lib/components/suis-title/suis-title.component.mjs +5 -13
- package/esm2022/lib/components/suis-toolbar/index.mjs +2 -0
- package/esm2022/lib/components/suis-toolbar/suis-toolbar.component.mjs +21 -0
- package/esm2022/lib/shared/classes/suis-input.base.mjs +7 -3
- package/fesm2022/suis.mjs +123 -76
- package/fesm2022/suis.mjs.map +1 -1
- package/lib/components/index.d.ts +3 -1
- package/lib/components/suis-breadcrumbs/suis-breadcrumbs.component.d.ts +1 -5
- package/lib/components/suis-form-field/suis-form-field.component.d.ts +1 -5
- package/lib/components/suis-input/index.d.ts +2 -0
- package/lib/components/suis-input/suis-input.component.d.ts +25 -0
- package/lib/components/suis-input/suis-input.types.d.ts +1 -0
- package/lib/components/suis-input-checkbox/index.d.ts +1 -0
- package/lib/components/suis-input-checkbox/suis-input-checkbox.component.d.ts +17 -0
- package/lib/components/suis-label/suis-label.component.d.ts +11 -3
- package/lib/components/suis-pagination/suis-pagination.component.d.ts +1 -5
- package/lib/components/suis-title/suis-title.component.d.ts +1 -5
- package/lib/components/suis-toolbar/index.d.ts +1 -0
- package/lib/components/suis-toolbar/suis-toolbar.component.d.ts +9 -0
- package/lib/shared/classes/suis-input.base.d.ts +9 -1
- package/package.json +1 -1
- package/esm2022/lib/components/suis-input-text/index.mjs +0 -3
- package/esm2022/lib/components/suis-input-text/suis-input-text.component.mjs +0 -66
- package/esm2022/lib/components/suis-input-text/suis-input-text.types.mjs +0 -2
- package/lib/components/suis-input-text/index.d.ts +0 -2
- package/lib/components/suis-input-text/suis-input-text.component.d.ts +0 -25
- package/lib/components/suis-input-text/suis-input-text.types.d.ts +0 -1
package/fesm2022/suis.mjs
CHANGED
@@ -183,11 +183,11 @@ class SuisBoxComponent {
|
|
183
183
|
this.spacing = false;
|
184
184
|
}
|
185
185
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
186
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisBoxComponent, isStandalone: true, selector: "suis-box", inputs: { spacing: "spacing" }, ngImport: i0, template: "<div class=\"suis-box\" [class.suis-box--spacing]=\"spacing\">\n <ng-content></ng-content>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-box{background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem}.suis-box--spacing{padding:1.25rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
186
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisBoxComponent, isStandalone: true, selector: "suis-box", inputs: { spacing: "spacing" }, ngImport: i0, template: "<div class=\"suis-box\" [class.suis-box--spacing]=\"spacing\">\n <ng-content></ng-content>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-box{background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem}.suis-box--spacing{padding:1rem}@media (min-width: 768px){.suis-box--spacing{padding:1.25rem}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
187
187
|
}
|
188
188
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisBoxComponent, decorators: [{
|
189
189
|
type: Component,
|
190
|
-
args: [{ selector: 'suis-box', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-box\" [class.suis-box--spacing]=\"spacing\">\n <ng-content></ng-content>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-box{background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem}.suis-box--spacing{padding:1.25rem}\n"] }]
|
190
|
+
args: [{ selector: 'suis-box', standalone: true, imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-box\" [class.suis-box--spacing]=\"spacing\">\n <ng-content></ng-content>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-box{background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem}.suis-box--spacing{padding:1rem}@media (min-width: 768px){.suis-box--spacing{padding:1.25rem}}\n"] }]
|
191
191
|
}], propDecorators: { spacing: [{
|
192
192
|
type: Input
|
193
193
|
}] } });
|
@@ -198,25 +198,19 @@ class SuisBreadcrumbsComponent {
|
|
198
198
|
* List of breadcrumbs items. Type of SuisBreadcrumbItem[]. By default set to empty array.
|
199
199
|
*/
|
200
200
|
this.items = [];
|
201
|
-
/**
|
202
|
-
* Adds a bottom margin below the breadcrumbs. By default set to false.
|
203
|
-
*/
|
204
|
-
this.spacing = false;
|
205
201
|
}
|
206
202
|
/** @internal */
|
207
203
|
itemTrackBy(index, item) {
|
208
204
|
return `${item.label}-${index}`;
|
209
205
|
}
|
210
206
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisBreadcrumbsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
211
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisBreadcrumbsComponent, isStandalone: true, selector: "suis-breadcrumbs", inputs: { items: "items"
|
207
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisBreadcrumbsComponent, isStandalone: true, selector: "suis-breadcrumbs", inputs: { items: "items" }, ngImport: i0, template: "<div class=\"suis-breadcrumbs\">\n <ng-container\n *ngFor=\"let item of items; let last = last; trackBy: itemTrackBy\"\n >\n <a [routerLink]=\"last ? undefined : item.link\">\n {{ item.label }}\n </a>\n <span *ngIf=\"!last\">/</span>\n </ng-container>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-breadcrumbs a{text-decoration:none;color:#2f3640;font-weight:400}.suis-breadcrumbs a:not(:last-of-type){font-weight:600;color:#40739e}\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: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
212
208
|
}
|
213
209
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisBreadcrumbsComponent, decorators: [{
|
214
210
|
type: Component,
|
215
|
-
args: [{ selector: 'suis-breadcrumbs', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-breadcrumbs\"
|
211
|
+
args: [{ selector: 'suis-breadcrumbs', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-breadcrumbs\">\n <ng-container\n *ngFor=\"let item of items; let last = last; trackBy: itemTrackBy\"\n >\n <a [routerLink]=\"last ? undefined : item.link\">\n {{ item.label }}\n </a>\n <span *ngIf=\"!last\">/</span>\n </ng-container>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-breadcrumbs a{text-decoration:none;color:#2f3640;font-weight:400}.suis-breadcrumbs a:not(:last-of-type){font-weight:600;color:#40739e}\n"] }]
|
216
212
|
}], propDecorators: { items: [{
|
217
213
|
type: Input
|
218
|
-
}], spacing: [{
|
219
|
-
type: Input
|
220
214
|
}] } });
|
221
215
|
|
222
216
|
class SuisSpinnerComponent {
|
@@ -398,22 +392,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
398
392
|
}] } });
|
399
393
|
|
400
394
|
class SuisFormFieldComponent {
|
401
|
-
constructor() {
|
402
|
-
/**
|
403
|
-
* Adds a bottom margin below the field. By default set to false.
|
404
|
-
*/
|
405
|
-
this.spacing = false;
|
406
|
-
}
|
407
395
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisFormFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
408
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisFormFieldComponent, isStandalone: true, selector: "suis-form-field", inputs: { errorTemplate: "errorTemplate"
|
396
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisFormFieldComponent, isStandalone: true, selector: "suis-form-field", inputs: { errorTemplate: "errorTemplate" }, ngImport: i0, template: "<div class=\"suis-form-field\">\n <ng-content></ng-content>\n <div *ngIf=\"errorTemplate\" class=\"suis-form-field__error\">\n <ng-container [ngTemplateOutlet]=\"errorTemplate\"></ng-container>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-form-field{width:100%}.suis-form-field__error{color:#ff4757;margin-top:.375rem;font-size:.75rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
409
397
|
}
|
410
398
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisFormFieldComponent, decorators: [{
|
411
399
|
type: Component,
|
412
|
-
args: [{ selector: 'suis-form-field', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-form-field\"
|
400
|
+
args: [{ selector: 'suis-form-field', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-form-field\">\n <ng-content></ng-content>\n <div *ngIf=\"errorTemplate\" class=\"suis-form-field__error\">\n <ng-container [ngTemplateOutlet]=\"errorTemplate\"></ng-container>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-form-field{width:100%}.suis-form-field__error{color:#ff4757;margin-top:.375rem;font-size:.75rem}\n"] }]
|
413
401
|
}], propDecorators: { errorTemplate: [{
|
414
402
|
type: Input
|
415
|
-
}], spacing: [{
|
416
|
-
type: Input
|
417
403
|
}] } });
|
418
404
|
|
419
405
|
class SuisInputBase {
|
@@ -459,11 +445,15 @@ class SuisInputBase {
|
|
459
445
|
this.cdRef.markForCheck();
|
460
446
|
}
|
461
447
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
462
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: SuisInputBase, inputs: { readonly: "readonly", invalid: "invalid" }, outputs: { changed: "changed", touched: "touched" }, ngImport: i0 }); }
|
448
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.0.0", type: SuisInputBase, inputs: { id: "id", name: "name", readonly: "readonly", invalid: "invalid" }, outputs: { changed: "changed", touched: "touched" }, ngImport: i0 }); }
|
463
449
|
}
|
464
450
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputBase, decorators: [{
|
465
451
|
type: Directive
|
466
|
-
}], propDecorators: {
|
452
|
+
}], propDecorators: { id: [{
|
453
|
+
type: Input
|
454
|
+
}], name: [{
|
455
|
+
type: Input
|
456
|
+
}], readonly: [{
|
467
457
|
type: Input
|
468
458
|
}], invalid: [{
|
469
459
|
type: Input
|
@@ -473,11 +463,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
473
463
|
type: Output
|
474
464
|
}] } });
|
475
465
|
|
476
|
-
class
|
466
|
+
class SuisInputComponent extends SuisInputBase {
|
477
467
|
constructor() {
|
478
468
|
super(...arguments);
|
479
469
|
/**
|
480
|
-
* Sets input's type to one of the accepted values -
|
470
|
+
* Sets input's type to one of the accepted values - type of SuisInputType. By default set to 'text'.
|
481
471
|
*/
|
482
472
|
this.type = 'text';
|
483
473
|
/**
|
@@ -507,24 +497,24 @@ class SuisInputTextComponent extends SuisInputBase {
|
|
507
497
|
onEnter() {
|
508
498
|
this.enterPressed.emit();
|
509
499
|
}
|
510
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type:
|
511
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type:
|
500
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
501
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisInputComponent, isStandalone: true, selector: "suis-input", inputs: { type: "type", placeholder: "placeholder" }, outputs: { enterPressed: "enterPressed" }, providers: [
|
512
502
|
{
|
513
503
|
provide: NG_VALUE_ACCESSOR,
|
514
504
|
multi: true,
|
515
|
-
useExisting: forwardRef(() =>
|
505
|
+
useExisting: forwardRef(() => SuisInputComponent),
|
516
506
|
},
|
517
|
-
], usesInheritance: true, ngImport: i0, template: "<input\n class=\"suis-input
|
507
|
+
], usesInheritance: true, ngImport: i0, template: "<input\n class=\"suis-input\"\n [class.suis-input--invalid]=\"invalid\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n (keydown.enter)=\"onEnter()\"\n/>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-input{width:100%;background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem;padding:.5rem 1rem;border:0;min-height:2rem}.suis-input:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input--invalid{box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
518
508
|
}
|
519
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type:
|
509
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputComponent, decorators: [{
|
520
510
|
type: Component,
|
521
|
-
args: [{ selector: 'suis-input
|
511
|
+
args: [{ selector: 'suis-input', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
522
512
|
{
|
523
513
|
provide: NG_VALUE_ACCESSOR,
|
524
514
|
multi: true,
|
525
|
-
useExisting: forwardRef(() =>
|
515
|
+
useExisting: forwardRef(() => SuisInputComponent),
|
526
516
|
},
|
527
|
-
], template: "<input\n class=\"suis-input
|
517
|
+
], template: "<input\n class=\"suis-input\"\n [class.suis-input--invalid]=\"invalid\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n (keydown.enter)=\"onEnter()\"\n/>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-input{width:100%;background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem;padding:.5rem 1rem;border:0;min-height:2rem}.suis-input:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input--invalid{box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
528
518
|
}], propDecorators: { type: [{
|
529
519
|
type: Input
|
530
520
|
}], placeholder: [{
|
@@ -533,6 +523,83 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
533
523
|
type: Output
|
534
524
|
}] } });
|
535
525
|
|
526
|
+
class SuisLabelComponent {
|
527
|
+
constructor() {
|
528
|
+
/**
|
529
|
+
* Adds a red colored asterisk after the label. By default set to false.
|
530
|
+
*/
|
531
|
+
this.required = false;
|
532
|
+
/**
|
533
|
+
* Shows the pointer cursor when hovered. By default set to false.
|
534
|
+
*/
|
535
|
+
this.pointer = false;
|
536
|
+
/**
|
537
|
+
* Grays out the label content and removes cursor pointer behavior. By default set to false.
|
538
|
+
*/
|
539
|
+
this.readonly = false;
|
540
|
+
}
|
541
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
542
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisLabelComponent, isStandalone: true, selector: "suis-label", inputs: { for: "for", required: "required", pointer: "pointer", readonly: "readonly" }, ngImport: i0, template: "<label\n class=\"suis-label\"\n [class.suis-label--pointer]=\"!readonly && pointer\"\n [class.suis-label--readonly]=\"readonly\"\n [htmlFor]=\"for ? for : undefined\"\n>\n <ng-content></ng-content>\n <span *ngIf=\"required\" class=\"suis-label__asterisk\">*</span>\n <ng-content select=\"[suisLabelAside]\"></ng-content>\n</label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-label{font-size:.875rem;display:flex;align-items:center}.suis-label__asterisk{color:#ff4757;margin-left:.0625rem}.suis-label--pointer{cursor:pointer}.suis-label--readonly{color:#dcdde1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
543
|
+
}
|
544
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisLabelComponent, decorators: [{
|
545
|
+
type: Component,
|
546
|
+
args: [{ selector: 'suis-label', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label\n class=\"suis-label\"\n [class.suis-label--pointer]=\"!readonly && pointer\"\n [class.suis-label--readonly]=\"readonly\"\n [htmlFor]=\"for ? for : undefined\"\n>\n <ng-content></ng-content>\n <span *ngIf=\"required\" class=\"suis-label__asterisk\">*</span>\n <ng-content select=\"[suisLabelAside]\"></ng-content>\n</label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-label{font-size:.875rem;display:flex;align-items:center}.suis-label__asterisk{color:#ff4757;margin-left:.0625rem}.suis-label--pointer{cursor:pointer}.suis-label--readonly{color:#dcdde1}\n"] }]
|
547
|
+
}], propDecorators: { for: [{
|
548
|
+
type: Input
|
549
|
+
}], required: [{
|
550
|
+
type: Input
|
551
|
+
}], pointer: [{
|
552
|
+
type: Input
|
553
|
+
}], readonly: [{
|
554
|
+
type: Input
|
555
|
+
}] } });
|
556
|
+
|
557
|
+
class SuisInputCheckboxComponent extends SuisInputBase {
|
558
|
+
constructor() {
|
559
|
+
super(...arguments);
|
560
|
+
/** @internal */
|
561
|
+
this.SuisIconType = SuisIconType;
|
562
|
+
/** @internal */
|
563
|
+
this.value = false;
|
564
|
+
/**
|
565
|
+
* Adds a red colored asterisk after the label. By default set to false.
|
566
|
+
*/
|
567
|
+
this.required = false;
|
568
|
+
}
|
569
|
+
writeValue(obj) {
|
570
|
+
this.value = obj;
|
571
|
+
this._onChange(this.value);
|
572
|
+
this.cdRef.markForCheck();
|
573
|
+
}
|
574
|
+
onChange(event) {
|
575
|
+
const target = event.target;
|
576
|
+
this.value = target.checked;
|
577
|
+
this._onChange(this.value);
|
578
|
+
this.changed.emit(this.value);
|
579
|
+
this.cdRef.markForCheck();
|
580
|
+
}
|
581
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
582
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisInputCheckboxComponent, isStandalone: true, selector: "suis-input-checkbox", inputs: { required: "required" }, providers: [
|
583
|
+
{
|
584
|
+
provide: NG_VALUE_ACCESSOR,
|
585
|
+
multi: true,
|
586
|
+
useExisting: forwardRef(() => SuisInputCheckboxComponent),
|
587
|
+
},
|
588
|
+
], usesInheritance: true, ngImport: i0, template: "<input\n type=\"checkbox\"\n class=\"suis-input-checkbox\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [value]=\"value\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n/>\n\n<suis-label\n [for]=\"id\"\n [required]=\"required\"\n [pointer]=\"true\"\n [readonly]=\"readonly\"\n>\n <div\n [tabindex]=\"readonly ? -1 : 0\"\n class=\"suis-input-checkbox__check\"\n [class.suis-input-checkbox__check--invalid]=\"invalid\"\n [class.suis-input-checkbox__check--readonly]=\"readonly\"\n >\n <suis-icon\n *ngIf=\"value\"\n [type]=\"SuisIconType.CHECK\"\n [color]=\"readonly ? 'tertiary' : 'primary'\"\n ></suis-icon>\n </div>\n <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #192a56;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;box-shadow:0 2px 5px #ff4757bf}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SuisLabelComponent, selector: "suis-label", inputs: ["for", "required", "pointer", "readonly"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
589
|
+
}
|
590
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputCheckboxComponent, decorators: [{
|
591
|
+
type: Component,
|
592
|
+
args: [{ selector: 'suis-input-checkbox', standalone: true, imports: [CommonModule, SuisLabelComponent, SuisIconComponent], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
593
|
+
{
|
594
|
+
provide: NG_VALUE_ACCESSOR,
|
595
|
+
multi: true,
|
596
|
+
useExisting: forwardRef(() => SuisInputCheckboxComponent),
|
597
|
+
},
|
598
|
+
], template: "<input\n type=\"checkbox\"\n class=\"suis-input-checkbox\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [value]=\"value\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n/>\n\n<suis-label\n [for]=\"id\"\n [required]=\"required\"\n [pointer]=\"true\"\n [readonly]=\"readonly\"\n>\n <div\n [tabindex]=\"readonly ? -1 : 0\"\n class=\"suis-input-checkbox__check\"\n [class.suis-input-checkbox__check--invalid]=\"invalid\"\n [class.suis-input-checkbox__check--readonly]=\"readonly\"\n >\n <suis-icon\n *ngIf=\"value\"\n [type]=\"SuisIconType.CHECK\"\n [color]=\"readonly ? 'tertiary' : 'primary'\"\n ></suis-icon>\n </div>\n <ng-content></ng-content>\n</suis-label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:flex}.suis-input-checkbox{display:none}.suis-input-checkbox__check{width:1.25rem;height:1.25rem;border:.0625rem solid #192a56;display:flex;justify-content:center;align-items:center;margin-right:.5rem;background-color:#fff}.suis-input-checkbox__check:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-checkbox__check--readonly{border:.0625rem solid #dcdde1}.suis-input-checkbox__check--readonly:focus{box-shadow:none}.suis-input-checkbox__check--invalid{border:.0625rem solid #ff4757;box-shadow:0 2px 5px #ff4757bf}\n"] }]
|
599
|
+
}], propDecorators: { required: [{
|
600
|
+
type: Input
|
601
|
+
}] } });
|
602
|
+
|
536
603
|
class SuisInputChipsComponent extends SuisInputBase {
|
537
604
|
constructor() {
|
538
605
|
super(...arguments);
|
@@ -585,7 +652,7 @@ class SuisInputChipsComponent extends SuisInputBase {
|
|
585
652
|
multi: true,
|
586
653
|
useExisting: forwardRef(() => SuisInputChipsComponent),
|
587
654
|
},
|
588
|
-
], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"suis-input-chips\">\n <div #input class=\"suis-input-chips__input\">\n <suis-input
|
655
|
+
], viewQueries: [{ propertyName: "inputEl", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"suis-input-chips\">\n <div #input class=\"suis-input-chips__input\">\n <suis-input\n [id]=\"id\"\n [name]=\"name\"\n [formControl]=\"inputControl\"\n [readonly]=\"readonly\"\n [invalid]=\"invalid\"\n [placeholder]=\"placeholder\"\n (touched)=\"onTouch()\"\n (enterPressed)=\"submitValue()\"\n ></suis-input>\n </div>\n <div *ngIf=\"value.length\" class=\"suis-input-chips__chips\">\n <suis-chip\n [removable]=\"readonly ? false : true\"\n [color]=\"chipColor\"\n [iconColor]=\"chipIconColor\"\n (remove)=\"removeItem(item)\"\n *ngFor=\"let item of value\"\n >\n {{ item }}\n </suis-chip>\n </div>\n</div>\n", styles: [":host{display:block}.suis-input-chips__chips{margin-top:.375rem;display:flex;flex-wrap:wrap}.suis-input-chips__chips suis-chip:not(:last-child){margin-right:.25rem}\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: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SuisChipComponent, selector: "suis-chip", inputs: ["color", "iconColor", "removable"], outputs: ["remove"] }, { kind: "component", type: SuisInputComponent, selector: "suis-input", inputs: ["type", "placeholder"], outputs: ["enterPressed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
589
656
|
}
|
590
657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputChipsComponent, decorators: [{
|
591
658
|
type: Component,
|
@@ -593,14 +660,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
593
660
|
CommonModule,
|
594
661
|
ReactiveFormsModule,
|
595
662
|
SuisChipComponent,
|
596
|
-
|
663
|
+
SuisInputComponent,
|
597
664
|
], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
598
665
|
{
|
599
666
|
provide: NG_VALUE_ACCESSOR,
|
600
667
|
multi: true,
|
601
668
|
useExisting: forwardRef(() => SuisInputChipsComponent),
|
602
669
|
},
|
603
|
-
], template: "<div class=\"suis-input-chips\">\n <div #input class=\"suis-input-chips__input\">\n <suis-input
|
670
|
+
], template: "<div class=\"suis-input-chips\">\n <div #input class=\"suis-input-chips__input\">\n <suis-input\n [id]=\"id\"\n [name]=\"name\"\n [formControl]=\"inputControl\"\n [readonly]=\"readonly\"\n [invalid]=\"invalid\"\n [placeholder]=\"placeholder\"\n (touched)=\"onTouch()\"\n (enterPressed)=\"submitValue()\"\n ></suis-input>\n </div>\n <div *ngIf=\"value.length\" class=\"suis-input-chips__chips\">\n <suis-chip\n [removable]=\"readonly ? false : true\"\n [color]=\"chipColor\"\n [iconColor]=\"chipIconColor\"\n (remove)=\"removeItem(item)\"\n *ngFor=\"let item of value\"\n >\n {{ item }}\n </suis-chip>\n </div>\n</div>\n", styles: [":host{display:block}.suis-input-chips__chips{margin-top:.375rem;display:flex;flex-wrap:wrap}.suis-input-chips__chips suis-chip:not(:last-child){margin-right:.25rem}\n"] }]
|
604
671
|
}], propDecorators: { inputEl: [{
|
605
672
|
type: ViewChild,
|
606
673
|
args: ['input']
|
@@ -742,7 +809,7 @@ class SuisInputNumberComponent extends SuisInputBase {
|
|
742
809
|
multi: true,
|
743
810
|
useExisting: forwardRef(() => SuisInputNumberComponent),
|
744
811
|
},
|
745
|
-
], usesInheritance: true, ngImport: i0, template: "<input\n class=\"suis-input-number\"\n [class.suis-input-number--invalid]=\"invalid\"\n
|
812
|
+
], usesInheritance: true, ngImport: i0, template: "<input\n type=\"number\"\n class=\"suis-input-number\"\n [class.suis-input-number--invalid]=\"invalid\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n/>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-input-number{width:100%;background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem;padding:.5rem 1rem;border:0;min-height:2rem;-moz-appearance:textfield}.suis-input-number:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-number--invalid{box-shadow:0 2px 5px #ff4757bf}.suis-input-number::-webkit-outer-spin-button,.suis-input-number::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
746
813
|
}
|
747
814
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisInputNumberComponent, decorators: [{
|
748
815
|
type: Component,
|
@@ -752,34 +819,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
752
819
|
multi: true,
|
753
820
|
useExisting: forwardRef(() => SuisInputNumberComponent),
|
754
821
|
},
|
755
|
-
], template: "<input\n class=\"suis-input-number\"\n [class.suis-input-number--invalid]=\"invalid\"\n
|
822
|
+
], template: "<input\n type=\"number\"\n class=\"suis-input-number\"\n [class.suis-input-number--invalid]=\"invalid\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [disabled]=\"readonly\"\n (input)=\"onChange($event)\"\n (focus)=\"onTouch()\"\n/>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-input-number{width:100%;background-color:#fff;box-shadow:0 2px 5px #00000040;border-radius:.25rem;padding:.5rem 1rem;border:0;min-height:2rem;-moz-appearance:textfield}.suis-input-number:focus{box-shadow:0 2px 5px #192a56bf;outline:none}.suis-input-number--invalid{box-shadow:0 2px 5px #ff4757bf}.suis-input-number::-webkit-outer-spin-button,.suis-input-number::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}\n"] }]
|
756
823
|
}], propDecorators: { placeholder: [{
|
757
824
|
type: Input
|
758
825
|
}] } });
|
759
826
|
|
760
|
-
class SuisLabelComponent {
|
761
|
-
constructor() {
|
762
|
-
/**
|
763
|
-
* Adds a red colored asterisk after the label. By default set to false.
|
764
|
-
*/
|
765
|
-
this.required = false;
|
766
|
-
/**
|
767
|
-
* Adds a bottom margin below the label. By default set to false.
|
768
|
-
*/
|
769
|
-
this.spacing = false;
|
770
|
-
}
|
771
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
772
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisLabelComponent, isStandalone: true, selector: "suis-label", inputs: { required: "required", spacing: "spacing" }, ngImport: i0, template: "<label class=\"suis-label\" [class.suis-label--spacing]=\"spacing\">\n <ng-content></ng-content>\n <span *ngIf=\"required\" class=\"suis-label__asterisk\">*</span>\n <ng-content select=\"[suisLabelAside]\"></ng-content>\n</label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-label{font-size:.875rem;display:flex}.suis-label--spacing{margin-bottom:.375rem}.suis-label__asterisk{color:#ff4757;margin-left:.0625rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
773
|
-
}
|
774
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisLabelComponent, decorators: [{
|
775
|
-
type: Component,
|
776
|
-
args: [{ selector: 'suis-label', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label class=\"suis-label\" [class.suis-label--spacing]=\"spacing\">\n <ng-content></ng-content>\n <span *ngIf=\"required\" class=\"suis-label__asterisk\">*</span>\n <ng-content select=\"[suisLabelAside]\"></ng-content>\n</label>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-label{font-size:.875rem;display:flex}.suis-label--spacing{margin-bottom:.375rem}.suis-label__asterisk{color:#ff4757;margin-left:.0625rem}\n"] }]
|
777
|
-
}], propDecorators: { required: [{
|
778
|
-
type: Input
|
779
|
-
}], spacing: [{
|
780
|
-
type: Input
|
781
|
-
}] } });
|
782
|
-
|
783
827
|
class SuisNavigationItemComponent {
|
784
828
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
785
829
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisNavigationItemComponent, isStandalone: true, selector: "suis-navigation-item", inputs: { item: "item", templateRef: "templateRef" }, ngImport: i0, template: "<a\n *ngIf=\"item\"\n class=\"suis-navigation-item\"\n [routerLink]=\"item.link\"\n routerLinkActive=\"active\"\n>\n <div class=\"suis-navigation-item__content\">\n <ng-container *ngIf=\"templateRef; else label\">\n <ng-container\n *ngTemplateOutlet=\"templateRef; context: { $implicit: item }\"\n ></ng-container>\n </ng-container>\n <ng-template #label>\n {{ item.label }}\n </ng-template>\n </div>\n</a>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block;width:100%}.suis-navigation-item{display:flex;justify-content:space-between;padding:1rem;color:#fff;font-size:.875rem;text-decoration:none;text-transform:uppercase;width:100%;position:relative;cursor:pointer;padding:.75rem 1rem .75rem 2rem}.suis-navigation-item:hover{background-color:#273c75d9}.suis-navigation-item.active{background-color:#273c75;color:#fff;font-weight:600}.suis-navigation-item.active:hover{background-color:#273c75}.suis-navigation-item.active:before{content:\"\";position:absolute;top:0;bottom:0;left:0;width:.1875rem;height:100%;background-color:#dcdde1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i2.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
@@ -1323,10 +1367,6 @@ class SuisPaginationComponent {
|
|
1323
1367
|
* Number of total items in data source. By default set to 0.
|
1324
1368
|
*/
|
1325
1369
|
this.totalItems = 0;
|
1326
|
-
/**
|
1327
|
-
* Adds margin top above the pagination. By default set to false.
|
1328
|
-
*/
|
1329
|
-
this.spacing = false;
|
1330
1370
|
/**
|
1331
1371
|
* Sets the of label "1 'of' 25". By default set to 'of'.
|
1332
1372
|
*/
|
@@ -1380,7 +1420,7 @@ class SuisPaginationComponent {
|
|
1380
1420
|
this.perPageChange.emit(this.perPage);
|
1381
1421
|
}
|
1382
1422
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
1383
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisPaginationComponent, isStandalone: true, selector: "suis-pagination", inputs: { page: "page", perPage: "perPage", perPageOptions: "perPageOptions", totalItems: "totalItems",
|
1423
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisPaginationComponent, isStandalone: true, selector: "suis-pagination", inputs: { page: "page", perPage: "perPage", perPageOptions: "perPageOptions", totalItems: "totalItems", ofLabel: "ofLabel", itemsLabel: "itemsLabel" }, outputs: { pageChange: "pageChange", perPageChange: "perPageChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"suis-pagination\">\n <div>\n <suis-select\n [formControl]=\"perPageControl\"\n [options]=\"perPageOptions | suisPaginationPerPageOptions\"\n [search]=\"false\"\n [nullable]=\"false\"\n ></suis-select>\n </div>\n <div class=\"suis-pagination__actions\">\n <suis-button color=\"secondary\" [disabled]=\"page === 1\" (click)=\"previous()\">\n <suis-icon [type]=\"SuisIconType.CHEVRON_LEFT\" color=\"white\"></suis-icon>\n </suis-button>\n <div>\n {{ ofLabel | suisPaginationPage : page : perPage : totalItems }}\n </div>\n <suis-button\n color=\"secondary\"\n [disabled]=\"page === maxPage\"\n (click)=\"next()\"\n >\n <suis-icon [type]=\"SuisIconType.CHEVRON_RIGHT\" color=\"white\"></suis-icon>\n </suis-button>\n </div>\n <div class=\"suis-pagination__items\">\n {{\n ofLabel | suisPaginationItems : page : perPage : totalItems : itemsLabel\n }}\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-pagination{display:flex;align-items:center;justify-content:space-between;font-size:.875rem}.suis-pagination__actions{display:flex;align-items:center;justify-content:center}.suis-pagination__items{color:#a4a7b0}.suis-pagination suis-button:first-child{margin-right:1rem}.suis-pagination suis-button:last-child{margin-left:1rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SuisIconComponent, selector: "suis-icon", inputs: ["size", "color", "type", "outlined", "filled", "pointer", "bold"] }, { kind: "component", type: SuisButtonComponent, selector: "suis-button" }, { kind: "pipe", type: SuisPaginationPagePipe, name: "suisPaginationPage" }, { kind: "pipe", type: SuisPaginationItemsPipe, name: "suisPaginationItems" }, { kind: "pipe", type: SuisPaginationPerPageOptionsPipe, name: "suisPaginationPerPageOptions" }, { kind: "ngmodule", type: SuisSelectModule }, { kind: "component", type: SuisSelectComponent, selector: "suis-select", inputs: ["nullable"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1384
1424
|
}
|
1385
1425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisPaginationComponent, decorators: [{
|
1386
1426
|
type: Component,
|
@@ -1393,7 +1433,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
1393
1433
|
SuisPaginationItemsPipe,
|
1394
1434
|
SuisPaginationPerPageOptionsPipe,
|
1395
1435
|
SuisSelectModule,
|
1396
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-pagination\"
|
1436
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-pagination\">\n <div>\n <suis-select\n [formControl]=\"perPageControl\"\n [options]=\"perPageOptions | suisPaginationPerPageOptions\"\n [search]=\"false\"\n [nullable]=\"false\"\n ></suis-select>\n </div>\n <div class=\"suis-pagination__actions\">\n <suis-button color=\"secondary\" [disabled]=\"page === 1\" (click)=\"previous()\">\n <suis-icon [type]=\"SuisIconType.CHEVRON_LEFT\" color=\"white\"></suis-icon>\n </suis-button>\n <div>\n {{ ofLabel | suisPaginationPage : page : perPage : totalItems }}\n </div>\n <suis-button\n color=\"secondary\"\n [disabled]=\"page === maxPage\"\n (click)=\"next()\"\n >\n <suis-icon [type]=\"SuisIconType.CHEVRON_RIGHT\" color=\"white\"></suis-icon>\n </suis-button>\n </div>\n <div class=\"suis-pagination__items\">\n {{\n ofLabel | suisPaginationItems : page : perPage : totalItems : itemsLabel\n }}\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-pagination{display:flex;align-items:center;justify-content:space-between;font-size:.875rem}.suis-pagination__actions{display:flex;align-items:center;justify-content:center}.suis-pagination__items{color:#a4a7b0}.suis-pagination suis-button:first-child{margin-right:1rem}.suis-pagination suis-button:last-child{margin-left:1rem}\n"] }]
|
1397
1437
|
}], propDecorators: { page: [{
|
1398
1438
|
type: Input
|
1399
1439
|
}], perPage: [{
|
@@ -1402,8 +1442,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
1402
1442
|
type: Input
|
1403
1443
|
}], totalItems: [{
|
1404
1444
|
type: Input
|
1405
|
-
}], spacing: [{
|
1406
|
-
type: Input
|
1407
1445
|
}], ofLabel: [{
|
1408
1446
|
type: Input
|
1409
1447
|
}], itemsLabel: [{
|
@@ -1744,11 +1782,11 @@ class SuisTableComponent {
|
|
1744
1782
|
}
|
1745
1783
|
}
|
1746
1784
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
1747
|
-
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)}}:host{display:block}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:500;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
|
1785
|
+
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)}}:host{display:block}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:500;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 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 }); }
|
1748
1786
|
}
|
1749
1787
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTableComponent, decorators: [{
|
1750
1788
|
type: Component,
|
1751
|
-
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)}}:host{display:block}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:500;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
|
1789
|
+
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)}}:host{display:block}.suis-table{width:100%;border-collapse:collapse}.suis-table thead{background-color:#273c75;color:#fff}.suis-table thead tr th{font-weight:500;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 td{padding:.375rem 1rem}.suis-table tbody tr td.empty{text-align:center;padding:1.5rem 1rem}\n"] }]
|
1752
1790
|
}], propDecorators: { columns: [{
|
1753
1791
|
type: ContentChildren,
|
1754
1792
|
args: [SuisTableColumnDirective]
|
@@ -1892,18 +1930,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
1892
1930
|
}] });
|
1893
1931
|
|
1894
1932
|
class SuisTitleComponent {
|
1933
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
1934
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisTitleComponent, isStandalone: true, selector: "suis-title", ngImport: i0, template: "<h1 class=\"suis-title\">\n <ng-content></ng-content>\n</h1>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-title{color:#192a56;font-weight:600;font-size:1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1935
|
+
}
|
1936
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisTitleComponent, decorators: [{
|
1937
|
+
type: Component,
|
1938
|
+
args: [{ selector: 'suis-title', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<h1 class=\"suis-title\">\n <ng-content></ng-content>\n</h1>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-title{color:#192a56;font-weight:600;font-size:1.5rem}\n"] }]
|
1939
|
+
}] });
|
1940
|
+
|
1941
|
+
class SuisToolbarComponent {
|
1895
1942
|
constructor() {
|
1896
1943
|
/**
|
1897
|
-
* Adds a
|
1944
|
+
* Adds a padding around the content. By default set to false.
|
1898
1945
|
*/
|
1899
1946
|
this.spacing = false;
|
1900
1947
|
}
|
1901
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type:
|
1902
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type:
|
1948
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
1949
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.0", type: SuisToolbarComponent, isStandalone: true, selector: "suis-toolbar", inputs: { spacing: "spacing" }, ngImport: i0, template: "<div class=\"suis-toolbar\" [class.suis-toolbar--spacing]=\"spacing\">\n <div>\n <ng-content select=\"[suisToolbarLeft]\"></ng-content>\n </div>\n <div>\n <ng-content select=\"[suisToolbarCenter]\"></ng-content>\n </div>\n <div>\n <ng-content select=\"[suisToolbarRight]\"></ng-content>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-toolbar{width:100%;display:flex;align-items:center;justify-content:space-between;background-color:#fff;box-shadow:0 2px 5px #00000040}.suis-toolbar--spacing{padding:.75rem 1rem}@media (min-width: 768px){.suis-toolbar--spacing{padding:1rem 1.25rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1903
1950
|
}
|
1904
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type:
|
1951
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImport: i0, type: SuisToolbarComponent, decorators: [{
|
1905
1952
|
type: Component,
|
1906
|
-
args: [{ selector: 'suis-
|
1953
|
+
args: [{ selector: 'suis-toolbar', standalone: true, imports: [CommonModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"suis-toolbar\" [class.suis-toolbar--spacing]=\"spacing\">\n <div>\n <ng-content select=\"[suisToolbarLeft]\"></ng-content>\n </div>\n <div>\n <ng-content select=\"[suisToolbarCenter]\"></ng-content>\n </div>\n <div>\n <ng-content select=\"[suisToolbarRight]\"></ng-content>\n </div>\n</div>\n", styles: ["*{margin:0;padding:0;box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}:host{display:block}.suis-toolbar{width:100%;display:flex;align-items:center;justify-content:space-between;background-color:#fff;box-shadow:0 2px 5px #00000040}.suis-toolbar--spacing{padding:.75rem 1rem}@media (min-width: 768px){.suis-toolbar--spacing{padding:1rem 1.25rem}}\n"] }]
|
1907
1954
|
}], propDecorators: { spacing: [{
|
1908
1955
|
type: Input
|
1909
1956
|
}] } });
|
@@ -1912,5 +1959,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.0", ngImpor
|
|
1912
1959
|
* Generated bundle index. Do not edit.
|
1913
1960
|
*/
|
1914
1961
|
|
1915
|
-
export { SuisAlertComponent, SuisBoxComponent, SuisBreadcrumbsComponent, SuisButtonComponent, SuisButtonLinkComponent, SuisButtonOutlinedComponent, SuisChipComponent, SuisContainerComponent, SuisFormFieldComponent, SuisIconComponent, SuisIconType, SuisInputChipsComponent,
|
1962
|
+
export { SuisAlertComponent, SuisBoxComponent, SuisBreadcrumbsComponent, SuisButtonComponent, SuisButtonLinkComponent, SuisButtonOutlinedComponent, SuisChipComponent, SuisContainerComponent, SuisFormFieldComponent, SuisIconComponent, SuisIconType, SuisInputCheckboxComponent, SuisInputChipsComponent, SuisInputComponent, SuisInputNumberComponent, SuisLabelComponent, SuisNavigationComponent, SuisNavigationGroupComponent, SuisNavigationGroupItemComponent, SuisNavigationItemComponent, SuisNavigationItemDirective, SuisNavigationModule, SuisNgClassPipe, SuisNotificationComponent, SuisNotificationService, SuisNotificationsComponent, SuisPaginationComponent, SuisProgressBarComponent, SuisSelectComponent, SuisSelectModule, SuisSelectMultiComponent, SuisSelectMultiModule, SuisSelectOptionComponent, SuisSelectOptionDirective, SuisSpinnerComponent, SuisSpinnerContainerComponent, SuisTabDirective, SuisTableCellDirective, SuisTableColumnDirective, SuisTableComponent, SuisTableModule, SuisTabsComponent, SuisTabsModule, SuisTitleComponent, SuisToolbarComponent };
|
1916
1963
|
//# sourceMappingURL=suis.mjs.map
|