@taiga-ui/core 3.28.0-dev.main-2c8366d → 3.28.0-dev.main-5b9544d
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/taiga-ui-core-components-primitive-textfield.umd.js +21 -39
- package/bundles/taiga-ui-core-components-primitive-textfield.umd.js.map +1 -1
- package/components/primitive-textfield/primitive-textfield.component.d.ts +3 -5
- package/esm2015/components/primitive-textfield/primitive-textfield.component.js +10 -26
- package/esm2015/components/primitive-textfield/textfield/textfield.component.js +1 -1
- package/esm2015/components/primitive-textfield/value-decoration/value-decoration.component.js +2 -2
- package/fesm2015/taiga-ui-core-components-primitive-textfield.js +12 -27
- package/fesm2015/taiga-ui-core-components-primitive-textfield.js.map +1 -1
- package/package.json +1 -1
- package/styles/mixins/textfield.less +50 -20
- package/styles/mixins/textfield.scss +19 -21
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@taiga-ui/cdk'), require('@taiga-ui/core/directives/hint'), require('@taiga-ui/core/directives/textfield-controller'), require('@taiga-ui/core/
|
|
3
|
-
typeof define === 'function' && define.amd ? define('@taiga-ui/core/components/primitive-textfield', ['exports', '@angular/core', '@taiga-ui/cdk', '@taiga-ui/core/directives/hint', '@taiga-ui/core/directives/textfield-controller', '@taiga-ui/core/
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["taiga-ui"] = global["taiga-ui"] || {}, global["taiga-ui"].core = global["taiga-ui"].core || {}, global["taiga-ui"].core.components = global["taiga-ui"].core.components || {}, global["taiga-ui"].core.components["primitive-textfield"] = {}), global.ng.core, global.i6, global["taiga-ui"].core.directives.hint, global["taiga-ui"].core.directives["textfield-controller"], global["taiga-ui"].core.
|
|
5
|
-
})(this, (function (exports, i0, i6,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@taiga-ui/cdk'), require('@taiga-ui/core/directives/hint'), require('@taiga-ui/core/directives/textfield-controller'), require('@taiga-ui/core/utils/miscellaneous'), require('@tinkoff/ng-polymorpheus'), require('rxjs'), require('rxjs/operators'), require('@taiga-ui/core/components/svg'), require('@taiga-ui/core/components/tooltip'), require('@angular/common'), require('@taiga-ui/core/directives/wrapper'), require('@taiga-ui/core/directives/mask-accessor'), require('@angular/forms'), require('@taiga-ui/core/abstract'), require('@taiga-ui/core/tokens'), require('@taiga-ui/core/directives')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('@taiga-ui/core/components/primitive-textfield', ['exports', '@angular/core', '@taiga-ui/cdk', '@taiga-ui/core/directives/hint', '@taiga-ui/core/directives/textfield-controller', '@taiga-ui/core/utils/miscellaneous', '@tinkoff/ng-polymorpheus', 'rxjs', 'rxjs/operators', '@taiga-ui/core/components/svg', '@taiga-ui/core/components/tooltip', '@angular/common', '@taiga-ui/core/directives/wrapper', '@taiga-ui/core/directives/mask-accessor', '@angular/forms', '@taiga-ui/core/abstract', '@taiga-ui/core/tokens', '@taiga-ui/core/directives'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global["taiga-ui"] = global["taiga-ui"] || {}, global["taiga-ui"].core = global["taiga-ui"].core || {}, global["taiga-ui"].core.components = global["taiga-ui"].core.components || {}, global["taiga-ui"].core.components["primitive-textfield"] = {}), global.ng.core, global.i6, global["taiga-ui"].core.directives.hint, global["taiga-ui"].core.directives["textfield-controller"], global["taiga-ui"].core.utils.miscellaneous, global.i9, global.rxjs, global.rxjs.operators, global["taiga-ui"].core.components.svg, global["taiga-ui"].core.components.tooltip, global.ng.common, global["taiga-ui"].core.directives.wrapper, global["taiga-ui"].core.directives["mask-accessor"], global.ng.forms, global["taiga-ui"].core.abstract, global["taiga-ui"].core.tokens, global["taiga-ui"].core.directives));
|
|
5
|
+
})(this, (function (exports, i0, i6, i11, i10, miscellaneous, i9, rxjs, operators, i1, i3, i4, i5, i7, i8, abstract, tokens, i1$1) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespace(e) {
|
|
8
8
|
if (e && e.__esModule) return e;
|
|
@@ -24,10 +24,9 @@
|
|
|
24
24
|
|
|
25
25
|
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
|
26
26
|
var i6__namespace = /*#__PURE__*/_interopNamespace(i6);
|
|
27
|
-
var i12__namespace = /*#__PURE__*/_interopNamespace(i12);
|
|
28
27
|
var i11__namespace = /*#__PURE__*/_interopNamespace(i11);
|
|
29
|
-
var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
|
|
30
28
|
var i10__namespace = /*#__PURE__*/_interopNamespace(i10);
|
|
29
|
+
var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
|
|
31
30
|
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
|
|
32
31
|
var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
|
|
33
32
|
var i4__namespace = /*#__PURE__*/_interopNamespace(i4);
|
|
@@ -358,7 +357,7 @@
|
|
|
358
357
|
function TuiValueDecorationComponent(textfield) {
|
|
359
358
|
var _this = this;
|
|
360
359
|
this.textfield = textfield;
|
|
361
|
-
this.prefix$ = new
|
|
360
|
+
this.prefix$ = new rxjs.BehaviorSubject('');
|
|
362
361
|
this.pre$ = this.prefix$.pipe(operators.delay(0), operators.filter(function () { var _a; return !!((_a = _this.pre) === null || _a === void 0 ? void 0 : _a.nativeElement.isConnected); }), operators.map(function () { var _a; return ((_a = _this.pre) === null || _a === void 0 ? void 0 : _a.nativeElement.offsetWidth) || 0; }), operators.distinctUntilChanged());
|
|
363
362
|
}
|
|
364
363
|
Object.defineProperty(TuiValueDecorationComponent.prototype, "isContextTable", {
|
|
@@ -444,7 +443,7 @@
|
|
|
444
443
|
return TuiValueDecorationComponent;
|
|
445
444
|
}());
|
|
446
445
|
TuiValueDecorationComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiValueDecorationComponent, deps: [{ token: i6.TUI_FOCUSABLE_ITEM_ACCESSOR }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
447
|
-
TuiValueDecorationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiValueDecorationComponent, selector: "tui-value-decoration", host: { listeners: { "animationstart": "ngDoCheck()" }, properties: { "class._table": "this.isContextTable" } }, viewQueries: [{ propertyName: "pre", first: true, predicate: ["pre"], descendants: true, read: i0.ElementRef, static: true }], ngImport: i0__namespace, template: "<span\n #pre\n class=\"t-prefix
|
|
446
|
+
TuiValueDecorationComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiValueDecorationComponent, selector: "tui-value-decoration", host: { listeners: { "animationstart": "ngDoCheck()" }, properties: { "class._table": "this.isContextTable" } }, viewQueries: [{ propertyName: "pre", first: true, predicate: ["pre"], descendants: true, read: i0.ElementRef, static: true }], ngImport: i0__namespace, template: "<span\n #pre\n class=\"t-prefix\"\n [textContent]=\"prefix\"\n></span>\n<span\n class=\"t-ghost\"\n [textContent]=\"value\"\n></span>\n<span\n class=\"t-filler\"\n [textContent]=\"filler\"\n></span>\n<span\n class=\"t-postfix\"\n [textContent]=\"postfix\"\n></span>\n", styles: [":host{position:absolute;display:block;width:100%;line-height:var(--tui-height);margin-top:calc(var(--tui-height) / -2);box-sizing:content-box;color:var(--tui-text-01);animation:tuiPresent 1s;white-space:nowrap}:host._table{position:static;margin-top:0}:host-context(tui-primitive-textfield [tuiWrapper][data-mode=\"onDark\"]) :host{color:var(--tui-text-01-night)}:host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)) :host{line-height:calc(var(--tui-height) - .25rem)}.t-ghost{visibility:hidden;white-space:pre;text-overflow:clip}.t-prefix,.t-postfix{white-space:pre}.t-filler{overflow:hidden;color:var(--tui-text-03);text-overflow:ellipsis;max-width:100%;white-space:nowrap}:host-context(tui-primitive-textfield [tuiWrapper][data-mode=\"onDark\"]) .t-filler{color:var(--tui-text-03-night)}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.Default });
|
|
448
447
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiValueDecorationComponent, decorators: [{
|
|
449
448
|
type: i0.Component,
|
|
450
449
|
args: [{
|
|
@@ -475,9 +474,8 @@
|
|
|
475
474
|
var ICON_PADDING = 1.625;
|
|
476
475
|
var TuiPrimitiveTextfieldComponent = /** @class */ (function (_super) {
|
|
477
476
|
__extends(TuiPrimitiveTextfieldComponent, _super);
|
|
478
|
-
function TuiPrimitiveTextfieldComponent(
|
|
477
|
+
function TuiPrimitiveTextfieldComponent(controller, hintOptions, options, el) {
|
|
479
478
|
var _this = _super.call(this) || this;
|
|
480
|
-
_this.mode$ = mode$;
|
|
481
479
|
_this.controller = controller;
|
|
482
480
|
_this.hintOptions = hintOptions;
|
|
483
481
|
_this.options = options;
|
|
@@ -603,15 +601,6 @@
|
|
|
603
601
|
enumerable: false,
|
|
604
602
|
configurable: true
|
|
605
603
|
});
|
|
606
|
-
Object.defineProperty(TuiPrimitiveTextfieldComponent.prototype, "showOnlyPlaceholder", {
|
|
607
|
-
get: function () {
|
|
608
|
-
return (this.focused &&
|
|
609
|
-
this.placeholderVisible &&
|
|
610
|
-
(this.size === 's' || (this.size === 'm' && !this.placeholderRaisable)));
|
|
611
|
-
},
|
|
612
|
-
enumerable: false,
|
|
613
|
-
configurable: true
|
|
614
|
-
});
|
|
615
604
|
Object.defineProperty(TuiPrimitiveTextfieldComponent.prototype, "placeholderVisible", {
|
|
616
605
|
get: function () {
|
|
617
606
|
var _a;
|
|
@@ -627,8 +616,7 @@
|
|
|
627
616
|
});
|
|
628
617
|
Object.defineProperty(TuiPrimitiveTextfieldComponent.prototype, "hasPlaceholder", {
|
|
629
618
|
get: function () {
|
|
630
|
-
return
|
|
631
|
-
(this.placeholderRaisable || this.placeholderVisible));
|
|
619
|
+
return this.placeholderRaisable || this.placeholderVisible;
|
|
632
620
|
},
|
|
633
621
|
enumerable: false,
|
|
634
622
|
configurable: true
|
|
@@ -701,7 +689,7 @@
|
|
|
701
689
|
this.updateFocused(focused);
|
|
702
690
|
};
|
|
703
691
|
TuiPrimitiveTextfieldComponent.prototype.getIndent$ = function (element) {
|
|
704
|
-
return
|
|
692
|
+
return rxjs.fromEvent(element, 'scroll').pipe(operators.map(function () { return -1 * element.scrollLeft; }));
|
|
705
693
|
};
|
|
706
694
|
TuiPrimitiveTextfieldComponent.prototype.clear = function () {
|
|
707
695
|
if (this.nativeFocusableElement) {
|
|
@@ -749,12 +737,11 @@
|
|
|
749
737
|
};
|
|
750
738
|
return TuiPrimitiveTextfieldComponent;
|
|
751
739
|
}(i6.AbstractTuiInteractive));
|
|
752
|
-
TuiPrimitiveTextfieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiPrimitiveTextfieldComponent, deps: [{ token:
|
|
753
|
-
TuiPrimitiveTextfieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiPrimitiveTextfieldComponent, selector: "tui-primitive-textfield", inputs: { editable: "editable", textfieldFiller: ["filler", "textfieldFiller"], iconCleaner: "iconCleaner", readOnly: "readOnly", invalid: "invalid", disabled: "disabled", textfieldPrefix: ["prefix", "textfieldPrefix"], textfieldPostfix: ["postfix", "textfieldPostfix"], value: "value" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "
|
|
740
|
+
TuiPrimitiveTextfieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiPrimitiveTextfieldComponent, deps: [{ token: i10.TUI_TEXTFIELD_WATCHED_CONTROLLER }, { token: i11.TuiHintOptionsDirective, optional: true }, { token: i10.TUI_TEXTFIELD_OPTIONS }, { token: i0.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
741
|
+
TuiPrimitiveTextfieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiPrimitiveTextfieldComponent, selector: "tui-primitive-textfield", inputs: { editable: "editable", textfieldFiller: ["filler", "textfieldFiller"], iconCleaner: "iconCleaner", readOnly: "readOnly", invalid: "invalid", disabled: "disabled", textfieldPrefix: ["prefix", "textfieldPrefix"], textfieldPostfix: ["postfix", "textfieldPostfix"], value: "value" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "focusin": "onFocused(true)", "focusout": "onFocused(false)" }, properties: { "class._autofilled": "autofilled", "class._label-outside": "controller.labelOutside", "class._readonly": "this.readOnly", "attr.data-size": "this.size", "class._invalid": "this.computedInvalid", "class._hidden": "this.inputHidden", "style.--border-start.rem": "this.borderStart", "style.--border-end.rem": "this.borderEnd" } }, providers: [
|
|
754
742
|
i6.tuiAsFocusableItemAccessor(TuiPrimitiveTextfieldComponent),
|
|
755
|
-
|
|
756
|
-
providers.MODE_PROVIDER,
|
|
757
|
-
], queries: [{ propertyName: "content", predicate: i9.PolymorpheusOutletDirective, descendants: true }], viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"content?.changes | async\"></ng-container>\n<ng-container *ngIf=\"hintOptions?.change$ | async\"></ng-container>\n<div\n tuiWrapper\n automation-id=\"tui-primitive-textfield__wrapper\"\n [appearance]=\"appearance\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [focus]=\"computedFocused\"\n [hover]=\"pseudoHover\"\n [active]=\"pseudoActive\"\n [invalid]=\"computedInvalid\"\n [style.--text-indent.px]=\"decor.pre$ | async\"\n (mousedown)=\"onMouseDown($event)\"\n (click.prevent.silent)=\"(0)\"\n (tuiAutofilledChange)=\"onAutofilled($event)\"\n>\n <ng-content select=\"input\"></ng-content>\n <ng-content select=\"select\"></ng-content>\n <input\n #focusableElement\n tuiMaskAccessor\n automation-id=\"tui-primitive-textfield__native-input\"\n class=\"t-input\"\n [attr.disabled]=\"computedDisabled || null\"\n [attr.name]=\"name\"\n [attr.aria-invalid]=\"computedInvalid\"\n [id]=\"id\"\n [readOnly]=\"readOnly || !editable\"\n [tuiFocusable]=\"computedFocusable\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onModelChange($event)\"\n />\n <div\n *ngIf=\"inputHidden\"\n automation-id=\"tui-primitive-textfield__value\"\n class=\"t-input t-input_template\"\n >\n <ng-content select=\"tuiContent\"></ng-content>\n </div>\n <div class=\"t-content\">\n <div\n *ngIf=\"iconLeftContent\"\n class=\"t-icon t-icon_left t-textfield-icon\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconLeftContent as src; context: {$implicit: size}\"\n tuiWrapper\n appearance=\"icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n <div class=\"t-wrapper\">\n <label\n *ngIf=\"hasPlaceholder\"\n automation-id=\"tui-primitive-textfield__placeholder\"\n class=\"t-placeholder\"\n [class.t-placeholder_raised]=\"placeholderRaised\"\n [for]=\"computedId\"\n >\n <ng-content></ng-content>\n </label>\n <div class=\"t-wrapper-value-decoration\">\n <tui-value-decoration\n #decor\n automation-id=\"tui-primitive-textfield__value-decoration\"\n aria-hidden=\"true\"\n class=\"t-value-decoration\"\n [class.t-has-value]=\"value\"\n [style.textIndent.px]=\"getIndent$(focusableElement) | async\"\n ></tui-value-decoration>\n </div>\n </div>\n <div\n *ngIf=\"hasCustomContent\"\n automation-id=\"tui-primitive-textfield__custom-content\"\n class=\"t-custom-content\"\n >\n <tui-svg\n *polymorpheusOutlet=\"controller.customContent as src\"\n class=\"t-custom-icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n <span\n *ngIf=\"hasCleaner\"\n tuiWrapper\n appearance=\"icon\"\n automation-id=\"tui-primitive-textfield__cleaner\"\n class=\"t-cleaner\"\n (click.stop)=\"clear()\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconCleaner || controller.options.iconCleaner as src; context: {$implicit: size}\"\n [src]=\"src\"\n ></tui-svg>\n </span>\n <tui-tooltip\n *ngIf=\"showHint\"\n automation-id=\"tui-primitive-textfield__tooltip\"\n class=\"t-tooltip\"\n [describeId]=\"computedId\"\n [content]=\"hintOptions?.content\"\n ></tui-tooltip>\n <div\n *ngIf=\"iconContent\"\n class=\"t-icon t-textfield-icon\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconContent as src; context: {$implicit: size}\"\n tuiWrapper\n appearance=\"icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n </div>\n</div>\n", styles: [":host{font:var(--tui-font-text-s);color:var(--tui-text-01);position:relative;display:block;border-radius:var(--tui-radius-m);text-align:left}:host[data-size=s]{height:var(--tui-height-s);min-height:var(--tui-height-s);max-height:var(--tui-height-s)}:host[data-size=m]{height:var(--tui-height-m);min-height:var(--tui-height-m);max-height:var(--tui-height-m)}:host[data-size=l]{height:var(--tui-height-l);min-height:var(--tui-height-l);max-height:var(--tui-height-l);font:var(--tui-font-text-m);line-height:1.25rem}.t-input{font:var(--tui-font-text-s);color:var(--tui-text-01);padding:0;margin:0;border:0;border-radius:inherit;background:none;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;padding:0 var(--tui-padding-m);border:solid transparent;border-width:0 var(--border-end, 0) 0 var(--border-start, 0);border-inline-start-width:var(--border-start, 0);border-inline-end-width:var(--border-end, 0);text-indent:var(--text-indent);text-align:inherit;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-transform:inherit;resize:none}.t-input:-webkit-autofill,.t-input:-webkit-autofill:hover,.t-input:-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01)!important;border-color:var(--tui-autofill);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill) inset!important}:host[data-mode=onDark] .t-input:-webkit-autofill,.t-input :host-context(tui-primitive-textfield[data-mode=\"onDark\"]):-webkit-autofill,.t-input :host-context(tui-text-area[data-mode=\"onDark\"]):-webkit-autofill,:host[data-mode=onDark] .t-input:-webkit-autofill:hover,.t-input :host-context(tui-primitive-textfield[data-mode=\"onDark\"]):-webkit-autofill:hover,.t-input :host-context(tui-text-area[data-mode=\"onDark\"]):-webkit-autofill:hover,:host[data-mode=onDark] .t-input:-webkit-autofill:focus,.t-input :host-context(tui-primitive-textfield[data-mode=\"onDark\"]):-webkit-autofill:focus,.t-input :host-context(tui-text-area[data-mode=\"onDark\"]):-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01-night)!important;border-color:var(--tui-autofill-night);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill-night) inset!important}:host[data-size=s] .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"s\"]):not(tui-primitive-textfield),.t-input :host-context(tui-text-area[data-size=\"s\"]):not(tui-text-area){padding:0 var(--tui-padding-s)}:host[data-size=l] .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]):not(tui-primitive-textfield),.t-input :host-context(tui-text-area[data-size=\"l\"]):not(tui-text-area){padding:0 var(--tui-padding-l)}:host._disabled .t-input,.t-input :host-context(tui-primitive-textfield._disabled),.t-input :host-context(tui-text-area._disabled){pointer-events:none}:host[data-size=l]:not(._label-outside) .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1.25rem}:host[data-size=l]:not(._label-outside) .t-input:-webkit-autofill+.t-content .t-placeholder,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.8156rem;transform:translateY(-.625rem)}:host[data-size=m]:not(._label-outside) .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1rem}:host[data-size=m]:not(._label-outside) .t-input:-webkit-autofill+.t-content .t-placeholder,.t-input :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.69rem;transform:translateY(-.5rem)}:host._hidden input.t-input,.t-input :host-context(tui-primitive-textfield._hidden){opacity:0;text-indent:-10em;-webkit-user-select:none}.t-content{display:flex;height:100%;width:100%;padding:0 var(--tui-padding-m);box-sizing:border-box;align-items:center;overflow:hidden}:host[data-size=s] .t-content{padding:0 var(--tui-padding-s)}:host[data-size=l] .t-content{padding:0 var(--tui-padding-l)}.t-content:after{content:\"\";margin-right:-.25rem}:host[data-size=m] .t-content:after{display:none}.t-wrapper{flex:1;min-width:0;padding-right:.25rem;-webkit-padding-end:.25rem;padding-inline-end:.25rem;-webkit-padding-start:0;padding-inline-start:0}.t-wrapper+*{margin:0}.t-placeholder{transition-property:transform,font-size,color,letter-spacing;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;font:var(--tui-font-text-s);color:var(--tui-text-01);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--tui-text-02);pointer-events:none;will-change:transform;transform:translateY(0)}.t-placeholder_raised{transform:translateY(-.625rem)}:host[data-size=m] .t-placeholder_raised{font:var(--tui-font-text-xs);line-height:1.25rem;transform:translateY(-.5rem);letter-spacing:.025rem}:host._invalid:not(._focused) .t-placeholder_raised,:host._invalid:not(._focused):hover .t-placeholder_raised{color:var(--tui-error-fill)}:host[data-mode=onDark]._invalid:not(._focused) .t-placeholder_raised,:host[data-mode=onDark]._invalid:not(._focused):hover .t-placeholder_raised{color:var(--tui-error-fill-night)}:host._focused .t-placeholder,:host[data-size=m]._focused._label-outside .t-placeholder,:host[data-size=l]._focused._label-outside .t-placeholder{color:var(--tui-text-03)}:host[data-size=l] .t-placeholder{font-size:.9375rem}:host[data-size=l] .t-placeholder_raised{font-size:.8156rem}:host[data-size=m]._focused:not(._label-outside) .t-placeholder,:host[data-size=l]._focused:not(._label-outside) .t-placeholder{color:var(--tui-text-01)}:host[data-mode=onDark] .t-placeholder{color:var(--tui-text-02-night)}:host[data-size=m][data-mode=onDark]._focused:not(._label-outside) .t-placeholder,:host[data-size=l][data-mode=onDark]._focused:not(._label-outside) .t-placeholder{color:var(--tui-text-01-night)}:host[data-mode=onDark]._focused .t-placeholder,:host[data-size=m][data-mode=onDark]._focused._label-outside .t-placeholder,:host[data-size=l][data-mode=onDark]._focused._label-outside .t-placeholder{color:var(--tui-text-02-night)}@supports (-webkit-hyphens: none){.t-placeholder{will-change:unset;transition-property:transform,color,letter-spacing}}.t-cleaner{position:relative;display:flex;width:1.5rem;height:1.5rem;margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0;align-items:center;justify-content:center;box-sizing:border-box;cursor:pointer}:host._readonly .t-cleaner,:host._disabled .t-cleaner{pointer-events:none}.t-icon{position:relative;display:flex;width:1.5rem;height:1.5rem;margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0;align-items:center;justify-content:center;box-sizing:border-box;cursor:pointer;pointer-events:none}.t-icon_left{margin:0 .375rem 0 -.25rem;-webkit-margin-start:-.25rem;margin-inline-start:-.25rem;-webkit-margin-end:.375rem;margin-inline-end:.375rem}:host[data-size=l] .t-icon_left{margin:0 .5rem 0 -.25rem;-webkit-margin-start:-.25rem;margin-inline-start:-.25rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}:host._autofilled .t-value-decoration:not(.t-has-value){visibility:hidden}:host._autofilled[data-size=s]:not(._focused) .t-placeholder,:host._autofilled[data-size=m]:not(._focused) .t-placeholder{visibility:hidden}.t-custom-content{position:relative;display:flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;pointer-events:none}.t-custom-icon{width:2rem;height:100%}.t-tooltip{margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0}input::placeholder{color:var(--tui-text-03);opacity:0}:host-context(tui-primitive-textfield[data-mode=\"onDark\"]) input::placeholder,:host-context(tui-text-area[data-mode=\"onDark\"]) input::placeholder{color:var(--tui-text-03-night)}:host-context(tui-primitive-textfield._focused:not(._readonly)) input::placeholder,:host-context(tui-text-area._focused:not(._readonly)) input::placeholder{opacity:1}.t-input:not(:first-child){display:none}:host[data-size] .t-input_template{display:flex;width:calc(100% - 1rem);max-width:calc(100% - 1rem);align-items:center;pointer-events:none;-webkit-padding-end:0;padding-inline-end:0}.t-input:-webkit-autofill,.t-input:-webkit-autofill:first-line{font-size:inherit;line-height:inherit}.t-input::-webkit-caps-lock-indicator,.t-input::-webkit-contacts-auto-fill-button,.t-input::-webkit-credit-card-auto-fill-button,.t-input::-webkit-credentials-auto-fill-button,.t-input::-webkit-strong-password-auto-fill-button{content:none!important;position:absolute;left:-62.4375rem;top:-62.4375rem;z-index:-999;display:none!important;background:transparent!important;pointer-events:none!important}.t-text-template{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-wrapper-value-decoration{position:relative;pointer-events:none}\n"], components: [{ type: i1__namespace.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: TuiValueDecorationComponent, selector: "tui-value-decoration" }, { type: i3__namespace.TuiTooltipComponent, selector: "tui-tooltip", inputs: ["content", "direction", "appearance", "showDelay", "hideDelay", "describeId"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.TuiWrapperDirective, selector: "[tuiWrapper]", inputs: ["disabled", "readOnly", "hover", "active", "focus", "invalid", "appearance"] }, { type: i6__namespace.TuiAutofilledDirective, selector: "[tuiAutofilledChange]", outputs: ["tuiAutofilledChange"] }, { type: i7__namespace.TuiMaskAccessorDirective, selector: "input[tuiMaskAccessor]" }, { type: i8__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.TuiFocusableDirective, selector: "[tuiFocusable]", inputs: ["tuiFocusable"] }, { type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], pipes: { "async": i4__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
|
743
|
+
i10.TEXTFIELD_CONTROLLER_PROVIDER,
|
|
744
|
+
], queries: [{ propertyName: "content", predicate: i9.PolymorpheusOutletDirective, descendants: true }], viewQueries: [{ propertyName: "focusableElement", first: true, predicate: ["focusableElement"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-container *ngIf=\"content?.changes | async\"></ng-container>\n<ng-container *ngIf=\"hintOptions?.change$ | async\"></ng-container>\n<div\n tuiWrapper\n automation-id=\"tui-primitive-textfield__wrapper\"\n [appearance]=\"appearance\"\n [readOnly]=\"readOnly\"\n [disabled]=\"disabled\"\n [focus]=\"computedFocused\"\n [hover]=\"pseudoHover\"\n [active]=\"pseudoActive\"\n [invalid]=\"computedInvalid\"\n [style.--text-indent.px]=\"decor.pre$ | async\"\n (mousedown)=\"onMouseDown($event)\"\n (click.prevent.silent)=\"(0)\"\n (tuiAutofilledChange)=\"onAutofilled($event)\"\n>\n <ng-content select=\"input\"></ng-content>\n <ng-content select=\"select\"></ng-content>\n <input\n #focusableElement\n tuiMaskAccessor\n automation-id=\"tui-primitive-textfield__native-input\"\n class=\"t-input\"\n [attr.disabled]=\"computedDisabled || null\"\n [attr.name]=\"name\"\n [attr.aria-invalid]=\"computedInvalid\"\n [id]=\"id\"\n [readOnly]=\"readOnly || !editable\"\n [tuiFocusable]=\"computedFocusable\"\n [ngModel]=\"value\"\n (ngModelChange)=\"onModelChange($event)\"\n />\n <div\n *ngIf=\"inputHidden\"\n automation-id=\"tui-primitive-textfield__value\"\n class=\"t-input t-input_template\"\n >\n <ng-content select=\"tuiContent\"></ng-content>\n </div>\n <div class=\"t-content\">\n <div\n *ngIf=\"iconLeftContent\"\n class=\"t-icon t-icon_left t-textfield-icon\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconLeftContent as src; context: {$implicit: size}\"\n tuiWrapper\n appearance=\"icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n <div class=\"t-wrapper\">\n <label\n *ngIf=\"hasPlaceholder\"\n automation-id=\"tui-primitive-textfield__placeholder\"\n class=\"t-placeholder\"\n [class.t-placeholder_raised]=\"placeholderRaised\"\n [for]=\"computedId\"\n >\n <ng-content></ng-content>\n </label>\n <div class=\"t-wrapper-value-decoration\">\n <tui-value-decoration\n #decor\n automation-id=\"tui-primitive-textfield__value-decoration\"\n aria-hidden=\"true\"\n class=\"t-value-decoration\"\n [class.t-has-value]=\"value\"\n [style.textIndent.px]=\"getIndent$(focusableElement) | async\"\n ></tui-value-decoration>\n </div>\n </div>\n <div\n *ngIf=\"hasCustomContent\"\n automation-id=\"tui-primitive-textfield__custom-content\"\n class=\"t-custom-content\"\n >\n <tui-svg\n *polymorpheusOutlet=\"controller.customContent as src\"\n class=\"t-custom-icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n <span\n *ngIf=\"hasCleaner\"\n tuiWrapper\n appearance=\"icon\"\n automation-id=\"tui-primitive-textfield__cleaner\"\n class=\"t-cleaner\"\n (click.stop)=\"clear()\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconCleaner || controller.options.iconCleaner as src; context: {$implicit: size}\"\n [src]=\"src\"\n ></tui-svg>\n </span>\n <tui-tooltip\n *ngIf=\"showHint\"\n automation-id=\"tui-primitive-textfield__tooltip\"\n class=\"t-tooltip\"\n [describeId]=\"computedId\"\n [content]=\"hintOptions?.content\"\n ></tui-tooltip>\n <div\n *ngIf=\"iconContent\"\n class=\"t-icon t-textfield-icon\"\n >\n <tui-svg\n *polymorpheusOutlet=\"iconContent as src; context: {$implicit: size}\"\n tuiWrapper\n appearance=\"icon\"\n [src]=\"src\"\n ></tui-svg>\n </div>\n </div>\n</div>\n", styles: [":host{font:var(--tui-font-text-s);color:var(--tui-text-01);position:relative;display:block;border-radius:var(--tui-radius-m);text-align:left;height:var(--tui-height);min-height:var(--tui-height);max-height:var(--tui-height)}:host[data-size=s]{--tui-height: var(--tui-height-s)}:host[data-size=m]{--tui-height: var(--tui-height-m)}:host[data-size=l]{--tui-height: var(--tui-height-l);font:var(--tui-font-text-m);line-height:1.25rem}.t-input{font:var(--tui-font-text-s);color:var(--tui-text-01);padding:0;margin:0;border:0;border-radius:inherit;background:none;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;padding:0 var(--tui-padding-m);border:solid transparent;border-width:0 var(--border-end, 0) 0 var(--border-start, 0);border-inline-start-width:var(--border-start, 0);border-inline-end-width:var(--border-end, 0);text-indent:var(--text-indent);text-align:inherit;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-transform:inherit;resize:none}.t-input:-webkit-autofill,.t-input:-webkit-autofill:hover,.t-input:-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01)!important;border-color:var(--tui-autofill);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill) inset!important}.t-input:-webkit-autofill,.t-input:-webkit-autofill:first-line{font-size:inherit;line-height:inherit}.t-input::-webkit-caps-lock-indicator,.t-input::-webkit-contacts-auto-fill-button,.t-input::-webkit-credit-card-auto-fill-button,.t-input::-webkit-credentials-auto-fill-button,.t-input::-webkit-strong-password-auto-fill-button{content:none!important;position:absolute;left:-62.4375rem;top:-62.4375rem;z-index:-999;display:none!important;background:transparent!important;pointer-events:none!important}.t-input::placeholder{color:var(--tui-text-03);opacity:0}:host._focused:not(._readonly) .t-input::placeholder,:host-context(tui-primitive-textfield._focused:not(._readonly)) .t-input::placeholder,:host-context(tui-text-area._focused:not(._readonly)) .t-input::placeholder{opacity:1}[tuiWrapper][data-mode=onDark] .t-input:-webkit-autofill,.t-input :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill,[tuiWrapper][data-mode=onDark] .t-input:-webkit-autofill:hover,.t-input :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill:hover,[tuiWrapper][data-mode=onDark] .t-input:-webkit-autofill:focus,.t-input :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01-night)!important;border-color:var(--tui-autofill-night);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill-night) inset!important}[tuiWrapper][data-mode=onDark] .t-input::placeholder,.t-input :host-context([tuiWrapper][data-mode=\"onDark\"])::placeholder{color:var(--tui-text-03-night)}:host[data-size=s] .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"s\"]):not(tui-primitive-textfield),.t-input :host-context(tui-text-area[data-size=\"s\"]):not(tui-text-area){padding:0 var(--tui-padding-s)}:host[data-size=l] .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]):not(tui-primitive-textfield),.t-input :host-context(tui-text-area[data-size=\"l\"]):not(tui-text-area){padding:0 var(--tui-padding-l)}:host._disabled .t-input,.t-input :host-context(tui-primitive-textfield._disabled),.t-input :host-context(tui-text-area._disabled){pointer-events:none}:host[data-size=l]:not(._label-outside) .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1.25rem}:host[data-size=l]:not(._label-outside) .t-input:-webkit-autofill+.t-content .t-placeholder,.t-input :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.8156rem;transform:translateY(-.625rem)}:host[data-size=m]:not(._label-outside) .t-input,.t-input :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1rem}:host[data-size=m]:not(._label-outside) .t-input:-webkit-autofill+.t-content .t-placeholder,.t-input :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.69rem;transform:translateY(-.5rem)}:host._hidden input.t-input,.t-input :host-context(tui-primitive-textfield._hidden){opacity:0;text-indent:-10em;-webkit-user-select:none}.t-content{display:flex;height:100%;width:100%;padding:0 var(--tui-padding-m);box-sizing:border-box;align-items:center;overflow:hidden}:host[data-size=s] .t-content{padding:0 var(--tui-padding-s)}:host[data-size=l] .t-content{padding:0 var(--tui-padding-l)}.t-content:after{content:\"\";margin-right:-.25rem}:host[data-size=m] .t-content:after{display:none}.t-wrapper{flex:1;min-width:0;padding-right:.25rem;-webkit-padding-end:.25rem;padding-inline-end:.25rem;-webkit-padding-start:0;padding-inline-start:0}.t-wrapper+*{margin:0}.t-placeholder{transition-property:transform,font-size,color,letter-spacing;transition-duration:var(--tui-duration, .3s);transition-timing-function:ease-in-out;font:var(--tui-font-text-s);color:var(--tui-text-01);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--tui-text-02);pointer-events:none;will-change:transform;transform:translateY(0)}.t-placeholder_raised{transform:translateY(-.625rem)}:host[data-size=m] .t-placeholder_raised{font:var(--tui-font-text-xs);line-height:1.25rem;transform:translateY(-.5rem);letter-spacing:.025rem}:host._invalid:not(._focused) .t-placeholder_raised,:host._invalid:not(._focused):hover .t-placeholder_raised{color:var(--tui-error-fill)}:host._invalid:not(._focused) [tuiWrapper][data-mode=onDark] .t-placeholder_raised,:host._invalid:not(._focused):hover [tuiWrapper][data-mode=onDark] .t-placeholder_raised{color:var(--tui-error-fill-night)}:host._focused .t-placeholder,:host[data-size=m]._focused._label-outside .t-placeholder,:host[data-size=l]._focused._label-outside .t-placeholder{color:var(--tui-text-03)}:host[data-size=l] .t-placeholder{font-size:.9375rem}:host[data-size=l] .t-placeholder_raised{font-size:.8156rem}:host[data-size=m]._focused:not(._label-outside) .t-placeholder,:host[data-size=l]._focused:not(._label-outside) .t-placeholder{color:var(--tui-text-01)}[tuiWrapper][data-mode=onDark] .t-placeholder{color:var(--tui-text-02-night)}:host[data-size=m]._focused:not(._label-outside) [tuiWrapper][data-mode=onDark] .t-placeholder,:host[data-size=l]._focused:not(._label-outside) [tuiWrapper][data-mode=onDark] .t-placeholder{color:var(--tui-text-01-night)}:host._focused [tuiWrapper][data-mode=onDark] .t-placeholder,:host[data-size=m]._focused._label-outside [tuiWrapper][data-mode=onDark] .t-placeholder,:host[data-size=l]._focused._label-outside [tuiWrapper][data-mode=onDark] .t-placeholder{color:var(--tui-text-02-night)}@supports (-webkit-hyphens: none){.t-placeholder{will-change:unset;transition-property:transform,color,letter-spacing}}.t-cleaner{position:relative;display:flex;width:1.5rem;height:1.5rem;margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0;align-items:center;justify-content:center;box-sizing:border-box;cursor:pointer}:host._readonly .t-cleaner,:host._disabled .t-cleaner{pointer-events:none}.t-icon{position:relative;display:flex;width:1.5rem;height:1.5rem;margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0;align-items:center;justify-content:center;box-sizing:border-box;cursor:pointer;pointer-events:none}.t-icon_left{margin:0 .375rem 0 -.25rem;-webkit-margin-start:-.25rem;margin-inline-start:-.25rem;-webkit-margin-end:.375rem;margin-inline-end:.375rem}:host[data-size=l] .t-icon_left{margin:0 .5rem 0 -.25rem;-webkit-margin-start:-.25rem;margin-inline-start:-.25rem;-webkit-margin-end:.5rem;margin-inline-end:.5rem}:host._autofilled .t-value-decoration:not(.t-has-value){visibility:hidden}:host._autofilled[data-size=s]:not(._focused) .t-placeholder,:host._autofilled[data-size=m]:not(._focused) .t-placeholder{visibility:hidden}.t-custom-content{position:relative;display:flex;align-items:center;justify-content:center;min-width:2rem;height:2rem;pointer-events:none}.t-custom-icon{width:2rem;height:100%}.t-tooltip{margin:0 0 0 .25rem;-webkit-margin-start:.25rem;margin-inline-start:.25rem;-webkit-margin-end:0;margin-inline-end:0}.t-input:not(:first-child){display:none}:host[data-size] .t-input_template{display:flex;width:calc(100% - 1rem);max-width:calc(100% - 1rem);align-items:center;pointer-events:none;-webkit-padding-end:0;padding-inline-end:0}.t-text-template{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.t-wrapper-value-decoration{position:relative;pointer-events:none}\n"], components: [{ type: i1__namespace.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: TuiValueDecorationComponent, selector: "tui-value-decoration" }, { type: i3__namespace.TuiTooltipComponent, selector: "tui-tooltip", inputs: ["content", "direction", "appearance", "showDelay", "hideDelay", "describeId"] }], directives: [{ type: i4__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.TuiWrapperDirective, selector: "[tuiWrapper]", inputs: ["disabled", "readOnly", "hover", "active", "focus", "invalid", "appearance"] }, { type: i6__namespace.TuiAutofilledDirective, selector: "[tuiAutofilledChange]", outputs: ["tuiAutofilledChange"] }, { type: i7__namespace.TuiMaskAccessorDirective, selector: "input[tuiMaskAccessor]" }, { type: i8__namespace.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i6__namespace.TuiFocusableDirective, selector: "[tuiFocusable]", inputs: ["tuiFocusable"] }, { type: i8__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i8__namespace.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace.PolymorpheusOutletDirective, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }], pipes: { "async": i4__namespace.AsyncPipe }, changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
|
758
745
|
__decorate([
|
|
759
746
|
i6.tuiDefaultProp()
|
|
760
747
|
], TuiPrimitiveTextfieldComponent.prototype, "editable", void 0);
|
|
@@ -794,30 +781,25 @@
|
|
|
794
781
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
795
782
|
providers: [
|
|
796
783
|
i6.tuiAsFocusableItemAccessor(TuiPrimitiveTextfieldComponent),
|
|
797
|
-
|
|
798
|
-
providers.MODE_PROVIDER,
|
|
784
|
+
i10.TEXTFIELD_CONTROLLER_PROVIDER,
|
|
799
785
|
],
|
|
800
786
|
host: {
|
|
801
|
-
'($.data-mode.attr)': 'mode$',
|
|
802
787
|
'[class._autofilled]': 'autofilled',
|
|
803
788
|
'[class._label-outside]': 'controller.labelOutside',
|
|
804
789
|
},
|
|
805
790
|
}]
|
|
806
791
|
}], ctorParameters: function () {
|
|
807
|
-
return [{ type: i10__namespace.
|
|
808
|
-
type: i0.Inject,
|
|
809
|
-
args: [tokens.TUI_MODE]
|
|
810
|
-
}] }, { type: i11__namespace.TuiTextfieldController, decorators: [{
|
|
792
|
+
return [{ type: i10__namespace.TuiTextfieldController, decorators: [{
|
|
811
793
|
type: i0.Inject,
|
|
812
|
-
args: [
|
|
813
|
-
}] }, { type:
|
|
794
|
+
args: [i10.TUI_TEXTFIELD_WATCHED_CONTROLLER]
|
|
795
|
+
}] }, { type: i11__namespace.TuiHintOptionsDirective, decorators: [{
|
|
814
796
|
type: i0.Optional
|
|
815
797
|
}, {
|
|
816
798
|
type: i0.Inject,
|
|
817
|
-
args: [
|
|
799
|
+
args: [i11.TuiHintOptionsDirective]
|
|
818
800
|
}] }, { type: undefined, decorators: [{
|
|
819
801
|
type: i0.Inject,
|
|
820
|
-
args: [
|
|
802
|
+
args: [i10.TUI_TEXTFIELD_OPTIONS]
|
|
821
803
|
}] }, { type: i0__namespace.ElementRef, decorators: [{
|
|
822
804
|
type: i0.Inject,
|
|
823
805
|
args: [i0.ElementRef]
|
|
@@ -943,7 +925,7 @@
|
|
|
943
925
|
return TuiTextfieldComponent;
|
|
944
926
|
}());
|
|
945
927
|
TuiTextfieldComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiTextfieldComponent, deps: [{ token: tokens.TUI_TEXTFIELD_HOST }, { token: i1$1.TUI_TEXTFIELD_WATCHED_CONTROLLER }, { token: i0.ElementRef }, { token: i6.TuiIdService }, { token: tokens.TUI_LEGACY_MASK, optional: true }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
946
|
-
TuiTextfieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiTextfieldComponent, selector: "input[tuiTextfield], textarea[tuiTextfield]", host: { attributes: { "type": "text" }, listeners: { "input": "!legacyMask && host.onValueChange($event.target.value)" }, properties: { "attr.id": "id", "attr.inputMode": "inputMode", "attr.aria-invalid": "host.invalid", "attr.disabled": "host.disabled || null", "tabIndex": "host.focusable ? 0 : -1", "readOnly": "host.readOnly", "value": "host.value" } }, providers: [i1$1.TEXTFIELD_CONTROLLER_PROVIDER], ngImport: i0__namespace, template: '', isInline: true, styles: [":host{font:var(--tui-font-text-s);color:var(--tui-text-01);padding:0;margin:0;border:0;border-radius:inherit;background:none;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;padding:0 var(--tui-padding-m);border:solid transparent;border-width:0 var(--border-end, 0) 0 var(--border-start, 0);border-inline-start-width:var(--border-start, 0);border-inline-end-width:var(--border-end, 0);text-indent:var(--text-indent);text-align:inherit;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-transform:inherit;resize:none}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01)!important;border-color:var(--tui-autofill);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill) inset!important}:host
|
|
928
|
+
TuiTextfieldComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TuiTextfieldComponent, selector: "input[tuiTextfield], textarea[tuiTextfield]", host: { attributes: { "type": "text" }, listeners: { "input": "!legacyMask && host.onValueChange($event.target.value)" }, properties: { "attr.id": "id", "attr.inputMode": "inputMode", "attr.aria-invalid": "host.invalid", "attr.disabled": "host.disabled || null", "tabIndex": "host.focusable ? 0 : -1", "readOnly": "host.readOnly", "value": "host.value" } }, providers: [i1$1.TEXTFIELD_CONTROLLER_PROVIDER], ngImport: i0__namespace, template: '', isInline: true, styles: [":host{font:var(--tui-font-text-s);color:var(--tui-text-01);padding:0;margin:0;border:0;border-radius:inherit;background:none;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;caret-color:currentColor;outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;word-break:keep-all;-webkit-text-fill-color:currentColor;position:absolute;top:0;left:0;width:100%;height:100%;padding:0 var(--tui-padding-m);border:solid transparent;border-width:0 var(--border-end, 0) 0 var(--border-start, 0);border-inline-start-width:var(--border-start, 0);border-inline-end-width:var(--border-end, 0);text-indent:var(--text-indent);text-align:inherit;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-transform:inherit;resize:none}:host:-webkit-autofill,:host:-webkit-autofill:hover,:host:-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01)!important;border-color:var(--tui-autofill);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill) inset!important}:host:-webkit-autofill,:host:-webkit-autofill:first-line{font-size:inherit;line-height:inherit}:host::-webkit-caps-lock-indicator,:host::-webkit-contacts-auto-fill-button,:host::-webkit-credit-card-auto-fill-button,:host::-webkit-credentials-auto-fill-button,:host::-webkit-strong-password-auto-fill-button{content:none!important;position:absolute;left:-62.4375rem;top:-62.4375rem;z-index:-999;display:none!important;background:transparent!important;pointer-events:none!important}:host::placeholder{color:var(--tui-text-03);opacity:0}:host._focused:not(._readonly) :host::placeholder,:host-context(tui-primitive-textfield._focused:not(._readonly)) :host::placeholder,:host-context(tui-text-area._focused:not(._readonly)) :host::placeholder{opacity:1}[tuiWrapper][data-mode=onDark] :host:-webkit-autofill,:host :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill,[tuiWrapper][data-mode=onDark] :host:-webkit-autofill:hover,:host :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill:hover,[tuiWrapper][data-mode=onDark] :host:-webkit-autofill:focus,:host :host-context([tuiWrapper][data-mode=\"onDark\"]):-webkit-autofill:focus{caret-color:var(--tui-base-09);border-radius:inherit;color:inherit!important;background-color:transparent!important;-webkit-text-fill-color:var(--tui-text-01-night)!important;border-color:var(--tui-autofill-night);-webkit-box-shadow:0 0 0 100rem var(--tui-autofill-night) inset!important}[tuiWrapper][data-mode=onDark] :host::placeholder,:host :host-context([tuiWrapper][data-mode=\"onDark\"])::placeholder{color:var(--tui-text-03-night)}:host[data-size=s] :host,:host :host-context(tui-primitive-textfield[data-size=\"s\"]):not(tui-primitive-textfield),:host :host-context(tui-text-area[data-size=\"s\"]):not(tui-text-area){padding:0 var(--tui-padding-s)}:host[data-size=l] :host,:host :host-context(tui-primitive-textfield[data-size=\"l\"]):not(tui-primitive-textfield),:host :host-context(tui-text-area[data-size=\"l\"]):not(tui-text-area){padding:0 var(--tui-padding-l)}:host._disabled :host,:host :host-context(tui-primitive-textfield._disabled),:host :host-context(tui-text-area._disabled){pointer-events:none}:host[data-size=l]:not(._label-outside) :host,:host :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1.25rem}:host[data-size=l]:not(._label-outside) :host:-webkit-autofill+.t-content .t-placeholder,:host :host-context(tui-primitive-textfield[data-size=\"l\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.8156rem;transform:translateY(-.625rem)}:host[data-size=m]:not(._label-outside) :host,:host :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield){padding-top:1rem}:host[data-size=m]:not(._label-outside) :host:-webkit-autofill+.t-content .t-placeholder,:host :host-context(tui-primitive-textfield[data-size=\"m\"]:not(._label-outside)):not(tui-primitive-textfield):-webkit-autofill+.t-content .t-placeholder{font-size:.69rem;transform:translateY(-.5rem)}:host._hidden input:host,:host :host-context(tui-primitive-textfield._hidden){opacity:0;text-indent:-10em;-webkit-user-select:none}textarea:host{white-space:pre-wrap}textarea:host :host-context(tui-text-area._ios){padding-left:.8125rem}\n"], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
|
|
947
929
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: TuiTextfieldComponent, decorators: [{
|
|
948
930
|
type: i0.Component,
|
|
949
931
|
args: [{
|