@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.
@@ -235,8 +235,15 @@
235
235
  BadgeColors["Gray"] = "gray";
236
236
  })(exports.BadgeColors || (exports.BadgeColors = {}));
237
237
 
238
+ var BadgeTypes;
239
+ (function (BadgeTypes) {
240
+ BadgeTypes["Pill"] = "pill";
241
+ BadgeTypes["Chip"] = "chip";
242
+ })(BadgeTypes || (BadgeTypes = {}));
243
+
238
244
  var BadgeComponent = /** @class */ (function () {
239
245
  function BadgeComponent() {
246
+ this.type = BadgeTypes.Pill;
240
247
  this.color = exports.BadgeColors.Blue;
241
248
  this.selectable = false;
242
249
  this.iconPosition = "left";
@@ -245,9 +252,15 @@
245
252
  BadgeComponent.prototype.onClick = function () {
246
253
  this.selected.emit(this.text);
247
254
  };
255
+ __decorate([
256
+ core.Input()
257
+ ], BadgeComponent.prototype, "type", void 0);
248
258
  __decorate([
249
259
  core.Input()
250
260
  ], BadgeComponent.prototype, "color", void 0);
261
+ __decorate([
262
+ core.Input()
263
+ ], BadgeComponent.prototype, "title", void 0);
251
264
  __decorate([
252
265
  core.Input()
253
266
  ], BadgeComponent.prototype, "text", void 0);
@@ -269,8 +282,8 @@
269
282
  BadgeComponent = __decorate([
270
283
  core.Component({
271
284
  selector: "s-badge",
272
- template: "<span\n class=\"badge\"\n [ngClass]=\"{ \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 <p class=\"badge-text\">{{ text }}</p>\n</span>",
273
- styles: [".badge{-ms-flex-align:center;align-items:center;border-radius:12px;display:-ms-inline-flexbox;display:inline-flex;height:1.25rem;-ms-flex-pack:center;justify-content:center;min-width:20px;padding:0 .5rem}.badge .badge-text{color:#333;font-family:\"Open Sans\",sans-serif;font-size:.75rem;font-weight:400;line-height:150%}.badge .badge-icon{color:#333;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}"]
285
+ 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>",
286
+ 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}"]
274
287
  })
275
288
  ], BadgeComponent);
276
289
  return BadgeComponent;
@@ -1545,6 +1558,7 @@
1545
1558
  this.offsetTop = 0;
1546
1559
  this.ordination = exports.Ordination.NO;
1547
1560
  this.selected = new core.EventEmitter();
1561
+ this.onBlurEvent = new core.EventEmitter();
1548
1562
  this.tabindex = 0;
1549
1563
  this._filterCountries = function (value) {
1550
1564
  if (!value) {
@@ -1777,6 +1791,9 @@
1777
1791
  __decorate([
1778
1792
  core.Output()
1779
1793
  ], CountryPhonePickerComponent.prototype, "selected", void 0);
1794
+ __decorate([
1795
+ core.Output()
1796
+ ], CountryPhonePickerComponent.prototype, "onBlurEvent", void 0);
1780
1797
  __decorate([
1781
1798
  core.ViewChild("phoneInput", { static: true })
1782
1799
  ], CountryPhonePickerComponent.prototype, "phoneInput", void 0);
@@ -1792,7 +1809,7 @@
1792
1809
  CountryPhonePickerComponent = CountryPhonePickerComponent_1 = __decorate([
1793
1810
  core.Component({
1794
1811
  selector: "s-country-phone-picker",
1795
- 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>",
1812
+ 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>",
1796
1813
  providers: [{
1797
1814
  provide: forms.NG_VALUE_ACCESSOR,
1798
1815
  useExisting: core.forwardRef(function () { return CountryPhonePickerComponent_1; }),