@finema/core 1.4.98 → 1.4.100

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 (63) 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 +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/FlexDeck/Base.vue +90 -90
  15. package/dist/runtime/components/FlexDeck/index.vue +66 -66
  16. package/dist/runtime/components/Form/FieldWrapper.vue +23 -23
  17. package/dist/runtime/components/Form/Fields.vue +177 -177
  18. package/dist/runtime/components/Form/InputCheckbox/index.vue +21 -21
  19. package/dist/runtime/components/Form/InputDateTime/index.vue +60 -60
  20. package/dist/runtime/components/Form/InputNumber/index.vue +27 -27
  21. package/dist/runtime/components/Form/InputRadio/index.vue +27 -27
  22. package/dist/runtime/components/Form/InputSelect/index.vue +36 -36
  23. package/dist/runtime/components/Form/InputStatic/index.vue +16 -16
  24. package/dist/runtime/components/Form/InputText/index.vue +67 -67
  25. package/dist/runtime/components/Form/InputTextarea/index.vue +25 -25
  26. package/dist/runtime/components/Form/InputToggle/index.vue +14 -14
  27. package/dist/runtime/components/Form/InputUploadDropzone/index.vue +206 -205
  28. package/dist/runtime/components/Form/InputUploadDropzoneAuto/index.vue +333 -355
  29. package/dist/runtime/components/Form/InputUploadDropzoneAutoMultiple/Item.vue +260 -283
  30. package/dist/runtime/components/Form/InputUploadDropzoneAutoMultiple/index.vue +140 -126
  31. package/dist/runtime/components/Form/InputUploadDropzoneImageAutoMultiple/index.vue +148 -134
  32. package/dist/runtime/components/Form/InputUploadDropzoneImageAutoMultiple/item.vue +167 -198
  33. package/dist/runtime/components/Form/InputUploadFileClassic/index.vue +95 -103
  34. package/dist/runtime/components/Form/InputUploadFileClassicAuto/index.vue +143 -178
  35. package/dist/runtime/components/Form/index.vue +6 -6
  36. package/dist/runtime/components/Icon.vue +23 -23
  37. package/dist/runtime/components/Image.vue +36 -36
  38. package/dist/runtime/components/Loader.vue +27 -27
  39. package/dist/runtime/components/Modal/index.vue +146 -146
  40. package/dist/runtime/components/QRCode.vue +1 -1
  41. package/dist/runtime/components/SimplePagination.vue +96 -96
  42. package/dist/runtime/components/Slideover/index.vue +110 -110
  43. package/dist/runtime/components/Table/Base.vue +139 -139
  44. package/dist/runtime/components/Table/ColumnDate.vue +16 -16
  45. package/dist/runtime/components/Table/ColumnDateTime.vue +18 -18
  46. package/dist/runtime/components/Table/ColumnImage.vue +15 -15
  47. package/dist/runtime/components/Table/ColumnNumber.vue +14 -14
  48. package/dist/runtime/components/Table/ColumnText.vue +25 -25
  49. package/dist/runtime/components/Table/Simple.vue +69 -69
  50. package/dist/runtime/components/Table/index.vue +65 -65
  51. package/dist/runtime/components/Tabs/index.vue +64 -64
  52. package/dist/runtime/helpers/componentHelper.d.ts +18 -8
  53. package/dist/runtime/helpers/componentHelper.mjs +47 -8
  54. package/dist/runtime/utils/ArrayHelper.spec.mjs +1 -5
  55. package/dist/runtime/utils/FileHelper.spec.d.ts +1 -0
  56. package/dist/runtime/utils/FileHelper.spec.mjs +14 -0
  57. package/dist/runtime/utils/ObjectHelper.spec.d.ts +1 -0
  58. package/dist/runtime/utils/ObjectHelper.spec.mjs +52 -0
  59. package/dist/runtime/utils/ParamHelper.spec.d.ts +1 -0
  60. package/dist/runtime/utils/ParamHelper.spec.mjs +78 -0
  61. package/dist/runtime/utils/StringHelper.spec.d.ts +1 -0
  62. package/dist/runtime/utils/StringHelper.spec.mjs +76 -0
  63. package/package.json +89 -89
@@ -1,66 +1,66 @@
1
- <template>
2
- <div>
3
- <div v-if="options.isEnabledSearch" class="mb-4 flex justify-end">
4
- <UInput
5
- v-model="q"
6
- icon="i-heroicons-magnifying-glass"
7
- :placeholder="options.searchPlaceholder || 'ค้นหา...'"
8
- />
9
- </div>
10
- <Base
11
- :raw-data="options.rawData"
12
- :status="options.status"
13
- :page-options="options.pageOptions"
14
- :is-simple-pagination="isShowSimplePagination"
15
- :is-hide-bottom-pagination="options.isHideBottomPagination"
16
- :container-class="containerClass"
17
- @page-change="onPageChange"
18
- >
19
- <template v-for="(_, slot) of $slots" #[slot]="slotProps">
20
- <slot :name="slot" v-bind="slotProps || {}" />
21
- </template>
22
- </Base>
23
- </div>
24
- </template>
25
- <script lang="ts" setup>
26
- import { type PropType } from 'vue'
27
- import { _debounce, computed, ref, watch } from '#imports'
28
- import { useCoreConfig } from '#core/composables/useConfig'
29
- import Base from '#core/components/FlexDeck/Base.vue'
30
- import type { IFlexDeckOptions } from '#core/components/FlexDeck/types'
31
-
32
- defineSlots<{
33
- default: (props: { row: any }) => any
34
- 'empty-state': () => any
35
- 'loading-state': () => any
36
- }>()
37
-
38
- const emits = defineEmits<{
39
- (event: 'pageChange', page: number): void
40
- (event: 'search', q: string): void
41
- }>()
42
-
43
- const props = defineProps({
44
- options: { type: Object as PropType<IFlexDeckOptions>, required: true },
45
- containerClass: { type: [String, Array, Object], default: '' },
46
- })
47
-
48
- const coreConfig = useCoreConfig()
49
-
50
- const q = ref(props.options?.pageOptions.search ?? '')
51
-
52
- const isShowSimplePagination = computed(
53
- (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
54
- )
55
-
56
- watch(
57
- q,
58
- _debounce((value) => {
59
- emits('search', value)
60
- }, 500)
61
- )
62
-
63
- const onPageChange = (page: number) => {
64
- emits('pageChange', page)
65
- }
66
- </script>
1
+ <template>
2
+ <div>
3
+ <div v-if="options.isEnabledSearch" class="mb-4 flex justify-end">
4
+ <UInput
5
+ v-model="q"
6
+ icon="i-heroicons-magnifying-glass"
7
+ :placeholder="options.searchPlaceholder || 'ค้นหา...'"
8
+ />
9
+ </div>
10
+ <Base
11
+ :raw-data="options.rawData"
12
+ :status="options.status"
13
+ :page-options="options.pageOptions"
14
+ :is-simple-pagination="isShowSimplePagination"
15
+ :is-hide-bottom-pagination="options.isHideBottomPagination"
16
+ :container-class="containerClass"
17
+ @page-change="onPageChange"
18
+ >
19
+ <template v-for="(_, slot) of $slots" #[slot]="slotProps">
20
+ <slot :name="slot" v-bind="slotProps || {}" />
21
+ </template>
22
+ </Base>
23
+ </div>
24
+ </template>
25
+ <script lang="ts" setup>
26
+ import { type PropType } from 'vue'
27
+ import { _debounce, computed, ref, watch } from '#imports'
28
+ import { useCoreConfig } from '#core/composables/useConfig'
29
+ import Base from '#core/components/FlexDeck/Base.vue'
30
+ import type { IFlexDeckOptions } from '#core/components/FlexDeck/types'
31
+
32
+ defineSlots<{
33
+ default: (props: { row: any }) => any
34
+ 'empty-state': () => any
35
+ 'loading-state': () => any
36
+ }>()
37
+
38
+ const emits = defineEmits<{
39
+ (event: 'pageChange', page: number): void
40
+ (event: 'search', q: string): void
41
+ }>()
42
+
43
+ const props = defineProps({
44
+ options: { type: Object as PropType<IFlexDeckOptions>, required: true },
45
+ containerClass: { type: [String, Array, Object], default: '' },
46
+ })
47
+
48
+ const coreConfig = useCoreConfig()
49
+
50
+ const q = ref(props.options?.pageOptions.search ?? '')
51
+
52
+ const isShowSimplePagination = computed(
53
+ (): boolean => props.options.isSimplePagination ?? coreConfig.is_simple_pagination
54
+ )
55
+
56
+ watch(
57
+ q,
58
+ _debounce((value) => {
59
+ emits('search', value)
60
+ }, 500)
61
+ )
62
+
63
+ const onPageChange = (page: number) => {
64
+ emits('pageChange', page)
65
+ }
66
+ </script>
@@ -1,23 +1,23 @@
1
- <template>
2
- <UFormGroup
3
- :label="label"
4
- :name="name"
5
- :description="description"
6
- :hint="hint"
7
- :size="size as FormGroupSize"
8
- :data-testid="name"
9
- :help="help"
10
- :error="errorMessage"
11
- :required="!!isRequired"
12
- :ui="containerUi"
13
- >
14
- <slot />
15
- </UFormGroup>
16
- </template>
17
-
18
- <script lang="ts" setup>
19
- import { type IFieldProps } from '#core/components/Form/types'
20
- import type { FormGroupSize } from '#ui/types'
21
-
22
- defineProps<IFieldProps>()
23
- </script>
1
+ <template>
2
+ <UFormGroup
3
+ :label="label"
4
+ :name="name"
5
+ :description="description"
6
+ :hint="hint"
7
+ :size="size as FormGroupSize"
8
+ :data-testid="name"
9
+ :help="help"
10
+ :error="errorMessage"
11
+ :required="!!isRequired"
12
+ :ui="containerUi"
13
+ >
14
+ <slot />
15
+ </UFormGroup>
16
+ </template>
17
+
18
+ <script lang="ts" setup>
19
+ import { type IFieldProps } from '#core/components/Form/types'
20
+ import type { FormGroupSize } from '#ui/types'
21
+
22
+ defineProps<IFieldProps>()
23
+ </script>
@@ -1,177 +1,177 @@
1
- <template>
2
- <div :class="['fields', $props.class]">
3
- <template
4
- v-for="(option, index) in options.filter((item) => !item.isHide)"
5
- :key="option.props.name + index + option.type"
6
- >
7
- <FormInputStatic
8
- v-if="option.type === INPUT_TYPES.STATIC"
9
- :class="option.class"
10
- :form="form"
11
- v-bind="getFieldBinding(option)"
12
- v-on="option.on ?? {}"
13
- />
14
- <FormInputText
15
- v-else-if="option.type === INPUT_TYPES.TEXT"
16
- :class="option.class"
17
- :form="form"
18
- v-bind="getFieldBinding(option)"
19
- v-on="option.on ?? {}"
20
- />
21
- <FormInputNumber
22
- v-else-if="option.type === INPUT_TYPES.NUMBER"
23
- :class="option.class"
24
- :form="form"
25
- v-bind="getFieldBinding(option)"
26
- v-on="option.on ?? {}"
27
- />
28
- <FormInputText
29
- v-else-if="option.type === INPUT_TYPES.PASSWORD"
30
- :class="option.class"
31
- type="password"
32
- :form="form"
33
- v-bind="getFieldBinding(option)"
34
- v-on="option.on ?? {}"
35
- />
36
- <FormInputText
37
- v-else-if="option.type === INPUT_TYPES.EMAIL"
38
- :class="option.class"
39
- type="email"
40
- :form="form"
41
- v-bind="getFieldBinding(option)"
42
- v-on="option.on ?? {}"
43
- />
44
- <FormInputTextarea
45
- v-else-if="option.type === INPUT_TYPES.TEXTAREA"
46
- :class="option.class"
47
- :form="form"
48
- v-bind="getFieldBinding(option)"
49
- v-on="option.on ?? {}"
50
- />
51
- <FormInputToggle
52
- v-else-if="option.type === INPUT_TYPES.TOGGLE"
53
- :class="option.class"
54
- :form="form"
55
- v-bind="getFieldBinding(option)"
56
- v-on="option.on ?? {}"
57
- />
58
- <FormInputSelect
59
- v-else-if="option.type === INPUT_TYPES.SELECT"
60
- :class="option.class"
61
- :form="form"
62
- :options="option.props.options"
63
- v-bind="getFieldBinding(option)"
64
- v-on="option.on ?? {}"
65
- />
66
- <FormInputRadio
67
- v-else-if="option.type === INPUT_TYPES.RADIO"
68
- :class="option.class"
69
- :form="form"
70
- :options="option.props.options"
71
- v-bind="getFieldBinding(option)"
72
- v-on="option.on ?? {}"
73
- />
74
- <FormInputCheckbox
75
- v-else-if="option.type === INPUT_TYPES.CHECKBOX"
76
- :class="option.class"
77
- :form="form"
78
- v-bind="getFieldBinding(option)"
79
- v-on="option.on ?? {}"
80
- />
81
- <FormInputDateTime
82
- v-else-if="option.type === INPUT_TYPES.DATE_TIME"
83
- :class="option.class"
84
- :form="form"
85
- v-bind="getFieldBinding(option)"
86
- v-on="option.on ?? {}"
87
- />
88
- <FormInputDateTime
89
- v-else-if="option.type === INPUT_TYPES.DATE"
90
- :class="option.class"
91
- :form="form"
92
- v-bind="getFieldBinding(option)"
93
- :disabled-time="true"
94
- v-on="option.on ?? {}"
95
- />
96
- <FormInputUploadFileClassic
97
- v-else-if="option.type === INPUT_TYPES.UPLOAD_FILE_CLASSIC"
98
- :class="option.class"
99
- :form="form"
100
- v-bind="getFieldBinding(option)"
101
- v-on="option.on ?? {}"
102
- />
103
- <FormInputUploadFileClassicAuto
104
- v-else-if="option.type === INPUT_TYPES.UPLOAD_FILE_CLASSIC_AUTO"
105
- :class="option.class"
106
- :form="form"
107
- :request-options="option.props.requestOptions"
108
- v-bind="getFieldBinding(option)"
109
- v-on="option.on ?? {}"
110
- />
111
- <FormInputUploadDropzone
112
- v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE"
113
- :class="option.class"
114
- :form="form"
115
- v-bind="getFieldBinding(option)"
116
- v-on="option.on ?? {}"
117
- />
118
- <FormInputUploadDropzoneAuto
119
- v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_AUTO"
120
- :class="option.class"
121
- :form="form"
122
- :request-options="option.props.requestOptions"
123
- v-bind="getFieldBinding(option)"
124
- v-on="option.on ?? {}"
125
- />
126
- <FormInputUploadDropzoneAutoMultiple
127
- v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_AUTO_MULTIPLE"
128
- :class="option.class"
129
- :form="form"
130
- :request-options="option.props.requestOptions"
131
- v-bind="getFieldBinding(option)"
132
- v-on="option.on ?? {}"
133
- />
134
- <FormInputUploadDropzoneImageAutoMultiple
135
- v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_IMAGE_AUTO_MULTIPLE"
136
- :class="option.class"
137
- :form="form"
138
- :request-options="option.props.requestOptions"
139
- v-bind="getFieldBinding(option)"
140
- v-on="option.on ?? {}"
141
- />
142
- </template>
143
- </div>
144
- </template>
145
- <script lang="ts" setup>
146
- import { type FormContext } from 'vee-validate'
147
- import { type IFormField, INPUT_TYPES } from '#core/components/Form/types'
148
-
149
- const props = withDefaults(
150
- defineProps<{
151
- form?: FormContext
152
- options: IFormField[]
153
- orientation?: 'horizontal' | 'vertical'
154
- class?: any
155
- }>(),
156
- {
157
- class: 'space-y-4',
158
- orientation: 'vertical',
159
- }
160
- )
161
-
162
- const getFieldBinding = (field: IFormField) => {
163
- if (props.orientation === 'horizontal') {
164
- return {
165
- ...field.props,
166
- containerUi: {
167
- ...field.props.containerUi,
168
- wrapper:
169
- 'lg:grid lg:grid-cols-3 lg:gap-4 lg:items-start ' + field.props.containerUi?.wrapper,
170
- container: 'lg:col-span-2 ' + field.props.containerUi?.container,
171
- },
172
- }
173
- }
174
-
175
- return field.props
176
- }
177
- </script>
1
+ <template>
2
+ <div :class="['fields', $props.class]">
3
+ <template
4
+ v-for="(option, index) in options.filter((item) => !item.isHide)"
5
+ :key="option.props.name + index + option.type"
6
+ >
7
+ <FormInputStatic
8
+ v-if="option.type === INPUT_TYPES.STATIC"
9
+ :class="option.class"
10
+ :form="form"
11
+ v-bind="getFieldBinding(option)"
12
+ v-on="option.on ?? {}"
13
+ />
14
+ <FormInputText
15
+ v-else-if="option.type === INPUT_TYPES.TEXT"
16
+ :class="option.class"
17
+ :form="form"
18
+ v-bind="getFieldBinding(option)"
19
+ v-on="option.on ?? {}"
20
+ />
21
+ <FormInputNumber
22
+ v-else-if="option.type === INPUT_TYPES.NUMBER"
23
+ :class="option.class"
24
+ :form="form"
25
+ v-bind="getFieldBinding(option)"
26
+ v-on="option.on ?? {}"
27
+ />
28
+ <FormInputText
29
+ v-else-if="option.type === INPUT_TYPES.PASSWORD"
30
+ :class="option.class"
31
+ type="password"
32
+ :form="form"
33
+ v-bind="getFieldBinding(option)"
34
+ v-on="option.on ?? {}"
35
+ />
36
+ <FormInputText
37
+ v-else-if="option.type === INPUT_TYPES.EMAIL"
38
+ :class="option.class"
39
+ type="email"
40
+ :form="form"
41
+ v-bind="getFieldBinding(option)"
42
+ v-on="option.on ?? {}"
43
+ />
44
+ <FormInputTextarea
45
+ v-else-if="option.type === INPUT_TYPES.TEXTAREA"
46
+ :class="option.class"
47
+ :form="form"
48
+ v-bind="getFieldBinding(option)"
49
+ v-on="option.on ?? {}"
50
+ />
51
+ <FormInputToggle
52
+ v-else-if="option.type === INPUT_TYPES.TOGGLE"
53
+ :class="option.class"
54
+ :form="form"
55
+ v-bind="getFieldBinding(option)"
56
+ v-on="option.on ?? {}"
57
+ />
58
+ <FormInputSelect
59
+ v-else-if="option.type === INPUT_TYPES.SELECT"
60
+ :class="option.class"
61
+ :form="form"
62
+ :options="option.props.options"
63
+ v-bind="getFieldBinding(option)"
64
+ v-on="option.on ?? {}"
65
+ />
66
+ <FormInputRadio
67
+ v-else-if="option.type === INPUT_TYPES.RADIO"
68
+ :class="option.class"
69
+ :form="form"
70
+ :options="option.props.options"
71
+ v-bind="getFieldBinding(option)"
72
+ v-on="option.on ?? {}"
73
+ />
74
+ <FormInputCheckbox
75
+ v-else-if="option.type === INPUT_TYPES.CHECKBOX"
76
+ :class="option.class"
77
+ :form="form"
78
+ v-bind="getFieldBinding(option)"
79
+ v-on="option.on ?? {}"
80
+ />
81
+ <FormInputDateTime
82
+ v-else-if="option.type === INPUT_TYPES.DATE_TIME"
83
+ :class="option.class"
84
+ :form="form"
85
+ v-bind="getFieldBinding(option)"
86
+ v-on="option.on ?? {}"
87
+ />
88
+ <FormInputDateTime
89
+ v-else-if="option.type === INPUT_TYPES.DATE"
90
+ :class="option.class"
91
+ :form="form"
92
+ v-bind="getFieldBinding(option)"
93
+ :disabled-time="true"
94
+ v-on="option.on ?? {}"
95
+ />
96
+ <FormInputUploadFileClassic
97
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_FILE_CLASSIC"
98
+ :class="option.class"
99
+ :form="form"
100
+ v-bind="getFieldBinding(option)"
101
+ v-on="option.on ?? {}"
102
+ />
103
+ <FormInputUploadFileClassicAuto
104
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_FILE_CLASSIC_AUTO"
105
+ :class="option.class"
106
+ :form="form"
107
+ :request-options="option.props.requestOptions"
108
+ v-bind="getFieldBinding(option)"
109
+ v-on="option.on ?? {}"
110
+ />
111
+ <FormInputUploadDropzone
112
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE"
113
+ :class="option.class"
114
+ :form="form"
115
+ v-bind="getFieldBinding(option)"
116
+ v-on="option.on ?? {}"
117
+ />
118
+ <FormInputUploadDropzoneAuto
119
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_AUTO"
120
+ :class="option.class"
121
+ :form="form"
122
+ :request-options="option.props.requestOptions"
123
+ v-bind="getFieldBinding(option)"
124
+ v-on="option.on ?? {}"
125
+ />
126
+ <FormInputUploadDropzoneAutoMultiple
127
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_AUTO_MULTIPLE"
128
+ :class="option.class"
129
+ :form="form"
130
+ :request-options="option.props.requestOptions"
131
+ v-bind="getFieldBinding(option)"
132
+ v-on="option.on ?? {}"
133
+ />
134
+ <FormInputUploadDropzoneImageAutoMultiple
135
+ v-else-if="option.type === INPUT_TYPES.UPLOAD_DROPZONE_IMAGE_AUTO_MULTIPLE"
136
+ :class="option.class"
137
+ :form="form"
138
+ :request-options="option.props.requestOptions"
139
+ v-bind="getFieldBinding(option)"
140
+ v-on="option.on ?? {}"
141
+ />
142
+ </template>
143
+ </div>
144
+ </template>
145
+ <script lang="ts" setup>
146
+ import { type FormContext } from 'vee-validate'
147
+ import { type IFormField, INPUT_TYPES } from '#core/components/Form/types'
148
+
149
+ const props = withDefaults(
150
+ defineProps<{
151
+ form?: FormContext
152
+ options: IFormField[]
153
+ orientation?: 'horizontal' | 'vertical'
154
+ class?: any
155
+ }>(),
156
+ {
157
+ class: 'space-y-4',
158
+ orientation: 'vertical',
159
+ }
160
+ )
161
+
162
+ const getFieldBinding = (field: IFormField) => {
163
+ if (props.orientation === 'horizontal') {
164
+ return {
165
+ ...field.props,
166
+ containerUi: {
167
+ ...field.props.containerUi,
168
+ wrapper:
169
+ 'lg:grid lg:grid-cols-3 lg:gap-4 lg:items-start ' + field.props.containerUi?.wrapper,
170
+ container: 'lg:col-span-2 ' + field.props.containerUi?.container,
171
+ },
172
+ }
173
+ }
174
+
175
+ return field.props
176
+ }
177
+ </script>
@@ -1,21 +1,21 @@
1
- <template>
2
- <FieldWrapper v-bind="wrapperProps" label="">
3
- <UCheckbox
4
- v-model="value"
5
- :disabled="wrapperProps.isDisabled"
6
- :name="name"
7
- :label="props.label"
8
- :required="isRequired"
9
- :ui="ui"
10
- />
11
- </FieldWrapper>
12
- </template>
13
- <script lang="ts" setup>
14
- import { useFieldHOC } from '#core/composables/useForm'
15
- import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
16
- import { type ICheckboxFieldProps } from '#core/components/Form/InputCheckbox/types'
17
-
18
- const props = withDefaults(defineProps<ICheckboxFieldProps>(), {})
19
-
20
- const { value, wrapperProps } = useFieldHOC<boolean>(props)
21
- </script>
1
+ <template>
2
+ <FieldWrapper v-bind="wrapperProps" label="">
3
+ <UCheckbox
4
+ v-model="value"
5
+ :disabled="wrapperProps.isDisabled"
6
+ :name="name"
7
+ :label="props.label"
8
+ :required="isRequired"
9
+ :ui="ui"
10
+ />
11
+ </FieldWrapper>
12
+ </template>
13
+ <script lang="ts" setup>
14
+ import { useFieldHOC } from '#core/composables/useForm'
15
+ import FieldWrapper from '#core/components/Form/FieldWrapper.vue'
16
+ import { type ICheckboxFieldProps } from '#core/components/Form/InputCheckbox/types'
17
+
18
+ const props = withDefaults(defineProps<ICheckboxFieldProps>(), {})
19
+
20
+ const { value, wrapperProps } = useFieldHOC<boolean>(props)
21
+ </script>