pukaad-ui-lib 1.21.1 → 1.22.2

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

@@ -1,105 +1,105 @@
 <template>
-  <Field
-    :name="props.name"
-    v-slot="{ field, errorMessage }"
-    :standalone="props.standalone"
-    :rules="rules"
-    v-model="modelValue"
-  >
-    <div
-      :class="[layout, layoutGapClass]"
+  <Field
+    :name="props.name"
+    v-slot="{ field, errorMessage }"
+    :standalone="props.standalone"
+    :rules="rules"
+    v-model="modelValue"
+  >
+    <div
+      :class="[layout, layoutGapClass]"
       :style="{
   gap: layoutGapStyle
-}"
-    >
-      <template v-if="items.length > 0" v-for="(item, i) in items" :key="i">
-        <slot name="default" :item="item">
-          <label
+}"
+    >
+      <template v-if="items.length > 0" v-for="(item, i) in items" :key="i">
+        <slot name="default" :item="item">
+          <label
             :class="[
   'flex items-center font-body-large',
   columnGapClass,
   cursor
-]"
-            :style="{ gap: columnGapStyle }"
-          >
-            <template v-if="props.labelPosition == 'left'">
-              <slot
-                :name="`label-${typeof item === 'object' ? item.value : item}-text`"
-              >
-                {{ typeof item === "object" ? item.label : item }}
-              </slot>
-            </template>
-
-            <input
-              v-bind="field"
-              :class="['border-[1px] accent-primary', cursor]"
-              type="radio"
-              :name="props.name"
-              :style="{ width: `${props.size}px`, height: `${props.size}px` }"
-              :value="typeof item === 'object' ? item.value : item"
+]"
+            :style="{ gap: columnGapStyle }"
+          >
+            <template v-if="props.labelPosition == 'left'">
+              <slot
+                :name="`label-${typeof item === 'object' ? item.value : item}-text`"
+              >
+                {{ typeof item === "object" ? item.label : item }}
+              </slot>
+            </template>
+
+            <input
+              v-bind="field"
+              :class="['border-[1px] accent-primary', cursor]"
+              type="radio"
+              :name="props.name"
+              :style="{ width: `${props.size}px`, height: `${props.size}px` }"
+              :value="typeof item === 'object' ? item.value : item"
               :disabled="
   props.disabled || typeof item === 'object' && item.disabled
-"
+"
               :checked="
   modelValue === (typeof item === 'object' ? item.value : item)
-"
-            />
-
-            <template v-if="props.labelPosition == 'right'">
-              <slot
-                :name="`label-${typeof item === 'object' ? item.value : item}-text`"
-              >
-                {{ typeof item === "object" ? item.label : item }}
-              </slot>
-            </template>
-          </label>
-        </slot>
-      </template>
-      <template v-else>
-        <slot name="default" :item="item">
-          <label
+"
+            />
+
+            <template v-if="props.labelPosition == 'right'">
+              <slot
+                :name="`label-${typeof item === 'object' ? item.value : item}-text`"
+              >
+                {{ typeof item === "object" ? item.label : item }}
+              </slot>
+            </template>
+          </label>
+        </slot>
+      </template>
+      <template v-else>
+        <slot name="default" :item="item">
+          <label
             :class="[
   'flex items-center font-body-large',
   columnGapClass,
   cursor
-]"
-            :style="{ gap: columnGapStyle }"
-          >
-            <template v-if="props.labelPosition == 'left'">
-              <slot :name="`label-${item}-text`">
-                {{ item }}
-              </slot>
-            </template>
-
-            <input
-              v-bind="field"
-              :class="['border-[1px] accent-primary', cursor]"
-              type="radio"
-              :name="props.name"
-              :style="{ width: `${props.size}px`, height: `${props.size}px` }"
-              :value="item"
-              :disabled="props.disabled"
-            />
-
-            <template v-if="props.labelPosition == 'right'">
-              <slot :name="`label-${item}-text`">
-                {{ item }}
-              </slot>
-            </template>
-          </label>
-        </slot>
-      </template>
-
-      <div
-        v-if="!props.disabledErrorMessage && errorMessage"
-        class="font-body-small text-error"
-      >
-        <slot name="error">
-          {{ errorMessage }}
-        </slot>
-      </div>
-    </div>
-  </Field>
+]"
+            :style="{ gap: columnGapStyle }"
+          >
+            <template v-if="props.labelPosition == 'left'">
+              <slot :name="`label-${item}-text`">
+                {{ item }}
+              </slot>
+            </template>
+
+            <input
+              v-bind="field"
+              :class="['border-[1px] accent-primary', cursor]"
+              type="radio"
+              :name="props.name"
+              :style="{ width: `${props.size}px`, height: `${props.size}px` }"
+              :value="item"
+              :disabled="props.disabled"
+            />
+
+            <template v-if="props.labelPosition == 'right'">
+              <slot :name="`label-${item}-text`">
+                {{ item }}
+              </slot>
+            </template>
+          </label>
+        </slot>
+      </template>
+
+      <div
+        v-if="!props.disabledErrorMessage && errorMessage"
+        class="font-body-small text-error"
+      >
+        <slot name="error">
+          {{ errorMessage }}
+        </slot>
+      </div>
+    </div>
+  </Field>
 </template>
 
 <script setup>

package/dist/runtime/components/input/input-radio.vue.d.ts

@@ -4,25 +4,25 @@ type __VLS_ModelProps = {
     modelValue?: string | number;
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_8: {
+declare var __VLS_7: {
     item: any;
-}, __VLS_11: any, __VLS_12: {}, __VLS_15: any, __VLS_16: {}, __VLS_18: {
+}, __VLS_10: `label-${any}-text`, __VLS_11: {}, __VLS_14: `label-${any}-text`, __VLS_15: {}, __VLS_17: {
     item: any;
-}, __VLS_21: any, __VLS_22: {}, __VLS_25: any, __VLS_26: {}, __VLS_28: {};
+}, __VLS_20: `label-${any}-text`, __VLS_21: {}, __VLS_24: `label-${any}-text`, __VLS_25: {}, __VLS_27: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_11>]?: (props: typeof __VLS_12) => any;
+    [K in NonNullable<typeof __VLS_10>]?: (props: typeof __VLS_11) => any;
 } & {
-    [K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
+    [K in NonNullable<typeof __VLS_14>]?: (props: typeof __VLS_15) => any;
 } & {
-    [K in NonNullable<typeof __VLS_21>]?: (props: typeof __VLS_22) => any;
+    [K in NonNullable<typeof __VLS_20>]?: (props: typeof __VLS_21) => any;
 } & {
-    [K in NonNullable<typeof __VLS_25>]?: (props: typeof __VLS_26) => any;
+    [K in NonNullable<typeof __VLS_24>]?: (props: typeof __VLS_25) => any;
 } & {
-    default?: (props: typeof __VLS_8) => any;
+    default?: (props: typeof __VLS_7) => any;
 } & {
-    default?: (props: typeof __VLS_18) => any;
+    default?: (props: typeof __VLS_17) => any;
 } & {
-    error?: (props: typeof __VLS_28) => any;
+    error?: (props: typeof __VLS_27) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: string | number | undefined) => any;
@@ -33,12 +33,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
     size: number | string;
     item: string | number;
     name: string;
+    columnGap: number | string;
     disabled: boolean;
     disabledErrorMessage: boolean;
     labelPosition: "left" | "right";
     layout: "vertical" | "horizontal";
     layoutGap: number | string;
-    columnGap: number | string;
     standalone: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/input/input-rating.d.vue.ts

@@ -10,15 +10,15 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 } & {
     select: (value: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
     onSelect?: ((value: number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {
     size: number;
+    borderColor: string;
+    backgroundColor: string;
     readonly: boolean;
     ratingStep: number;
     borderSize: number;
-    borderColor: string;
-    backgroundColor: string;
     activeColor: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

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

@@ -1,13 +1,13 @@
 <template>
-  <NuxtRating
-    :border-color="props.borderColor"
-    :active-color="props.activeColor"
-    :inactive-color="props.backgroundColor"
-    :border-width="props.borderSize"
-    :read-only="props.readonly"
-    :rating-step="props.ratingStep"
-    :rounded-corners="true"
-    :rating-size="props.size"
+  <NuxtRating
+    :border-color="props.borderColor"
+    :active-color="props.activeColor"
+    :inactive-color="props.backgroundColor"
+    :border-width="props.borderSize"
+    :read-only="props.readonly"
+    :rating-step="props.ratingStep"
+    :rounded-corners="true"
+    :rating-size="props.size"
     :rating-content="[
   12,
   17.27,
@@ -41,10 +41,10 @@
   19.78,
   12,
   17.27
-]"
-    @rating-selected="onSelect"
-    :rating-value="ratingValue"
-  />
+]"
+    @rating-selected="onSelect"
+    :rating-value="ratingValue"
+  />
 </template>
 
 <script setup>

package/dist/runtime/components/input/input-rating.vue.d.ts

@@ -10,15 +10,15 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
 } & {
     select: (value: number) => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
-    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
     onSelect?: ((value: number) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: number) => any) | undefined;
 }>, {
     size: number;
+    borderColor: string;
+    backgroundColor: string;
     readonly: boolean;
     ratingStep: number;
     borderSize: number;
-    borderColor: string;
-    backgroundColor: string;
     activeColor: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

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

@@ -1,23 +1,23 @@
 <template>
-  <ShadFormField
-    :name="props.name"
-    :rules="rules"
-    v-slot="{ componentField }"
-    v-model="tokenValue"
-  >
-    <ShadFormItem>
-      <ShadFormControl>
-        <input v-bind="componentField" class="hidden" />
-        <RecaptchaV2
-          language="th"
-          @widget-id="handleWidgetId"
-          @load-callback="onVerify"
-          @expired-callback="onExpired"
-        />
-        <ShadFormMessage> asd </ShadFormMessage>
-      </ShadFormControl>
-    </ShadFormItem>
-  </ShadFormField>
+  <ShadFormField
+    :name="props.name"
+    :rules="rules"
+    v-slot="{ componentField }"
+    v-model="tokenValue"
+  >
+    <ShadFormItem>
+      <ShadFormControl>
+        <input v-bind="componentField" class="hidden" />
+        <RecaptchaV2
+          language="th"
+          @widget-id="handleWidgetId"
+          @load-callback="onVerify"
+          @expired-callback="onExpired"
+        />
+        <ShadFormMessage> asd </ShadFormMessage>
+      </ShadFormControl>
+    </ShadFormItem>
+  </ShadFormField>
 </template>
 
 <script setup>

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

@@ -1,69 +1,69 @@
-<template>
-  <div>asda</div>
-</template>
-<!-- <template>
-  <InputTextField
-    :prepend-icon="
-      !props.disabledIcon && iconPosition == 'left' ? props.icon : ''
-    "
-    :append-icon="
-      !props.disabledIcon && iconPosition == 'right' ? props.icon : ''
-    "
-    :full-rounded="props.fullRounded"
-    :full-width="props.fullWidth"
-    :placeholder="props.placeholder"
-    :height="props.height"
-    :width="props.width"
-    :max-width="props.maxWidth"
-    :min-width="props.minWidth"
-    :color="props.color"
-    :reset="props.reset"
-    :disabled="props.disabled"
-    @enter="onEnter"
-    @click-append-icon="onClick"
-    v-model="modelValue"
-  >
-    <template #prepend>
-      <slot name="prepend" />
-    </template>
-    <template #append>
-      <slot name="append" />
-    </template>
-  </InputTextField>
-</template>
-<script setup lang="ts">
-import type { InputSearchProps } from "@/types/components/input/input-search";
-
-const emit = defineEmits<{
-  (e: "enter"): void;
-  (e: "click"): void;
-  (e: "search", value: string): void;
-}>();
-
-const props = withDefaults(defineProps<InputSearchProps>(), {
-  placeholder: "ค้นหา",
-  color: "default",
-  icon: "streamline:magnifying-glass-solid",
-  iconPosition: "right",
-  disabled: false,
-  disabledIcon: false,
-});
-
-const modelValue = defineModel<string>({
-  default: "",
-});
-
-const onEnter = () => {
-  onSearch();
-  emit("enter");
-};
-
-const onClick = () => {
-  onSearch();
-  emit("click");
-};
-
-const onSearch = () => {
-  emit("search", modelValue.value);
-};
-</script> -->
+<template>
+  <div>asda</div>
+</template>
+<!-- <template>
+  <InputTextField
+    :prepend-icon="
+      !props.disabledIcon && iconPosition == 'left' ? props.icon : ''
+    "
+    :append-icon="
+      !props.disabledIcon && iconPosition == 'right' ? props.icon : ''
+    "
+    :full-rounded="props.fullRounded"
+    :full-width="props.fullWidth"
+    :placeholder="props.placeholder"
+    :height="props.height"
+    :width="props.width"
+    :max-width="props.maxWidth"
+    :min-width="props.minWidth"
+    :color="props.color"
+    :reset="props.reset"
+    :disabled="props.disabled"
+    @enter="onEnter"
+    @click-append-icon="onClick"
+    v-model="modelValue"
+  >
+    <template #prepend>
+      <slot name="prepend" />
+    </template>
+    <template #append>
+      <slot name="append" />
+    </template>
+  </InputTextField>
+</template>
+<script setup lang="ts">
+import type { InputSearchProps } from "@/types/components/input/input-search";
+
+const emit = defineEmits<{
+  (e: "enter"): void;
+  (e: "click"): void;
+  (e: "search", value: string): void;
+}>();
+
+const props = withDefaults(defineProps<InputSearchProps>(), {
+  placeholder: "ค้นหา",
+  color: "default",
+  icon: "streamline:magnifying-glass-solid",
+  iconPosition: "right",
+  disabled: false,
+  disabledIcon: false,
+});
+
+const modelValue = defineModel<string>({
+  default: "",
+});
+
+const onEnter = () => {
+  onSearch();
+  emit("enter");
+};
+
+const onClick = () => {
+  onSearch();
+  emit("click");
+};
+
+const onSearch = () => {
+  emit("search", modelValue.value);
+};
+</script> -->