@juit/vue-z 0.0.64 → 0.0.66

package/dist/index.css

@@ -32,7 +32,7 @@
 
 /* Suffix behind the input */
 .z-suffix {
-&[data-v-6b64624e] {
+&[data-v-7f2feeca] {
   user-select: none;
   position: absolute;
   top: 0;
@@ -42,9 +42,9 @@
   overflow: hidden;
   font-weight: 500
 }
-.z-suffix-hidden[data-v-6b64624e] { color: transparent
+.z-suffix-hidden[data-v-7f2feeca] { color: transparent
 }
-.z-suffix-visible[data-v-6b64624e] { opacity: 0.5
+.z-suffix-visible[data-v-7f2feeca] { opacity: 0.5
 }
 }
 

package/dist/index.d.ts

@@ -4622,6 +4622,18 @@ readonly type: PropType<boolean | "ondemand">;
 readonly required: false;
 readonly default: undefined;
 };
+/** The debounce time in milliseconds for the input field */
+debounce: {
+type: NumberConstructor;
+required: false;
+default: number;
+};
+/** Clearable, when clicked value will become the empty string */
+clearable: {
+type: BooleanConstructor;
+required: false;
+default: boolean;
+};
 modelValue: {
 type: PropType<string>;
 required: true;
@@ -4657,6 +4669,18 @@ readonly type: PropType<boolean | "ondemand">;
 readonly required: false;
 readonly default: undefined;
 };
+/** The debounce time in milliseconds for the input field */
+debounce: {
+type: NumberConstructor;
+required: false;
+default: number;
+};
+/** Clearable, when clicked value will become the empty string */
+clearable: {
+type: BooleanConstructor;
+required: false;
+default: boolean;
+};
 modelValue: {
 type: PropType<string>;
 required: true;
@@ -4669,6 +4693,8 @@ disabled: boolean | undefined;
 lazyRules: boolean | "ondemand";
 bottomSlots: boolean | undefined;
 readonly: boolean | undefined;
+debounce: number;
+clearable: boolean;
 }, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
 
 declare const __VLS_export_8: DefineComponent<ExtractPropTypes<    {

package/dist/index.js

@@ -1104,12 +1104,14 @@ var text_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE_
 				_props.onClear?.();
 			};
 		});
+		/** A reference to the input field */
+		const nativeEl = computed(() => _qinput.value?.nativeEl);
 		__expose({
 			focus: () => _qinput.value?.focus(),
 			resetValidation: () => _qinput.value?.resetValidation(),
 			validate: () => _qinput.value?.validate() || false,
 			hasError: computed(() => _qinput.value?.hasError || false),
-			nativeEl: computed(() => _qinput.value?.nativeEl),
+			nativeEl,
 			isEditable: _editable,
 			isDisabled: _disabled,
 			isInactive: _inactive,
@@ -1132,7 +1134,10 @@ var text_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE_
 		const _onBeforeinput = (event) => void _emit("beforeinput", event);
 		const _onBlur = (event) => void _emit("blur", event);
 		const _onFocus = (event) => void _emit("focus", event);
-		const _onInput = (event) => void _emit("input", event);
+		function _onInput(event) {
+			if (nativeEl.value.value === "" && _value.value !== "") _update("");
+			_emit("input", event);
+		}
 		const _onKeydown = (event) => void _emit("keydown", event);
 		const _onKeyup = (event) => void _emit("keyup", event);
 		/** "onClick" is only passed through when enabled and we have a listener */
@@ -1182,13 +1187,13 @@ var text_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE_
 		onMounted(() => {
 			if (!_qinput.value) throw new Error("No QInput ref");
 			if (!_helper.value) throw new Error("No ZFormHelper ref");
-			watch(() => _qinput.value?.nativeEl, (newElement, oldElement) => {
+			watch(() => nativeEl.value, (newElement, oldElement) => {
 				_removeEventListeners(oldElement);
 				_addEventListeners(newElement);
 				if (newElement) newElement.inputMode = _props.mode;
 			}, { immediate: true });
 		});
-		onBeforeUnmount(() => _removeEventListeners(_qinput.value?.nativeEl));
+		onBeforeUnmount(() => _removeEventListeners(nativeEl.value));
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1$11, [createVNode(form_helper_default, {
 				ref_key: "_helper",
@@ -1307,7 +1312,7 @@ var text_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE_
 			])]);
 		};
 	}
-}), [["__scopeId", "data-v-6b64624e"]]);
+}), [["__scopeId", "data-v-7f2feeca"]]);
 //#endregion
 //#region lib/inputs/string.vue
 var string_default = /* @__PURE__ */ defineComponent({
@@ -1470,7 +1475,19 @@ var string_default = /* @__PURE__ */ defineComponent({
 var search_default = /* @__PURE__ */ defineComponent({
 	name: "ZControlSearch",
 	__name: "search",
-	props: /* @__PURE__ */ mergeModels(componentFormProps, {
+	props: /* @__PURE__ */ mergeModels({
+		debounce: {
+			type: Number,
+			required: false,
+			default: 750
+		},
+		clearable: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		...componentFormProps
+	}, {
 		"modelValue": {
 			type: String,
 			required: true
@@ -1491,16 +1508,20 @@ var search_default = /* @__PURE__ */ defineComponent({
 				ref: _zstring,
 				modelValue: value.value,
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => value.value = $event),
-				debounce: 750,
+				debounce: __props.debounce,
+				clearable: __props.clearable,
 				label: _ctx.$t(unref(translations).search),
 				icon: unref(icons).search,
 				readonly: _ctx.readonly,
 				"bottom-slots": _ctx.bottomSlots,
 				editable: _ctx.editable,
 				disabled: _ctx.disabled,
-				"lazy-rules": _ctx.lazyRules
+				"lazy-rules": _ctx.lazyRules,
+				onClickIcon: () => {}
 			}, null, 8, [
 				"modelValue",
+				"debounce",
+				"clearable",
 				"label",
 				"icon",
 				"readonly",