pukaad-ui-lib 1.282.0 → 1.282.2

package/dist/runtime/components/drawer/drawer-suggest-place/suggest-place-form.vue

@@ -1,76 +1,76 @@
 <template>
-  <div class="flex gap-[16px] w-full">
-    <!-- กรอกข้อมูล -->
-    <div class="flex flex-col gap-[16px] w-[490px]">
-      <InputAddress name="address" v-model="modelValue.address" />
-      <template v-if="isAddressCompleted">
-        <div class="font-body-large-prominent">รายละเอียด</div>
-        <div class="flex flex-col gap-[4px]">
-          <InputAutocomplete name="businessName" v-model="modelValue.businessName" label="ชื่อสถานที่ธุรกิจ"
-            placeholder="กรอกชื่อสถานที่" required show-counter :limit="180" :free-text="true" :fetch-fn="fetchApprovedPlaces"
-            value-key="business_name" label-key="business_name" />
-          <InputTextField v-if="extraNameCount >= 1" name="nameTh" v-model="modelValue.nameTh" label="ชื่อภาษาไทย"
-            placeholder="ใส่ในกรณีที่ต่างจากชื่อหลัก" show-counter :limit="180" />
-          <InputTextField v-if="extraNameCount >= 2" name="nameEn" v-model="modelValue.nameEn" label="ชื่อภาษาอังกฤษ"
-            placeholder="ใส่ในกรณีที่ต่างจากชื่อหลัก" show-counter :limit="180" />
-          <Button v-if="extraNameCount < 2" variant="text" color="primary" class="w-[145px]" @click="extraNameCount++">
-            <Icon name="lucide:plus" />
-            เพิ่มชื่อสถานที่
-          </Button>
-        </div>
-        <InputCombobox name="categories" v-model="modelValue.categories" label="หมวดหมู่"
-          placeholder="เพิ่มหมวดหมู่ที่เกี่ยวข้องกับสถานที่" :limit="3" show-counter :options="categoryOptions" required
-          multiple />
-        <InputTextarea name="description" v-model="modelValue.description" label="คำอธิบาย"
-          placeholder="คำอธิบายเกี่ยวกับสถานที่ (สูงสุด 220 ตัวอักษร)" :limit="220" show-counter />
-        <InputDateOpening name="openingHours" v-model="modelValue.openingHours" />
-        <div class="flex flex-col gap-[8px]">
-          <InputPhone name="phone" v-model="modelValue.phone" label="เบอร์โทรศัพท์" placeholder="กรอกเบอร์โทรศัพท์" />
-          <InputPhone v-for="(item, index) in modelValue.extraPhones" :key="index" :name="`extraPhone-${index}`"
-            label="เบอร์โทรศัพท์" placeholder="กรอกเบอร์โทรศัพท์" v-model="modelValue.extraPhones[index]" />
-          <Button variant="text" color="primary" class="w-[145px]" @click="modelValue.extraPhones.push('')">
-            <Icon name="lucide:plus" />
-            เพิ่มเบอร์โทรศัพท์
-          </Button>
-          <InputLink name="contactChannels" format="contact_channel" default-first
-            v-model="modelValue.contactChannels" />
-        </div>
-        <template v-if="props.state === 'personal'">
-          <div class="flex flex-col gap-[16px]">
-            <InputCheckbox name="isReview" v-model="modelValue.isReview" label="คุณต้องการรีวิวสถานที่นี้" />
-            <template v-if="modelValue.isReview">
-              <InputRating name="rating" v-model="modelValue.rating" class="flex py-4 justify-center" />
-              <InputTextarea name="reviewDescription" v-model="modelValue.reviewDescription" label="คำอธิบาย"
-                placeholder="คำอธิบายเกี่ยวกับสถานที่" show-counter />
-              <div class="flex flex-col gap-[8px]">
-                <div class="flex flex-col gap-[4px]">
-                  <div class="font-body-large-prominent text-gray">
-                    เพิ่มภาพถ่าย
-                  </div>
-                  <div class="font-body-small text-gray">สูงสุด 9 รายการ</div>
-                </div>
-                <InputFile name="reviewPhotos" v-model="modelValue.reviewPhotos" accept="image/*" :limit="9" />
-                <div class="font-body-small text-gray w-[250px]">
-                  รองรับไฟล์ *.jpg *.jpeg *.png *.webp *.bmp *.gif
-                  ขนาดไฟล์ไม่เกิน 30 mb
-                </div>
-              </div>
-            </template>
-          </div>
-        </template>
-      </template>
-    </div>
-
-    <!-- แสดง polygon -->
-    <div class="flex flex-col gap-[16px] w-[334px] sticky top-0 self-start">
-      <SuggestPlaceMap :province-id="modelValue.address?.province_id" :amphur-id="modelValue.address?.amphur_id"
-        :tambon-id="modelValue.address?.tambon_id" @update:lat-lng="modelValue.latLng = $event" />
-      <InputTextField name="latitude-longitude" icon-prepend="lucide:locate-fixed" readonly
+  <div class="flex gap-[16px] w-full">
+    <!-- กรอกข้อมูล -->
+    <div class="flex flex-col gap-[16px] w-[490px]">
+      <InputAddress name="address" v-model="modelValue.address" />
+      <template v-if="isAddressCompleted">
+        <div class="font-body-large-prominent">รายละเอียด</div>
+        <div class="flex flex-col gap-[4px]">
+          <InputAutocomplete name="businessName" v-model="modelValue.businessName" label="ชื่อสถานที่ธุรกิจ"
+            placeholder="กรอกชื่อสถานที่" required show-counter :limit="180" :free-text="true" :fetch-fn="fetchApprovedPlaces"
+            value-key="business_name" label-key="business_name" />
+          <InputTextField v-if="extraNameCount >= 1" name="nameTh" v-model="modelValue.nameTh" label="ชื่อภาษาไทย"
+            placeholder="ใส่ในกรณีที่ต่างจากชื่อหลัก" show-counter :limit="180" />
+          <InputTextField v-if="extraNameCount >= 2" name="nameEn" v-model="modelValue.nameEn" label="ชื่อภาษาอังกฤษ"
+            placeholder="ใส่ในกรณีที่ต่างจากชื่อหลัก" show-counter :limit="180" />
+          <Button v-if="extraNameCount < 2" variant="text" color="primary" class="w-[145px]" @click="extraNameCount++">
+            <Icon name="lucide:plus" />
+            เพิ่มชื่อสถานที่
+          </Button>
+        </div>
+        <InputCombobox name="categories" v-model="modelValue.categories" label="หมวดหมู่"
+          placeholder="เพิ่มหมวดหมู่ที่เกี่ยวข้องกับสถานที่" :limit="3" show-counter :options="categoryOptions" required
+          multiple />
+        <InputTextarea name="description" v-model="modelValue.description" label="คำอธิบาย"
+          placeholder="คำอธิบายเกี่ยวกับสถานที่ (สูงสุด 220 ตัวอักษร)" :limit="220" show-counter />
+        <InputDateOpening name="openingHours" v-model="modelValue.openingHours" />
+        <div class="flex flex-col gap-[8px]">
+          <InputPhone name="phone" v-model="modelValue.phone" label="เบอร์โทรศัพท์" placeholder="กรอกเบอร์โทรศัพท์" />
+          <InputPhone v-for="(item, index) in modelValue.extraPhones" :key="index" :name="`extraPhone-${index}`"
+            label="เบอร์โทรศัพท์" placeholder="กรอกเบอร์โทรศัพท์" v-model="modelValue.extraPhones[index]" />
+          <Button variant="text" color="primary" class="w-[145px]" @click="modelValue.extraPhones.push('')">
+            <Icon name="lucide:plus" />
+            เพิ่มเบอร์โทรศัพท์
+          </Button>
+          <InputLink name="contactChannels" format="contact_channel" default-first
+            v-model="modelValue.contactChannels" />
+        </div>
+        <template v-if="props.state === 'personal'">
+          <div class="flex flex-col gap-[16px]">
+            <InputCheckbox name="isReview" v-model="modelValue.isReview" label="คุณต้องการรีวิวสถานที่นี้" />
+            <template v-if="modelValue.isReview">
+              <InputRating name="rating" v-model="modelValue.rating" class="flex py-4 justify-center" />
+              <InputTextarea name="reviewDescription" v-model="modelValue.reviewDescription" label="คำอธิบาย"
+                placeholder="คำอธิบายเกี่ยวกับสถานที่" show-counter />
+              <div class="flex flex-col gap-[8px]">
+                <div class="flex flex-col gap-[4px]">
+                  <div class="font-body-large-prominent text-gray">
+                    เพิ่มภาพถ่าย
+                  </div>
+                  <div class="font-body-small text-gray">สูงสุด 9 รายการ</div>
+                </div>
+                <InputFile name="reviewPhotos" v-model="modelValue.reviewPhotos" accept="image/*" :limit="9" />
+                <div class="font-body-small text-gray w-[250px]">
+                  รองรับไฟล์ *.jpg *.jpeg *.png *.webp *.bmp *.gif
+                  ขนาดไฟล์ไม่เกิน 30 mb
+                </div>
+              </div>
+            </template>
+          </div>
+        </template>
+      </template>
+    </div>
+
+    <!-- แสดง polygon -->
+    <div class="flex flex-col gap-[16px] w-[334px] sticky top-0 self-start">
+      <SuggestPlaceMap :province-id="modelValue.address?.province_id" :amphur-id="modelValue.address?.amphur_id"
+        :tambon-id="modelValue.address?.tambon_id" @update:lat-lng="modelValue.latLng = $event" />
+      <InputTextField name="latitude-longitude" icon-prepend="lucide:locate-fixed" readonly
         placeholder="ละติจูด, ลองจิจูด" :model-value="
   modelValue.latLng ? `${modelValue.latLng.lat.toFixed(6)}, ${modelValue.latLng.lng.toFixed(6)}` : ''
-" />
-    </div>
-  </div>
+" />
+    </div>
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/drawer/drawer-suggest-place/suggest-place-map.vue

@@ -1,9 +1,9 @@
 <template>
-  <div
-    class="relative w-[334px] h-[434px] rounded-[12px] overflow-hidden bg-gray-300 z-0"
-  >
-    <div ref="mapContainer" class="w-full h-full z-0"></div>
-  </div>
+  <div
+    class="relative w-[334px] h-[434px] rounded-[12px] overflow-hidden bg-gray-300 z-0"
+  >
+    <div ref="mapContainer" class="w-full h-full z-0"></div>
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/drawer/drawer.vue

@@ -1,28 +1,28 @@
 <template>
-  <ShadSheet v-model:open="isOpen">
-    <ShadSheetContent
-      v-bind="props"
-      v-slot="{ meta }"
-      @submit="onSubmit"
-      @close="onClose"
-    >
-      <Loading :loading="props.loading" :text="props.loadingText" />
-      <ShadSheetHeader class="flex-shrink-0">
-        <slot name="header">
-          <ShadSheetTitle>{{ props.title }}</ShadSheetTitle>
-          <ShadSheetDescription>
-            {{ props.description }}
-          </ShadSheetDescription>
-        </slot>
-      </ShadSheetHeader>
-      <div class="flex-1 overflow-y-auto px-[24px]">
-        <slot name="default" :meta="meta" />
-      </div>
-      <ShadSheetFooter class="flex-shrink-0">
-        <slot name="footer" :meta="meta" />
-      </ShadSheetFooter>
-    </ShadSheetContent>
-  </ShadSheet>
+  <ShadSheet v-model:open="isOpen">
+    <ShadSheetContent
+      v-bind="props"
+      v-slot="{ meta }"
+      @submit="onSubmit"
+      @close="onClose"
+    >
+      <Loading :loading="props.loading" :text="props.loadingText" />
+      <ShadSheetHeader class="flex-shrink-0">
+        <slot name="header">
+          <ShadSheetTitle>{{ props.title }}</ShadSheetTitle>
+          <ShadSheetDescription>
+            {{ props.description }}
+          </ShadSheetDescription>
+        </slot>
+      </ShadSheetHeader>
+      <div class="flex-1 overflow-y-auto px-[24px]">
+        <slot name="default" :meta="meta" />
+      </div>
+      <ShadSheetFooter class="flex-shrink-0">
+        <slot name="footer" :meta="meta" />
+      </ShadSheetFooter>
+    </ShadSheetContent>
+  </ShadSheet>
 </template>
 
 <script setup>

package/dist/runtime/components/dropdown.vue

@@ -1,12 +1,12 @@
 <template>
-  <ShadDropdownMenu>
-    <ShadDropdownMenuTrigger>
-      <slot />
-    </ShadDropdownMenuTrigger>
-    <ShadDropdownMenuContent class="w-56" align="bottom">
-      asd
-    </ShadDropdownMenuContent>
-  </ShadDropdownMenu>
+  <ShadDropdownMenu>
+    <ShadDropdownMenuTrigger>
+      <slot />
+    </ShadDropdownMenuTrigger>
+    <ShadDropdownMenuContent class="w-56" align="bottom">
+      asd
+    </ShadDropdownMenuContent>
+  </ShadDropdownMenu>
 </template>
 
 <script setup>

package/dist/runtime/components/filter/filter-list-chip.vue

@@ -1,14 +1,14 @@
 <template>
-  <div v-if="hasSelectedChips" class="flex gap-[8px] flex-wrap">
-    <Chip v-for="(chip, index) in selectedChips" :key="index" color="outline"
-      class="border-primary bg-info text-primary">
-      {{ chip.label }}
-    </Chip>
-
-    <Button variant="text" @click="clearAll">
-      <div class="px-[12px] py-[8px]"> ล้างตัวกรอง</div>
-    </Button>
-  </div>
+  <div v-if="hasSelectedChips" class="flex gap-[8px] flex-wrap">
+    <Chip v-for="(chip, index) in selectedChips" :key="index" color="outline"
+      class="border-primary bg-info text-primary">
+      {{ chip.label }}
+    </Chip>
+
+    <Button variant="text" @click="clearAll">
+      <div class="px-[12px] py-[8px]"> ล้างตัวกรอง</div>
+    </Button>
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/filter/filter-list.vue

@@ -1,21 +1,21 @@
 <template>
-  <div class="flex flex-col gap-[8px]">
-    <div class="text-gray font-body-large-prominent">
-      {{ props.label }}
-    </div>
-
-    <InputCheckbox
-      v-for="(item, index) in modelValue"
-      :key="index"
-      :label="item.label"
-      label-position="left"
-      :disabled="item.disabled"
-      labelGap="auto"
-      v-model="item.checked"
-    />
-
-    <Button type="text" variant="primary"> แสดงเพิ่มเติม </Button>
-  </div>
+  <div class="flex flex-col gap-[8px]">
+    <div class="text-gray font-body-large-prominent">
+      {{ props.label }}
+    </div>
+
+    <InputCheckbox
+      v-for="(item, index) in modelValue"
+      :key="index"
+      :label="item.label"
+      label-position="left"
+      :disabled="item.disabled"
+      labelGap="auto"
+      v-model="item.checked"
+    />
+
+    <Button type="text" variant="primary"> แสดงเพิ่มเติม </Button>
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/icons.vue

@@ -1,5 +1,5 @@
 <template>
-  <Icon :name="props.name" :size="props.size" :color="props.color" />
+  <Icon :name="props.name" :size="props.size" :color="props.color" />
 </template>
 
 <script setup>

package/dist/runtime/components/image/image-cropper.vue

@@ -1,13 +1,13 @@
 <template>
-  <div :style="containerStyle">
-    <img
-      ref="imgRef"
-      :src="src"
-      :alt="alt || 'image'"
-      :style="[{ 'max-width': '100%' }, imgStyle]"
-      :crossorigin="crossorigin"
-    />
-  </div>
+  <div :style="containerStyle">
+    <img
+      ref="imgRef"
+      :src="src"
+      :alt="alt || 'image'"
+      :style="[{ 'max-width': '100%' }, imgStyle]"
+      :crossorigin="crossorigin"
+    />
+  </div>
 </template>
 
 <script setup>

package/dist/runtime/components/image/image.vue

@@ -1,51 +1,51 @@
 <template>
-  <NuxtImg
-    :class="props.class"
-    :src="props.src"
-    :alt="props.alt"
-    :custom="true"
+  <NuxtImg
+    :class="props.class"
+    :src="props.src"
+    :alt="props.alt"
+    :custom="true"
     :style="{
   width: props.width == 'auto' ? '100%' : `${props.width}px`,
   height: props.height == 'auto' ? '100%' : `${props.height}px`,
   minWidth: props.width != 'auto' ? `${props.width}px` : void 0,
   minHeight: props.height != 'auto' ? `${props.height}px` : void 0,
   objectFit: props.fit
-}"
-    loading="lazy"
-    v-slot="{ src, isLoaded, imgAttrs }"
-  >
-    <div
-      v-if="isLoaded || src"
+}"
+    loading="lazy"
+    v-slot="{ src, isLoaded, imgAttrs }"
+  >
+    <div
+      v-if="isLoaded || src"
       :style="{
   width: props.width == 'auto' ? '100%' : `${props.width}px`,
   height: props.height == 'auto' ? '100%' : `${props.height}px`,
   minWidth: props.width != 'auto' ? `${props.width}px` : void 0,
   minHeight: props.height != 'auto' ? `${props.height}px` : void 0
-}"
-    >
-      <img
-        v-bind="imgAttrs"
-        :src="src"
-        :alt="props.alt"
+}"
+    >
+      <img
+        v-bind="imgAttrs"
+        :src="src"
+        :alt="props.alt"
         :style="{
   width: '100%',
   height: '100%',
   objectFit: props.fit
-}"
-      />
-    </div>
-    <div
-      v-else
-      ref="refLazy"
-      :class="['flex justify-center items-center bg-fade', props.class]"
+}"
+      />
+    </div>
+    <div
+      v-else
+      ref="refLazy"
+      :class="['flex justify-center items-center bg-fade', props.class]"
       :style="{
   width: props.width == 'auto' ? '100%' : `${props.width}px`,
   height: props.height == 'auto' ? '100%' : `${props.height}px`,
   minWidth: props.width != 'auto' ? `${props.width}px` : void 0,
   minHeight: props.height != 'auto' ? `${props.height}px` : void 0
-}"
-    ></div>
-  </NuxtImg>
+}"
+    ></div>
+  </NuxtImg>
 </template>
 
 <script setup>

package/dist/runtime/components/input/input-OTP.vue

@@ -1,31 +1,31 @@
 <template>
-  <ShadFormField
-    ref="fieldRef"
-    :rules="props.rules || defaultRules"
-    :name="props.name"
-    v-model="modelValue"
-    v-slot="{ errorMessage: formError }"
-  >
-    <ShadFormItem>
-      <ShadPinInput
-        :id="props.id || props.name"
-        :disabled="props.disabled"
-        @complete="handleComplete"
-        v-model="pin"
-      >
-        <ShadPinInputGroup>
-          <ShadFormControl v-for="(n, i) in props.digit" :key="n" :index="i">
-            <ShadPinInputSlot
-              :class="{ 'border-destructive': formError || error }"
-            />
-          </ShadFormControl>
-        </ShadPinInputGroup>
-      </ShadPinInput>
-      <p v-if="formError || error" class="text-sm font-medium text-destructive">
-        {{ formError || error }}
-      </p>
-    </ShadFormItem>
-  </ShadFormField>
+  <ShadFormField
+    ref="fieldRef"
+    :rules="props.rules || defaultRules"
+    :name="props.name"
+    v-model="modelValue"
+    v-slot="{ errorMessage: formError }"
+  >
+    <ShadFormItem>
+      <ShadPinInput
+        :id="props.id || props.name"
+        :disabled="props.disabled"
+        @complete="handleComplete"
+        v-model="pin"
+      >
+        <ShadPinInputGroup>
+          <ShadFormControl v-for="(n, i) in props.digit" :key="n" :index="i">
+            <ShadPinInputSlot
+              :class="{ 'border-destructive': formError || error }"
+            />
+          </ShadFormControl>
+        </ShadPinInputGroup>
+      </ShadPinInput>
+      <p v-if="formError || error" class="text-sm font-medium text-destructive">
+        {{ formError || error }}
+      </p>
+    </ShadFormItem>
+  </ShadFormField>
 </template>
 
 <script setup>