@rjsf/react-bootstrap 6.0.0-alpha.0 → 6.0.0-beta.1

package/dist/react-bootstrap.esm.js

@@ -27,25 +27,19 @@ function AddButton({
 // src/ArrayFieldItemTemplate/ArrayFieldItemTemplate.tsx
 import Row from "react-bootstrap/Row";
 import Col from "react-bootstrap/Col";
+import {
+  getTemplate,
+  getUiOptions
+} from "@rjsf/utils";
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 function ArrayFieldItemTemplate(props) {
-  const {
-    children,
-    disabled,
-    hasToolbar,
-    hasCopy,
-    hasMoveDown,
-    hasMoveUp,
-    hasRemove,
-    index,
-    onCopyIndexClick,
-    onDropIndexClick,
-    onReorderClick,
-    readonly,
+  const { children, buttonsProps, hasToolbar, uiSchema, registry } = props;
+  const uiOptions = getUiOptions(uiSchema);
+  const ArrayFieldItemButtonsTemplate = getTemplate(
+    "ArrayFieldItemButtonsTemplate",
     registry,
-    uiSchema
-  } = props;
-  const { CopyButton: CopyButton2, MoveDownButton: MoveDownButton2, MoveUpButton: MoveUpButton2, RemoveButton: RemoveButton2 } = registry.templates.ButtonTemplates;
+    uiOptions
+  );
   const btnStyle = {
     flex: 1,
     paddingLeft: 6,
@@ -54,49 +48,7 @@ function ArrayFieldItemTemplate(props) {
   };
   return /* @__PURE__ */ jsx2("div", { children: /* @__PURE__ */ jsxs(Row, { className: "mb-2  d-flex align-items-center", children: [
     /* @__PURE__ */ jsx2(Col, { xs: "9", lg: "9", children }),
-    /* @__PURE__ */ jsx2(Col, { xs: "3", lg: "3", className: "py-4", children: hasToolbar && /* @__PURE__ */ jsxs("div", { className: "d-flex flex-row", children: [
-      (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx2("div", { className: "m-0 p-0", children: /* @__PURE__ */ jsx2(
-        MoveUpButton2,
-        {
-          className: "array-item-move-up",
-          style: btnStyle,
-          disabled: disabled || readonly || !hasMoveUp,
-          onClick: onReorderClick(index, index - 1),
-          uiSchema,
-          registry
-        }
-      ) }),
-      (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx2("div", { className: "m-0 p-0", children: /* @__PURE__ */ jsx2(
-        MoveDownButton2,
-        {
-          style: btnStyle,
-          disabled: disabled || readonly || !hasMoveDown,
-          onClick: onReorderClick(index, index + 1),
-          uiSchema,
-          registry
-        }
-      ) }),
-      hasCopy && /* @__PURE__ */ jsx2("div", { className: "m-0 p-0", children: /* @__PURE__ */ jsx2(
-        CopyButton2,
-        {
-          style: btnStyle,
-          disabled: disabled || readonly,
-          onClick: onCopyIndexClick(index),
-          uiSchema,
-          registry
-        }
-      ) }),
-      hasRemove && /* @__PURE__ */ jsx2("div", { className: "m-0 p-0", children: /* @__PURE__ */ jsx2(
-        RemoveButton2,
-        {
-          style: btnStyle,
-          disabled: disabled || readonly,
-          onClick: onDropIndexClick(index),
-          uiSchema,
-          registry
-        }
-      ) })
-    ] }) })
+    /* @__PURE__ */ jsx2(Col, { xs: "3", lg: "3", className: "py-4", children: hasToolbar && /* @__PURE__ */ jsx2("div", { className: "d-flex flex-row", children: /* @__PURE__ */ jsx2(ArrayFieldItemButtonsTemplate, { ...buttonsProps, style: btnStyle }) }) })
   ] }) });
 }
 
@@ -105,24 +57,25 @@ import Row2 from "react-bootstrap/Row";
 import Col2 from "react-bootstrap/Col";
 import Container from "react-bootstrap/Container";
 import {
-  getTemplate,
-  getUiOptions
+  buttonId,
+  getTemplate as getTemplate2,
+  getUiOptions as getUiOptions2
 } from "@rjsf/utils";
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 function ArrayFieldTemplate(props) {
   const { canAdd, disabled, idSchema, uiSchema, items, onAddClick, readonly, registry, required, schema, title } = props;
-  const uiOptions = getUiOptions(uiSchema);
-  const ArrayFieldDescriptionTemplate = getTemplate(
+  const uiOptions = getUiOptions2(uiSchema);
+  const ArrayFieldDescriptionTemplate = getTemplate2(
     "ArrayFieldDescriptionTemplate",
     registry,
     uiOptions
   );
-  const ArrayFieldItemTemplate2 = getTemplate(
+  const ArrayFieldItemTemplate2 = getTemplate2(
     "ArrayFieldItemTemplate",
     registry,
     uiOptions
   );
-  const ArrayFieldTitleTemplate = getTemplate(
+  const ArrayFieldTitleTemplate = getTemplate2(
     "ArrayFieldTitleTemplate",
     registry,
     uiOptions
@@ -159,7 +112,8 @@ function ArrayFieldTemplate(props) {
         /* @__PURE__ */ jsx3(Col2, { xs: 3, className: "py-4 col-lg-3 col-3", children: /* @__PURE__ */ jsx3(
           AddButton2,
           {
-            className: "array-item-add",
+            id: buttonId(idSchema, "add"),
+            className: "rjsf-array-item-add",
             onClick: onAddClick,
             disabled: disabled || readonly,
             uiSchema,
@@ -335,8 +289,8 @@ function FieldHelpTemplate(props) {
 
 // src/FieldTemplate/FieldTemplate.tsx
 import {
-  getTemplate as getTemplate2,
-  getUiOptions as getUiOptions2
+  getTemplate as getTemplate3,
+  getUiOptions as getUiOptions3
 } from "@rjsf/utils";
 import Form3 from "react-bootstrap/Form";
 import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
@@ -362,8 +316,8 @@ function FieldTemplate({
   uiSchema,
   registry
 }) {
-  const uiOptions = getUiOptions2(uiSchema);
-  const WrapIfAdditionalTemplate2 = getTemplate2(
+  const uiOptions = getUiOptions3(uiSchema);
+  const WrapIfAdditionalTemplate2 = getTemplate3(
     "WrapIfAdditionalTemplate",
     registry,
     uiOptions
@@ -400,18 +354,31 @@ function FieldTemplate({
   );
 }
 
-// src/ObjectFieldTemplate/ObjectFieldTemplate.tsx
+// src/GridTemplate/GridTemplate.tsx
 import Row3 from "react-bootstrap/Row";
 import Col3 from "react-bootstrap/Col";
+import { jsx as jsx11 } from "react/jsx-runtime";
+function GridTemplate(props) {
+  const { children, column, ...rest } = props;
+  if (column) {
+    return /* @__PURE__ */ jsx11(Col3, { ...rest, children });
+  }
+  return /* @__PURE__ */ jsx11(Row3, { ...rest, children });
+}
+
+// src/ObjectFieldTemplate/ObjectFieldTemplate.tsx
+import Row4 from "react-bootstrap/Row";
+import Col4 from "react-bootstrap/Col";
 import Container2 from "react-bootstrap/Container";
 import {
+  buttonId as buttonId2,
   canExpand,
   descriptionId,
-  getTemplate as getTemplate3,
-  getUiOptions as getUiOptions3,
+  getTemplate as getTemplate4,
+  getUiOptions as getUiOptions4,
   titleId
 } from "@rjsf/utils";
-import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 function ObjectFieldTemplate({
   description,
   title,
@@ -426,9 +393,9 @@ function ObjectFieldTemplate({
   readonly,
   registry
 }) {
-  const uiOptions = getUiOptions3(uiSchema);
-  const TitleFieldTemplate = getTemplate3("TitleFieldTemplate", registry, uiOptions);
-  const DescriptionFieldTemplate = getTemplate3(
+  const uiOptions = getUiOptions4(uiSchema);
+  const TitleFieldTemplate = getTemplate4("TitleFieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = getTemplate4(
     "DescriptionFieldTemplate",
     registry,
     uiOptions
@@ -437,7 +404,7 @@ function ObjectFieldTemplate({
     ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
   return /* @__PURE__ */ jsxs6(Fragment2, { children: [
-    title && /* @__PURE__ */ jsx11(
+    title && /* @__PURE__ */ jsx12(
       TitleFieldTemplate,
       {
         id: titleId(idSchema),
@@ -448,7 +415,7 @@ function ObjectFieldTemplate({
         registry
       }
     ),
-    description && /* @__PURE__ */ jsx11(
+    description && /* @__PURE__ */ jsx12(
       DescriptionFieldTemplate,
       {
         id: descriptionId(idSchema),
@@ -459,16 +426,17 @@ function ObjectFieldTemplate({
       }
     ),
     /* @__PURE__ */ jsxs6(Container2, { fluid: true, className: "p-0", children: [
-      properties.map((element, index) => /* @__PURE__ */ jsx11(Row3, { style: { marginBottom: "10px" }, className: element.hidden ? "d-none" : void 0, children: /* @__PURE__ */ jsxs6(Col3, { xs: 12, children: [
+      properties.map((element, index) => /* @__PURE__ */ jsx12(Row4, { style: { marginBottom: "10px" }, className: element.hidden ? "d-none" : void 0, children: /* @__PURE__ */ jsxs6(Col4, { xs: 12, children: [
         " ",
         element.content
       ] }) }, index)),
-      canExpand(schema, uiSchema, formData) ? /* @__PURE__ */ jsx11(Row3, { children: /* @__PURE__ */ jsx11(Col3, { xs: { offset: 9, span: 3 }, className: "py-4", children: /* @__PURE__ */ jsx11(
+      canExpand(schema, uiSchema, formData) ? /* @__PURE__ */ jsx12(Row4, { children: /* @__PURE__ */ jsx12(Col4, { xs: { offset: 9, span: 3 }, className: "py-4", children: /* @__PURE__ */ jsx12(
         AddButton2,
         {
+          id: buttonId2(idSchema, "add"),
           onClick: onAddClick(schema),
           disabled: disabled || readonly,
-          className: "object-property-expand",
+          className: "rjsf-object-property-expand",
           uiSchema,
           registry
         }
@@ -480,39 +448,40 @@ function ObjectFieldTemplate({
 // src/SubmitButton/SubmitButton.tsx
 import Button3 from "react-bootstrap/Button";
 import { getSubmitButtonOptions } from "@rjsf/utils";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 function SubmitButton(props) {
   const { submitText, norender, props: submitButtonProps } = getSubmitButtonOptions(props.uiSchema);
   if (norender) {
     return null;
   }
-  return /* @__PURE__ */ jsx12("div", { children: /* @__PURE__ */ jsx12(Button3, { variant: "primary", type: "submit", ...submitButtonProps, children: submitText }) });
+  return /* @__PURE__ */ jsx13("div", { children: /* @__PURE__ */ jsx13(Button3, { variant: "primary", type: "submit", ...submitButtonProps, children: submitText }) });
 }
 
 // src/TitleField/TitleField.tsx
-import { getUiOptions as getUiOptions4 } from "@rjsf/utils";
-import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+import { getUiOptions as getUiOptions5 } from "@rjsf/utils";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 function TitleField({
   id,
   title,
   uiSchema
 }) {
-  const uiOptions = getUiOptions4(uiSchema);
+  const uiOptions = getUiOptions5(uiSchema);
   return /* @__PURE__ */ jsxs7("div", { id, className: "my-1", children: [
-    /* @__PURE__ */ jsx13("h5", { children: uiOptions.title || title }),
-    /* @__PURE__ */ jsx13("hr", { className: "border-0 bg-secondary", style: { height: "1px" } })
+    /* @__PURE__ */ jsx14("h5", { children: uiOptions.title || title }),
+    /* @__PURE__ */ jsx14("hr", { className: "border-0 bg-secondary", style: { height: "1px" } })
   ] });
 }
 
 // src/WrapIfAdditionalTemplate/WrapIfAdditionalTemplate.tsx
 import {
   ADDITIONAL_PROPERTY_FLAG,
+  buttonId as buttonId3,
   TranslatableString as TranslatableString4
 } from "@rjsf/utils";
-import Row4 from "react-bootstrap/Row";
-import Col4 from "react-bootstrap/Col";
+import Row5 from "react-bootstrap/Row";
+import Col5 from "react-bootstrap/Col";
 import Form4 from "react-bootstrap/Form";
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 function WrapIfAdditionalTemplate({
   classNames,
   style,
@@ -533,14 +502,14 @@ function WrapIfAdditionalTemplate({
   const keyLabel = translateString(TranslatableString4.KeyLabel, [label]);
   const additional = ADDITIONAL_PROPERTY_FLAG in schema;
   if (!additional) {
-    return /* @__PURE__ */ jsx14("div", { className: classNames, style, children });
+    return /* @__PURE__ */ jsx15("div", { className: classNames, style, children });
   }
   const handleBlur = ({ target }) => onKeyChange(target.value);
   const keyId = `${id}-key`;
-  return /* @__PURE__ */ jsxs8(Row4, { className: classNames, style, children: [
-    /* @__PURE__ */ jsx14(Col4, { xs: 5, children: /* @__PURE__ */ jsxs8(Form4.Group, { children: [
-      /* @__PURE__ */ jsx14(Form4.Label, { htmlFor: keyId, children: keyLabel }),
-      /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsxs8(Row5, { className: classNames, style, children: [
+    /* @__PURE__ */ jsx15(Col5, { xs: 5, children: /* @__PURE__ */ jsxs8(Form4.Group, { children: [
+      /* @__PURE__ */ jsx15(Form4.Label, { htmlFor: keyId, children: keyLabel }),
+      /* @__PURE__ */ jsx15(
         Form4.Control,
         {
           required,
@@ -553,11 +522,12 @@ function WrapIfAdditionalTemplate({
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsx14(Col4, { xs: 5, children }),
-    /* @__PURE__ */ jsx14(Col4, { xs: 2, className: "py-4 d-grid gap-2", children: /* @__PURE__ */ jsx14(
+    /* @__PURE__ */ jsx15(Col5, { xs: 5, children }),
+    /* @__PURE__ */ jsx15(Col5, { xs: 2, className: "py-4 d-grid gap-2", children: /* @__PURE__ */ jsx15(
       RemoveButton2,
       {
-        className: "w-100",
+        id: buttonId3(id, "remove"),
+        className: "rjsf-object-property-remove w-100",
         disabled: disabled || readonly,
         onClick: onDropPropertyClick(label),
         uiSchema,
@@ -586,6 +556,7 @@ function generateTemplates() {
     FieldErrorTemplate,
     FieldHelpTemplate,
     FieldTemplate,
+    GridTemplate,
     ObjectFieldTemplate,
     TitleFieldTemplate: TitleField,
     WrapIfAdditionalTemplate
@@ -597,12 +568,12 @@ var Templates_default = generateTemplates();
 import {
   ariaDescribedByIds as ariaDescribedByIds2,
   descriptionId as descriptionId2,
-  getTemplate as getTemplate4,
+  getTemplate as getTemplate5,
   labelValue,
   schemaRequiresTrueValue
 } from "@rjsf/utils";
 import Form5 from "react-bootstrap/Form";
-import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 function CheckboxWidget(props) {
   const {
     id,
@@ -621,7 +592,7 @@ function CheckboxWidget(props) {
     uiSchema
   } = props;
   const required = schemaRequiresTrueValue(schema);
-  const DescriptionFieldTemplate = getTemplate4(
+  const DescriptionFieldTemplate = getTemplate5(
     "DescriptionFieldTemplate",
     registry,
     options
@@ -636,7 +607,7 @@ function CheckboxWidget(props) {
       className: `checkbox ${disabled || readonly ? "disabled" : ""}`,
       "aria-describedby": ariaDescribedByIds2(id),
       children: [
-        !hideLabel && !!description && /* @__PURE__ */ jsx15(
+        !hideLabel && !!description && /* @__PURE__ */ jsx16(
           DescriptionFieldTemplate,
           {
             id: descriptionId2(id),
@@ -646,7 +617,7 @@ function CheckboxWidget(props) {
             registry
           }
         ),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx16(
           Form5.Check,
           {
             id,
@@ -677,7 +648,7 @@ import {
   enumOptionsValueForIndex,
   optionId
 } from "@rjsf/utils";
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 function CheckboxesWidget({ id, disabled, options, value, autofocus, readonly, required, onChange, onBlur, onFocus }) {
   const { enumOptions, enumDisabled, inline, emptyValue } = options;
   const checkboxesValues = Array.isArray(value) ? value : [value];
@@ -690,10 +661,10 @@ function CheckboxesWidget({ id, disabled, options, value, autofocus, readonly, r
   };
   const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
   const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex(target && target.value, enumOptions, emptyValue));
-  return /* @__PURE__ */ jsx16(Form6.Group, { children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+  return /* @__PURE__ */ jsx17(Form6.Group, { children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const checked = enumOptionsIsSelected(option.value, checkboxesValues);
     const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-    return /* @__PURE__ */ jsx16(
+    return /* @__PURE__ */ jsx17(
       Form6.Check,
       {
         inline,
@@ -724,7 +695,7 @@ import {
   enumOptionsValueForIndex as enumOptionsValueForIndex2,
   optionId as optionId2
 } from "@rjsf/utils";
-import { jsx as jsx17 } from "react/jsx-runtime";
+import { jsx as jsx18 } from "react/jsx-runtime";
 function RadioWidget({
   id,
   options,
@@ -741,10 +712,10 @@ function RadioWidget({
   const _onBlur = ({ target }) => onBlur(id, enumOptionsValueForIndex2(target && target.value, enumOptions, emptyValue));
   const _onFocus = ({ target }) => onFocus(id, enumOptionsValueForIndex2(target && target.value, enumOptions, emptyValue));
   const inline = Boolean(options && options.inline);
-  return /* @__PURE__ */ jsx17(Form7.Group, { className: "mb-0", children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+  return /* @__PURE__ */ jsx18(Form7.Group, { className: "mb-0", children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
     const checked = enumOptionsIsSelected2(option.value, value);
-    const radio = /* @__PURE__ */ jsx17(
+    const radio = /* @__PURE__ */ jsx18(
       Form7.Check,
       {
         inline,
@@ -770,7 +741,7 @@ function RadioWidget({
 // src/RangeWidget/RangeWidget.tsx
 import { rangeSpec } from "@rjsf/utils";
 import FormRange from "react-bootstrap/FormRange";
-import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs10 } from "react/jsx-runtime";
 function RangeWidget(props) {
   const { id, value, disabled, onChange, onBlur, onFocus, schema } = props;
   const _onChange = ({ target: { value: value2 } }) => onChange(value2);
@@ -787,8 +758,8 @@ function RangeWidget(props) {
     ...rangeSpec(schema)
   };
   return /* @__PURE__ */ jsxs10(Fragment3, { children: [
-    /* @__PURE__ */ jsx18(FormRange, { ...rangeProps }),
-    /* @__PURE__ */ jsx18("span", { className: "range-view", children: value })
+    /* @__PURE__ */ jsx19(FormRange, { ...rangeProps }),
+    /* @__PURE__ */ jsx19("span", { className: "range-view", children: value })
   ] });
 }
 
@@ -799,7 +770,7 @@ import {
   enumOptionsIndexForValue,
   enumOptionsValueForIndex as enumOptionsValueForIndex3
 } from "@rjsf/utils";
-import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs11 } from "react/jsx-runtime";
 function SelectWidget({
   schema,
   id,
@@ -852,10 +823,10 @@ function SelectWidget({
       },
       "aria-describedby": ariaDescribedByIds5(id),
       children: [
-        showPlaceholderOption && /* @__PURE__ */ jsx19("option", { value: "", children: placeholder }),
+        showPlaceholderOption && /* @__PURE__ */ jsx20("option", { value: "", children: placeholder }),
         enumOptions.map(({ value: value2, label }, i) => {
           const disabled2 = Array.isArray(enumDisabled) && enumDisabled.indexOf(value2) != -1;
-          return /* @__PURE__ */ jsx19("option", { id: label, value: String(i), disabled: disabled2, children: label }, i);
+          return /* @__PURE__ */ jsx20("option", { id: label, value: String(i), disabled: disabled2, children: label }, i);
         })
       ]
     }
@@ -866,7 +837,7 @@ function SelectWidget({
 import { ariaDescribedByIds as ariaDescribedByIds6 } from "@rjsf/utils";
 import FormControl from "react-bootstrap/FormControl";
 import InputGroup from "react-bootstrap/InputGroup";
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function TextareaWidget({
   id,
   placeholder,
@@ -883,7 +854,7 @@ function TextareaWidget({
   const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
   const _onBlur = ({ target }) => onBlur(id, target && target.value);
   const _onFocus = ({ target }) => onFocus(id, target && target.value);
-  return /* @__PURE__ */ jsx20(InputGroup, { children: /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx21(InputGroup, { children: /* @__PURE__ */ jsx21(
     FormControl,
     {
       id,
@@ -933,13 +904,13 @@ function generateForm() {
 var Form_default = generateForm();
 
 // src/index.ts
-var src_default = Form_default;
+var index_default = Form_default;
 export {
   Form_default as Form,
   Templates_default as Templates,
   Theme_default as Theme,
   Widgets_default as Widgets,
-  src_default as default,
+  index_default as default,
   generateForm,
   generateTemplates,
   generateTheme,