@ramathibodi/nuxt-commons 0.1.74 → 0.1.75

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

@@ -1,55 +1,55 @@
-<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.
- */
-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 setting = {
-  id: "painterroContainer",
-  defaultTool: 'brush',
-  toolbarPosition: 'top',
-  toolbarHeightPx: '50',
-  pixelizePixelSize: '5%',
-  hiddenTools: [
-    'resize',
-    'redo',
-    'bucket',
-    'clear',
-    'settings',
-  ],
-  saveHandler: function (image:any, done:any) {
-    emit('update:modelValue', image.asDataURL())
-    emit('closedDialog', false)
-    done(true)
-  },
-  onClose: function () {
-    emit('closedDialog', false)
-  }
-}
-
-onMounted(async () => {
-  await nextTick();
-  props.modelValue != "" ? Painterro(setting).show(props.modelValue) : Painterro(setting).show()
-});
-
-</script>
-
-<template>
-  <div id="painterroContainer" style="width: 100%; height: 100dvh;"></div>
+<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.
+ */
+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 setting = {
+  id: "painterroContainer",
+  defaultTool: 'brush',
+  toolbarPosition: 'top',
+  toolbarHeightPx: '50',
+  pixelizePixelSize: '5%',
+  hiddenTools: [
+    'resize',
+    'redo',
+    'bucket',
+    'clear',
+    'settings',
+  ],
+  saveHandler: function (image:any, done:any) {
+    emit('update:modelValue', image.asDataURL())
+    emit('closedDialog', false)
+    done(true)
+  },
+  onClose: function () {
+    emit('closedDialog', false)
+  }
+}
+
+onMounted(async () => {
+  await nextTick();
+  props.modelValue != "" ? Painterro(setting).show(props.modelValue) : Painterro(setting).show()
+});
+
+</script>
+
+<template>
+  <div id="painterroContainer" style="width: 100%; height: 100dvh;"></div>
 </template>

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

@@ -1,37 +1,37 @@
-<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',
-})
-
-const formattedDate = computed(() => {
-  if (!props.modelValue) {
-    return null
-  }
-
-  const dateTime = Datetime().fromString(props.modelValue, props.fromFormat)
-  return dateTime.luxonDateTime.isValid ? dateTime.toFormat(props.format, props.locale) : props.modelValue
-})
-</script>
-
-<template>
-  {{ formattedDate }}
-</template>
+<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',
+})
+
+const formattedDate = computed(() => {
+  if (!props.modelValue) {
+    return null
+  }
+
+  const dateTime = Datetime().fromString(props.modelValue, props.fromFormat)
+  return dateTime.luxonDateTime.isValid ? dateTime.toFormat(props.format, props.locale) : props.modelValue
+})
+</script>
+
+<template>
+  {{ formattedDate }}
+</template>

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

@@ -1,103 +1,103 @@
-<script setup lang="ts">
-/**
- * LabelDateAgo 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 { DateTime } from "luxon";
-import { computed } from "vue";
-
-type Unit = 'years' | 'months' | 'days' | 'hours' | 'minutes' | 'seconds';
-type Locale = 'th' | 'en' | 'en-US' | 'th-TH';
-
-interface Props {
-  modelValue: DateTime; // Bound value for v-model synchronization with the parent component.
-  endDate?: DateTime; // date value used by component logic and display
-  locale?: Locale; // Locale used for date/time formatting and localized labels.
-  showSuffix?: boolean; // Appends relative-time suffix text like "ago" or "in".
-  units?: Unit[]; // Time units allowed in relative date calculations.
-}
-
-/**
- * Public props accepted by LabelDateAgo.
- * Document each prop field with intent, defaults, and side effects for clear generated docs.
- */
-const props = withDefaults(defineProps<Props>(), {
-  locale: 'th',
-  showSuffix: true
-});
-
-// Fallback map: map complex locale (e.g., en-US) to base (e.g., en)
-const normalizeLocale = (locale: Locale): 'en' | 'th' => {
-  if (locale.startsWith('en')) return 'en';
-  if (locale.startsWith('th')) return 'th';
-  return 'th'; // default fallback
-};
-
-const localizedLabels: Record<'en' | 'th', Record<Unit, string>> = {
-  en: {
-    years: 'years',
-    months: 'months',
-    days: 'days',
-    hours: 'hours',
-    minutes: 'minutes',
-    seconds: 'seconds',
-  },
-  th: {
-    years: 'ปี',
-    months: 'เดือน',
-    days: 'วัน',
-    hours: 'ชั่วโมง',
-    minutes: 'นาที',
-    seconds: 'วินาที',
-  },
-};
-
-const localizedSuffix: Record<'en' | 'th', string> = {
-  en: 'ago',
-  th: 'ที่ผ่านมา',
-};
-
-const outputText = computed(() => {
-  const base = props.endDate ?? DateTime.now(); // 👈 ใช้ baseDate ถ้ามี ไม่งั้น fallback เป็น now
-  const baseLocale = normalizeLocale(props.locale);
-
-  const units: Unit[] = props.units?.length
-      ? props.units
-      : ['years', 'months', 'days', 'hours', 'minutes', 'seconds'];
-
-  const diff = base.diff(props.modelValue, units).toObject();
-
-  // แสดงแบบ single unit
-  if (!props.units) {
-    const foundUnit = units.find(unit => (diff[unit] ?? 0) >= 1);
-    const value = Math.floor(diff[foundUnit!] ?? 0);
-    const label = localizedLabels[baseLocale][foundUnit!];
-    const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
-    return `${value} ${label}${suffix}`;
-  }
-
-  // แสดงหลาย unit
-  const parts = units.map(unit => {
-    const value = Math.floor(diff[unit] ?? 0);
-    if (value > 0) {
-      const label = localizedLabels[baseLocale][unit];
-      return `${value} ${label}`;
-    }
-    return '';
-  }).filter(Boolean);
-
-  if (parts.length === 0) {
-    const lastUnit = units.at(-1)!;
-    const label = localizedLabels[baseLocale][lastUnit];
-    const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
-    return `0 ${label}${suffix}`;
-  }
-
-  const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
-  return `${parts.join(' ')}${suffix}`;
-});
-</script>
-
-<template>
-  <span>{{ outputText }}</span>
+<script setup lang="ts">
+/**
+ * LabelDateAgo 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 { DateTime } from "luxon";
+import { computed } from "vue";
+
+type Unit = 'years' | 'months' | 'days' | 'hours' | 'minutes' | 'seconds';
+type Locale = 'th' | 'en' | 'en-US' | 'th-TH';
+
+interface Props {
+  modelValue: DateTime; // Bound value for v-model synchronization with the parent component.
+  endDate?: DateTime; // date value used by component logic and display
+  locale?: Locale; // Locale used for date/time formatting and localized labels.
+  showSuffix?: boolean; // Appends relative-time suffix text like "ago" or "in".
+  units?: Unit[]; // Time units allowed in relative date calculations.
+}
+
+/**
+ * Public props accepted by LabelDateAgo.
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
+ */
+const props = withDefaults(defineProps<Props>(), {
+  locale: 'th',
+  showSuffix: true
+});
+
+// Fallback map: map complex locale (e.g., en-US) to base (e.g., en)
+const normalizeLocale = (locale: Locale): 'en' | 'th' => {
+  if (locale.startsWith('en')) return 'en';
+  if (locale.startsWith('th')) return 'th';
+  return 'th'; // default fallback
+};
+
+const localizedLabels: Record<'en' | 'th', Record<Unit, string>> = {
+  en: {
+    years: 'years',
+    months: 'months',
+    days: 'days',
+    hours: 'hours',
+    minutes: 'minutes',
+    seconds: 'seconds',
+  },
+  th: {
+    years: 'ปี',
+    months: 'เดือน',
+    days: 'วัน',
+    hours: 'ชั่วโมง',
+    minutes: 'นาที',
+    seconds: 'วินาที',
+  },
+};
+
+const localizedSuffix: Record<'en' | 'th', string> = {
+  en: 'ago',
+  th: 'ที่ผ่านมา',
+};
+
+const outputText = computed(() => {
+  const base = props.endDate ?? DateTime.now(); // 👈 ใช้ baseDate ถ้ามี ไม่งั้น fallback เป็น now
+  const baseLocale = normalizeLocale(props.locale);
+
+  const units: Unit[] = props.units?.length
+      ? props.units
+      : ['years', 'months', 'days', 'hours', 'minutes', 'seconds'];
+
+  const diff = base.diff(props.modelValue, units).toObject();
+
+  // แสดงแบบ single unit
+  if (!props.units) {
+    const foundUnit = units.find(unit => (diff[unit] ?? 0) >= 1);
+    const value = Math.floor(diff[foundUnit!] ?? 0);
+    const label = localizedLabels[baseLocale][foundUnit!];
+    const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
+    return `${value} ${label}${suffix}`;
+  }
+
+  // แสดงหลาย unit
+  const parts = units.map(unit => {
+    const value = Math.floor(diff[unit] ?? 0);
+    if (value > 0) {
+      const label = localizedLabels[baseLocale][unit];
+      return `${value} ${label}`;
+    }
+    return '';
+  }).filter(Boolean);
+
+  if (parts.length === 0) {
+    const lastUnit = units.at(-1)!;
+    const label = localizedLabels[baseLocale][lastUnit];
+    const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
+    return `0 ${label}${suffix}`;
+  }
+
+  const suffix = props.showSuffix ? localizedSuffix[baseLocale] : '';
+  return `${parts.join(' ')}${suffix}`;
+});
+</script>
+
+<template>
+  <span>{{ outputText }}</span>
 </template>