ngx-sfc-common 0.0.33 → 0.0.34
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/lib/components/tag/tag.component.mjs +11 -4
- package/fesm2015/ngx-sfc-common.mjs +8 -2
- package/fesm2015/ngx-sfc-common.mjs.map +1 -1
- package/fesm2020/ngx-sfc-common.mjs +8 -2
- package/fesm2020/ngx-sfc-common.mjs.map +1 -1
- package/lib/components/tag/tag.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import { Component, EventEmitter, HostListener, Input, Output } from '@angular/core';
|
|
1
|
+
import { Component, EventEmitter, HostBinding, HostListener, Input, Output } from '@angular/core';
|
|
2
2
|
import { CommonConstants } from '../../constants';
|
|
3
|
+
import { UIClass } from '../../enums';
|
|
3
4
|
import { TagConstants } from './tag.constants';
|
|
4
5
|
import * as i0 from "@angular/core";
|
|
5
6
|
import * as i1 from "@angular/common";
|
|
@@ -12,6 +13,7 @@ export class TagComponent {
|
|
|
12
13
|
label: TagConstants.DEFAULT_LABEL
|
|
13
14
|
};
|
|
14
15
|
this.removeAction = new EventEmitter();
|
|
16
|
+
this.disabled = false;
|
|
15
17
|
}
|
|
16
18
|
_onClick() { if (this.model.click)
|
|
17
19
|
this.model.click(this.model); }
|
|
@@ -20,17 +22,22 @@ export class TagComponent {
|
|
|
20
22
|
}
|
|
21
23
|
}
|
|
22
24
|
TagComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
-
TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TagComponent, selector: "sfc-tag", inputs: { model: "model" }, outputs: { removeAction: "remove" }, host: { listeners: { "click": "_onClick()" } }, ngImport: i0, template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CloseComponent, selector: "sfc-close" }, { kind: "component", type: i3.IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
|
|
25
|
+
TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TagComponent, selector: "sfc-tag", inputs: { model: "model", disabled: "disabled" }, outputs: { removeAction: "remove" }, host: { listeners: { "click": "_onClick()" }, properties: { "class.disabled": "this.disabled" } }, ngImport: i0, template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{cursor:default;-webkit-user-select:none;user-select:none;display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}:host.disabled .container .content{pointer-events:none;transition:color .5s ease;transition:background-color .5s ease}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content{color:#e9e9e9}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{background-color:#f6f6f6}:host-context(.sfc-dark-theme) :host.disabled .container .content{background-color:#656d78}:host.disabled .container .content sfc-close{transition:color .5s ease}:host.disabled .container .content sfc-close,:host-context(.sfc-default-theme) :host.disabled .container .content sfc-close{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content sfc-close{color:#656d78}:host.disabled:hover .container .content{background-color:initial}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.CloseComponent, selector: "sfc-close" }, { kind: "component", type: i3.IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
|
|
24
26
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TagComponent, decorators: [{
|
|
25
27
|
type: Component,
|
|
26
|
-
args: [{ selector: 'sfc-tag', template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}\n"] }]
|
|
28
|
+
args: [{ selector: 'sfc-tag', template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{cursor:default;-webkit-user-select:none;user-select:none;display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}:host.disabled .container .content{pointer-events:none;transition:color .5s ease;transition:background-color .5s ease}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content{color:#e9e9e9}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{background-color:#f6f6f6}:host-context(.sfc-dark-theme) :host.disabled .container .content{background-color:#656d78}:host.disabled .container .content sfc-close{transition:color .5s ease}:host.disabled .container .content sfc-close,:host-context(.sfc-default-theme) :host.disabled .container .content sfc-close{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content sfc-close{color:#656d78}:host.disabled:hover .container .content{background-color:initial}\n"] }]
|
|
27
29
|
}], propDecorators: { model: [{
|
|
28
30
|
type: Input
|
|
29
31
|
}], removeAction: [{
|
|
30
32
|
type: Output,
|
|
31
33
|
args: ['remove']
|
|
34
|
+
}], disabled: [{
|
|
35
|
+
type: Input
|
|
36
|
+
}, {
|
|
37
|
+
type: HostBinding,
|
|
38
|
+
args: [`class.${UIClass.Disabled}`]
|
|
32
39
|
}], _onClick: [{
|
|
33
40
|
type: HostListener,
|
|
34
41
|
args: ['click']
|
|
35
42
|
}] } });
|
|
36
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
43
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZmMtY29tbW9uL3NyYy9saWIvY29tcG9uZW50cy90YWcvdGFnLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zZmMtY29tbW9uL3NyYy9saWIvY29tcG9uZW50cy90YWcvdGFnLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLFdBQVcsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDbEQsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUN0QyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7Ozs7O0FBUS9DLE1BQU0sT0FBTyxZQUFZO0lBTHpCO1FBUUUsVUFBSyxHQUFjO1lBQ2pCLEdBQUcsRUFBRSxlQUFlLENBQUMsaUJBQWlCO1lBQ3RDLEtBQUssRUFBRSxZQUFZLENBQUMsYUFBYTtTQUNsQyxDQUFDO1FBR0YsaUJBQVksR0FBRyxJQUFJLFlBQVksRUFBYSxDQUFDO1FBSTdDLGFBQVEsR0FBWSxLQUFLLENBQUM7S0FRM0I7SUFMUyxRQUFRLEtBQVcsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUs7UUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBRXpFLFFBQVE7UUFDYixJQUFJLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDckMsQ0FBQzs7eUdBcEJVLFlBQVk7NkZBQVosWUFBWSx5T0NYekIscVNBTU07MkZES08sWUFBWTtrQkFMeEIsU0FBUzsrQkFDRSxTQUFTOzhCQU9uQixLQUFLO3NCQURKLEtBQUs7Z0JBT04sWUFBWTtzQkFEWCxNQUFNO3VCQUFDLFFBQVE7Z0JBS2hCLFFBQVE7c0JBRlAsS0FBSzs7c0JBQ0wsV0FBVzt1QkFBQyxTQUFTLE9BQU8sQ0FBQyxRQUFRLEVBQUU7Z0JBSWhDLFFBQVE7c0JBRGYsWUFBWTt1QkFBQyxPQUFPIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIEhvc3RCaW5kaW5nLCBIb3N0TGlzdGVuZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uQ29uc3RhbnRzIH0gZnJvbSAnLi4vLi4vY29uc3RhbnRzJztcclxuaW1wb3J0IHsgVUlDbGFzcyB9IGZyb20gJy4uLy4uL2VudW1zJztcclxuaW1wb3J0IHsgVGFnQ29uc3RhbnRzIH0gZnJvbSAnLi90YWcuY29uc3RhbnRzJztcclxuaW1wb3J0IHsgSVRhZ01vZGVsIH0gZnJvbSAnLi90YWcubW9kZWwnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzZmMtdGFnJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vdGFnLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi90YWcuY29tcG9uZW50LnNjc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgVGFnQ29tcG9uZW50IHtcclxuXHJcbiAgQElucHV0KClcclxuICBtb2RlbDogSVRhZ01vZGVsID0ge1xyXG4gICAga2V5OiBDb21tb25Db25zdGFudHMuREVGQVVMVF9LRVlfVkFMVUUsXHJcbiAgICBsYWJlbDogVGFnQ29uc3RhbnRzLkRFRkFVTFRfTEFCRUxcclxuICB9O1xyXG5cclxuICBAT3V0cHV0KCdyZW1vdmUnKVxyXG4gIHJlbW92ZUFjdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8SVRhZ01vZGVsPigpO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIEBIb3N0QmluZGluZyhgY2xhc3MuJHtVSUNsYXNzLkRpc2FibGVkfWApXHJcbiAgZGlzYWJsZWQ6IGJvb2xlYW4gPSBmYWxzZTtcclxuXHJcbiAgQEhvc3RMaXN0ZW5lcignY2xpY2snKVxyXG4gIHByaXZhdGUgX29uQ2xpY2soKTogdm9pZCB7IGlmICh0aGlzLm1vZGVsLmNsaWNrKSB0aGlzLm1vZGVsLmNsaWNrKHRoaXMubW9kZWwpOyB9XHJcblxyXG4gIHB1YmxpYyBvblJlbW92ZSgpOiB2b2lkIHtcclxuICAgIHRoaXMucmVtb3ZlQWN0aW9uLmVtaXQodGhpcy5tb2RlbCk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJjb250YWluZXJcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJjb250ZW50XCI+XHJcbiAgICAgICAgPHNmYy1pY29uIFtpY29uXT1cIm1vZGVsLmljb25cIiBbaW1hZ2VTcmNdPVwibW9kZWwuaW1hZ2VTcmNcIj48L3NmYy1pY29uPlxyXG4gICAgICAgIDxzcGFuPnt7bW9kZWwubGFiZWx9fTwvc3Bhbj5cclxuICAgICAgICA8c2ZjLWNsb3NlICpuZ0lmPVwibW9kZWwuYWxsb3dSZW1vdmVcIiAoY2xpY2spPVwib25SZW1vdmUoKVwiPjwvc2ZjLWNsb3NlPlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -3547,6 +3547,7 @@ class TagComponent {
|
|
|
3547
3547
|
label: TagConstants.DEFAULT_LABEL
|
|
3548
3548
|
};
|
|
3549
3549
|
this.removeAction = new EventEmitter();
|
|
3550
|
+
this.disabled = false;
|
|
3550
3551
|
}
|
|
3551
3552
|
_onClick() {
|
|
3552
3553
|
if (this.model.click)
|
|
@@ -3557,15 +3558,20 @@ class TagComponent {
|
|
|
3557
3558
|
}
|
|
3558
3559
|
}
|
|
3559
3560
|
TagComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3560
|
-
TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TagComponent, selector: "sfc-tag", inputs: { model: "model" }, outputs: { removeAction: "remove" }, host: { listeners: { "click": "_onClick()" } }, ngImport: i0, template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CloseComponent, selector: "sfc-close" }, { kind: "component", type: IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
|
|
3561
|
+
TagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TagComponent, selector: "sfc-tag", inputs: { model: "model", disabled: "disabled" }, outputs: { removeAction: "remove" }, host: { listeners: { "click": "_onClick()" }, properties: { "class.disabled": "this.disabled" } }, ngImport: i0, template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{cursor:default;-webkit-user-select:none;user-select:none;display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}:host.disabled .container .content{pointer-events:none;transition:color .5s ease;transition:background-color .5s ease}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content{color:#e9e9e9}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{background-color:#f6f6f6}:host-context(.sfc-dark-theme) :host.disabled .container .content{background-color:#656d78}:host.disabled .container .content sfc-close{transition:color .5s ease}:host.disabled .container .content sfc-close,:host-context(.sfc-default-theme) :host.disabled .container .content sfc-close{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content sfc-close{color:#656d78}:host.disabled:hover .container .content{background-color:initial}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CloseComponent, selector: "sfc-close" }, { kind: "component", type: IconComponent, selector: "sfc-icon", inputs: ["icon", "imageSrc"] }] });
|
|
3561
3562
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TagComponent, decorators: [{
|
|
3562
3563
|
type: Component,
|
|
3563
|
-
args: [{ selector: 'sfc-tag', template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}\n"] }]
|
|
3564
|
+
args: [{ selector: 'sfc-tag', template: "<div class=\"container\">\r\n <div class=\"content\">\r\n <sfc-icon [icon]=\"model.icon\" [imageSrc]=\"model.imageSrc\"></sfc-icon>\r\n <span>{{model.label}}</span>\r\n <sfc-close *ngIf=\"model.allowRemove\" (click)=\"onRemove()\"></sfc-close>\r\n </div>\r\n</div>", styles: [":host{cursor:default;-webkit-user-select:none;user-select:none;display:inline-block}:host .container .content{display:flex;align-items:center;text-align:center;padding:.3em .8em;display:inline-flex;border-radius:1em;font-weight:700;-webkit-user-select:none;user-select:none;transition:color .5s ease;transition:background-color .5s ease;transition:color .5s ease,background-color .5s ease,border-color .5s ease;border:.125em solid transparent}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{color:#fff}:host-context(.sfc-dark-theme) :host .container .content{color:#545e61}:host .container .content,:host-context(.sfc-default-theme) :host .container .content{background-color:#545e61}:host-context(.sfc-dark-theme) :host .container .content{background-color:#fff}:host .container .content sfc-icon{margin-right:.2em}:host .container .content sfc-icon ::ng-deep .container img{max-width:1em;max-height:1em}:host .container .content sfc-close{margin-left:.6em;color:#ed5565;font-size:.8em}:host:hover .container .content{background-color:#ffce54;color:#fff}:host.disabled .container .content{pointer-events:none;transition:color .5s ease;transition:background-color .5s ease}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content{color:#e9e9e9}:host.disabled .container .content,:host-context(.sfc-default-theme) :host.disabled .container .content{background-color:#f6f6f6}:host-context(.sfc-dark-theme) :host.disabled .container .content{background-color:#656d78}:host.disabled .container .content sfc-close{transition:color .5s ease}:host.disabled .container .content sfc-close,:host-context(.sfc-default-theme) :host.disabled .container .content sfc-close{color:#bdbdbd}:host-context(.sfc-dark-theme) :host.disabled .container .content sfc-close{color:#656d78}:host.disabled:hover .container .content{background-color:initial}\n"] }]
|
|
3564
3565
|
}], propDecorators: { model: [{
|
|
3565
3566
|
type: Input
|
|
3566
3567
|
}], removeAction: [{
|
|
3567
3568
|
type: Output,
|
|
3568
3569
|
args: ['remove']
|
|
3570
|
+
}], disabled: [{
|
|
3571
|
+
type: Input
|
|
3572
|
+
}, {
|
|
3573
|
+
type: HostBinding,
|
|
3574
|
+
args: [`class.${UIClass.Disabled}`]
|
|
3569
3575
|
}], _onClick: [{
|
|
3570
3576
|
type: HostListener,
|
|
3571
3577
|
args: ['click']
|