@k3-universe/react-kit 0.0.13 → 0.0.14
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/index.js +413 -403
- package/dist/kit/builder/data-table/types.d.ts +1 -1
- package/dist/kit/builder/data-table/types.d.ts.map +1 -1
- package/dist/kit/builder/form/components/FormBuilder.d.ts +3 -172
- package/dist/kit/builder/form/components/FormBuilder.d.ts.map +1 -1
- package/dist/kit/builder/form/components/FormBuilderField.d.ts +8 -8
- package/dist/kit/builder/form/components/FormBuilderField.d.ts.map +1 -1
- package/dist/kit/builder/form/components/fields/types.d.ts +3 -3
- package/dist/kit/builder/form/components/fields/types.d.ts.map +1 -1
- package/dist/kit/builder/form/index.d.ts +1 -0
- package/dist/kit/builder/form/index.d.ts.map +1 -1
- package/dist/kit/builder/form/types.d.ts +175 -0
- package/dist/kit/builder/form/types.d.ts.map +1 -0
- package/dist/kit/builder/form/utils/common-forms.d.ts +1 -1
- package/dist/kit/builder/form/utils/common-forms.d.ts.map +1 -1
- package/dist/kit/builder/form/utils/field-factories.d.ts +3 -3
- package/dist/kit/builder/form/utils/field-factories.d.ts.map +1 -1
- package/dist/kit/builder/form/utils/section-factories.d.ts +4 -4
- package/dist/kit/builder/form/utils/section-factories.d.ts.map +1 -1
- package/dist/kit/builder/stack-dialog/provider.d.ts.map +1 -1
- package/dist/kit/builder/stack-dialog/renderer.d.ts.map +1 -1
- package/dist/kit/components/autocomplete/Autocomplete.d.ts +8 -8
- package/dist/kit/components/autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/kit/components/autocomplete/types.d.ts +6 -4
- package/dist/kit/components/autocomplete/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/kit/builder/data-table/components/DataTable.tsx +1 -1
- package/src/kit/builder/data-table/types.ts +1 -1
- package/src/kit/builder/form/components/FormBuilder.tsx +43 -237
- package/src/kit/builder/form/components/FormBuilderField.tsx +42 -34
- package/src/kit/builder/form/components/fields/AutocompleteField.tsx +2 -2
- package/src/kit/builder/form/components/fields/types.ts +3 -3
- package/src/kit/builder/form/index.ts +1 -0
- package/src/kit/builder/form/types.ts +198 -0
- package/src/kit/builder/form/utils/common-forms.ts +1 -1
- package/src/kit/builder/form/utils/field-factories.ts +5 -5
- package/src/kit/builder/form/utils/section-factories.ts +10 -10
- package/src/kit/builder/stack-dialog/provider.tsx +2 -1
- package/src/kit/builder/stack-dialog/renderer.tsx +6 -7
- package/src/kit/components/autocomplete/Autocomplete.tsx +33 -25
- package/src/kit/components/autocomplete/types.ts +7 -5
package/dist/index.js
CHANGED
|
@@ -8081,6 +8081,58 @@ function TableCaption({
|
|
|
8081
8081
|
}
|
|
8082
8082
|
);
|
|
8083
8083
|
}
|
|
8084
|
+
function FormBuilderActions({
|
|
8085
|
+
onSubmit,
|
|
8086
|
+
onCancel,
|
|
8087
|
+
onReset,
|
|
8088
|
+
submitLabel = "Save",
|
|
8089
|
+
cancelLabel = "Cancel",
|
|
8090
|
+
resetLabel = "Reset",
|
|
8091
|
+
isSubmitting = false,
|
|
8092
|
+
isValid: isValid2 = true,
|
|
8093
|
+
showReset = false,
|
|
8094
|
+
customActions,
|
|
8095
|
+
className,
|
|
8096
|
+
submitButtonProps,
|
|
8097
|
+
cancelButtonProps,
|
|
8098
|
+
resetButtonProps
|
|
8099
|
+
}) {
|
|
8100
|
+
return /* @__PURE__ */ jsxs("div", { className: cn$1("flex items-center justify-end space-x-4", className), children: [
|
|
8101
|
+
customActions,
|
|
8102
|
+
showReset && onReset && /* @__PURE__ */ jsx(
|
|
8103
|
+
Button$1,
|
|
8104
|
+
{
|
|
8105
|
+
type: "button",
|
|
8106
|
+
variant: "outline",
|
|
8107
|
+
onClick: onReset,
|
|
8108
|
+
disabled: isSubmitting,
|
|
8109
|
+
...resetButtonProps,
|
|
8110
|
+
children: resetLabel
|
|
8111
|
+
}
|
|
8112
|
+
),
|
|
8113
|
+
onCancel && /* @__PURE__ */ jsx(
|
|
8114
|
+
Button$1,
|
|
8115
|
+
{
|
|
8116
|
+
type: "button",
|
|
8117
|
+
variant: "outline",
|
|
8118
|
+
onClick: onCancel,
|
|
8119
|
+
disabled: isSubmitting,
|
|
8120
|
+
...cancelButtonProps,
|
|
8121
|
+
children: cancelLabel
|
|
8122
|
+
}
|
|
8123
|
+
),
|
|
8124
|
+
onSubmit && /* @__PURE__ */ jsx(
|
|
8125
|
+
Button$1,
|
|
8126
|
+
{
|
|
8127
|
+
type: "submit",
|
|
8128
|
+
onClick: onSubmit,
|
|
8129
|
+
disabled: isSubmitting || !isValid2,
|
|
8130
|
+
...submitButtonProps,
|
|
8131
|
+
children: isSubmitting ? "Saving..." : submitLabel
|
|
8132
|
+
}
|
|
8133
|
+
)
|
|
8134
|
+
] });
|
|
8135
|
+
}
|
|
8084
8136
|
var isCheckBoxInput = (element) => element.type === "checkbox";
|
|
8085
8137
|
var isDateObject = (value) => value instanceof Date;
|
|
8086
8138
|
var isNullOrUndefined = (value) => value == null;
|
|
@@ -18165,8 +18217,12 @@ function Autocomplete({
|
|
|
18165
18217
|
if (controlledValue !== void 0) setValue(controlledValue);
|
|
18166
18218
|
}, [controlledValue]);
|
|
18167
18219
|
const labelMapRef = useRef(/* @__PURE__ */ new Map());
|
|
18220
|
+
const rawMapRef = useRef(/* @__PURE__ */ new Map());
|
|
18168
18221
|
const addToLabelMap = useCallback((opt) => {
|
|
18169
18222
|
labelMapRef.current.set(opt.value, opt.label);
|
|
18223
|
+
if (Object.prototype.hasOwnProperty.call(opt, "raw") && opt.raw !== void 0) {
|
|
18224
|
+
rawMapRef.current.set(opt.value, opt.raw);
|
|
18225
|
+
}
|
|
18170
18226
|
}, []);
|
|
18171
18227
|
const [labelTick, setLabelTick] = useState(0);
|
|
18172
18228
|
const getLabel2 = useCallback(
|
|
@@ -18186,13 +18242,15 @@ function Autocomplete({
|
|
|
18186
18242
|
if (controlledValue === void 0) setValue(newValues);
|
|
18187
18243
|
const selectedOptions = newValues.map((v) => ({
|
|
18188
18244
|
value: v,
|
|
18189
|
-
label: getLabel2(v)
|
|
18245
|
+
label: getLabel2(v),
|
|
18246
|
+
raw: rawMapRef.current.get(v)
|
|
18190
18247
|
}));
|
|
18191
|
-
|
|
18248
|
+
const raws = selectedOptions.map((o2) => o2.raw);
|
|
18249
|
+
onChange == null ? void 0 : onChange(newValues, selectedOptions, raws);
|
|
18192
18250
|
} else {
|
|
18193
18251
|
const newValue = next.value;
|
|
18194
18252
|
if (controlledValue === void 0) setValue(newValue);
|
|
18195
|
-
onChange == null ? void 0 : onChange(newValue, next);
|
|
18253
|
+
onChange == null ? void 0 : onChange(newValue, next, next.raw ?? null);
|
|
18196
18254
|
setOpen(false);
|
|
18197
18255
|
}
|
|
18198
18256
|
},
|
|
@@ -18322,16 +18380,16 @@ function Autocomplete({
|
|
|
18322
18380
|
[isMultiple, value]
|
|
18323
18381
|
);
|
|
18324
18382
|
const selectedOptionsMulti = useMemo(
|
|
18325
|
-
() => selectedValues.map((v) => ({ value: v, label: getLabel2(v) })),
|
|
18383
|
+
() => selectedValues.map((v) => ({ value: v, label: getLabel2(v), raw: rawMapRef.current.get(v) })),
|
|
18326
18384
|
[getLabel2, selectedValues, labelTick]
|
|
18327
18385
|
);
|
|
18328
18386
|
const handleClear = useCallback(() => {
|
|
18329
18387
|
if (isMultiple) {
|
|
18330
18388
|
if (controlledValue === void 0) setValue([]);
|
|
18331
|
-
onChange == null ? void 0 : onChange([], []);
|
|
18389
|
+
onChange == null ? void 0 : onChange([], [], []);
|
|
18332
18390
|
} else {
|
|
18333
18391
|
if (controlledValue === void 0) setValue(null);
|
|
18334
|
-
onChange == null ? void 0 : onChange(null, null);
|
|
18392
|
+
onChange == null ? void 0 : onChange(null, null, null);
|
|
18335
18393
|
}
|
|
18336
18394
|
}, [controlledValue, isMultiple, onChange]);
|
|
18337
18395
|
const addCustomValue = useCallback(
|
|
@@ -18347,13 +18405,15 @@ function Autocomplete({
|
|
|
18347
18405
|
if (controlledValue === void 0) setValue(newValues);
|
|
18348
18406
|
const newOptions = newValues.map((v) => ({
|
|
18349
18407
|
value: v,
|
|
18350
|
-
label: getLabel2(v)
|
|
18408
|
+
label: getLabel2(v),
|
|
18409
|
+
raw: rawMapRef.current.get(v)
|
|
18351
18410
|
}));
|
|
18352
|
-
|
|
18411
|
+
const raws = newOptions.map((o2) => o2.raw);
|
|
18412
|
+
onChange == null ? void 0 : onChange(newValues, newOptions, raws);
|
|
18353
18413
|
setSearch("");
|
|
18354
18414
|
} else {
|
|
18355
18415
|
if (controlledValue === void 0) setValue(created.value);
|
|
18356
|
-
onChange == null ? void 0 : onChange(created.value, created);
|
|
18416
|
+
onChange == null ? void 0 : onChange(created.value, created, created.raw ?? null);
|
|
18357
18417
|
setSearch("");
|
|
18358
18418
|
setOpen(false);
|
|
18359
18419
|
}
|
|
@@ -18722,7 +18782,7 @@ function Autocomplete({
|
|
|
18722
18782
|
] });
|
|
18723
18783
|
}
|
|
18724
18784
|
function AutocompleteField({ field, value, onChange, className }) {
|
|
18725
|
-
const options = (field.options ?? []).filter((o2) => o2.value !== null && o2.value !== void 0).map((o2) => ({ label: o2.label, value: o2.value }));
|
|
18785
|
+
const options = (field.options ?? []).filter((o2) => o2.value !== null && o2.value !== void 0).map((o2) => ({ label: o2.label, value: o2.value, raw: o2.raw }));
|
|
18726
18786
|
let defaultValueShaped = void 0;
|
|
18727
18787
|
if (field.defaultValue !== void 0) {
|
|
18728
18788
|
if (field.multiple) {
|
|
@@ -18755,7 +18815,7 @@ function AutocompleteField({ field, value, onChange, className }) {
|
|
|
18755
18815
|
initialSelectedOptions: field.initialSelectedOptions ?? null,
|
|
18756
18816
|
loadSelected: field.loadSelected,
|
|
18757
18817
|
value: field.multiple ? Array.isArray(value) ? value : value ? [value] : [] : value ?? null,
|
|
18758
|
-
onChange: (val) => onChange(val),
|
|
18818
|
+
onChange: (val, option, raw) => onChange(val, option, raw),
|
|
18759
18819
|
placeholder: field.placeholder,
|
|
18760
18820
|
searchPlaceholder: field.searchPlaceholder,
|
|
18761
18821
|
renderOption: field.renderOption,
|
|
@@ -31886,9 +31946,9 @@ function FormBuilderField({ field, control, onChange, parentPath }) {
|
|
|
31886
31946
|
control,
|
|
31887
31947
|
disabled: field.disabled
|
|
31888
31948
|
});
|
|
31889
|
-
const handleChange = useCallback((value) => {
|
|
31949
|
+
const handleChange = useCallback((value, ...extras) => {
|
|
31890
31950
|
controllerField.onChange(value);
|
|
31891
|
-
onChange == null ? void 0 : onChange(value);
|
|
31951
|
+
onChange == null ? void 0 : onChange(value, ...extras);
|
|
31892
31952
|
}, [controllerField, onChange]);
|
|
31893
31953
|
const baseClassName = cn$1(
|
|
31894
31954
|
error && "border-destructive focus-visible:ring-destructive",
|
|
@@ -32755,7 +32815,7 @@ function SectionBuilder({ sections, className, renderLeaf }) {
|
|
|
32755
32815
|
function FormBuilder({
|
|
32756
32816
|
sections,
|
|
32757
32817
|
schema,
|
|
32758
|
-
defaultValues
|
|
32818
|
+
defaultValues,
|
|
32759
32819
|
onSubmit,
|
|
32760
32820
|
onCancel,
|
|
32761
32821
|
onReset,
|
|
@@ -32977,7 +33037,7 @@ function FormBuilder({
|
|
|
32977
33037
|
return object(schemaObject);
|
|
32978
33038
|
}, [sections, schema]);
|
|
32979
33039
|
const generatedDefaultValues = useMemo(() => {
|
|
32980
|
-
const values = { ...defaultValues };
|
|
33040
|
+
const values = { ...defaultValues ?? {} };
|
|
32981
33041
|
const processFields = (fields) => {
|
|
32982
33042
|
for (const field of fields) {
|
|
32983
33043
|
if (values[field.name] === void 0 && field.defaultValue !== void 0) {
|
|
@@ -33098,9 +33158,10 @@ function FormBuilder({
|
|
|
33098
33158
|
}
|
|
33099
33159
|
pendingValueUpdatesRef.current = [];
|
|
33100
33160
|
for (const [name, value] of updatesMap) {
|
|
33101
|
-
const
|
|
33161
|
+
const pathName = name;
|
|
33162
|
+
const current = getValues(pathName);
|
|
33102
33163
|
if (current !== value) {
|
|
33103
|
-
setValue(
|
|
33164
|
+
setValue(pathName, value, {
|
|
33104
33165
|
shouldDirty: false,
|
|
33105
33166
|
shouldTouch: false,
|
|
33106
33167
|
shouldValidate: false
|
|
@@ -33109,9 +33170,9 @@ function FormBuilder({
|
|
|
33109
33170
|
}
|
|
33110
33171
|
}, [setValue, getValues]);
|
|
33111
33172
|
const handleFieldChange = useCallback(
|
|
33112
|
-
(field, value) => {
|
|
33173
|
+
(field, value, ...extras) => {
|
|
33113
33174
|
if (field.onChange) {
|
|
33114
|
-
field.onChange(value, setValue, getValues);
|
|
33175
|
+
field.onChange(value, extras, setValue, getValues);
|
|
33115
33176
|
}
|
|
33116
33177
|
},
|
|
33117
33178
|
[setValue, getValues]
|
|
@@ -33148,8 +33209,8 @@ function FormBuilder({
|
|
|
33148
33209
|
disabled: field.disabled || fieldState.disabled
|
|
33149
33210
|
},
|
|
33150
33211
|
control,
|
|
33151
|
-
onChange: (value) => {
|
|
33152
|
-
handleFieldChange(field, value);
|
|
33212
|
+
onChange: (value, ...extras) => {
|
|
33213
|
+
handleFieldChange(field, value, ...extras);
|
|
33153
33214
|
onFieldChange == null ? void 0 : onFieldChange(field.name, value, getValues());
|
|
33154
33215
|
},
|
|
33155
33216
|
onFieldChange
|
|
@@ -33262,6 +33323,329 @@ function FormBuilder({
|
|
|
33262
33323
|
}
|
|
33263
33324
|
) });
|
|
33264
33325
|
}
|
|
33326
|
+
const commonValidations = {
|
|
33327
|
+
email: string().email("Please enter a valid email address"),
|
|
33328
|
+
phone: string().regex(/^[\+]?[1-9][\d]{0,15}$/, "Please enter a valid phone number"),
|
|
33329
|
+
url: string().url("Please enter a valid URL"),
|
|
33330
|
+
password: string().min(8, "Password must be at least 8 characters"),
|
|
33331
|
+
strongPassword: string().min(8, "Password must be at least 8 characters").regex(
|
|
33332
|
+
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]/,
|
|
33333
|
+
"Password must contain uppercase, lowercase, number and special character"
|
|
33334
|
+
),
|
|
33335
|
+
required: string().min(1, "This field is required"),
|
|
33336
|
+
optionalString: string().optional(),
|
|
33337
|
+
positiveNumber: number().positive("Must be a positive number"),
|
|
33338
|
+
nonNegativeNumber: number().min(0, "Must be 0 or greater")
|
|
33339
|
+
};
|
|
33340
|
+
const createField = {
|
|
33341
|
+
text: (name, label, options = {}) => ({
|
|
33342
|
+
name,
|
|
33343
|
+
label,
|
|
33344
|
+
type: "text",
|
|
33345
|
+
required: false,
|
|
33346
|
+
...options
|
|
33347
|
+
}),
|
|
33348
|
+
email: (name, label, options = {}) => ({
|
|
33349
|
+
name,
|
|
33350
|
+
label,
|
|
33351
|
+
type: "email",
|
|
33352
|
+
required: false,
|
|
33353
|
+
validation: commonValidations.email,
|
|
33354
|
+
...options
|
|
33355
|
+
}),
|
|
33356
|
+
password: (name, label, options = {}) => ({
|
|
33357
|
+
name,
|
|
33358
|
+
label,
|
|
33359
|
+
type: "password",
|
|
33360
|
+
required: false,
|
|
33361
|
+
validation: commonValidations.password,
|
|
33362
|
+
...options
|
|
33363
|
+
}),
|
|
33364
|
+
number: (name, label, options = {}) => ({
|
|
33365
|
+
name,
|
|
33366
|
+
label,
|
|
33367
|
+
type: "number",
|
|
33368
|
+
required: false,
|
|
33369
|
+
...options
|
|
33370
|
+
}),
|
|
33371
|
+
textarea: (name, label, options = {}) => ({
|
|
33372
|
+
name,
|
|
33373
|
+
label,
|
|
33374
|
+
type: "textarea",
|
|
33375
|
+
required: false,
|
|
33376
|
+
gridCols: 2,
|
|
33377
|
+
// Default to full width
|
|
33378
|
+
...options
|
|
33379
|
+
}),
|
|
33380
|
+
select: (name, label, options, fieldOptions = {}) => ({
|
|
33381
|
+
name,
|
|
33382
|
+
label,
|
|
33383
|
+
type: "select",
|
|
33384
|
+
options,
|
|
33385
|
+
required: false,
|
|
33386
|
+
...fieldOptions
|
|
33387
|
+
}),
|
|
33388
|
+
checkbox: (name, label, options = {}) => ({
|
|
33389
|
+
name,
|
|
33390
|
+
label,
|
|
33391
|
+
type: "checkbox",
|
|
33392
|
+
required: false,
|
|
33393
|
+
defaultValue: false,
|
|
33394
|
+
...options
|
|
33395
|
+
}),
|
|
33396
|
+
switch: (name, label, options = {}) => ({
|
|
33397
|
+
name,
|
|
33398
|
+
label,
|
|
33399
|
+
type: "switch",
|
|
33400
|
+
required: false,
|
|
33401
|
+
defaultValue: false,
|
|
33402
|
+
...options
|
|
33403
|
+
}),
|
|
33404
|
+
radio: (name, label, options, fieldOptions = {}) => ({
|
|
33405
|
+
name,
|
|
33406
|
+
label,
|
|
33407
|
+
type: "radio",
|
|
33408
|
+
options,
|
|
33409
|
+
required: false,
|
|
33410
|
+
...fieldOptions
|
|
33411
|
+
}),
|
|
33412
|
+
date: (name, label, options = {}) => ({
|
|
33413
|
+
name,
|
|
33414
|
+
label,
|
|
33415
|
+
type: "date",
|
|
33416
|
+
required: false,
|
|
33417
|
+
...options
|
|
33418
|
+
}),
|
|
33419
|
+
file: (name, label, options = {}) => ({
|
|
33420
|
+
name,
|
|
33421
|
+
label,
|
|
33422
|
+
type: "file",
|
|
33423
|
+
required: false,
|
|
33424
|
+
...options
|
|
33425
|
+
}),
|
|
33426
|
+
object: (name, label, fields, options = {}) => ({
|
|
33427
|
+
name,
|
|
33428
|
+
label,
|
|
33429
|
+
type: "object",
|
|
33430
|
+
fields,
|
|
33431
|
+
required: false,
|
|
33432
|
+
gridCols: 2,
|
|
33433
|
+
// Default to full width
|
|
33434
|
+
...options
|
|
33435
|
+
}),
|
|
33436
|
+
array: (name, label, fields, options = {}) => ({
|
|
33437
|
+
name,
|
|
33438
|
+
label,
|
|
33439
|
+
type: "array",
|
|
33440
|
+
fields,
|
|
33441
|
+
required: false,
|
|
33442
|
+
gridCols: 2,
|
|
33443
|
+
// Default to full width
|
|
33444
|
+
defaultValue: [],
|
|
33445
|
+
...options
|
|
33446
|
+
})
|
|
33447
|
+
};
|
|
33448
|
+
const createSection = {
|
|
33449
|
+
card: (title, fields, options = {}) => ({
|
|
33450
|
+
title,
|
|
33451
|
+
fields,
|
|
33452
|
+
variant: "card",
|
|
33453
|
+
...options
|
|
33454
|
+
}),
|
|
33455
|
+
separator: (title, fields, options = {}) => ({
|
|
33456
|
+
title,
|
|
33457
|
+
fields,
|
|
33458
|
+
variant: "separator",
|
|
33459
|
+
...options
|
|
33460
|
+
}),
|
|
33461
|
+
plain: (fields, options = {}) => ({
|
|
33462
|
+
fields,
|
|
33463
|
+
variant: "plain",
|
|
33464
|
+
...options
|
|
33465
|
+
})
|
|
33466
|
+
};
|
|
33467
|
+
const createDependency = {
|
|
33468
|
+
showWhen: (field, condition) => ({
|
|
33469
|
+
field,
|
|
33470
|
+
condition,
|
|
33471
|
+
action: "show"
|
|
33472
|
+
}),
|
|
33473
|
+
hideWhen: (field, condition) => ({
|
|
33474
|
+
field,
|
|
33475
|
+
condition,
|
|
33476
|
+
action: "hide"
|
|
33477
|
+
}),
|
|
33478
|
+
enableWhen: (field, condition) => ({
|
|
33479
|
+
field,
|
|
33480
|
+
condition,
|
|
33481
|
+
action: "enable"
|
|
33482
|
+
}),
|
|
33483
|
+
disableWhen: (field, condition) => ({
|
|
33484
|
+
field,
|
|
33485
|
+
condition,
|
|
33486
|
+
action: "disable"
|
|
33487
|
+
}),
|
|
33488
|
+
setValueWhen: (field, condition, value) => ({
|
|
33489
|
+
field,
|
|
33490
|
+
condition,
|
|
33491
|
+
action: "setValue",
|
|
33492
|
+
value
|
|
33493
|
+
})
|
|
33494
|
+
};
|
|
33495
|
+
const conditions = {
|
|
33496
|
+
equals: (value) => (fieldValue) => fieldValue === value,
|
|
33497
|
+
notEquals: (value) => (fieldValue) => fieldValue !== value,
|
|
33498
|
+
includes: (value) => (fieldValue) => Array.isArray(fieldValue) && fieldValue.includes(value),
|
|
33499
|
+
notIncludes: (value) => (fieldValue) => Array.isArray(fieldValue) && !fieldValue.includes(value),
|
|
33500
|
+
isEmpty: () => (fieldValue) => !fieldValue || Array.isArray(fieldValue) && fieldValue.length === 0,
|
|
33501
|
+
isNotEmpty: () => (fieldValue) => fieldValue && (!Array.isArray(fieldValue) || fieldValue.length > 0),
|
|
33502
|
+
greaterThan: (value) => (fieldValue) => Number(fieldValue) > value,
|
|
33503
|
+
lessThan: (value) => (fieldValue) => Number(fieldValue) < value,
|
|
33504
|
+
isTrue: () => (fieldValue) => fieldValue === true,
|
|
33505
|
+
isFalse: () => (fieldValue) => fieldValue === false
|
|
33506
|
+
};
|
|
33507
|
+
const transformers = {
|
|
33508
|
+
// Transform form data before submission
|
|
33509
|
+
cleanEmptyStrings: (data) => {
|
|
33510
|
+
const clean = (obj) => {
|
|
33511
|
+
if (Array.isArray(obj)) {
|
|
33512
|
+
return obj.map(clean).filter((item) => item !== null && item !== void 0);
|
|
33513
|
+
}
|
|
33514
|
+
if (obj && typeof obj === "object") {
|
|
33515
|
+
const cleaned = {};
|
|
33516
|
+
Object.keys(obj).forEach((key) => {
|
|
33517
|
+
const value = clean(obj[key]);
|
|
33518
|
+
if (value !== "" && value !== null && value !== void 0) {
|
|
33519
|
+
cleaned[key] = value;
|
|
33520
|
+
}
|
|
33521
|
+
});
|
|
33522
|
+
return cleaned;
|
|
33523
|
+
}
|
|
33524
|
+
return obj === "" ? void 0 : obj;
|
|
33525
|
+
};
|
|
33526
|
+
return clean(data);
|
|
33527
|
+
},
|
|
33528
|
+
// Convert string numbers to actual numbers
|
|
33529
|
+
parseNumbers: (data, numberFields) => {
|
|
33530
|
+
const parsed = { ...data };
|
|
33531
|
+
const parseValue = (obj, path = []) => {
|
|
33532
|
+
if (Array.isArray(obj)) {
|
|
33533
|
+
return obj.map(
|
|
33534
|
+
(item, index2) => parseValue(item, [...path, String(index2)])
|
|
33535
|
+
);
|
|
33536
|
+
}
|
|
33537
|
+
if (obj && typeof obj === "object") {
|
|
33538
|
+
const result = {};
|
|
33539
|
+
Object.keys(obj).forEach((key) => {
|
|
33540
|
+
const currentPath = [...path, key].join(".");
|
|
33541
|
+
result[key] = parseValue(obj[key], [...path, key]);
|
|
33542
|
+
if (numberFields.includes(currentPath) && typeof result[key] === "string") {
|
|
33543
|
+
const num = Number(result[key]);
|
|
33544
|
+
if (!isNaN(num)) {
|
|
33545
|
+
result[key] = num;
|
|
33546
|
+
}
|
|
33547
|
+
}
|
|
33548
|
+
});
|
|
33549
|
+
return result;
|
|
33550
|
+
}
|
|
33551
|
+
return obj;
|
|
33552
|
+
};
|
|
33553
|
+
return parseValue(parsed);
|
|
33554
|
+
},
|
|
33555
|
+
// Convert dates to ISO strings
|
|
33556
|
+
formatDates: (data, dateFields) => {
|
|
33557
|
+
const formatted = { ...data };
|
|
33558
|
+
const formatValue = (obj, path = []) => {
|
|
33559
|
+
if (Array.isArray(obj)) {
|
|
33560
|
+
return obj.map(
|
|
33561
|
+
(item, index2) => formatValue(item, [...path, String(index2)])
|
|
33562
|
+
);
|
|
33563
|
+
}
|
|
33564
|
+
if (obj && typeof obj === "object") {
|
|
33565
|
+
const result = {};
|
|
33566
|
+
Object.keys(obj).forEach((key) => {
|
|
33567
|
+
const currentPath = [...path, key].join(".");
|
|
33568
|
+
result[key] = formatValue(obj[key], [...path, key]);
|
|
33569
|
+
if (dateFields.includes(currentPath) && result[key] instanceof Date) {
|
|
33570
|
+
result[key] = result[key].toISOString();
|
|
33571
|
+
}
|
|
33572
|
+
});
|
|
33573
|
+
return result;
|
|
33574
|
+
}
|
|
33575
|
+
return obj;
|
|
33576
|
+
};
|
|
33577
|
+
return formatValue(formatted);
|
|
33578
|
+
}
|
|
33579
|
+
};
|
|
33580
|
+
const validators = {
|
|
33581
|
+
// Create conditional validation
|
|
33582
|
+
when: (condition, schema) => any().refine(condition, { message: "Condition not met" }).pipe(schema),
|
|
33583
|
+
// Cross-field validation - returns a refinement function to be used on object schemas
|
|
33584
|
+
matchField: (fieldName, targetField) => (data) => data[fieldName] === data[targetField],
|
|
33585
|
+
// Array validation
|
|
33586
|
+
minItems: (min2, message2) => array(any()).min(min2, message2 || `Must have at least ${min2} items`),
|
|
33587
|
+
maxItems: (max2, message2) => array(any()).max(max2, message2 || `Must have at most ${max2} items`)
|
|
33588
|
+
};
|
|
33589
|
+
const commonForms = {
|
|
33590
|
+
// User registration form
|
|
33591
|
+
userRegistration: () => [
|
|
33592
|
+
createSection.card("Personal Information", [
|
|
33593
|
+
createField.text("firstName", "First Name", { required: true }),
|
|
33594
|
+
createField.text("lastName", "Last Name", { required: true }),
|
|
33595
|
+
createField.email("email", "Email Address", { required: true }),
|
|
33596
|
+
createField.password("password", "Password", { required: true }),
|
|
33597
|
+
createField.password("confirmPassword", "Confirm Password", {
|
|
33598
|
+
required: true
|
|
33599
|
+
})
|
|
33600
|
+
]),
|
|
33601
|
+
createSection.card("Additional Information", [
|
|
33602
|
+
createField.text("phone", "Phone Number", {
|
|
33603
|
+
validation: commonValidations.phone
|
|
33604
|
+
}),
|
|
33605
|
+
createField.date("dateOfBirth", "Date of Birth"),
|
|
33606
|
+
createField.checkbox(
|
|
33607
|
+
"agreeToTerms",
|
|
33608
|
+
"I agree to the terms and conditions",
|
|
33609
|
+
{ required: true }
|
|
33610
|
+
)
|
|
33611
|
+
])
|
|
33612
|
+
],
|
|
33613
|
+
// Contact form
|
|
33614
|
+
contact: () => [
|
|
33615
|
+
createSection.plain([
|
|
33616
|
+
createField.text("name", "Full Name", { required: true }),
|
|
33617
|
+
createField.email("email", "Email Address", { required: true }),
|
|
33618
|
+
createField.text("subject", "Subject", { required: true }),
|
|
33619
|
+
createField.textarea("message", "Message", {
|
|
33620
|
+
required: true,
|
|
33621
|
+
gridCols: 2
|
|
33622
|
+
})
|
|
33623
|
+
])
|
|
33624
|
+
],
|
|
33625
|
+
// Address form
|
|
33626
|
+
address: () => [
|
|
33627
|
+
createSection.card("Address Information", [
|
|
33628
|
+
createField.text("street", "Street Address", {
|
|
33629
|
+
required: true,
|
|
33630
|
+
gridCols: 2
|
|
33631
|
+
}),
|
|
33632
|
+
createField.text("city", "City", { required: true }),
|
|
33633
|
+
createField.text("state", "State/Province", { required: true }),
|
|
33634
|
+
createField.text("postalCode", "Postal Code", { required: true }),
|
|
33635
|
+
createField.select(
|
|
33636
|
+
"country",
|
|
33637
|
+
"Country",
|
|
33638
|
+
[
|
|
33639
|
+
{ label: "United States", value: "US" },
|
|
33640
|
+
{ label: "Canada", value: "CA" },
|
|
33641
|
+
{ label: "United Kingdom", value: "UK" }
|
|
33642
|
+
// Add more countries as needed
|
|
33643
|
+
],
|
|
33644
|
+
{ required: true }
|
|
33645
|
+
)
|
|
33646
|
+
])
|
|
33647
|
+
]
|
|
33648
|
+
};
|
|
33265
33649
|
function DataTablePagination({ table }) {
|
|
33266
33650
|
const pagination = table.getState().pagination ?? { pageIndex: 0, pageSize: 10 };
|
|
33267
33651
|
return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-2", children: [
|
|
@@ -40811,381 +41195,6 @@ function DialogProvider({ children }) {
|
|
|
40811
41195
|
] });
|
|
40812
41196
|
}
|
|
40813
41197
|
const useDialog = useDialogController;
|
|
40814
|
-
function FormBuilderActions({
|
|
40815
|
-
onSubmit,
|
|
40816
|
-
onCancel,
|
|
40817
|
-
onReset,
|
|
40818
|
-
submitLabel = "Save",
|
|
40819
|
-
cancelLabel = "Cancel",
|
|
40820
|
-
resetLabel = "Reset",
|
|
40821
|
-
isSubmitting = false,
|
|
40822
|
-
isValid: isValid2 = true,
|
|
40823
|
-
showReset = false,
|
|
40824
|
-
customActions,
|
|
40825
|
-
className,
|
|
40826
|
-
submitButtonProps,
|
|
40827
|
-
cancelButtonProps,
|
|
40828
|
-
resetButtonProps
|
|
40829
|
-
}) {
|
|
40830
|
-
return /* @__PURE__ */ jsxs("div", { className: cn$1("flex items-center justify-end space-x-4", className), children: [
|
|
40831
|
-
customActions,
|
|
40832
|
-
showReset && onReset && /* @__PURE__ */ jsx(
|
|
40833
|
-
Button$1,
|
|
40834
|
-
{
|
|
40835
|
-
type: "button",
|
|
40836
|
-
variant: "outline",
|
|
40837
|
-
onClick: onReset,
|
|
40838
|
-
disabled: isSubmitting,
|
|
40839
|
-
...resetButtonProps,
|
|
40840
|
-
children: resetLabel
|
|
40841
|
-
}
|
|
40842
|
-
),
|
|
40843
|
-
onCancel && /* @__PURE__ */ jsx(
|
|
40844
|
-
Button$1,
|
|
40845
|
-
{
|
|
40846
|
-
type: "button",
|
|
40847
|
-
variant: "outline",
|
|
40848
|
-
onClick: onCancel,
|
|
40849
|
-
disabled: isSubmitting,
|
|
40850
|
-
...cancelButtonProps,
|
|
40851
|
-
children: cancelLabel
|
|
40852
|
-
}
|
|
40853
|
-
),
|
|
40854
|
-
onSubmit && /* @__PURE__ */ jsx(
|
|
40855
|
-
Button$1,
|
|
40856
|
-
{
|
|
40857
|
-
type: "submit",
|
|
40858
|
-
onClick: onSubmit,
|
|
40859
|
-
disabled: isSubmitting || !isValid2,
|
|
40860
|
-
...submitButtonProps,
|
|
40861
|
-
children: isSubmitting ? "Saving..." : submitLabel
|
|
40862
|
-
}
|
|
40863
|
-
)
|
|
40864
|
-
] });
|
|
40865
|
-
}
|
|
40866
|
-
const commonValidations = {
|
|
40867
|
-
email: string().email("Please enter a valid email address"),
|
|
40868
|
-
phone: string().regex(/^[\+]?[1-9][\d]{0,15}$/, "Please enter a valid phone number"),
|
|
40869
|
-
url: string().url("Please enter a valid URL"),
|
|
40870
|
-
password: string().min(8, "Password must be at least 8 characters"),
|
|
40871
|
-
strongPassword: string().min(8, "Password must be at least 8 characters").regex(
|
|
40872
|
-
/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]/,
|
|
40873
|
-
"Password must contain uppercase, lowercase, number and special character"
|
|
40874
|
-
),
|
|
40875
|
-
required: string().min(1, "This field is required"),
|
|
40876
|
-
optionalString: string().optional(),
|
|
40877
|
-
positiveNumber: number().positive("Must be a positive number"),
|
|
40878
|
-
nonNegativeNumber: number().min(0, "Must be 0 or greater")
|
|
40879
|
-
};
|
|
40880
|
-
const createField = {
|
|
40881
|
-
text: (name, label, options = {}) => ({
|
|
40882
|
-
name,
|
|
40883
|
-
label,
|
|
40884
|
-
type: "text",
|
|
40885
|
-
required: false,
|
|
40886
|
-
...options
|
|
40887
|
-
}),
|
|
40888
|
-
email: (name, label, options = {}) => ({
|
|
40889
|
-
name,
|
|
40890
|
-
label,
|
|
40891
|
-
type: "email",
|
|
40892
|
-
required: false,
|
|
40893
|
-
validation: commonValidations.email,
|
|
40894
|
-
...options
|
|
40895
|
-
}),
|
|
40896
|
-
password: (name, label, options = {}) => ({
|
|
40897
|
-
name,
|
|
40898
|
-
label,
|
|
40899
|
-
type: "password",
|
|
40900
|
-
required: false,
|
|
40901
|
-
validation: commonValidations.password,
|
|
40902
|
-
...options
|
|
40903
|
-
}),
|
|
40904
|
-
number: (name, label, options = {}) => ({
|
|
40905
|
-
name,
|
|
40906
|
-
label,
|
|
40907
|
-
type: "number",
|
|
40908
|
-
required: false,
|
|
40909
|
-
...options
|
|
40910
|
-
}),
|
|
40911
|
-
textarea: (name, label, options = {}) => ({
|
|
40912
|
-
name,
|
|
40913
|
-
label,
|
|
40914
|
-
type: "textarea",
|
|
40915
|
-
required: false,
|
|
40916
|
-
gridCols: 2,
|
|
40917
|
-
// Default to full width
|
|
40918
|
-
...options
|
|
40919
|
-
}),
|
|
40920
|
-
select: (name, label, options, fieldOptions = {}) => ({
|
|
40921
|
-
name,
|
|
40922
|
-
label,
|
|
40923
|
-
type: "select",
|
|
40924
|
-
options,
|
|
40925
|
-
required: false,
|
|
40926
|
-
...fieldOptions
|
|
40927
|
-
}),
|
|
40928
|
-
checkbox: (name, label, options = {}) => ({
|
|
40929
|
-
name,
|
|
40930
|
-
label,
|
|
40931
|
-
type: "checkbox",
|
|
40932
|
-
required: false,
|
|
40933
|
-
defaultValue: false,
|
|
40934
|
-
...options
|
|
40935
|
-
}),
|
|
40936
|
-
switch: (name, label, options = {}) => ({
|
|
40937
|
-
name,
|
|
40938
|
-
label,
|
|
40939
|
-
type: "switch",
|
|
40940
|
-
required: false,
|
|
40941
|
-
defaultValue: false,
|
|
40942
|
-
...options
|
|
40943
|
-
}),
|
|
40944
|
-
radio: (name, label, options, fieldOptions = {}) => ({
|
|
40945
|
-
name,
|
|
40946
|
-
label,
|
|
40947
|
-
type: "radio",
|
|
40948
|
-
options,
|
|
40949
|
-
required: false,
|
|
40950
|
-
...fieldOptions
|
|
40951
|
-
}),
|
|
40952
|
-
date: (name, label, options = {}) => ({
|
|
40953
|
-
name,
|
|
40954
|
-
label,
|
|
40955
|
-
type: "date",
|
|
40956
|
-
required: false,
|
|
40957
|
-
...options
|
|
40958
|
-
}),
|
|
40959
|
-
file: (name, label, options = {}) => ({
|
|
40960
|
-
name,
|
|
40961
|
-
label,
|
|
40962
|
-
type: "file",
|
|
40963
|
-
required: false,
|
|
40964
|
-
...options
|
|
40965
|
-
}),
|
|
40966
|
-
object: (name, label, fields, options = {}) => ({
|
|
40967
|
-
name,
|
|
40968
|
-
label,
|
|
40969
|
-
type: "object",
|
|
40970
|
-
fields,
|
|
40971
|
-
required: false,
|
|
40972
|
-
gridCols: 2,
|
|
40973
|
-
// Default to full width
|
|
40974
|
-
...options
|
|
40975
|
-
}),
|
|
40976
|
-
array: (name, label, fields, options = {}) => ({
|
|
40977
|
-
name,
|
|
40978
|
-
label,
|
|
40979
|
-
type: "array",
|
|
40980
|
-
fields,
|
|
40981
|
-
required: false,
|
|
40982
|
-
gridCols: 2,
|
|
40983
|
-
// Default to full width
|
|
40984
|
-
defaultValue: [],
|
|
40985
|
-
...options
|
|
40986
|
-
})
|
|
40987
|
-
};
|
|
40988
|
-
const createSection = {
|
|
40989
|
-
card: (title, fields, options = {}) => ({
|
|
40990
|
-
title,
|
|
40991
|
-
fields,
|
|
40992
|
-
variant: "card",
|
|
40993
|
-
...options
|
|
40994
|
-
}),
|
|
40995
|
-
separator: (title, fields, options = {}) => ({
|
|
40996
|
-
title,
|
|
40997
|
-
fields,
|
|
40998
|
-
variant: "separator",
|
|
40999
|
-
...options
|
|
41000
|
-
}),
|
|
41001
|
-
plain: (fields, options = {}) => ({
|
|
41002
|
-
fields,
|
|
41003
|
-
variant: "plain",
|
|
41004
|
-
...options
|
|
41005
|
-
})
|
|
41006
|
-
};
|
|
41007
|
-
const createDependency = {
|
|
41008
|
-
showWhen: (field, condition) => ({
|
|
41009
|
-
field,
|
|
41010
|
-
condition,
|
|
41011
|
-
action: "show"
|
|
41012
|
-
}),
|
|
41013
|
-
hideWhen: (field, condition) => ({
|
|
41014
|
-
field,
|
|
41015
|
-
condition,
|
|
41016
|
-
action: "hide"
|
|
41017
|
-
}),
|
|
41018
|
-
enableWhen: (field, condition) => ({
|
|
41019
|
-
field,
|
|
41020
|
-
condition,
|
|
41021
|
-
action: "enable"
|
|
41022
|
-
}),
|
|
41023
|
-
disableWhen: (field, condition) => ({
|
|
41024
|
-
field,
|
|
41025
|
-
condition,
|
|
41026
|
-
action: "disable"
|
|
41027
|
-
}),
|
|
41028
|
-
setValueWhen: (field, condition, value) => ({
|
|
41029
|
-
field,
|
|
41030
|
-
condition,
|
|
41031
|
-
action: "setValue",
|
|
41032
|
-
value
|
|
41033
|
-
})
|
|
41034
|
-
};
|
|
41035
|
-
const conditions = {
|
|
41036
|
-
equals: (value) => (fieldValue) => fieldValue === value,
|
|
41037
|
-
notEquals: (value) => (fieldValue) => fieldValue !== value,
|
|
41038
|
-
includes: (value) => (fieldValue) => Array.isArray(fieldValue) && fieldValue.includes(value),
|
|
41039
|
-
notIncludes: (value) => (fieldValue) => Array.isArray(fieldValue) && !fieldValue.includes(value),
|
|
41040
|
-
isEmpty: () => (fieldValue) => !fieldValue || Array.isArray(fieldValue) && fieldValue.length === 0,
|
|
41041
|
-
isNotEmpty: () => (fieldValue) => fieldValue && (!Array.isArray(fieldValue) || fieldValue.length > 0),
|
|
41042
|
-
greaterThan: (value) => (fieldValue) => Number(fieldValue) > value,
|
|
41043
|
-
lessThan: (value) => (fieldValue) => Number(fieldValue) < value,
|
|
41044
|
-
isTrue: () => (fieldValue) => fieldValue === true,
|
|
41045
|
-
isFalse: () => (fieldValue) => fieldValue === false
|
|
41046
|
-
};
|
|
41047
|
-
const transformers = {
|
|
41048
|
-
// Transform form data before submission
|
|
41049
|
-
cleanEmptyStrings: (data) => {
|
|
41050
|
-
const clean = (obj) => {
|
|
41051
|
-
if (Array.isArray(obj)) {
|
|
41052
|
-
return obj.map(clean).filter((item) => item !== null && item !== void 0);
|
|
41053
|
-
}
|
|
41054
|
-
if (obj && typeof obj === "object") {
|
|
41055
|
-
const cleaned = {};
|
|
41056
|
-
Object.keys(obj).forEach((key) => {
|
|
41057
|
-
const value = clean(obj[key]);
|
|
41058
|
-
if (value !== "" && value !== null && value !== void 0) {
|
|
41059
|
-
cleaned[key] = value;
|
|
41060
|
-
}
|
|
41061
|
-
});
|
|
41062
|
-
return cleaned;
|
|
41063
|
-
}
|
|
41064
|
-
return obj === "" ? void 0 : obj;
|
|
41065
|
-
};
|
|
41066
|
-
return clean(data);
|
|
41067
|
-
},
|
|
41068
|
-
// Convert string numbers to actual numbers
|
|
41069
|
-
parseNumbers: (data, numberFields) => {
|
|
41070
|
-
const parsed = { ...data };
|
|
41071
|
-
const parseValue = (obj, path = []) => {
|
|
41072
|
-
if (Array.isArray(obj)) {
|
|
41073
|
-
return obj.map(
|
|
41074
|
-
(item, index2) => parseValue(item, [...path, String(index2)])
|
|
41075
|
-
);
|
|
41076
|
-
}
|
|
41077
|
-
if (obj && typeof obj === "object") {
|
|
41078
|
-
const result = {};
|
|
41079
|
-
Object.keys(obj).forEach((key) => {
|
|
41080
|
-
const currentPath = [...path, key].join(".");
|
|
41081
|
-
result[key] = parseValue(obj[key], [...path, key]);
|
|
41082
|
-
if (numberFields.includes(currentPath) && typeof result[key] === "string") {
|
|
41083
|
-
const num = Number(result[key]);
|
|
41084
|
-
if (!isNaN(num)) {
|
|
41085
|
-
result[key] = num;
|
|
41086
|
-
}
|
|
41087
|
-
}
|
|
41088
|
-
});
|
|
41089
|
-
return result;
|
|
41090
|
-
}
|
|
41091
|
-
return obj;
|
|
41092
|
-
};
|
|
41093
|
-
return parseValue(parsed);
|
|
41094
|
-
},
|
|
41095
|
-
// Convert dates to ISO strings
|
|
41096
|
-
formatDates: (data, dateFields) => {
|
|
41097
|
-
const formatted = { ...data };
|
|
41098
|
-
const formatValue = (obj, path = []) => {
|
|
41099
|
-
if (Array.isArray(obj)) {
|
|
41100
|
-
return obj.map(
|
|
41101
|
-
(item, index2) => formatValue(item, [...path, String(index2)])
|
|
41102
|
-
);
|
|
41103
|
-
}
|
|
41104
|
-
if (obj && typeof obj === "object") {
|
|
41105
|
-
const result = {};
|
|
41106
|
-
Object.keys(obj).forEach((key) => {
|
|
41107
|
-
const currentPath = [...path, key].join(".");
|
|
41108
|
-
result[key] = formatValue(obj[key], [...path, key]);
|
|
41109
|
-
if (dateFields.includes(currentPath) && result[key] instanceof Date) {
|
|
41110
|
-
result[key] = result[key].toISOString();
|
|
41111
|
-
}
|
|
41112
|
-
});
|
|
41113
|
-
return result;
|
|
41114
|
-
}
|
|
41115
|
-
return obj;
|
|
41116
|
-
};
|
|
41117
|
-
return formatValue(formatted);
|
|
41118
|
-
}
|
|
41119
|
-
};
|
|
41120
|
-
const validators = {
|
|
41121
|
-
// Create conditional validation
|
|
41122
|
-
when: (condition, schema) => any().refine(condition, { message: "Condition not met" }).pipe(schema),
|
|
41123
|
-
// Cross-field validation - returns a refinement function to be used on object schemas
|
|
41124
|
-
matchField: (fieldName, targetField) => (data) => data[fieldName] === data[targetField],
|
|
41125
|
-
// Array validation
|
|
41126
|
-
minItems: (min2, message2) => array(any()).min(min2, message2 || `Must have at least ${min2} items`),
|
|
41127
|
-
maxItems: (max2, message2) => array(any()).max(max2, message2 || `Must have at most ${max2} items`)
|
|
41128
|
-
};
|
|
41129
|
-
const commonForms = {
|
|
41130
|
-
// User registration form
|
|
41131
|
-
userRegistration: () => [
|
|
41132
|
-
createSection.card("Personal Information", [
|
|
41133
|
-
createField.text("firstName", "First Name", { required: true }),
|
|
41134
|
-
createField.text("lastName", "Last Name", { required: true }),
|
|
41135
|
-
createField.email("email", "Email Address", { required: true }),
|
|
41136
|
-
createField.password("password", "Password", { required: true }),
|
|
41137
|
-
createField.password("confirmPassword", "Confirm Password", {
|
|
41138
|
-
required: true
|
|
41139
|
-
})
|
|
41140
|
-
]),
|
|
41141
|
-
createSection.card("Additional Information", [
|
|
41142
|
-
createField.text("phone", "Phone Number", {
|
|
41143
|
-
validation: commonValidations.phone
|
|
41144
|
-
}),
|
|
41145
|
-
createField.date("dateOfBirth", "Date of Birth"),
|
|
41146
|
-
createField.checkbox(
|
|
41147
|
-
"agreeToTerms",
|
|
41148
|
-
"I agree to the terms and conditions",
|
|
41149
|
-
{ required: true }
|
|
41150
|
-
)
|
|
41151
|
-
])
|
|
41152
|
-
],
|
|
41153
|
-
// Contact form
|
|
41154
|
-
contact: () => [
|
|
41155
|
-
createSection.plain([
|
|
41156
|
-
createField.text("name", "Full Name", { required: true }),
|
|
41157
|
-
createField.email("email", "Email Address", { required: true }),
|
|
41158
|
-
createField.text("subject", "Subject", { required: true }),
|
|
41159
|
-
createField.textarea("message", "Message", {
|
|
41160
|
-
required: true,
|
|
41161
|
-
gridCols: 2
|
|
41162
|
-
})
|
|
41163
|
-
])
|
|
41164
|
-
],
|
|
41165
|
-
// Address form
|
|
41166
|
-
address: () => [
|
|
41167
|
-
createSection.card("Address Information", [
|
|
41168
|
-
createField.text("street", "Street Address", {
|
|
41169
|
-
required: true,
|
|
41170
|
-
gridCols: 2
|
|
41171
|
-
}),
|
|
41172
|
-
createField.text("city", "City", { required: true }),
|
|
41173
|
-
createField.text("state", "State/Province", { required: true }),
|
|
41174
|
-
createField.text("postalCode", "Postal Code", { required: true }),
|
|
41175
|
-
createField.select(
|
|
41176
|
-
"country",
|
|
41177
|
-
"Country",
|
|
41178
|
-
[
|
|
41179
|
-
{ label: "United States", value: "US" },
|
|
41180
|
-
{ label: "Canada", value: "CA" },
|
|
41181
|
-
{ label: "United Kingdom", value: "UK" }
|
|
41182
|
-
// Add more countries as needed
|
|
41183
|
-
],
|
|
41184
|
-
{ required: true }
|
|
41185
|
-
)
|
|
41186
|
-
])
|
|
41187
|
-
]
|
|
41188
|
-
};
|
|
41189
41198
|
const widthToClass = {
|
|
41190
41199
|
full: "max-w-none",
|
|
41191
41200
|
sm: "max-w-screen-sm",
|
|
@@ -41299,19 +41308,19 @@ function StackDialogRenderer(props2) {
|
|
|
41299
41308
|
const handleCloseDialog = (id) => () => {
|
|
41300
41309
|
props2.closeDialog(id);
|
|
41301
41310
|
};
|
|
41302
|
-
return props2.dialogs.map((dialog) => /* @__PURE__ */ jsx(
|
|
41311
|
+
return props2.dialogs.map((dialog, i2) => /* @__PURE__ */ jsx(
|
|
41303
41312
|
Dialog,
|
|
41304
41313
|
{
|
|
41305
|
-
open:
|
|
41306
|
-
onOpenChange:
|
|
41314
|
+
open: !!props2.dialogs[i2],
|
|
41315
|
+
onOpenChange: handleCloseDialog(dialog.id),
|
|
41307
41316
|
children: /* @__PURE__ */ jsx(
|
|
41308
|
-
DialogContent
|
|
41317
|
+
DialogContent,
|
|
41309
41318
|
{
|
|
41310
41319
|
onEscapeKeyDown: (e) => {
|
|
41311
|
-
if (
|
|
41320
|
+
if (dialog.closeOnEscapePressed === false) e.preventDefault();
|
|
41312
41321
|
},
|
|
41313
41322
|
onInteractOutside: (e) => {
|
|
41314
|
-
if (
|
|
41323
|
+
if (dialog.closeOnInteractOutside === false) e.preventDefault();
|
|
41315
41324
|
},
|
|
41316
41325
|
children: dialog.template
|
|
41317
41326
|
}
|
|
@@ -41340,7 +41349,8 @@ function StackDialogContextProvider(props2) {
|
|
|
41340
41349
|
const handleCloseDialog = useCallback((id) => {
|
|
41341
41350
|
setActiveDialogs((prev) => {
|
|
41342
41351
|
const clone2 = [...prev];
|
|
41343
|
-
clone2.splice(clone2.
|
|
41352
|
+
if (!id) clone2.splice(clone2.length - 1, 1);
|
|
41353
|
+
else clone2.splice(clone2.findIndex((d) => d.id === id));
|
|
41344
41354
|
return clone2;
|
|
41345
41355
|
});
|
|
41346
41356
|
}, [setActiveDialogs]);
|