@bagelink/vue 1.15.211 → 1.15.215
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.
- package/dist/components/AddressSearch.vue.d.ts.map +1 -1
- package/dist/components/Swiper.vue.d.ts +2 -2
- package/dist/components/calendar/CalendarPopover.vue.d.ts.map +1 -1
- package/dist/components/dataTable/DataTable.vue.d.ts.map +1 -1
- package/dist/components/form/inputs/DateInput.vue.d.ts.map +1 -1
- package/dist/components/form/inputs/SelectInput.vue.d.ts.map +1 -1
- package/dist/form-flow/FormFlow.vue.d.ts.map +1 -1
- package/dist/form-flow/FormFlowPlayer.vue.d.ts +24 -0
- package/dist/form-flow/FormFlowPlayer.vue.d.ts.map +1 -1
- package/dist/form-flow/form-flow.d.ts.map +1 -1
- package/dist/index.cjs +162 -139
- package/dist/index.mjs +37369 -43375
- package/dist/style.css +1 -2
- package/dist/utils/BagelFormUtils.d.ts +33 -88
- package/dist/utils/BagelFormUtils.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/form-flow/FormFlow.vue +8 -1
- package/src/form-flow/FormFlowPlayer.vue +74 -40
- package/src/form-flow/form-flow.ts +5 -0
- package/src/utils/BagelFormUtils.ts +32 -129
- package/dist/components/dataTable/useTableVirtualization.d.ts +0 -25
- package/dist/components/dataTable/useTableVirtualization.d.ts.map +0 -1
|
@@ -1,95 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
icon?: IconType;
|
|
21
|
-
iconStart?: IconType;
|
|
22
|
-
}
|
|
23
|
-
interface SlctInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
24
|
-
searchable?: boolean;
|
|
25
|
-
multiselect?: boolean;
|
|
26
|
-
clearable?: boolean;
|
|
27
|
-
onSearch?: (search: string) => any;
|
|
28
|
-
}
|
|
29
|
-
interface NumFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
30
|
-
max?: number;
|
|
31
|
-
min?: number;
|
|
32
|
-
step?: number;
|
|
33
|
-
layout?: 'default' | 'vertical' | 'horizontal';
|
|
34
|
-
padZero?: number;
|
|
35
|
-
center?: boolean;
|
|
36
|
-
useGrouping?: boolean;
|
|
37
|
-
}
|
|
38
|
-
type RichTextOptions<T, P extends Path<T>> = InputOptions<T, P>;
|
|
39
|
-
export declare function getBaseField<T, P extends Path<T>>(id?: P, labelOrRest?: string | Partial<BaseBagelField<T, P>>, rest?: Partial<BaseBagelField<T, P>>): BaseBagelField<T, P>;
|
|
40
|
-
export declare function richText<T, P extends Path<T>>(id: P, label?: string, options?: RichTextOptions<T, P>): BaseBagelField<T, P>;
|
|
41
|
-
export declare function txtField<T, P extends Path<T>>(id: P, label?: string, options?: TextInputOptions<T, P>): BaseBagelField<T, P>;
|
|
42
|
-
export declare function selectField<T, P extends Path<T>>(id: P, label?: string, options?: Option[] | (() => Option[]), config?: SlctInputOptions<T, P>): BaseBagelField<T, P>;
|
|
1
|
+
/**
|
|
2
|
+
* BagelFormUtils — legacy `$el`-based schema-builder helpers.
|
|
3
|
+
*
|
|
4
|
+
* These construct field descriptors for the object-schema form renderer
|
|
5
|
+
* (`BagelForm` / `BglFormSchemaT`). Retained for backwards compatibility with
|
|
6
|
+
* consumers (e.g. Blox block configs) that author schemas with
|
|
7
|
+
* `txtField`/`slctField`/`frmRow`/… rather than the newer `defineSchema`/
|
|
8
|
+
* FormFlow API.
|
|
9
|
+
*
|
|
10
|
+
* Public signatures intentionally use `any` — Path generics on `any` reject
|
|
11
|
+
* literal field ids (`"title"` ⊈ `Path<any>`), which broke every legacy
|
|
12
|
+
* consumer that typed `BglFormSchemaT<any>`. Runtime shape is unchanged.
|
|
13
|
+
*
|
|
14
|
+
* Re-exported as the `bagelFormUtils` namespace from the package root.
|
|
15
|
+
*/
|
|
16
|
+
export declare function getBaseField(id?: string, labelOrRest?: string | Record<string, any>, rest?: Record<string, any>): any;
|
|
17
|
+
export declare function richText(id: string, label?: string, options?: Record<string, any>): any;
|
|
18
|
+
export declare function txtField(id: string, label?: string, options?: Record<string, any>): any;
|
|
19
|
+
export declare function selectField(id: string, label?: string, options?: any[] | (() => any[]), config?: Record<string, any>): any;
|
|
43
20
|
export declare const slctField: typeof selectField;
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
export declare function
|
|
48
|
-
|
|
49
|
-
autocorrect?: boolean;
|
|
50
|
-
serverValidate?: boolean;
|
|
51
|
-
preventFakeEmails?: boolean;
|
|
52
|
-
pattern?: string;
|
|
53
|
-
}
|
|
54
|
-
export declare function emailField<T, P extends Path<T>>(id: P, label?: string, options?: EmailInputOptions<T, P>): BaseBagelField<T, P>;
|
|
55
|
-
export declare function dateField<T, P extends Path<T>>(id: P, label?: string, options?: DateOptions<T, P>): BaseBagelField<T, P>;
|
|
56
|
-
export declare function numField<T, P extends Path<T>>(id: P, label?: string, options?: NumFieldOptions<T, P>): BaseBagelField<T, P>;
|
|
57
|
-
export declare function frmRow<T, P extends Path<T>>(...children: SchemaChild<T, P>[]): {
|
|
21
|
+
export declare function checkField(id: string, label?: string, options?: Record<string, any>): any;
|
|
22
|
+
export declare function emailField(id: string, label?: string, options?: Record<string, any>): any;
|
|
23
|
+
export declare function dateField(id: string, label?: string, options?: Record<string, any>): any;
|
|
24
|
+
export declare function numField(id: string, label?: string, options?: Record<string, any>): any;
|
|
25
|
+
export declare function frmRow(...children: any[]): {
|
|
58
26
|
$el: string;
|
|
59
27
|
class: string;
|
|
60
|
-
children:
|
|
28
|
+
children: any[];
|
|
61
29
|
};
|
|
62
|
-
export type UploadOptions
|
|
63
|
-
export declare function uploadField
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
multiRange?: boolean;
|
|
70
|
-
formatValue?: (value: number) => string;
|
|
71
|
-
}
|
|
72
|
-
export declare function rangeField<T, P extends Path<T>>(id: P, label?: string, options?: RangeOptions<T, P>): BaseBagelField<T, P>;
|
|
73
|
-
export declare function bglForm<T>(idOrField?: string | Field<T>, ...schema: Field<T>[]): {
|
|
74
|
-
$el: string;
|
|
75
|
-
id?: string;
|
|
76
|
-
attrs: {
|
|
77
|
-
schema: (string | Field<T> | undefined)[];
|
|
78
|
-
};
|
|
79
|
-
};
|
|
80
|
-
export declare function telField<T, P extends Path<T>>(id: P, label?: string, options?: {
|
|
81
|
-
[key: string]: any;
|
|
82
|
-
}): BaseBagelField<T, P>;
|
|
83
|
-
export declare function colorField<T, P extends Path<T>>(id: P, label?: string, options?: {
|
|
84
|
-
[key: string]: any;
|
|
85
|
-
}): BaseBagelField<T, P>;
|
|
86
|
-
export declare function findBglFieldById<T>(id: string, _schema: BglFormSchemaT<T>): Field<T> | undefined;
|
|
87
|
-
export interface ArrayFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
88
|
-
delete?: boolean;
|
|
89
|
-
add?: boolean;
|
|
90
|
-
}
|
|
30
|
+
export type UploadOptions = Record<string, any>;
|
|
31
|
+
export declare function uploadField(id: string, label?: string, options?: UploadOptions): any;
|
|
32
|
+
export declare function rangeField(id: string, label?: string, options?: Record<string, any>): any;
|
|
33
|
+
export declare function bglForm(idOrField?: string | any, ...schema: any[]): any;
|
|
34
|
+
export declare function telField(id: string, label?: string, options?: Record<string, any>): any;
|
|
35
|
+
export declare function colorField(id: string, label?: string, options?: Record<string, any>): any;
|
|
36
|
+
export declare function findBglFieldById(id: string, _schema: any[]): any;
|
|
91
37
|
export type ArrayType = 'number' | 'text';
|
|
92
|
-
export declare function arrField
|
|
38
|
+
export declare function arrField(id: string, label: string, schemaOrType: any[] | ArrayType, options?: Record<string, any>): any;
|
|
93
39
|
export declare function useForm(): {
|
|
94
40
|
txtField: typeof txtField;
|
|
95
41
|
selectField: typeof selectField;
|
|
@@ -107,5 +53,4 @@ export declare function useForm(): {
|
|
|
107
53
|
findBglFieldById: typeof findBglFieldById;
|
|
108
54
|
getBaseField: typeof getBaseField;
|
|
109
55
|
};
|
|
110
|
-
export {};
|
|
111
56
|
//# sourceMappingURL=BagelFormUtils.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -251,10 +251,17 @@ function generateLabel(key: string, field: FieldBuilder): string {
|
|
|
251
251
|
function getFieldComponent(fieldOrType: FieldBuilder | string) {
|
|
252
252
|
// display: 'btn' on select/multiselect renders as SelectBtn
|
|
253
253
|
if (typeof fieldOrType !== 'string' && (fieldOrType._type === 'select' || fieldOrType._type === 'multiselect') && fieldOrType._config.display === 'btn') {
|
|
254
|
-
return SelectBtn
|
|
254
|
+
return props.components?.selectBtn ?? SelectBtn
|
|
255
255
|
}
|
|
256
256
|
|
|
257
257
|
const type = typeof fieldOrType === 'string' ? fieldOrType : fieldOrType._type
|
|
258
|
+
// Host may override any built-in field type via `components` (e.g. auctentic
|
|
259
|
+
// skins radio/select as OfferChoiceField). Named `$.component('X')` refs are
|
|
260
|
+
// resolved separately in `resolveComponent` — type keys only hit here.
|
|
261
|
+
if (type && props.components?.[type] != null) {
|
|
262
|
+
return props.components[type]
|
|
263
|
+
}
|
|
264
|
+
|
|
258
265
|
const componentMap: Record<string, any> = {
|
|
259
266
|
text: TextInput,
|
|
260
267
|
email: EmailInput,
|
|
@@ -49,6 +49,10 @@ export interface Props {
|
|
|
49
49
|
* the `redirect` event).
|
|
50
50
|
*/
|
|
51
51
|
redirect?: boolean
|
|
52
|
+
/** Hide the built-in step `<h2>` (host renders its own title). Default false. */
|
|
53
|
+
hideTitle?: boolean
|
|
54
|
+
/** Hide the step-position counter pill in the default nav. Default false. */
|
|
55
|
+
hideCounter?: boolean
|
|
52
56
|
/** Optional async submit handler; awaited before `complete` is emitted. */
|
|
53
57
|
onComplete?: (data: Record<string, any>) => Promise<void> | void
|
|
54
58
|
}
|
|
@@ -59,6 +63,8 @@ const props = withDefaults(defineProps<Props>(), {
|
|
|
59
63
|
autoAdvanceDelay: 200,
|
|
60
64
|
dataLayer: true,
|
|
61
65
|
redirect: true,
|
|
66
|
+
hideTitle: false,
|
|
67
|
+
hideCounter: false,
|
|
62
68
|
})
|
|
63
69
|
|
|
64
70
|
const emit = defineEmits<{
|
|
@@ -75,7 +81,9 @@ const emit = defineEmits<{
|
|
|
75
81
|
|
|
76
82
|
const { $t } = useI18n()
|
|
77
83
|
const slots: Slots = useSlots()
|
|
78
|
-
const slotNames = computed((): string[] =>
|
|
84
|
+
const slotNames = computed((): string[] =>
|
|
85
|
+
Object.keys(slots).filter(name => name !== 'nav' && name !== 'primary-label' && name !== 'step' && name !== 'empty'),
|
|
86
|
+
)
|
|
79
87
|
|
|
80
88
|
// Slide direction for the step transition: 'next' when advancing, 'prev' on
|
|
81
89
|
// Back. Drives which named transition (and thus which X offset) is used.
|
|
@@ -152,6 +160,10 @@ watch(progress, val => emit('progress', val), { immediate: true })
|
|
|
152
160
|
const formRef = ref<{ validate: () => boolean } | null>(null)
|
|
153
161
|
const submitting = ref(false)
|
|
154
162
|
|
|
163
|
+
function setFormRef(el: { validate: () => boolean } | null) {
|
|
164
|
+
formRef.value = el
|
|
165
|
+
}
|
|
166
|
+
|
|
155
167
|
/** Validate the visible current step via the underlying FormFlow. */
|
|
156
168
|
function validateStep(): boolean {
|
|
157
169
|
return formRef.value?.validate() ?? true
|
|
@@ -258,7 +270,7 @@ defineExpose({ formData, currentKey, nextKey, isTerminal, progress, validateStep
|
|
|
258
270
|
<div class="ffp-stage">
|
|
259
271
|
<Transition :name="transitionName" mode="out-in">
|
|
260
272
|
<div v-if="currentStep" :key="currentKey" class="ffp-step">
|
|
261
|
-
<h2 v-if="currentStep.title" class="ffp-title">
|
|
273
|
+
<h2 v-if="!hideTitle && currentStep.title" class="ffp-title">
|
|
262
274
|
{{ currentStep.title }}
|
|
263
275
|
</h2>
|
|
264
276
|
|
|
@@ -267,6 +279,8 @@ defineExpose({ formData, currentKey, nextKey, isTerminal, progress, validateStep
|
|
|
267
279
|
:step="currentStep"
|
|
268
280
|
:form-data="formData"
|
|
269
281
|
:step-key="currentKey"
|
|
282
|
+
:schema="currentSchema"
|
|
283
|
+
:set-form-ref="setFormRef"
|
|
270
284
|
>
|
|
271
285
|
<FormFlow
|
|
272
286
|
v-if="currentSchema"
|
|
@@ -290,44 +304,64 @@ defineExpose({ formData, currentKey, nextKey, isTerminal, progress, validateStep
|
|
|
290
304
|
</Transition>
|
|
291
305
|
</div>
|
|
292
306
|
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
<
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
307
|
+
<!--
|
|
308
|
+
Nav slot props use `goBack`/`goPrimary` (not `onBack`/`onPrimary`) —
|
|
309
|
+
Vue treats `on*` as listeners and would swallow those names.
|
|
310
|
+
-->
|
|
311
|
+
<slot
|
|
312
|
+
name="nav"
|
|
313
|
+
:can-go-back="canGoBack"
|
|
314
|
+
:is-terminal="isTerminal"
|
|
315
|
+
:submitting="submitting"
|
|
316
|
+
:go-back="onBack"
|
|
317
|
+
:go-primary="onPrimary"
|
|
318
|
+
:step-position="stepPosition"
|
|
319
|
+
:progress="progress"
|
|
320
|
+
:current-key="currentKey"
|
|
321
|
+
:auto-advances="autoAdvances"
|
|
322
|
+
>
|
|
323
|
+
<div class="ffp-nav flex flex-center gap-1">
|
|
324
|
+
<Btn
|
|
325
|
+
class="ffp-nav-btn"
|
|
326
|
+
flat
|
|
327
|
+
icon="arrow_back"
|
|
328
|
+
:value="$t?.('multiStep.previous') ?? 'Back'"
|
|
329
|
+
:disabled="!canGoBack"
|
|
330
|
+
@click="onBack"
|
|
331
|
+
/>
|
|
332
|
+
|
|
333
|
+
<span
|
|
334
|
+
v-if="!hideCounter"
|
|
335
|
+
class="ffp-counter flex-center round bg-primary-10 color-primary px-075 txt13 medium tabular-nums"
|
|
336
|
+
>
|
|
337
|
+
{{ stepPosition }}
|
|
338
|
+
</span>
|
|
339
|
+
|
|
340
|
+
<Btn
|
|
341
|
+
v-if="isTerminal"
|
|
342
|
+
class="ffp-nav-btn"
|
|
343
|
+
:value="$t?.('multiStep.complete') ?? 'Submit'"
|
|
344
|
+
:loading="submitting"
|
|
345
|
+
@click="onPrimary"
|
|
346
|
+
>
|
|
347
|
+
<slot name="primary-label" :is-terminal="true">
|
|
348
|
+
{{ $t?.('multiStep.complete') ?? 'Submit' }}
|
|
349
|
+
</slot>
|
|
350
|
+
</Btn>
|
|
351
|
+
<Btn
|
|
352
|
+
v-else
|
|
353
|
+
class="ffp-nav-btn"
|
|
354
|
+
icon-end="arrow_forward"
|
|
355
|
+
:value="$t?.('multiStep.next') ?? 'Next'"
|
|
356
|
+
:disabled="submitting"
|
|
357
|
+
@click="onPrimary"
|
|
358
|
+
>
|
|
359
|
+
<slot name="primary-label" :is-terminal="false">
|
|
360
|
+
{{ $t?.('multiStep.next') ?? 'Next' }}
|
|
361
|
+
</slot>
|
|
362
|
+
</Btn>
|
|
363
|
+
</div>
|
|
364
|
+
</slot>
|
|
331
365
|
</div>
|
|
332
366
|
</template>
|
|
333
367
|
|
|
@@ -991,6 +991,7 @@ function createFieldFromProperty(
|
|
|
991
991
|
field = $.number(config)
|
|
992
992
|
break
|
|
993
993
|
case 'tel':
|
|
994
|
+
case 'phone':
|
|
994
995
|
field = $.tel(config)
|
|
995
996
|
break
|
|
996
997
|
case 'url':
|
|
@@ -1029,6 +1030,10 @@ function createFieldFromProperty(
|
|
|
1029
1030
|
case 'multiselect':
|
|
1030
1031
|
field = $.multiselect(xOptions ?? resolvedProp.enum ?? [], config)
|
|
1031
1032
|
break
|
|
1033
|
+
case 'file':
|
|
1034
|
+
case 'upload':
|
|
1035
|
+
field = $.upload(config)
|
|
1036
|
+
break
|
|
1032
1037
|
case 'array': {
|
|
1033
1038
|
const arrayConfig: Record<string, any> = { ...config }
|
|
1034
1039
|
if (xUi.allowAdd !== undefined) arrayConfig.allowAdd = xUi.allowAdd
|
|
@@ -1,76 +1,25 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* BagelFormUtils — legacy `$el`-based schema-builder helpers.
|
|
3
3
|
*
|
|
4
|
-
* These construct
|
|
5
|
-
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
*
|
|
4
|
+
* These construct field descriptors for the object-schema form renderer
|
|
5
|
+
* (`BagelForm` / `BglFormSchemaT`). Retained for backwards compatibility with
|
|
6
|
+
* consumers (e.g. Blox block configs) that author schemas with
|
|
7
|
+
* `txtField`/`slctField`/`frmRow`/… rather than the newer `defineSchema`/
|
|
8
|
+
* FormFlow API.
|
|
9
|
+
*
|
|
10
|
+
* Public signatures intentionally use `any` — Path generics on `any` reject
|
|
11
|
+
* literal field ids (`"title"` ⊈ `Path<any>`), which broke every legacy
|
|
12
|
+
* consumer that typed `BglFormSchemaT<any>`. Runtime shape is unchanged.
|
|
9
13
|
*
|
|
10
14
|
* Re-exported as the `bagelFormUtils` namespace from the package root.
|
|
11
15
|
*/
|
|
12
|
-
import type {
|
|
13
|
-
BaseBagelField,
|
|
14
|
-
BglFormSchemaT,
|
|
15
|
-
Field,
|
|
16
|
-
Path,
|
|
17
|
-
SchemaChild,
|
|
18
|
-
UploadInputProps,
|
|
19
|
-
} from '../types/BagelForm'
|
|
20
|
-
import type { IconType, Option } from '../types'
|
|
21
|
-
|
|
22
|
-
interface InputOptions<T, P extends Path<T>> extends Partial<BaseBagelField<T, P>> {
|
|
23
|
-
defaultValue?: string | number
|
|
24
|
-
autocomplete?: string
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
interface DateOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
28
|
-
enableTime?: boolean
|
|
29
|
-
mode?: 'day' | 'month' | 'year'
|
|
30
|
-
locale?: string
|
|
31
|
-
timezone?: string
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
interface TextInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
35
|
-
type?: 'text' | 'tel' | 'email' | 'time'
|
|
36
|
-
pattern?: string
|
|
37
|
-
multiline?: boolean
|
|
38
|
-
autoheight?: boolean
|
|
39
|
-
code?: boolean
|
|
40
|
-
rows?: number | string
|
|
41
|
-
icon?: IconType
|
|
42
|
-
iconStart?: IconType
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
interface SlctInputOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
46
|
-
searchable?: boolean
|
|
47
|
-
multiselect?: boolean
|
|
48
|
-
clearable?: boolean
|
|
49
|
-
onSearch?: (search: string) => any
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
interface NumFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
53
|
-
max?: number
|
|
54
|
-
min?: number
|
|
55
|
-
step?: number
|
|
56
|
-
layout?: 'default' | 'vertical' | 'horizontal'
|
|
57
|
-
padZero?: number
|
|
58
|
-
center?: boolean
|
|
59
|
-
useGrouping?: boolean
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
type RichTextOptions<T, P extends Path<T>> = InputOptions<T, P>
|
|
63
16
|
|
|
64
|
-
export function getBaseField<
|
|
65
|
-
id?: P,
|
|
66
|
-
labelOrRest: string | Partial<BaseBagelField<T, P>> = {},
|
|
67
|
-
rest: Partial<BaseBagelField<T, P>> = {},
|
|
68
|
-
): BaseBagelField<T, P> {
|
|
17
|
+
export function getBaseField(id?: string, labelOrRest: string | Record<string, any> = {}, rest: Record<string, any> = {}): any {
|
|
69
18
|
if (typeof labelOrRest === 'object') return { id, ...labelOrRest }
|
|
70
19
|
return { id, label: labelOrRest, ...rest }
|
|
71
20
|
}
|
|
72
21
|
|
|
73
|
-
export function richText
|
|
22
|
+
export function richText(id: string, label?: string, options?: Record<string, any>): any {
|
|
74
23
|
return {
|
|
75
24
|
$el: 'richtext',
|
|
76
25
|
class: options?.class,
|
|
@@ -83,7 +32,7 @@ export function richText<T, P extends Path<T>>(id: P, label?: string, options?:
|
|
|
83
32
|
}
|
|
84
33
|
}
|
|
85
34
|
|
|
86
|
-
export function txtField
|
|
35
|
+
export function txtField(id: string, label?: string, options?: Record<string, any>): any {
|
|
87
36
|
return {
|
|
88
37
|
$el: 'text',
|
|
89
38
|
id,
|
|
@@ -110,18 +59,11 @@ export function txtField<T, P extends Path<T>>(id: P, label?: string, options?:
|
|
|
110
59
|
}
|
|
111
60
|
}
|
|
112
61
|
|
|
113
|
-
export function selectField<
|
|
114
|
-
id: P,
|
|
115
|
-
label?: string,
|
|
116
|
-
options?: Option[] | (() => Option[]),
|
|
117
|
-
config?: SlctInputOptions<T, P>,
|
|
118
|
-
): BaseBagelField<T, P> {
|
|
62
|
+
export function selectField(id: string, label?: string, options?: any[] | (() => any[]), config?: Record<string, any>): any {
|
|
119
63
|
return {
|
|
120
64
|
$el: 'select',
|
|
121
65
|
id,
|
|
122
|
-
|
|
123
|
-
// static `FieldOptions` type doesn't model — cast to preserve that.
|
|
124
|
-
options: options as BaseBagelField<T, P>['options'],
|
|
66
|
+
options,
|
|
125
67
|
class: config?.class,
|
|
126
68
|
placeholder: config?.placeholder,
|
|
127
69
|
required: config?.required,
|
|
@@ -141,11 +83,7 @@ export function selectField<T, P extends Path<T>>(
|
|
|
141
83
|
|
|
142
84
|
export const slctField = selectField
|
|
143
85
|
|
|
144
|
-
|
|
145
|
-
value?: string
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
export function checkField<T, P extends Path<T>>(id: P, label?: string, options?: CheckInputOptions<T, P>): BaseBagelField<T, P> {
|
|
86
|
+
export function checkField(id: string, label?: string, options?: Record<string, any>): any {
|
|
149
87
|
return {
|
|
150
88
|
$el: 'check',
|
|
151
89
|
class: options?.class,
|
|
@@ -156,14 +94,7 @@ export function checkField<T, P extends Path<T>>(id: P, label?: string, options?
|
|
|
156
94
|
}
|
|
157
95
|
}
|
|
158
96
|
|
|
159
|
-
|
|
160
|
-
autocorrect?: boolean
|
|
161
|
-
serverValidate?: boolean
|
|
162
|
-
preventFakeEmails?: boolean
|
|
163
|
-
pattern?: string
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
export function emailField<T, P extends Path<T>>(id: P, label?: string, options?: EmailInputOptions<T, P>): BaseBagelField<T, P> {
|
|
97
|
+
export function emailField(id: string, label?: string, options?: Record<string, any>): any {
|
|
167
98
|
return {
|
|
168
99
|
$el: 'email',
|
|
169
100
|
id,
|
|
@@ -180,7 +111,7 @@ export function emailField<T, P extends Path<T>>(id: P, label?: string, options?
|
|
|
180
111
|
}
|
|
181
112
|
}
|
|
182
113
|
|
|
183
|
-
export function dateField
|
|
114
|
+
export function dateField(id: string, label?: string, options?: Record<string, any>): any {
|
|
184
115
|
return {
|
|
185
116
|
$el: 'date',
|
|
186
117
|
class: options?.class,
|
|
@@ -201,7 +132,7 @@ export function dateField<T, P extends Path<T>>(id: P, label?: string, options?:
|
|
|
201
132
|
}
|
|
202
133
|
}
|
|
203
134
|
|
|
204
|
-
export function numField
|
|
135
|
+
export function numField(id: string, label?: string, options?: Record<string, any>): any {
|
|
205
136
|
return {
|
|
206
137
|
$el: 'number',
|
|
207
138
|
class: options?.class,
|
|
@@ -226,30 +157,17 @@ export function numField<T, P extends Path<T>>(id: P, label?: string, options?:
|
|
|
226
157
|
}
|
|
227
158
|
}
|
|
228
159
|
|
|
229
|
-
export function frmRow
|
|
230
|
-
$el: string
|
|
231
|
-
class: string
|
|
232
|
-
children: SchemaChild<T, P>[]
|
|
233
|
-
} {
|
|
160
|
+
export function frmRow(...children: any[]): { $el: string, class: string, children: any[] } {
|
|
234
161
|
return { $el: 'div', class: 'flex gap-1 m_block align-items-end', children }
|
|
235
162
|
}
|
|
236
163
|
|
|
237
|
-
export type UploadOptions
|
|
164
|
+
export type UploadOptions = Record<string, any>
|
|
238
165
|
|
|
239
|
-
export function uploadField
|
|
166
|
+
export function uploadField(id: string, label?: string, options?: UploadOptions): any {
|
|
240
167
|
return { $el: 'upload', id, label, vIf: options?.vIf, attrs: { ...options } }
|
|
241
168
|
}
|
|
242
169
|
|
|
243
|
-
|
|
244
|
-
min?: number
|
|
245
|
-
max?: number
|
|
246
|
-
step?: number
|
|
247
|
-
rtl?: boolean
|
|
248
|
-
multiRange?: boolean
|
|
249
|
-
formatValue?: (value: number) => string
|
|
250
|
-
}
|
|
251
|
-
|
|
252
|
-
export function rangeField<T, P extends Path<T>>(id: P, label?: string, options?: RangeOptions<T, P>): BaseBagelField<T, P> {
|
|
170
|
+
export function rangeField(id: string, label?: string, options?: Record<string, any>): any {
|
|
253
171
|
return {
|
|
254
172
|
$el: 'range',
|
|
255
173
|
id,
|
|
@@ -267,53 +185,38 @@ export function rangeField<T, P extends Path<T>>(id: P, label?: string, options?
|
|
|
267
185
|
}
|
|
268
186
|
}
|
|
269
187
|
|
|
270
|
-
export function bglForm
|
|
271
|
-
$el: string
|
|
272
|
-
id?: string
|
|
273
|
-
attrs: { schema: (string | Field<T> | undefined)[] }
|
|
274
|
-
} {
|
|
188
|
+
export function bglForm(idOrField?: string | any, ...schema: any[]): any {
|
|
275
189
|
if (typeof idOrField === 'string') {
|
|
276
190
|
return { $el: 'bagelform', id: idOrField, attrs: { schema: [idOrField, ...schema] } }
|
|
277
191
|
}
|
|
278
192
|
return { $el: 'bagelform', attrs: { schema: [idOrField, ...schema] } }
|
|
279
193
|
}
|
|
280
194
|
|
|
281
|
-
export function telField
|
|
195
|
+
export function telField(id: string, label?: string, options?: Record<string, any>): any {
|
|
282
196
|
return { $el: 'tel', id, label, vIf: options?.vIf, attrs: options, class: options?.class }
|
|
283
197
|
}
|
|
284
198
|
|
|
285
|
-
export function colorField
|
|
199
|
+
export function colorField(id: string, label?: string, options?: Record<string, any>): any {
|
|
286
200
|
return { $el: 'color', id, label, vIf: options?.vIf, attrs: options, class: options?.class }
|
|
287
201
|
}
|
|
288
202
|
|
|
289
|
-
export function findBglFieldById
|
|
203
|
+
export function findBglFieldById(id: string, _schema: any[]): any {
|
|
290
204
|
for (const field of _schema) {
|
|
291
|
-
if (
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
(c): c is Field<T> => typeof c === 'object' && c !== null && '$el' in c,
|
|
205
|
+
if (field?.id === id) return field
|
|
206
|
+
if (field?.children?.length) {
|
|
207
|
+
const fieldChildren = field.children.filter(
|
|
208
|
+
(c: any) => typeof c === 'object' && c !== null && '$el' in c,
|
|
296
209
|
)
|
|
297
|
-
const child = findBglFieldById(id, fieldChildren
|
|
210
|
+
const child = findBglFieldById(id, fieldChildren)
|
|
298
211
|
if (child) return child
|
|
299
212
|
}
|
|
300
213
|
}
|
|
301
214
|
return undefined
|
|
302
215
|
}
|
|
303
216
|
|
|
304
|
-
export interface ArrayFieldOptions<T, K extends Path<T>> extends InputOptions<T, K> {
|
|
305
|
-
delete?: boolean
|
|
306
|
-
add?: boolean
|
|
307
|
-
}
|
|
308
|
-
|
|
309
217
|
export type ArrayType = 'number' | 'text'
|
|
310
218
|
|
|
311
|
-
export function arrField<
|
|
312
|
-
id: P,
|
|
313
|
-
label: string,
|
|
314
|
-
schemaOrType: BglFormSchemaT<any> | ArrayType,
|
|
315
|
-
options?: ArrayFieldOptions<T, P>,
|
|
316
|
-
): BaseBagelField<T, P> {
|
|
219
|
+
export function arrField(id: string, label: string, schemaOrType: any[] | ArrayType, options?: Record<string, any>): any {
|
|
317
220
|
const attrs: Record<string, any> = { delete: true, add: true, ...options }
|
|
318
221
|
if (typeof schemaOrType === 'string') attrs.type = schemaOrType
|
|
319
222
|
else attrs.schema = schemaOrType
|