config-driven-form 1.3.0 → 1.3.1

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 CHANGED
@@ -38,6 +38,14 @@ var TextField = ({ name, schema, uiSchema, isRequired }) => {
38
38
  schema.title || name,
39
39
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
40
40
  ] }),
41
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
42
+ "p",
43
+ {
44
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
45
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
46
+ children: schema.description
47
+ }
48
+ ),
41
49
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdf-input-wrapper", children: /* @__PURE__ */ jsxRuntime.jsx(
42
50
  "input",
43
51
  {
@@ -80,6 +88,14 @@ var PasswordField = ({
80
88
  schema.title || name,
81
89
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
82
90
  ] }),
91
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
92
+ "p",
93
+ {
94
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
95
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
96
+ children: schema.description
97
+ }
98
+ ),
83
99
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "cdf-input-wrapper", children: [
84
100
  /* @__PURE__ */ jsxRuntime.jsx(
85
101
  "input",
@@ -129,6 +145,14 @@ var NumberField = ({ name, schema, uiSchema, isRequired }) => {
129
145
  schema.title || name,
130
146
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
131
147
  ] }),
148
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
149
+ "p",
150
+ {
151
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
152
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
153
+ children: schema.description
154
+ }
155
+ ),
132
156
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdf-input-wrapper", children: /* @__PURE__ */ jsxRuntime.jsx(
133
157
  "input",
134
158
  {
@@ -186,6 +210,14 @@ var RichTextField = ({
186
210
  schema.title || name,
187
211
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
188
212
  ] }),
213
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
214
+ "p",
215
+ {
216
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
217
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
218
+ children: schema.description
219
+ }
220
+ ),
189
221
  /* @__PURE__ */ jsxRuntime.jsxs(
190
222
  "div",
191
223
  {
@@ -267,6 +299,14 @@ var SelectField = ({ name, schema, uiSchema, isRequired }) => {
267
299
  schema.title || name,
268
300
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
269
301
  ] }),
302
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
303
+ "p",
304
+ {
305
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
306
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
307
+ children: schema.description
308
+ }
309
+ ),
270
310
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "cdf-input-wrapper", children: /* @__PURE__ */ jsxRuntime.jsxs(
271
311
  "select",
272
312
  {
@@ -322,6 +362,14 @@ var RadioField = ({ name, schema, uiSchema, isRequired }) => {
322
362
  schema.title || name,
323
363
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
324
364
  ] }),
365
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
366
+ "p",
367
+ {
368
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
369
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
370
+ children: schema.description
371
+ }
372
+ ),
325
373
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx("cdf-radio-group", globalClasses.radioGroup, localClasses.radioGroup), children: (_a = schema.enum) == null ? void 0 : _a.map((option) => /* @__PURE__ */ jsxRuntime.jsxs(
326
374
  "label",
327
375
  {
@@ -456,6 +504,14 @@ var CheckboxGroupField = ({
456
504
  schema.title || name,
457
505
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
458
506
  ] }),
507
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
508
+ "p",
509
+ {
510
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
511
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
512
+ children: schema.description
513
+ }
514
+ ),
459
515
  /* @__PURE__ */ jsxRuntime.jsx(
460
516
  "div",
461
517
  {
@@ -544,6 +600,14 @@ var FileField = ({ name, schema, uiSchema, isRequired }) => {
544
600
  schema.title || name,
545
601
  isRequired && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "cdf-required-mark", children: "*" })
546
602
  ] }),
603
+ schema.description && /* @__PURE__ */ jsxRuntime.jsx(
604
+ "p",
605
+ {
606
+ className: cx("cdf-description", globalClasses.description, localClasses.description),
607
+ style: { fontSize: "0.875rem", color: "#6b7280", margin: "-0.25rem 0 0.5rem 0" },
608
+ children: schema.description
609
+ }
610
+ ),
547
611
  /* @__PURE__ */ jsxRuntime.jsxs(
548
612
  "div",
549
613
  {
@@ -1123,10 +1187,7 @@ var Canvas = ({
1123
1187
  flex: 1,
1124
1188
  padding: "2rem",
1125
1189
  backgroundColor: "#f3f4f6",
1126
- overflowY: "auto",
1127
- display: "flex",
1128
- flexDirection: "column",
1129
- alignItems: "center"
1190
+ overflowY: "auto"
1130
1191
  },
1131
1192
  onClick: () => onSelectField(""),
1132
1193
  children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1134,6 +1195,8 @@ var Canvas = ({
1134
1195
  {
1135
1196
  ref: setNodeRef,
1136
1197
  style: {
1198
+ margin: "0 auto",
1199
+ height: "fit-content",
1137
1200
  width: "100%",
1138
1201
  maxWidth: "800px",
1139
1202
  minHeight: "400px",
@@ -2013,14 +2076,14 @@ var FormBuilder = ({
2013
2076
  style: {
2014
2077
  flex: 1,
2015
2078
  padding: "3rem",
2016
- overflowY: "auto",
2017
- display: "flex",
2018
- justifyContent: "center"
2079
+ overflowY: "auto"
2019
2080
  },
2020
2081
  children: /* @__PURE__ */ jsxRuntime.jsxs(
2021
2082
  "div",
2022
2083
  {
2023
2084
  style: {
2085
+ margin: "0 auto",
2086
+ height: "fit-content",
2024
2087
  width: "100%",
2025
2088
  maxWidth: "800px",
2026
2089
  backgroundColor: "white",