@ramathibodi/nuxt-commons 0.1.74 → 4.0.0

package/dist/runtime/components/form/images/Field.d.vue.ts

@@ -0,0 +1,27 @@
+import { type Base64Image } from '../../../composables/assetFile.js';
+interface Props {
+    modelValue?: Base64Image[];
+    readonly?: boolean;
+    label?: string;
+    accept?: string;
+    autoHydrate?: boolean;
+    maxFileSize?: number;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {
+    errorMessages: import("vue").ComputedRef<(string & string[]) | (readonly string[] & string[]) | undefined>;
+    isValid: import("vue").ComputedRef<boolean | null | undefined>;
+    reset: () => Promise<void> | undefined;
+    resetValidation: () => Promise<void> | undefined;
+    validate: () => Promise<string[]> | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: Base64Image[]) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Base64Image[]) => any) | undefined;
+}>, {
+    modelValue: Base64Image[];
+    accept: string;
+    autoHydrate: boolean;
+    maxFileSize: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/form/images/Field.vue

@@ -1,241 +1,171 @@
-<script lang="ts" setup>
-/**
- * FormImagesField handles image capture, editing, preview, and value synchronization for schema-driven form image fields.
- * This doc block is consumed by vue-docgen for generated API documentation.
- */
-import { ref, watch,computed } from 'vue'
-import { isEqual } from 'lodash-es'
-import { VInput } from 'vuetify/components/VInput'
-import { assetUrl } from '#imports'
-import { useAlert } from '../../../composables/alert'
-import { useAssetFile, type Base64Image, type Base64Asset, type Base64File} from '../../../composables/assetFile'
-
-/**
- * Custom events emitted by FormImagesField.
- * Parents can listen to these events to react to user actions and internal state changes.
- */
-const emit = defineEmits<{
-  (e: 'update:modelValue', value: Base64Image[]): void
-}>()
-
-const alert = useAlert()
-const { fileToBase64, hydrateAssetFile } = useAssetFile()
-
-interface Props {
-  modelValue?: Base64Image[] // Bound value for v-model synchronization with the parent component.
-  readonly?: boolean // renders as read-only while keeping value visible
-  label?: string // UI label displayed to end users
-  accept?: string // Accepted file MIME types or extensions for file selection.
-  autoHydrate?: boolean // Converts incoming serialized values into component runtime format on mount/watch.
-  maxFileSize?: number // Maximum allowed image file size in MB before conversion.
-}
-/**
- * Public props accepted by FormImagesField.
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
- */
-const props = withDefaults(defineProps<Props>(), {
-  modelValue: () => [] as Base64Image[],
-  accept: '.jpg,.jpeg,.png,.webp,.gif,.bmp,.tiff,.tif',
-  autoHydrate: false,
-  maxFileSize: 10,
-})
-
-/** Internal state (always Base64Image[]) */
-const images = ref<Base64Image[]>([])
-const uploadImages = ref<File[]>([])
-
-/** Dialogs */
-const dialog = ref(false)               // capture dialog
-const dialogUpdate = ref(false)         // edit dialog
-const dataUpdate = ref<Base64Image>({ imageData: {}, imageTitle: '', imageProps: {} })
-
-/** Fullscreen preview */
-const dialogImageFullScreen = ref(false)
-const imageFullScreen = ref<{title: string,image: string|undefined}>({ title: '', image: '' })
-
-/** ---------- Stable keys + guards ---------- */
-let internalSync = false
-let lastEmittedSig = ''   // signature of last emitted state
-
-function imageKey(im: Base64Image): string {
-  const id = im.imageData?.id
-  if (id != null) return `id:${id}`
-  const title = im.imageTitle ?? ''
-  const len = im.imageData?.base64String?.length ?? 0
-  return `t:${title}|l:${len}`
+<script setup>
+import { ref, watch, computed } from "vue";
+import { isEqual } from "lodash-es";
+import { VInput } from "vuetify/components/VInput";
+import { assetUrl } from "#imports";
+import { useAlert } from "../../../composables/alert";
+import { useAssetFile } from "../../../composables/assetFile";
+const emit = defineEmits(["update:modelValue"]);
+const alert = useAlert();
+const { fileToBase64, hydrateAssetFile } = useAssetFile();
+const props = defineProps({
+  modelValue: { type: Array, required: false, default: () => [] },
+  readonly: { type: Boolean, required: false },
+  label: { type: String, required: false },
+  accept: { type: String, required: false, default: ".jpg,.jpeg,.png,.webp,.gif,.bmp,.tiff,.tif" },
+  autoHydrate: { type: Boolean, required: false, default: false },
+  maxFileSize: { type: Number, required: false, default: 10 }
+});
+const images = ref([]);
+const uploadImages = ref([]);
+const dialog = ref(false);
+const dialogUpdate = ref(false);
+const dataUpdate = ref({ imageData: {}, imageTitle: "", imageProps: {} });
+const dialogImageFullScreen = ref(false);
+const imageFullScreen = ref({ title: "", image: "" });
+let internalSync = false;
+let lastEmittedSig = "";
+function imageKey(im) {
+  const id = im.imageData?.id;
+  if (id != null) return `id:${id}`;
+  const title = im.imageTitle ?? "";
+  const len = im.imageData?.base64String?.length ?? 0;
+  return `t:${title}|l:${len}`;
 }
-
-function signature(arr: Base64Image[]): string {
-  return arr.map(imageKey).join('|')
+function signature(arr) {
+  return arr.map(imageKey).join("|");
 }
-
-/** Emit helper (guarded + updates last signature) */
-function emitNow(next: Base64Image[]) {
-  const sig = signature(next)
-  if (sig === lastEmittedSig) return
-  internalSync = true
+function emitNow(next) {
+  const sig = signature(next);
+  if (sig === lastEmittedSig) return;
+  internalSync = true;
   try {
-    emit('update:modelValue', next)
-    lastEmittedSig = sig
+    emit("update:modelValue", next);
+    lastEmittedSig = sig;
   } finally {
-    queueMicrotask(() => { internalSync = false })
+    queueMicrotask(() => {
+      internalSync = false;
+    });
   }
 }
-
-/** ---------- Helpers ---------- */
-
-const addImage = (img: Base64Image) => {
+const addImage = (img) => {
   images.value.push({
     imageData: img.imageData ?? {},
-    imageTitle: img.imageTitle ?? '',
-    imageProps: img.imageProps ?? {},
-  })
-  dialog.value = false
-}
-
-const remove = (index: number) => {
-  images.value.splice(index, 1)
-}
-
-const setDataUpdate = (img: Base64Image) => {
+    imageTitle: img.imageTitle ?? "",
+    imageProps: img.imageProps ?? {}
+  });
+  dialog.value = false;
+};
+const remove = (index) => {
+  images.value.splice(index, 1);
+};
+const setDataUpdate = (img) => {
   dataUpdate.value = {
-    imageData: { ...(img.imageData ?? {}) },
-    imageTitle: img.imageTitle ?? '',
-    imageProps: { ...(img.imageProps ?? {}) },
-  }
-  dialogUpdate.value = true
-}
-
-const checkDuplicationName = (name: string) => images.value.some(({ imageTitle }) => isEqual(imageTitle, name))
-
-const isImageDataUrl = (dataUrl: string) => /^data:image\//i.test(dataUrl)
-
-const imageSrcFromImageData = (imageData: Base64Image) => {
-  if (imageData?.imageData?.base64String) return useAssetFile().ensureDataUrl(imageData?.imageData?.base64String.trim(),(imageData?.imageData as Base64File).fileType || "image/png")
-  if (imageData?.imageData?.id != null) return assetUrl(imageData.imageData.id)
-  return undefined
-}
-
-/** File → Base64Image using composable */
-const fileToBase64Image = async (file: File): Promise<Base64Image | null> => {
+    imageData: { ...img.imageData ?? {} },
+    imageTitle: img.imageTitle ?? "",
+    imageProps: { ...img.imageProps ?? {} }
+  };
+  dialogUpdate.value = true;
+};
+const checkDuplicationName = (name) => images.value.some(({ imageTitle }) => isEqual(imageTitle, name));
+const isImageDataUrl = (dataUrl) => /^data:image\//i.test(dataUrl);
+const imageSrcFromImageData = (imageData) => {
+  if (imageData?.imageData?.base64String) return useAssetFile().ensureDataUrl(imageData?.imageData?.base64String.trim(), (imageData?.imageData).fileType || "image/png");
+  if (imageData?.imageData?.id != null) return assetUrl(imageData.imageData.id);
+  return void 0;
+};
+const fileToBase64Image = async (file) => {
   try {
-    const base64 = await fileToBase64(file,props.maxFileSize)
-    const dataUrl = base64.base64String || ''
+    const base64 = await fileToBase64(file, props.maxFileSize);
+    const dataUrl = base64.base64String || "";
     if (!isImageDataUrl(dataUrl)) {
-      alert?.addAlert({ message: `File "${base64.fileName}" is not supported image type.`, alertType: 'error' })
-      return null
+      alert?.addAlert({ message: `File "${base64.fileName}" is not supported image type.`, alertType: "error" });
+      return null;
     }
     return {
-      imageData: { base64String: dataUrl } as Base64Asset,
+      imageData: { base64String: dataUrl },
       imageTitle: base64.fileName,
-      imageProps: {},
-    }
-  } catch (e: any) {
-    alert?.addAlert({ message: String(e), alertType: 'error' })
-    return null
+      imageProps: {}
+    };
+  } catch (e) {
+    alert?.addAlert({ message: String(e), alertType: "error" });
+    return null;
   }
-}
-
-/** Handle upload button update */
+};
 const uploadImageFile = async () => {
-  const duplicated: string[] = []
+  const duplicated = [];
   for (const file of uploadImages.value) {
     if (checkDuplicationName(file.name)) {
-      duplicated.push(file.name)
-      continue
+      duplicated.push(file.name);
+      continue;
     }
-    const base64Image = await fileToBase64Image(file)
-    if (base64Image) addImage(base64Image)
+    const base64Image = await fileToBase64Image(file);
+    if (base64Image) addImage(base64Image);
   }
-  uploadImages.value = []
+  uploadImages.value = [];
   if (duplicated.length) {
-    alert?.addAlert({ message: `File(s) are duplicated. ${duplicated.join(', ')}`, alertType: 'error' })
+    alert?.addAlert({ message: `File(s) are duplicated. ${duplicated.join(", ")}`, alertType: "error" });
   }
-}
-
-/** Capture flow (FormDialog) */
-type FormDialogCallback = { done: () => void }
-const modelData = ref()
-
-const captureImage = (payload: any, cb: FormDialogCallback) => {
-  const dataUrl: string = payload?.imageCapture ?? ''
+};
+const modelData = ref();
+const captureImage = (payload, cb) => {
+  const dataUrl = payload?.imageCapture ?? "";
   if (!dataUrl || !isImageDataUrl(dataUrl)) {
-    alert?.addAlert({ message: 'Invalid image.', alertType: 'error' })
-    return
+    alert?.addAlert({ message: "Invalid image.", alertType: "error" });
+    return;
   }
   addImage({
     imageData: { base64String: dataUrl },
     imageTitle: Math.random().toString(36).slice(2, 11),
-    imageProps: {},
-  })
-  cb?.done?.()
-}
-
-/** Fullscreen preview */
-const openImageFullScreen = (img: Base64Image) => {
-  dialogImageFullScreen.value = true
-  imageFullScreen.value.title = img.imageTitle ?? ''
-  imageFullScreen.value.image = imageSrcFromImageData(img)
-}
-
-/** ---------- Watchers (signature-based) ---------- */
-
-/* Parent → Internal */
+    imageProps: {}
+  });
+  cb?.done?.();
+};
+const openImageFullScreen = (img) => {
+  dialogImageFullScreen.value = true;
+  imageFullScreen.value.title = img.imageTitle ?? "";
+  imageFullScreen.value.image = imageSrcFromImageData(img);
+};
 watch(
-    () => props.modelValue,
-    async (val) => {
-      if (internalSync) return
-
-      const next = Array.isArray(val) ? [...val] : []
-      const nextSig = signature(next)
-
-      // Only reassign when truly different
-      if (nextSig !== signature(images.value)) {
-        images.value = next
-
-        // optional hydration
-        if (props.autoHydrate && images.value.length) {
-          const targets = images.value.filter(
-              (im) => im.imageData?.id != null && !im.imageData?.base64String
-          )
-          if (targets.length) {
-            await Promise.allSettled(targets.map((im) => hydrateAssetFile(im.imageData!)))
-            // After hydration, emit once (guarded) to update parent
-            emitNow(images.value)
-          }
+  () => props.modelValue,
+  async (val) => {
+    if (internalSync) return;
+    const next = Array.isArray(val) ? [...val] : [];
+    const nextSig = signature(next);
+    if (nextSig !== signature(images.value)) {
+      images.value = next;
+      if (props.autoHydrate && images.value.length) {
+        const targets = images.value.filter(
+          (im) => im.imageData?.id != null && !im.imageData?.base64String
+        );
+        if (targets.length) {
+          await Promise.allSettled(targets.map((im) => hydrateAssetFile(im.imageData)));
+          emitNow(images.value);
         }
-
-        // sync lastEmittedSig to current internal state so next local change emits
-        lastEmittedSig = signature(images.value)
       }
-    },
-    { deep: true, immediate: true }
-)
-
-/* Internal → Parent: watch the signature instead of deep structure */
+      lastEmittedSig = signature(images.value);
+    }
+  },
+  { deep: true, immediate: true }
+);
 watch(
-    () => signature(images.value),
-    () => {
-      if (internalSync) return
-      // Only emit when signature actually changes
-      emitNow(images.value)
-    },
-    { immediate: false }
-)
-
-// validation passthrough
-const inputRef = ref<InstanceType<typeof VInput> | null>(null)
-
-const isValid = computed(() => inputRef.value?.isValid)
-const errorMessages = computed(() => inputRef.value?.errorMessages)
-
+  () => signature(images.value),
+  () => {
+    if (internalSync) return;
+    emitNow(images.value);
+  },
+  { immediate: false }
+);
+const inputRef = ref(null);
+const isValid = computed(() => inputRef.value?.isValid);
+const errorMessages = computed(() => inputRef.value?.errorMessages);
 defineExpose({
   errorMessages,
   isValid,
   reset: () => inputRef.value?.reset(),
   resetValidation: () => inputRef.value?.resetValidation(),
-  validate: () => inputRef.value?.validate(),
-})
+  validate: () => inputRef.value?.validate()
+});
 </script>
 
 <template>
@@ -267,7 +197,7 @@ defineExpose({
               </VToolbar>
 
               <VCardText>
-                <VRow dense justify="start">
+                <VRow density="compact" justify="start">
                   <VCol v-for="(image, index) in images" :key="`${imageKey(image)}-${index}`" cols="4">
                     <VCard>
                       <VToolbar density="compact">
@@ -288,7 +218,9 @@ defineExpose({
                       <v-img
                           :src="imageSrcFromImageData(image)"
                           height="250"
-                          @click="() => { (props.readonly || image.imageData?.id || isReadonly?.value) ? openImageFullScreen(image) : setDataUpdate(image) }"
+                          @click="() => {
+  props.readonly || image.imageData?.id || isReadonly?.value ? openImageFullScreen(image) : setDataUpdate(image);
+}"
                           :disabled="isDisabled?.value"
                       />
                     </VCard>
@@ -300,7 +232,6 @@ defineExpose({
         </v-row>
       </v-container>
 
-
       <!-- Edit dialog -->
       <VDialog v-model="dialogUpdate" fullscreen transition="dialog-bottom-transition">
         <FormImagesPad

package/dist/runtime/components/form/images/Field.vue.d.ts

@@ -0,0 +1,27 @@
+import { type Base64Image } from '../../../composables/assetFile.js';
+interface Props {
+    modelValue?: Base64Image[];
+    readonly?: boolean;
+    label?: string;
+    accept?: string;
+    autoHydrate?: boolean;
+    maxFileSize?: number;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {
+    errorMessages: import("vue").ComputedRef<(string & string[]) | (readonly string[] & string[]) | undefined>;
+    isValid: import("vue").ComputedRef<boolean | null | undefined>;
+    reset: () => Promise<void> | undefined;
+    resetValidation: () => Promise<void> | undefined;
+    validate: () => Promise<string[]> | undefined;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: Base64Image[]) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((value: Base64Image[]) => any) | undefined;
+}>, {
+    modelValue: Base64Image[];
+    accept: string;
+    autoHydrate: boolean;
+    maxFileSize: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/form/images/Pad.d.vue.ts

@@ -0,0 +1,13 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: StringConstructor;
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+    closedDialog: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: StringConstructor;
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onClosedDialog?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/form/images/Pad.vue

@@ -1,55 +1,38 @@
-<script setup lang="ts">
-/**
- * FormImagesPad handles image capture, editing, preview, and value synchronization for schema-driven form image fields.
- * This doc block is consumed by vue-docgen for generated API documentation.
- */
-import { onMounted, nextTick } from 'vue';
-import Painterro from 'painterro';
-
-/**
- * Public props accepted by FormImagesPad.
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
- */
+<script setup>
+import { onMounted, nextTick } from "vue";
+import Painterro from "painterro";
 const props = defineProps({
   modelValue: String
-})
-
-/**
- * Custom events emitted by FormImagesPad.
- * Parents can listen to these events to react to user actions and internal state changes.
- */
-const emit = defineEmits(['update:modelValue', 'closedDialog'])
-
+});
+const emit = defineEmits(["update:modelValue", "closedDialog"]);
 const setting = {
   id: "painterroContainer",
-  defaultTool: 'brush',
-  toolbarPosition: 'top',
-  toolbarHeightPx: '50',
-  pixelizePixelSize: '5%',
+  defaultTool: "brush",
+  toolbarPosition: "top",
+  toolbarHeightPx: "50",
+  pixelizePixelSize: "5%",
   hiddenTools: [
-    'resize',
-    'redo',
-    'bucket',
-    'clear',
-    'settings',
+    "resize",
+    "redo",
+    "bucket",
+    "clear",
+    "settings"
   ],
-  saveHandler: function (image:any, done:any) {
-    emit('update:modelValue', image.asDataURL())
-    emit('closedDialog', false)
-    done(true)
+  saveHandler: function(image, done) {
+    emit("update:modelValue", image.asDataURL());
+    emit("closedDialog", false);
+    done(true);
   },
-  onClose: function () {
-    emit('closedDialog', false)
+  onClose: function() {
+    emit("closedDialog", false);
   }
-}
-
+};
 onMounted(async () => {
   await nextTick();
-  props.modelValue != "" ? Painterro(setting).show(props.modelValue) : Painterro(setting).show()
+  props.modelValue != "" ? Painterro(setting).show(props.modelValue) : Painterro(setting).show();
 });
-
 </script>
 
 <template>
   <div id="painterroContainer" style="width: 100%; height: 100dvh;"></div>
-</template>
+</template>

package/dist/runtime/components/form/images/Pad.vue.d.ts

@@ -0,0 +1,13 @@
+declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    modelValue: StringConstructor;
+}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (...args: any[]) => void;
+    closedDialog: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: StringConstructor;
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onClosedDialog?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/label/Date.d.vue.ts

@@ -0,0 +1,13 @@
+import { type dateFormat, type dateTimeFormat } from '../../utils/datetime.js';
+interface Props {
+    modelValue?: string;
+    locale?: 'TH' | 'EN';
+    fromFormat?: string;
+    format?: dateFormat | dateTimeFormat | string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    locale: "TH" | "EN";
+    format: dateFormat | dateTimeFormat | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/label/Date.vue

@@ -1,35 +1,19 @@
-<script lang="ts" setup>
-/**
- * LabelDate renders read-only label output with formatting logic for display-oriented model values.
- * This doc block is consumed by vue-docgen for generated API documentation.
- */
-import { computed } from 'vue'
-import { type dateFormat, type dateTimeFormat, Datetime } from '../../utils/datetime'
-
-interface Props {
-  modelValue?: string // Bound value for v-model synchronization with the parent component.
-  locale?: 'TH' | 'EN' // Locale used for date/time formatting and localized labels.
-  fromFormat?: string // Input format used to parse incoming string values.
-  format?: dateFormat | dateTimeFormat | string // Output format used when converting the value for display or emit.
-}
-
-/**
- * Public props accepted by LabelDate.
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
- */
-const props = withDefaults(defineProps<Props>(), {
-  locale: 'TH',
-  format: 'shortDate',
-})
-
+<script setup>
+import { computed } from "vue";
+import { Datetime } from "../../utils/datetime";
+const props = defineProps({
+  modelValue: { type: String, required: false },
+  locale: { type: String, required: false, default: "TH" },
+  fromFormat: { type: String, required: false },
+  format: { type: String, required: false, default: "shortDate" }
+});
 const formattedDate = computed(() => {
   if (!props.modelValue) {
-    return null
+    return null;
   }
-
-  const dateTime = Datetime().fromString(props.modelValue, props.fromFormat)
-  return dateTime.luxonDateTime.isValid ? dateTime.toFormat(props.format, props.locale) : props.modelValue
-})
+  const dateTime = Datetime().fromString(props.modelValue, props.fromFormat);
+  return dateTime.luxonDateTime.isValid ? dateTime.toFormat(props.format, props.locale) : props.modelValue;
+});
 </script>
 
 <template>

package/dist/runtime/components/label/Date.vue.d.ts

@@ -0,0 +1,13 @@
+import { type dateFormat, type dateTimeFormat } from '../../utils/datetime.js';
+interface Props {
+    modelValue?: string;
+    locale?: 'TH' | 'EN';
+    fromFormat?: string;
+    format?: dateFormat | dateTimeFormat | string;
+}
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{}>, {
+    locale: "TH" | "EN";
+    format: dateFormat | dateTimeFormat | string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;