vueless 0.0.309 → 0.0.311

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.309",
+  "version": "0.0.311",
   "license": "MIT",
   "description": "Vue Styleless Component Framework.",
   "homepage": "https://vueless.com",

package/ui.button/configs/default.config.js

@@ -152,6 +152,7 @@ export default /*tw*/ {
     variant: "primary",
     tag: "button",
     size: "md",
+    tabindex: 0,
     round: false,
     block: false,
     square: false,

package/ui.button/index.vue

@@ -5,7 +5,7 @@
     ref="buttonRef"
     :disabled="disabled"
     v-bind="buttonAttrs"
-    :tabindex="loading && '-1'"
+    :tabindex="!loading ? tabindex : -1"
     :data-test="dataTest"
   >
     <template v-if="loading">
@@ -161,6 +161,14 @@ const props = defineProps({
     default: "",
   },
 
+  /**
+   * Controls the keyboard “Tab” focus order of elements.
+   */
+  tabindex: {
+    type: String,
+    default: getDefault(defaultConfig, UButton).tabindex,
+  },
+
   /**
    * Fill the background for thirdary variant.
    */

package/ui.form-input-search/configs/default.config.js

@@ -7,6 +7,7 @@ export default /*tw*/ {
     size: "md",
     labelAlign: "topInside",
     debounce: 300,
+    minLength: 0,
     disabled: false,
     readonly: false,
     searchButton: false,

package/ui.form-input-search/index.stories.js

@@ -59,6 +59,9 @@ Default.args = {};
 export const searchButton = DefaultTemplate.bind({});
 searchButton.args = { searchButtonLabel: "Search" };
 
+export const minLength = DefaultTemplate.bind({});
+minLength.args = { minLength: 4 };
+
 export const sizes = EnumVariantTemplate.bind({});
 sizes.args = { enum: "size" };
 

package/ui.form-input-search/index.vue

@@ -168,6 +168,14 @@ const props = defineProps({
     default: "",
   },
 
+  /**
+   * Minimum character length for search.
+   */
+  minLength: {
+    type: [String, Number],
+    default: getDefault(defaultConfig, UInputSearch).minLength,
+  },
+
   /**
    * Search button label.
    */
@@ -250,7 +258,10 @@ const search = computed({
   get: () => props.modelValue,
   set: debounceMethod((value) => {
     localValue.value = value;
-    emit("update:modelValue", value);
+
+    if (localValue.value.length >= Number(props.minLength)) {
+      emit("update:modelValue", value);
+    }
   }, props.debounce),
 });
 

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.309",
+  "version": "0.0.311",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -942,6 +942,15 @@
               },
               "default": "\"\""
             },
+            {
+              "name": "tabindex",
+              "description": "Controls the keyboard “Tab” focus order of elements.",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              },
+              "default": "0"
+            },
             {
               "name": "filled",
               "description": "Fill the background for thirdary variant.",
@@ -5193,6 +5202,15 @@
               },
               "default": "\"\""
             },
+            {
+              "name": "minLength",
+              "description": "Minimum character length for search.",
+              "value": {
+                "kind": "expression",
+                "type": "string|number"
+              },
+              "default": "0"
+            },
             {
               "name": "searchButtonLabel",
               "description": "Search button label.",