Fix

src/components/BasicModal.vue

@@ -28,11 +28,10 @@
 </template>
 
 <script setup>
-import { computed, getCurrentInstance, onBeforeUnmount, useSlots, watch } from 'vue'
-
-import LineTitleBlock from '@/components/LineTitleBlock.vue'
-import SvgIcon from '@/components/icons/SvgIcon.vue'
 import { useModalStore } from '@/store/modal'
+import SvgIcon from '@/components/icons/SvgIcon.vue'
+import LineTitleBlock from '@/components/LineTitleBlock.vue'
+import { computed, getCurrentInstance, onBeforeUnmount, useSlots, watch } from 'vue'
 
 const props = defineProps({
   name: { type: String, default: '' },

src/components/CircleButton.vue

@@ -28,10 +28,7 @@
           role="tooltip"
         >
           {{ tooltip }}
-          <span
-            class="circle-button__tooltip-arrow"
-            :style="arrowStyle"
-          />
+          <span class="circle-button__tooltip-arrow" :style="arrowStyle" />
         </div>
       </Transition>
     </Teleport>
@@ -98,8 +95,8 @@ const updatePosition = async () => {
     const side = result.placement.split('-')[0]
     const oppositeSide = { top: 'bottom', bottom: 'top', left: 'right', right: 'left' }[side]
     arrowStyle.value = {
-      left: arrowData.x != null ? `${arrowData.x}px` : '',
-      top: arrowData.y != null ? `${arrowData.y}px` : '',
+      left: arrowData.x == null ? '' : `${arrowData.x}px`,
+      top: arrowData.y == null ? '' : `${arrowData.y}px`,
       [oppositeSide]: '-0.25rem',
     }
   }

src/components/ConfirmModal.vue

@@ -31,9 +31,9 @@
 </template>
 
 <script setup>
+import { useModalStore } from '@/store/modal'
 import BasicModal from '@/components/BasicModal.vue'
 import BaseButton from '@/components/BaseButton.vue'
-import { useModalStore } from '@/store/modal'
 
 defineOptions({ name: 'ConfirmModal' })
 

src/components/DropdownMenu.vue

@@ -27,6 +27,7 @@
 
 <script setup>
 import { onBeforeUnmount, ref, watch } from 'vue'
+import SvgIcon from '@/components/icons/SvgIcon.vue'
 import {
   autoUpdate,
   computePosition,
@@ -35,8 +36,6 @@ import {
   shift,
 } from '@floating-ui/dom'
 
-import SvgIcon from '@/components/icons/SvgIcon.vue'
-
 const props = defineProps({
   modelValue: { type: Boolean, default: false },
   reference: { type: [Object, null], default: null },

src/components/HeaderBlock.vue

@@ -34,11 +34,10 @@
 </template>
 
 <script setup>
-import { computed, useSlots } from 'vue'
-
-import SvgIcon from '@/components/icons/SvgIcon.vue'
-import { gallery } from '@/utils/gallery'
 import { useUIStore } from '@/store/ui'
+import { computed, useSlots } from 'vue'
+import { gallery } from '@/utils/gallery'
+import SvgIcon from '@/components/icons/SvgIcon.vue'
 
 defineProps({
   pageTitle: { type: String, default: '' },

src/components/form/DatePickerField.vue

@@ -50,11 +50,10 @@
 </template>
 
 <script setup>
-import { computed, onBeforeUnmount, ref, watch } from 'vue'
-import DatePicker from 'vue3-persian-datetime-picker'
-import { autoUpdate, computePosition, flip, offset, shift, size } from '@floating-ui/dom'
-
 import SvgIcon from '@/components/icons/SvgIcon.vue'
+import DatePicker from 'vue3-persian-datetime-picker'
+import { computed, onBeforeUnmount, ref, watch } from 'vue'
+import { autoUpdate, computePosition, flip, offset, shift, size } from '@floating-ui/dom'
 import {
   formatJalaaliDate,
   formatJalaaliDateTime,

src/components/form/FileUploader.vue

@@ -62,8 +62,8 @@
 
 <script setup>
 import { computed, ref } from 'vue'
-import CircleButton from '@/components/CircleButton.vue'
 import SvgIcon from '@/components/icons/SvgIcon.vue'
+import CircleButton from '@/components/CircleButton.vue'
 
 const props = defineProps({
   modelValue: { type: Array, default: () => [] },

src/components/form/ImageCropper.vue

@@ -83,12 +83,11 @@
 </template>
 
 <script setup>
+import 'vue-advanced-cropper/dist/style.css'
+import SvgIcon from '@/components/icons/SvgIcon.vue'
+import CircleButton from '@/components/CircleButton.vue'
 import { markRaw, onBeforeUnmount, ref, watch } from 'vue'
 import { Cropper, CircleStencil } from 'vue-advanced-cropper'
-import 'vue-advanced-cropper/dist/style.css'
-
-import CircleButton from '@/components/CircleButton.vue'
-import SvgIcon from '@/components/icons/SvgIcon.vue'
 
 const props = defineProps({
   modelValue: { type: [Object, String], default: null },

src/components/form/PasswordField.vue

@@ -24,9 +24,8 @@
 
 <script setup>
 import { ref, watch } from 'vue'
-
-import TextField from '@/components/form/TextField.vue'
 import SvgIcon from '@/components/icons/SvgIcon.vue'
+import TextField from '@/components/form/TextField.vue'
 
 const props = defineProps({
   modelValue: { type: String, default: '' },

src/components/form/SelectField.vue

@@ -74,9 +74,8 @@
 
 <script setup>
 import { computed, onBeforeUnmount, ref } from 'vue'
-import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom'
-
 import SvgIcon from '@/components/icons/SvgIcon.vue'
+import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom'
 
 let uid = 0
 const nextUid = () => `select-field-${++uid}`