@spicainternational/ngx-sds-components 6.4.0 → 6.5.1
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/esm2020/src/lib/segmented-control/segmented-control.component.mjs +8 -4
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-segmented-control.mjs +7 -3
- package/fesm2015/spicainternational-ngx-sds-components-src-lib-segmented-control.mjs.map +1 -1
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-segmented-control.mjs +7 -3
- package/fesm2020/spicainternational-ngx-sds-components-src-lib-segmented-control.mjs.map +1 -1
- package/package.json +1 -1
- package/src/lib/segmented-control/segmented-control.component.d.ts +3 -2
|
@@ -4,6 +4,7 @@ import * as i1 from "@angular/common";
|
|
|
4
4
|
import * as i2 from "@fortawesome/angular-fontawesome";
|
|
5
5
|
export class SdsSegmentedControlComponent {
|
|
6
6
|
constructor() {
|
|
7
|
+
this.segmentPadding = 'loose';
|
|
7
8
|
this.itemChange = new EventEmitter();
|
|
8
9
|
this.valueChange = new EventEmitter();
|
|
9
10
|
this.valueExpr = 'value';
|
|
@@ -12,7 +13,8 @@ export class SdsSegmentedControlComponent {
|
|
|
12
13
|
this.style = 'default';
|
|
13
14
|
}
|
|
14
15
|
ngOnInit() { }
|
|
15
|
-
selectItem(item) {
|
|
16
|
+
selectItem(item, event) {
|
|
17
|
+
event.stopPropagation();
|
|
16
18
|
if (!this.disabled) {
|
|
17
19
|
this.value = item[this.valueExpr];
|
|
18
20
|
this.valueChange.emit(this.value);
|
|
@@ -21,10 +23,10 @@ export class SdsSegmentedControlComponent {
|
|
|
21
23
|
}
|
|
22
24
|
}
|
|
23
25
|
SdsSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
24
|
-
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
26
|
+
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style", segmentPadding: "segmentPadding" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
25
27
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, decorators: [{
|
|
26
28
|
type: Component,
|
|
27
|
-
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>" }]
|
|
29
|
+
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"] }]
|
|
28
30
|
}], ctorParameters: function () { return []; }, propDecorators: { items: [{
|
|
29
31
|
type: Input
|
|
30
32
|
}], value: [{
|
|
@@ -43,9 +45,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
43
45
|
type: Input
|
|
44
46
|
}], style: [{
|
|
45
47
|
type: Input
|
|
48
|
+
}], segmentPadding: [{
|
|
49
|
+
type: Input
|
|
46
50
|
}], itemChange: [{
|
|
47
51
|
type: Output
|
|
48
52
|
}], valueChange: [{
|
|
49
53
|
type: Output
|
|
50
54
|
}] } });
|
|
51
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
55
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXNkcy1jb21wb25lbnRzL3NyYy9saWIvc2VnbWVudGVkLWNvbnRyb2wvc2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNILHVCQUF1QixFQUN2QixTQUFTLEVBQ1QsWUFBWSxFQUNaLEtBQUssRUFFTCxNQUFNLEdBQ1QsTUFBTSxlQUFlLENBQUM7Ozs7QUFRdkIsTUFBTSxPQUFPLDRCQUE0QjtJQWdCckM7UUFMUyxtQkFBYyxHQUFzQixPQUFPLENBQUM7UUFFM0MsZUFBVSxHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO1FBQ25ELGdCQUFXLEdBQXNCLElBQUksWUFBWSxFQUFFLENBQUM7UUFHMUQsSUFBSSxDQUFDLFNBQVMsR0FBRyxPQUFPLENBQUM7UUFDekIsSUFBSSxDQUFDLFdBQVcsR0FBRyxNQUFNLENBQUM7UUFDMUIsSUFBSSxDQUFDLFFBQVEsR0FBRyxLQUFLLENBQUM7UUFDdEIsSUFBSSxDQUFDLEtBQUssR0FBRyxTQUFTLENBQUM7SUFDM0IsQ0FBQztJQUVELFFBQVEsS0FBSSxDQUFDO0lBRU4sVUFBVSxDQUFDLElBQVMsRUFBRSxLQUFpQjtRQUMxQyxLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFFeEIsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLEVBQUU7WUFDaEIsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO1lBQ2xDLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztZQUNsQyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUM5QjtJQUNMLENBQUM7OzBIQWpDUSw0QkFBNEI7OEdBQTVCLDRCQUE0Qiw0V0NmekMsKy9CQXVCTTs0RkRSTyw0QkFBNEI7a0JBTnhDLFNBQVM7K0JBQ0ksdUJBQXVCLG1CQUdoQix1QkFBdUIsQ0FBQyxNQUFNOzBFQUd0QyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBQ0csV0FBVztzQkFBbkIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBRUcsS0FBSztzQkFBYixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBRUksVUFBVTtzQkFBbkIsTUFBTTtnQkFDRyxXQUFXO3NCQUFwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcclxuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxyXG4gICAgQ29tcG9uZW50LFxyXG4gICAgRXZlbnRFbWl0dGVyLFxyXG4gICAgSW5wdXQsXHJcbiAgICBPbkluaXQsXHJcbiAgICBPdXRwdXQsXHJcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAnc2RzLXNlZ21lbnRlZC1jb250cm9sJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9zZWdtZW50ZWQtY29udHJvbC5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9zZWdtZW50ZWQtY29udHJvbC5jb21wb25lbnQuc2NzcyddLFxyXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTZHNTZWdtZW50ZWRDb250cm9sQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICAgIEBJbnB1dCgpIGl0ZW1zOiBhbnlbXSB8IHVuZGVmaW5lZDtcclxuICAgIEBJbnB1dCgpIHZhbHVlOiBhbnk7XHJcbiAgICBASW5wdXQoKSB2YWx1ZUV4cHI7XHJcbiAgICBASW5wdXQoKSBkaXNwbGF5RXhwcjogc3RyaW5nIHwgdW5kZWZpbmVkO1xyXG4gICAgQElucHV0KCkgaWNvbkV4cHI6IHN0cmluZyB8IHVuZGVmaW5lZDtcclxuICAgIEBJbnB1dCgpIHRvb2x0aXBFeHByOiBzdHJpbmcgfCB1bmRlZmluZWQ7XHJcbiAgICBASW5wdXQoKSBpZEV4cHI6IHN0cmluZyB8IHVuZGVmaW5lZDtcclxuICAgIEBJbnB1dCgpIGRpc2FibGVkOiBib29sZWFuO1xyXG5cclxuICAgIEBJbnB1dCgpIHN0eWxlOiAnZGVmYXVsdCcgfCAncHJpbWFyeScgfCAnaW52ZXJ0ZWQnO1xyXG4gICAgQElucHV0KCkgc2VnbWVudFBhZGRpbmc6ICd0aWdodCcgfCAnbG9vc2UnID0gJ2xvb3NlJztcclxuXHJcbiAgICBAT3V0cHV0KCkgaXRlbUNoYW5nZTogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyKCk7XHJcbiAgICBAT3V0cHV0KCkgdmFsdWVDaGFuZ2U6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKCkge1xyXG4gICAgICAgIHRoaXMudmFsdWVFeHByID0gJ3ZhbHVlJztcclxuICAgICAgICB0aGlzLmRpc3BsYXlFeHByID0gJ3RleHQnO1xyXG4gICAgICAgIHRoaXMuZGlzYWJsZWQgPSBmYWxzZTtcclxuICAgICAgICB0aGlzLnN0eWxlID0gJ2RlZmF1bHQnO1xyXG4gICAgfVxyXG5cclxuICAgIG5nT25Jbml0KCkge31cclxuXHJcbiAgICBwdWJsaWMgc2VsZWN0SXRlbShpdGVtOiBhbnksIGV2ZW50OiBNb3VzZUV2ZW50KTogdm9pZCB7XHJcbiAgICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XHJcblxyXG4gICAgICAgIGlmICghdGhpcy5kaXNhYmxlZCkge1xyXG4gICAgICAgICAgICB0aGlzLnZhbHVlID0gaXRlbVt0aGlzLnZhbHVlRXhwcl07XHJcbiAgICAgICAgICAgIHRoaXMudmFsdWVDaGFuZ2UuZW1pdCh0aGlzLnZhbHVlKTtcclxuICAgICAgICAgICAgdGhpcy5pdGVtQ2hhbmdlLmVtaXQoaXRlbSk7XHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG59XHJcbiIsIjxkaXYgXHJcbiAgICBjbGFzcz1cInNkcy1zZWdtZW50ZWQtY29udHJvbC1jb250YWluZXJcIiBcclxuICAgIFtuZ0NsYXNzXT1cIntcclxuICAgICAgICAnZGlzYWJsZWQnOiBkaXNhYmxlZCxcclxuICAgICAgICAnc2RzLXNlZ21lbnRlZC1jb250cm9sLXByaW1hcnknOiBzdHlsZSA9PSAncHJpbWFyeScsXHJcbiAgICAgICAgJ3Nkcy1zZWdtZW50ZWQtY29udHJvbC1pbnZlcnRlZCc6IHN0eWxlID09ICdpbnZlcnRlZCdcclxuICAgIH1cIlxyXG4gICAgPlxyXG4gICAgPGRpdiAqbmdGb3I9XCJsZXQgaXRlbSBvZiBpdGVtcyBsZXQgbGFzdCA9IGxhc3Q7XCIgXHJcbiAgICAgICAgY2xhc3M9XCJzZWdtZW50XCIgXHJcbiAgICAgICAgaWQ9XCJ7e2lkRXhwciA/IGl0ZW1baWRFeHByXTogJyd9fVwiXHJcbiAgICAgICAgW2NsYXNzLnNlbGVjdGVkXT1cIml0ZW1bdmFsdWVFeHByXSA9PSB2YWx1ZVwiXHJcbiAgICAgICAgW2NsYXNzLnRpZ2h0LXBhZGRpbmddPVwic2VnbWVudFBhZGRpbmcgPT0gJ3RpZ2h0J1wiXHJcbiAgICAgICAgW3RpdGxlXT1cInRvb2x0aXBFeHByICYmIGl0ZW1bdG9vbHRpcEV4cHJdID8gaXRlbVt0b29sdGlwRXhwcl0gOiAnJ1wiXHJcbiAgICAgICAgKGNsaWNrKT1cInNlbGVjdEl0ZW0oaXRlbSwgJGV2ZW50KVwiPlxyXG5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwic2RzLWZsZXgtcm93LWNlbnRlciBnYXAtMlwiPlxyXG4gICAgICAgICAgICA8ZmEtaWNvbiAqbmdJZj1cImljb25FeHByICYmIGl0ZW1baWNvbkV4cHJdXCIgW2ljb25dPVwiaXRlbVtpY29uRXhwcl1cIiBbZml4ZWRXaWR0aF09XCJ0cnVlXCI+PC9mYS1pY29uPlxyXG5cclxuICAgICAgICAgICAgPCEtLSA8aSAqbmdJZj1cIml0ZW0uaWNvblwiIGNsYXNzPVwie3tpdGVtLmljb259fSBtZS0yXCI+PC9pPiAtLT5cclxuICAgICAgICAgICAgPHNwYW4gKm5nSWY9XCJkaXNwbGF5RXhwclwiPnt7aXRlbVtkaXNwbGF5RXhwcl19fTwvc3Bhbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG48L2Rpdj4iXX0=
|
|
@@ -7,6 +7,7 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
|
7
7
|
|
|
8
8
|
class SdsSegmentedControlComponent {
|
|
9
9
|
constructor() {
|
|
10
|
+
this.segmentPadding = 'loose';
|
|
10
11
|
this.itemChange = new EventEmitter();
|
|
11
12
|
this.valueChange = new EventEmitter();
|
|
12
13
|
this.valueExpr = 'value';
|
|
@@ -15,7 +16,8 @@ class SdsSegmentedControlComponent {
|
|
|
15
16
|
this.style = 'default';
|
|
16
17
|
}
|
|
17
18
|
ngOnInit() { }
|
|
18
|
-
selectItem(item) {
|
|
19
|
+
selectItem(item, event) {
|
|
20
|
+
event.stopPropagation();
|
|
19
21
|
if (!this.disabled) {
|
|
20
22
|
this.value = item[this.valueExpr];
|
|
21
23
|
this.valueChange.emit(this.value);
|
|
@@ -24,10 +26,10 @@ class SdsSegmentedControlComponent {
|
|
|
24
26
|
}
|
|
25
27
|
}
|
|
26
28
|
SdsSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
-
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29
|
+
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style", segmentPadding: "segmentPadding" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
28
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, decorators: [{
|
|
29
31
|
type: Component,
|
|
30
|
-
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>" }]
|
|
32
|
+
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"] }]
|
|
31
33
|
}], ctorParameters: function () { return []; }, propDecorators: { items: [{
|
|
32
34
|
type: Input
|
|
33
35
|
}], value: [{
|
|
@@ -46,6 +48,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
46
48
|
type: Input
|
|
47
49
|
}], style: [{
|
|
48
50
|
type: Input
|
|
51
|
+
}], segmentPadding: [{
|
|
52
|
+
type: Input
|
|
49
53
|
}], itemChange: [{
|
|
50
54
|
type: Output
|
|
51
55
|
}], valueChange: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-segmented-control.mjs","sources":["../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.html","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.module.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/spicainternational-ngx-sds-components-src-lib-segmented-control.ts"],"sourcesContent":["import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n EventEmitter,\r\n Input,\r\n OnInit,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-segmented-control',\r\n templateUrl: './segmented-control.component.html',\r\n styleUrls: ['./segmented-control.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsSegmentedControlComponent implements OnInit {\r\n @Input() items: any[] | undefined;\r\n @Input() value: any;\r\n @Input() valueExpr;\r\n @Input() displayExpr: string | undefined;\r\n @Input() iconExpr: string | undefined;\r\n @Input() tooltipExpr: string | undefined;\r\n @Input() idExpr: string | undefined;\r\n @Input() disabled: boolean;\r\n\r\n @Input() style: 'default' | 'primary' | 'inverted';\r\n\r\n @Output() itemChange: EventEmitter<any> = new EventEmitter();\r\n @Output() valueChange: EventEmitter<any> = new EventEmitter();\r\n\r\n constructor() {\r\n this.valueExpr = 'value';\r\n this.displayExpr = 'text';\r\n this.disabled = false;\r\n this.style = 'default';\r\n }\r\n\r\n ngOnInit() {}\r\n\r\n public selectItem(item: any): void {\r\n if (!this.disabled) {\r\n this.value = item[this.valueExpr];\r\n this.valueChange.emit(this.value);\r\n this.itemChange.emit(item);\r\n }\r\n }\r\n}\r\n","<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSegmentedControlComponent } from './segmented-control.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\nconst components = [SdsSegmentedControlComponent];\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsSegmentedControlModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAea,4BAA4B,CAAA;
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-segmented-control.mjs","sources":["../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.html","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.module.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/spicainternational-ngx-sds-components-src-lib-segmented-control.ts"],"sourcesContent":["import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n EventEmitter,\r\n Input,\r\n OnInit,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-segmented-control',\r\n templateUrl: './segmented-control.component.html',\r\n styleUrls: ['./segmented-control.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsSegmentedControlComponent implements OnInit {\r\n @Input() items: any[] | undefined;\r\n @Input() value: any;\r\n @Input() valueExpr;\r\n @Input() displayExpr: string | undefined;\r\n @Input() iconExpr: string | undefined;\r\n @Input() tooltipExpr: string | undefined;\r\n @Input() idExpr: string | undefined;\r\n @Input() disabled: boolean;\r\n\r\n @Input() style: 'default' | 'primary' | 'inverted';\r\n @Input() segmentPadding: 'tight' | 'loose' = 'loose';\r\n\r\n @Output() itemChange: EventEmitter<any> = new EventEmitter();\r\n @Output() valueChange: EventEmitter<any> = new EventEmitter();\r\n\r\n constructor() {\r\n this.valueExpr = 'value';\r\n this.displayExpr = 'text';\r\n this.disabled = false;\r\n this.style = 'default';\r\n }\r\n\r\n ngOnInit() {}\r\n\r\n public selectItem(item: any, event: MouseEvent): void {\r\n event.stopPropagation();\r\n\r\n if (!this.disabled) {\r\n this.value = item[this.valueExpr];\r\n this.valueChange.emit(this.value);\r\n this.itemChange.emit(item);\r\n }\r\n }\r\n}\r\n","<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSegmentedControlComponent } from './segmented-control.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\nconst components = [SdsSegmentedControlComponent];\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsSegmentedControlModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -7,6 +7,7 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
|
7
7
|
|
|
8
8
|
class SdsSegmentedControlComponent {
|
|
9
9
|
constructor() {
|
|
10
|
+
this.segmentPadding = 'loose';
|
|
10
11
|
this.itemChange = new EventEmitter();
|
|
11
12
|
this.valueChange = new EventEmitter();
|
|
12
13
|
this.valueExpr = 'value';
|
|
@@ -15,7 +16,8 @@ class SdsSegmentedControlComponent {
|
|
|
15
16
|
this.style = 'default';
|
|
16
17
|
}
|
|
17
18
|
ngOnInit() { }
|
|
18
|
-
selectItem(item) {
|
|
19
|
+
selectItem(item, event) {
|
|
20
|
+
event.stopPropagation();
|
|
19
21
|
if (!this.disabled) {
|
|
20
22
|
this.value = item[this.valueExpr];
|
|
21
23
|
this.valueChange.emit(this.value);
|
|
@@ -24,10 +26,10 @@ class SdsSegmentedControlComponent {
|
|
|
24
26
|
}
|
|
25
27
|
}
|
|
26
28
|
SdsSegmentedControlComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
-
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
29
|
+
SdsSegmentedControlComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: SdsSegmentedControlComponent, selector: "sds-segmented-control", inputs: { items: "items", value: "value", valueExpr: "valueExpr", displayExpr: "displayExpr", iconExpr: "iconExpr", tooltipExpr: "tooltipExpr", idExpr: "idExpr", disabled: "disabled", style: "style", segmentPadding: "segmentPadding" }, outputs: { itemChange: "itemChange", valueChange: "valueChange" }, ngImport: i0, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
28
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdsSegmentedControlComponent, decorators: [{
|
|
29
31
|
type: Component,
|
|
30
|
-
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>" }]
|
|
32
|
+
args: [{ selector: 'sds-segmented-control', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>", styles: [".sds-segmented-control-container .segment.tight-padding{padding-left:.5rem;padding-right:.5rem}\n"] }]
|
|
31
33
|
}], ctorParameters: function () { return []; }, propDecorators: { items: [{
|
|
32
34
|
type: Input
|
|
33
35
|
}], value: [{
|
|
@@ -46,6 +48,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
46
48
|
type: Input
|
|
47
49
|
}], style: [{
|
|
48
50
|
type: Input
|
|
51
|
+
}], segmentPadding: [{
|
|
52
|
+
type: Input
|
|
49
53
|
}], itemChange: [{
|
|
50
54
|
type: Output
|
|
51
55
|
}], valueChange: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-segmented-control.mjs","sources":["../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.html","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.module.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/spicainternational-ngx-sds-components-src-lib-segmented-control.ts"],"sourcesContent":["import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n EventEmitter,\r\n Input,\r\n OnInit,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-segmented-control',\r\n templateUrl: './segmented-control.component.html',\r\n styleUrls: ['./segmented-control.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsSegmentedControlComponent implements OnInit {\r\n @Input() items: any[] | undefined;\r\n @Input() value: any;\r\n @Input() valueExpr;\r\n @Input() displayExpr: string | undefined;\r\n @Input() iconExpr: string | undefined;\r\n @Input() tooltipExpr: string | undefined;\r\n @Input() idExpr: string | undefined;\r\n @Input() disabled: boolean;\r\n\r\n @Input() style: 'default' | 'primary' | 'inverted';\r\n\r\n @Output() itemChange: EventEmitter<any> = new EventEmitter();\r\n @Output() valueChange: EventEmitter<any> = new EventEmitter();\r\n\r\n constructor() {\r\n this.valueExpr = 'value';\r\n this.displayExpr = 'text';\r\n this.disabled = false;\r\n this.style = 'default';\r\n }\r\n\r\n ngOnInit() {}\r\n\r\n public selectItem(item: any): void {\r\n if (!this.disabled) {\r\n this.value = item[this.valueExpr];\r\n this.valueChange.emit(this.value);\r\n this.itemChange.emit(item);\r\n }\r\n }\r\n}\r\n","<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSegmentedControlComponent } from './segmented-control.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\nconst components = [SdsSegmentedControlComponent];\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsSegmentedControlModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;MAea,4BAA4B,CAAA;
|
|
1
|
+
{"version":3,"file":"spicainternational-ngx-sds-components-src-lib-segmented-control.mjs","sources":["../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.component.html","../../../projects/ngx-sds-components/src/lib/segmented-control/segmented-control.module.ts","../../../projects/ngx-sds-components/src/lib/segmented-control/spicainternational-ngx-sds-components-src-lib-segmented-control.ts"],"sourcesContent":["import {\r\n ChangeDetectionStrategy,\r\n Component,\r\n EventEmitter,\r\n Input,\r\n OnInit,\r\n Output,\r\n} from '@angular/core';\r\n\r\n@Component({\r\n selector: 'sds-segmented-control',\r\n templateUrl: './segmented-control.component.html',\r\n styleUrls: ['./segmented-control.component.scss'],\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class SdsSegmentedControlComponent implements OnInit {\r\n @Input() items: any[] | undefined;\r\n @Input() value: any;\r\n @Input() valueExpr;\r\n @Input() displayExpr: string | undefined;\r\n @Input() iconExpr: string | undefined;\r\n @Input() tooltipExpr: string | undefined;\r\n @Input() idExpr: string | undefined;\r\n @Input() disabled: boolean;\r\n\r\n @Input() style: 'default' | 'primary' | 'inverted';\r\n @Input() segmentPadding: 'tight' | 'loose' = 'loose';\r\n\r\n @Output() itemChange: EventEmitter<any> = new EventEmitter();\r\n @Output() valueChange: EventEmitter<any> = new EventEmitter();\r\n\r\n constructor() {\r\n this.valueExpr = 'value';\r\n this.displayExpr = 'text';\r\n this.disabled = false;\r\n this.style = 'default';\r\n }\r\n\r\n ngOnInit() {}\r\n\r\n public selectItem(item: any, event: MouseEvent): void {\r\n event.stopPropagation();\r\n\r\n if (!this.disabled) {\r\n this.value = item[this.valueExpr];\r\n this.valueChange.emit(this.value);\r\n this.itemChange.emit(item);\r\n }\r\n }\r\n}\r\n","<div \r\n class=\"sds-segmented-control-container\" \r\n [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'sds-segmented-control-primary': style == 'primary',\r\n 'sds-segmented-control-inverted': style == 'inverted'\r\n }\"\r\n >\r\n <div *ngFor=\"let item of items let last = last;\" \r\n class=\"segment\" \r\n id=\"{{idExpr ? item[idExpr]: ''}}\"\r\n [class.selected]=\"item[valueExpr] == value\"\r\n [class.tight-padding]=\"segmentPadding == 'tight'\"\r\n [title]=\"tooltipExpr && item[tooltipExpr] ? item[tooltipExpr] : ''\"\r\n (click)=\"selectItem(item, $event)\">\r\n\r\n <div class=\"sds-flex-row-center gap-2\">\r\n <fa-icon *ngIf=\"iconExpr && item[iconExpr]\" [icon]=\"item[iconExpr]\" [fixedWidth]=\"true\"></fa-icon>\r\n\r\n <!-- <i *ngIf=\"item.icon\" class=\"{{item.icon}} me-2\"></i> -->\r\n <span *ngIf=\"displayExpr\">{{item[displayExpr]}}</span>\r\n </div>\r\n </div>\r\n</div>","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { SdsSegmentedControlComponent } from './segmented-control.component';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\n\r\n\r\nconst components = [SdsSegmentedControlComponent];\r\n@NgModule({\r\n declarations: [\r\n ...components\r\n ],\r\n imports: [\r\n CommonModule,\r\n FontAwesomeModule\r\n ],\r\n exports: [\r\n ...components\r\n]\r\n})\r\nexport class SdsSegmentedControlModule { }\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -10,11 +10,12 @@ export declare class SdsSegmentedControlComponent implements OnInit {
|
|
|
10
10
|
idExpr: string | undefined;
|
|
11
11
|
disabled: boolean;
|
|
12
12
|
style: 'default' | 'primary' | 'inverted';
|
|
13
|
+
segmentPadding: 'tight' | 'loose';
|
|
13
14
|
itemChange: EventEmitter<any>;
|
|
14
15
|
valueChange: EventEmitter<any>;
|
|
15
16
|
constructor();
|
|
16
17
|
ngOnInit(): void;
|
|
17
|
-
selectItem(item: any): void;
|
|
18
|
+
selectItem(item: any, event: MouseEvent): void;
|
|
18
19
|
static ɵfac: i0.ɵɵFactoryDeclaration<SdsSegmentedControlComponent, never>;
|
|
19
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SdsSegmentedControlComponent, "sds-segmented-control", never, { "items": "items"; "value": "value"; "valueExpr": "valueExpr"; "displayExpr": "displayExpr"; "iconExpr": "iconExpr"; "tooltipExpr": "tooltipExpr"; "idExpr": "idExpr"; "disabled": "disabled"; "style": "style"; }, { "itemChange": "itemChange"; "valueChange": "valueChange"; }, never, never, false, never>;
|
|
20
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SdsSegmentedControlComponent, "sds-segmented-control", never, { "items": "items"; "value": "value"; "valueExpr": "valueExpr"; "displayExpr": "displayExpr"; "iconExpr": "iconExpr"; "tooltipExpr": "tooltipExpr"; "idExpr": "idExpr"; "disabled": "disabled"; "style": "style"; "segmentPadding": "segmentPadding"; }, { "itemChange": "itemChange"; "valueChange": "valueChange"; }, never, never, false, never>;
|
|
20
21
|
}
|