@finema/core 1.4.124 → 1.4.126

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 (64) hide show
  1. package/README.md +60 -60
  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 +11 -11
  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 +75 -75
  10. package/dist/runtime/components/Card.vue +38 -38
  11. package/dist/runtime/components/Core.vue +37 -37
  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/FlexDeck/Base.vue +143 -143
  15. package/dist/runtime/components/FlexDeck/index.vue +68 -68
  16. package/dist/runtime/components/Form/FieldWrapper.vue +23 -23
  17. package/dist/runtime/components/Form/Fields.vue +230 -230
  18. package/dist/runtime/components/Form/InputCheckbox/index.vue +28 -21
  19. package/dist/runtime/components/Form/InputCheckbox/types.d.ts +3 -1
  20. package/dist/runtime/components/Form/InputDateTime/index.vue +60 -60
  21. package/dist/runtime/components/Form/InputDateTimeRange/index.vue +83 -83
  22. package/dist/runtime/components/Form/InputNumber/index.vue +27 -27
  23. package/dist/runtime/components/Form/InputRadio/index.vue +27 -27
  24. package/dist/runtime/components/Form/InputSelect/index.vue +43 -36
  25. package/dist/runtime/components/Form/InputSelectMultiple/index.vue +52 -52
  26. package/dist/runtime/components/Form/InputStatic/index.vue +16 -16
  27. package/dist/runtime/components/Form/InputTags/index.vue +145 -145
  28. package/dist/runtime/components/Form/InputText/index.vue +67 -67
  29. package/dist/runtime/components/Form/InputTextarea/index.vue +25 -25
  30. package/dist/runtime/components/Form/InputToggle/index.vue +14 -14
  31. package/dist/runtime/components/Form/InputUploadDropzone/index.vue +206 -206
  32. package/dist/runtime/components/Form/InputUploadDropzoneAuto/index.vue +341 -341
  33. package/dist/runtime/components/Form/InputUploadDropzoneAutoMultiple/ItemUpload.vue +241 -241
  34. package/dist/runtime/components/Form/InputUploadDropzoneAutoMultiple/ItemView.vue +89 -89
  35. package/dist/runtime/components/Form/InputUploadDropzoneAutoMultiple/index.vue +164 -164
  36. package/dist/runtime/components/Form/InputUploadDropzoneImageAutoMultiple/ItemUpload.vue +161 -161
  37. package/dist/runtime/components/Form/InputUploadDropzoneImageAutoMultiple/ItemView.vue +64 -64
  38. package/dist/runtime/components/Form/InputUploadDropzoneImageAutoMultiple/index.vue +172 -172
  39. package/dist/runtime/components/Form/InputUploadFileClassic/index.vue +95 -95
  40. package/dist/runtime/components/Form/InputUploadFileClassicAuto/index.vue +151 -151
  41. package/dist/runtime/components/Form/InputUploadImageAuto/index.vue +219 -219
  42. package/dist/runtime/components/Form/InputWYSIWYG/index.vue +53 -53
  43. package/dist/runtime/components/Form/index.vue +6 -6
  44. package/dist/runtime/components/Form/types.d.ts +1 -0
  45. package/dist/runtime/components/Icon.vue +23 -23
  46. package/dist/runtime/components/Image.vue +36 -36
  47. package/dist/runtime/components/Loader.vue +27 -27
  48. package/dist/runtime/components/Log.vue +6 -30
  49. package/dist/runtime/components/LogItem.vue +43 -0
  50. package/dist/runtime/components/Modal/index.vue +146 -146
  51. package/dist/runtime/components/QRCode.vue +22 -22
  52. package/dist/runtime/components/SimplePagination.vue +96 -96
  53. package/dist/runtime/components/Slideover/index.vue +110 -110
  54. package/dist/runtime/components/Table/Base.vue +139 -139
  55. package/dist/runtime/components/Table/ColumnDate.vue +16 -16
  56. package/dist/runtime/components/Table/ColumnDateTime.vue +18 -18
  57. package/dist/runtime/components/Table/ColumnImage.vue +15 -15
  58. package/dist/runtime/components/Table/ColumnNumber.vue +14 -14
  59. package/dist/runtime/components/Table/ColumnText.vue +25 -25
  60. package/dist/runtime/components/Table/Simple.vue +69 -69
  61. package/dist/runtime/components/Table/index.vue +65 -65
  62. package/dist/runtime/components/Tabs/index.vue +64 -64
  63. package/dist/runtime/components/TeleportSafe.vue +40 -40
  64. package/package.json +95 -95
@@ -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,27 +1,27 @@
1
- <template>
2
- <div
3
- v-if="isLoading"
4
- :class="[
5
- 'flex w-full items-center justify-center',
6
- $attrs.class,
7
- {
8
- 'min-h-[200px]': !$attrs.class,
9
- },
10
- ]"
11
- >
12
- <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
13
- </div>
14
- <slot v-else />
15
- </template>
16
- <script lang="ts" setup>
17
- defineOptions({
18
- inheritAttrs: false,
19
- })
20
-
21
- defineProps({
22
- isLoading: {
23
- type: Boolean,
24
- default: true,
25
- },
26
- })
27
- </script>
1
+ <template>
2
+ <div
3
+ v-if="isLoading"
4
+ :class="[
5
+ 'flex w-full items-center justify-center',
6
+ $attrs.class,
7
+ {
8
+ 'min-h-[200px]': !$attrs.class,
9
+ },
10
+ ]"
11
+ >
12
+ <UIcon name="i-svg-spinners:180-ring-with-bg" class="text-primary text-4xl" dynamic />
13
+ </div>
14
+ <slot v-else />
15
+ </template>
16
+ <script lang="ts" setup>
17
+ defineOptions({
18
+ inheritAttrs: false,
19
+ })
20
+
21
+ defineProps({
22
+ isLoading: {
23
+ type: Boolean,
24
+ default: true,
25
+ },
26
+ })
27
+ </script>
@@ -1,38 +1,17 @@
1
1
  <template>
2
2
  <TeleportSafe v-if="isDevEnv" to="#dev-logs">
3
- <VCodeBlock
4
- v-if="data"
5
- :code="JSON.stringify(data)"
6
- max-height="500"
7
- :browser-window="true"
8
- :indent="2"
9
- lang="json"
10
- highlightjs
11
- >
12
- <template #label>
13
- <span v-if="title" class="font-semibold">{{ title }}</span>
14
- </template>
15
- </VCodeBlock>
16
-
17
- <VCodeBlock
3
+ <LogItem v-if="typeof data !== 'undefined'" :data="data" :title="title" />
4
+ <LogItem
18
5
  v-for="(item, index) in dataItems"
19
6
  :key="index"
20
- :code="JSON.stringify(item)"
21
- max-height="500"
22
- :browser-window="true"
23
- :indent="2"
24
- lang="json"
25
- highlightjs
26
- >
27
- <template #label>
28
- <span v-if="title" class="font-semibold">{{ title }} #{{ index + 1 }} </span>
29
- </template>
30
- </VCodeBlock>
7
+ :data="item"
8
+ :title="`${title} #${index + 1}`"
9
+ />
31
10
  </TeleportSafe>
32
11
  </template>
33
12
  <script lang="ts" setup>
34
13
  import { defineProps } from 'vue'
35
- import { VCodeBlock } from '@wdns/vue-code-block'
14
+ import LogItem from './LogItem.vue'
36
15
 
37
16
  defineProps<{
38
17
  data?: any
@@ -42,6 +21,3 @@ defineProps<{
42
21
 
43
22
  const isDevEnv = process.env.NODE_ENV === 'development'
44
23
  </script>
45
- <style>
46
- .hljs-string{white-space:break-spaces}
47
- </style>
@@ -0,0 +1,43 @@
1
+ <template>
2
+ <div>
3
+ <div class="mb-2 flex items-center justify-between">
4
+ <p v-if="title" class="font-semibold">{{ title }}</p>
5
+ <Icon
6
+ class="cursor-pointer"
7
+ :name="isShow ? 'heroicons:minus' : 'heroicons:plus'"
8
+ @click="isShow = !isShow"
9
+ />
10
+ </div>
11
+ <VCodeBlock
12
+ v-show="isShow"
13
+ :code="getCode"
14
+ max-height="500"
15
+ :browser-window="true"
16
+ :indent="2"
17
+ lang="json"
18
+ highlightjs
19
+ />
20
+ </div>
21
+ </template>
22
+ <script lang="ts" setup>
23
+ import { defineProps, computed, ref } from 'vue'
24
+ import { VCodeBlock } from '@wdns/vue-code-block'
25
+
26
+ const props = defineProps<{
27
+ data?: any
28
+ title?: string
29
+ }>()
30
+
31
+ const isShow = ref(true)
32
+
33
+ const getCode = computed(() => {
34
+ try {
35
+ return JSON.stringify(props.data)
36
+ } catch (e) {
37
+ return JSON.stringify('{}')
38
+ }
39
+ })
40
+ </script>
41
+ <style>
42
+ .hljs-string{white-space:break-spaces}
43
+ </style>
@@ -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="size-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="size-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="size-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="size-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,22 +1,22 @@
1
- <template>
2
- <QrcodeVue :value="value" :level="level" :render-as="renderAs" class="size-[350px]" />
3
- </template>
4
- <script lang="ts" setup>
5
- import QrcodeVue, { type RenderAs } from 'qrcode.vue'
6
- import { type PropType } from 'vue'
7
-
8
- defineProps({
9
- value: {
10
- type: String,
11
- required: true,
12
- },
13
- level: {
14
- type: String,
15
- default: 'M',
16
- },
17
- renderAs: {
18
- type: String as PropType<RenderAs>,
19
- default: 'svg',
20
- },
21
- })
22
- </script>
1
+ <template>
2
+ <QrcodeVue :value="value" :level="level" :render-as="renderAs" class="size-[350px]" />
3
+ </template>
4
+ <script lang="ts" setup>
5
+ import QrcodeVue, { type RenderAs } from 'qrcode.vue'
6
+ import { type PropType } from 'vue'
7
+
8
+ defineProps({
9
+ value: {
10
+ type: String,
11
+ required: true,
12
+ },
13
+ level: {
14
+ type: String,
15
+ default: 'M',
16
+ },
17
+ renderAs: {
18
+ type: String as PropType<RenderAs>,
19
+ default: 'svg',
20
+ },
21
+ })
22
+ </script>