@kws3/ui 2.1.2 → 2.1.3

package/CHANGELOG.mdx

@@ -1,3 +1,7 @@
+# 2.1.3
+ - `PasswordInput` - add support for field `autocomplete` and `required`
+ - `PasswordValidator` - fix `valid` field binding
+
 # 2.1.2
  - `PasswordInput` - add support for field `name`
  - `PasswordInput` - fix spacing when icons are turned off

package/forms/PasswordInput.svelte

@@ -26,6 +26,8 @@ This property can be bound to, to fetch the current value, Default: ``
   @param {ColorOptions} [color=] - Colour of the PasswordInput, Default: ``
   @param {string} [style=""] - Inline CSS for the PasswordInput, Default: `""`
   @param {boolean} [disabled=false] - Disables the PasswordInput, Default: `false`
+  @param {boolean} [required=false] - Whether Input is required or not, Default: `false`
+  @param {string} [autocomplete="on"] - Whether autocompletion turned off or on, Default: `"on"`
   @param {string} [placeholder=""] - Input placeholder, Default: `""`
   @param {string} [name="password"] - Input HTML name, Default: `"password"`
   @param {string} [class=""] - CSS classes of the PasswordInput, Default: `""`
@@ -52,6 +54,8 @@ This property can be bound to, to fetch the current value, Default: ``
       bind:this={PASSWORD_INPUT}
       {style}
       bind:value
+      {autocomplete}
+      {required}
       class="input is-{size} is-{color} {klass} {style}"
       on:focus
       on:blur
@@ -198,6 +202,16 @@ This property can be bound to, to fetch the current value, Default: ``
    * @type {boolean}
    */
   export let disabled = false;
+  /**
+   * Whether Input is required or not
+   * @type {boolean}
+   */
+  export let required = false;
+  /**
+   * Whether autocompletion turned off or on
+   * @type {string}
+   */
+  export let autocomplete = "on";
   /**
    * Input placeholder
    * @type {string}

package/forms/PasswordValidator/PasswordValidator.svelte

@@ -210,11 +210,7 @@ Should be used with `bind` from parent component, Default: `false`
 
   $: result = validate(password, sanitizedOptions);
 
-  $: {
-    if (result.overall) {
-      valid = true;
-    }
-  }
+  $: valid = result && result.overall;
 
   function getSanitizedCustomRules(cr) {
     return cr.map((el) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kws3/ui",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "description": "UI components for use with Svelte v3 applications.",
   "main": "index.js",
   "svelte": "index.js",
@@ -35,5 +35,5 @@
   "devDependencies": {
     "typescript": "^5.0.4"
   },
-  "gitHead": "6e176377097da881f3ee68c763f007020b35cb2a"
+  "gitHead": "021ed6b77f9600a544b6fe567104887a0a3f0358"
 }