@finema/core 1.4.21 → 1.4.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/README.md +60 -60
  2. package/dist/module.d.mts +4 -4
  3. package/dist/module.d.ts +4 -4
  4. package/dist/module.json +1 -1
  5. package/dist/module.mjs +1 -1
  6. package/dist/runtime/components/Alert.vue +49 -49
  7. package/dist/runtime/components/Avatar.vue +27 -27
  8. package/dist/runtime/components/Badge.vue +54 -54
  9. package/dist/runtime/components/Breadcrumb.vue +45 -45
  10. package/dist/runtime/components/Button/Group.vue +37 -37
  11. package/dist/runtime/components/Button/index.vue +77 -77
  12. package/dist/runtime/components/Card.vue +38 -38
  13. package/dist/runtime/components/Core.vue +13 -13
  14. package/dist/runtime/components/Dialog/index.vue +98 -98
  15. package/dist/runtime/components/Dropdown/index.vue +81 -81
  16. package/dist/runtime/components/Form/FieldWrapper.vue +21 -21
  17. package/dist/runtime/components/Form/Fields.vue +129 -129
  18. package/dist/runtime/components/Form/InputCheckbox/index.vue +21 -21
  19. package/dist/runtime/components/Form/InputDateTime/index.vue +51 -51
  20. package/dist/runtime/components/Form/InputRadio/index.vue +27 -27
  21. package/dist/runtime/components/Form/InputSelect/index.vue +37 -37
  22. package/dist/runtime/components/Form/InputStatic/index.vue +16 -16
  23. package/dist/runtime/components/Form/InputText/index.vue +27 -27
  24. package/dist/runtime/components/Form/InputTextarea/index.vue +25 -25
  25. package/dist/runtime/components/Form/InputToggle/index.vue +14 -14
  26. package/dist/runtime/components/Form/InputUploadFileClassic/index.vue +36 -36
  27. package/dist/runtime/components/Form/index.vue +6 -6
  28. package/dist/runtime/components/Icon.vue +23 -23
  29. package/dist/runtime/components/Image.vue +36 -36
  30. package/dist/runtime/components/Loader.vue +4 -4
  31. package/dist/runtime/components/Modal/index.vue +146 -146
  32. package/dist/runtime/components/Slideover/index.vue +110 -110
  33. package/dist/runtime/components/Table/Base.vue +6 -2
  34. package/dist/runtime/components/Table/ColumnDate.vue +16 -16
  35. package/dist/runtime/components/Table/ColumnDateTime.vue +30 -30
  36. package/dist/runtime/components/Table/ColumnImage.vue +13 -13
  37. package/dist/runtime/components/Table/ColumnNumber.vue +14 -14
  38. package/dist/runtime/components/Table/Simple.vue +57 -53
  39. package/dist/runtime/components/Table/index.vue +51 -47
  40. package/dist/runtime/components/Table/types.d.ts +0 -1
  41. package/dist/runtime/components/Tabs/index.vue +65 -65
  42. package/dist/runtime/types/utils.d.ts +29 -29
  43. package/dist/runtime/ui.css +32 -32
  44. package/package.json +83 -83
@@ -1,25 +1,25 @@
1
- <template>
2
- <FieldWrapper v-bind="wrapperProps">
3
- <UTextarea
4
- v-model="value"
5
- :disabled="wrapperProps.isDisabled"
6
- :name="name"
7
- :resize="resize"
8
- :placeholder="wrapperProps.placeholder"
9
- :autofocus="!!autoFocus"
10
- :autoresize="autoresize"
11
- :rows="rows"
12
- :readonly="isReadonly"
13
- :ui="ui"
14
- />
15
- </FieldWrapper>
16
- </template>
17
- <script lang="ts" setup>
18
- import { useFieldHOC } from '#core/composables/useForm'
19
- import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
20
- import { type ITextareaFieldProps } from '#core/components/Form/InputTextarea/types'
21
-
22
- const props = withDefaults(defineProps<ITextareaFieldProps>(), {})
23
-
24
- const { value, wrapperProps } = useFieldHOC<string>(props)
25
- </script>
1
+ <template>
2
+ <FieldWrapper v-bind="wrapperProps">
3
+ <UTextarea
4
+ v-model="value"
5
+ :disabled="wrapperProps.isDisabled"
6
+ :name="name"
7
+ :resize="resize"
8
+ :placeholder="wrapperProps.placeholder"
9
+ :autofocus="!!autoFocus"
10
+ :autoresize="autoresize"
11
+ :rows="rows"
12
+ :readonly="isReadonly"
13
+ :ui="ui"
14
+ />
15
+ </FieldWrapper>
16
+ </template>
17
+ <script lang="ts" setup>
18
+ import { useFieldHOC } from '#core/composables/useForm'
19
+ import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
20
+ import { type ITextareaFieldProps } from '#core/components/Form/InputTextarea/types'
21
+
22
+ const props = withDefaults(defineProps<ITextareaFieldProps>(), {})
23
+
24
+ const { value, wrapperProps } = useFieldHOC<string>(props)
25
+ </script>
@@ -1,14 +1,14 @@
1
- <template>
2
- <FieldWrapper v-bind="wrapperProps">
3
- <UToggle v-model="value" :disabled="wrapperProps.isDisabled" :name="name" :ui="ui" />
4
- </FieldWrapper>
5
- </template>
6
-
7
- <script lang="ts" setup>
8
- import { useFieldHOC } from '#core/composables/useForm'
9
- import { type IToggleFieldProps } from '#core/components/Form/InputToggle/types'
10
- import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
11
-
12
- const props = withDefaults(defineProps<IToggleFieldProps>(), {})
13
- const { value, wrapperProps } = useFieldHOC<boolean>(props)
14
- </script>
1
+ <template>
2
+ <FieldWrapper v-bind="wrapperProps">
3
+ <UToggle v-model="value" :disabled="wrapperProps.isDisabled" :name="name" :ui="ui" />
4
+ </FieldWrapper>
5
+ </template>
6
+
7
+ <script lang="ts" setup>
8
+ import { useFieldHOC } from '#core/composables/useForm'
9
+ import { type IToggleFieldProps } from '#core/components/Form/InputToggle/types'
10
+ import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
11
+
12
+ const props = withDefaults(defineProps<IToggleFieldProps>(), {})
13
+ const { value, wrapperProps } = useFieldHOC<boolean>(props)
14
+ </script>
@@ -1,36 +1,36 @@
1
- <template>
2
- <FieldWrapper v-bind="wrapperProps">
3
- <UInput
4
- type="file"
5
- trailing
6
- :loading-icon="loadingIcon"
7
- :icon="icon"
8
- :leading-icon="leadingIcon"
9
- :trailing-icon="trailingIcon"
10
- :disabled="wrapperProps.isDisabled"
11
- :name="name"
12
- :placeholder="wrapperProps.placeholder"
13
- :autofocus="!!autoFocus"
14
- :readonly="isReadonly"
15
- :accept="accept"
16
- :ui="ui"
17
- @change="handleChange"
18
- />
19
- </FieldWrapper>
20
- </template>
21
- <script lang="ts" setup>
22
- import { useFieldHOC } from '#core/composables/useForm'
23
- import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
24
- import { type IUploadFileClassicFieldProps } from '#core/components/Form/InputUploadFileClassic/types'
25
-
26
- const props = withDefaults(defineProps<IUploadFileClassicFieldProps>(), {})
27
-
28
- const { value, wrapperProps } = useFieldHOC<File | undefined>(props)
29
-
30
- const emits = defineEmits(['change'])
31
-
32
- const handleChange = (e: Event) => {
33
- value.value = (e.target as HTMLInputElement).files?.[0]
34
- emits('change', e)
35
- }
36
- </script>
1
+ <template>
2
+ <FieldWrapper v-bind="wrapperProps">
3
+ <UInput
4
+ type="file"
5
+ trailing
6
+ :loading-icon="loadingIcon"
7
+ :icon="icon"
8
+ :leading-icon="leadingIcon"
9
+ :trailing-icon="trailingIcon"
10
+ :disabled="wrapperProps.isDisabled"
11
+ :name="name"
12
+ :placeholder="wrapperProps.placeholder"
13
+ :autofocus="!!autoFocus"
14
+ :readonly="isReadonly"
15
+ :accept="accept"
16
+ :ui="ui"
17
+ @change="handleChange"
18
+ />
19
+ </FieldWrapper>
20
+ </template>
21
+ <script lang="ts" setup>
22
+ import { useFieldHOC } from '#core/composables/useForm'
23
+ import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
24
+ import { type IUploadFileClassicFieldProps } from '#core/components/Form/InputUploadFileClassic/types'
25
+
26
+ const props = withDefaults(defineProps<IUploadFileClassicFieldProps>(), {})
27
+
28
+ const { value, wrapperProps } = useFieldHOC<File | undefined>(props)
29
+
30
+ const emits = defineEmits(['change'])
31
+
32
+ const handleChange = (e: Event) => {
33
+ value.value = (e.target as HTMLInputElement).files?.[0]
34
+ emits('change', e)
35
+ }
36
+ </script>
@@ -1,6 +1,6 @@
1
- <template>
2
- <form class="form">
3
- <slot />
4
- </form>
5
- </template>
6
- <script lang="ts" setup></script>
1
+ <template>
2
+ <form class="form">
3
+ <slot />
4
+ </form>
5
+ </template>
6
+ <script lang="ts" setup></script>
@@ -1,23 +1,23 @@
1
- <template>
2
- <UIcon :name="name" :dynamic="dynamicValue" />
3
- </template>
4
-
5
- <script lang="ts" setup>
6
- import { computed, useUiConfig } from '#imports'
7
- import { icon } from '#core/ui.config'
8
-
9
- const props = defineProps({
10
- name: {
11
- type: String,
12
- required: true,
13
- },
14
- dynamic: {
15
- type: Boolean,
16
- default: false,
17
- },
18
- })
19
-
20
- const config = useUiConfig<typeof icon>(icon, 'icon')
21
-
22
- const dynamicValue = computed(() => props.dynamic || config.dynamic)
23
- </script>
1
+ <template>
2
+ <UIcon :name="name" :dynamic="dynamicValue" />
3
+ </template>
4
+
5
+ <script lang="ts" setup>
6
+ import { computed, useUiConfig } from '#imports'
7
+ import { icon } from '#core/ui.config'
8
+
9
+ const props = defineProps({
10
+ name: {
11
+ type: String,
12
+ required: true,
13
+ },
14
+ dynamic: {
15
+ type: Boolean,
16
+ default: false,
17
+ },
18
+ })
19
+
20
+ const config = useUiConfig<typeof icon>(icon, 'icon')
21
+
22
+ const dynamicValue = computed(() => props.dynamic || config.dynamic)
23
+ </script>
@@ -1,36 +1,36 @@
1
- <template>
2
- <img :src="getSrc" />
3
- </template>
4
- <script lang="ts" setup>
5
- import { useImage } from '@vueuse/core'
6
- import { computed } from 'vue'
7
-
8
- const props = defineProps({
9
- src: {
10
- type: String,
11
- required: true,
12
- },
13
- loadingSrc: {
14
- type: String,
15
- default: '',
16
- },
17
- errorSrc: {
18
- type: String,
19
- default: '',
20
- },
21
- })
22
-
23
- const { isLoading, error } = useImage({ src: props.src })
24
-
25
- const getSrc = computed(() => {
26
- if (isLoading.value) {
27
- return props.loadingSrc
28
- }
29
-
30
- if (error.value) {
31
- return props.errorSrc
32
- }
33
-
34
- return props.src
35
- })
36
- </script>
1
+ <template>
2
+ <img :src="getSrc" />
3
+ </template>
4
+ <script lang="ts" setup>
5
+ import { useImage } from '@vueuse/core'
6
+ import { computed } from 'vue'
7
+
8
+ const props = defineProps({
9
+ src: {
10
+ type: String,
11
+ required: true,
12
+ },
13
+ loadingSrc: {
14
+ type: String,
15
+ default: '',
16
+ },
17
+ errorSrc: {
18
+ type: String,
19
+ default: '',
20
+ },
21
+ })
22
+
23
+ const { isLoading, error } = useImage({ src: props.src })
24
+
25
+ const getSrc = computed(() => {
26
+ if (isLoading.value) {
27
+ return props.loadingSrc
28
+ }
29
+
30
+ if (error.value) {
31
+ return props.errorSrc
32
+ }
33
+
34
+ return props.src
35
+ })
36
+ </script>
@@ -1,4 +1,4 @@
1
- <template>
2
- <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
3
- </template>
4
- <script lang="ts" setup></script>
1
+ <template>
2
+ <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
3
+ </template>
4
+ <script lang="ts" setup></script>
@@ -1,146 +1,146 @@
1
- <template>
2
- <UModal
3
- v-bind="attrs"
4
- :model-value="modelValue"
5
- :class="$props.class"
6
- :overlay="overlay"
7
- :transition="transition"
8
- :prevent-close="preventClose"
9
- :fullscreen="fullscreen"
10
- :initial-focus="modalWrapper"
11
- :ui="ui"
12
- @update:model-value="$emit('update:modelValue', $event)"
13
- >
14
- <div
15
- v-if="title"
16
- :class="[ui.header, { 'flex items-center justify-between': !isHideCloseBtn }]"
17
- >
18
- <h1 class="text-lg font-semibold">{{ title }}</h1>
19
- <Icon
20
- v-if="!isHideCloseBtn"
21
- name="i-heroicons-x-mark"
22
- class="h-6 w-6 cursor-pointer opacity-50"
23
- @click="close"
24
- />
25
- </div>
26
-
27
- <div
28
- v-if="(!title && !isHideCloseBtn && preventClose) || fullscreen"
29
- class="absolute right-0 m-4"
30
- >
31
- <Icon
32
- v-if="!isHideCloseBtn"
33
- name="i-heroicons-x-mark"
34
- class="h-6 w-6 cursor-pointer opacity-50"
35
- @click="close"
36
- />
37
- </div>
38
-
39
- <div ref="modalWrapper" :class="['overflow-y-auto', ui.innerWrapper]">
40
- <slot />
41
- </div>
42
- </UModal>
43
- </template>
44
-
45
- <script lang="ts" setup>
46
- import { type PropType, defineShortcuts, ref, toRef, watch } from '#imports'
47
- import type { Strategy } from '#core/types/utils'
48
- import { useUI } from '#ui/composables/useUI'
49
- import { modal } from '#core/ui.config'
50
- import { useUiConfig } from '#core/composables/useConfig'
51
-
52
- const config = useUiConfig<typeof modal>(modal, 'modal')
53
-
54
- const props = defineProps({
55
- modelValue: {
56
- type: Boolean,
57
- default: false,
58
- },
59
- overlay: {
60
- type: Boolean,
61
- default: true,
62
- },
63
- transition: {
64
- type: Boolean,
65
- default: true,
66
- },
67
- preventClose: {
68
- type: Boolean,
69
- default: false,
70
- },
71
- fullscreen: {
72
- type: Boolean,
73
- default: false,
74
- },
75
- scrollable: {
76
- type: Boolean,
77
- default: false,
78
- },
79
- title: {
80
- type: String,
81
- default: '',
82
- },
83
- isHideCloseBtn: {
84
- type: Boolean,
85
- default: false,
86
- },
87
- size: {
88
- type: String as PropType<keyof typeof modal.size>,
89
- default: () => modal.default.size,
90
- },
91
- position: {
92
- type: String as PropType<keyof typeof modal.position>,
93
- default: () => modal.default.position,
94
- },
95
- fixHeightSize: {
96
- type: String as PropType<keyof typeof modal.fixHeightSize>,
97
- default: () => modal.default.fixHeightSize,
98
- },
99
- class: {
100
- type: [String, Array, Object] as PropType<any>,
101
- default: undefined,
102
- },
103
- ui: {
104
- type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
105
- default: undefined,
106
- },
107
- })
108
-
109
- const emits = defineEmits(['update:modelValue'])
110
-
111
- defineShortcuts({
112
- escape: {
113
- usingInput: true,
114
- handler: () => {
115
- if (props.preventClose) return
116
- emits('update:modelValue', false)
117
- },
118
- },
119
- })
120
-
121
- const modalWrapper = ref<HTMLElement | null>(null)
122
-
123
- const close = () => {
124
- emits('update:modelValue', false)
125
- }
126
-
127
- const { ui, attrs } = useUI('modal', toRef(props, 'ui'), config, toRef(props, 'class'))
128
-
129
- watch(
130
- () => props.modelValue,
131
- () => {
132
- if (props.modelValue) {
133
- const size = config.size[props.size]
134
- const fixHeightSize = config.fixHeightSize[props.fixHeightSize]
135
- const position = config.position[props.position]
136
-
137
- ui.value.width = size
138
- ui.value.container = position
139
-
140
- if (props.scrollable) {
141
- ui.value.height = fixHeightSize
142
- }
143
- }
144
- }
145
- )
146
- </script>
1
+ <template>
2
+ <UModal
3
+ v-bind="attrs"
4
+ :model-value="modelValue"
5
+ :class="$props.class"
6
+ :overlay="overlay"
7
+ :transition="transition"
8
+ :prevent-close="preventClose"
9
+ :fullscreen="fullscreen"
10
+ :initial-focus="modalWrapper"
11
+ :ui="ui"
12
+ @update:model-value="$emit('update:modelValue', $event)"
13
+ >
14
+ <div
15
+ v-if="title"
16
+ :class="[ui.header, { 'flex items-center justify-between': !isHideCloseBtn }]"
17
+ >
18
+ <h1 class="text-lg font-semibold">{{ title }}</h1>
19
+ <Icon
20
+ v-if="!isHideCloseBtn"
21
+ name="i-heroicons-x-mark"
22
+ class="h-6 w-6 cursor-pointer opacity-50"
23
+ @click="close"
24
+ />
25
+ </div>
26
+
27
+ <div
28
+ v-if="(!title && !isHideCloseBtn && preventClose) || fullscreen"
29
+ class="absolute right-0 m-4"
30
+ >
31
+ <Icon
32
+ v-if="!isHideCloseBtn"
33
+ name="i-heroicons-x-mark"
34
+ class="h-6 w-6 cursor-pointer opacity-50"
35
+ @click="close"
36
+ />
37
+ </div>
38
+
39
+ <div ref="modalWrapper" :class="['overflow-y-auto', ui.innerWrapper]">
40
+ <slot />
41
+ </div>
42
+ </UModal>
43
+ </template>
44
+
45
+ <script lang="ts" setup>
46
+ import { type PropType, defineShortcuts, ref, toRef, watch } from '#imports'
47
+ import type { Strategy } from '#core/types/utils'
48
+ import { useUI } from '#ui/composables/useUI'
49
+ import { modal } from '#core/ui.config'
50
+ import { useUiConfig } from '#core/composables/useConfig'
51
+
52
+ const config = useUiConfig<typeof modal>(modal, 'modal')
53
+
54
+ const props = defineProps({
55
+ modelValue: {
56
+ type: Boolean,
57
+ default: false,
58
+ },
59
+ overlay: {
60
+ type: Boolean,
61
+ default: true,
62
+ },
63
+ transition: {
64
+ type: Boolean,
65
+ default: true,
66
+ },
67
+ preventClose: {
68
+ type: Boolean,
69
+ default: false,
70
+ },
71
+ fullscreen: {
72
+ type: Boolean,
73
+ default: false,
74
+ },
75
+ scrollable: {
76
+ type: Boolean,
77
+ default: false,
78
+ },
79
+ title: {
80
+ type: String,
81
+ default: '',
82
+ },
83
+ isHideCloseBtn: {
84
+ type: Boolean,
85
+ default: false,
86
+ },
87
+ size: {
88
+ type: String as PropType<keyof typeof modal.size>,
89
+ default: () => modal.default.size,
90
+ },
91
+ position: {
92
+ type: String as PropType<keyof typeof modal.position>,
93
+ default: () => modal.default.position,
94
+ },
95
+ fixHeightSize: {
96
+ type: String as PropType<keyof typeof modal.fixHeightSize>,
97
+ default: () => modal.default.fixHeightSize,
98
+ },
99
+ class: {
100
+ type: [String, Array, Object] as PropType<any>,
101
+ default: undefined,
102
+ },
103
+ ui: {
104
+ type: Object as PropType<Partial<typeof config & { strategy?: Strategy }>>,
105
+ default: undefined,
106
+ },
107
+ })
108
+
109
+ const emits = defineEmits(['update:modelValue'])
110
+
111
+ defineShortcuts({
112
+ escape: {
113
+ usingInput: true,
114
+ handler: () => {
115
+ if (props.preventClose) return
116
+ emits('update:modelValue', false)
117
+ },
118
+ },
119
+ })
120
+
121
+ const modalWrapper = ref<HTMLElement | null>(null)
122
+
123
+ const close = () => {
124
+ emits('update:modelValue', false)
125
+ }
126
+
127
+ const { ui, attrs } = useUI('modal', toRef(props, 'ui'), config, toRef(props, 'class'))
128
+
129
+ watch(
130
+ () => props.modelValue,
131
+ () => {
132
+ if (props.modelValue) {
133
+ const size = config.size[props.size]
134
+ const fixHeightSize = config.fixHeightSize[props.fixHeightSize]
135
+ const position = config.position[props.position]
136
+
137
+ ui.value.width = size
138
+ ui.value.container = position
139
+
140
+ if (props.scrollable) {
141
+ ui.value.height = fixHeightSize
142
+ }
143
+ }
144
+ }
145
+ )
146
+ </script>