@unsource/ui 2.1.4 → 2.2.0

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "unsource-ui",
   "configKey": "unsourceUi",
-  "version": "2.1.4",
+  "version": "2.2.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -47,7 +47,10 @@ const module = defineNuxtModule({
     "nuxt-swiper": {},
     "@vueuse/nuxt": {},
     "@nuxtjs/i18n": {
-      version: "^8.0.0"
+      version: "^10.0.0",
+      defaults: {
+        strategy: "no_prefix"
+      }
     }
   },
   // Default configuration options of the Nuxt module
@@ -63,7 +66,8 @@ const module = defineNuxtModule({
         "numeral",
         "persian-number",
         "ajv",
-        "handlebars"
+        "handlebars",
+        "vue-json-pretty"
       ];
     }
   },

package/dist/runtime/components/UnAuth.d.vue.ts

@@ -0,0 +1,34 @@
+type Props = {
+    logo?: string;
+    head?: string;
+    type: 'login' | 'recover' | 'otp' | 'register';
+    userTypes?: Record<string, string>[];
+    loginType?: 'otp' | 'password';
+    mutiType?: boolean;
+    userParams?: Record<string, string | boolean>;
+    otpPage?: string;
+    redirectPage?: string;
+    profilePage?: string;
+    profileFormPage?: string;
+    loginPage?: string;
+    passLoginPage?: string;
+    successLoginAlert?: string;
+    title?: string;
+    buttonTitle?: string;
+    forgetPassword?: boolean;
+    click?: Record<string, never>;
+    shortHand?: boolean;
+};
+declare var __VLS_29: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_29) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/UnAuth.vue

@@ -0,0 +1,326 @@
+<template>
+  <div class="flex flex-col items-stretch gap-8 grow px-2 py-6 self-stretch">
+    <div class="grow-1 p-3 basis-50">
+      <div
+        v-if="logo"
+        class="flex flex-col items-center children:text-center gap-3 px-4 py-0"
+      >
+        <UnNuxtIcon
+          :name="logo"
+          class="!text-8xl text-primary-500"
+        />
+      </div>
+      <template v-if="['login', 'recover'].includes(type)">
+        <UnAuthInputs
+          v-model="form"
+          :type="type === 'recover' ? type : loginType"
+          :head
+          :have-tabs="true"
+          :login-page
+          :pass-login-page
+          :have-login-type="mutiType"
+        />
+        <div
+          v-if="type === 'login'"
+          class="flex items-center gap-2 mt-4"
+        >
+          <p class="text-(sm gray-600)">
+            با ورود،
+            <NuxtLink
+              to="https://parand.app/terms"
+              target="_blank"
+              class="text-gra-900 font-bold underline"
+            >قوانین و
+              مقررات
+            </NuxtLink>
+            استفاده از اپلیکیشن را میپذیرم
+          </p>
+        </div>
+      </template>
+      <div
+        v-else-if="type === 'otp'"
+        class="flex flex-col items-stretch gap-24"
+      >
+        <div class="flex flex-col items-stretch gap-6">
+          <div class="flex justify-between">
+            <p class="text-(gray-600 lg) font-semibold">
+              {{ $t("\u06A9\u062F \u062A\u0627\u06CC\u06CC\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F") }}
+            </p>
+            <div
+              class="text-xs text-gray-600 underline cursor-pointer"
+              @click="navigateTo({ name: 'login' })"
+            >
+              {{ $t("\u062A\u063A\u06CC\u06CC\u0631 \u0634\u0645\u0627\u0631\u0647 \u0645\u0648\u0628\u0627\u06CC\u0644 ") }}
+            </div>
+          </div>
+          <UnCodeInput
+            v-model="otp"
+            class="flex gap-1 self-center justify-between"
+            @complete="checkOTP"
+          />
+          <div class="flex justify-center items-center gap-2 text-gray-400 text-xs">
+            <p v-if="!isExpired">
+              {{ $t("\u0632\u0645\u0627\u0646 \u0628\u0627\u0642\u06CC\u200C\u0645\u0627\u0646\u062F\u0647: ") }}
+            </p>
+            <p
+              v-else
+              class="text-primary-500 cursor-pointer"
+              @click="sendAgain"
+            >
+              {{ $t("\u0627\u0631\u0633\u0627\u0644 \u0645\u062C\u062F\u062F") }}
+            </p>
+            <UnTimer
+              v-if="!isExpired"
+              :key="expiredAt"
+              v-model="isExpired"
+              :time="expiredAt"
+            />
+          </div>
+        </div>
+        <form>
+          <input
+            v-model="otp"
+            name="one-time-code"
+            class="w-0 h-0"
+            type="text"
+            autocomplete="one-time-code"
+            inputmode="numeric"
+            autofocus
+            pattern="\d{6}"
+          >
+        </form>
+      </div>
+      <slot />
+    </div>
+    <div class="flex flex-col gap-4 p-3 sticky bottom-2">
+      <template v-if="shortHand">
+        <UnAuthShortHand
+          v-if="forgetPassword"
+          :description="$t('\u062D\u0633\u0627\u0628 \u06A9\u0627\u0631\u0628\u0631\u06CC \u0646\u062F\u0627\u0631\u06CC\u062F\u061F ')"
+          :text-link="$t('\u062B\u0628\u062A \u0646\u0627\u0645 \u06A9\u0646\u06CC\u062F')"
+          link="/signup"
+        />
+        <UnAuthShortHand
+          v-else-if="otp"
+          :description="$t('\u0634\u0645\u0627\u0631\u0647 \u062A\u0644\u0641\u0646 \u0627\u0634\u062A\u0628\u0627\u0647 \u0627\u0633\u062A\u061F')"
+          :text-link="$t('\u0648\u06CC\u0631\u0627\u06CC\u0634')"
+          :link="`/login?type=${route.query.type || 'personal'}`"
+        />
+        <UnAuthShortHand
+          v-else
+          :description="$t('\u062D\u0633\u0627\u0628 \u06A9\u0627\u0631\u0628\u0631\u06CC \u062F\u0627\u0631\u06CC\u062F\u061F ')"
+          :text-link="$t('\u0648\u0627\u0631\u062F \u0634\u0648\u06CC\u062F')"
+          link="/login"
+        />
+      </template>
+      <UnButton
+        :loading="loading"
+        :label="buttonTitle || ButtonTitle"
+        :disable="disable"
+        variant="primary-fill"
+        @click="submit"
+      />
+    </div>
+  </div>
+  <UnLog :data="form" />
+</template>
+
+<script setup>
+import {
+  computed,
+  navigateTo,
+  onMounted,
+  p2e,
+  ref,
+  useCookie,
+  useI18n,
+  useNuxtApp,
+  usePost,
+  useRoute,
+  useToken,
+  useUser,
+  useUserId
+} from "#imports";
+const { successLoginAlert = "\u062E\u0648\u0634 \u0622\u0645\u062F\u06CC\u062F", redirectPage = "index", profilePage = "profile", profileFormPage, otpPage = "login-otp", type, loginType = "password", userParams = {} } = defineProps({
+  logo: { type: String, required: false },
+  head: { type: String, required: false },
+  type: { type: String, required: true },
+  userTypes: { type: Array, required: false },
+  loginType: { type: String, required: false },
+  mutiType: { type: Boolean, required: false },
+  userParams: { type: Object, required: false },
+  otpPage: { type: String, required: false },
+  redirectPage: { type: String, required: false },
+  profilePage: { type: String, required: false },
+  profileFormPage: { type: String, required: false },
+  loginPage: { type: String, required: false },
+  passLoginPage: { type: String, required: false },
+  successLoginAlert: { type: String, required: false },
+  title: { type: String, required: false },
+  buttonTitle: { type: String, required: false },
+  forgetPassword: { type: Boolean, required: false },
+  click: { type: Object, required: false },
+  shortHand: { type: Boolean, required: false }
+});
+const route = useRoute();
+const { $toast } = useNuxtApp();
+const { t } = useI18n();
+const loading = ref(false);
+const phoneNumber = useCookie("phoneNumber");
+const form = ref({});
+const expiredAt = useCookie("expiredAt", {
+  maxAge: 365 * 24 * 60 * 60 * 1e3
+});
+const ButtonTitle = computed(
+  () => type === "login" && loginType == "otp" ? t("\u0627\u0631\u0633\u0627\u0644 \u06A9\u062F") : type === "login" && loginType == "password" ? t("\u0648\u0631\u0648\u062F") : type === "otp" ? t("\u062A\u0627\u06CC\u06CC\u062F") : type === "recover" ? t("\u062B\u0628\u062A") : type === "register" ? t("\u062B\u0628\u062A \u0646\u0627\u0645") : ""
+);
+const isValid = computed(() => form.value.phoneNumber && form.value.phoneNumber?.length === 11);
+const loginByOtp = async () => {
+  if (!isValid.value || loading.value) return;
+  loading.value = true;
+  const { result } = await usePost("/login-by-phone-otp", {
+    phoneNumber: p2e(form.value.phoneNumber)
+    // template: template[config.userType]
+  });
+  if (result) {
+    expiredAt.value = result.expiredAt;
+    phoneNumber.value = p2e(form.value.phoneNumber);
+    await navigateTo({ name: otpPage, query: route.query });
+  }
+  loading.value = false;
+};
+const otp = ref("");
+const token = useToken();
+const userId = useUserId();
+if (["login", "register"].includes(type) && token.value && userId.value) {
+  navigateTo({ name: redirectPage });
+}
+const user = useUser();
+const isExpired = ref(false);
+const disable = computed(
+  () => type === "login" && loginType == "otp" ? !form.value?.phoneNumber : type === "login" && loginType == "password" ? !form.value?.phoneNumber || !form.value?.password : type === "otp" ? otp.value?.length < 6 : type === "recover" ? !form.value?.password || !form.value?.confirmedPassword || form.value?.password !== form.value?.confirmedPassword : type === "register" ? !form.value?.phoneNumber || !form.value?.password : false
+);
+let ac;
+const getOtpFromPhone = async () => {
+  if (ac) {
+    ac.abort();
+  }
+  ac = new AbortController();
+  if ("OTPCredential" in window) {
+    navigator.credentials.get({
+      otp: { transport: ["sms"] },
+      signal: ac.signal
+    }).then((e) => {
+      otp.value = e.code;
+      checkOTP(otp.value);
+    });
+  }
+};
+const checkOTP = async (code = "") => {
+  if (loading.value) return;
+  loading.value = true;
+  const { result } = await usePost("/get-token-by-otp", { phoneNumber: phoneNumber.value, code: code || otp.value }, {
+    params: {
+      "with-profile": true,
+      ...userParams
+    },
+    headers: {
+      "no-error": true
+    }
+  });
+  if (result) {
+    token.value = result.token.type + " " + result.token.token;
+    userId.value = result.user.id;
+    user.value = result.user;
+    if (result.user.profile || !profileFormPage) {
+      navigateTo({ name: profilePage });
+    } else {
+      navigateTo({ name: profileFormPage || "profile-form" });
+    }
+    $toast.success(successLoginAlert);
+  } else {
+    $toast.success(t("\u06A9\u062F \u0648\u0627\u0631\u062F \u0634\u062F\u0647 \u0635\u062D\u06CC\u062D \u0646\u0645\u06CC\u0628\u0627\u0634\u062F."));
+    loading.value = false;
+  }
+};
+const sendAgain = async () => {
+  if (loading.value) return;
+  loading.value = true;
+  const { result } = await usePost("/login-by-phone-otp", {
+    phoneNumber: phoneNumber.value
+  });
+  if (result) {
+    getOtpFromPhone();
+    expiredAt.value = result.expiredAt;
+    isExpired.value = false;
+    $toast.success("\u06A9\u062F \u0628\u0627 \u0645\u0648\u0641\u0642\u06CC\u062A \u0627\u0631\u0633\u0627\u0644 \u0634\u062F");
+  }
+  loading.value = false;
+};
+const setPassword = async () => {
+  if (loading.value) return;
+  loading.value = true;
+  const { result } = await usePost("/set-pass", {
+    password: form.value.password
+  }, {
+    headers: {
+      "no-error": true
+    }
+  });
+  if (result) {
+    $toast.success("\u0631\u0645\u0632 \u0639\u0628\u0648\u0631 \u0628\u0627 \u0645\u0648\u0641\u0642\u06CC\u062A \u062A\u063A\u06CC\u06CC\u0631 \u06CC\u0627\u0641\u062A");
+    navigateTo({ name: "profile" });
+  } else {
+    $toast.success("\u0631\u0645\u0632 \u0628\u0627\u06CC\u062F \u062D\u062F\u0627\u0642\u0644 8 \u06A9\u0627\u0631\u0627\u06A9\u062A\u0631 \u0628\u0627\u0634\u062F.");
+    loading.value = false;
+  }
+  loading.value = false;
+};
+const loginByPass = async () => {
+  if (loading.value) return;
+  loading.value = true;
+  const { result } = await usePost("/login-by-pass", {
+    phoneNumber: p2e(form.value.phoneNumber),
+    password: form.value.password
+  }, {
+    params: {
+      "with-profile": true,
+      ...userParams
+    },
+    headers: {
+      "no-error": true
+    }
+  });
+  if (result) {
+    token.value = result.token.type + " " + result.token.token;
+    userId.value = result.user.id;
+    user.value = result.user;
+    if (result.user.profile || !profileFormPage) {
+      navigateTo({ name: profilePage });
+    } else {
+      navigateTo({ name: profileFormPage || "profile-form" });
+    }
+    $toast.success(successLoginAlert);
+  } else {
+    $toast.error("\u0627\u0637\u0644\u0627\u0639\u0627\u062A \u0648\u0627\u0631\u062F \u0634\u062F\u0647 \u0635\u062D\u06CC\u062D \u0646\u0645\u06CC\u0628\u0627\u0634\u062F.");
+    loading.value = false;
+  }
+};
+const submit = async () => {
+  if (type === "login" && loginType === "otp") {
+    return loginByOtp();
+  }
+  if (type === "login" && loginType === "password") {
+    return loginByPass();
+  }
+  if (type === "recover") {
+    return setPassword();
+  }
+  if (type === "otp") {
+    return checkOTP();
+  }
+};
+onMounted(() => {
+  getOtpFromPhone();
+});
+</script>

package/dist/runtime/components/UnAuth.vue.d.ts

@@ -0,0 +1,34 @@
+type Props = {
+    logo?: string;
+    head?: string;
+    type: 'login' | 'recover' | 'otp' | 'register';
+    userTypes?: Record<string, string>[];
+    loginType?: 'otp' | 'password';
+    mutiType?: boolean;
+    userParams?: Record<string, string | boolean>;
+    otpPage?: string;
+    redirectPage?: string;
+    profilePage?: string;
+    profileFormPage?: string;
+    loginPage?: string;
+    passLoginPage?: string;
+    successLoginAlert?: string;
+    title?: string;
+    buttonTitle?: string;
+    forgetPassword?: boolean;
+    click?: Record<string, never>;
+    shortHand?: boolean;
+};
+declare var __VLS_29: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_29) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/UnAuthInputs.d.vue.ts

@@ -0,0 +1,23 @@
+import type { TabItem } from './UnTab.vue.js';
+type __VLS_Props = {
+    type?: 'recover' | 'otp' | 'password';
+    userTypes?: TabItem[];
+    head?: string;
+    description?: string;
+    haveLoginType?: boolean;
+    forgetPass?: boolean;
+    loginPage?: string;
+    passLoginPage?: string;
+    forgetPage?: string;
+};
+type __VLS_ModelProps = {
+    modelValue: Record<string, any>;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: Record<string, any>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Record<string, any>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/UnAuthInputs.vue

@@ -0,0 +1,86 @@
+<template>
+  <div class="flex flex-col items-stretch gap-6">
+    <div class="flex justify-between items-center">
+      <p class="text-(gray-600 2xl) font-semibold">
+        {{ head }}
+      </p>
+      <NuxtLink
+        v-if="haveLoginType"
+        :to="{ name: type === 'password' ? loginPage : passLoginPage, query: { role: route.query.role } }"
+        class="text-xs text-primary-500 underline cursor-pointer"
+      >
+        {{ type === "password" ? $t("\u0648\u0631\u0648\u062F \u0628\u0627 \u06A9\u062F \u06CC\u06A9\u0628\u0627\u0631 \u0645\u0635\u0631\u0641") : $t("\u0648\u0631\u0648\u062F \u0628\u0627 \u0631\u0645\u0632 \u0639\u0628\u0648\u0631") }}
+      </NuxtLink>
+    </div>
+    <p
+      v-if="description"
+      class="text-(gray-600 base)"
+    >
+      {{ description }}
+    </p>
+    <UnTab
+      v-if="userTypes?.length"
+      route-target="query"
+      routable
+      mini
+      :items="userTypes"
+      class="self-start"
+    />
+    <UnNormalInput
+      v-if="type !== 'recover'"
+      v-model="modelValue.phoneNumber"
+      :placeholder="$t('\u0634\u0645\u0627\u0631\u0647 \u0645\u0648\u0628\u0627\u06CC\u0644')"
+      input-mode="numeric"
+    />
+    <template v-if="haveLoginType && type === 'password'">
+      <UnNormalInput
+        v-model="modelValue.password"
+        :placeholder="$t('\u0631\u0645\u0632 \u0639\u0628\u0648\u0631')"
+        input-type="password"
+        :password="true"
+      />
+      <NuxtLink
+        v-if="forgetPass"
+        :to="{ name: forgetPage }"
+        class="text-sm text-gray-400 underline cursor-pointer flex justify-center items-center"
+      >
+        {{ $t("\u0641\u0631\u0627\u0645\u0648\u0634\u06CC \u0631\u0645\u0632 \u0639\u0628\u0648\u0631") }}
+      </NuxtLink>
+    </template>
+    <template v-if="type === 'recover'">
+      <UnNormalInput
+        v-model="modelValue.password"
+        :placeholder="$t('\u0631\u0645\u0632 \u0639\u0628\u0648\u0631')"
+        input-type="password"
+        :password="true"
+      />
+      <UnNormalInput
+        v-model="modelValue.confirmedPassword"
+        :placeholder="$t('\u062A\u06A9\u0631\u0627\u0631 \u0631\u0645\u0632 \u0639\u0628\u0648\u0631')"
+        input-type="password"
+        :password="true"
+      />
+    </template>
+  </div>
+</template>
+
+<script setup>
+import { useRoute } from "#imports";
+const route = useRoute();
+const {
+  forgetPage = "forget-password",
+  loginPage = "login",
+  passLoginPage = "login-pass"
+} = defineProps({
+  type: { type: String, required: false },
+  userTypes: { type: Array, required: false },
+  head: { type: String, required: false },
+  description: { type: String, required: false },
+  haveLoginType: { type: Boolean, required: false },
+  forgetPass: { type: Boolean, required: false },
+  loginPage: { type: String, required: false },
+  passLoginPage: { type: String, required: false },
+  forgetPage: { type: String, required: false }
+});
+const modelValue = defineModel({ type: Object, ...{ required: true } });
+</script>

package/dist/runtime/components/UnAuthInputs.vue.d.ts

@@ -0,0 +1,23 @@
+import type { TabItem } from './UnTab.vue.js';
+type __VLS_Props = {
+    type?: 'recover' | 'otp' | 'password';
+    userTypes?: TabItem[];
+    head?: string;
+    description?: string;
+    haveLoginType?: boolean;
+    forgetPass?: boolean;
+    loginPage?: string;
+    passLoginPage?: string;
+    forgetPage?: string;
+};
+type __VLS_ModelProps = {
+    modelValue: Record<string, any>;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: Record<string, any>) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Record<string, any>) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/UnAuthShortHand.d.vue.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    link?: string;
+    textLink: string;
+    description?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/UnAuthShortHand.vue

@@ -0,0 +1,19 @@
+<template>
+  <p class="text-(xs text) font-extrabold gap-1">
+    {{ description }}
+    <NuxtLink
+      :to="link || '#'"
+      class="text-primary-500"
+    >
+      {{ textLink }}
+    </NuxtLink>
+  </p>
+</template>
+
+<script setup>
+defineProps({
+  link: { type: String, required: false },
+  textLink: { type: String, required: true },
+  description: { type: String, required: false }
+});
+</script>

package/dist/runtime/components/UnAuthShortHand.vue.d.ts

@@ -0,0 +1,8 @@
+type __VLS_Props = {
+    link?: string;
+    textLink: string;
+    description?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/UnCodeInput.d.vue.ts

@@ -0,0 +1,6 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {
+    $emit: typeof emit;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const emit: (event: "complete" | "change", ...args: any[]) => void;

package/dist/runtime/components/UnCodeInput.vue

@@ -0,0 +1,31 @@
+<template>
+  <v-otp-input
+    id="code-input"
+    ref="otpInput"
+    :value="value"
+    dir="ltr"
+    input-classes="otp-input"
+    separator=""
+    :num-inputs="6"
+    :should-auto-focus="true"
+    :is-input-num="true"
+    @on-change="onChange"
+    @on-complete="emit('complete', $event)"
+  />
+</template>
+
+<script setup>
+import VOtpInput from "vue3-otp-input";
+const emit = defineEmits(["complete", "change"]);
+const value = defineModel();
+const onChange = ($event) => {
+  value.value = $event;
+  emit("change");
+};
+</script>
+
+<style>
+#code-input .otp-input {
+  @apply w-15 h-15 bg-white b-rd-2 text-center gap-2 <md:(w-12 h-12);
+}
+</style>

package/dist/runtime/components/UnCodeInput.vue.d.ts

@@ -0,0 +1,6 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {
+    $emit: typeof emit;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const emit: (event: "complete" | "change", ...args: any[]) => void;

package/dist/runtime/components/UnFormItem.vue

@@ -56,10 +56,9 @@
     <UnSelect
       v-else-if="Type === 'select' && options?.length"
       v-model="modelValue"
-      :options="options"
+      :items="options.map((e) => ({ title: e.title, value: e.key }))"
+      value-key="value"
       :light="true"
-      value-key="key"
-      label-key="title"
       :searchable="true"
       :disabled="item.disabled"
       :is-error

package/dist/runtime/components/UnIRDatePicker.vue

@@ -21,7 +21,7 @@
               value ? moment(value, format[type]).locale(locale).format(display[type]) : focused ? "" : placeholder
             }}
           </p>
-          <TheNuxtIcon
+          <UnNuxtIcon
             name="solar:close-circle-bold-duotone"
             class="text-5 c-gray-400"
             @click.prevent.stop="emit('append')"