@unsource/ui 1.0.2 → 1.2.0

package/dist/runtime/components/Un/Map.vue

@@ -0,0 +1,153 @@
+<template>
+  <ClientOnly>
+    <div class="relative h-full z-1">
+      <NeshanMap
+          ref="map"
+          :mapKey="NESHAN_WEB_KEY"
+          :service-key="NESHAN_API_KEY"
+          class="h-100"
+          :poi="true"
+          :traffic="true"
+          default-type="dreamy-gold"
+          :zoom="15"
+          :hide-search-container="true"
+          :hide-layers="true"
+          :cluster="true"
+          :center="center"
+          :reverse-on-click="false"
+          :popup-on-marker-hover="false"
+      />
+      <div
+          class="absolute left-1/50 top-1/40 flex flex-col rounded-2xl gap-1 items-center select-none
+           text-primary-500 children:(bg-primary w-8 h-8 p-1 flex justify-center items-center rounded-2xl cursor-pointer) z-[999999]">
+        <TheNuxtIcon @click="zoom(1)" name="solar:add-square-line-duotone"/>
+        <TheNuxtIcon @click="zoom(-1)" name="solar:minus-square-line-duotone"/>
+        <TheNuxtIcon v-if="isSupported && !readonly" @click="setCenterFromLoc" name="solar:gps-line-duotone"/>
+        <a v-if="readonly" :href="geo">
+          <TheNuxtIcon name="solar:share-line-duotone"/>
+        </a>
+      </div>
+      <TheNuxtIcon v-if="!readonly" :name="`${marker || 'my-icon:home-marker'}`" icon-type="img"
+                   class="!absolute right-1/2 bottom-1/2 transform translate-x-1/2"/>
+    </div>
+  </ClientOnly>
+</template>
+
+<script setup>
+import NeshanMap from "@neshan-maps-platform/vue3-openlayers";
+import { Feature } from "ol";
+import { Vector } from "ol/layer";
+import { Vector as SourceVector } from "ol/source";
+import { Style, Icon, Stroke, Fill } from "ol/style";
+import { Geometry, Point, Circle as GeomCircle } from "ol/geom";
+import { fromLonLat, transform } from "ol/proj";
+import Big from "big.js";
+const emit = defineEmits(["select-point"]);
+const { points = [], readonly, marker } = defineProps({
+  points: { type: Array, required: false },
+  readonly: { type: Boolean, required: false },
+  marker: { type: String, required: false }
+});
+const mapCenter = defineModel("center");
+const { isIos } = useDevice();
+const geo = computed(() => isIos ? `maps://maps.google.com/?q=${points[0]?.coords[1]},${points[0]?.coords[0]}` : `geo:${points[0]?.coords[1]},${points[0]?.coords[0]}`);
+const center = {
+  latitude: points[0]?.coords[1] || 30.5584422,
+  longitude: points[0]?.coords[0] || 49.1903995
+};
+const { coords, pause, isSupported, resume } = useGeolocation();
+const setCenterFromLoc = () => {
+  resume();
+};
+const setCenter = (coords2) => {
+  coords2?.length && Map.value?.getView().setCenter(transform(coords2, "EPSG:4326", "EPSG:3857"));
+};
+watch(() => coords.value, () => {
+  pause();
+  !readonly && setCenter([coords.value.longitude, coords.value.latitude]);
+});
+const map = ref(null);
+const filteredPoints = computed(() => points.filter(Boolean));
+const getCenter = () => transform(Map.value?.getView().getCenter(), "EPSG:3857", "EPSG:4326");
+const addVector = (e, isPoint = true) => {
+  const style = isPoint ? new Style({
+    image: new Icon({
+      src: e?.image,
+      anchor: e?.anchor || [0.5, 0],
+      // size: [50,50],
+      anchorOrigin: "bottom-left"
+    })
+  }) : new Style({
+    fill: new Fill({
+      color: "rgba(255, 100, 50, 0.3)"
+    }),
+    stroke: new Stroke({
+      width: 2,
+      color: "rgba(255, 100, 50, 0.8)"
+    })
+  });
+  return new Vector({
+    source: new SourceVector(),
+    style
+  });
+};
+const dataToFeature = (e, isPoint = true) => {
+  return isPoint ? new Feature(new Point(fromLonLat(e.coords))) : new Feature(new GeomCircle(fromLonLat(e.coords), 200));
+};
+let addedLayers = [];
+const durationInLongLat = (points2) => {
+  const a2 = new Big(points2?.[1].coords[0]).minus(points2?.[0].coords[0]).pow(2);
+  const b2 = new Big(points2?.[1].coords[1]).minus(points2?.[0].coords[1]).pow(2);
+  return a2.plus(b2).sqrt();
+};
+const centerOfLatLong = (points2) => {
+  const x = new Big(points2?.[1].coords[0]).plus(points2?.[0].coords[0]).div(2).toNumber();
+  const y = new Big(points2?.[1].coords[1]).plus(points2?.[0].coords[1]).div(2).toNumber();
+  return [x, y];
+};
+const zoomOfPoints = (du) => new Big(Math.log(du)).times(1.3691).minus(8.895).abs().toNumber();
+const setZoom = (number) => {
+  Map.value?.getView().setZoom(number);
+};
+const refreshPoints = async () => {
+  addedLayers.map((l) => {
+    const layers = map.value?.state?.map?.getLayers();
+    const ll = layers.getArray().findIndex((e) => e.ol_uid === l.ol_uid);
+    layers?.removeAt(ll);
+  });
+  addedLayers = [];
+  filteredPoints.value.forEach((e) => {
+    const layer = addVector(e, true);
+    layer?.getSource()?.addFeature(dataToFeature(e, true));
+    addedLayers.push(layer);
+  });
+  addedLayers.map((l) => map.value?.state?.map?.addLayer(l));
+  if ((points?.length || 0) > 1) {
+    const du = durationInLongLat(filteredPoints.value);
+    const zoom2 = zoomOfPoints(du.toNumber());
+    setZoom(zoom2);
+    setCenter([centerOfLatLong(filteredPoints.value)[0], Math.min(filteredPoints.value?.[0].coords[1], filteredPoints.value?.[1].coords[1])]);
+  } else {
+    setCenter(filteredPoints.value?.[0]?.coords);
+  }
+};
+const zoom = (number) => {
+  const view = map.value?.state.map.getView();
+  const zoom2 = view.getZoom();
+  view.setZoom(zoom2 + number);
+};
+const Map = computed(() => map.value?.state?.map);
+watch(() => Map.value, () => {
+  refreshPoints();
+  const center2 = map.value?.state.map.getView().getCenter();
+  mapCenter.value = transform(center2, "EPSG:3857", "EPSG:4326");
+});
+watch(() => points, () => {
+  refreshPoints();
+});
+defineExpose({ Map, getCenter, setCenter });
+</script>
+
+<style>
+@import "@neshan-maps-platform/vue3-openlayers/dist/style.css";
+</style>

package/dist/runtime/components/Un/Map.vue.d.ts

@@ -0,0 +1,17 @@
+import type { Address, Point as PointType } from '~/types/app';
+type __VLS_Props = {
+    points?: PointType[];
+    readonly?: boolean;
+    marker?: string;
+};
+type __VLS_ModelProps = {
+    'center'?: any;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {
+    Map: any;
+    getCenter: () => any;
+    setCenter: (coords: Address) => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/MultiUploader.d.vue.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    label?: string;
+    selected?: number;
+    max?: number;
+    uploaderClass?: string;
+    filesClass?: string;
+    selectable?: string;
+    watermark?: string | null;
+    accept?: string | null;
+};
+declare const __VLS_defaultModels: {
+    modelValue: () => never[];
+};
+type __VLS_ModelProps = {
+    modelValue?: typeof __VLS_defaultModels['modelValue'];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/MultiUploader.vue

@@ -0,0 +1,126 @@
+<template>
+  <form
+      class="flex gap-4 items-stretch text-base text-primary-500 min-h-16"
+      @submit.prevent="upload"
+      @dragover.prevent
+      @dragenter="hovered = true"
+      @dragleave="hovered = false"
+      @drop.stop.prevent="drop"
+  >
+    <input
+        v-if="!max || files?.length < max"
+        id="image"
+        type="file"
+        alt="uploadImage"
+        hidden
+        :accept="accept"
+        multiple
+        @change="upload($event.target)"
+    />
+    <label
+        v-if="false"
+        for="image"
+        class="flex flex-row items-center justify-center gap-2 bg-box rounded-lg w-57 outline-1 outline-dashed outline-offset-6 my-2 mr-2 cursor-pointer border-border border-1"
+        :class="[
+  hovered ? 'outline-danger text-danger' : 'outline-primary text-primary-500',
+  uploaderClass
+]"
+    >
+      <i class="flex justify-center items-center svg:(w-8 h-8)">
+        <TheNuxtIcon name="solar:gallery-add-line-duotone"/>
+      </i>
+      <b>{{ label || $t("\u0622\u067E\u0644\u0648\u062F \u062A\u0635\u0648\u06CC\u0631") }}</b>
+    </label>
+    <transition-group
+        name="list"
+        tag="div"
+        class="flex flex-row flex-wrap gap-4 items-stretch"
+        :class="filesClass"
+    >
+      <label
+          key="label"
+          for="image"
+          class="flex flex-row items-center justify-center gap-2 bg-box rounded-lg w-57 outline-1 outline-dashed outline-offset-6 my-2 mr-2 cursor-pointer border-border border-1"
+          :class="[
+  hovered ? 'outline-danger text-danger' : 'outline-primary text-primary-500',
+  uploaderClass
+]">
+        <i class="flex justify-center items-center svg:(w-8 h-8)">
+          <TheNuxtIcon name="solar:gallery-add-line-duotone"/>
+        </i>
+        <b>{{ label || $t("\u0622\u067E\u0644\u0648\u062F \u062A\u0635\u0648\u06CC\u0631") }}</b>
+      </label>
+      <div
+          v-for="(image, index) in files"
+          :key="index"
+          class="bg-box rounded-lg aspect-square w-16 overflow-hidden relative border-(1 solid)"
+          :class="[
+  selected === index && selectable ? 'border-primary' : 'border-transparent'
+]"
+      >
+        <img
+            :src="image"
+            :alt="index"
+            class="w-full h-full object-cover"
+        />
+        <div v-if="selectable"
+             class="absolute inset-0 bg-white bg-opacity-50 svg:(w-6 h-6) opacity-30 transition duration-300 cursor-pointer hover:(opacity-100)"
+             @click.self="emit('select', index)">
+        </div>
+        <TheNuxtIcon name="solar:gallery-remove-line-duotone"
+                     class="z-1 !absolute left-0 bottom-0 hover:(text-danger) cursor-pointer w-6 h-6"
+                     @click="deleteImage(index)"
+        />
+      </div>
+    </transition-group>
+  </form>
+</template>
+
+<script setup>
+const emit = defineEmits(["select", "update:modelValue"]);
+const props = defineProps({
+  label: { type: String, required: false },
+  selected: { type: Number, required: false },
+  max: { type: Number, required: false },
+  uploaderClass: { type: String, required: false },
+  filesClass: { type: String, required: false },
+  selectable: { type: String, required: false },
+  watermark: { type: [String, null], required: false },
+  accept: { type: [String, null], required: false }
+});
+const hovered = ref(false);
+const loadedpicture = ref("");
+const files = defineModel({ default: () => [] });
+const drop = (e) => {
+  hovered.value = false;
+  upload(e.dataTransfer);
+};
+const upload = (evt) => {
+  if (props.max && files.value?.length >= props.max) return;
+  for (let i = 0; i < evt?.files?.length; i++) {
+    compile(evt.files[i]);
+  }
+};
+const compile = async (file) => {
+  if (!file.type.includes("image")) return;
+  uploadToServer(file);
+};
+const loading = ref(false);
+const uploadToServer = async (file) => {
+  loading.value = true;
+  const fm = new FormData();
+  fm.append("file", file);
+  const { result } = await usePost("/upload", fm);
+  if (result) {
+    files.value = [...files.value, result];
+  }
+  loading.value = false;
+};
+const deleteImage = (index) => {
+  files.value.splice(index, 1);
+  emit(
+    "select",
+    props.selected > 0 ? props.selected - 1 : props.selected
+  );
+};
+</script>

package/dist/runtime/components/Un/MultiUploader.vue.d.ts

@@ -0,0 +1,20 @@
+type __VLS_Props = {
+    label?: string;
+    selected?: number;
+    max?: number;
+    uploaderClass?: string;
+    filesClass?: string;
+    selectable?: string;
+    watermark?: string | null;
+    accept?: string | null;
+};
+declare const __VLS_defaultModels: {
+    modelValue: () => never[];
+};
+type __VLS_ModelProps = {
+    modelValue?: typeof __VLS_defaultModels['modelValue'];
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/NewPWA.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/NewPWA.vue

@@ -0,0 +1,40 @@
+<template>
+  <ClientOnly>
+    <div
+        v-if="$pwa?.offlineReady || $pwa?.needRefresh"
+        class="pwa-toast"
+        role="alert"
+    >
+      <div class="message">
+        <p v-if="$pwa.offlineReady">
+          اپلیکیشن آماده اجرا به صورت آفلاین می باشد
+        </p>
+        <p v-else>
+          جهت استفاده از امکانات اپلیکیشن بروزرسانی نمایید.
+        </p>
+      </div>
+      <div class="flex gap-2 items-stretch">
+        <TheButton :mini="true" variant="primary-fill" label="بروزرسانی" v-if="$pwa.needRefresh"
+                   @click="$pwa.updateServiceWorker()"/>
+        <TheButton :mini="true" variant="secondary-fill" label="بستن" @click="$pwa.cancelPrompt()"/>
+      </div>
+    </div>
+    <div
+        v-if="$pwa?.showInstallPrompt && !$pwa?.offlineReady && !$pwa?.needRefresh"
+        class="pwa-toast"
+        role="alert"
+    >
+      <p class="message">
+        جهت استفاده راحت تر اپلیکیشن را نصب کنید!
+      </p>
+      <div class="flex gap-2 items-stretch">
+        <TheButton :mini="true" label="نصب" variant="primary-fill" @click="$pwa.install()"/>
+        <TheButton :mini="true" label="لغو" variant="primary-fill" @click="$pwa.cancelInstall()"/>
+      </div>
+    </div>
+  </ClientOnly>
+</template>
+
+<style>
+.pwa-toast{@apply fixed right-[calc((100vw-30rem)/2+2rem)] bg-white bottom-20 p-4 border-(1 solid primary-500) rounded-xl z-999;@apply flex flex-col items-end gap-4}.message{@apply text-sm}
+</style>

package/dist/runtime/components/Un/NewPWA.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/NumberInput.d.vue.ts

@@ -0,0 +1,16 @@
+type __VLS_Props = {
+    max?: number;
+    min?: number;
+    step?: number;
+};
+type __VLS_ModelProps = {
+    modelValue?: string | number;
+};
+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: string | number | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | number | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/NumberInput.vue

@@ -0,0 +1,36 @@
+<template>
+  <div class="flex items-center gap-1 pt-1 px-1">
+    <TheNuxtIcon name="solar:add-circle-bold-duotone" class="text-3xl text-primary-500 "
+                 @click.prevent.stop="increment(_min([step, remain]))"/>
+    <TheInput class="grow h-10" class-name="rounded-2xl bg-bg children:(text-center)" v-model="amount"
+              @update:model-value="handler"/>
+    <TheNuxtIcon name="solar:minus-circle-line-duotone" class="text-3xl text-primary-500"
+                 @click.prevent.stop="increment(-1e3)"/>
+  </div>
+</template>
+
+<script setup>
+const { max = 999999999, min = 0, step = 1e3 } = defineProps({
+  max: { type: Number, required: false },
+  min: { type: Number, required: false },
+  step: { type: Number, required: false }
+});
+const amount = defineModel({ type: [String, Number] });
+const remain = computed(() => max - Number(s2n(amount.value)));
+const increment = (e) => {
+  if (e < 0 && Number(s2n(amount.value)) <= Math.abs(e)) {
+    amount.value = "0";
+  } else {
+    amount.value = toLocal(Number(s2n(amount.value)) + e, 0);
+  }
+};
+const handler = (e) => {
+  if (Number(s2n(amount.value)) < min) {
+    amount.value = min;
+  } else if (Number(s2n(amount.value)) > max) {
+    amount.value = toLocal(max, 0);
+  } else {
+    amount.value = toLocal(e, 0);
+  }
+};
+</script>

package/dist/runtime/components/Un/NumberInput.vue.d.ts

@@ -0,0 +1,16 @@
+type __VLS_Props = {
+    max?: number;
+    min?: number;
+    step?: number;
+};
+type __VLS_ModelProps = {
+    modelValue?: string | number;
+};
+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: string | number | undefined) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string | number | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/NuxtIcon.d.vue.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    name?: string | null;
+    iconType?: string;
+    filled?: boolean;
+    alt?: 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/Un/NuxtIcon.vue

@@ -0,0 +1,29 @@
+<template>
+  <div
+      v-if="iconType === 'img' || name?.split('.')[1]"
+      class="relative overflow-hidden">
+    <div v-if="!loaded" class="absolute inset-0 bg-gray-200 animate-pulse z-0"/>
+    <img
+        :src="name?.includes('http') ? name : '/images/' + (name || 'noimage.jpg')"
+        :alt="alt || 'NoImg'"
+        loading="lazy"
+        @load="loaded = true"
+        class="block w-full h-full object-cover transition-opacity duration-300 z-10"
+        :class="loaded ? 'opacity-100' : 'opacity-0'"/>
+  </div>
+  <Icon
+      v-else-if="name"
+      class="text-2xl overflow-hidden"
+      :name="name"/>
+</template>
+
+<script setup>
+const props = defineProps({
+  name: { type: [String, null], required: false },
+  iconType: { type: String, required: false },
+  filled: { type: Boolean, required: false },
+  alt: { type: String, required: false }
+});
+const iconType = props.iconType || "icon";
+const loaded = ref(false);
+</script>

package/dist/runtime/components/Un/NuxtIcon.vue.d.ts

@@ -0,0 +1,9 @@
+type __VLS_Props = {
+    name?: string | null;
+    iconType?: string;
+    filled?: boolean;
+    alt?: 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/Un/PWA.d.vue.ts

@@ -0,0 +1,3 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/Un/PWA.vue

@@ -0,0 +1,17 @@
+<template>
+  <div v-show="$pwa.needRefresh" class="fixed flex flex-col gap-2 items-end bottom-4 right-4 max-w-vw border-(1 solid primary) rounded-lg bg-box-1 p-4 z-999999">
+    <div>
+      {{ $t('جهت دسترسی به آخرین نسخه اپلیکیشن روی بروزرسانی کلیک نمایید.') }}
+    </div>
+    <TheButton variant="primary-fill" :label="$t('بروزرسانی')" @click="$pwa.updateServiceWorker()"/>
+  </div>
+</template>
+
+<script setup>
+const { $pwa } = useNuxtApp();
+const toast = useNuxtApp();
+onMounted(() => {
+  if ($pwa.offlineReady)
+    toast.success("App ready to work offline");
+});
+</script>

package/dist/runtime/components/Un/PWA.vue.d.ts

@@ -0,0 +1,3 @@
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/dist/runtime/components/Un/QRCode.d.vue.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    value: 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/Un/QRCode.vue

@@ -0,0 +1,10 @@
+<template>
+  <qrcode-vue :value="value" level="H" render-as="svg"/>
+</template>
+
+<script setup>
+import QrcodeVue from "qrcode.vue";
+defineProps({
+  value: { type: String, required: true }
+});
+</script>

package/dist/runtime/components/Un/QRCode.vue.d.ts

@@ -0,0 +1,6 @@
+type __VLS_Props = {
+    value: 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/Un/Range.d.vue.ts

@@ -0,0 +1,13 @@
+import type { Input } from "~/types/models";
+type __VLS_Props = {
+    options?: Input["options"];
+    placeholder?: string;
+};
+type __VLS_ModelProps = {
+    'from'?: any;
+    'to'?: any;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Un/Range.vue

@@ -0,0 +1,56 @@
+<template>
+  <div
+      v-on-click-outside="close"
+      class="bg-box h-12 w-full rounded-lg flex flex-row gap-1 items-stretch text-black-1 relative select-none divide-x divide-x-reverse divide-border relative children:(flex-grow bg-transparent outline-none px-2 text-sm)">
+    <input
+        placeholder="از"
+        v-model="from"
+        @focus="focus(0)"/>
+    <input
+        v-model="to"
+        placeholder="تا"
+        @focus="focus(1)"/>
+    <div
+        v-if="show.some((e) => e === true)"
+        class="!bg-box absolute top-full right-1/2 max-h-200px w-1/2 z-2 border-none rounded-lg px-0 transform translate-y-2 transition-right duration-300 flex flex-col items-stretch"
+        :class="[show[1] ? 'right-1/2' : 'right-0']">
+      <div
+          class="divide-y divide-border divide-solid flex flex-col items-stretch overflow-y-auto scrollbar-width-thin">
+        <div
+            v-for="option in options"
+            :key="option.key"
+            class="divide-y divide-border px-2 py-2 cursor-pointer transition-all duration-300 hover:(text-black-2)"
+            @click="select(option.key)">
+          {{ option.title }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { vOnClickOutside } from "@vueuse/components";
+const emit = defineEmits(["fromValueChange", "toValueChange"]);
+defineProps({
+  options: { type: null, required: false },
+  placeholder: { type: String, required: false }
+});
+const from = defineModel("from");
+const to = defineModel("to");
+const show = ref([false, false]);
+const focus = (e) => {
+  show.value.fill(false);
+  show.value[e] = true;
+};
+const close = () => {
+  show.value.fill(false);
+};
+const select = (e) => {
+  if (show.value[0]) {
+    from.value = e;
+  } else {
+    to.value = e;
+  }
+  close();
+};
+</script>

package/dist/runtime/components/Un/Range.vue.d.ts

@@ -0,0 +1,13 @@
+import type { Input } from "~/types/models";
+type __VLS_Props = {
+    options?: Input["options"];
+    placeholder?: string;
+};
+type __VLS_ModelProps = {
+    'from'?: any;
+    'to'?: any;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;