@finema/core 1.4.220 → 2.1.0

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

@@ -1,146 +0,0 @@
-<template>
-  <UModal
-    v-bind="attrs"
-    :model-value="modelValue"
-    :class="$props.class"
-    :overlay="overlay"
-    :transition="transition"
-    :prevent-close="preventClose"
-    :fullscreen="fullscreen"
-    :initial-focus="modalWrapper"
-    :ui="ui"
-    @update:model-value="$emit('update:modelValue', $event)"
-  >
-    <div
-      v-if="title"
-      :class="[ui.header, { 'flex items-center justify-between': !isHideCloseBtn }]"
-    >
-      <h1 class="text-lg font-semibold">{{ title }}</h1>
-      <Icon
-        v-if="!isHideCloseBtn"
-        name="i-heroicons-x-mark"
-        class="size-6 cursor-pointer opacity-50"
-        @click="close"
-      />
-    </div>
-
-    <div
-      v-if="(!title && !isHideCloseBtn && preventClose) || fullscreen"
-      class="absolute right-0 m-4"
-    >
-      <Icon
-        v-if="!isHideCloseBtn"
-        name="i-heroicons-x-mark"
-        class="size-6 cursor-pointer opacity-50"
-        @click="close"
-      />
-    </div>
-
-    <div ref="modalWrapper" :class="[ui.innerWrapper]">
-      <slot />
-    </div>
-  </UModal>
-</template>
-
-<script lang="ts" setup>
-import { type PropType, defineShortcuts, ref, toRef, watch } from '#imports'
-import { useUI } from '#ui/composables/useUI'
-import { modal } from '#core/ui.config'
-import { useUiConfig } from '#core/composables/useConfig'
-import type { Strategy } from '#ui/types'
-
-const config = useUiConfig<typeof modal>(modal, 'modal')
-
-const props = defineProps({
-  modelValue: {
-    type: Boolean,
-    default: false,
-  },
-  overlay: {
-    type: Boolean,
-    default: true,
-  },
-  transition: {
-    type: Boolean,
-    default: true,
-  },
-  preventClose: {
-    type: Boolean,
-    default: false,
-  },
-  fullscreen: {
-    type: Boolean,
-    default: false,
-  },
-  scrollable: {
-    type: Boolean,
-    default: false,
-  },
-  title: {
-    type: String,
-    default: '',
-  },
-  isHideCloseBtn: {
-    type: Boolean,
-    default: false,
-  },
-  size: {
-    type: String as PropType<keyof typeof modal.size>,
-    default: () => modal.default.size,
-  },
-  position: {
-    type: String as PropType<keyof typeof modal.position>,
-    default: () => modal.default.position,
-  },
-  fixHeightSize: {
-    type: String as PropType<keyof typeof modal.fixHeightSize>,
-    default: () => modal.default.fixHeightSize,
-  },
-  class: {
-    type: [String, Array, Object] as PropType<any>,
-    default: undefined,
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
-    default: undefined,
-  },
-})
-
-const emits = defineEmits(['update:modelValue'])
-
-defineShortcuts({
-  escape: {
-    usingInput: true,
-    handler: () => {
-      if (props.preventClose) return
-      emits('update:modelValue', false)
-    },
-  },
-})
-
-const modalWrapper = ref<HTMLElement | null>(null)
-
-const close = () => {
-  emits('update:modelValue', false)
-}
-
-const { ui, attrs } = useUI('modal', toRef(props, 'ui'), config, toRef(props, 'class'))
-
-watch(
-  () => props.modelValue,
-  () => {
-    if (props.modelValue) {
-      const size = config.size[props.size]
-      const fixHeightSize = config.fixHeightSize[props.fixHeightSize]
-      const position = config.position[props.position]
-
-      ui.value.width = size
-      ui.value.container = position
-
-      if (props.scrollable) {
-        ui.value.height = fixHeightSize
-      }
-    }
-  }
-)
-</script>

package/dist/runtime/components/OTPInput.vue

@@ -1,127 +0,0 @@
-<template>
-  <div :class="containerClass">
-    <input
-      v-for="(_, index) in length"
-      :key="index"
-      :ref="(el) => setInputRef(index, el)"
-      v-model="otp[index]"
-      :type="isPassword ? 'password' : 'text'"
-      :class="inputClass"
-      maxlength="1"
-      :autofocus="autoFocus && index === 0"
-      @input="handleInput(index)"
-      @focus="handleFocus($event)"
-      @paste="handlePaste"
-      @keydown="handleKeydown(index, $event)"
-    />
-  </div>
-</template>
-<script lang="ts" setup>
-import { type Ref, ref } from 'vue'
-import { watch } from '#imports'
-
-const emits = defineEmits(['update:modelValue'])
-const props = defineProps({
-  length: {
-    type: Number,
-    required: true,
-  },
-  autoFocus: {
-    type: Boolean,
-    default: false,
-  },
-  isPassword: {
-    type: Boolean,
-    default: false,
-  },
-  isOnlyNumber: {
-    type: Boolean,
-    default: false,
-  },
-  modelValue: {
-    type: String,
-    default: '',
-  },
-  containerClass: {
-    type: String,
-    default: 'flex space-x-3',
-  },
-  inputClass: {
-    type: String,
-    default:
-      'h-12 w-12 relative flex flex-col items-center justify-center text-center ' +
-      'disabled:cursor-not-allowed disabled:opacity-75 focus:outline-none border-0 form-input ' +
-      'rounded-md placeholder-gray-400 text-sm px-3.5 py-2.5 shadow-sm bg-white text-gray-900 ' +
-      'ring-1 ring-inset ring-gray-300 focus:ring-2 focus:ring-primary-500',
-  },
-})
-
-const otp: Ref<string[]> = ref(Array(props.length).fill(''))
-const inputRefs: Ref<HTMLInputElement[]> = ref([])
-
-const setInputRef = (index: number, el: HTMLInputElement) => {
-  if (el) {
-    inputRefs.value[index] = el
-  }
-}
-
-const focusNext = (index: number): void => {
-  if (index < props.length - 1) {
-    inputRefs.value[index + 1].focus()
-  }
-}
-
-const focusPrevious = (index: number): void => {
-  if (index > 0) {
-    inputRefs.value[index - 1].focus()
-  }
-}
-
-const isNumeric = (str: string): boolean => {
-  return /^\d+$/.test(str)
-}
-
-const handleInput = (index: number): void => {
-  if (props.isOnlyNumber && !isNumeric(otp.value[index])) {
-    otp.value[index] = ''
-
-    return
-  }
-
-  if (otp.value[index].length === 1) {
-    focusNext(index)
-  }
-}
-
-const handleFocus = (event: FocusEvent): void => {
-  const target = event.target as HTMLInputElement
-
-  target.select()
-}
-
-const handlePaste = (event: ClipboardEvent): void => {
-  const paste = event.clipboardData?.getData('text') || ''
-
-  if (paste.length === props.length) {
-    paste.split('').forEach((char, idx) => {
-      otp.value[idx] = char
-    })
-
-    focusNext(paste.length - 2)
-  }
-}
-
-const handleKeydown = (index: number, event: KeyboardEvent): void => {
-  // Focus the previous field if backspace is pressed on an empty field
-  if (event.key === 'Backspace' && otp.value[index] === '') {
-    focusPrevious(index)
-  }
-}
-
-watch(
-  () => otp.value.join(''),
-  (newValue) => {
-    emits('update:modelValue', newValue)
-  }
-)
-</script>

package/dist/runtime/components/QRCode.vue

@@ -1,22 +0,0 @@
-<template>
-  <QrcodeVue :value="value" :level="level" :render-as="renderAs" class="size-[350px]" />
-</template>
-<script lang="ts" setup>
-import QrcodeVue, { type RenderAs } from 'qrcode.vue'
-import { type PropType } from 'vue'
-
-defineProps({
-  value: {
-    type: String,
-    required: true,
-  },
-  level: {
-    type: String,
-    default: 'M',
-  },
-  renderAs: {
-    type: String as PropType<RenderAs>,
-    default: 'svg',
-  },
-})
-</script>

package/dist/runtime/components/SimplePagination.vue

@@ -1,96 +0,0 @@
-<template>
-  <div>
-    <Button
-      :size="size"
-      :disabled="!canGoFirstOrPrev || disabled"
-      :class="[ui.base, ui.rounded]"
-      v-bind="{ ...((ui.default?.prevButton as object) || {}) }"
-      :ui="{ rounded: '' }"
-      aria-label="Prev"
-      @click="onClickPrev"
-    />
-
-    <Button
-      :size="size"
-      :disabled="!canGoLastOrNext || disabled"
-      :class="[ui.base, ui.rounded]"
-      v-bind="{ ...((ui.default?.nextButton as object) || {}) }"
-      :ui="{ rounded: '' }"
-      aria-label="Next"
-      @click="onClickNext"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { useUiConfig } from '../composables/useConfig'
-import { pagination } from '#core/ui.config'
-import { useUI, type PropType, toRef, computed } from '#imports'
-import type { ButtonSize } from '#ui/types/button'
-import type { Strategy } from '#ui/types'
-
-const config = useUiConfig<typeof pagination>(pagination, 'pagination')
-
-const emits = defineEmits(['update:modelValue'])
-
-const props = defineProps({
-  modelValue: {
-    type: Number,
-    required: true,
-  },
-  pageCount: {
-    type: Number,
-    default: 10,
-  },
-  total: {
-    type: Number,
-    required: true,
-  },
-  disabled: {
-    type: Boolean,
-    default: false,
-  },
-  size: {
-    type: String as PropType<ButtonSize>,
-    default: () => pagination.default?.size,
-  },
-  class: {
-    type: [String, Object, Array] as PropType<any>,
-    default: () => '',
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
-    default: () => ({}),
-  },
-})
-
-const { ui } = useUI('pagination', toRef(props, 'ui'), config, toRef(props, 'class'))
-
-const currentPage = computed({
-  get() {
-    return props.modelValue
-  },
-  set(value: number) {
-    emits('update:modelValue', value)
-  },
-})
-
-const pages = computed(() =>
-  Array.from({ length: Math.ceil(props.total / props.pageCount) }, (_, i) => i + 1)
-)
-
-const canGoFirstOrPrev = computed(() => currentPage.value > 1)
-const canGoLastOrNext = computed(() => currentPage.value < pages.value.length)
-
-const onClickPrev = () => {
-  if (canGoFirstOrPrev.value) {
-    currentPage.value--
-  }
-}
-
-const onClickNext = () => {
-  if (canGoLastOrNext.value) {
-    currentPage.value++
-  }
-}
-</script>

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

@@ -1,110 +0,0 @@
-<template>
-  <USlideover
-    v-bind="attrs"
-    :model-value="modelValue"
-    :class="$props.class"
-    :prevent-close="preventClose"
-    :overlay="overlay"
-    :transition="transition"
-    :side="side"
-    :initial-focus="emptyFocusRef"
-    :ui="ui"
-    @update:model-value="$emit('update:modelValue', $event)"
-  >
-    <div v-if="!isHideCloseBtn && preventClose" class="absolute right-0 m-4">
-      <Icon
-        v-if="!isHideCloseBtn"
-        name="i-heroicons-x-mark"
-        class="size-6 cursor-pointer"
-        @click="close"
-      />
-    </div>
-
-    <div :class="['overflow-y-auto', ui.bodyWrapper]">
-      <slot />
-    </div>
-  </USlideover>
-
-  <div ref="emptyFocusRef" />
-</template>
-
-<script lang="ts" setup>
-import { ref, type PropType, toRef, defineShortcuts, watch } from '#imports'
-import { useUI } from '#ui/composables/useUI'
-import { slideover } from '#core/ui.config'
-import { useUiConfig } from '#core/composables/useConfig'
-import type { Strategy } from '#ui/types'
-
-const config = useUiConfig<typeof slideover>(slideover, 'slideover')
-
-const props = defineProps({
-  modelValue: {
-    type: Boolean as PropType<boolean>,
-    default: false,
-  },
-  side: {
-    type: String as PropType<'left' | 'right'>,
-    default: 'right',
-    validator: (value: string) => ['left', 'right'].includes(value),
-  },
-  overlay: {
-    type: Boolean,
-    default: true,
-  },
-  preventClose: {
-    type: Boolean,
-    default: false,
-  },
-  isHideCloseBtn: {
-    type: Boolean,
-    default: false,
-  },
-  transition: {
-    type: Boolean,
-    default: true,
-  },
-  size: {
-    type: String as PropType<keyof typeof slideover.size>,
-    default: () => slideover.default.size,
-  },
-  class: {
-    type: [String, Array, Object] as PropType<any>,
-    default: undefined,
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
-    default: undefined,
-  },
-})
-
-const emits = defineEmits(['update:modelValue'])
-
-const emptyFocusRef = ref<HTMLElement | null>(null)
-
-defineShortcuts({
-  escape: {
-    usingInput: true,
-    handler: () => {
-      if (props.preventClose) return
-      emits('update:modelValue', false)
-    },
-  },
-})
-
-const close = () => {
-  emits('update:modelValue', false)
-}
-
-const { ui, attrs } = useUI('slideover', toRef(props, 'ui'), config, toRef(props, 'class'))
-
-watch(
-  () => props.modelValue,
-  () => {
-    if (props.modelValue) {
-      const size = config.size[props.size]
-
-      ui.value.width = size
-    }
-  }
-)
-</script>

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

@@ -1,64 +0,0 @@
-<template>
-  <UTabs
-    v-bind="attrs"
-    :model-value="modelValue"
-    :class="$props.class"
-    :items="items"
-    :orientation="orientation"
-    :default-index="defaultIndex"
-    :ui="ui"
-    @change="change"
-  >
-    <template #default="{ item, index, selected }">
-      <slot name="default" :item="item" :index="index" :selected="selected" />
-    </template>
-
-    <template #item="{ item, index, selected }">
-      <slot name="item" :item="item" :index="index" :selected="selected" />
-    </template>
-  </UTabs>
-</template>
-
-<script setup lang="ts">
-import { useUiConfig, type PropType, useUI, toRef } from '#imports'
-import { tabs } from '#core/ui.config'
-import type { Strategy, TabItem } from '#ui/types'
-
-const config = useUiConfig<typeof tabs>(tabs, 'tabs')
-
-const props = defineProps({
-  modelValue: {
-    type: Number,
-    default: undefined,
-  },
-  items: {
-    type: Array as PropType<TabItem[]>,
-    default: () => [],
-  },
-  orientation: {
-    type: String as PropType<'horizontal' | 'vertical'>,
-    default: 'horizontal',
-    validator: (value: string) => ['horizontal', 'vertical'].includes(value),
-  },
-  defaultIndex: {
-    type: Number,
-    default: 0,
-  },
-  class: {
-    type: [String, Object, Array] as PropType<any>,
-    default: () => '',
-  },
-  ui: {
-    type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
-    default: () => ({}),
-  },
-})
-
-const emits = defineEmits(['update:modelValue', 'change'])
-
-const change = (index: number) => {
-  emits('change', index)
-}
-
-const { ui, attrs } = useUI('tabs', toRef(props, 'ui'), config, toRef(props, 'class'))
-</script>

package/dist/runtime/composables/loaderList.mjs

@@ -1,52 +0,0 @@
-import { ref } from "vue";
-import { ObjectHelper } from "../utils/ObjectHelper.mjs";
-import {
-  apiListHelper
-} from "../helpers/apiListHelper.mjs";
-export const useListLoader = (loaderOptions) => {
-  const status = ref(ObjectHelper.createStatus());
-  const items = ref([]);
-  const options = ref({});
-  const clear = () => {
-    status.value = ObjectHelper.createStatus();
-    items.value = [];
-  };
-  const run = async (opts) => {
-    return apiListHelper(
-      () => ({
-        status: status.value,
-        items: items.value,
-        options: options.value
-      }),
-      (_data) => {
-        status.value = _data;
-      },
-      (_data) => {
-        options.value = _data;
-      },
-      (_data) => {
-        items.value = _data;
-      },
-      {
-        ...loaderOptions,
-        ...opts
-      }
-    );
-  };
-  const setLoading = () => {
-    items.value = [];
-    status.value = ObjectHelper.toLoadingStatus(status.value);
-  };
-  const setItems = (_items) => {
-    items.value = _items;
-  };
-  return {
-    items,
-    status,
-    options,
-    run,
-    clear,
-    setItems,
-    setLoading
-  };
-};

package/dist/runtime/composables/loaderObject.mjs

@@ -1,52 +0,0 @@
-import { ref } from "vue";
-import { ObjectHelper } from "../utils/ObjectHelper.mjs";
-import {
-  apiObjectHelper
-} from "../helpers/apiObjectHelper.mjs";
-export const useObjectLoader = (loaderOptions) => {
-  const status = ref(ObjectHelper.createStatus());
-  const data = ref(null);
-  const options = ref({});
-  const clear = () => {
-    status.value = ObjectHelper.createStatus();
-    data.value = null;
-  };
-  const run = async (payload, opts = {}) => {
-    await apiObjectHelper(
-      () => ({
-        status: status.value,
-        data: data.value,
-        options: options.value
-      }),
-      (_data) => {
-        status.value = _data;
-      },
-      (_data) => {
-        options.value = _data;
-      },
-      (_data) => {
-        data.value = _data;
-      },
-      payload,
-      {
-        ...loaderOptions,
-        ...opts
-      }
-    );
-  };
-  const setLoading = () => {
-    status.value = ObjectHelper.toLoadingStatus(status.value);
-  };
-  const setData = (_data) => {
-    data.value = _data;
-  };
-  return {
-    data,
-    status,
-    options,
-    run,
-    clear,
-    setLoading,
-    setData
-  };
-};