@ramathibodi/nuxt-commons 0.1.73 → 0.1.75

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

@@ -1,38 +1,46 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-interface Props {
-  modelValue: string
-  variant?: 'mobilePhone' | 'homePhone' | 'citizenId' | 'creditCard'
-  hideContent?: boolean
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  hideContent: false,
-})
-
-const labelMask = computed(() => {
-  if (!props.hideContent) {
-    if (props.variant == 'mobilePhone') return props.modelValue.length == 10 ? `${props.modelValue.substring(0, 3)}-${props.modelValue.substring(3, 6)}-${props.modelValue.substring(6, 10)}` : 'invalid format'
-    if (props.variant == 'homePhone') return props.modelValue.length == 9 ? `${props.modelValue.substring(0, 2)}-${props.modelValue.substring(2, 5)}-${props.modelValue.substring(5, 9)}` : 'invalid format'
-    if (props.variant == 'citizenId') return props.modelValue.length == 13 ? `${props.modelValue.substring(0, 1)}-${props.modelValue.substring(1, 5)}-${props.modelValue.substring(5, 10)}-${props.modelValue.substring(10, 12)}-${props.modelValue.substring(12, 13)}` : 'invalid format'
-    if (props.variant == 'creditCard') return props.modelValue.length == 16 ? `${props.modelValue.substring(0, 4)}-${props.modelValue.substring(4, 8)}-${props.modelValue.substring(8, 12)}-${props.modelValue.substring(12, 16)}` : 'invalid format'
-
-    const middlePart = 'x'.repeat(props.modelValue.length - 6)
-    return `${props.modelValue.substring(0, 3)}${middlePart}${props.modelValue.slice(-3)}`
-  }
-  else {
-    if (props.variant == 'mobilePhone') return props.modelValue.length == 10 ? `${props.modelValue.substring(0, 2)}x-xxx-${props.modelValue.substring(6, 10)}` : 'invalid format'
-    if (props.variant == 'homePhone') return props.modelValue.length == 9 ? `${props.modelValue.substring(0, 2)}-xxx-${props.modelValue.substring(5, 9)}` : 'invalid format'
-    if (props.variant == 'citizenId') return props.modelValue.length == 13 ? `${props.modelValue.substring(0, 1)}-xxxx-xxxxx-${props.modelValue.substring(10, 12)}-${props.modelValue.substring(12, 13)}` : 'invalid format'
-    if (props.variant == 'creditCard') return props.modelValue.length == 16 ? `xxxx-xxxx-xxxx-${props.modelValue.substring(12, 16)}` : 'invalid format'
-
-    const middlePart = 'x'.repeat(props.modelValue.length - 6)
-    return `${props.modelValue.substring(0, 3)}${middlePart}${props.modelValue.slice(-3)}`
-  }
-})
-</script>
-
-<template>
-  {{ labelMask }}
-</template>
+<script setup lang="ts">
+/**
+ * LabelMask 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'
+
+interface Props {
+  modelValue: string // Bound value for v-model synchronization with the parent component.
+  variant?: 'mobilePhone' | 'homePhone' | 'citizenId' | 'creditCard' // Mask pattern to apply to the displayed value.
+  hideContent?: boolean // Hides the middle part of the value for privacy.
+}
+
+/**
+ * Public props accepted by LabelMask.
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
+ */
+const props = withDefaults(defineProps<Props>(), {
+  hideContent: false,
+})
+
+const labelMask = computed(() => {
+  if (!props.hideContent) {
+    if (props.variant == 'mobilePhone') return props.modelValue.length == 10 ? `${props.modelValue.substring(0, 3)}-${props.modelValue.substring(3, 6)}-${props.modelValue.substring(6, 10)}` : 'invalid format'
+    if (props.variant == 'homePhone') return props.modelValue.length == 9 ? `${props.modelValue.substring(0, 2)}-${props.modelValue.substring(2, 5)}-${props.modelValue.substring(5, 9)}` : 'invalid format'
+    if (props.variant == 'citizenId') return props.modelValue.length == 13 ? `${props.modelValue.substring(0, 1)}-${props.modelValue.substring(1, 5)}-${props.modelValue.substring(5, 10)}-${props.modelValue.substring(10, 12)}-${props.modelValue.substring(12, 13)}` : 'invalid format'
+    if (props.variant == 'creditCard') return props.modelValue.length == 16 ? `${props.modelValue.substring(0, 4)}-${props.modelValue.substring(4, 8)}-${props.modelValue.substring(8, 12)}-${props.modelValue.substring(12, 16)}` : 'invalid format'
+
+    const middlePart = 'x'.repeat(props.modelValue.length - 6)
+    return `${props.modelValue.substring(0, 3)}${middlePart}${props.modelValue.slice(-3)}`
+  }
+  else {
+    if (props.variant == 'mobilePhone') return props.modelValue.length == 10 ? `${props.modelValue.substring(0, 2)}x-xxx-${props.modelValue.substring(6, 10)}` : 'invalid format'
+    if (props.variant == 'homePhone') return props.modelValue.length == 9 ? `${props.modelValue.substring(0, 2)}-xxx-${props.modelValue.substring(5, 9)}` : 'invalid format'
+    if (props.variant == 'citizenId') return props.modelValue.length == 13 ? `${props.modelValue.substring(0, 1)}-xxxx-xxxxx-${props.modelValue.substring(10, 12)}-${props.modelValue.substring(12, 13)}` : 'invalid format'
+    if (props.variant == 'creditCard') return props.modelValue.length == 16 ? `xxxx-xxxx-xxxx-${props.modelValue.substring(12, 16)}` : 'invalid format'
+
+    const middlePart = 'x'.repeat(props.modelValue.length - 6)
+    return `${props.modelValue.substring(0, 3)}${middlePart}${props.modelValue.slice(-3)}`
+  }
+})
+</script>
+
+<template>
+  {{ labelMask }}
+</template>

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

@@ -1,14 +1,22 @@
-<script lang="ts" setup>
-import {joinObject} from "../../utils/formatter";
-
-interface Props {
-  object: any,
-  attribute?: string,
-  separator?: string,
-}
-const props = withDefaults(defineProps<Props>(), {
-})
-</script>
-<template>
-  <span>{{joinObject(object,attribute,separator)}}</span>
+<script lang="ts" setup>
+/**
+ * LabelObject 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 {joinObject} from "../../utils/formatter";
+
+interface Props {
+  object: any, // Source object used to resolve and render selected attributes.
+  attribute?: string, // Object key(s) to extract for display from the source object.
+  separator?: string, // Separator used when joining multiple extracted values.
+}
+/**
+ * Public props accepted by LabelObject.
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
+ */
+const props = withDefaults(defineProps<Props>(), {
+})
+</script>
+<template>
+  <span>{{joinObject(object,attribute,separator)}}</span>
 </template>

package/dist/runtime/components/master/Autocomplete.vue

@@ -1,83 +1,91 @@
-<script lang="ts" setup>
-import { VAutocomplete } from 'vuetify/components/VAutocomplete'
-import { withDefaults } from 'vue'
-import { useLookupListMaster, type MasterLikeProps } from '../../composables/lookupListMaster'
-
-interface Props extends /* @vue-ignore */ InstanceType<typeof VAutocomplete['$props']> {}
-
-const props = withDefaults(defineProps<Props & MasterLikeProps>(), {
-  sortBy: 'itemValue',
-  showCode: false,
-  lang: 'TH',
-  noDataText: 'ไม่พบข้อมูล',
-  waitForFilter: false,
-  meilisearch: false,
-  cache: false,
-
-  statusField: 'statusCode',
-  activeValue: 'active',
-  hideInactiveInList: true,
-  preventSelectingInactive: true,
-})
-
-const {
-  computedModelName,
-  computedModelBy,
-  computedModelSelectedItemBy,
-  computedFields,
-  itemTitleField,
-  computedNoDataText,
-  computedSortBy,
-  formatItemTitle,
-} = useLookupListMaster(props)
-</script>
-
-<template>
-  <model-autocomplete
-      :model-name="computedModelName"
-      :model-by="computedModelBy"
-      :fields="computedFields"
-      :sort-by="computedSortBy"
-      :item-title="itemTitleField"
-      item-value="itemCode"
-      :no-data-text="computedNoDataText"
-      :show-code="props.showCode"
-      :cache="props.cache && !props.meilisearch"
-      :server-search="props.meilisearch && !!computedModelName"
-      server-search-key="keyword"
-      model-selected-item="masterItemByGroupKeyAndItemCodeIn"
-      :model-selected-item-by="computedModelSelectedItemBy"
-      model-selected-item-key="itemCodes"
-
-      :status-field="props.statusField"
-      :active-value="props.activeValue"
-      :hide-inactive-in-list="props.hideInactiveInList"
-      :prevent-selecting-inactive="props.preventSelectingInactive"
-  >
-    <!-- pass-through slots -->
-    <!-- @ts-ignore -->
-    <template v-for="(_, name, index) in ($slots as {})" :key="index" #[name]="slotData">
-      <slot :name="name" v-bind="((slotData || {}) as object)" :operation="computedModelName" />
-    </template>
-
-    <template v-if="!$slots.item && !props.meilisearch" #item="{ props: itemProps, item }">
-      <v-list-item v-bind="itemProps" :title="formatItemTitle(item)" />
-    </template>
-
-    <template v-if="!$slots.item && props.meilisearch" #item="{ props: itemProps, item }">
-      <v-list-item v-bind="itemProps">
-        <template #title v-if="item.raw?._formatted?.itemValue">
-          <span v-html="formatItemTitle(item)" class="meilisearch-item"></span>
-        </template>
-      </v-list-item>
-    </template>
-
-    <template v-if="!$slots.selection && props.showCode" #selection="{ item }">
-      {{ formatItemTitle(item) }}
-    </template>
-  </model-autocomplete>
-</template>
-
+<script lang="ts" setup>
+/**
+ * MasterAutocomplete renders master-data driven option controls and synchronizes selected values with form models.
+ * This doc block is consumed by vue-docgen for generated API documentation.
+ */
+import { VAutocomplete } from 'vuetify/components/VAutocomplete'
+import { withDefaults } from 'vue'
+import { useLookupListMaster, type MasterLikeProps } from '../../composables/lookupListMaster'
+
+interface Props extends /* @vue-ignore */ InstanceType<typeof VAutocomplete['$props']> {}
+
+/**
+ * Public props accepted by MasterAutocomplete.
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
+ */
+const props = withDefaults(defineProps<Props & MasterLikeProps>(), {
+  sortBy: 'itemValue', // Field used to sort options before rendering.
+  showCode: false, // Displays code values alongside labels in option lists.
+  lang: 'TH', // Language code used when selecting localized option labels.
+  noDataText: 'ไม่พบข้อมูล', // Fallback message shown when there is no data to display.
+  waitForFilter: false, // Delays loading options until the user provides a search/filter value.
+  meilisearch: false, // Enables Meilisearch-backed server filtering for options.
+  cache: false, // Enables cached requests; number values represent cache TTL in milliseconds.
+
+  statusField: 'statusCode', // Field name that indicates active/inactive status in each item.
+  activeValue: 'active', // Value in statusField treated as active/selectable.
+  hideInactiveInList: true, // Hides inactive options from the displayed selection list.
+  preventSelectingInactive: true, // Blocks selecting inactive options even if present in the dataset.
+})
+
+const {
+  computedModelName,
+  computedModelBy,
+  computedModelSelectedItemBy,
+  computedFields,
+  itemTitleField,
+  computedNoDataText,
+  computedSortBy,
+  formatItemTitle,
+} = useLookupListMaster(props)
+</script>
+
+<template>
+  <model-autocomplete
+      :model-name="computedModelName"
+      :model-by="computedModelBy"
+      :fields="computedFields"
+      :sort-by="computedSortBy"
+      :item-title="itemTitleField"
+      item-value="itemCode"
+      :no-data-text="computedNoDataText"
+      :show-code="props.showCode"
+      :cache="props.cache && !props.meilisearch"
+      :server-search="props.meilisearch && !!computedModelName"
+      server-search-key="keyword"
+      model-selected-item="masterItemByGroupKeyAndItemCodeIn"
+      :model-selected-item-by="computedModelSelectedItemBy"
+      model-selected-item-key="itemCodes"
+
+      :status-field="props.statusField"
+      :active-value="props.activeValue"
+      :hide-inactive-in-list="props.hideInactiveInList"
+      :prevent-selecting-inactive="props.preventSelectingInactive"
+  >
+    <!-- pass-through slots -->
+    <!-- @ts-ignore -->
+    <template v-for="(_, name, index) in ($slots as {})" :key="index" #[name]="slotData">
+      <slot :name="name" v-bind="((slotData || {}) as object)" :operation="computedModelName" />
+    </template>
+
+    <template v-if="!$slots.item && !props.meilisearch" #item="{ props: itemProps, item }">
+      <v-list-item v-bind="itemProps" :title="formatItemTitle(item)" />
+    </template>
+
+    <template v-if="!$slots.item && props.meilisearch" #item="{ props: itemProps, item }">
+      <v-list-item v-bind="itemProps">
+        <template #title v-if="item.raw?._formatted?.itemValue">
+          <span v-html="formatItemTitle(item)" class="meilisearch-item"></span>
+        </template>
+      </v-list-item>
+    </template>
+
+    <template v-if="!$slots.selection && props.showCode" #selection="{ item }">
+      {{ formatItemTitle(item) }}
+    </template>
+  </model-autocomplete>
+</template>
+
 <style>
 .meilisearch-item em{font-weight:700}
-</style>
+</style>

package/dist/runtime/components/master/Combobox.vue

@@ -1,83 +1,91 @@
-<script lang="ts" setup>
-import { VCombobox } from 'vuetify/components/VCombobox'
-import { withDefaults } from 'vue'
-import { useLookupListMaster, type MasterLikeProps } from '../../composables/lookupListMaster'
-
-interface Props extends /* @vue-ignore */ InstanceType<typeof VCombobox['$props']> {}
-
-const props = withDefaults(defineProps<Props & MasterLikeProps>(), {
-  sortBy: 'itemValue',
-  showCode: false,
-  lang: 'TH',
-  noDataText: 'ไม่พบข้อมูล',
-  waitForFilter: false,
-  meilisearch: false,
-  cache: false,
-
-  statusField: 'statusCode',
-  activeValue: 'active',
-  hideInactiveInList: true,
-  preventSelectingInactive: true,
-})
-
-const {
-  computedModelName,
-  computedModelBy,
-  computedModelSelectedItemBy,
-  computedFields,
-  itemTitleField,
-  computedNoDataText,
-  computedSortBy,
-  formatItemTitle,
-} = useLookupListMaster(props)
-</script>
-
-<template>
-  <model-combobox
-      :model-name="computedModelName"
-      :model-by="computedModelBy"
-      :fields="computedFields"
-      :sort-by="computedSortBy"
-      :item-title="itemTitleField"
-      item-value="itemCode"
-      :no-data-text="computedNoDataText"
-      :show-code="props.showCode"
-      :cache="props.cache && !props.meilisearch"
-      :server-search="props.meilisearch && !!computedModelName"
-      server-search-key="keyword"
-      model-selected-item="masterItemByGroupKeyAndItemCodeIn"
-      :model-selected-item-by="computedModelSelectedItemBy"
-      model-selected-item-key="itemCodes"
-
-      :status-field="props.statusField"
-      :active-value="props.activeValue"
-      :hide-inactive-in-list="props.hideInactiveInList"
-      :prevent-selecting-inactive="props.preventSelectingInactive"
-  >
-    <!-- pass-through slots -->
-    <!-- @ts-ignore -->
-    <template v-for="(_, name, index) in ($slots as {})" :key="index" #[name]="slotData">
-      <slot :name="name" v-bind="((slotData || {}) as object)" :operation="computedModelName" />
-    </template>
-
-    <template v-if="!$slots.item && !props.meilisearch" #item="{ props: itemProps, item }">
-      <v-list-item v-bind="itemProps" :title="formatItemTitle(item)" />
-    </template>
-
-    <template v-if="!$slots.item && props.meilisearch" #item="{ props: itemProps, item }">
-      <v-list-item v-bind="itemProps">
-        <template #title v-if="item.raw?._formatted?.itemValue">
-          <span v-html="formatItemTitle(item)" class="meilisearch-item"></span>
-        </template>
-      </v-list-item>
-    </template>
-
-    <template v-if="!$slots.selection && props.showCode" #selection="{ item }">
-      {{ formatItemTitle(item) }}
-    </template>
-  </model-combobox>
-</template>
-
+<script lang="ts" setup>
+/**
+ * MasterCombobox renders master-data driven option controls and synchronizes selected values with form models.
+ * This doc block is consumed by vue-docgen for generated API documentation.
+ */
+import { VCombobox } from 'vuetify/components/VCombobox'
+import { withDefaults } from 'vue'
+import { useLookupListMaster, type MasterLikeProps } from '../../composables/lookupListMaster'
+
+interface Props extends /* @vue-ignore */ InstanceType<typeof VCombobox['$props']> {}
+
+/**
+ * Public props accepted by MasterCombobox.
+ * Document each prop field with intent, defaults, and side effects for clear generated docs.
+ */
+const props = withDefaults(defineProps<Props & MasterLikeProps>(), {
+  sortBy: 'itemValue', // Field used to sort options before rendering.
+  showCode: false, // Displays code values alongside labels in option lists.
+  lang: 'TH', // Language code used when selecting localized option labels.
+  noDataText: 'ไม่พบข้อมูล', // Fallback message shown when there is no data to display.
+  waitForFilter: false, // Delays loading options until the user provides a search/filter value.
+  meilisearch: false, // Enables Meilisearch-backed server filtering for options.
+  cache: false, // Enables cached requests; number values represent cache TTL in milliseconds.
+
+  statusField: 'statusCode', // Field name that indicates active/inactive status in each item.
+  activeValue: 'active', // Value in statusField treated as active/selectable.
+  hideInactiveInList: true, // Hides inactive options from the displayed selection list.
+  preventSelectingInactive: true, // Blocks selecting inactive options even if present in the dataset.
+})
+
+const {
+  computedModelName,
+  computedModelBy,
+  computedModelSelectedItemBy,
+  computedFields,
+  itemTitleField,
+  computedNoDataText,
+  computedSortBy,
+  formatItemTitle,
+} = useLookupListMaster(props)
+</script>
+
+<template>
+  <model-combobox
+      :model-name="computedModelName"
+      :model-by="computedModelBy"
+      :fields="computedFields"
+      :sort-by="computedSortBy"
+      :item-title="itemTitleField"
+      item-value="itemCode"
+      :no-data-text="computedNoDataText"
+      :show-code="props.showCode"
+      :cache="props.cache && !props.meilisearch"
+      :server-search="props.meilisearch && !!computedModelName"
+      server-search-key="keyword"
+      model-selected-item="masterItemByGroupKeyAndItemCodeIn"
+      :model-selected-item-by="computedModelSelectedItemBy"
+      model-selected-item-key="itemCodes"
+
+      :status-field="props.statusField"
+      :active-value="props.activeValue"
+      :hide-inactive-in-list="props.hideInactiveInList"
+      :prevent-selecting-inactive="props.preventSelectingInactive"
+  >
+    <!-- pass-through slots -->
+    <!-- @ts-ignore -->
+    <template v-for="(_, name, index) in ($slots as {})" :key="index" #[name]="slotData">
+      <slot :name="name" v-bind="((slotData || {}) as object)" :operation="computedModelName" />
+    </template>
+
+    <template v-if="!$slots.item && !props.meilisearch" #item="{ props: itemProps, item }">
+      <v-list-item v-bind="itemProps" :title="formatItemTitle(item)" />
+    </template>
+
+    <template v-if="!$slots.item && props.meilisearch" #item="{ props: itemProps, item }">
+      <v-list-item v-bind="itemProps">
+        <template #title v-if="item.raw?._formatted?.itemValue">
+          <span v-html="formatItemTitle(item)" class="meilisearch-item"></span>
+        </template>
+      </v-list-item>
+    </template>
+
+    <template v-if="!$slots.selection && props.showCode" #selection="{ item }">
+      {{ formatItemTitle(item) }}
+    </template>
+  </model-combobox>
+</template>
+
 <style>
 .meilisearch-item em{font-weight:700}
 </style>