@taiga-ui/kit 2.80.0 → 2.81.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.
@@ -334,6 +334,7 @@
334
334
  _a[i18n.TuiCountryIsoCode.BH] = { mask: "+973####-####", name: "\u0411\u0430\u0445\u0440\u0435\u0439\u043D" },
335
335
  _a[i18n.TuiCountryIsoCode.BI] = { mask: "+257##-##-####", name: "\u0411\u0443\u0440\u0443\u043D\u0434\u0438" },
336
336
  _a[i18n.TuiCountryIsoCode.BJ] = { mask: "+229##-##-####", name: "\u0411\u0435\u043D\u0438\u043D" },
337
+ _a[i18n.TuiCountryIsoCode.BL] = { mask: "+590 ## ## ## ## ##", name: "\u0421\u0435\u043D-\u0411\u0430\u0440\u0442\u0435\u043B\u044C\u043C\u0438" },
337
338
  _a[i18n.TuiCountryIsoCode.BM] = { mask: "+1(441) ###-####", name: "\u0411\u0435\u0440\u043C\u0443\u0434\u0441\u043A\u0438\u0435 \u043E\u0441\u0442\u0440\u043E\u0432\u0430" },
338
339
  _a[i18n.TuiCountryIsoCode.BN] = { mask: "+673###-####", name: "\u0411\u0440\u0443\u043D\u0435\u0439-\u0414\u0430\u0440\u0443\u0441\u0441\u0430\u043B\u0430\u043C" },
339
340
  _a[i18n.TuiCountryIsoCode.BO] = { mask: "+591#-###-####", name: "\u0411\u043E\u043B\u0438\u0432\u0438\u044F" },
@@ -390,11 +391,13 @@
390
391
  _a[i18n.TuiCountryIsoCode.GB] = { mask: "+44##-####-####", name: "\u0412\u0435\u043B\u0438\u043A\u043E\u0431\u0440\u0438\u0442\u0430\u043D\u0438\u044F" },
391
392
  _a[i18n.TuiCountryIsoCode.GD] = { mask: "+1(473) ###-####", name: "\u0413\u0440\u0435\u043D\u0430\u0434\u0430" },
392
393
  _a[i18n.TuiCountryIsoCode.GE] = { mask: "+995(###) ###-###", name: "\u0413\u0440\u0443\u0437\u0438\u044F" },
394
+ _a[i18n.TuiCountryIsoCode.GF] = { mask: "+594 ## ## ## ## ##", name: "\u0413\u0430\u0439\u0430\u043D\u0430" },
393
395
  _a[i18n.TuiCountryIsoCode.GH] = { mask: "+233(###) ###-###", name: "\u0413\u0430\u043D\u0430" },
394
396
  _a[i18n.TuiCountryIsoCode.GI] = { mask: "+350###-#####", name: "\u0413\u0438\u0431\u0440\u0430\u043B\u0442\u0430\u0440" },
395
397
  _a[i18n.TuiCountryIsoCode.GL] = { mask: "+299##-##-##", name: "\u0413\u0440\u0435\u043D\u043B\u0430\u043D\u0434\u0438\u044F" },
396
398
  _a[i18n.TuiCountryIsoCode.GM] = { mask: "+220(###) ##-##", name: "\u0413\u0430\u043C\u0431\u0438\u044F" },
397
399
  _a[i18n.TuiCountryIsoCode.GN] = { mask: "+224##-###-###", name: "\u0413\u0432\u0438\u043D\u0435\u044F" },
400
+ _a[i18n.TuiCountryIsoCode.GP] = { mask: "+590 ## ## ## ## ##", name: "\u0413\u0432\u0430\u0434\u0435\u043B\u0443\u043F\u0430" },
398
401
  _a[i18n.TuiCountryIsoCode.GQ] = { mask: "+240##-###-####", name: "\u042D\u043A\u0432\u0430\u0442\u043E\u0440\u0438\u0430\u043B\u044C\u043D\u0430\u044F \u0413\u0432\u0438\u043D\u0435\u044F" },
399
402
  _a[i18n.TuiCountryIsoCode.GR] = { mask: "+30(###) ###-####", name: "\u0413\u0440\u0435\u0446\u0438\u044F" },
400
403
  _a[i18n.TuiCountryIsoCode.GT] = { mask: "+502#-###-####", name: "\u0413\u0432\u0430\u0442\u0435\u043C\u0430\u043B\u0430" },
@@ -441,12 +444,14 @@
441
444
  _a[i18n.TuiCountryIsoCode.MC] = { mask: "+377###-###-###", name: "\u041C\u043E\u043D\u0430\u043A\u043E" },
442
445
  _a[i18n.TuiCountryIsoCode.MD] = { mask: "+373####-####", name: "\u041C\u043E\u043B\u0434\u043E\u0432\u0430" },
443
446
  _a[i18n.TuiCountryIsoCode.ME] = { mask: "+382##-###-###", name: "\u0427\u0435\u0440\u043D\u043E\u0433\u043E\u0440\u0438\u044F" },
447
+ _a[i18n.TuiCountryIsoCode.MF] = { mask: "+590 ## ## ## ## ##", name: "\u0421\u0435\u043D-\u041C\u0430\u0440\u0442\u0435\u043D" },
444
448
  _a[i18n.TuiCountryIsoCode.MG] = { mask: "+261##-##-#####", name: "\u041C\u0430\u0434\u0430\u0433\u0430\u0441\u043A\u0430\u0440" },
445
449
  _a[i18n.TuiCountryIsoCode.MK] = { mask: "+389##-###-###", name: "\u0420\u0435\u0441\u043F. \u041C\u0430\u043A\u0435\u0434\u043E\u043D\u0438\u044F" },
446
450
  _a[i18n.TuiCountryIsoCode.ML] = { mask: "+223##-##-####", name: "\u041C\u0430\u043B\u0438" },
447
451
  _a[i18n.TuiCountryIsoCode.MM] = { mask: "+95##-###-###", name: "\u0411\u0438\u0440\u043C\u0430 (\u041C\u044C\u044F\u043D\u043C\u0430)" },
448
452
  _a[i18n.TuiCountryIsoCode.MN] = { mask: "+976##-##-####", name: "\u041C\u043E\u043D\u0433\u043E\u043B\u0438\u044F" },
449
453
  _a[i18n.TuiCountryIsoCode.MO] = { mask: "+853####-####", name: "\u041C\u0430\u043A\u0430\u043E" },
454
+ _a[i18n.TuiCountryIsoCode.MQ] = { mask: "+596 ## ## ## ## ##", name: "\u041C\u0430\u0440\u0442\u0438\u043D\u0438\u043A\u0430" },
450
455
  _a[i18n.TuiCountryIsoCode.MR] = { mask: "+222##-##-####", name: "\u041C\u0430\u0432\u0440\u0438\u0442\u0430\u043D\u0438\u044F" },
451
456
  _a[i18n.TuiCountryIsoCode.MS] = { mask: "+1(664) ###-####", name: "\u041C\u043E\u043D\u0442\u0441\u0435\u0440\u0440\u0430\u0442" },
452
457
  _a[i18n.TuiCountryIsoCode.MT] = { mask: "+356####-####", name: "\u041C\u0430\u043B\u044C\u0442\u0430" },
@@ -457,6 +462,7 @@
457
462
  _a[i18n.TuiCountryIsoCode.MY] = { mask: "+60(###) ###-###", name: "\u041C\u0430\u043B\u0430\u0439\u0437\u0438\u044F" },
458
463
  _a[i18n.TuiCountryIsoCode.MZ] = { mask: "+258##-###-###", name: "\u041C\u043E\u0437\u0430\u043C\u0431\u0438\u043A" },
459
464
  _a[i18n.TuiCountryIsoCode.NA] = { mask: "+264##-###-####", name: "\u041D\u0430\u043C\u0438\u0431\u0438\u044F" },
465
+ _a[i18n.TuiCountryIsoCode.NC] = { mask: "+687 ### ###", name: "\u041A\u0430\u043B\u0435\u0434\u043E\u043D\u0438\u044F" },
460
466
  _a[i18n.TuiCountryIsoCode.NE] = { mask: "+227##-##-####", name: "\u041D\u0438\u0433\u0435\u0440" },
461
467
  _a[i18n.TuiCountryIsoCode.NG] = { mask: "+234(###) ###-####", name: "\u041D\u0438\u0433\u0435\u0440\u0438\u044F" },
462
468
  _a[i18n.TuiCountryIsoCode.NI] = { mask: "+505####-####", name: "\u041D\u0438\u043A\u0430\u0440\u0430\u0433\u0443\u0430" },
@@ -479,6 +485,7 @@
479
485
  _a[i18n.TuiCountryIsoCode.PW] = { mask: "+680###-####", name: "\u041F\u0430\u043B\u0430\u0443" },
480
486
  _a[i18n.TuiCountryIsoCode.PY] = { mask: "+595(###) ###-###", name: "\u041F\u0430\u0440\u0430\u0433\u0432\u0430\u0439" },
481
487
  _a[i18n.TuiCountryIsoCode.QA] = { mask: "+974####-####", name: "\u041A\u0430\u0442\u0430\u0440" },
488
+ _a[i18n.TuiCountryIsoCode.RE] = { mask: "+262 ## ## ## ## ##", name: "\u0420\u0435\u044E\u043D\u044C\u043E\u043D" },
482
489
  _a[i18n.TuiCountryIsoCode.RO] = { mask: "+40##-###-####", name: "\u0420\u0443\u043C\u044B\u043D\u0438\u044F" },
483
490
  _a[i18n.TuiCountryIsoCode.RS] = { mask: "+381##-###-####", name: "\u0421\u0435\u0440\u0431\u0438\u044F" },
484
491
  _a[i18n.TuiCountryIsoCode.RU] = { mask: "+7### ###-##-##", name: "\u0420\u043E\u0441\u0441\u0438\u044F" },
@@ -534,6 +541,7 @@
534
541
  _a[i18n.TuiCountryIsoCode.WS] = { mask: "+685##-####", name: "\u0421\u0430\u043C\u043E\u0430" },
535
542
  _a[i18n.TuiCountryIsoCode.XK] = { mask: "+383##-###-###", name: "\u041A\u043E\u0441\u043E\u0432\u043E" },
536
543
  _a[i18n.TuiCountryIsoCode.YE] = { mask: "+967###-###-###", name: "\u0419\u0435\u043C\u0435\u043D " },
544
+ _a[i18n.TuiCountryIsoCode.YT] = { mask: "+262 ## ## ## ## ##", name: "\u041C\u0430\u0439\u043E\u0442\u0442\u0430" },
537
545
  _a[i18n.TuiCountryIsoCode.ZA] = { mask: "+27##-###-####", name: "\u042E\u0436\u043D\u043E-\u0410\u0444\u0440\u0438\u043A\u0430\u043D\u0441\u043A\u0430\u044F \u0420\u0435\u0441\u043F." },
538
546
  _a[i18n.TuiCountryIsoCode.ZM] = { mask: "+260##-###-####", name: "\u0417\u0430\u043C\u0431\u0438\u044F" },
539
547
  _a[i18n.TuiCountryIsoCode.ZW] = { mask: "+263#-######", name: "\u0417\u0438\u043C\u0431\u0430\u0431\u0432\u0435" },
@@ -797,12 +805,12 @@
797
805
  // @dynamic
798
806
  var TuiInputPhoneInternationalComponent = /** @class */ (function (_super) {
799
807
  __extends(TuiInputPhoneInternationalComponent, _super);
800
- function TuiInputPhoneInternationalComponent(control, changeDetectorRef, iconsPath, countriesNames$, countriesMasks, options) {
808
+ function TuiInputPhoneInternationalComponent(control, changeDetectorRef, countriesNames$, countriesMasks, options, flagPipe) {
801
809
  var _this = _super.call(this, control, changeDetectorRef) || this;
802
810
  _this.countriesNames$ = countriesNames$;
803
811
  _this.countriesMasks = countriesMasks;
804
812
  _this.options = options;
805
- _this.staticPath = null;
813
+ _this.flagPipe = flagPipe;
806
814
  _this.countries = _this.options.countries;
807
815
  _this.countryIsoCodeChange = new core.EventEmitter();
808
816
  _this.countryIsoCode = _this.options.countryIsoCode;
@@ -811,7 +819,6 @@
811
819
  _this.isoToCountryCodeMapper = function (item) {
812
820
  return _this.isoToCountryCode(item);
813
821
  };
814
- _this.staticPath = iconsPath('tuiIcon').replace('tuiIcon.svg#tuiIcon', '');
815
822
  return _this;
816
823
  }
817
824
  TuiInputPhoneInternationalComponent_1 = TuiInputPhoneInternationalComponent;
@@ -857,6 +864,10 @@
857
864
  configurable: true
858
865
  });
859
866
  Object.defineProperty(TuiInputPhoneInternationalComponent.prototype, "countryFlagPath", {
867
+ /**
868
+ * @deprecated use `<img [src]="countryIsoCode | tuiFlagPipe" />`
869
+ * TODO drop in v4.0
870
+ */
860
871
  get: function () {
861
872
  return this.getFlagPath(this.countryIsoCode);
862
873
  },
@@ -878,8 +889,12 @@
878
889
  this.updateCountryIsoCode(countryIsoCode);
879
890
  this.updateValue("" + cdk.CHAR_PLUS + value);
880
891
  };
892
+ /**
893
+ * @deprecated use `<img [src]="countryIsoCode | tuiFlagPipe" />`
894
+ * TODO drop in v4.0
895
+ */
881
896
  TuiInputPhoneInternationalComponent.prototype.getFlagPath = function (code) {
882
- return "" + this.staticPath + code + ".png";
897
+ return this.flagPipe.transform(code);
883
898
  };
884
899
  TuiInputPhoneInternationalComponent.prototype.onItemClick = function (isoCode) {
885
900
  this.open = false;
@@ -939,10 +954,10 @@
939
954
  TuiInputPhoneInternationalComponent.ctorParameters = function () { return [
940
955
  { type: forms.NgControl, decorators: [{ type: core.Optional }, { type: core.Self }, { type: core.Inject, args: [forms.NgControl,] }] },
941
956
  { type: core.ChangeDetectorRef, decorators: [{ type: core.Inject, args: [core.ChangeDetectorRef,] }] },
942
- { type: undefined, decorators: [{ type: core.Inject, args: [core$1.TUI_ICONS_PATH,] }] },
943
957
  { type: rxjs.Observable, decorators: [{ type: core.Inject, args: [tokens.TUI_COUNTRIES,] }] },
944
958
  { type: undefined, decorators: [{ type: core.Inject, args: [TUI_COUNTRIES_MASKS,] }] },
945
- { type: undefined, decorators: [{ type: core.Inject, args: [TUI_INPUT_PHONE_INTERNATIONAL_OPTIONS,] }] }
959
+ { type: undefined, decorators: [{ type: core.Inject, args: [TUI_INPUT_PHONE_INTERNATIONAL_OPTIONS,] }] },
960
+ { type: core$1.TuiFlagPipe, decorators: [{ type: core.Inject, args: [core$1.TuiFlagPipe,] }] }
946
961
  ]; };
947
962
  __decorate([
948
963
  core.ViewChild(inputPhone.TuiInputPhoneComponent)
@@ -970,7 +985,7 @@
970
985
  TuiInputPhoneInternationalComponent = TuiInputPhoneInternationalComponent_1 = __decorate([
971
986
  core.Component({
972
987
  selector: 'tui-input-phone-international',
973
- template: "<tui-hosted-dropdown\n *tuiLet=\"countriesNames$ | async as countriesNames\"\n class=\"t-hosted-dropdown\"\n [content]=\"dropdown\"\n [canOpen]=\"!readOnly\"\n [(open)]=\"open\"\n (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n <div tuiGroup>\n <tui-primitive-textfield\n tuiHostedDropdownHost\n class=\"t-country-select tui-group__auto-width-item\"\n [tuiTextfieldCustomContent]=\"countryValueContent\"\n [tuiTextfieldLabelOutside]=\"true\"\n [disabled]=\"disabled\"\n [focusable]=\"focusable\"\n [editable]=\"false\"\n [iconContent]=\"arrow\"\n [pseudoFocused]=\"open || null\"\n [readOnly]=\"readOnly\"\n [tuiHintContent]=\"null\"\n ></tui-primitive-textfield>\n <tui-input-phone\n tuiTextfieldAutocomplete=\"off\"\n class=\"t-input-phone tui-group__auto-width-item\"\n [ngModel]=\"value\"\n [disabled]=\"disabled\"\n [focusable]=\"focusable\"\n [countryCode]=\"inputPhoneCountryCode\"\n [phoneMaskAfterCountryCode]=\"phoneMaskAfterCountryCode\"\n [readOnly]=\"readOnly\"\n [pseudoInvalid]=\"computedInvalid\"\n [pseudoFocused]=\"pseudoFocused\"\n [pseudoHovered]=\"pseudoHovered\"\n (ngModelChange)=\"onModelChange($event)\"\n >\n <ng-content></ng-content>\n </tui-input-phone>\n </div>\n\n <ng-template #dropdown>\n <tui-data-list>\n <button\n *ngFor=\"let item of countries\"\n tuiOption\n (click)=\"onItemClick(item)\"\n >\n <img\n alt=\"\"\n class=\"t-country-item-flag\"\n [src]=\"getFlagPath(item)\"\n />\n <span class=\"t-country-item-name\">\n {{ countriesNames[item] }}\n </span>\n <span class=\"t-country-item-code\">\n {{ item | tuiMapper: isoToCountryCodeMapper }}\n </span>\n </button>\n </tui-data-list>\n </ng-template>\n\n <ng-template #countryValueContent>\n <img\n class=\"t-flag\"\n [alt]=\"countriesNames[countryIsoCode]\"\n [src]=\"countryFlagPath\"\n />\n </ng-template>\n</tui-hosted-dropdown>\n",
988
+ template: "<tui-hosted-dropdown\n *ngIf=\"countriesNames$ | async as countriesNames\"\n class=\"t-hosted-dropdown\"\n [content]=\"dropdown\"\n [canOpen]=\"!readOnly\"\n [(open)]=\"open\"\n (tuiActiveZoneChange)=\"onActiveZone($event)\"\n>\n <div tuiGroup>\n <tui-primitive-textfield\n tuiHostedDropdownHost\n class=\"t-country-select tui-group__auto-width-item\"\n [tuiTextfieldCustomContent]=\"countryValueContent\"\n [tuiTextfieldLabelOutside]=\"true\"\n [disabled]=\"disabled\"\n [focusable]=\"focusable\"\n [editable]=\"false\"\n [iconContent]=\"arrow\"\n [pseudoFocused]=\"open || null\"\n [readOnly]=\"readOnly\"\n [tuiHintContent]=\"null\"\n ></tui-primitive-textfield>\n <tui-input-phone\n tuiTextfieldAutocomplete=\"off\"\n class=\"t-input-phone tui-group__auto-width-item\"\n [ngModel]=\"value\"\n [disabled]=\"disabled\"\n [focusable]=\"focusable\"\n [countryCode]=\"inputPhoneCountryCode\"\n [phoneMaskAfterCountryCode]=\"phoneMaskAfterCountryCode\"\n [readOnly]=\"readOnly\"\n [pseudoInvalid]=\"computedInvalid\"\n [pseudoFocused]=\"pseudoFocused\"\n [pseudoHovered]=\"pseudoHovered\"\n (ngModelChange)=\"onModelChange($event)\"\n >\n <ng-content></ng-content>\n </tui-input-phone>\n </div>\n\n <ng-template #dropdown>\n <tui-data-list>\n <button\n *ngFor=\"let isoCode of countries\"\n tuiOption\n (click)=\"onItemClick(isoCode)\"\n >\n <img\n alt=\"\"\n class=\"t-country-item-flag\"\n [src]=\"getFlagPath(isoCode)\"\n />\n <span class=\"t-country-item-name\">\n {{ countriesNames[isoCode] }}\n </span>\n <span class=\"t-country-item-code\">\n {{ isoCode | tuiMapper: isoToCountryCodeMapper }}\n </span>\n </button>\n </tui-data-list>\n </ng-template>\n\n <ng-template #countryValueContent>\n <img\n class=\"t-flag\"\n [alt]=\"countriesNames[countryIsoCode]\"\n [src]=\"countryFlagPath\"\n />\n </ng-template>\n</tui-hosted-dropdown>\n",
974
989
  changeDetection: core.ChangeDetectionStrategy.OnPush,
975
990
  providers: [
976
991
  {
@@ -978,6 +993,8 @@
978
993
  useExisting: core.forwardRef(function () { return TuiInputPhoneInternationalComponent_1; }),
979
994
  },
980
995
  providers.FIXED_DROPDOWN_CONTROLLER_PROVIDER,
996
+ // TODO: for backward compatibility only. Drop in v4.0
997
+ core$1.TuiFlagPipe,
981
998
  ],
982
999
  styles: [":host{display:block}:host._disabled{pointer-events:none}.t-hosted-dropdown{display:block}.t-country-select{width:5.625rem}.t-country-select:not(._readonly) ::ng-deep input:not(:disabled){cursor:pointer}.t-country-select._readonly ::ng-deep input{cursor:default}.t-arrow-icon{transition-duration:var(--tui-duration,300ms);transition-timing-function:ease-in-out;display:flex;width:1.5rem;height:1.5rem;align-items:center;justify-content:center;color:var(--tui-text-03);position:relative;box-sizing:border-box;cursor:pointer;transition-property:color,transform}.t-arrow-icon:hover{color:var(--tui-text-02)}:host._disabled .t-arrow-icon,:host._readonly .t-arrow-icon{pointer-events:none}:host[data-mode=onDark] .t-arrow-icon{color:var(--tui-text-03-night)}:host[data-mode=onDark] .t-arrow-icon:hover{color:var(--tui-text-01-night)}.t-arrow-icon_open{transform:rotate(180deg)}.t-input-phone{flex:1}.t-flag{width:1.75rem;height:1.25rem;margin-left:-.5rem}.t-country-item-flag{width:1.75rem;height:1.25rem}.t-country-item-name{margin-left:.75rem;margin-right:auto}.t-country-item-code{color:var(--tui-text-02);margin-right:.25rem}"]
983
1000
  }),
@@ -985,10 +1002,10 @@
985
1002
  __param(0, core.Self()),
986
1003
  __param(0, core.Inject(forms.NgControl)),
987
1004
  __param(1, core.Inject(core.ChangeDetectorRef)),
988
- __param(2, core.Inject(core$1.TUI_ICONS_PATH)),
989
- __param(3, core.Inject(tokens.TUI_COUNTRIES)),
990
- __param(4, core.Inject(TUI_COUNTRIES_MASKS)),
991
- __param(5, core.Inject(TUI_INPUT_PHONE_INTERNATIONAL_OPTIONS))
1005
+ __param(2, core.Inject(tokens.TUI_COUNTRIES)),
1006
+ __param(3, core.Inject(TUI_COUNTRIES_MASKS)),
1007
+ __param(4, core.Inject(TUI_INPUT_PHONE_INTERNATIONAL_OPTIONS)),
1008
+ __param(5, core.Inject(core$1.TuiFlagPipe))
992
1009
  ], TuiInputPhoneInternationalComponent);
993
1010
  return TuiInputPhoneInternationalComponent;
994
1011
  }(cdk.AbstractTuiControl));
@@ -1011,7 +1028,7 @@
1011
1028
  core$1.TuiHostedDropdownModule,
1012
1029
  core$1.TuiDataListModule,
1013
1030
  arrow.TuiArrowModule,
1014
- cdk.TuiLetModule,
1031
+ core$1.TuiFlagPipeModule,
1015
1032
  cdk.TuiMapperPipeModule,
1016
1033
  cdk.TuiActiveZoneModule,
1017
1034
  ],