@inspark/inspark-components 1.0.22 → 1.0.24

package/full/bundles/inspark-inspark-components.umd.js

@@ -891,14 +891,21 @@
             this.error = null;
             this.size = 100000;
             this.maxlength = 100000;
-            this.width = 'auto';
+            this.width = '';
+            this.display = false;
+            this.large = true;
+            this.small = false;
+            this.widget = false;
+            this.forms = true;
             this.placeholder = '';
             this.id = null;
             this.testId = null;
             this.opacity = true;
             this.shadow = false;
+            this.right = false;
             this.focus = new core.EventEmitter();
             this.blur = new core.EventEmitter();
+            this.onClick = new core.EventEmitter();
             this.propagateChange = function (_) {
             };
         }
@@ -929,6 +936,9 @@
             // Store the provided function as an internal method.
             this.onTouched = fn;
         };
+        InputTextComponent.prototype.clear = function () {
+            this.onClick.emit('');
+        };
         InputTextComponent.prototype.onChange = function (_) {
             if (this.type === 'number') {
                 this.propagateChange(+this.value);
@@ -972,6 +982,26 @@
             core.Input(),
             __metadata("design:type", Object)
         ], InputTextComponent.prototype, "width", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "display", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "large", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "small", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "widget", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "forms", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Object)
@@ -996,6 +1026,10 @@
             core.Input(),
             __metadata("design:type", Object)
         ], InputTextComponent.prototype, "shadow", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Object)
+        ], InputTextComponent.prototype, "right", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", String)
@@ -1020,10 +1054,14 @@
             core.Output(),
             __metadata("design:type", core.EventEmitter)
         ], InputTextComponent.prototype, "blur", void 0);
+        __decorate([
+            core.Output(),
+            __metadata("design:type", core.EventEmitter)
+        ], InputTextComponent.prototype, "onClick", void 0);
         InputTextComponent = InputTextComponent_1 = __decorate([
             core.Component({
                 selector: 'in-input-text',
-                template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n    <span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\n      <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n        <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n      <span\n        *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n        class=\"constraints-message__warning u-text_uppercase\">\n                     {{'maxlength: ' | translate}} {{maxlength}}</span>\n    </span>\n  <input (blur)=\"this.blur.emit($event)\"\n         (change)=\"onChange($event)\"\n         (focus)=\"this.focus.emit($event)\"\n         (input)=\"onChange($event)\"\n         [(ngModel)]=\"value\"\n         [autocomplete]=\"autocomplete? 'on':'off'\"\n         [disabled]=\"disabled\"\n         [id]=\"id\"\n         [maxlength]=\"maxlength\"\n         [name]=\"name\"\n         [ngClass]=\"{'c-input_opaque' : opacity === false,\n                     'c-input_shadowed' : shadow}\"\n         [placeholder]=\"placeholder\"\n         [required]=\"required\"\n         [size]=\"size\"\n         [min]=\"min\"\n         [max]=\"max\"\n         [step]=\"step\"\n         class=\"c-input c-input_large field_{{id}}\"\n         type=\"text\"\n  />\n</label>\n",
+                template: "<label [ngStyle]=\"{width: width}\" class=\"label type_varchars\">\n    <span *ngIf=\"label\" class=\"c-label__content\">\n        {{label}}\n      <span *ngIf=\"required\" class=\"c-label__req\">*</span>\n        <span *ngIf=\"error\" class=\"c-label__sub_is-error\">{{error}}</span>\n      <span\n        *ngIf=\"maxlength && value && value.length && value.length >= maxlength\"\n        class=\"constraints-message__warning u-text_uppercase\">\n                     {{'maxlength: ' | translate}} {{maxlength}}</span>\n    </span>\n  <form class=\"c-label\">\n    <div class=\"input-wrapper u-margin-right-tiny\" [ngClass]=\"{'u-margin-right-tiny': right}\">\n      <input (blur)=\"this.blur.emit($event)\"\n             (change)=\"onChange($event)\"\n             (focus)=\"this.focus.emit($event)\"\n             (input)=\"onChange($event)\"\n             [(ngModel)]=\"value\"\n             [autocomplete]=\"autocomplete? 'on':'off'\"\n             [disabled]=\"disabled\"\n             [id]=\"id\"\n             [maxlength]=\"maxlength\"\n             [name]=\"name\"\n             [ngClass]=\"{'c-input_opaque' : opacity === false,\n                         'c-input_shadowed' : shadow,\n                         'c-input_large' : large,\n                         'c-input_small' : small,\n                         'c-input_margin_padding': widget,\n                         'c-input_padding_right': forms}\"\n             [ngModelOptions]=\"{standalone: true}\"\n             [placeholder]=\"placeholder\"\n             [required]=\"required\"\n             [size]=\"size\"\n             [min]=\"min\"\n             [max]=\"max\"\n             [step]=\"step\"\n             class=\"search-box c-input c-input_large c-input_small field_{{id}}\"\n             type=\"search\"\n             autofocus=\"\"\n             tabindex=\"1\">\n      <button (click)=\"clear()\"\n              class=\"button-reset empty\"\n              [ngClass]=\"{empty: display}\"\n              type=\"reset\"\n              [attr.title]=\"'Reset' | translate\">\n        <i class=\"fa fa-close\"></i>\n      </button>\n    </div>\n  </form>\n</label>\n",
                 providers: [
                     {
                         provide: forms.NG_VALUE_ACCESSOR,
@@ -1031,7 +1069,7 @@
                         multi: true,
                     }
                 ],
-                styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px 0 rgba(0,0,0,.2)}.constraints-message__warning{color:red}"]
+                styles: ["@charset \"UTF-8\";.label{display:inline-block;margin-bottom:0}.c-input{height:36px}.c-input_opaque{background:var(--colorBgLevel3)}.c-input_shadowed{box-shadow:0 2px 6px 0 rgba(0,0,0,.2)}.constraints-message__warning{color:red}.button-reset{display:flex;align-items:center;position:absolute;right:6px;top:5px;padding:6px;font-size:15px;border:none;outline:0;cursor:pointer;color:var(--colorTextMuted);background-color:transparent}.button-reset:hover{color:var(--ids-theme-btn-default-color,#fff)}.empty{display:none}.input-wrapper{position:relative;display:flex;align-items:baseline}.c-input:not(:valid)~.button-reset{display:none}.c-input_margin_padding{margin-left:56px;padding-right:10px;max-width:1200px}.c-input_padding_right{padding-right:28px}"]
             })
         ], InputTextComponent);
         return InputTextComponent;