@kigi/components 1.27.2-alpha → 1.27.4-alpha

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kigi/components",
-  "version": "1.27.2-alpha",
+  "version": "1.27.4-alpha",
   "description": "@kigi/components",
   "main": "src/components/index.ts",
   "scripts": {

package/src/components/mbg-input-password/mbg-input-password.html

@@ -1,16 +1,21 @@
 <div class="mbg-input-wrapper mb-input-password-wrapper"
      ng-if="$ctrl.props">
-    <input type="password"
-           autocomplete="new-password"
-           autocorrect="new-password"
-           ng-model="$ctrl.ngModel"
-           ng-change="$ctrl.onChange()"
-           ng-required="$ctrl.ngRequired"
-           ng-disabled="$ctrl.ngDisabled"
-           ng-blur="$ctrl.ngBlur({ $event })"
-           ng-focus="$ctrl.ngFocus({ $event })"
-           ng-keyup="$ctrl.ngKeyup({ $event })"
-           ng-keypress="$ctrl.ngKeypress({ $event })"
-           ng-keydown="$ctrl.ngKeydown({ $event })"
-           placeholder="{{ $ctrl.props.placeholder }}" />
+  <input type="{{$ctrl.show ? 'text' : 'password' }}"
+         autocomplete="new-password"
+         autocorrect="new-password"
+         ng-model="$ctrl.ngModel"
+         ng-change="$ctrl.onChange()"
+         ng-required="$ctrl.ngRequired"
+         ng-disabled="$ctrl.ngDisabled"
+         ng-blur="$ctrl.ngBlur({ $event })"
+         ng-focus="$ctrl.ngFocus({ $event })"
+         ng-keyup="$ctrl.ngKeyup({ $event })"
+         ng-keypress="$ctrl.ngKeypress({ $event })"
+         ng-keydown="$ctrl.ngKeydown({ $event })"
+         ng-class="{'has-btn-toggle-password' : $ctrl.showBtnPassword}"
+         placeholder="{{ $ctrl.props.placeholder }}" />
+  <a ng-click="$ctrl.show = !$ctrl.show"
+     ng-if="$ctrl.showBtnPassword">
+    <i class="fas {{$ctrl.show ? 'fa-eye' : 'fa-eye-slash' }}"></i>
+  </a>
 </div>

package/src/components/mbg-input-password/mbg-input-password.scss

@@ -1,3 +1,14 @@
-// .mbg-input-password-wrapper {
-   
-// }
+.mbg-input-wrapper {
+    position: relative;
+    input {
+        &.has-btn-toggle-password {
+            padding-right: 30px;
+
+        }
+    }
+    a {
+        position: absolute;
+        right: 0;
+        padding: 13px 10px;  
+    } 
+}

package/src/components/mbg-input-password/mbg-input-password.ts

@@ -2,41 +2,46 @@ import './mbg-input-password.scss'
 import template from './mbg-input-password.html'
 
 class MbgInputPasswordController {
-    private ngChange
-    private ngModel
-    private ngRequired
-    private ngDisabled
-    private props
+  private ngChange
+  private ngModel
+  private ngRequired
+  private ngDisabled
+  private props
 
-    constructor(public $scope, public $element, public $attrs) {
-        if ($attrs.ngRequired === '') { this.ngRequired = true }
-        if ($attrs.ngDisabled === '') { this.ngDisabled = true }
-        this.props = {
-            placeholder: $attrs.placeholder || '',
-        }
+  constructor(public $scope, public $element, public $attrs) {
+    if ($attrs.ngRequired === '') {
+      this.ngRequired = true
     }
-    onChange() {
-        if (this.ngChange) {
-            this.ngChange({})
-        }
+    if ($attrs.ngDisabled === '') {
+      this.ngDisabled = true
     }
+    this.props = {
+      placeholder: $attrs.placeholder || '',
+    }
+  }
+  onChange() {
+    if (this.ngChange) {
+      this.ngChange({})
+    }
+  }
 }
-MbgInputPasswordController.$inject = ['$scope', '$element', '$attrs']
+MbgInputPasswordController['$inject'] = ['$scope', '$element', '$attrs']
 
 const mbgInputPassword = {
-    bindings: {
-        ngModel: '=',
-        ngChange: '&?',
-        ngRequired: '=?',
-        ngDisabled: '=?',
-        ngBlur: '&?',
-        ngFocus: '&?',
-        ngKeyup: '&?',
-        ngKeypress: '&?',
-        ngKeydown: '&?',
-    },
-    template,
-    controller: MbgInputPasswordController,
+  bindings: {
+    ngModel: '=',
+    ngChange: '&?',
+    ngRequired: '=?',
+    ngDisabled: '=?',
+    ngBlur: '&?',
+    ngFocus: '&?',
+    ngKeyup: '&?',
+    ngKeypress: '&?',
+    ngKeydown: '&?',
+    showBtnPassword: '=?',
+  },
+  template,
+  controller: MbgInputPasswordController,
 }
 
 export { mbgInputPassword }

package/src/components/mbg-input-text/mbg-input-text.html

@@ -1,12 +1,11 @@
 <div class="mbg-input-wrapper mb-input-text-wrapper"
      ng-if="$ctrl.props">
-     <input type="text"
-            ng-model="$ctrl.ngModel"
-            ng-change="$ctrl.onChange($event)"
-            ng-required="$ctrl.ngRequired"
-            ng-disabled="$ctrl.ngDisabled"
-            ng-blur="$ctrl.ngBlur({ $event })"
-            ng-focus="$ctrl.ngFocus({ $event })"
-            placeholder="{{ $ctrl.placeholder }}"
-            maxlength="{{$ctrl.maxLength}}" />
+    <input type="text"
+           ng-model="$ctrl.ngModel"
+           ng-change="$ctrl.onChange($event)"
+           ng-required="$ctrl.ngRequired"
+           ng-disabled="$ctrl.ngDisabled"
+           ng-blur="$ctrl.ngBlur({ $event })"
+           ng-focus="$ctrl.ngFocus({ $event })"
+           placeholder="{{ $ctrl.placeholder }}" />
 </div>

package/src/components/mbg-input-text/mbg-input-text.ts

@@ -72,7 +72,6 @@ const mbgInputText = {
     ngKeypress: '&?',
     ngKeydown: '&?',
     capitalize: '=?',
-    maxLength: '@?',
   },
   template,
   controller: MbgInputTextController,