@finema/core 1.4.9 → 1.4.10

package/dist/runtime/components/Form/Fields.vue

@@ -1,86 +1,86 @@
-<template>
-  <div class="fields space-y-4">
-    <template v-for="(option, index) in options" :key="option.props.name + index + option.type">
-      <div v-if="!option.isHide" :class="option.class">
-        <FormInputStatic
-          v-if="option.type === INPUT_TYPES.STATIC"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputText
-          v-else-if="option.type === INPUT_TYPES.TEXT"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputText
-          v-else-if="option.type === INPUT_TYPES.PASSWORD"
-          type="password"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputText
-          v-else-if="option.type === INPUT_TYPES.EMAIL"
-          type="email"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputTextarea
-          v-else-if="option.type === INPUT_TYPES.TEXTAREA"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputToggle
-          v-else-if="option.type === INPUT_TYPES.TOGGLE"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputSelect
-          v-else-if="option.type === INPUT_TYPES.SELECT"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputRadio
-          v-else-if="option.type === INPUT_TYPES.RADIO"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputCheckbox
-          v-else-if="option.type === INPUT_TYPES.CHECKBOX"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputDateTime
-          v-else-if="option.type === INPUT_TYPES.DATE_TIME"
-          :form="form"
-          v-bind="option.props"
-          v-on="option.on ?? {}"
-        />
-        <FormInputDateTime
-          v-else-if="option.type === INPUT_TYPES.DATE"
-          :form="form"
-          v-bind="option.props"
-          :disabled-time="true"
-          v-on="option.on ?? {}"
-        />
-      </div>
-    </template>
-  </div>
-</template>
-<script lang="ts" setup>
-import { type FormContext } from 'vee-validate'
-import { type IFormField, INPUT_TYPES } from '#core/components/Form/types'
-
-defineProps<{
-  form?: FormContext
-  options: IFormField[]
-}>()
-</script>
+<template>
+  <div class="fields space-y-4">
+    <template v-for="(option, index) in options" :key="option.props.name + index + option.type">
+      <div v-if="!option.isHide" :class="option.class">
+        <FormInputStatic
+          v-if="option.type === INPUT_TYPES.STATIC"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputText
+          v-else-if="option.type === INPUT_TYPES.TEXT"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputText
+          v-else-if="option.type === INPUT_TYPES.PASSWORD"
+          type="password"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputText
+          v-else-if="option.type === INPUT_TYPES.EMAIL"
+          type="email"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputTextarea
+          v-else-if="option.type === INPUT_TYPES.TEXTAREA"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputToggle
+          v-else-if="option.type === INPUT_TYPES.TOGGLE"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputSelect
+          v-else-if="option.type === INPUT_TYPES.SELECT"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputRadio
+          v-else-if="option.type === INPUT_TYPES.RADIO"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputCheckbox
+          v-else-if="option.type === INPUT_TYPES.CHECKBOX"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputDateTime
+          v-else-if="option.type === INPUT_TYPES.DATE_TIME"
+          :form="form"
+          v-bind="option.props"
+          v-on="option.on ?? {}"
+        />
+        <FormInputDateTime
+          v-else-if="option.type === INPUT_TYPES.DATE"
+          :form="form"
+          v-bind="option.props"
+          :disabled-time="true"
+          v-on="option.on ?? {}"
+        />
+      </div>
+    </template>
+  </div>
+</template>
+<script lang="ts" setup>
+import { type FormContext } from 'vee-validate'
+import { type IFormField, INPUT_TYPES } from '#core/components/Form/types'
+
+defineProps<{
+  form?: FormContext
+  options: IFormField[]
+}>()
+</script>

package/dist/runtime/components/Form/InputCheckbox/index.vue

@@ -1,21 +1,21 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps" label="">
-    <UCheckbox
-      v-model="value"
-      :disabled="wrapperProps.isDisabled"
-      :name="name"
-      :label="props.label"
-      :required="isRequired"
-      :ui="ui"
-    />
-  </FieldWrapper>
-</template>
-<script lang="ts" setup>
-import { useFieldHOC } from '#core/composables/useForm'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-import { type ICheckboxFieldProps } from '#core/components/Form/InputCheckbox/types'
-
-const props = withDefaults(defineProps<ICheckboxFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<boolean>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps" label="">
+    <UCheckbox
+      v-model="value"
+      :disabled="wrapperProps.isDisabled"
+      :name="name"
+      :label="props.label"
+      :required="isRequired"
+      :ui="ui"
+    />
+  </FieldWrapper>
+</template>
+<script lang="ts" setup>
+import { useFieldHOC } from '#core/composables/useForm'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+import { type ICheckboxFieldProps } from '#core/components/Form/InputCheckbox/types'
+
+const props = withDefaults(defineProps<ICheckboxFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<boolean>(props)
+</script>

package/dist/runtime/components/Form/InputDateTime/index.vue

@@ -1,51 +1,51 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <Datepicker
-      v-model="value"
-      :disabled="wrapperProps.isDisabled"
-      cancel-text="ยกเลิก"
-      select-text="เลือก"
-      locale="th"
-      :enable-time-picker="!disabledTime"
-      :placeholder="wrapperProps.placeholder"
-      :format="format"
-      :min-date="minDate"
-      :max-date="maxDate"
-      :min-time="minTime"
-      :max-time="maxTime"
-      :start-time="startTime"
-      :required="isRequired"
-      time-picker-inline
-    >
-      <template #dp-input="{ value: innerValue }">
-        <UInput
-          icon="i-heroicons-calendar-days"
-          type="text"
-          :value="innerValue"
-          :placeholder="wrapperProps.placeholder"
-          :readonly="true"
-          input-class="cursor-pointer select-none"
-        />
-      </template>
-    </Datepicker>
-  </FieldWrapper>
-</template>
-<script lang="ts" setup>
-import Datepicker from '@vuepic/vue-datepicker'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-import { type IDateTimeFieldProps } from '#core/components/Form/InputDateTime/date_time_field.types'
-import { TimeHelper, useFieldHOC } from '#imports'
-import '@vuepic/vue-datepicker/dist/main.css'
-
-const props = withDefaults(defineProps<IDateTimeFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<string>(props)
-
-const format = (date: Date) => {
-  if (props.disabledTime) {
-    return TimeHelper.getDateFormTime(date as any)
-  }
-
-  return TimeHelper.getDateTimeFormTime(date as any)
-}
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <Datepicker
+      v-model="value"
+      :disabled="wrapperProps.isDisabled"
+      cancel-text="ยกเลิก"
+      select-text="เลือก"
+      locale="th"
+      :enable-time-picker="!disabledTime"
+      :placeholder="wrapperProps.placeholder"
+      :format="format"
+      :min-date="minDate"
+      :max-date="maxDate"
+      :min-time="minTime"
+      :max-time="maxTime"
+      :start-time="startTime"
+      :required="isRequired"
+      time-picker-inline
+    >
+      <template #dp-input="{ value: innerValue }">
+        <UInput
+          icon="i-heroicons-calendar-days"
+          type="text"
+          :value="innerValue"
+          :placeholder="wrapperProps.placeholder"
+          :readonly="true"
+          input-class="cursor-pointer select-none"
+        />
+      </template>
+    </Datepicker>
+  </FieldWrapper>
+</template>
+<script lang="ts" setup>
+import Datepicker from '@vuepic/vue-datepicker'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+import { type IDateTimeFieldProps } from '#core/components/Form/InputDateTime/date_time_field.types'
+import { TimeHelper, useFieldHOC } from '#imports'
+import '@vuepic/vue-datepicker/dist/main.css'
+
+const props = withDefaults(defineProps<IDateTimeFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<string>(props)
+
+const format = (date: Date) => {
+  if (props.disabledTime) {
+    return TimeHelper.getDateFormTime(date as any)
+  }
+
+  return TimeHelper.getDateTimeFormTime(date as any)
+}
+</script>

package/dist/runtime/components/Form/InputRadio/index.vue

@@ -1,27 +1,27 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <URadioGroup
-      v-model="value"
-      :options="options"
-      :disabled="wrapperProps.isDisabled"
-      :required="isRequired"
-      value-attribute="value"
-      option-attribute="label"
-      :icon="icon"
-      :color="color"
-      :size="size"
-      :ui="ui"
-      :ui-menu="uiMenu"
-    />
-  </FieldWrapper>
-</template>
-
-<script lang="ts" setup>
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-import { useFieldHOC } from '#core/composables/useForm'
-import { type ISelectFieldProps } from '#core/components/Form/InputSelect/types'
-
-const props = withDefaults(defineProps<ISelectFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<any>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <URadioGroup
+      v-model="value"
+      :options="options"
+      :disabled="wrapperProps.isDisabled"
+      :required="isRequired"
+      value-attribute="value"
+      option-attribute="label"
+      :icon="icon"
+      :color="color"
+      :size="size"
+      :ui="ui"
+      :ui-menu="uiMenu"
+    />
+  </FieldWrapper>
+</template>
+
+<script lang="ts" setup>
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+import { useFieldHOC } from '#core/composables/useForm'
+import { type ISelectFieldProps } from '#core/components/Form/InputSelect/types'
+
+const props = withDefaults(defineProps<ISelectFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<any>(props)
+</script>

package/dist/runtime/components/Form/InputSelect/index.vue

@@ -1,37 +1,37 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <USelectMenu
-      v-model="value"
-      searchable
-      :options="options"
-      :placeholder="placeholder || label"
-      :disabled="wrapperProps.isDisabled"
-      :loading="loading"
-      :searchable-placeholder="searchablePlaceholder"
-      value-attribute="value"
-      option-attribute="label"
-      :required="isRequired"
-      :icon="icon"
-      :color="color"
-      :size="size"
-      :ui="ui"
-      :ui-menu="uiMenu"
-    >
-      <template #label>
-        <span v-if="value" class="truncate">
-          {{ options.find((item) => item.value === value)?.label || value }}
-        </span>
-      </template>
-    </USelectMenu>
-  </FieldWrapper>
-</template>
-
-<script lang="ts" setup>
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-import { useFieldHOC } from '#core/composables/useForm'
-import { type ISelectFieldProps } from '#core/components/Form/InputSelect/types'
-
-const props = withDefaults(defineProps<ISelectFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<any>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <USelectMenu
+      v-model="value"
+      searchable
+      :options="options"
+      :placeholder="placeholder || label"
+      :disabled="wrapperProps.isDisabled"
+      :loading="loading"
+      :searchable-placeholder="searchablePlaceholder"
+      value-attribute="value"
+      option-attribute="label"
+      :required="isRequired"
+      :icon="icon"
+      :color="color"
+      :size="size"
+      :ui="ui"
+      :ui-menu="uiMenu"
+    >
+      <template #label>
+        <span v-if="value" class="truncate">
+          {{ options.find((item) => item.value === value)?.label || value }}
+        </span>
+      </template>
+    </USelectMenu>
+  </FieldWrapper>
+</template>
+
+<script lang="ts" setup>
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+import { useFieldHOC } from '#core/composables/useForm'
+import { type ISelectFieldProps } from '#core/components/Form/InputSelect/types'
+
+const props = withDefaults(defineProps<ISelectFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<any>(props)
+</script>

package/dist/runtime/components/Form/InputStatic/index.vue

@@ -1,16 +1,16 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps" :is-required="false">
-    <p class="form-control-static">
-      {{ !value || value.length === 0 ? '-' : value }}
-    </p>
-  </FieldWrapper>
-</template>
-<script lang="ts" setup>
-import { type IStaticFieldProps } from '#core/components/Form/InputStatic/types'
-import { useFieldHOC } from '#core/composables/useForm'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-
-const props = withDefaults(defineProps<IStaticFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<string>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps" :is-required="false">
+    <p class="form-control-static">
+      {{ !value || value.length === 0 ? '-' : value }}
+    </p>
+  </FieldWrapper>
+</template>
+<script lang="ts" setup>
+import { type IStaticFieldProps } from '#core/components/Form/InputStatic/types'
+import { useFieldHOC } from '#core/composables/useForm'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+
+const props = withDefaults(defineProps<IStaticFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<string>(props)
+</script>

package/dist/runtime/components/Form/InputText/index.vue

@@ -1,27 +1,27 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <UInput
-      v-model="value"
-      :disabled="wrapperProps.isDisabled"
-      :name="name"
-      :placeholder="wrapperProps.placeholder"
-      :type="isShowPassword ? 'text' : props.type || 'text'"
-      :autofocus="!!autoFocus"
-      :icon="icon"
-      :readonly="isReadonly"
-      :ui="ui"
-    />
-  </FieldWrapper>
-</template>
-<script lang="ts" setup>
-import { ref } from '#imports'
-import { type ITextFieldProps } from '#core/components/Form/InputText/types'
-import { useFieldHOC } from '#core/composables/useForm'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-
-const props = withDefaults(defineProps<ITextFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<string>(props)
-
-const isShowPassword = ref(false)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <UInput
+      v-model="value"
+      :disabled="wrapperProps.isDisabled"
+      :name="name"
+      :placeholder="wrapperProps.placeholder"
+      :type="isShowPassword ? 'text' : props.type || 'text'"
+      :autofocus="!!autoFocus"
+      :icon="icon"
+      :readonly="isReadonly"
+      :ui="ui"
+    />
+  </FieldWrapper>
+</template>
+<script lang="ts" setup>
+import { ref } from '#imports'
+import { type ITextFieldProps } from '#core/components/Form/InputText/types'
+import { useFieldHOC } from '#core/composables/useForm'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+
+const props = withDefaults(defineProps<ITextFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<string>(props)
+
+const isShowPassword = ref(false)
+</script>

package/dist/runtime/components/Form/InputTextarea/index.vue

@@ -1,25 +1,25 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <UTextarea
-      v-model="value"
-      :disabled="wrapperProps.isDisabled"
-      :name="name"
-      :resize="resize"
-      :placeholder="wrapperProps.placeholder"
-      :autofocus="!!autoFocus"
-      :autoresize="autoresize"
-      :rows="rows"
-      :readonly="isReadonly"
-      :ui="ui"
-    />
-  </FieldWrapper>
-</template>
-<script lang="ts" setup>
-import { useFieldHOC } from '#core/composables/useForm'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-import { type ITextareaFieldProps } from '#core/components/Form/InputTextarea/types'
-
-const props = withDefaults(defineProps<ITextareaFieldProps>(), {})
-
-const { value, wrapperProps } = useFieldHOC<string>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <UTextarea
+      v-model="value"
+      :disabled="wrapperProps.isDisabled"
+      :name="name"
+      :resize="resize"
+      :placeholder="wrapperProps.placeholder"
+      :autofocus="!!autoFocus"
+      :autoresize="autoresize"
+      :rows="rows"
+      :readonly="isReadonly"
+      :ui="ui"
+    />
+  </FieldWrapper>
+</template>
+<script lang="ts" setup>
+import { useFieldHOC } from '#core/composables/useForm'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+import { type ITextareaFieldProps } from '#core/components/Form/InputTextarea/types'
+
+const props = withDefaults(defineProps<ITextareaFieldProps>(), {})
+
+const { value, wrapperProps } = useFieldHOC<string>(props)
+</script>

package/dist/runtime/components/Form/InputToggle/index.vue

@@ -1,14 +1,14 @@
-<template>
-  <FieldWrapper v-bind="wrapperProps">
-    <UToggle v-model="value" :disabled="wrapperProps.isDisabled" :name="name" :ui="ui" />
-  </FieldWrapper>
-</template>
-
-<script lang="ts" setup>
-import { useFieldHOC } from '#core/composables/useForm'
-import { type IToggleFieldProps } from '#core/components/Form/InputToggle/types'
-import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
-
-const props = withDefaults(defineProps<IToggleFieldProps>(), {})
-const { value, wrapperProps } = useFieldHOC<boolean>(props)
-</script>
+<template>
+  <FieldWrapper v-bind="wrapperProps">
+    <UToggle v-model="value" :disabled="wrapperProps.isDisabled" :name="name" :ui="ui" />
+  </FieldWrapper>
+</template>
+
+<script lang="ts" setup>
+import { useFieldHOC } from '#core/composables/useForm'
+import { type IToggleFieldProps } from '#core/components/Form/InputToggle/types'
+import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
+
+const props = withDefaults(defineProps<IToggleFieldProps>(), {})
+const { value, wrapperProps } = useFieldHOC<boolean>(props)
+</script>

package/dist/runtime/components/Form/index.vue

@@ -1,6 +1,6 @@
-<template>
-  <form class="form">
-    <slot />
-  </form>
-</template>
-<script lang="ts" setup></script>
+<template>
+  <form class="form">
+    <slot />
+  </form>
+</template>
+<script lang="ts" setup></script>