@rjsf/primereact 6.5.3 → 6.6.0

package/dist/index.cjs

@@ -36,8 +36,8 @@ module.exports = __toCommonJS(index_exports);
 var import_core3 = require("@rjsf/core");
 
 // src/AddButton/AddButton.tsx
-var import_button = require("primereact/button");
 var import_utils = require("@rjsf/utils");
+var import_button = require("primereact/button");
 var import_jsx_runtime = require("react/jsx-runtime");
 function AddButton({
   uiSchema,
@@ -175,11 +175,30 @@ function ArrayFieldTemplate(props) {
   ] });
 }
 
+// src/ArrayFieldTitleTemplate/ArrayFieldTitleTemplate.tsx
+var import_utils4 = require("@rjsf/utils");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function ArrayFieldTitleTemplate({ title, uiSchema, required, fieldPathId, optionalDataControl }) {
+  const uiOptions = (0, import_utils4.getUiOptions)(uiSchema);
+  let heading = /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("h5", { id: (0, import_utils4.titleId)(fieldPathId), style: { margin: 0, fontSize: "1.5rem", marginBottom: "0.2rem" }, children: [
+    uiOptions.title || title,
+    " ",
+    required ? "*" : ""
+  ] });
+  if (optionalDataControl) {
+    heading = /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { style: { display: "flex" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { style: { flexGrow: 1 }, children: heading }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { children: optionalDataControl })
+    ] });
+  }
+  return heading;
+}
+
 // src/BaseInputTemplate/BaseInputTemplate.tsx
 var import_react = require("react");
-var import_utils4 = require("@rjsf/utils");
+var import_utils5 = require("@rjsf/utils");
 var import_inputtext = require("primereact/inputtext");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function BaseInputTemplate(props) {
   const {
     id,
@@ -202,7 +221,7 @@ function BaseInputTemplate(props) {
   } = props;
   const { ClearButton: ClearButton2 } = registry.templates.ButtonTemplates;
   const { AutoCompleteWidget: AutoCompleteWidget2 } = registry.widgets;
-  const inputProps = (0, import_utils4.getInputProps)(schema, type, options);
+  const inputProps = (0, import_utils5.getInputProps)(schema, type, options);
   const primeProps = options.prime || {};
   const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
   const _onBlur = () => onBlur && onBlur(id, value);
@@ -216,10 +235,10 @@ function BaseInputTemplate(props) {
     [onChange, options.emptyValue]
   );
   if (Array.isArray(schema.examples)) {
-    return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(AutoCompleteWidget2, { ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(AutoCompleteWidget2, { ...props });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       import_inputtext.InputText,
       {
         id,
@@ -230,48 +249,48 @@ function BaseInputTemplate(props) {
         required,
         autoFocus: autofocus,
         disabled: disabled || readonly,
-        list: schema.examples ? (0, import_utils4.examplesId)(id) : void 0,
+        list: schema.examples ? (0, import_utils5.examplesId)(id) : void 0,
         value: value || value === 0 ? value : "",
         invalid: rawErrors.length > 0,
         onChange: onChangeOverride || _onChange,
         onBlur: _onBlur,
         onFocus: _onFocus,
-        "aria-describedby": (0, import_utils4.ariaDescribedByIds)(id, !!schema.examples)
+        "aria-describedby": (0, import_utils5.ariaDescribedByIds)(id, !!schema.examples)
       }
     ),
-    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(ClearButton2, { registry, onClick: _onClear })
+    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ClearButton2, { registry, onClick: _onClear })
   ] });
 }
 
 // src/DescriptionField/DescriptionField.tsx
 var import_core = require("@rjsf/core");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function DescriptionField(props) {
   const { id, description, registry, uiSchema } = props;
   if (!description) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { id, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core.RichDescription, { description, registry, uiSchema }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { id, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core.RichDescription, { description, registry, uiSchema }) });
 }
 
 // src/ErrorList/ErrorList.tsx
-var import_message = require("primereact/message");
+var import_utils6 = require("@rjsf/utils");
 var import_timescircle = require("primereact/icons/timescircle");
-var import_utils5 = require("@rjsf/utils");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_message = require("primereact/message");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function ErrorList({
   errors,
   registry
 }) {
   const { translateString } = registry;
-  const content = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { style: { display: "flex", flexDirection: "column" }, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { style: { display: "flex", flexDirection: "row", alignItems: "center", gap: "0.5rem" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_timescircle.TimesCircleIcon, { style: { width: "1.5rem", height: "1.5rem" } }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "p-message-summary", children: translateString(import_utils5.TranslatableString.ErrorsLabel) })
+  const content = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", flexDirection: "column" }, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", flexDirection: "row", alignItems: "center", gap: "0.5rem" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_timescircle.TimesCircleIcon, { style: { width: "1.5rem", height: "1.5rem" } }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "p-message-summary", children: translateString(import_utils6.TranslatableString.ErrorsLabel) })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("ul", { className: "p-message-list", children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("li", { children: error.stack }, `error-${index}`)) })
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("ul", { className: "p-message-list", children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("li", { children: error.stack }, `error-${index}`)) })
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
     import_message.Message,
     {
       className: "p-message",
@@ -289,45 +308,6 @@ function ErrorList({
   );
 }
 
-// src/IconButton/IconButton.tsx
-var import_button2 = require("primereact/button");
-var import_utils6 = require("@rjsf/utils");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-function IconButton(props) {
-  const { icon, iconType, uiSchema, registry, ...otherProps } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_button2.Button, { icon: `pi pi-${icon}`, rounded: true, text: true, severity: "secondary", ...otherProps });
-}
-function CopyButton(props) {
-  const {
-    registry: { translateString }
-  } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconButton, { title: translateString(import_utils6.TranslatableString.CopyButton), ...props, icon: "copy" });
-}
-function MoveDownButton(props) {
-  const {
-    registry: { translateString }
-  } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconButton, { title: translateString(import_utils6.TranslatableString.MoveDownButton), ...props, icon: "angle-down" });
-}
-function MoveUpButton(props) {
-  const {
-    registry: { translateString }
-  } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconButton, { title: translateString(import_utils6.TranslatableString.MoveUpButton), ...props, icon: "angle-up" });
-}
-function RemoveButton(props) {
-  const {
-    registry: { translateString }
-  } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconButton, { title: translateString(import_utils6.TranslatableString.RemoveButton), ...props, icon: "trash" });
-}
-function ClearButton(props) {
-  const {
-    registry: { translateString }
-  } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(IconButton, { title: translateString(import_utils6.TranslatableString.ClearButton), ...props, icon: "times" });
-}
-
 // src/FieldErrorTemplate/FieldErrorTemplate.tsx
 var import_utils7 = require("@rjsf/utils");
 var import_message2 = require("primereact/message");
@@ -353,8 +333,8 @@ function FieldErrorTemplate({ errors, fieldPathId }) {
 }
 
 // src/FieldHelpTemplate/FieldHelpTemplate.tsx
-var import_utils8 = require("@rjsf/utils");
 var import_core2 = require("@rjsf/core");
+var import_utils8 = require("@rjsf/utils");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 function FieldHelpTemplate(props) {
   const { fieldPathId, help, uiSchema, registry } = props;
@@ -403,20 +383,128 @@ function FieldTemplate(props) {
   ] }) });
 }
 
+// src/GridTemplate/GridTemplate.tsx
+var import_react2 = require("react");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var breakpoints = {
+  xs: 0,
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200
+};
+function getBreakpoint(width) {
+  if (width >= breakpoints.xl) {
+    return "xl";
+  }
+  if (width >= breakpoints.lg) {
+    return "lg";
+  }
+  if (width >= breakpoints.md) {
+    return "md";
+  }
+  if (width >= breakpoints.sm) {
+    return "sm";
+  }
+  return "xs";
+}
+function getResponsiveSpan(spanDef, breakpoint) {
+  return spanDef[breakpoint] ?? spanDef.xl ?? spanDef.lg ?? spanDef.md ?? spanDef.sm ?? spanDef.xs ?? 12;
+}
+function getInitialWidth() {
+  return typeof window !== "undefined" ? window.innerWidth : breakpoints.xs;
+}
+function GridTemplate(props) {
+  return props.column ? GridTemplateColumn(props) : GridTemplateRow(props);
+}
+function GridTemplateRow(props) {
+  const { children, column, uiSchema, style, ...rest } = props;
+  const layoutGrid = uiSchema?.["ui:layoutGrid"] ?? {};
+  const totalColumns = layoutGrid.columns ?? 12;
+  const gap = layoutGrid.gap ?? "16px";
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    "div",
+    {
+      style: {
+        display: "grid",
+        gridTemplateColumns: `repeat(${totalColumns}, 1fr)`,
+        alignItems: "start",
+        gap,
+        ...style ?? {}
+      },
+      ...rest,
+      children
+    }
+  );
+}
+function GridTemplateColumn(props) {
+  const { children, column, uiSchema, xs, sm, md, lg, xl, style, ...rest } = props;
+  const [breakpoint, setBreakpoint] = (0, import_react2.useState)(() => getBreakpoint(getInitialWidth()));
+  (0, import_react2.useEffect)(() => {
+    if (typeof window === "undefined") {
+      return;
+    }
+    const handleResize = () => setBreakpoint(getBreakpoint(window.innerWidth));
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  const span = getResponsiveSpan(props, breakpoint);
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { style: { gridColumn: `span ${span} / span ${span}`, ...style ?? {} }, ...rest, children });
+}
+
+// src/IconButton/IconButton.tsx
+var import_utils10 = require("@rjsf/utils");
+var import_button2 = require("primereact/button");
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function IconButton(props) {
+  const { icon, iconType, uiSchema, registry, ...otherProps } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_button2.Button, { icon: `pi pi-${icon}`, rounded: true, text: true, severity: "secondary", ...otherProps });
+}
+function CopyButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.CopyButton), ...props, icon: "copy" });
+}
+function MoveDownButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveDownButton), ...props, icon: "angle-down" });
+}
+function MoveUpButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveUpButton), ...props, icon: "angle-up" });
+}
+function RemoveButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.RemoveButton), ...props, icon: "trash" });
+}
+function ClearButton(props) {
+  const {
+    registry: { translateString }
+  } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.ClearButton), ...props, icon: "times" });
+}
+
 // src/MultiSchemaFieldTemplate/MultiSchemaFieldTemplate.tsx
 var import_fieldset2 = require("primereact/fieldset");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function MultiSchemaFieldTemplate(props) {
   const { selector, optionSchemaField } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_fieldset2.Fieldset, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { style: { marginBottom: "1rem" }, children: selector }),
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_fieldset2.Fieldset, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { style: { marginBottom: "1rem" }, children: selector }),
     optionSchemaField
   ] });
 }
 
 // src/ObjectFieldTemplate/ObjectFieldTemplate.tsx
-var import_utils10 = require("@rjsf/utils");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_utils11 = require("@rjsf/utils");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function ObjectFieldTemplate(props) {
   const {
     description,
@@ -433,9 +521,9 @@ function ObjectFieldTemplate(props) {
     fieldPathId,
     registry
   } = props;
-  const uiOptions = (0, import_utils10.getUiOptions)(uiSchema);
-  const TitleFieldTemplate = (0, import_utils10.getTemplate)("TitleFieldTemplate", registry, uiOptions);
-  const DescriptionFieldTemplate = (0, import_utils10.getTemplate)(
+  const uiOptions = (0, import_utils11.getUiOptions)(uiSchema);
+  const TitleFieldTemplate = (0, import_utils11.getTemplate)("TitleFieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = (0, import_utils11.getTemplate)(
     "DescriptionFieldTemplate",
     registry,
     uiOptions
@@ -444,11 +532,11 @@ function ObjectFieldTemplate(props) {
   const {
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_jsx_runtime13.Fragment, { children: [
-    title && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
+    title && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       TitleFieldTemplate,
       {
-        id: (0, import_utils10.titleId)(fieldPathId),
+        id: (0, import_utils11.titleId)(fieldPathId),
         title,
         required,
         schema,
@@ -457,10 +545,10 @@ function ObjectFieldTemplate(props) {
         optionalDataControl: showOptionalDataControlInTitle ? optionalDataControl : void 0
       }
     ),
-    description && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginBottom: "1rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       DescriptionFieldTemplate,
       {
-        id: (0, import_utils10.descriptionId)(fieldPathId),
+        id: (0, import_utils11.descriptionId)(fieldPathId),
         description,
         schema,
         uiSchema,
@@ -469,10 +557,10 @@ function ObjectFieldTemplate(props) {
     ) }),
     !showOptionalDataControlInTitle ? optionalDataControl : void 0,
     properties.map((prop) => prop.content),
-    (0, import_utils10.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { style: { marginTop: "1rem", textAlign: "right" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    (0, import_utils11.canExpand)(schema, uiSchema, formData) && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { style: { marginTop: "1rem", textAlign: "right" }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       AddButton2,
       {
-        id: (0, import_utils10.buttonId)(fieldPathId, "add"),
+        id: (0, import_utils11.buttonId)(fieldPathId, "add"),
         className: "rjsf-object-property-expand",
         icon: "pi pi-plus",
         onClick: onAddProperty,
@@ -484,11 +572,11 @@ function ObjectFieldTemplate(props) {
 }
 
 // src/OptionalDataControlsTemplate/OptionalDataControlsTemplate.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function OptionalDataControlsTemplate(props) {
   const { id, registry, label, onAddClick, onRemoveClick } = props;
   if (onAddClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       IconButton,
       {
         id,
@@ -501,7 +589,7 @@ function OptionalDataControlsTemplate(props) {
       }
     );
   } else if (onRemoveClick) {
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       RemoveButton,
       {
         id,
@@ -513,25 +601,25 @@ function OptionalDataControlsTemplate(props) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("em", { id, children: label });
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("em", { id, children: label });
 }
 
 // src/SubmitButton/SubmitButton.tsx
+var import_utils12 = require("@rjsf/utils");
 var import_button3 = require("primereact/button");
-var import_utils11 = require("@rjsf/utils");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function SubmitButton({ uiSchema }) {
-  const { submitText, norender, props: submitButtonProps = {} } = (0, import_utils11.getSubmitButtonOptions)(uiSchema);
+  const { submitText, norender, props: submitButtonProps = {} } = (0, import_utils12.getSubmitButtonOptions)(uiSchema);
   if (norender) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_button3.Button, { type: "submit", label: submitText, ...submitButtonProps });
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_button3.Button, { type: "submit", label: submitText, ...submitButtonProps });
 }
 
 // src/TitleField/TitleField.tsx
+var import_utils13 = require("@rjsf/utils");
 var import_divider = require("primereact/divider");
-var import_utils12 = require("@rjsf/utils");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function TitleField({
   id,
   title,
@@ -539,28 +627,28 @@ function TitleField({
   required,
   optionalDataControl
 }) {
-  const uiOptions = (0, import_utils12.getUiOptions)(uiSchema);
-  let heading = /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("h5", { style: { margin: 0, fontSize: id === (0, import_utils12.titleId)("root") ? "1.5rem" : "1.2rem" }, children: [
+  const uiOptions = (0, import_utils13.getUiOptions)(uiSchema);
+  let heading = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("h5", { style: { margin: 0, fontSize: id === (0, import_utils13.titleId)("root") ? "1.5rem" : "1.2rem" }, children: [
     uiOptions.title || title,
     " ",
     required ? "*" : ""
   ] });
   if (optionalDataControl) {
-    heading = /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { style: { display: "flex" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { flexGrow: 1 }, children: heading }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { style: { marginLeft: "-5px" }, children: optionalDataControl })
+    heading = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { flexGrow: 1 }, children: heading }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { marginLeft: "-5px" }, children: optionalDataControl })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { id, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { id, children: [
     heading,
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_divider.Divider, { pt: { root: { style: { marginTop: "0.5rem" } } } })
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_divider.Divider, { pt: { root: { style: { marginTop: "0.5rem" } } } })
   ] });
 }
 
 // src/WrapIfAdditionalTemplate/WrapIfAdditionalTemplate.tsx
-var import_utils13 = require("@rjsf/utils");
+var import_utils14 = require("@rjsf/utils");
 var import_inputtext2 = require("primereact/inputtext");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function WrapIfAdditionalTemplate({
   classNames,
   style,
@@ -579,22 +667,22 @@ function WrapIfAdditionalTemplate({
 }) {
   const { templates, translateString } = registry;
   const { RemoveButton: RemoveButton2 } = templates.ButtonTemplates;
-  const keyLabel = translateString(import_utils13.TranslatableString.KeyLabel, [label]);
-  const additional = import_utils13.ADDITIONAL_PROPERTY_FLAG in schema;
+  const keyLabel = translateString(import_utils14.TranslatableString.KeyLabel, [label]);
+  const additional = import_utils14.ADDITIONAL_PROPERTY_FLAG in schema;
   const hasDescription = !!rawDescription;
   const margin = hasDescription ? -8 : 12;
   if (!additional) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: classNames, style, children });
+    return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: classNames, style, children });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "div",
     {
       className: classNames,
       style: { ...style, display: "flex", alignItems: "flex-start", gap: "1rem" },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { style: { flex: 1 }, children: [
-          displayLabel && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("label", { htmlFor: `${id}-key`, style: { display: "block", marginBottom: "0.5rem" }, children: keyLabel }),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { style: { flex: 1 }, children: [
+          displayLabel && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("label", { htmlFor: `${id}-key`, style: { display: "block", marginBottom: "0.5rem" }, children: keyLabel }),
+          /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
             import_inputtext2.InputText,
             {
               id: `${id}-key`,
@@ -608,11 +696,11 @@ function WrapIfAdditionalTemplate({
             label
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: { flex: 1 }, children }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { style: displayLabel ? { alignSelf: "center", marginTop: `${margin}px` } : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { flex: 1 }, children }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: displayLabel ? { alignSelf: "center", marginTop: `${margin}px` } : void 0, children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
           RemoveButton2,
           {
-            id: (0, import_utils13.buttonId)(id, "remove"),
+            id: (0, import_utils14.buttonId)(id, "remove"),
             className: "rjsf-object-property-remove",
             disabled: disabled || readonly,
             onClick: onRemoveProperty,
@@ -625,94 +713,6 @@ function WrapIfAdditionalTemplate({
   );
 }
 
-// src/ArrayFieldTitleTemplate/ArrayFieldTitleTemplate.tsx
-var import_utils14 = require("@rjsf/utils");
-var import_jsx_runtime18 = require("react/jsx-runtime");
-function ArrayFieldTitleTemplate({ title, uiSchema, required, fieldPathId, optionalDataControl }) {
-  const uiOptions = (0, import_utils14.getUiOptions)(uiSchema);
-  let heading = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("h5", { id: (0, import_utils14.titleId)(fieldPathId), style: { margin: 0, fontSize: "1.5rem", marginBottom: "0.2rem" }, children: [
-    uiOptions.title || title,
-    " ",
-    required ? "*" : ""
-  ] });
-  if (optionalDataControl) {
-    heading = /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { flexGrow: 1 }, children: heading }),
-      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { children: optionalDataControl })
-    ] });
-  }
-  return heading;
-}
-
-// src/GridTemplate/GridTemplate.tsx
-var import_react2 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
-var breakpoints = {
-  xs: 0,
-  sm: 576,
-  md: 768,
-  lg: 992,
-  xl: 1200
-};
-function getBreakpoint(width) {
-  if (width >= breakpoints.xl) {
-    return "xl";
-  }
-  if (width >= breakpoints.lg) {
-    return "lg";
-  }
-  if (width >= breakpoints.md) {
-    return "md";
-  }
-  if (width >= breakpoints.sm) {
-    return "sm";
-  }
-  return "xs";
-}
-function getResponsiveSpan(spanDef, breakpoint) {
-  return spanDef[breakpoint] ?? spanDef.xl ?? spanDef.lg ?? spanDef.md ?? spanDef.sm ?? spanDef.xs ?? 12;
-}
-function getInitialWidth() {
-  return typeof window !== "undefined" ? window.innerWidth : breakpoints.xs;
-}
-function GridTemplate(props) {
-  return props.column ? GridTemplateColumn(props) : GridTemplateRow(props);
-}
-function GridTemplateRow(props) {
-  const { children, column, uiSchema, style, ...rest } = props;
-  const layoutGrid = uiSchema?.["ui:layoutGrid"] ?? {};
-  const totalColumns = layoutGrid.columns ?? 12;
-  const gap = layoutGrid.gap ?? "16px";
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-    "div",
-    {
-      style: {
-        display: "grid",
-        gridTemplateColumns: `repeat(${totalColumns}, 1fr)`,
-        alignItems: "start",
-        gap,
-        ...style ?? {}
-      },
-      ...rest,
-      children
-    }
-  );
-}
-function GridTemplateColumn(props) {
-  const { children, column, uiSchema, xs, sm, md, lg, xl, style, ...rest } = props;
-  const [breakpoint, setBreakpoint] = (0, import_react2.useState)(() => getBreakpoint(getInitialWidth()));
-  (0, import_react2.useEffect)(() => {
-    if (typeof window === "undefined") {
-      return;
-    }
-    const handleResize = () => setBreakpoint(getBreakpoint(window.innerWidth));
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, []);
-  const span = getResponsiveSpan(props, breakpoint);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { style: { gridColumn: `span ${span} / span ${span}`, ...style ?? {} }, ...rest, children });
-}
-
 // src/Templates/Templates.ts
 function generateTemplates() {
   return {
@@ -819,77 +819,10 @@ function AutoCompleteWidget(props) {
   );
 }
 
-// src/CheckboxWidget/CheckboxWidget.tsx
+// src/CheckboxesWidget/CheckboxesWidget.tsx
 var import_utils16 = require("@rjsf/utils");
 var import_checkbox = require("primereact/checkbox");
 var import_jsx_runtime21 = require("react/jsx-runtime");
-function CheckboxWidget(props) {
-  const {
-    id,
-    htmlName,
-    value,
-    disabled,
-    readonly,
-    label = "",
-    hideLabel,
-    autofocus,
-    onChange,
-    onBlur,
-    options,
-    onFocus,
-    schema,
-    uiSchema,
-    registry
-  } = props;
-  const DescriptionFieldTemplate = (0, import_utils16.getTemplate)(
-    "DescriptionFieldTemplate",
-    registry,
-    options
-  );
-  const required = (0, import_utils16.schemaRequiresTrueValue)(schema);
-  const checked = value === "true" || value === true;
-  const _onChange = (e) => onChange && onChange(e.checked);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
-  const description = options.description ?? schema.description;
-  const primeProps = options.prime || {};
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
-    !hideLabel && !!description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-      DescriptionFieldTemplate,
-      {
-        id: (0, import_utils16.descriptionId)(id),
-        description,
-        schema,
-        uiSchema,
-        registry
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-        import_checkbox.Checkbox,
-        {
-          inputId: id,
-          name: htmlName || id,
-          ...primeProps,
-          disabled: disabled || readonly,
-          autoFocus: autofocus,
-          checked: typeof value === "undefined" ? false : checked,
-          onChange: _onChange,
-          onBlur: _onBlur,
-          onFocus: _onFocus,
-          required,
-          "aria-describedby": (0, import_utils16.ariaDescribedByIds)(id)
-        }
-      ),
-      (0, import_utils16.labelValue)(/* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Label, { id, text: label }), hideLabel, false)
-    ] })
-  ] });
-}
-
-// src/CheckboxesWidget/CheckboxesWidget.tsx
-var import_checkbox2 = require("primereact/checkbox");
-var import_utils17 = require("@rjsf/utils");
-var import_jsx_runtime22 = require("react/jsx-runtime");
 function CheckboxesWidget(props) {
   const {
     id,
@@ -912,12 +845,12 @@ function CheckboxesWidget(props) {
   const checkboxesValues = Array.isArray(value) ? value : [value];
   const _onChange = (index) => (e) => {
     if (e.checked) {
-      onChange((0, import_utils17.enumOptionsSelectValue)(index, checkboxesValues, enumOptions));
+      onChange((0, import_utils16.enumOptionsSelectValue)(index, checkboxesValues, enumOptions));
     } else {
-      onChange((0, import_utils17.enumOptionsDeselectValue)(index, checkboxesValues, enumOptions));
+      onChange((0, import_utils16.enumOptionsDeselectValue)(index, checkboxesValues, enumOptions));
     }
   };
-  const DescriptionFieldTemplate = (0, import_utils17.getTemplate)(
+  const DescriptionFieldTemplate = (0, import_utils16.getTemplate)(
     "DescriptionFieldTemplate",
     registry,
     options
@@ -925,16 +858,16 @@ function CheckboxesWidget(props) {
   const _onBlur = () => onBlur(id, value);
   const _onFocus = () => onFocus(id, value);
   const description = options.description ?? schema.description;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
     "div",
     {
       id,
       style: { display: "flex", flexDirection: "column", gap: "1rem", marginTop: "0.5rem", marginBottom: "0.5rem" },
       children: [
-        !hideLabel && !!description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        !hideLabel && !!description && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
           DescriptionFieldTemplate,
           {
-            id: (0, import_utils17.descriptionId)(id),
+            id: (0, import_utils16.descriptionId)(id),
             description,
             schema,
             uiSchema,
@@ -942,13 +875,13 @@ function CheckboxesWidget(props) {
           }
         ),
         Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-          const checked = (0, import_utils17.enumOptionsIsSelected)(option.value, checkboxesValues);
+          const checked = (0, import_utils16.enumOptionsIsSelected)(option.value, checkboxesValues);
           const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-          return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-              import_checkbox2.Checkbox,
+          return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+              import_checkbox.Checkbox,
               {
-                inputId: (0, import_utils17.optionId)(id, index),
+                inputId: (0, import_utils16.optionId)(id, index),
                 name: htmlName || id,
                 ...primeProps,
                 value: option.value,
@@ -958,10 +891,10 @@ function CheckboxesWidget(props) {
                 onChange: _onChange(index),
                 onBlur: _onBlur,
                 onFocus: _onFocus,
-                "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id)
+                "aria-describedby": (0, import_utils16.ariaDescribedByIds)(id)
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Label, { id: (0, import_utils17.optionId)(id, index), text: option.label })
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Label, { id: (0, import_utils16.optionId)(id, index), text: option.label })
           ] }, index);
         })
       ]
@@ -969,6 +902,73 @@ function CheckboxesWidget(props) {
   );
 }
 
+// src/CheckboxWidget/CheckboxWidget.tsx
+var import_utils17 = require("@rjsf/utils");
+var import_checkbox2 = require("primereact/checkbox");
+var import_jsx_runtime22 = require("react/jsx-runtime");
+function CheckboxWidget(props) {
+  const {
+    id,
+    htmlName,
+    value,
+    disabled,
+    readonly,
+    label = "",
+    hideLabel,
+    autofocus,
+    onChange,
+    onBlur,
+    options,
+    onFocus,
+    schema,
+    uiSchema,
+    registry
+  } = props;
+  const DescriptionFieldTemplate = (0, import_utils17.getTemplate)(
+    "DescriptionFieldTemplate",
+    registry,
+    options
+  );
+  const required = (0, import_utils17.schemaRequiresTrueValue)(schema);
+  const checked = value === "true" || value === true;
+  const _onChange = (e) => onChange && onChange(e.checked);
+  const _onBlur = () => onBlur && onBlur(id, value);
+  const _onFocus = () => onFocus && onFocus(id, value);
+  const description = options.description ?? schema.description;
+  const primeProps = options.prime || {};
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
+    !hideLabel && !!description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+      DescriptionFieldTemplate,
+      {
+        id: (0, import_utils17.descriptionId)(id),
+        description,
+        schema,
+        uiSchema,
+        registry
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", flexDirection: "row", gap: "0.5rem", alignItems: "center" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        import_checkbox2.Checkbox,
+        {
+          inputId: id,
+          name: htmlName || id,
+          ...primeProps,
+          disabled: disabled || readonly,
+          autoFocus: autofocus,
+          checked: typeof value === "undefined" ? false : checked,
+          onChange: _onChange,
+          onBlur: _onBlur,
+          onFocus: _onFocus,
+          required,
+          "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id)
+        }
+      ),
+      (0, import_utils17.labelValue)(/* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Label, { id, text: label }), hideLabel, false)
+    ] })
+  ] });
+}
+
 // src/ColorWidget/ColorWidget.tsx
 var import_utils18 = require("@rjsf/utils");
 var import_colorpicker = require("primereact/colorpicker");
@@ -1105,8 +1105,8 @@ function RadioWidget(props) {
 }
 
 // src/RangeWidget/RangeWidget.tsx
-var import_slider = require("primereact/slider");
 var import_utils21 = require("@rjsf/utils");
+var import_slider = require("primereact/slider");
 var import_jsx_runtime26 = require("react/jsx-runtime");
 function RangeWidget(props) {
   const { value, readonly, disabled, onBlur, onFocus, options, schema, onChange, id } = props;
@@ -1133,8 +1133,8 @@ function RangeWidget(props) {
 }
 
 // src/SelectWidget/SelectWidget.tsx
-var import_dropdown = require("primereact/dropdown");
 var import_utils22 = require("@rjsf/utils");
+var import_dropdown = require("primereact/dropdown");
 var import_multiselect = require("primereact/multiselect");
 var import_jsx_runtime27 = require("react/jsx-runtime");
 function SelectWidget(props) {