@seniorsistemas/angular-components 16.10.7 → 16.10.9
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/bundles/seniorsistemas-angular-components.umd.js +20 -3
- package/bundles/seniorsistemas-angular-components.umd.js.map +1 -1
- package/bundles/seniorsistemas-angular-components.umd.min.js +1 -1
- package/bundles/seniorsistemas-angular-components.umd.min.js.map +1 -1
- package/components/badge/badge.component.d.ts +4 -1
- package/components/badge/models/badge-types.d.ts +4 -0
- package/components/badge/models/index.d.ts +1 -0
- package/components/country-phone-picker/country-phone-picker.component.d.ts +1 -0
- package/esm2015/components/badge/badge.component.js +12 -4
- package/esm2015/components/badge/models/badge-types.js +6 -0
- package/esm2015/components/badge/models/index.js +2 -1
- package/esm2015/components/country-phone-picker/country-phone-picker.component.js +6 -2
- package/esm5/components/badge/badge.component.js +12 -4
- package/esm5/components/badge/models/badge-types.js +6 -0
- package/esm5/components/badge/models/index.js +2 -1
- package/esm5/components/country-phone-picker/country-phone-picker.component.js +6 -2
- package/fesm2015/seniorsistemas-angular-components.js +20 -3
- package/fesm2015/seniorsistemas-angular-components.js.map +1 -1
- package/fesm5/seniorsistemas-angular-components.js +20 -3
- package/fesm5/seniorsistemas-angular-components.js.map +1 -1
- package/package.json +1 -1
- package/seniorsistemas-angular-components.metadata.json +1 -1
|
@@ -67,8 +67,15 @@ var BadgeColors;
|
|
|
67
67
|
BadgeColors["Gray"] = "gray";
|
|
68
68
|
})(BadgeColors || (BadgeColors = {}));
|
|
69
69
|
|
|
70
|
+
var BadgeTypes;
|
|
71
|
+
(function (BadgeTypes) {
|
|
72
|
+
BadgeTypes["Pill"] = "pill";
|
|
73
|
+
BadgeTypes["Chip"] = "chip";
|
|
74
|
+
})(BadgeTypes || (BadgeTypes = {}));
|
|
75
|
+
|
|
70
76
|
var BadgeComponent = /** @class */ (function () {
|
|
71
77
|
function BadgeComponent() {
|
|
78
|
+
this.type = BadgeTypes.Pill;
|
|
72
79
|
this.color = BadgeColors.Blue;
|
|
73
80
|
this.selectable = false;
|
|
74
81
|
this.iconPosition = "left";
|
|
@@ -77,9 +84,15 @@ var BadgeComponent = /** @class */ (function () {
|
|
|
77
84
|
BadgeComponent.prototype.onClick = function () {
|
|
78
85
|
this.selected.emit(this.text);
|
|
79
86
|
};
|
|
87
|
+
__decorate([
|
|
88
|
+
Input()
|
|
89
|
+
], BadgeComponent.prototype, "type", void 0);
|
|
80
90
|
__decorate([
|
|
81
91
|
Input()
|
|
82
92
|
], BadgeComponent.prototype, "color", void 0);
|
|
93
|
+
__decorate([
|
|
94
|
+
Input()
|
|
95
|
+
], BadgeComponent.prototype, "title", void 0);
|
|
83
96
|
__decorate([
|
|
84
97
|
Input()
|
|
85
98
|
], BadgeComponent.prototype, "text", void 0);
|
|
@@ -101,8 +114,8 @@ var BadgeComponent = /** @class */ (function () {
|
|
|
101
114
|
BadgeComponent = __decorate([
|
|
102
115
|
Component({
|
|
103
116
|
selector: "s-badge",
|
|
104
|
-
template: "<span\n class=\"badge\"\n [ngClass]=\"{ \n 'badge--red': color
|
|
105
|
-
styles: [".badge{-ms-flex-align:center;align-items:center;
|
|
117
|
+
template: "<span\n class=\"badge\"\n [ngClass]=\"{\n 'badge--pill': type === 'pill',\n 'badge--chip': type === 'chip', \n 'badge--red': color === 'red',\n 'badge--orange': color === 'orange',\n 'badge--yellow': color === 'yellow',\n 'badge--blue': color === 'blue',\n 'badge--green': color === 'green',\n 'badge--gray': color === 'gray',\n 'badge--selectable': selectable\n }\">\n <span\n *ngIf=\"iconClass\"\n [class]=\"'badge-icon ' + iconClass\"\n [ngClass]=\"{\n 'badge-icon--left': iconPosition === 'left' && text,\n 'badge-icon--right': iconPosition === 'right' && text\n }\">\n </span>\n <span *ngIf=\"title\" class=\"badge-title\">{{ title }}:</span>\n <span class=\"badge-text\">{{ text }}</span>\n</span>",
|
|
118
|
+
styles: [".badge{-ms-flex-align:center;align-items:center;display:-ms-inline-flexbox;display:inline-flex;height:1.25rem;-ms-flex-pack:center;justify-content:center;min-width:20px;padding:0 .5rem}.badge--chip{border-radius:4px}.badge--pill{border-radius:12px}.badge .badge-title{color:#212533;font-family:\"Open Sans\",sans-serif;font-size:12px;font-weight:700;line-height:150%;margin-right:.125rem}.badge .badge-text{color:#212533;font-family:\"Open Sans\",sans-serif;font-size:.75rem;font-weight:400;line-height:150%}.badge .badge-icon{color:#212533;font-size:10px}.badge .badge-icon--left{margin-right:8px}.badge .badge-icon--right{margin-left:8px;-ms-flex-order:2;order:2}.badge--red{background-color:#fcd2d2;border:1px solid #c13018}.badge--orange{background-color:#fce3ba;border:1px solid #f8931f}.badge--yellow{background-color:#fef4e3;border:1px solid #fcbf10}.badge--blue{background-color:#d5e8ec;border:1px solid #428bca}.badge--green{background-color:#e6ffb3;border:1px solid #0c9348}.badge--gray{background-color:#e5eaea;border:1px solid #697882}.badge--selectable{cursor:pointer;-webkit-user-select:none;-ms-user-select:none;user-select:none}"]
|
|
106
119
|
})
|
|
107
120
|
], BadgeComponent);
|
|
108
121
|
return BadgeComponent;
|
|
@@ -1377,6 +1390,7 @@ var CountryPhonePickerComponent = /** @class */ (function () {
|
|
|
1377
1390
|
this.offsetTop = 0;
|
|
1378
1391
|
this.ordination = Ordination.NO;
|
|
1379
1392
|
this.selected = new EventEmitter();
|
|
1393
|
+
this.onBlurEvent = new EventEmitter();
|
|
1380
1394
|
this.tabindex = 0;
|
|
1381
1395
|
this._filterCountries = function (value) {
|
|
1382
1396
|
if (!value) {
|
|
@@ -1609,6 +1623,9 @@ var CountryPhonePickerComponent = /** @class */ (function () {
|
|
|
1609
1623
|
__decorate([
|
|
1610
1624
|
Output()
|
|
1611
1625
|
], CountryPhonePickerComponent.prototype, "selected", void 0);
|
|
1626
|
+
__decorate([
|
|
1627
|
+
Output()
|
|
1628
|
+
], CountryPhonePickerComponent.prototype, "onBlurEvent", void 0);
|
|
1612
1629
|
__decorate([
|
|
1613
1630
|
ViewChild("phoneInput", { static: true })
|
|
1614
1631
|
], CountryPhonePickerComponent.prototype, "phoneInput", void 0);
|
|
@@ -1624,7 +1641,7 @@ var CountryPhonePickerComponent = /** @class */ (function () {
|
|
|
1624
1641
|
CountryPhonePickerComponent = CountryPhonePickerComponent_1 = __decorate([
|
|
1625
1642
|
Component({
|
|
1626
1643
|
selector: "s-country-phone-picker",
|
|
1627
|
-
template: "<div class=\"country-phone-picker\">\n <div class=\"phone-input\">\n <div class=\"drop\" (click)=\"open = !open\">\n <span class=\"drop-flag\" [ngClass]=\"'fi fi-' + selectedItem.id\">\n </span>\n <span class=\"drop-icon fas fa-caret-down\"></span>\n </div>\n <p class=\"phone-ddi\">{{ selectedItem.ddi }}</p>\n <input\n #phoneInput\n type=\"tel\"\n autofocus\n [mask]=\"mask\" \n [placeholder]=\"getPlaceholder()\"\n [formControl]=\"phone\"\n (focus)=\"onPhoneInputFocus()\" />\n </div>\n <div *ngIf=\"open\" class=\"dropdown\">\n <div class=\"search\">\n <input\n class=\"search-field\"\n type=\"text\"\n [formControl]=\"filter\">\n <span class=\"search-icon fas fa-search\"></span>\n <span\n class=\"search-clear fa fa-times\"\n (click)=\"onCleanFilter()\"></span>\n </div>\n <ul class=\"select-list\">\n <li\n *ngFor=\"let country of filteredCountriesList; let i = index;\"\n class=\"select-option\"\n [ngClass]=\"{ 'select-option--focused': i == currentItemIndex }\"\n (click)=\"onSelectItem(country)\">\n <span\n class=\"select-option__flag\"\n [ngClass]=\"'fi fi-' + country.id\">\n </span>\n <span class=\"select-option__name\">\n {{ \"platform.angular_components.country_name_\" + country.id | translate }}\n </span>\n <span class=\"select-option__ddi\">\n {{ country.ddi }}\n </span>\n </li>\n </ul>\n </div>\n</div>",
|
|
1644
|
+
template: "<div class=\"country-phone-picker\">\n <div class=\"phone-input\">\n <div class=\"drop\" (click)=\"open = !open\">\n <span class=\"drop-flag\" [ngClass]=\"'fi fi-' + selectedItem.id\">\n </span>\n <span class=\"drop-icon fas fa-caret-down\"></span>\n </div>\n <p class=\"phone-ddi\">{{ selectedItem.ddi }}</p>\n <input\n #phoneInput\n type=\"tel\"\n autofocus\n [mask]=\"mask\" \n [placeholder]=\"getPlaceholder()\"\n [formControl]=\"phone\"\n (focus)=\"onPhoneInputFocus()\" \n (blur)=\"onBlurEvent.emit(value)\"\n />\n </div>\n <div *ngIf=\"open\" class=\"dropdown\">\n <div class=\"search\">\n <input\n class=\"search-field\"\n type=\"text\"\n [formControl]=\"filter\">\n <span class=\"search-icon fas fa-search\"></span>\n <span\n class=\"search-clear fa fa-times\"\n (click)=\"onCleanFilter()\"></span>\n </div>\n <ul class=\"select-list\">\n <li\n *ngFor=\"let country of filteredCountriesList; let i = index;\"\n class=\"select-option\"\n [ngClass]=\"{ 'select-option--focused': i == currentItemIndex }\"\n (click)=\"onSelectItem(country)\">\n <span\n class=\"select-option__flag\"\n [ngClass]=\"'fi fi-' + country.id\">\n </span>\n <span class=\"select-option__name\">\n {{ \"platform.angular_components.country_name_\" + country.id | translate }}\n </span>\n <span class=\"select-option__ddi\">\n {{ country.ddi }}\n </span>\n </li>\n </ul>\n </div>\n</div>",
|
|
1628
1645
|
providers: [{
|
|
1629
1646
|
provide: NG_VALUE_ACCESSOR,
|
|
1630
1647
|
useExisting: forwardRef(function () { return CountryPhonePickerComponent_1; }),
|