@winchsa/ui 0.1.31 → 0.1.34

package/dist/components/forms/AppCombobox.vue

@@ -7,23 +7,16 @@ defineOptions({
   inheritAttrs: false
 });
 const { t } = useI18n();
+const attrs = useAttrs();
+const uid = Math.random().toString(36).slice(2, 7);
+const label = computed(() => attrs.label);
+const langLabel = computed(() => label.value ? t(label.value) : "");
 const elementId = computed(() => {
-  const attrs = useAttrs();
-  const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `app-combobox-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
+  const token = attrs.id || label.value;
+  return token ? `app-combobox-${token}-${uid}` : void 0;
 });
-const label = computed(() => useAttrs()?.label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
 const placeholder = computed(() => {
-  if (useAttrs()?.placeholder) {
-    return useAttrs()?.placeholder;
-  }
-  if (label.value) {
-    return t("inputs.placeholder", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
 </script>
 
@@ -36,7 +29,7 @@ const placeholder = computed(() => {
       v-if="label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis"
-      :text="LangLabel"
+      :text="langLabel"
     />
 
     <VCombobox

package/dist/components/forms/AppNumberField.d.vue.ts

@@ -1,5 +1,5 @@
 type __VLS_Props = {
-    modelValue?: string | null;
+    modelValue?: string | null | number;
 };
 declare var __VLS_17: string | number, __VLS_18: any;
 type __VLS_Slots = {} & {

package/dist/components/forms/AppNumberField.vue

@@ -2,43 +2,37 @@
 import { ref, watch, useAttrs, computed } from "vue";
 import { VTextField, VLabel } from "vuetify/components";
 import { useI18n } from "vue-i18n";
+const { t } = useI18n();
+const attrs = useAttrs();
 defineOptions({
   name: "AppTextField",
   inheritAttrs: false
 });
 const props = defineProps({
-  modelValue: { type: [String, null], required: false, default: null }
+  modelValue: { type: [String, null, Number], required: false, default: null }
 });
-const { t } = useI18n();
+const emit = defineEmits(["update:modelValue"]);
 const numberValue = ref(null);
+const uid = Math.random().toString(36).slice(2, 7);
+const toDigits = (value) => {
+  return String(value ?? "").replace(/\D/g, "") || null;
+};
+const label = computed(() => attrs.label);
+const langLabel = computed(() => label.value ? t(label.value) : "");
 const elementId = computed(() => {
-  const attrs = useAttrs();
-  const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `AppTextField-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
+  const token = attrs.id || label.value;
+  return token ? `AppTextField-${token}-${uid}` : void 0;
 });
-const label = computed(() => useAttrs()?.label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
-const emit = defineEmits(["update:modelValue"]);
 const placeholder = computed(() => {
-  if (useAttrs()?.placeholder) {
-    return useAttrs()?.placeholder;
-  }
-  if (label.value) {
-    return t("inputs.placeholder", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
-watch(() => props.modelValue, () => {
-  numberValue.value = props.modelValue?.replace(/\D/g, "");
+watch(() => props.modelValue, (val) => {
+  numberValue.value = toDigits(val);
   emit("update:modelValue", numberValue.value);
-}, {
-  immediate: true
-});
+}, { immediate: true });
 const validateInput = (event) => {
   const input = event.target;
-  numberValue.value = numberValue.value?.replace(/\D/g, "") ?? null;
+  numberValue.value = toDigits(numberValue.value);
   input.value = numberValue.value ?? "";
   emit("update:modelValue", numberValue.value);
 };
@@ -53,7 +47,7 @@ const validateInput = (event) => {
       v-if="label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
-      :text="LangLabel"
+      :text="langLabel"
     />
     <VTextField
       v-bind="{

package/dist/components/forms/AppNumberField.vue.d.ts

@@ -1,5 +1,5 @@
 type __VLS_Props = {
-    modelValue?: string | null;
+    modelValue?: string | null | number;
 };
 declare var __VLS_17: string | number, __VLS_18: any;
 type __VLS_Slots = {} & {

package/dist/components/forms/AppSelect.vue

@@ -9,22 +9,15 @@ defineOptions({
 const { t } = useI18n();
 const attrs = useAttrs();
 const emit = defineEmits(["update:model-value"]);
+const uid = Math.random().toString(36).slice(2, 7);
+const label = computed(() => attrs.label);
+const langLabel = computed(() => label.value ? t(label.value) : "");
 const elementId = computed(() => {
-  const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `app-select-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
+  const token = attrs.id || label.value;
+  return token ? `app-select-${token}-${uid}` : void 0;
 });
-const label = computed(() => attrs?.label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
 const placeholder = computed(() => {
-  if (attrs?.placeholder) {
-    return attrs?.placeholder;
-  }
-  if (label.value) {
-    return t("inputs.placeholder_select", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return attrs.placeholder || (label.value ? t("inputs.placeholder_select", { name: langLabel.value }) : "");
 });
 const handleMenuToggle = ($event) => {
   const container = document.getElementsByClassName("v-overlay-container");
@@ -49,7 +42,7 @@ const handleMenuToggle = ($event) => {
       v-if="label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
-      :text="LangLabel"
+      :text="langLabel"
     />
 
     <VSelect

package/dist/components/forms/AppTextField.vue

@@ -7,23 +7,16 @@ defineOptions({
   inheritAttrs: false
 });
 const { t } = useI18n();
+const attrs = useAttrs();
+const uid = Math.random().toString(36).slice(2, 7);
+const label = computed(() => attrs.label);
+const langLabel = computed(() => label.value ? t(label.value) : "");
 const elementId = computed(() => {
-  const attrs = useAttrs();
-  const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `AppTextField-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
+  const token = attrs.id || label.value;
+  return token ? `AppTextField-${token}-${uid}` : void 0;
 });
-const label = computed(() => useAttrs()?.label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
 const placeholder = computed(() => {
-  if (useAttrs()?.placeholder) {
-    return useAttrs()?.placeholder;
-  }
-  if (label.value) {
-    return t("inputs.placeholder", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
 </script>
 
@@ -36,7 +29,7 @@ const placeholder = computed(() => {
       v-if="label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
-      :text="LangLabel"
+      :text="langLabel"
     />
     <VTextField
       v-bind="{

package/dist/components/forms/AppTextarea.vue

@@ -7,23 +7,16 @@ defineOptions({
   inheritAttrs: false
 });
 const { t } = useI18n();
+const attrs = useAttrs();
+const uid = Math.random().toString(36).slice(2, 7);
+const label = computed(() => attrs.label);
+const langLabel = computed(() => label.value ? t(label.value) : "");
 const elementId = computed(() => {
-  const attrs = useAttrs();
-  const _elementIdToken = attrs.id || attrs.label;
-  return _elementIdToken ? `app-textarea-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
+  const token = attrs.id || label.value;
+  return token ? `app-textarea-${token}-${uid}` : void 0;
 });
-const label = computed(() => useAttrs()?.label);
-const LangLabel = computed(() => label.value ? t(label.value) : "");
 const placeholder = computed(() => {
-  if (useAttrs()?.placeholder) {
-    return useAttrs()?.placeholder;
-  }
-  if (label.value) {
-    return t("inputs.placeholder", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return attrs.placeholder || (label.value ? t("inputs.placeholder", { name: langLabel.value }) : "");
 });
 </script>
 
@@ -36,7 +29,7 @@ const placeholder = computed(() => {
       v-if="label"
       :for="elementId"
       class="mb-2 text-body-2 text-high-emphasis"
-      :text="LangLabel"
+      :text="langLabel"
     />
     <VTextarea
       v-bind="{

package/dist/components/forms/DatePicker.vue

@@ -42,17 +42,9 @@ const elementId = computed(() => {
   const _elementIdToken = attrs.id || attrs.label;
   return _elementIdToken ? `AppTextField-${_elementIdToken}-${guid}` : `datepicker-${_elementIdToken}-${guid}`;
 });
-const LangLabel = computed(() => props.label ? t(props.label) : "");
+const langLabel = computed(() => props.label ? t(props.label) : "");
 const placeholder = computed(() => {
-  if (props.placeholder) {
-    return props.placeholder;
-  }
-  if (LangLabel.value) {
-    return t("inputs.placeholder_select", {
-      name: LangLabel.value
-    });
-  }
-  return "";
+  return props.placeholder || (langLabel.value ? t("inputs.placeholder_select", { name: langLabel.value }) : "");
 });
 const localeConfig = computed(() => ({
   id: locale.value,
@@ -194,7 +186,7 @@ onBeforeUnmount(() => {
     <VLabel
       v-if="forcedLabel || label"
       class="text-body-2 text-high-emphasis mb-2"
-      :text="forcedLabel ? forcedLabel : LangLabel"
+      :text="forcedLabel || langLabel"
     />
     <div dir="ltr" class="h-100">
       <div :dir="locale === 'en' ? 'ltr' : 'rtl'" class="d-flex justify-center align-center gap-2 h-100">

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@winchsa/ui",
-  "version": "0.1.31",
+  "version": "0.1.34",
   "type": "module",
   "private": false,
   "publishConfig": {