@finema/core 1.4.71 → 1.4.72

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 (46) hide show
  1. package/README.md +63 -63
  2. package/dist/module.json +1 -1
  3. package/dist/module.mjs +1 -1
  4. package/dist/runtime/components/Alert.vue +48 -48
  5. package/dist/runtime/components/Avatar.vue +27 -27
  6. package/dist/runtime/components/Badge.vue +53 -53
  7. package/dist/runtime/components/Breadcrumb.vue +44 -44
  8. package/dist/runtime/components/Button/Group.vue +37 -37
  9. package/dist/runtime/components/Button/index.vue +76 -76
  10. package/dist/runtime/components/Card.vue +38 -38
  11. package/dist/runtime/components/Core.vue +13 -13
  12. package/dist/runtime/components/Dialog/index.vue +108 -108
  13. package/dist/runtime/components/Dropdown/index.vue +70 -70
  14. package/dist/runtime/components/Form/FieldWrapper.vue +23 -23
  15. package/dist/runtime/components/Form/Fields.vue +153 -153
  16. package/dist/runtime/components/Form/InputCheckbox/index.vue +21 -21
  17. package/dist/runtime/components/Form/InputDateTime/index.vue +60 -60
  18. package/dist/runtime/components/Form/InputRadio/index.vue +27 -27
  19. package/dist/runtime/components/Form/InputSelect/index.vue +36 -36
  20. package/dist/runtime/components/Form/InputStatic/index.vue +16 -16
  21. package/dist/runtime/components/Form/InputText/index.vue +54 -54
  22. package/dist/runtime/components/Form/InputTextarea/index.vue +25 -25
  23. package/dist/runtime/components/Form/InputToggle/index.vue +14 -14
  24. package/dist/runtime/components/Form/InputUploadDropzone/index.vue +158 -158
  25. package/dist/runtime/components/Form/InputUploadDropzoneAuto/index.vue +242 -242
  26. package/dist/runtime/components/Form/InputUploadFileClassic/index.vue +102 -102
  27. package/dist/runtime/components/Form/InputUploadFileClassicAuto/index.vue +166 -166
  28. package/dist/runtime/components/Form/index.vue +6 -6
  29. package/dist/runtime/components/Icon.vue +23 -23
  30. package/dist/runtime/components/Image.vue +36 -36
  31. package/dist/runtime/components/Loader.vue +14 -14
  32. package/dist/runtime/components/Modal/index.vue +146 -146
  33. package/dist/runtime/components/SimplePagination.vue +96 -96
  34. package/dist/runtime/components/Slideover/index.vue +110 -110
  35. package/dist/runtime/components/Table/Base.vue +139 -139
  36. package/dist/runtime/components/Table/ColumnDate.vue +16 -16
  37. package/dist/runtime/components/Table/ColumnDateTime.vue +18 -18
  38. package/dist/runtime/components/Table/ColumnImage.vue +15 -15
  39. package/dist/runtime/components/Table/ColumnNumber.vue +14 -14
  40. package/dist/runtime/components/Table/ColumnText.vue +25 -25
  41. package/dist/runtime/components/Table/Simple.vue +64 -64
  42. package/dist/runtime/components/Table/index.vue +60 -60
  43. package/dist/runtime/components/Tabs/index.vue +64 -64
  44. package/dist/runtime/composables/useForm.d.ts +2 -2
  45. package/dist/runtime/ui.css +32 -32
  46. package/package.json +88 -88
@@ -1,14 +1,14 @@
1
- <template>
2
- <div v-if="isLoading" class="flex min-h-[200px] items-center justify-center">
3
- <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
4
- </div>
5
- <slot v-else />
6
- </template>
7
- <script lang="ts" setup>
8
- defineProps({
9
- isLoading: {
10
- type: Boolean,
11
- default: true,
12
- },
13
- })
14
- </script>
1
+ <template>
2
+ <div v-if="isLoading" class="flex min-h-[200px] items-center justify-center">
3
+ <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
4
+ </div>
5
+ <slot v-else />
6
+ </template>
7
+ <script lang="ts" setup>
8
+ defineProps({
9
+ isLoading: {
10
+ type: Boolean,
11
+ default: true,
12
+ },
13
+ })
14
+ </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 { useUI } from '#ui/composables/useUI'
48
- import { modal } from '#core/ui.config'
49
- import { useUiConfig } from '#core/composables/useConfig'
50
- import type { Strategy } from '#ui/types'
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 { useUI } from '#ui/composables/useUI'
48
+ import { modal } from '#core/ui.config'
49
+ import { useUiConfig } from '#core/composables/useConfig'
50
+ import type { Strategy } from '#ui/types'
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,96 +1,96 @@
1
- <template>
2
- <div>
3
- <Button
4
- :size="size"
5
- :disabled="!canGoFirstOrPrev || disabled"
6
- :class="[ui.base, ui.rounded]"
7
- v-bind="{ ...((ui.default?.prevButton as object) || {}) }"
8
- :ui="{ rounded: '' }"
9
- aria-label="Prev"
10
- @click="onClickPrev"
11
- />
12
-
13
- <Button
14
- :size="size"
15
- :disabled="!canGoLastOrNext || disabled"
16
- :class="[ui.base, ui.rounded]"
17
- v-bind="{ ...((ui.default?.nextButton as object) || {}) }"
18
- :ui="{ rounded: '' }"
19
- aria-label="Next"
20
- @click="onClickNext"
21
- />
22
- </div>
23
- </template>
24
-
25
- <script lang="ts" setup>
26
- import { useUiConfig } from '../composables/useConfig'
27
- import { pagination } from '#core/ui.config'
28
- import { useUI, type PropType, toRef, computed } from '#imports'
29
- import type { ButtonSize } from '#ui/types/button'
30
- import type { Strategy } from '#ui/types'
31
-
32
- const config = useUiConfig<typeof pagination>(pagination, 'pagination')
33
-
34
- const emits = defineEmits(['update:modelValue'])
35
-
36
- const props = defineProps({
37
- modelValue: {
38
- type: Number,
39
- required: true,
40
- },
41
- pageCount: {
42
- type: Number,
43
- default: 10,
44
- },
45
- total: {
46
- type: Number,
47
- required: true,
48
- },
49
- disabled: {
50
- type: Boolean,
51
- default: false,
52
- },
53
- size: {
54
- type: String as PropType<ButtonSize>,
55
- default: () => pagination.default?.size,
56
- },
57
- class: {
58
- type: [String, Object, Array] as PropType<any>,
59
- default: () => '',
60
- },
61
- ui: {
62
- type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
63
- default: () => ({}),
64
- },
65
- })
66
-
67
- const { ui } = useUI('pagination', toRef(props, 'ui'), config, toRef(props, 'class'))
68
-
69
- const currentPage = computed({
70
- get() {
71
- return props.modelValue
72
- },
73
- set(value: number) {
74
- emits('update:modelValue', value)
75
- },
76
- })
77
-
78
- const pages = computed(() =>
79
- Array.from({ length: Math.ceil(props.total / props.pageCount) }, (_, i) => i + 1)
80
- )
81
-
82
- const canGoFirstOrPrev = computed(() => currentPage.value > 1)
83
- const canGoLastOrNext = computed(() => currentPage.value < pages.value.length)
84
-
85
- const onClickPrev = () => {
86
- if (canGoFirstOrPrev.value) {
87
- currentPage.value--
88
- }
89
- }
90
-
91
- const onClickNext = () => {
92
- if (canGoLastOrNext.value) {
93
- currentPage.value++
94
- }
95
- }
96
- </script>
1
+ <template>
2
+ <div>
3
+ <Button
4
+ :size="size"
5
+ :disabled="!canGoFirstOrPrev || disabled"
6
+ :class="[ui.base, ui.rounded]"
7
+ v-bind="{ ...((ui.default?.prevButton as object) || {}) }"
8
+ :ui="{ rounded: '' }"
9
+ aria-label="Prev"
10
+ @click="onClickPrev"
11
+ />
12
+
13
+ <Button
14
+ :size="size"
15
+ :disabled="!canGoLastOrNext || disabled"
16
+ :class="[ui.base, ui.rounded]"
17
+ v-bind="{ ...((ui.default?.nextButton as object) || {}) }"
18
+ :ui="{ rounded: '' }"
19
+ aria-label="Next"
20
+ @click="onClickNext"
21
+ />
22
+ </div>
23
+ </template>
24
+
25
+ <script lang="ts" setup>
26
+ import { useUiConfig } from '../composables/useConfig'
27
+ import { pagination } from '#core/ui.config'
28
+ import { useUI, type PropType, toRef, computed } from '#imports'
29
+ import type { ButtonSize } from '#ui/types/button'
30
+ import type { Strategy } from '#ui/types'
31
+
32
+ const config = useUiConfig<typeof pagination>(pagination, 'pagination')
33
+
34
+ const emits = defineEmits(['update:modelValue'])
35
+
36
+ const props = defineProps({
37
+ modelValue: {
38
+ type: Number,
39
+ required: true,
40
+ },
41
+ pageCount: {
42
+ type: Number,
43
+ default: 10,
44
+ },
45
+ total: {
46
+ type: Number,
47
+ required: true,
48
+ },
49
+ disabled: {
50
+ type: Boolean,
51
+ default: false,
52
+ },
53
+ size: {
54
+ type: String as PropType<ButtonSize>,
55
+ default: () => pagination.default?.size,
56
+ },
57
+ class: {
58
+ type: [String, Object, Array] as PropType<any>,
59
+ default: () => '',
60
+ },
61
+ ui: {
62
+ type: Object as PropType<Partial<typeof config> & { strategy?: Strategy }>,
63
+ default: () => ({}),
64
+ },
65
+ })
66
+
67
+ const { ui } = useUI('pagination', toRef(props, 'ui'), config, toRef(props, 'class'))
68
+
69
+ const currentPage = computed({
70
+ get() {
71
+ return props.modelValue
72
+ },
73
+ set(value: number) {
74
+ emits('update:modelValue', value)
75
+ },
76
+ })
77
+
78
+ const pages = computed(() =>
79
+ Array.from({ length: Math.ceil(props.total / props.pageCount) }, (_, i) => i + 1)
80
+ )
81
+
82
+ const canGoFirstOrPrev = computed(() => currentPage.value > 1)
83
+ const canGoLastOrNext = computed(() => currentPage.value < pages.value.length)
84
+
85
+ const onClickPrev = () => {
86
+ if (canGoFirstOrPrev.value) {
87
+ currentPage.value--
88
+ }
89
+ }
90
+
91
+ const onClickNext = () => {
92
+ if (canGoLastOrNext.value) {
93
+ currentPage.value++
94
+ }
95
+ }
96
+ </script>