@finema/core 1.4.217 → 1.4.218

package/dist/runtime/components/Card.vue

@@ -1,38 +1,38 @@
-<template>
-  <UCard v-bind="attrs" :class="$props.class" :as="as" :ui="ui">
-    <template #header>
-      <slot name="header" />
-    </template>
-
-    <slot />
-
-    <template #footer>
-      <slot name="footer" />
-    </template>
-  </UCard>
-</template>
-
-<script setup lang="ts">
-import { useUiConfig, type PropType, useUI, toRef } from '#imports'
-import { card } from '#core/ui.config'
-import type { Strategy } from '#ui/types'
-
-const config = useUiConfig<typeof card>(card, 'card')
-
-const props = defineProps({
-  as: {
-    type: String,
-    default: 'div',
-  },
-  class: {
-    type: [String, Object, Array] as PropType<any>,
-    default: () => '',
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
-    default: () => ({}),
-  },
-})
-
-const { ui, attrs } = useUI('card', toRef(props, 'ui'), config, toRef(props, 'class'))
-</script>
+<template>
+  <UCard v-bind="attrs" :class="$props.class" :as="as" :ui="ui">
+    <template #header>
+      <slot name="header" />
+    </template>
+
+    <slot />
+
+    <template #footer>
+      <slot name="footer" />
+    </template>
+  </UCard>
+</template>
+
+<script setup lang="ts">
+import { useUiConfig, type PropType, useUI, toRef } from '#imports'
+import { card } from '#core/ui.config'
+import type { Strategy } from '#ui/types'
+
+const config = useUiConfig<typeof card>(card, 'card')
+
+const props = defineProps({
+  as: {
+    type: String,
+    default: 'div',
+  },
+  class: {
+    type: [String, Object, Array] as PropType<any>,
+    default: () => '',
+  },
+  ui: {
+    type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
+    default: () => ({}),
+  },
+})
+
+const { ui, attrs } = useUI('card', toRef(props, 'ui'), config, toRef(props, 'class'))
+</script>

package/dist/runtime/components/Core.vue

@@ -1,45 +1,45 @@
-<template>
-  <NuxtLoadingIndicator :color="color" />
-  <Dialog />
-  <UNotifications>
-    <template #title="{ title }">
-      <span v-html="title" />
-    </template>
-
-    <template #description="{ description }">
-      <span v-html="description" />
-    </template>
-  </UNotifications>
-  <div v-if="isDevEnv" class="fixed bottom-4 right-4 z-50">
-    <div class="flex flex-col items-end justify-end">
-      <div
-        v-show="isShowDevTools"
-        class="max-w-screen mb-4 h-[750px] max-h-screen w-[600px] overflow-auto rounded-lg border bg-white opacity-80 shadow-2xl"
-      >
-        <p class="p-3 text-lg font-semibold">Debug Tools</p>
-        <hr />
-        <div id="dev-logs" class="flex flex-col space-y-3 p-3" />
-      </div>
-      <Button
-        :icon="isShowDevTools ? 'heroicons:x-mark' : 'heroicons:information-circle'"
-        color="info"
-        square
-        :ui="{ rounded: 'rounded-full' }"
-        @click="isShowDevTools = !isShowDevTools"
-      />
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import { ref } from 'vue'
-
-defineProps({
-  color: {
-    type: String,
-    default: '#3675FB',
-  },
-})
-
-const isShowDevTools = ref(false)
-const isDevEnv = process.env.NODE_ENV === 'development'
-</script>
+<template>
+  <NuxtLoadingIndicator :color="color" />
+  <Dialog />
+  <UNotifications>
+    <template #title="{ title }">
+      <span v-html="title" />
+    </template>
+
+    <template #description="{ description }">
+      <span v-html="description" />
+    </template>
+  </UNotifications>
+  <div v-if="isDevEnv" class="fixed bottom-4 right-4 z-50">
+    <div class="flex flex-col items-end justify-end">
+      <div
+        v-show="isShowDevTools"
+        class="max-w-screen mb-4 h-[750px] max-h-screen w-[600px] overflow-auto rounded-lg border bg-white opacity-80 shadow-2xl"
+      >
+        <p class="p-3 text-lg font-semibold">Debug Tools</p>
+        <hr />
+        <div id="dev-logs" class="flex flex-col space-y-3 p-3" />
+      </div>
+      <Button
+        :icon="isShowDevTools ? 'heroicons:x-mark' : 'heroicons:information-circle'"
+        color="info"
+        square
+        :ui="{ rounded: 'rounded-full' }"
+        @click="isShowDevTools = !isShowDevTools"
+      />
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+import { ref } from 'vue'
+
+defineProps({
+  color: {
+    type: String,
+    default: '#3675FB',
+  },
+})
+
+const isShowDevTools = ref(false)
+const isDevEnv = process.env.NODE_ENV === 'development'
+</script>

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

@@ -1,108 +1,108 @@
-<template>
-  <Modal
-    v-if="dialog.meta?.type"
-    v-model="dialog.isShow"
-    :ui="{
-      innerWrapper: 'p-6',
-    }"
-    is-hide-close-btn
-    prevent-close
-  >
-    <UNotification
-      :ui="{
-        padding: '',
-        shadow: '',
-        ring: '',
-        icon: {
-          base: 'flex-shrink-0 w-10 h-10',
-        },
-      }"
-      :icon="getIcon"
-      :description="dialog.meta?.description"
-      :timeout="0"
-      :title="dialog.meta?.title"
-      :color="getColor"
-      close-button=""
-    />
-    <div :class="[uiConfig.actionGroup?.wrapper]">
-      <Button
-        v-if="dialog.meta?.isShowCancelBtn"
-        :color="uiConfig.actionGroup?.cancelColor"
-        :variant="uiConfig.actionGroup?.cancelVariant"
-        type="button"
-        @click="dialog.closeDialogCancel"
-      >
-        {{ dialog.meta?.cancelText || 'ยกเลิก' }}
-      </Button>
-      <Button
-        :color="uiConfig.actionGroup?.confirmColor"
-        :variant="uiConfig.actionGroup?.confirmVariant"
-        :class="[
-          {
-            'btn-success': dialog.meta?.type === DialogType.SUCCESS,
-            'btn-danger': dialog.meta?.type === DialogType.ERROR,
-            'btn-info': dialog.meta?.type === DialogType.INFO,
-            'btn-warning': dialog.meta?.type === DialogType.WARNING,
-            'mr-3': dialog.meta.isShowCancelBtn,
-          },
-        ]"
-        @click="dialog.closeDialogProceed"
-      >
-        {{ dialog.meta?.confirmText || 'ตกลง' }}
-      </Button>
-    </div>
-  </Modal>
-</template>
-<script lang="tsx" setup>
-import { DialogType, useDialog } from '#core/composables/useDialog'
-import { computed } from 'vue'
-import { useUiConfig } from '#core/composables/useConfig'
-import { notification } from '#core/ui.config/notification'
-
-const dialog = useDialog()
-const uiConfig = useUiConfig<typeof notification>(notification, 'notification')
-
-const getColor = computed(() => {
-  if (dialog.meta?.type === DialogType.SUCCESS) {
-    return 'success'
-  }
-
-  if (dialog.meta?.type === DialogType.ERROR) {
-    return 'danger'
-  }
-
-  if (dialog.meta?.type === DialogType.INFO) {
-    return 'info'
-  }
-
-  if (dialog.meta?.type === DialogType.WARNING) {
-    return 'warning'
-  }
-
-  return ''
-})
-
-const getIcon = computed(() => {
-  if (dialog.meta?.isHideIcon) {
-    return ''
-  }
-
-  if (dialog.meta?.type === DialogType.SUCCESS) {
-    return 'i-heroicons-check-circle'
-  }
-
-  if (dialog.meta?.type === DialogType.ERROR) {
-    return 'i-heroicons-x-circle'
-  }
-
-  if (dialog.meta?.type === DialogType.INFO) {
-    return 'i-heroicons-information-circle'
-  }
-
-  if (dialog.meta?.type === DialogType.WARNING) {
-    return 'i-heroicons-exclamation-circle'
-  }
-
-  return ''
-})
-</script>
+<template>
+  <Modal
+    v-if="dialog.meta?.type"
+    v-model="dialog.isShow"
+    :ui="{
+      innerWrapper: 'p-6',
+    }"
+    is-hide-close-btn
+    prevent-close
+  >
+    <UNotification
+      :ui="{
+        padding: '',
+        shadow: '',
+        ring: '',
+        icon: {
+          base: 'flex-shrink-0 w-10 h-10',
+        },
+      }"
+      :icon="getIcon"
+      :description="dialog.meta?.description"
+      :timeout="0"
+      :title="dialog.meta?.title"
+      :color="getColor"
+      close-button=""
+    />
+    <div :class="[uiConfig.actionGroup?.wrapper]">
+      <Button
+        v-if="dialog.meta?.isShowCancelBtn"
+        :color="uiConfig.actionGroup?.cancelColor"
+        :variant="uiConfig.actionGroup?.cancelVariant"
+        type="button"
+        @click="dialog.closeDialogCancel"
+      >
+        {{ dialog.meta?.cancelText || 'ยกเลิก' }}
+      </Button>
+      <Button
+        :color="uiConfig.actionGroup?.confirmColor"
+        :variant="uiConfig.actionGroup?.confirmVariant"
+        :class="[
+          {
+            'btn-success': dialog.meta?.type === DialogType.SUCCESS,
+            'btn-danger': dialog.meta?.type === DialogType.ERROR,
+            'btn-info': dialog.meta?.type === DialogType.INFO,
+            'btn-warning': dialog.meta?.type === DialogType.WARNING,
+            'mr-3': dialog.meta.isShowCancelBtn,
+          },
+        ]"
+        @click="dialog.closeDialogProceed"
+      >
+        {{ dialog.meta?.confirmText || 'ตกลง' }}
+      </Button>
+    </div>
+  </Modal>
+</template>
+<script lang="tsx" setup>
+import { DialogType, useDialog } from '#core/composables/useDialog'
+import { computed } from 'vue'
+import { useUiConfig } from '#core/composables/useConfig'
+import { notification } from '#core/ui.config/notification'
+
+const dialog = useDialog()
+const uiConfig = useUiConfig<typeof notification>(notification, 'notification')
+
+const getColor = computed(() => {
+  if (dialog.meta?.type === DialogType.SUCCESS) {
+    return 'success'
+  }
+
+  if (dialog.meta?.type === DialogType.ERROR) {
+    return 'danger'
+  }
+
+  if (dialog.meta?.type === DialogType.INFO) {
+    return 'info'
+  }
+
+  if (dialog.meta?.type === DialogType.WARNING) {
+    return 'warning'
+  }
+
+  return ''
+})
+
+const getIcon = computed(() => {
+  if (dialog.meta?.isHideIcon) {
+    return ''
+  }
+
+  if (dialog.meta?.type === DialogType.SUCCESS) {
+    return 'i-heroicons-check-circle'
+  }
+
+  if (dialog.meta?.type === DialogType.ERROR) {
+    return 'i-heroicons-x-circle'
+  }
+
+  if (dialog.meta?.type === DialogType.INFO) {
+    return 'i-heroicons-information-circle'
+  }
+
+  if (dialog.meta?.type === DialogType.WARNING) {
+    return 'i-heroicons-exclamation-circle'
+  }
+
+  return ''
+})
+</script>

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

@@ -1,70 +1,70 @@
-<template>
-  <UDropdown
-    v-bind="attrs"
-    :class="$props.class"
-    :items="items"
-    :mode="mode"
-    :open-delay="openDelay"
-    :close-delay="closeDelay"
-    :popper="{ placement: placement, arrow: arrow, offsetDistance: offset }"
-    :ui="ui"
-  >
-    <slot />
-
-    <template v-for="(_, slot) of $slots" #[slot]="slotProps">
-      <slot :name="slot" v-bind="slotProps || {}" />
-    </template>
-  </UDropdown>
-</template>
-
-<script lang="ts" setup>
-import { type PropType, useUiConfig, useUI, toRef } from '#imports'
-import { dropdown } from '#ui/ui.config'
-import { DropdownPlacementArray, type DropdownPlacement } from './types'
-import type { DropdownItem, Strategy } from '#ui/types'
-
-const config = useUiConfig<typeof dropdown>(dropdown, 'dropdown')
-
-const props = defineProps({
-  items: {
-    type: Array as PropType<DropdownItem[][]>,
-    default: () => [],
-  },
-  mode: {
-    type: String as PropType<'click' | 'hover'>,
-    default: 'click',
-    validator: (value: string) => ['click', 'hover'].includes(value),
-  },
-  arrow: {
-    type: Boolean,
-    default: false,
-  },
-  offset: {
-    type: Number,
-    default: 10,
-  },
-  openDelay: {
-    type: Number,
-    default: 0,
-  },
-  closeDelay: {
-    type: Number,
-    default: 0,
-  },
-  placement: {
-    type: String as PropType<DropdownPlacement>,
-    default: 'bottom-start',
-    validator: (value: DropdownPlacement) => DropdownPlacementArray.includes(value),
-  },
-  class: {
-    type: [String, Array, Object] as PropType<any>,
-    default: () => '',
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
-    default: () => ({}),
-  },
-})
-
-const { ui, attrs } = useUI('dropdown', toRef(props, 'ui'), config, toRef(props, 'class'))
-</script>
+<template>
+  <UDropdown
+    v-bind="attrs"
+    :class="$props.class"
+    :items="items"
+    :mode="mode"
+    :open-delay="openDelay"
+    :close-delay="closeDelay"
+    :popper="{ placement: placement, arrow: arrow, offsetDistance: offset }"
+    :ui="ui"
+  >
+    <slot />
+
+    <template v-for="(_, slot) of $slots" #[slot]="slotProps">
+      <slot :name="slot" v-bind="slotProps || {}" />
+    </template>
+  </UDropdown>
+</template>
+
+<script lang="ts" setup>
+import { type PropType, useUiConfig, useUI, toRef } from '#imports'
+import { dropdown } from '#ui/ui.config'
+import { DropdownPlacementArray, type DropdownPlacement } from './types'
+import type { DropdownItem, Strategy } from '#ui/types'
+
+const config = useUiConfig<typeof dropdown>(dropdown, 'dropdown')
+
+const props = defineProps({
+  items: {
+    type: Array as PropType<DropdownItem[][]>,
+    default: () => [],
+  },
+  mode: {
+    type: String as PropType<'click' | 'hover'>,
+    default: 'click',
+    validator: (value: string) => ['click', 'hover'].includes(value),
+  },
+  arrow: {
+    type: Boolean,
+    default: false,
+  },
+  offset: {
+    type: Number,
+    default: 10,
+  },
+  openDelay: {
+    type: Number,
+    default: 0,
+  },
+  closeDelay: {
+    type: Number,
+    default: 0,
+  },
+  placement: {
+    type: String as PropType<DropdownPlacement>,
+    default: 'bottom-start',
+    validator: (value: DropdownPlacement) => DropdownPlacementArray.includes(value),
+  },
+  class: {
+    type: [String, Array, Object] as PropType<any>,
+    default: () => '',
+  },
+  ui: {
+    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
+    default: () => ({}),
+  },
+})
+
+const { ui, attrs } = useUI('dropdown', toRef(props, 'ui'), config, toRef(props, 'class'))
+</script>

package/dist/runtime/components/Empty.vue

@@ -1,18 +1,18 @@
-<template>
-  <div class="flex flex-col items-center justify-center py-6 text-gray-400">
-    <Icon :name="icon!" class="text-[72px]" />
-    <p class="mt-2" v-html="message!" />
-  </div>
-</template>
-<script lang="ts" setup>
-withDefaults(
-  defineProps<{
-    message?: any
-    icon?: string
-  }>(),
-  {
-    message: 'ไม่พบข้อมูล!',
-    icon: 'ph:table-thin',
-  }
-)
-</script>
+<template>
+  <div class="flex flex-col items-center justify-center py-6 text-gray-400">
+    <Icon :name="icon!" class="text-[72px]" />
+    <p class="mt-2" v-html="message!" />
+  </div>
+</template>
+<script lang="ts" setup>
+withDefaults(
+  defineProps<{
+    message?: any
+    icon?: string
+  }>(),
+  {
+    message: 'ไม่พบข้อมูล!',
+    icon: 'ph:table-thin',
+  }
+)
+</script>