@nextlyhq/plugin-form-builder 0.0.2-alpha.33 → 0.0.2-alpha.34
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/admin/index.css +28 -871
- package/dist/admin/index.css.map +1 -1
- package/dist/admin/index.js +226 -245
- package/dist/admin/index.js.map +1 -1
- package/dist/{chunk-ABNZFTQK.js → chunk-2LLUO3TV.js} +100 -139
- package/dist/chunk-2LLUO3TV.js.map +1 -0
- package/dist/components/index.js +1 -1
- package/dist/index.js +5 -2
- package/dist/index.js.map +1 -1
- package/dist/styles/form-builder.css +40 -1062
- package/dist/styles/submissions-filter.css +19 -20
- package/package.json +16 -13
- package/dist/chunk-ABNZFTQK.js.map +0 -1
package/dist/admin/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {
|
|
2
2
|
SubmissionDetail,
|
|
3
3
|
SubmissionList
|
|
4
|
-
} from "../chunk-
|
|
4
|
+
} from "../chunk-2LLUO3TV.js";
|
|
5
5
|
|
|
6
6
|
// src/admin/index.ts
|
|
7
7
|
import {
|
|
@@ -257,7 +257,7 @@ function ConditionalLogicEditor({
|
|
|
257
257
|
value: logic.action,
|
|
258
258
|
onValueChange: (value) => updateLogic({ action: value }),
|
|
259
259
|
children: [
|
|
260
|
-
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-[100px] h-9 bg-transparent border-input dark:bg-
|
|
260
|
+
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-[100px] h-9 bg-transparent border-input dark:bg-muted/50", children: /* @__PURE__ */ jsx2(SelectValue, { placeholder: "Show/Hide" }) }),
|
|
261
261
|
/* @__PURE__ */ jsxs2(SelectContent, { children: [
|
|
262
262
|
/* @__PURE__ */ jsx2(SelectItem, { value: "show", children: "Show" }),
|
|
263
263
|
/* @__PURE__ */ jsx2(SelectItem, { value: "hide", children: "Hide" })
|
|
@@ -272,7 +272,7 @@ function ConditionalLogicEditor({
|
|
|
272
272
|
value: logic.operator,
|
|
273
273
|
onValueChange: (value) => updateLogic({ operator: value }),
|
|
274
274
|
children: [
|
|
275
|
-
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-[80px] h-9 bg-transparent border-input dark:bg-
|
|
275
|
+
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-[80px] h-9 bg-transparent border-input dark:bg-muted/50", children: /* @__PURE__ */ jsx2(SelectValue, { placeholder: "All/Any" }) }),
|
|
276
276
|
/* @__PURE__ */ jsxs2(SelectContent, { children: [
|
|
277
277
|
/* @__PURE__ */ jsx2(SelectItem, { value: "AND", children: "All" }),
|
|
278
278
|
/* @__PURE__ */ jsx2(SelectItem, { value: "OR", children: "Any" })
|
|
@@ -282,10 +282,10 @@ function ConditionalLogicEditor({
|
|
|
282
282
|
),
|
|
283
283
|
/* @__PURE__ */ jsx2("span", { children: "of the following conditions are met:" })
|
|
284
284
|
] }),
|
|
285
|
-
/* @__PURE__ */ jsx2("div", { className: "space-y-3 pt-4", children: logic.conditions.length === 0 ? /* @__PURE__ */ jsx2("div", { className: "p-4 bg-
|
|
285
|
+
/* @__PURE__ */ jsx2("div", { className: "space-y-3 pt-4", children: logic.conditions.length === 0 ? /* @__PURE__ */ jsx2("div", { className: "p-4 bg-muted rounded-none border border-dashed border-primary/5 text-center text-xs text-muted-foreground", children: "No conditions defined. Add a condition to get started." }) : logic.conditions.map((condition, index) => /* @__PURE__ */ jsxs2(
|
|
286
286
|
"div",
|
|
287
287
|
{
|
|
288
|
-
className: "flex flex-col gap-2 p-3 rounded-none bg-
|
|
288
|
+
className: "flex flex-col gap-2 p-3 rounded-none bg-muted border border-primary/5 relative group",
|
|
289
289
|
children: [
|
|
290
290
|
/* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-1 gap-2", children: [
|
|
291
291
|
/* @__PURE__ */ jsxs2(
|
|
@@ -294,7 +294,7 @@ function ConditionalLogicEditor({
|
|
|
294
294
|
value: condition.field,
|
|
295
295
|
onValueChange: (value) => handleUpdateCondition(index, { field: value }),
|
|
296
296
|
children: [
|
|
297
|
-
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-full bg-transparent border-input dark:bg-
|
|
297
|
+
/* @__PURE__ */ jsx2(SelectTrigger, { className: "w-full bg-transparent border-input dark:bg-muted/50", children: /* @__PURE__ */ jsx2(SelectValue, { placeholder: "Select field" }) }),
|
|
298
298
|
/* @__PURE__ */ jsx2(SelectContent, { children: availableFields.map((f) => /* @__PURE__ */ jsx2(SelectItem, { value: f.name, children: f.label || f.name }, f.name)) })
|
|
299
299
|
]
|
|
300
300
|
}
|
|
@@ -308,7 +308,7 @@ function ConditionalLogicEditor({
|
|
|
308
308
|
comparison: value
|
|
309
309
|
}),
|
|
310
310
|
children: [
|
|
311
|
-
/* @__PURE__ */ jsx2(SelectTrigger, { className: "flex-1 h-9 bg-transparent border-input dark:bg-
|
|
311
|
+
/* @__PURE__ */ jsx2(SelectTrigger, { className: "flex-1 h-9 bg-transparent border-input dark:bg-muted/50", children: /* @__PURE__ */ jsx2(SelectValue, { placeholder: "Compare operator" }) }),
|
|
312
312
|
/* @__PURE__ */ jsx2(SelectContent, { children: COMPARISON_OPERATORS.map((op) => /* @__PURE__ */ jsx2(SelectItem, { value: op.value, children: op.label }, op.value)) })
|
|
313
313
|
]
|
|
314
314
|
}
|
|
@@ -353,7 +353,7 @@ function ConditionalLogicEditor({
|
|
|
353
353
|
className: "w-full mt-4 border-dashed",
|
|
354
354
|
children: "+ Add Condition"
|
|
355
355
|
}
|
|
356
|
-
) : /* @__PURE__ */ jsx2("p", { className: "mt-4 text-center text-xs text-
|
|
356
|
+
) : /* @__PURE__ */ jsx2("p", { className: "mt-4 text-center text-xs text-warning font-medium bg-warning/10 p-2 rounded-none border border-warning/20", children: "Add more fields to the form to create conditions." })
|
|
357
357
|
] })
|
|
358
358
|
] });
|
|
359
359
|
}
|
|
@@ -392,7 +392,7 @@ function GeneralTab({
|
|
|
392
392
|
className: "bg-transparent"
|
|
393
393
|
}
|
|
394
394
|
),
|
|
395
|
-
hasConditionalReferences && /* @__PURE__ */ jsx3("p", { className: "text-[11px] text-
|
|
395
|
+
hasConditionalReferences && /* @__PURE__ */ jsx3("p", { className: "text-[11px] text-warning font-medium", children: "\u26A0\uFE0F Changing this may break conditional logic referencing this field" })
|
|
396
396
|
] }),
|
|
397
397
|
field.type !== "hidden" && /* @__PURE__ */ jsxs3("div", { className: "space-y-2", children: [
|
|
398
398
|
/* @__PURE__ */ jsx3(
|
|
@@ -492,7 +492,7 @@ function GeneralTab({
|
|
|
492
492
|
}
|
|
493
493
|
}),
|
|
494
494
|
children: [
|
|
495
|
-
/* @__PURE__ */ jsx3(SelectTrigger2, { className: "w-full bg-transparent border-input dark:bg-
|
|
495
|
+
/* @__PURE__ */ jsx3(SelectTrigger2, { className: "w-full bg-transparent border-input dark:bg-muted/50", children: /* @__PURE__ */ jsx3(SelectValue2, { placeholder: "Select width" }) }),
|
|
496
496
|
/* @__PURE__ */ jsxs3(SelectContent2, { children: [
|
|
497
497
|
/* @__PURE__ */ jsx3(SelectItem2, { value: "100%", children: "Full Width (100%)" }),
|
|
498
498
|
/* @__PURE__ */ jsx3(SelectItem2, { value: "75%", children: "Three Quarters (75%)" }),
|
|
@@ -747,7 +747,7 @@ function OptionsEditor({
|
|
|
747
747
|
description: "List of choices available for this field."
|
|
748
748
|
}
|
|
749
749
|
),
|
|
750
|
-
options.length === 0 ? /* @__PURE__ */ jsx3("div", { className: "p-4 bg-
|
|
750
|
+
options.length === 0 ? /* @__PURE__ */ jsx3("div", { className: "p-4 bg-muted rounded-none border border-dashed border-primary/5 text-center text-xs text-muted-foreground", children: "No options defined. Add an option to get started." }) : /* @__PURE__ */ jsx3("div", { className: "space-y-2", children: options.map((opt, index) => /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-2 group", children: [
|
|
751
751
|
/* @__PURE__ */ jsx3(
|
|
752
752
|
Input2,
|
|
753
753
|
{
|
|
@@ -972,7 +972,7 @@ function ValidationTab({
|
|
|
972
972
|
}
|
|
973
973
|
)
|
|
974
974
|
] }),
|
|
975
|
-
(field.type === "checkbox" || field.type === "hidden") && /* @__PURE__ */ jsx3("div", { className: "p-3 bg-
|
|
975
|
+
(field.type === "checkbox" || field.type === "hidden") && /* @__PURE__ */ jsx3("div", { className: "p-3 bg-muted rounded-none text-xs text-muted-foreground text-center border border-dashed border-primary/5", children: "No additional validation options for this field type." })
|
|
976
976
|
] });
|
|
977
977
|
}
|
|
978
978
|
function FieldEditor({
|
|
@@ -1013,7 +1013,7 @@ function FieldEditor({
|
|
|
1013
1013
|
onValueChange: setActiveTab,
|
|
1014
1014
|
className: "flex-1 flex flex-col",
|
|
1015
1015
|
children: [
|
|
1016
|
-
/* @__PURE__ */ jsx3("div", { className: "border-b bg-
|
|
1016
|
+
/* @__PURE__ */ jsx3("div", { className: "border-b bg-muted border-primary/5", children: /* @__PURE__ */ jsxs3(TabsList, { className: "w-full justify-start gap-0", children: [
|
|
1017
1017
|
/* @__PURE__ */ jsx3(
|
|
1018
1018
|
TabsTrigger,
|
|
1019
1019
|
{
|
|
@@ -1518,7 +1518,7 @@ function DraggableFieldItem({
|
|
|
1518
1518
|
type: "button",
|
|
1519
1519
|
onClick: () => onAdd(type),
|
|
1520
1520
|
title: description,
|
|
1521
|
-
className: `flex items-center gap-3 w-full px-2 py-2 rounded-none text-left group hover:bg-
|
|
1521
|
+
className: `flex items-center gap-3 w-full px-2 py-2 rounded-none text-left group hover:bg-muted transition-all duration-150 cursor-grab active:cursor-grabbing active:scale-[0.98] ${isDragging ? "opacity-50 bg-primary/5" : ""}`,
|
|
1522
1522
|
...attributes,
|
|
1523
1523
|
...listeners,
|
|
1524
1524
|
children: [
|
|
@@ -1527,8 +1527,7 @@ function DraggableFieldItem({
|
|
|
1527
1527
|
{
|
|
1528
1528
|
className: "shrink-0 flex items-center justify-center w-9 h-9 bg-primary/5 text-primary dark:bg-primary/20 dark:text-primary-foreground/80",
|
|
1529
1529
|
style: {
|
|
1530
|
-
|
|
1531
|
-
border: "1px solid hsl(var(--primary) / 0.25)"
|
|
1530
|
+
border: "1px solid color-mix(in srgb, var(--primary) 25%, transparent)"
|
|
1532
1531
|
},
|
|
1533
1532
|
children: /* @__PURE__ */ jsx5(
|
|
1534
1533
|
"svg",
|
|
@@ -1574,7 +1573,7 @@ function CategorySection({
|
|
|
1574
1573
|
className: `h-3 w-3 transition-transform duration-200 shrink-0 ${isOpen ? "rotate-0" : "-rotate-90"}`,
|
|
1575
1574
|
viewBox: "0 0 24 24",
|
|
1576
1575
|
fill: "none",
|
|
1577
|
-
stroke: "
|
|
1576
|
+
stroke: "currentColor",
|
|
1578
1577
|
strokeWidth: "2",
|
|
1579
1578
|
children: /* @__PURE__ */ jsx5("polyline", { points: "6 9 12 15 18 9" })
|
|
1580
1579
|
}
|
|
@@ -1583,7 +1582,7 @@ function CategorySection({
|
|
|
1583
1582
|
"span",
|
|
1584
1583
|
{
|
|
1585
1584
|
className: "text-[13px] font-semibold tracking-widest uppercase",
|
|
1586
|
-
style: { color: "
|
|
1585
|
+
style: { color: "var(--muted-foreground)" },
|
|
1587
1586
|
children: name
|
|
1588
1587
|
}
|
|
1589
1588
|
),
|
|
@@ -1592,10 +1591,9 @@ function CategorySection({
|
|
|
1592
1591
|
{
|
|
1593
1592
|
className: "ml-auto text-[10px] font-medium leading-none",
|
|
1594
1593
|
style: {
|
|
1595
|
-
background: "
|
|
1596
|
-
color: "
|
|
1597
|
-
padding: "2px 6px"
|
|
1598
|
-
borderRadius: "4px"
|
|
1594
|
+
background: "var(--muted)",
|
|
1595
|
+
color: "var(--muted-foreground)",
|
|
1596
|
+
padding: "2px 6px"
|
|
1599
1597
|
},
|
|
1600
1598
|
children: types.length
|
|
1601
1599
|
}
|
|
@@ -1610,7 +1608,7 @@ function CategorySection({
|
|
|
1610
1608
|
style: {
|
|
1611
1609
|
marginLeft: "10px",
|
|
1612
1610
|
paddingLeft: "10px",
|
|
1613
|
-
borderLeft: "1px solid
|
|
1611
|
+
borderLeft: "1px solid var(--border)"
|
|
1614
1612
|
},
|
|
1615
1613
|
children: types.map((field) => /* @__PURE__ */ jsx5(DraggableFieldItem, { ...field, onAdd }, field.type))
|
|
1616
1614
|
}
|
|
@@ -1673,8 +1671,8 @@ function FieldLibrary() {
|
|
|
1673
1671
|
placeholder: `Search ${activeFieldCount} field types...`,
|
|
1674
1672
|
value: searchQuery,
|
|
1675
1673
|
onChange: (e) => setSearchQuery(e.target.value),
|
|
1676
|
-
className: "text-[13px] pl-9 flex h-9 w-full rounded-none border border-input bg-
|
|
1677
|
-
style: {
|
|
1674
|
+
className: "text-[13px] pl-9 flex h-9 w-full rounded-none border border-input bg-muted px-3 py-1 text-sm shadow-none transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring",
|
|
1675
|
+
style: { height: "38px" }
|
|
1678
1676
|
}
|
|
1679
1677
|
)
|
|
1680
1678
|
] }) }),
|
|
@@ -1826,10 +1824,9 @@ function SortableFieldItem({
|
|
|
1826
1824
|
/* @__PURE__ */ jsx6(
|
|
1827
1825
|
"div",
|
|
1828
1826
|
{
|
|
1829
|
-
className: "shrink-0 flex items-center justify-center w-9 h-9 bg-primary/5 text-primary dark:bg-primary/20 dark:text-
|
|
1827
|
+
className: "shrink-0 flex items-center justify-center w-9 h-9 bg-primary/5 text-primary dark:bg-primary/20 dark:text-foreground mr-1",
|
|
1830
1828
|
style: {
|
|
1831
|
-
|
|
1832
|
-
border: "1px solid hsl(var(--primary) / 0.25)"
|
|
1829
|
+
border: "1px solid color-mix(in srgb, var(--primary) 25%, transparent)"
|
|
1833
1830
|
},
|
|
1834
1831
|
children: /* @__PURE__ */ jsx6(
|
|
1835
1832
|
"svg",
|
|
@@ -1850,7 +1847,7 @@ function SortableFieldItem({
|
|
|
1850
1847
|
/* @__PURE__ */ jsx6("span", { className: "text-sm font-medium text-foreground truncate", children: field.label || field.name || "Unnamed Field" }),
|
|
1851
1848
|
/* @__PURE__ */ jsx6("span", { className: "text-muted-foreground/40 text-xs shrink-0", children: "\u2022" }),
|
|
1852
1849
|
/* @__PURE__ */ jsx6("span", { className: "text-[10px] font-medium shrink-0 px-2 py-0 leading-5 rounded-full border border-primary/5 bg-primary/5 text-muted-foreground capitalize", children: typeLabel }),
|
|
1853
|
-
field.required && /* @__PURE__ */ jsx6("span", { className: "text-[10px] px-2 py-0 leading-5 bg-
|
|
1850
|
+
field.required && /* @__PURE__ */ jsx6("span", { className: "text-[10px] px-2 py-0 leading-5 bg-muted text-muted-foreground font-normal rounded-full border border-border shrink-0", children: "Required" })
|
|
1854
1851
|
] }),
|
|
1855
1852
|
/* @__PURE__ */ jsx6(
|
|
1856
1853
|
"button",
|
|
@@ -1898,7 +1895,7 @@ function FormCanvas({
|
|
|
1898
1895
|
{
|
|
1899
1896
|
ref: setNodeRef,
|
|
1900
1897
|
id: "canvas-drop-zone",
|
|
1901
|
-
className: `min-h-[320px] flex flex-col items-center justify-center border-2 border-dashed rounded-none transition-all duration-200 ${isOver ? "border-primary bg-primary/5" : "border-primary/5 bg-
|
|
1898
|
+
className: `min-h-[320px] flex flex-col items-center justify-center border-2 border-dashed rounded-none transition-all duration-200 ${isOver ? "border-primary bg-primary/5" : "border-primary/5 bg-muted"}`,
|
|
1902
1899
|
children: /* @__PURE__ */ jsxs5("div", { className: "text-center px-6 py-12", children: [
|
|
1903
1900
|
/* @__PURE__ */ jsx6(
|
|
1904
1901
|
"div",
|
|
@@ -2080,7 +2077,7 @@ function IntegrationModal({
|
|
|
2080
2077
|
className: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm flex items-center justify-center p-4 sm:p-6",
|
|
2081
2078
|
ref: overlayRef,
|
|
2082
2079
|
onClick: handleOverlayClick,
|
|
2083
|
-
children: /* @__PURE__ */ jsxs6("div", { className: "bg-background rounded-none border border-primary/5
|
|
2080
|
+
children: /* @__PURE__ */ jsxs6("div", { className: "bg-background rounded-none border border-primary/5 w-full max-w-lg overflow-hidden flex flex-col max-h-[90vh]", children: [
|
|
2084
2081
|
/* @__PURE__ */ jsxs6("div", { className: "px-6 py-5 border-b border-primary/5 flex items-center justify-between sticky top-0 bg-background z-10", children: [
|
|
2085
2082
|
/* @__PURE__ */ jsx7("h3", { className: "text-lg font-semibold text-foreground", children: isEditing ? "Edit Email Integration" : "Add Email Integration" }),
|
|
2086
2083
|
/* @__PURE__ */ jsx7(
|
|
@@ -2364,11 +2361,11 @@ function IntegrationModal({
|
|
|
2364
2361
|
onChange: (e) => update("enabled", e.target.checked)
|
|
2365
2362
|
}
|
|
2366
2363
|
),
|
|
2367
|
-
/* @__PURE__ */ jsx7("div", { className: "w-9 h-5 bg-primary/5 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-primary/20 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-
|
|
2364
|
+
/* @__PURE__ */ jsx7("div", { className: "w-9 h-5 bg-primary/5 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-primary/20 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-background after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-background after:border-primary/5 after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-primary border border-primary/5" })
|
|
2368
2365
|
] })
|
|
2369
2366
|
] })
|
|
2370
2367
|
] }),
|
|
2371
|
-
/* @__PURE__ */ jsxs6("div", { className: "px-6 py-4 border-t border-primary/5 bg-
|
|
2368
|
+
/* @__PURE__ */ jsxs6("div", { className: "px-6 py-4 border-t border-primary/5 bg-muted flex items-center justify-end gap-3 rounded-none", children: [
|
|
2372
2369
|
/* @__PURE__ */ jsx7(Button3, { type: "button", variant: "outline", onClick: onCancel, children: "Cancel" }),
|
|
2373
2370
|
/* @__PURE__ */ jsx7(Button3, { type: "button", onClick: handleSubmit, children: isEditing ? "Save Changes" : "Add Integration" })
|
|
2374
2371
|
] })
|
|
@@ -2431,7 +2428,7 @@ function FormNotificationsTab() {
|
|
|
2431
2428
|
] }),
|
|
2432
2429
|
/* @__PURE__ */ jsx7(Button3, { type: "button", onClick: openAddModal, children: "+ Add Integration" })
|
|
2433
2430
|
] }),
|
|
2434
|
-
notifications.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center justify-center p-12 mt-6 border-2 border-dashed border-primary/5 rounded-none bg-
|
|
2431
|
+
notifications.length === 0 ? /* @__PURE__ */ jsxs6("div", { className: "flex flex-col items-center justify-center p-12 mt-6 border-2 border-dashed border-primary/5 rounded-none bg-muted", children: [
|
|
2435
2432
|
/* @__PURE__ */ jsx7("div", { className: "flex items-center justify-center w-12 h-12 rounded-none border border-primary/5 bg-background mb-4 text-primary", children: /* @__PURE__ */ jsxs6(
|
|
2436
2433
|
"svg",
|
|
2437
2434
|
{
|
|
@@ -2481,7 +2478,7 @@ import { Input as Input4, Button as Button4 } from "@nextlyhq/ui";
|
|
|
2481
2478
|
import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
2482
2479
|
function FormPreview({ fields, formData }) {
|
|
2483
2480
|
if (fields.length === 0) {
|
|
2484
|
-
return /* @__PURE__ */ jsxs7("div", { className: "flex flex-col items-center justify-center p-12 bg-
|
|
2481
|
+
return /* @__PURE__ */ jsxs7("div", { className: "flex flex-col items-center justify-center p-12 bg-muted rounded-none border-2 border-dashed border-primary/5 text-center", children: [
|
|
2485
2482
|
/* @__PURE__ */ jsx8("div", { className: "text-4xl mb-3", children: "\u{1F4DD}" }),
|
|
2486
2483
|
/* @__PURE__ */ jsx8("p", { className: "text-sm font-medium text-muted-foreground", children: "Add some fields to preview your form" })
|
|
2487
2484
|
] });
|
|
@@ -2582,7 +2579,7 @@ function renderFieldPreview(field) {
|
|
|
2582
2579
|
case "time":
|
|
2583
2580
|
return /* @__PURE__ */ jsx8(Input4, { type: "time", disabled: true });
|
|
2584
2581
|
case "hidden":
|
|
2585
|
-
return /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 p-3 text-sm text-muted-foreground bg-
|
|
2582
|
+
return /* @__PURE__ */ jsxs7("div", { className: "flex items-center gap-2 p-3 text-sm text-muted-foreground bg-muted border-2 border-dashed border-primary/5 rounded-none", children: [
|
|
2586
2583
|
/* @__PURE__ */ jsx8("span", { className: "text-lg", children: "\u{1F441}\uFE0F" }),
|
|
2587
2584
|
/* @__PURE__ */ jsx8("span", { children: "Hidden field" })
|
|
2588
2585
|
] });
|
|
@@ -3051,7 +3048,7 @@ function FormBuilderViewInner({
|
|
|
3051
3048
|
/* @__PURE__ */ jsx10("p", { className: "text-sm text-muted-foreground mt-1", children: isCreating ? "Design a new form with drag-and-drop fields." : "Modify your form fields and settings." })
|
|
3052
3049
|
] }),
|
|
3053
3050
|
/* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2 shrink-0", children: [
|
|
3054
|
-
isDirty && /* @__PURE__ */ jsx10("span", { className: "text-xs font-medium text-
|
|
3051
|
+
isDirty && /* @__PURE__ */ jsx10("span", { className: "text-xs font-medium text-warning bg-warning/10 border border-warning/20 px-2.5 py-1 rounded-none whitespace-nowrap", children: "Unsaved changes" }),
|
|
3055
3052
|
/* @__PURE__ */ jsx10(
|
|
3056
3053
|
Button5,
|
|
3057
3054
|
{
|
|
@@ -3109,226 +3106,210 @@ function FormBuilderViewInner({
|
|
|
3109
3106
|
)
|
|
3110
3107
|
] })
|
|
3111
3108
|
] }),
|
|
3112
|
-
/* @__PURE__ */ jsxs9(
|
|
3113
|
-
"div",
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
|
|
3120
|
-
|
|
3121
|
-
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
|
|
3131
|
-
),
|
|
3132
|
-
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
|
|
3136
|
-
|
|
3137
|
-
|
|
3138
|
-
|
|
3139
|
-
|
|
3140
|
-
|
|
3141
|
-
|
|
3142
|
-
|
|
3143
|
-
|
|
3144
|
-
|
|
3145
|
-
|
|
3146
|
-
"label",
|
|
3147
|
-
{
|
|
3148
|
-
htmlFor: "form-slug",
|
|
3149
|
-
className: "text-sm font-medium text-foreground",
|
|
3150
|
-
children: "Slug"
|
|
3151
|
-
}
|
|
3152
|
-
),
|
|
3153
|
-
/* @__PURE__ */ jsx10(
|
|
3154
|
-
Input6,
|
|
3155
|
-
{
|
|
3156
|
-
id: "form-slug",
|
|
3157
|
-
type: "text",
|
|
3158
|
-
value: formData.slug || "",
|
|
3159
|
-
onChange: (e) => updateFormData({ slug: e.target.value }),
|
|
3160
|
-
placeholder: "e.g., contact-form",
|
|
3161
|
-
className: "bg-transparent placeholder:text-muted-foreground/50"
|
|
3162
|
-
}
|
|
3163
|
-
)
|
|
3164
|
-
] }),
|
|
3165
|
-
/* @__PURE__ */ jsxs9("div", { className: "w-36 space-y-1.5", children: [
|
|
3166
|
-
/* @__PURE__ */ jsx10(
|
|
3167
|
-
"label",
|
|
3168
|
-
{
|
|
3169
|
-
htmlFor: "form-status",
|
|
3170
|
-
className: "text-sm font-medium text-foreground",
|
|
3171
|
-
children: "Status"
|
|
3172
|
-
}
|
|
3173
|
-
),
|
|
3174
|
-
/* @__PURE__ */ jsxs9(
|
|
3175
|
-
Select3,
|
|
3176
|
-
{
|
|
3177
|
-
value: formData.status || "draft",
|
|
3178
|
-
onValueChange: (value) => updateFormData({
|
|
3179
|
-
status: value
|
|
3180
|
-
}),
|
|
3181
|
-
children: [
|
|
3182
|
-
/* @__PURE__ */ jsx10(SelectTrigger3, { id: "form-status", className: "bg-transparent", children: /* @__PURE__ */ jsx10(SelectValue3, { placeholder: "Status" }) }),
|
|
3183
|
-
/* @__PURE__ */ jsxs9(SelectContent3, { children: [
|
|
3184
|
-
/* @__PURE__ */ jsx10(SelectItem3, { value: "draft", children: "Draft" }),
|
|
3185
|
-
/* @__PURE__ */ jsx10(SelectItem3, { value: "published", children: "Published" }),
|
|
3186
|
-
/* @__PURE__ */ jsx10(SelectItem3, { value: "closed", children: "Closed" })
|
|
3187
|
-
] })
|
|
3188
|
-
]
|
|
3189
|
-
}
|
|
3190
|
-
)
|
|
3191
|
-
] })
|
|
3192
|
-
] }),
|
|
3109
|
+
/* @__PURE__ */ jsxs9("div", { className: "fb-builder-shell flex border border-border bg-background overflow-hidden", children: [
|
|
3110
|
+
/* @__PURE__ */ jsx10("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxs9("div", { className: "w-full px-8 pt-8 pb-12 space-y-6", children: [
|
|
3111
|
+
/* @__PURE__ */ jsxs9("div", { className: "bg-background -mx-8 px-8 border-b border-border space-y-4", children: [
|
|
3112
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex flex-wrap gap-4", children: [
|
|
3113
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex-1 min-w-[200px] max-w-sm space-y-1.5", children: [
|
|
3114
|
+
/* @__PURE__ */ jsx10(
|
|
3115
|
+
"label",
|
|
3116
|
+
{
|
|
3117
|
+
htmlFor: "form-name",
|
|
3118
|
+
className: "text-sm font-medium text-foreground",
|
|
3119
|
+
children: "Form Name"
|
|
3120
|
+
}
|
|
3121
|
+
),
|
|
3122
|
+
/* @__PURE__ */ jsx10(
|
|
3123
|
+
Input6,
|
|
3124
|
+
{
|
|
3125
|
+
id: "form-name",
|
|
3126
|
+
type: "text",
|
|
3127
|
+
value: formData.name || "",
|
|
3128
|
+
onChange: (e) => handleNameChange(e.target.value),
|
|
3129
|
+
placeholder: "e.g., Contact Form",
|
|
3130
|
+
className: "bg-transparent"
|
|
3131
|
+
}
|
|
3132
|
+
)
|
|
3133
|
+
] }),
|
|
3134
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex-1 min-w-[160px] max-w-xs space-y-1.5", children: [
|
|
3135
|
+
/* @__PURE__ */ jsx10(
|
|
3136
|
+
"label",
|
|
3137
|
+
{
|
|
3138
|
+
htmlFor: "form-slug",
|
|
3139
|
+
className: "text-sm font-medium text-foreground",
|
|
3140
|
+
children: "Slug"
|
|
3141
|
+
}
|
|
3142
|
+
),
|
|
3193
3143
|
/* @__PURE__ */ jsx10(
|
|
3194
|
-
|
|
3144
|
+
Input6,
|
|
3195
3145
|
{
|
|
3196
|
-
|
|
3197
|
-
|
|
3198
|
-
|
|
3199
|
-
|
|
3200
|
-
|
|
3201
|
-
|
|
3202
|
-
style: {
|
|
3203
|
-
borderBottomColor: activeTab === tab.value ? "hsl(var(--primary))" : "transparent"
|
|
3204
|
-
},
|
|
3205
|
-
className: "border-b-2 relative -mb-0.5 data-[state=active]:text-primary data-[state=inactive]:text-muted-foreground hover:text-primary hover:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/20 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",
|
|
3206
|
-
children: [
|
|
3207
|
-
tab.label,
|
|
3208
|
-
tab.count !== null && /* @__PURE__ */ jsx10(
|
|
3209
|
-
"span",
|
|
3210
|
-
{
|
|
3211
|
-
className: `inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-semibold rounded-none ml-2 transition-colors ${activeTab === tab.value ? "bg-primary/5 text-primary" : "bg-primary/5 text-muted-foreground"}`,
|
|
3212
|
-
children: tab.count
|
|
3213
|
-
}
|
|
3214
|
-
)
|
|
3215
|
-
]
|
|
3216
|
-
},
|
|
3217
|
-
tab.value
|
|
3218
|
-
)) })
|
|
3146
|
+
id: "form-slug",
|
|
3147
|
+
type: "text",
|
|
3148
|
+
value: formData.slug || "",
|
|
3149
|
+
onChange: (e) => updateFormData({ slug: e.target.value }),
|
|
3150
|
+
placeholder: "e.g., contact-form",
|
|
3151
|
+
className: "bg-transparent placeholder:text-muted-foreground/50"
|
|
3219
3152
|
}
|
|
3220
3153
|
)
|
|
3221
3154
|
] }),
|
|
3222
|
-
|
|
3223
|
-
|
|
3155
|
+
/* @__PURE__ */ jsxs9("div", { className: "w-36 space-y-1.5", children: [
|
|
3156
|
+
/* @__PURE__ */ jsx10(
|
|
3157
|
+
"label",
|
|
3158
|
+
{
|
|
3159
|
+
htmlFor: "form-status",
|
|
3160
|
+
className: "text-sm font-medium text-foreground",
|
|
3161
|
+
children: "Status"
|
|
3162
|
+
}
|
|
3163
|
+
),
|
|
3164
|
+
/* @__PURE__ */ jsxs9(
|
|
3165
|
+
Select3,
|
|
3166
|
+
{
|
|
3167
|
+
value: formData.status || "draft",
|
|
3168
|
+
onValueChange: (value) => updateFormData({
|
|
3169
|
+
status: value
|
|
3170
|
+
}),
|
|
3171
|
+
children: [
|
|
3172
|
+
/* @__PURE__ */ jsx10(SelectTrigger3, { id: "form-status", className: "bg-transparent", children: /* @__PURE__ */ jsx10(SelectValue3, { placeholder: "Status" }) }),
|
|
3173
|
+
/* @__PURE__ */ jsxs9(SelectContent3, { children: [
|
|
3174
|
+
/* @__PURE__ */ jsx10(SelectItem3, { value: "draft", children: "Draft" }),
|
|
3175
|
+
/* @__PURE__ */ jsx10(SelectItem3, { value: "published", children: "Published" }),
|
|
3176
|
+
/* @__PURE__ */ jsx10(SelectItem3, { value: "closed", children: "Closed" })
|
|
3177
|
+
] })
|
|
3178
|
+
]
|
|
3179
|
+
}
|
|
3180
|
+
)
|
|
3181
|
+
] })
|
|
3182
|
+
] }),
|
|
3183
|
+
/* @__PURE__ */ jsx10(
|
|
3184
|
+
Tabs3,
|
|
3185
|
+
{
|
|
3186
|
+
value: activeTab,
|
|
3187
|
+
onValueChange: (v) => setActiveTab(v),
|
|
3188
|
+
children: /* @__PURE__ */ jsx10(TabsList3, { className: "bg-transparent justify-start gap-0 -mb-px border-b-0 max-w-full overflow-x-auto", children: mainTabs.map((tab) => /* @__PURE__ */ jsxs9(
|
|
3189
|
+
TabsTrigger3,
|
|
3190
|
+
{
|
|
3191
|
+
value: tab.value,
|
|
3192
|
+
style: {
|
|
3193
|
+
borderBottomColor: activeTab === tab.value ? "var(--primary)" : "transparent"
|
|
3194
|
+
},
|
|
3195
|
+
className: "shrink-0 whitespace-nowrap border-b-2 relative -mb-0.5 data-[state=active]:text-primary data-[state=inactive]:text-muted-foreground hover:text-primary hover:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/20 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer",
|
|
3196
|
+
children: [
|
|
3197
|
+
tab.label,
|
|
3198
|
+
tab.count !== null && /* @__PURE__ */ jsx10(
|
|
3199
|
+
"span",
|
|
3200
|
+
{
|
|
3201
|
+
className: `inline-flex items-center justify-center min-w-[18px] h-[18px] px-1 text-[10px] font-semibold rounded-none ml-2 transition-colors ${activeTab === tab.value ? "bg-primary/5 text-primary" : "bg-primary/5 text-muted-foreground"}`,
|
|
3202
|
+
children: tab.count
|
|
3203
|
+
}
|
|
3204
|
+
)
|
|
3205
|
+
]
|
|
3206
|
+
},
|
|
3207
|
+
tab.value
|
|
3208
|
+
)) })
|
|
3209
|
+
}
|
|
3210
|
+
)
|
|
3211
|
+
] }),
|
|
3212
|
+
activeTab === "builder" && /* @__PURE__ */ jsx10("div", { children: /* @__PURE__ */ jsx10(
|
|
3213
|
+
SortableContext,
|
|
3214
|
+
{
|
|
3215
|
+
items: fields.map((f) => f.name),
|
|
3216
|
+
strategy: verticalListSortingStrategy,
|
|
3217
|
+
children: /* @__PURE__ */ jsx10(
|
|
3218
|
+
FormCanvas,
|
|
3224
3219
|
{
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
|
|
3220
|
+
fields,
|
|
3221
|
+
selectedFieldId,
|
|
3222
|
+
onFieldSelect: handleFieldSelect,
|
|
3223
|
+
onFieldDelete: deleteField
|
|
3224
|
+
}
|
|
3225
|
+
)
|
|
3226
|
+
}
|
|
3227
|
+
) }),
|
|
3228
|
+
activeTab === "preview" && /* @__PURE__ */ jsx10(FormPreview, { fields, formData }),
|
|
3229
|
+
activeTab === "settings" && /* @__PURE__ */ jsx10("div", { className: "w-full", children: /* @__PURE__ */ jsx10(FormSettingsTab, {}) }),
|
|
3230
|
+
activeTab === "notifications" && /* @__PURE__ */ jsx10("div", { className: "w-full", children: /* @__PURE__ */ jsx10(FormNotificationsTab, {}) }),
|
|
3231
|
+
saveError && /* @__PURE__ */ jsx10("div", { className: "p-3 text-sm text-destructive bg-destructive/10 border border-destructive/20 rounded-none", children: saveError })
|
|
3232
|
+
] }) }),
|
|
3233
|
+
activeTab === "builder" && /* @__PURE__ */ jsxs9("div", { className: "fb-builder-panel shrink-0 border-l border-border bg-background flex flex-col", children: [
|
|
3234
|
+
/* @__PURE__ */ jsx10(
|
|
3235
|
+
"div",
|
|
3236
|
+
{
|
|
3237
|
+
className: "shrink-0 grid grid-cols-2 gap-1.5 px-3 py-2.5 border-b border-border",
|
|
3238
|
+
style: { minHeight: "52px" },
|
|
3239
|
+
children: [
|
|
3240
|
+
{
|
|
3241
|
+
value: "add",
|
|
3242
|
+
label: "Add Fields",
|
|
3243
|
+
disabled: false,
|
|
3244
|
+
icon: /* @__PURE__ */ jsxs9(
|
|
3245
|
+
"svg",
|
|
3229
3246
|
{
|
|
3230
|
-
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3247
|
+
className: "h-3 w-3 shrink-0",
|
|
3248
|
+
viewBox: "0 0 24 24",
|
|
3249
|
+
fill: "none",
|
|
3250
|
+
stroke: "currentColor",
|
|
3251
|
+
strokeWidth: "2",
|
|
3252
|
+
strokeLinecap: "round",
|
|
3253
|
+
strokeLinejoin: "round",
|
|
3254
|
+
children: [
|
|
3255
|
+
/* @__PURE__ */ jsx10("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
|
|
3256
|
+
/* @__PURE__ */ jsx10("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
|
|
3257
|
+
]
|
|
3234
3258
|
}
|
|
3235
3259
|
)
|
|
3260
|
+
},
|
|
3261
|
+
{
|
|
3262
|
+
value: "properties",
|
|
3263
|
+
label: "Properties",
|
|
3264
|
+
disabled: !hasSelectedField,
|
|
3265
|
+
icon: /* @__PURE__ */ jsx10(SlidersIcon, {})
|
|
3236
3266
|
}
|
|
3237
|
-
)
|
|
3238
|
-
|
|
3239
|
-
|
|
3240
|
-
|
|
3241
|
-
|
|
3242
|
-
|
|
3243
|
-
|
|
3244
|
-
|
|
3267
|
+
].map((tab) => {
|
|
3268
|
+
const isActive = sidebarTab === tab.value;
|
|
3269
|
+
return /* @__PURE__ */ jsxs9(
|
|
3270
|
+
"button",
|
|
3271
|
+
{
|
|
3272
|
+
type: "button",
|
|
3273
|
+
disabled: tab.disabled,
|
|
3274
|
+
onClick: () => !tab.disabled && setSidebarTab(tab.value),
|
|
3275
|
+
className: [
|
|
3276
|
+
"flex items-center justify-center gap-1.5 w-full text-[13px] font-medium transition-all duration-150 border rounded-none select-none",
|
|
3277
|
+
"disabled:opacity-40 disabled:cursor-not-allowed",
|
|
3278
|
+
isActive ? "bg-primary/5 text-primary border-primary/30 cursor-pointer" : "bg-transparent border-border text-muted-foreground hover:text-foreground hover:bg-muted cursor-pointer"
|
|
3279
|
+
].join(" "),
|
|
3280
|
+
style: { padding: "8px 12px" },
|
|
3281
|
+
children: [
|
|
3282
|
+
tab.icon,
|
|
3283
|
+
tab.label
|
|
3284
|
+
]
|
|
3285
|
+
},
|
|
3286
|
+
tab.value
|
|
3287
|
+
);
|
|
3288
|
+
})
|
|
3289
|
+
}
|
|
3290
|
+
),
|
|
3291
|
+
/* @__PURE__ */ jsxs9("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
3292
|
+
sidebarTab === "add" && /* @__PURE__ */ jsx10("div", { className: "flex-1 flex flex-col", children: /* @__PURE__ */ jsx10(FieldLibrary, {}) }),
|
|
3293
|
+
sidebarTab === "properties" && /* @__PURE__ */ jsx10("div", { className: "flex-1 flex flex-col relative", children: selectedField ? /* @__PURE__ */ jsx10(
|
|
3294
|
+
FieldEditor,
|
|
3245
3295
|
{
|
|
3246
|
-
|
|
3247
|
-
|
|
3248
|
-
|
|
3249
|
-
|
|
3250
|
-
|
|
3251
|
-
|
|
3252
|
-
|
|
3253
|
-
|
|
3254
|
-
children: [
|
|
3255
|
-
{
|
|
3256
|
-
value: "add",
|
|
3257
|
-
label: "Add Fields",
|
|
3258
|
-
disabled: false,
|
|
3259
|
-
icon: /* @__PURE__ */ jsxs9(
|
|
3260
|
-
"svg",
|
|
3261
|
-
{
|
|
3262
|
-
className: "h-3 w-3 shrink-0",
|
|
3263
|
-
viewBox: "0 0 24 24",
|
|
3264
|
-
fill: "none",
|
|
3265
|
-
stroke: "currentColor",
|
|
3266
|
-
strokeWidth: "2",
|
|
3267
|
-
strokeLinecap: "round",
|
|
3268
|
-
strokeLinejoin: "round",
|
|
3269
|
-
children: [
|
|
3270
|
-
/* @__PURE__ */ jsx10("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
|
|
3271
|
-
/* @__PURE__ */ jsx10("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
|
|
3272
|
-
]
|
|
3273
|
-
}
|
|
3274
|
-
)
|
|
3275
|
-
},
|
|
3276
|
-
{
|
|
3277
|
-
value: "properties",
|
|
3278
|
-
label: "Properties",
|
|
3279
|
-
disabled: !hasSelectedField,
|
|
3280
|
-
icon: /* @__PURE__ */ jsx10(SlidersIcon, {})
|
|
3281
|
-
}
|
|
3282
|
-
].map((tab) => {
|
|
3283
|
-
const isActive = sidebarTab === tab.value;
|
|
3284
|
-
return /* @__PURE__ */ jsxs9(
|
|
3285
|
-
"button",
|
|
3286
|
-
{
|
|
3287
|
-
type: "button",
|
|
3288
|
-
disabled: tab.disabled,
|
|
3289
|
-
onClick: () => !tab.disabled && setSidebarTab(tab.value),
|
|
3290
|
-
className: [
|
|
3291
|
-
"flex items-center justify-center gap-1.5 w-full text-[13px] font-medium transition-all duration-150 border rounded-none select-none",
|
|
3292
|
-
"disabled:opacity-40 disabled:cursor-not-allowed",
|
|
3293
|
-
isActive ? "bg-primary/5 text-primary border-primary/30 cursor-pointer" : "bg-transparent border-primary/5 text-muted-foreground hover:text-foreground hover:bg-primary/5/50 cursor-pointer"
|
|
3294
|
-
].join(" "),
|
|
3295
|
-
style: { padding: "8px 12px" },
|
|
3296
|
-
children: [
|
|
3297
|
-
tab.icon,
|
|
3298
|
-
tab.label
|
|
3299
|
-
]
|
|
3300
|
-
},
|
|
3301
|
-
tab.value
|
|
3302
|
-
);
|
|
3303
|
-
})
|
|
3304
|
-
}
|
|
3305
|
-
),
|
|
3306
|
-
/* @__PURE__ */ jsxs9("div", { className: "flex-1 flex flex-col min-h-0", children: [
|
|
3307
|
-
sidebarTab === "add" && /* @__PURE__ */ jsx10("div", { className: "flex-1 flex flex-col", children: /* @__PURE__ */ jsx10(FieldLibrary, {}) }),
|
|
3308
|
-
sidebarTab === "properties" && /* @__PURE__ */ jsx10("div", { className: "flex-1 flex flex-col relative", children: selectedField ? /* @__PURE__ */ jsx10(
|
|
3309
|
-
FieldEditor,
|
|
3310
|
-
{
|
|
3311
|
-
field: selectedField,
|
|
3312
|
-
allFields: fields,
|
|
3313
|
-
onUpdate: (updates) => updateField(selectedField.name, updates),
|
|
3314
|
-
onDelete: () => {
|
|
3315
|
-
deleteField(selectedField.name);
|
|
3316
|
-
setSidebarTab("add");
|
|
3317
|
-
},
|
|
3318
|
-
onDuplicate: () => duplicateField(selectedField.name)
|
|
3319
|
-
}
|
|
3320
|
-
) : /* @__PURE__ */ jsxs9("div", { className: "flex flex-col items-center justify-center h-full px-6 py-16 text-center", children: [
|
|
3321
|
-
/* @__PURE__ */ jsx10("div", { className: "flex items-center justify-center w-11 h-11 rounded-none bg-primary/5 border border-primary/5 mb-4", children: /* @__PURE__ */ jsx10(SlidersIcon, {}) }),
|
|
3322
|
-
/* @__PURE__ */ jsx10("p", { className: "text-sm font-medium text-foreground", children: "No field selected" }),
|
|
3323
|
-
/* @__PURE__ */ jsx10("p", { className: "text-xs text-muted-foreground mt-1", children: "Click a field in the canvas to edit its properties" })
|
|
3324
|
-
] }) })
|
|
3325
|
-
] })
|
|
3326
|
-
]
|
|
3296
|
+
field: selectedField,
|
|
3297
|
+
allFields: fields,
|
|
3298
|
+
onUpdate: (updates) => updateField(selectedField.name, updates),
|
|
3299
|
+
onDelete: () => {
|
|
3300
|
+
deleteField(selectedField.name);
|
|
3301
|
+
setSidebarTab("add");
|
|
3302
|
+
},
|
|
3303
|
+
onDuplicate: () => duplicateField(selectedField.name)
|
|
3327
3304
|
}
|
|
3328
|
-
)
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
|
|
3305
|
+
) : /* @__PURE__ */ jsxs9("div", { className: "flex flex-col items-center justify-center h-full px-6 py-16 text-center", children: [
|
|
3306
|
+
/* @__PURE__ */ jsx10("div", { className: "flex items-center justify-center w-11 h-11 rounded-none bg-primary/5 border border-border mb-4", children: /* @__PURE__ */ jsx10(SlidersIcon, {}) }),
|
|
3307
|
+
/* @__PURE__ */ jsx10("p", { className: "text-sm font-medium text-foreground", children: "No field selected" }),
|
|
3308
|
+
/* @__PURE__ */ jsx10("p", { className: "text-xs text-muted-foreground mt-1", children: "Click a field in the canvas to edit its properties" })
|
|
3309
|
+
] }) })
|
|
3310
|
+
] })
|
|
3311
|
+
] })
|
|
3312
|
+
] })
|
|
3332
3313
|
]
|
|
3333
3314
|
}
|
|
3334
3315
|
);
|