@rjsf/chakra-ui 5.11.1 → 5.12.0

package/dist/chakra-ui.esm.js

@@ -1,29 +1,24 @@
-import { withTheme } from '@rjsf/core';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { TranslatableString, getUiOptions, getTemplate, getInputProps, labelValue, examplesId, ariaDescribedByIds, errorId, helpId, titleId, descriptionId, canExpand, getSubmitButtonOptions, ADDITIONAL_PROPERTY_FLAG, parseDateString, toDateString, pad, schemaRequiresTrueValue, enumOptionsIndexForValue, enumOptionsValueForIndex, enumOptionsIsSelected, optionId, rangeSpec } from '@rjsf/utils';
-import { Button, HStack, Box, ButtonGroup, Grid, GridItem, shouldForwardProp, FormControl, FormLabel, Input, Text, Alert, AlertTitle, List, ListItem, ListIcon, IconButton, FormErrorMessage, FormHelperText, Heading, Divider, Checkbox, CheckboxGroup, Stack, RadioGroup, Radio, Slider, SliderTrack, SliderFilledTrack, SliderThumb, Textarea, NumberInput, NumberInputField, NumberInputStepper, NumberIncrementStepper, NumberDecrementStepper, ChakraProvider } from '@chakra-ui/react';
-import { AddIcon, WarningIcon, CopyIcon, ArrowDownIcon, ArrowUpIcon, DeleteIcon } from '@chakra-ui/icons';
-import { useMemo, memo, useState, useEffect } from 'react';
-import { Select } from 'chakra-react-select';
-import { Global, CacheProvider } from '@emotion/react';
-import createCache from '@emotion/cache';
-import weakMemoize from '@emotion/weak-memoize';
+// src/Form/Form.tsx
+import { withTheme } from "@rjsf/core";
 
+// src/AddButton/AddButton.tsx
+import { TranslatableString } from "@rjsf/utils";
+import { Button } from "@chakra-ui/react";
+import { AddIcon } from "@chakra-ui/icons";
+import { jsx } from "react/jsx-runtime";
 function AddButton({
   uiSchema,
   registry,
   ...props
 }) {
-  const {
-    translateString
-  } = registry;
-  return jsx(Button, {
-    leftIcon: jsx(AddIcon, {}),
-    ...props,
-    children: translateString(TranslatableString.AddItemButton)
-  });
+  const { translateString } = registry;
+  return /* @__PURE__ */ jsx(Button, { leftIcon: /* @__PURE__ */ jsx(AddIcon, {}), ...props, children: translateString(TranslatableString.AddItemButton) });
 }
 
+// src/ArrayFieldItemTemplate/ArrayFieldItemTemplate.tsx
+import { useMemo } from "react";
+import { Box, ButtonGroup, HStack } from "@chakra-ui/react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 function ArrayFieldItemTemplate(props) {
   const {
     children,
@@ -41,127 +36,134 @@ function ArrayFieldItemTemplate(props) {
     uiSchema,
     registry
   } = props;
-  const {
-    CopyButton,
-    MoveDownButton,
-    MoveUpButton,
-    RemoveButton
-  } = registry.templates.ButtonTemplates;
+  const { CopyButton: CopyButton2, MoveDownButton: MoveDownButton2, MoveUpButton: MoveUpButton2, RemoveButton: RemoveButton2 } = registry.templates.ButtonTemplates;
   const onCopyClick = useMemo(() => onCopyIndexClick(index), [index, onCopyIndexClick]);
   const onRemoveClick = useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
   const onArrowUpClick = useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
   const onArrowDownClick = useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
-  return jsxs(HStack, {
-    alignItems: 'flex-end',
-    py: 1,
-    children: [jsx(Box, {
-      w: '100%',
-      children: children
-    }), hasToolbar && jsx(Box, {
-      children: jsxs(ButtonGroup, {
-        isAttached: true,
-        mb: 1,
-        children: [(hasMoveUp || hasMoveDown) && jsx(MoveUpButton, {
+  return /* @__PURE__ */ jsxs(HStack, { alignItems: "flex-end", py: 1, children: [
+    /* @__PURE__ */ jsx2(Box, { w: "100%", children }),
+    hasToolbar && /* @__PURE__ */ jsx2(Box, { children: /* @__PURE__ */ jsxs(ButtonGroup, { isAttached: true, mb: 1, children: [
+      (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx2(
+        MoveUpButton2,
+        {
           disabled: disabled || readonly || !hasMoveUp,
           onClick: onArrowUpClick,
-          uiSchema: uiSchema,
-          registry: registry
-        }), (hasMoveUp || hasMoveDown) && jsx(MoveDownButton, {
+          uiSchema,
+          registry
+        }
+      ),
+      (hasMoveUp || hasMoveDown) && /* @__PURE__ */ jsx2(
+        MoveDownButton2,
+        {
           disabled: disabled || readonly || !hasMoveDown,
           onClick: onArrowDownClick,
-          uiSchema: uiSchema,
-          registry: registry
-        }), hasCopy && jsx(CopyButton, {
+          uiSchema,
+          registry
+        }
+      ),
+      hasCopy && /* @__PURE__ */ jsx2(
+        CopyButton2,
+        {
           disabled: disabled || readonly,
           onClick: onCopyClick,
-          uiSchema: uiSchema,
-          registry: registry
-        }), hasRemove && jsx(RemoveButton, {
+          uiSchema,
+          registry
+        }
+      ),
+      hasRemove && /* @__PURE__ */ jsx2(
+        RemoveButton2,
+        {
           disabled: disabled || readonly,
           onClick: onRemoveClick,
-          uiSchema: uiSchema,
-          registry: registry
-        })]
-      })
-    })]
-  });
+          uiSchema,
+          registry
+        }
+      )
+    ] }) })
+  ] });
 }
 
+// src/ArrayFieldTemplate/ArrayFieldTemplate.tsx
+import { Box as Box2, Grid, GridItem } from "@chakra-ui/react";
+import {
+  getTemplate,
+  getUiOptions
+} 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 { canAdd, disabled, idSchema, uiSchema, items, onAddClick, readonly, registry, required, schema, title } = props;
   const uiOptions = getUiOptions(uiSchema);
-  const ArrayFieldDescriptionTemplate = getTemplate('ArrayFieldDescriptionTemplate', registry, uiOptions);
-  const ArrayFieldItemTemplate = getTemplate('ArrayFieldItemTemplate', registry, uiOptions);
-  const ArrayFieldTitleTemplate = getTemplate('ArrayFieldTitleTemplate', registry, uiOptions);
-  // Button templates are not overridden in the uiSchema
+  const ArrayFieldDescriptionTemplate = getTemplate(
+    "ArrayFieldDescriptionTemplate",
+    registry,
+    uiOptions
+  );
+  const ArrayFieldItemTemplate2 = getTemplate(
+    "ArrayFieldItemTemplate",
+    registry,
+    uiOptions
+  );
+  const ArrayFieldTitleTemplate = getTemplate(
+    "ArrayFieldTitleTemplate",
+    registry,
+    uiOptions
+  );
   const {
-    ButtonTemplates: {
-      AddButton
-    }
+    ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
-  return jsxs(Box, {
-    children: [jsx(ArrayFieldTitleTemplate, {
-      idSchema: idSchema,
-      title: uiOptions.title || title,
-      schema: schema,
-      uiSchema: uiSchema,
-      required: required,
-      registry: registry
-    }), jsx(ArrayFieldDescriptionTemplate, {
-      idSchema: idSchema,
-      description: uiOptions.description || schema.description,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), jsxs(Grid, {
-      children: [jsx(GridItem, {
-        children: items.length > 0 && items.map(({
-          key,
-          ...itemProps
-        }) => jsx(ArrayFieldItemTemplate, {
-          ...itemProps
-        }, key))
-      }), canAdd && jsx(GridItem, {
-        justifySelf: 'flex-end',
-        children: jsx(Box, {
-          mt: 2,
-          children: jsx(AddButton, {
-            className: 'array-item-add',
-            onClick: onAddClick,
-            disabled: disabled || readonly,
-            uiSchema: uiSchema,
-            registry: registry
-          })
-        })
-      })]
-    }, `array-item-list-${idSchema.$id}`)]
-  });
+  return /* @__PURE__ */ jsxs2(Box2, { children: [
+    /* @__PURE__ */ jsx3(
+      ArrayFieldTitleTemplate,
+      {
+        idSchema,
+        title: uiOptions.title || title,
+        schema,
+        uiSchema,
+        required,
+        registry
+      }
+    ),
+    /* @__PURE__ */ jsx3(
+      ArrayFieldDescriptionTemplate,
+      {
+        idSchema,
+        description: uiOptions.description || schema.description,
+        schema,
+        uiSchema,
+        registry
+      }
+    ),
+    /* @__PURE__ */ jsxs2(Grid, { children: [
+      /* @__PURE__ */ jsx3(GridItem, { children: items.length > 0 && items.map(({ key, ...itemProps }) => /* @__PURE__ */ jsx3(ArrayFieldItemTemplate2, { ...itemProps }, key)) }),
+      canAdd && /* @__PURE__ */ jsx3(GridItem, { justifySelf: "flex-end", children: /* @__PURE__ */ jsx3(Box2, { mt: 2, children: /* @__PURE__ */ jsx3(
+        AddButton2,
+        {
+          className: "array-item-add",
+          onClick: onAddClick,
+          disabled: disabled || readonly,
+          uiSchema,
+          registry
+        }
+      ) }) })
+    ] }, `array-item-list-${idSchema.$id}`)
+  ] });
 }
 
-function getChakra({
-  uiSchema = {}
-}) {
-  const chakraProps = uiSchema['ui:options'] && uiSchema['ui:options'].chakra || {};
-  Object.keys(chakraProps).forEach(key => {
-    /**
-     * Leveraging `shouldForwardProp` to remove props
-     *
-     * This is a utility function that's used in `@chakra-ui/react`'s factory function.
-     * Normally, it prevents ChakraProps from being passed to the DOM.
-     * In this case we just want to delete the unknown props. So we flip the boolean.
-     */
+// src/BaseInputTemplate/BaseInputTemplate.tsx
+import { FormControl, FormLabel, Input } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds,
+  examplesId,
+  labelValue,
+  getInputProps
+} from "@rjsf/utils";
+
+// src/utils.ts
+import { shouldForwardProp } from "@chakra-ui/react";
+function getChakra({ uiSchema = {} }) {
+  const chakraProps = uiSchema["ui:options"] && uiSchema["ui:options"].chakra || {};
+  Object.keys(chakraProps).forEach((key) => {
     if (shouldForwardProp(key)) {
       delete chakraProps[key];
     }
@@ -169,6 +171,8 @@ function getChakra({
   return chakraProps;
 }
 
+// src/BaseInputTemplate/BaseInputTemplate.tsx
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function BaseInputTemplate(props) {
   const {
     id,
@@ -191,213 +195,176 @@ function BaseInputTemplate(props) {
     disabled
   } = props;
   const inputProps = getInputProps(schema, type, options);
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const _onChange = ({
-    target: {
-      value
-    }
-  }) => onChange(value === '' ? options.emptyValue : value);
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, value);
-  const _onFocus = ({
-    target: {
-      value
+  const chakraProps = getChakra({ uiSchema });
+  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, value2);
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, value2);
+  return /* @__PURE__ */ jsxs3(
+    FormControl,
+    {
+      mb: 1,
+      ...chakraProps,
+      isDisabled: disabled || readonly,
+      isRequired: required,
+      isReadOnly: readonly,
+      isInvalid: rawErrors && rawErrors.length > 0,
+      children: [
+        labelValue(
+          /* @__PURE__ */ jsx4(FormLabel, { htmlFor: id, id: `${id}-label`, children: label }),
+          hideLabel || !label
+        ),
+        /* @__PURE__ */ jsx4(
+          Input,
+          {
+            id,
+            name: id,
+            value: value || value === 0 ? value : "",
+            onChange: onChangeOverride || _onChange,
+            onBlur: _onBlur,
+            onFocus: _onFocus,
+            autoFocus: autofocus,
+            placeholder,
+            ...inputProps,
+            list: schema.examples ? examplesId(id) : void 0,
+            "aria-describedby": ariaDescribedByIds(id, !!schema.examples)
+          }
+        ),
+        Array.isArray(schema.examples) ? /* @__PURE__ */ jsx4("datalist", { id: examplesId(id), children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map((example) => {
+          return /* @__PURE__ */ jsx4("option", { value: example }, example);
+        }) }) : null
+      ]
     }
-  }) => onFocus(id, value);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    isInvalid: rawErrors && rawErrors.length > 0,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      id: `${id}-label`,
-      children: label
-    }), hideLabel || !label), jsx(Input, {
-      id: id,
-      name: id,
-      value: value || value === 0 ? value : '',
-      onChange: onChangeOverride || _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      autoFocus: autofocus,
-      placeholder: placeholder,
-      ...inputProps,
-      list: schema.examples ? examplesId(id) : undefined,
-      "aria-describedby": ariaDescribedByIds(id, !!schema.examples)
-    }), Array.isArray(schema.examples) ? jsx("datalist", {
-      id: examplesId(id),
-      children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map(example => {
-        return jsx("option", {
-          value: example
-        }, example);
-      })
-    }) : null]
-  });
+  );
 }
 
-function DescriptionField({
-  description,
-  id
-}) {
+// src/DescriptionField/DescriptionField.tsx
+import { Text } from "@chakra-ui/react";
+import { Fragment, jsx as jsx5 } from "react/jsx-runtime";
+function DescriptionField({ description, id }) {
   if (!description) {
     return null;
   }
-  if (typeof description === 'string') {
-    return jsx(Text, {
-      id: id,
-      mt: 2,
-      mb: 4,
-      children: description
-    });
+  if (typeof description === "string") {
+    return /* @__PURE__ */ jsx5(Text, { id, mt: 2, mb: 4, children: description });
   }
-  return jsx(Fragment, {
-    children: description
-  });
+  return /* @__PURE__ */ jsx5(Fragment, { children: description });
 }
 
+// src/ErrorList/ErrorList.tsx
+import { TranslatableString as TranslatableString2 } from "@rjsf/utils";
+import { List, ListIcon, ListItem, Alert, AlertTitle } from "@chakra-ui/react";
+import { WarningIcon } from "@chakra-ui/icons";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 function ErrorList({
   errors,
   registry
 }) {
-  const {
-    translateString
-  } = registry;
-  return jsxs(Alert, {
-    flexDirection: 'column',
-    alignItems: 'flex-start',
-    gap: 3,
-    status: 'error',
-    children: [jsx(AlertTitle, {
-      children: translateString(TranslatableString.ErrorsLabel)
-    }), jsx(List, {
-      children: errors.map((error, i) => jsxs(ListItem, {
-        children: [jsx(ListIcon, {
-          as: WarningIcon,
-          color: 'red.500'
-        }), error.stack]
-      }, i))
-    })]
-  });
+  const { translateString } = registry;
+  return /* @__PURE__ */ jsxs4(Alert, { flexDirection: "column", alignItems: "flex-start", gap: 3, status: "error", children: [
+    /* @__PURE__ */ jsx6(AlertTitle, { children: translateString(TranslatableString2.ErrorsLabel) }),
+    /* @__PURE__ */ jsx6(List, { children: errors.map((error, i) => /* @__PURE__ */ jsxs4(ListItem, { children: [
+      /* @__PURE__ */ jsx6(ListIcon, { as: WarningIcon, color: "red.500" }),
+      error.stack
+    ] }, i)) })
+  ] });
 }
 
+// src/IconButton/ChakraIconButton.tsx
+import { memo } from "react";
+import { IconButton } from "@chakra-ui/react";
+import { jsx as jsx7 } from "react/jsx-runtime";
 function ChakraIconButton(props) {
-  const {
-    icon,
-    iconType,
-    uiSchema,
-    registry,
-    ...otherProps
-  } = props;
-  return jsx(IconButton, {
-    "aria-label": props.title,
-    ...otherProps,
-    icon: icon
-  });
+  const { icon, iconType, uiSchema, registry, ...otherProps } = props;
+  return /* @__PURE__ */ jsx7(IconButton, { "aria-label": props.title, ...otherProps, icon });
 }
-ChakraIconButton.displayName = 'ChakraIconButton';
-var ChakraIconButton$1 = /*#__PURE__*/memo(ChakraIconButton);
+ChakraIconButton.displayName = "ChakraIconButton";
+var ChakraIconButton_default = memo(ChakraIconButton);
 
+// src/IconButton/IconButton.tsx
+import { TranslatableString as TranslatableString3 } from "@rjsf/utils";
+import { ArrowUpIcon, ArrowDownIcon, CopyIcon, DeleteIcon } from "@chakra-ui/icons";
+import { jsx as jsx8 } from "react/jsx-runtime";
 function CopyButton(props) {
   const {
-    registry: {
-      translateString
-    }
+    registry: { translateString }
   } = props;
-  return jsx(ChakraIconButton$1, {
-    title: translateString(TranslatableString.CopyButton),
-    ...props,
-    icon: jsx(CopyIcon, {})
-  });
+  return /* @__PURE__ */ jsx8(ChakraIconButton_default, { title: translateString(TranslatableString3.CopyButton), ...props, icon: /* @__PURE__ */ jsx8(CopyIcon, {}) });
 }
 function MoveDownButton(props) {
   const {
-    registry: {
-      translateString
-    }
+    registry: { translateString }
   } = props;
-  return jsx(ChakraIconButton$1, {
-    title: translateString(TranslatableString.MoveDownButton),
-    ...props,
-    icon: jsx(ArrowDownIcon, {})
-  });
+  return /* @__PURE__ */ jsx8(
+    ChakraIconButton_default,
+    {
+      title: translateString(TranslatableString3.MoveDownButton),
+      ...props,
+      icon: /* @__PURE__ */ jsx8(ArrowDownIcon, {})
+    }
+  );
 }
 function MoveUpButton(props) {
   const {
-    registry: {
-      translateString
-    }
+    registry: { translateString }
   } = props;
-  return jsx(ChakraIconButton$1, {
-    title: translateString(TranslatableString.MoveUpButton),
-    ...props,
-    icon: jsx(ArrowUpIcon, {})
-  });
+  return /* @__PURE__ */ jsx8(
+    ChakraIconButton_default,
+    {
+      title: translateString(TranslatableString3.MoveUpButton),
+      ...props,
+      icon: /* @__PURE__ */ jsx8(ArrowUpIcon, {})
+    }
+  );
 }
 function RemoveButton(props) {
   const {
-    registry: {
-      translateString
-    }
+    registry: { translateString }
   } = props;
-  return jsx(ChakraIconButton$1, {
-    title: translateString(TranslatableString.RemoveButton),
-    ...props,
-    icon: jsx(DeleteIcon, {})
-  });
+  return /* @__PURE__ */ jsx8(
+    ChakraIconButton_default,
+    {
+      title: translateString(TranslatableString3.RemoveButton),
+      ...props,
+      icon: /* @__PURE__ */ jsx8(DeleteIcon, {})
+    }
+  );
 }
 
-/** The `FieldErrorTemplate` component renders the errors local to the particular field
- *
- * @param props - The `FieldErrorProps` for the errors being rendered
- */
+// src/FieldErrorTemplate/FieldErrorTemplate.tsx
+import { errorId } from "@rjsf/utils";
+import { FormErrorMessage, List as List2, ListItem as ListItem2 } from "@chakra-ui/react";
+import { jsx as jsx9 } from "react/jsx-runtime";
 function FieldErrorTemplate(props) {
-  const {
-    errors = [],
-    idSchema
-  } = props;
+  const { errors = [], idSchema } = props;
   if (errors.length === 0) {
     return null;
   }
   const id = errorId(idSchema);
-  return jsx(List, {
-    children: errors.map((error, i) => {
-      return jsx(ListItem, {
-        children: jsx(FormErrorMessage, {
-          id: id,
-          children: error
-        })
-      }, i);
-    })
-  });
+  return /* @__PURE__ */ jsx9(List2, { children: errors.map((error, i) => {
+    return /* @__PURE__ */ jsx9(ListItem2, { children: /* @__PURE__ */ jsx9(FormErrorMessage, { id, children: error }) }, i);
+  }) });
 }
 
-/** The `FieldHelpTemplate` component renders any help desired for a field
- *
- * @param props - The `FieldHelpProps` to be rendered
- */
+// src/FieldHelpTemplate/FieldHelpTemplate.tsx
+import { helpId } from "@rjsf/utils";
+import { FormHelperText } from "@chakra-ui/react";
+import { jsx as jsx10 } from "react/jsx-runtime";
 function FieldHelpTemplate(props) {
-  const {
-    idSchema,
-    help
-  } = props;
+  const { idSchema, help } = props;
   if (!help) {
     return null;
   }
   const id = helpId(idSchema);
-  return jsx(FormHelperText, {
-    id: id,
-    children: help
-  });
+  return /* @__PURE__ */ jsx10(FormHelperText, { id, children: help });
 }
 
+// src/FieldTemplate/FieldTemplate.tsx
+import {
+  getTemplate as getTemplate2,
+  getUiOptions as getUiOptions2
+} from "@rjsf/utils";
+import { Text as Text2, FormControl as FormControl2 } from "@chakra-ui/react";
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
 function FieldTemplate(props) {
   const {
     id,
@@ -421,40 +388,50 @@ function FieldTemplate(props) {
     schema,
     uiSchema
   } = props;
-  const uiOptions = getUiOptions(uiSchema);
-  const WrapIfAdditionalTemplate = getTemplate('WrapIfAdditionalTemplate', registry, uiOptions);
+  const uiOptions = getUiOptions2(uiSchema);
+  const WrapIfAdditionalTemplate2 = getTemplate2(
+    "WrapIfAdditionalTemplate",
+    registry,
+    uiOptions
+  );
   if (hidden) {
-    return jsx("div", {
-      style: {
-        display: 'none'
-      },
-      children: children
-    });
+    return /* @__PURE__ */ jsx11("div", { style: { display: "none" }, children });
   }
-  return jsx(WrapIfAdditionalTemplate, {
-    classNames: classNames,
-    style: style,
-    disabled: disabled,
-    id: id,
-    label: label,
-    onDropPropertyClick: onDropPropertyClick,
-    onKeyChange: onKeyChange,
-    readonly: readonly,
-    required: required,
-    schema: schema,
-    uiSchema: uiSchema,
-    registry: registry,
-    children: jsxs(FormControl, {
-      isRequired: required,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [children, displayLabel && rawDescription ? jsx(Text, {
-        mt: 2,
-        children: description
-      }) : null, errors, help]
-    })
-  });
+  return /* @__PURE__ */ jsx11(
+    WrapIfAdditionalTemplate2,
+    {
+      classNames,
+      style,
+      disabled,
+      id,
+      label,
+      onDropPropertyClick,
+      onKeyChange,
+      readonly,
+      required,
+      schema,
+      uiSchema,
+      registry,
+      children: /* @__PURE__ */ jsxs5(FormControl2, { isRequired: required, isInvalid: rawErrors && rawErrors.length > 0, children: [
+        children,
+        displayLabel && rawDescription ? /* @__PURE__ */ jsx11(Text2, { mt: 2, children: description }) : null,
+        errors,
+        help
+      ] })
+    }
+  );
 }
 
+// src/ObjectFieldTemplate/ObjectFieldTemplate.tsx
+import { Grid as Grid2, GridItem as GridItem2 } from "@chakra-ui/react";
+import {
+  canExpand,
+  descriptionId,
+  getTemplate as getTemplate3,
+  getUiOptions as getUiOptions3,
+  titleId
+} from "@rjsf/utils";
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
 function ObjectFieldTemplate(props) {
   const {
     description,
@@ -470,85 +447,88 @@ function ObjectFieldTemplate(props) {
     onAddClick,
     registry
   } = props;
-  const uiOptions = getUiOptions(uiSchema);
-  const TitleFieldTemplate = getTemplate('TitleFieldTemplate', registry, uiOptions);
-  const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, uiOptions);
-  // Button templates are not overridden in the uiSchema
+  const uiOptions = getUiOptions3(uiSchema);
+  const TitleFieldTemplate = getTemplate3("TitleFieldTemplate", registry, uiOptions);
+  const DescriptionFieldTemplate = getTemplate3(
+    "DescriptionFieldTemplate",
+    registry,
+    uiOptions
+  );
   const {
-    ButtonTemplates: {
-      AddButton
-    }
+    ButtonTemplates: { AddButton: AddButton2 }
   } = registry.templates;
-  return jsxs(Fragment, {
-    children: [title && jsx(TitleFieldTemplate, {
-      id: titleId(idSchema),
-      title: title,
-      required: required,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), description && jsx(DescriptionFieldTemplate, {
-      id: descriptionId(idSchema),
-      description: description,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), jsxs(Grid, {
-      gap: description ? 2 : 6,
-      mb: 4,
-      children: [properties.map((element, index) => element.hidden ? element.content : jsx(GridItem, {
-        children: element.content
-      }, `${idSchema.$id}-${element.name}-${index}`)), canExpand(schema, uiSchema, formData) && jsx(GridItem, {
-        justifySelf: 'flex-end',
-        children: jsx(AddButton, {
-          className: 'object-property-expand',
+  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
+    title && /* @__PURE__ */ jsx12(
+      TitleFieldTemplate,
+      {
+        id: titleId(idSchema),
+        title,
+        required,
+        schema,
+        uiSchema,
+        registry
+      }
+    ),
+    description && /* @__PURE__ */ jsx12(
+      DescriptionFieldTemplate,
+      {
+        id: descriptionId(idSchema),
+        description,
+        schema,
+        uiSchema,
+        registry
+      }
+    ),
+    /* @__PURE__ */ jsxs6(Grid2, { gap: description ? 2 : 6, mb: 4, children: [
+      properties.map(
+        (element, index) => element.hidden ? element.content : /* @__PURE__ */ jsx12(GridItem2, { children: element.content }, `${idSchema.$id}-${element.name}-${index}`)
+      ),
+      canExpand(schema, uiSchema, formData) && /* @__PURE__ */ jsx12(GridItem2, { justifySelf: "flex-end", children: /* @__PURE__ */ jsx12(
+        AddButton2,
+        {
+          className: "object-property-expand",
           onClick: onAddClick(schema),
           disabled: disabled || readonly,
-          uiSchema: uiSchema,
-          registry: registry
-        })
-      })]
-    })]
-  });
+          uiSchema,
+          registry
+        }
+      ) })
+    ] })
+  ] });
 }
 
-function SubmitButton({
-  uiSchema
-}) {
-  const {
-    submitText,
-    norender,
-    props: submitButtonProps
-  } = getSubmitButtonOptions(uiSchema);
+// src/SubmitButton/SubmitButton.tsx
+import { Box as Box3, Button as Button2 } from "@chakra-ui/react";
+import { getSubmitButtonOptions } from "@rjsf/utils";
+import { jsx as jsx13 } from "react/jsx-runtime";
+function SubmitButton({ uiSchema }) {
+  const { submitText, norender, props: submitButtonProps } = getSubmitButtonOptions(uiSchema);
   if (norender) {
     return null;
   }
-  return jsx(Box, {
-    marginTop: 3,
-    children: jsx(Button, {
-      type: 'submit',
-      variant: 'solid',
-      ...submitButtonProps,
-      children: submitText
-    })
-  });
+  return /* @__PURE__ */ jsx13(Box3, { marginTop: 3, children: /* @__PURE__ */ jsx13(Button2, { type: "submit", variant: "solid", ...submitButtonProps, children: submitText }) });
 }
 
+// src/TitleField/TitleField.tsx
+import { Box as Box4, Divider, Heading } from "@chakra-ui/react";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 function TitleField({
   id,
   title
 }) {
-  return jsxs(Box, {
-    id: id,
-    mt: 1,
-    mb: 4,
-    children: [jsx(Heading, {
-      as: 'h5',
-      children: title
-    }), jsx(Divider, {})]
-  });
+  return /* @__PURE__ */ jsxs7(Box4, { id, mt: 1, mb: 4, children: [
+    /* @__PURE__ */ jsx14(Heading, { as: "h5", children: title }),
+    /* @__PURE__ */ jsx14(Divider, {})
+  ] });
 }
 
+// src/WrapIfAdditionalTemplate/WrapIfAdditionalTemplate.tsx
+import {
+  ADDITIONAL_PROPERTY_FLAG,
+  TranslatableString as TranslatableString4
+} from "@rjsf/utils";
+import { FormControl as FormControl3, FormLabel as FormLabel2, Grid as Grid3, GridItem as GridItem3, Input as Input2 } from "@chakra-ui/react";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 function WrapIfAdditionalTemplate(props) {
   const {
     children,
@@ -565,61 +545,44 @@ function WrapIfAdditionalTemplate(props) {
     schema,
     uiSchema
   } = props;
-  const {
-    templates,
-    translateString
-  } = registry;
-  // Button templates are not overridden in the uiSchema
-  const {
-    RemoveButton
-  } = templates.ButtonTemplates;
-  const keyLabel = translateString(TranslatableString.KeyLabel, [label]);
-  const additional = (ADDITIONAL_PROPERTY_FLAG in schema);
+  const { templates, translateString } = registry;
+  const { RemoveButton: RemoveButton2 } = templates.ButtonTemplates;
+  const keyLabel = translateString(TranslatableString4.KeyLabel, [label]);
+  const additional = ADDITIONAL_PROPERTY_FLAG in schema;
   if (!additional) {
-    return jsx("div", {
-      className: classNames,
-      style: style,
-      children: children
-    });
+    return /* @__PURE__ */ jsx15("div", { className: classNames, style, children });
   }
-  const handleBlur = ({
-    target
-  }) => onKeyChange(target.value);
-  return jsxs(Grid, {
-    className: classNames,
-    style: style,
-    alignItems: 'center',
-    gap: 2,
-    children: [jsx(GridItem, {
-      children: jsxs(FormControl, {
-        isRequired: required,
-        children: [jsx(FormLabel, {
-          htmlFor: `${id}-key`,
-          id: `${id}-key-label`,
-          children: keyLabel
-        }), jsx(Input, {
+  const handleBlur = ({ target }) => onKeyChange(target.value);
+  return /* @__PURE__ */ jsxs8(Grid3, { className: classNames, style, alignItems: "center", gap: 2, children: [
+    /* @__PURE__ */ jsx15(GridItem3, { children: /* @__PURE__ */ jsxs8(FormControl3, { isRequired: required, children: [
+      /* @__PURE__ */ jsx15(FormLabel2, { htmlFor: `${id}-key`, id: `${id}-key-label`, children: keyLabel }),
+      /* @__PURE__ */ jsx15(
+        Input2,
+        {
           defaultValue: label,
           disabled: disabled || readonly,
           id: `${id}-key`,
           name: `${id}-key`,
-          onBlur: !readonly ? handleBlur : undefined,
-          type: 'text',
+          onBlur: !readonly ? handleBlur : void 0,
+          type: "text",
           mb: 1
-        })]
-      })
-    }), jsx(GridItem, {
-      children: children
-    }), jsx(GridItem, {
-      children: jsx(RemoveButton, {
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsx15(GridItem3, { children }),
+    /* @__PURE__ */ jsx15(GridItem3, { children: /* @__PURE__ */ jsx15(
+      RemoveButton2,
+      {
         disabled: disabled || readonly,
         onClick: onDropPropertyClick(label),
-        uiSchema: uiSchema,
-        registry: registry
-      })
-    })]
-  }, `${id}-key`);
+        uiSchema,
+        registry
+      }
+    ) })
+  ] }, `${id}-key`);
 }
 
+// src/Templates/Templates.ts
 function generateTemplates() {
   return {
     ArrayFieldItemTemplate,
@@ -643,59 +606,52 @@ function generateTemplates() {
     WrapIfAdditionalTemplate
   };
 }
-var Templates = /*#__PURE__*/generateTemplates();
+var Templates_default = generateTemplates();
 
-const rangeOptions = (start, stop) => {
+// src/AltDateWidget/AltDateWidget.tsx
+import { useEffect, useState } from "react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds2,
+  pad,
+  parseDateString,
+  toDateString,
+  TranslatableString as TranslatableString5
+} from "@rjsf/utils";
+import { Box as Box5, Button as Button3 } from "@chakra-ui/react";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+var rangeOptions = (start, stop) => {
   const options = [];
   for (let i = start; i <= stop; i++) {
-    options.push({
-      value: i,
-      label: pad(i, 2)
-    });
+    options.push({ value: i, label: pad(i, 2) });
   }
   return options;
 };
 function DateElement(props) {
-  const {
-    SelectWidget
-  } = props.registry.widgets;
-  const value = props.value ? props.value : undefined;
-  return jsx(SelectWidget, {
-    ...props,
-    label: '',
-    className: 'form-control',
-    onChange: elemValue => props.select(props.type, elemValue),
-    options: {
-      enumOptions: rangeOptions(props.range[0], props.range[1])
-    },
-    placeholder: props.type,
-    schema: {
-      type: 'integer'
-    },
-    value: value,
-    "aria-describedby": ariaDescribedByIds(props.name)
-  });
+  const { SelectWidget: SelectWidget2 } = props.registry.widgets;
+  const value = props.value ? props.value : void 0;
+  return /* @__PURE__ */ jsx16(
+    SelectWidget2,
+    {
+      ...props,
+      label: "",
+      className: "form-control",
+      onChange: (elemValue) => props.select(props.type, elemValue),
+      options: {
+        enumOptions: rangeOptions(props.range[0], props.range[1])
+      },
+      placeholder: props.type,
+      schema: { type: "integer" },
+      value,
+      "aria-describedby": ariaDescribedByIds2(props.name)
+    }
+  );
 }
-const readyForChange = state => {
-  return Object.keys(state).every(key => typeof state[key] !== 'undefined' && state[key] !== -1);
+var readyForChange = (state) => {
+  return Object.keys(state).every((key) => typeof state[key] !== "undefined" && state[key] !== -1);
 };
 function AltDateWidget(props) {
-  const {
-    autofocus,
-    disabled,
-    id,
-    onBlur,
-    onChange,
-    onFocus,
-    options,
-    readonly,
-    registry,
-    showTime,
-    value
-  } = props;
-  const {
-    translateString
-  } = registry;
+  const { autofocus, disabled, id, onBlur, onChange, onFocus, options, readonly, registry, showTime, value } = props;
+  const { translateString } = registry;
   const [state, setState] = useState(parseDateString(value, showTime));
   useEffect(() => {
     setState(parseDateString(value, showTime));
@@ -703,7 +659,7 @@ function AltDateWidget(props) {
   const handleChange = (property, nextValue) => {
     const nextState = {
       ...state,
-      [property]: typeof nextValue === 'undefined' ? -1 : nextValue
+      [property]: typeof nextValue === "undefined" ? -1 : nextValue
     };
     if (readyForChange(nextState)) {
       onChange(toDateString(nextState, showTime));
@@ -711,98 +667,63 @@ function AltDateWidget(props) {
       setState(nextState);
     }
   };
-  const handleNow = event => {
+  const handleNow = (event) => {
     event.preventDefault();
     if (disabled || readonly) {
       return;
     }
-    const nextState = parseDateString(new Date().toJSON(), showTime);
+    const nextState = parseDateString((/* @__PURE__ */ new Date()).toJSON(), showTime);
     onChange(toDateString(nextState, showTime));
   };
-  const handleClear = event => {
+  const handleClear = (event) => {
     event.preventDefault();
     if (disabled || readonly) {
       return;
     }
-    onChange(undefined);
+    onChange(void 0);
   };
   const dateElementProps = () => {
-    const {
-      year,
-      month,
-      day,
-      hour,
-      minute,
-      second
-    } = state;
-    const data = [{
-      type: 'year',
-      range: options.yearsRange,
-      value: year
-    }, {
-      type: 'month',
-      range: [1, 12],
-      value: month
-    }, {
-      type: 'day',
-      range: [1, 31],
-      value: day
-    }];
+    const { year, month, day, hour, minute, second } = state;
+    const data = [
+      { type: "year", range: options.yearsRange, value: year },
+      { type: "month", range: [1, 12], value: month },
+      { type: "day", range: [1, 31], value: day }
+    ];
     if (showTime) {
-      data.push({
-        type: 'hour',
-        range: [0, 23],
-        value: hour
-      }, {
-        type: 'minute',
-        range: [0, 59],
-        value: minute
-      }, {
-        type: 'second',
-        range: [0, 59],
-        value: second
-      });
+      data.push(
+        { type: "hour", range: [0, 23], value: hour },
+        { type: "minute", range: [0, 59], value: minute },
+        { type: "second", range: [0, 59], value: second }
+      );
     }
     return data;
   };
-  return jsxs(Box, {
-    children: [jsx(Box, {
-      display: 'flex',
-      flexWrap: 'wrap',
-      alignItems: 'center',
-      children: dateElementProps().map((elemProps, i) => {
-        const elemId = id + '_' + elemProps.type;
-        return jsx(Box, {
-          mr: '2',
-          mb: '2',
-          children: jsx(DateElement, {
-            ...props,
-            ...elemProps,
-            autofocus: autofocus && i === 0,
-            disabled: disabled,
-            id: elemId,
-            name: id,
-            onBlur: onBlur,
-            onFocus: onFocus,
-            readonly: readonly,
-            registry: registry,
-            select: handleChange,
-            value: elemProps.value < 0 ? '' : elemProps.value
-          })
-        }, elemId);
-      })
-    }), jsxs(Box, {
-      display: 'flex',
-      children: [!options.hideNowButton && jsx(Button, {
-        onClick: e => handleNow(e),
-        mr: '2',
-        children: translateString(TranslatableString.NowLabel)
-      }), !options.hideClearButton && jsx(Button, {
-        onClick: e => handleClear(e),
-        children: translateString(TranslatableString.ClearLabel)
-      })]
-    })]
-  });
+  return /* @__PURE__ */ jsxs9(Box5, { children: [
+    /* @__PURE__ */ jsx16(Box5, { display: "flex", flexWrap: "wrap", alignItems: "center", children: dateElementProps().map((elemProps, i) => {
+      const elemId = id + "_" + elemProps.type;
+      return /* @__PURE__ */ jsx16(Box5, { mr: "2", mb: "2", children: /* @__PURE__ */ jsx16(
+        DateElement,
+        {
+          ...props,
+          ...elemProps,
+          autofocus: autofocus && i === 0,
+          disabled,
+          id: elemId,
+          name: id,
+          onBlur,
+          onFocus,
+          readonly,
+          registry,
+          select: handleChange,
+          value: elemProps.value < 0 ? "" : elemProps.value
+        }
+      ) }, elemId);
+    }) }),
+    /* @__PURE__ */ jsxs9(Box5, { display: "flex", children: [
+      !options.hideNowButton && /* @__PURE__ */ jsx16(Button3, { onClick: (e) => handleNow(e), mr: "2", children: translateString(TranslatableString5.NowLabel) }),
+      !options.hideClearButton && /* @__PURE__ */ jsx16(Button3, { onClick: (e) => handleClear(e), children: translateString(TranslatableString5.ClearLabel) })
+    ] })
+  ] });
 }
 AltDateWidget.defaultProps = {
   autofocus: false,
@@ -810,24 +731,33 @@ AltDateWidget.defaultProps = {
   readonly: false,
   showTime: false,
   options: {
-    yearsRange: [1900, /*#__PURE__*/new Date().getFullYear() + 2]
+    yearsRange: [1900, (/* @__PURE__ */ new Date()).getFullYear() + 2]
   }
 };
+var AltDateWidget_default = AltDateWidget;
 
+// src/AltDateTimeWidget/AltDateTimeWidget.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
 function AltDateTimeWidget(props) {
-  const {
-    AltDateWidget
-  } = props.registry.widgets;
-  return jsx(AltDateWidget, {
-    ...props,
-    showTime: true
-  });
+  const { AltDateWidget: AltDateWidget2 } = props.registry.widgets;
+  return /* @__PURE__ */ jsx17(AltDateWidget2, { ...props, showTime: true });
 }
 AltDateTimeWidget.defaultProps = {
-  ...AltDateWidget.defaultProps,
+  ...AltDateWidget_default.defaultProps,
   showTime: true
 };
+var AltDateTimeWidget_default = AltDateTimeWidget;
 
+// src/CheckboxWidget/CheckboxWidget.tsx
+import { Checkbox, FormControl as FormControl4, Text as Text3 } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds3,
+  descriptionId as descriptionId2,
+  getTemplate as getTemplate4,
+  labelValue as labelValue2,
+  schemaRequiresTrueValue
+} from "@rjsf/utils";
+import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 function CheckboxWidget(props) {
   const {
     id,
@@ -844,56 +774,56 @@ function CheckboxWidget(props) {
     uiSchema,
     schema
   } = props;
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  // Because an unchecked checkbox will cause html5 validation to fail, only add
-  // the "required" attribute if the field value must be "true", due to the
-  // "const" or "enum" keywords
+  const chakraProps = getChakra({ uiSchema });
   const required = schemaRequiresTrueValue(schema);
-  const DescriptionFieldTemplate = getTemplate('DescriptionFieldTemplate', registry, options);
+  const DescriptionFieldTemplate = getTemplate4(
+    "DescriptionFieldTemplate",
+    registry,
+    options
+  );
   const description = options.description || schema.description;
-  const _onChange = ({
-    target: {
-      checked
-    }
-  }) => onChange(checked);
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, value);
-  const _onFocus = ({
-    target: {
-      value
-    }
-  }) => onFocus(id, value);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isRequired: required,
-    children: [!hideLabel && !!description && jsx(DescriptionFieldTemplate, {
-      id: descriptionId(id),
-      description: description,
-      schema: schema,
-      uiSchema: uiSchema,
-      registry: registry
-    }), jsx(Checkbox, {
-      id: id,
-      name: id,
-      isChecked: typeof value === 'undefined' ? false : value,
-      isDisabled: disabled || readonly,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": ariaDescribedByIds(id),
-      children: labelValue(jsx(Text, {
-        children: label
-      }), hideLabel || !label)
-    })]
-  });
+  const _onChange = ({ target: { checked } }) => onChange(checked);
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, value2);
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, value2);
+  return /* @__PURE__ */ jsxs10(FormControl4, { mb: 1, ...chakraProps, isRequired: required, children: [
+    !hideLabel && !!description && /* @__PURE__ */ jsx18(
+      DescriptionFieldTemplate,
+      {
+        id: descriptionId2(id),
+        description,
+        schema,
+        uiSchema,
+        registry
+      }
+    ),
+    /* @__PURE__ */ jsx18(
+      Checkbox,
+      {
+        id,
+        name: id,
+        isChecked: typeof value === "undefined" ? false : value,
+        isDisabled: disabled || readonly,
+        onChange: _onChange,
+        onBlur: _onBlur,
+        onFocus: _onFocus,
+        "aria-describedby": ariaDescribedByIds3(id),
+        children: labelValue2(/* @__PURE__ */ jsx18(Text3, { children: label }), hideLabel || !label)
+      }
+    )
+  ] });
 }
 
+// src/CheckboxesWidget/CheckboxesWidget.tsx
+import { CheckboxGroup, Checkbox as Checkbox2, FormLabel as FormLabel3, FormControl as FormControl5, Text as Text4, Stack } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds4,
+  enumOptionsIndexForValue,
+  enumOptionsIsSelected,
+  enumOptionsValueForIndex,
+  labelValue as labelValue3,
+  optionId
+} from "@rjsf/utils";
+import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
 function CheckboxesWidget(props) {
   const {
     id,
@@ -910,65 +840,68 @@ function CheckboxesWidget(props) {
     uiSchema,
     rawErrors = []
   } = props;
-  const {
-    enumOptions,
-    enumDisabled,
-    emptyValue
-  } = options;
-  const chakraProps = getChakra({
-    uiSchema
-  });
+  const { enumOptions, enumDisabled, emptyValue } = options;
+  const chakraProps = getChakra({ uiSchema });
   const checkboxesValues = Array.isArray(value) ? value : [value];
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
-  const _onFocus = ({
-    target: {
-      value
-    }
-  }) => onFocus(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, enumOptionsValueForIndex(value2, enumOptions, emptyValue));
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, enumOptionsValueForIndex(value2, enumOptions, emptyValue));
   const row = options ? options.inline : false;
   const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, true);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    isInvalid: rawErrors && rawErrors.length > 0,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      id: `${id}-label`,
-      children: label
-    }), hideLabel || !label), jsx(CheckboxGroup, {
-      onChange: option => onChange(enumOptionsValueForIndex(option, enumOptions, emptyValue)),
-      defaultValue: selectedIndexes,
-      "aria-describedby": ariaDescribedByIds(id),
-      children: jsx(Stack, {
-        direction: row ? 'row' : 'column',
-        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 jsx(Checkbox, {
-            id: optionId(id, index),
-            name: id,
-            value: String(index),
-            isChecked: checked,
-            isDisabled: disabled || itemDisabled || readonly,
-            onBlur: _onBlur,
-            onFocus: _onFocus,
-            children: option.label && jsx(Text, {
-              children: option.label
-            })
-          }, index);
-        })
-      })
-    })]
-  });
+  return /* @__PURE__ */ jsxs11(
+    FormControl5,
+    {
+      mb: 1,
+      ...chakraProps,
+      isDisabled: disabled || readonly,
+      isRequired: required,
+      isReadOnly: readonly,
+      isInvalid: rawErrors && rawErrors.length > 0,
+      children: [
+        labelValue3(
+          /* @__PURE__ */ jsx19(FormLabel3, { htmlFor: id, id: `${id}-label`, children: label }),
+          hideLabel || !label
+        ),
+        /* @__PURE__ */ jsx19(
+          CheckboxGroup,
+          {
+            onChange: (option) => onChange(enumOptionsValueForIndex(option, enumOptions, emptyValue)),
+            defaultValue: selectedIndexes,
+            "aria-describedby": ariaDescribedByIds4(id),
+            children: /* @__PURE__ */ jsx19(Stack, { direction: row ? "row" : "column", 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__ */ jsx19(
+                Checkbox2,
+                {
+                  id: optionId(id, index),
+                  name: id,
+                  value: String(index),
+                  isChecked: checked,
+                  isDisabled: disabled || itemDisabled || readonly,
+                  onBlur: _onBlur,
+                  onFocus: _onFocus,
+                  children: option.label && /* @__PURE__ */ jsx19(Text4, { children: option.label })
+                },
+                index
+              );
+            }) })
+          }
+        )
+      ]
+    }
+  );
 }
 
+// src/RadioWidget/RadioWidget.tsx
+import { FormControl as FormControl6, FormLabel as FormLabel4, Radio, RadioGroup, Stack as Stack2 } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds5,
+  enumOptionsIndexForValue as enumOptionsIndexForValue2,
+  enumOptionsValueForIndex as enumOptionsValueForIndex2,
+  labelValue as labelValue4,
+  optionId as optionId2
+} from "@rjsf/utils";
+import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
 function RadioWidget({
   id,
   options,
@@ -983,60 +916,53 @@ function RadioWidget({
   onFocus,
   uiSchema
 }) {
-  const {
-    enumOptions,
-    enumDisabled,
-    emptyValue
-  } = options;
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const _onChange = nextValue => onChange(enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
-  const _onFocus = ({
-    target: {
-      value
-    }
-  }) => onFocus(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
+  const { enumOptions, enumDisabled, emptyValue } = options;
+  const chakraProps = getChakra({ uiSchema });
+  const _onChange = (nextValue) => onChange(enumOptionsValueForIndex2(nextValue, enumOptions, emptyValue));
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, enumOptionsValueForIndex2(value2, enumOptions, emptyValue));
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, enumOptionsValueForIndex2(value2, enumOptions, emptyValue));
   const row = options ? options.inline : false;
-  const selectedIndex = enumOptionsIndexForValue(value, enumOptions) ?? null;
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      id: `${id}-label`,
-      children: label
-    }), hideLabel || !label), jsx(RadioGroup, {
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      value: selectedIndex,
-      name: id,
-      "aria-describedby": ariaDescribedByIds(id),
-      children: jsx(Stack, {
-        direction: row ? 'row' : 'column',
-        children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
+  const selectedIndex = enumOptionsIndexForValue2(value, enumOptions) ?? null;
+  return /* @__PURE__ */ jsxs12(FormControl6, { mb: 1, ...chakraProps, isDisabled: disabled || readonly, isRequired: required, isReadOnly: readonly, children: [
+    labelValue4(
+      /* @__PURE__ */ jsx20(FormLabel4, { htmlFor: id, id: `${id}-label`, children: label }),
+      hideLabel || !label
+    ),
+    /* @__PURE__ */ jsx20(
+      RadioGroup,
+      {
+        onChange: _onChange,
+        onBlur: _onBlur,
+        onFocus: _onFocus,
+        value: selectedIndex,
+        name: id,
+        "aria-describedby": ariaDescribedByIds5(id),
+        children: /* @__PURE__ */ jsx20(Stack2, { direction: row ? "row" : "column", children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
           const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-          return jsx(Radio, {
-            value: String(index),
-            id: optionId(id, index),
-            disabled: disabled || itemDisabled || readonly,
-            children: option.label
-          }, index);
-        })
-      })
-    })]
-  });
+          return /* @__PURE__ */ jsx20(
+            Radio,
+            {
+              value: String(index),
+              id: optionId2(id, index),
+              disabled: disabled || itemDisabled || readonly,
+              children: option.label
+            },
+            index
+          );
+        }) })
+      }
+    )
+  ] });
 }
 
+// src/RangeWidget/RangeWidget.tsx
+import { FormControl as FormControl7, FormLabel as FormLabel5, Slider, SliderFilledTrack, SliderThumb, SliderTrack } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds6,
+  labelValue as labelValue5,
+  rangeSpec
+} from "@rjsf/utils";
+import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
 function RangeWidget({
   value,
   readonly,
@@ -1051,48 +977,43 @@ function RangeWidget({
   hideLabel,
   id
 }) {
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const sliderWidgetProps = {
-    value,
-    label,
-    id,
-    ...rangeSpec(schema)
-  };
-  const _onChange = value => onChange(value === undefined ? options.emptyValue : value);
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, value);
-  const _onFocus = ({
-    target: {
-      value
-    }
-  }) => onFocus(id, value);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      children: label
-    }), hideLabel || !label), jsxs(Slider, {
-      ...sliderWidgetProps,
-      id: id,
-      name: id,
-      isDisabled: disabled || readonly,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": ariaDescribedByIds(id),
-      children: [jsx(SliderTrack, {
-        children: jsx(SliderFilledTrack, {})
-      }), jsx(SliderThumb, {})]
-    })]
-  });
+  const chakraProps = getChakra({ uiSchema });
+  const sliderWidgetProps = { value, label, id, ...rangeSpec(schema) };
+  const _onChange = (value2) => onChange(value2 === void 0 ? options.emptyValue : value2);
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, value2);
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, value2);
+  return /* @__PURE__ */ jsxs13(FormControl7, { mb: 1, ...chakraProps, children: [
+    labelValue5(/* @__PURE__ */ jsx21(FormLabel5, { htmlFor: id, children: label }), hideLabel || !label),
+    /* @__PURE__ */ jsxs13(
+      Slider,
+      {
+        ...sliderWidgetProps,
+        id,
+        name: id,
+        isDisabled: disabled || readonly,
+        onChange: _onChange,
+        onBlur: _onBlur,
+        onFocus: _onFocus,
+        "aria-describedby": ariaDescribedByIds6(id),
+        children: [
+          /* @__PURE__ */ jsx21(SliderTrack, { children: /* @__PURE__ */ jsx21(SliderFilledTrack, {}) }),
+          /* @__PURE__ */ jsx21(SliderThumb, {})
+        ]
+      }
+    )
+  ] });
 }
 
+// src/SelectWidget/SelectWidget.tsx
+import { FormControl as FormControl8, FormLabel as FormLabel6 } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds7,
+  enumOptionsIndexForValue as enumOptionsIndexForValue3,
+  enumOptionsValueForIndex as enumOptionsValueForIndex3,
+  labelValue as labelValue6
+} from "@rjsf/utils";
+import { Select } from "chakra-react-select";
+import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
 function SelectWidget(props) {
   const {
     id,
@@ -1112,84 +1033,88 @@ function SelectWidget(props) {
     rawErrors = [],
     uiSchema
   } = props;
-  const {
-    enumOptions,
-    enumDisabled,
-    emptyValue
-  } = options;
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const _onMultiChange = e => {
-    return onChange(enumOptionsValueForIndex(e.map(v => {
-      return v.value;
-    }), enumOptions, emptyValue));
+  const { enumOptions, enumDisabled, emptyValue } = options;
+  const chakraProps = getChakra({ uiSchema });
+  const _onMultiChange = (e) => {
+    return onChange(
+      enumOptionsValueForIndex3(
+        e.map((v) => {
+          return v.value;
+        }),
+        enumOptions,
+        emptyValue
+      )
+    );
   };
-  const _onChange = e => {
-    return onChange(enumOptionsValueForIndex(e.value, enumOptions, emptyValue));
+  const _onChange = (e) => {
+    return onChange(enumOptionsValueForIndex3(e.value, enumOptions, emptyValue));
   };
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
-  const _onFocus = ({
-    target: {
-      value
-    }
-  }) => onFocus(id, enumOptionsValueForIndex(value, enumOptions, emptyValue));
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, enumOptionsValueForIndex3(value2, enumOptions, emptyValue));
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, enumOptionsValueForIndex3(value2, enumOptions, emptyValue));
   const _valueLabelMap = {};
   const displayEnumOptions = Array.isArray(enumOptions) ? enumOptions.map((option, index) => {
-    const {
-      value,
-      label
-    } = option;
-    _valueLabelMap[index] = label || String(value);
+    const { value: value2, label: label2 } = option;
+    _valueLabelMap[index] = label2 || String(value2);
     return {
-      label,
+      label: label2,
       value: String(index),
-      isDisabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1
+      isDisabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(value2) !== -1
     };
   }) : [];
-  const isMultiple = typeof multiple !== 'undefined' && Boolean(enumOptions);
-  const selectedIndex = enumOptionsIndexForValue(value, enumOptions, isMultiple);
-  const formValue = isMultiple ? (selectedIndex || []).map(i => {
+  const isMultiple = typeof multiple !== "undefined" && Boolean(enumOptions);
+  const selectedIndex = enumOptionsIndexForValue3(value, enumOptions, isMultiple);
+  const formValue = isMultiple ? (selectedIndex || []).map((i) => {
     return {
       label: _valueLabelMap[i],
       value: i
     };
   }) : {
-    label: _valueLabelMap[selectedIndex] || '',
+    label: _valueLabelMap[selectedIndex] || "",
     selectedIndex
   };
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    isInvalid: rawErrors && rawErrors.length > 0,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      id: `${id}-label`,
-      children: label
-    }), hideLabel || !label), jsx(Select, {
-      inputId: id,
-      name: id,
-      isMulti: isMultiple,
-      options: displayEnumOptions,
-      placeholder: placeholder,
-      closeMenuOnSelect: !isMultiple,
-      onBlur: _onBlur,
-      onChange: isMultiple ? _onMultiChange : _onChange,
-      onFocus: _onFocus,
-      autoFocus: autofocus,
-      value: formValue,
-      "aria-describedby": ariaDescribedByIds(id)
-    })]
-  });
+  return /* @__PURE__ */ jsxs14(
+    FormControl8,
+    {
+      mb: 1,
+      ...chakraProps,
+      isDisabled: disabled || readonly,
+      isRequired: required,
+      isReadOnly: readonly,
+      isInvalid: rawErrors && rawErrors.length > 0,
+      children: [
+        labelValue6(
+          /* @__PURE__ */ jsx22(FormLabel6, { htmlFor: id, id: `${id}-label`, children: label }),
+          hideLabel || !label
+        ),
+        /* @__PURE__ */ jsx22(
+          Select,
+          {
+            inputId: id,
+            name: id,
+            isMulti: isMultiple,
+            options: displayEnumOptions,
+            placeholder,
+            closeMenuOnSelect: !isMultiple,
+            onBlur: _onBlur,
+            onChange: isMultiple ? _onMultiChange : _onChange,
+            onFocus: _onFocus,
+            autoFocus: autofocus,
+            value: formValue,
+            "aria-describedby": ariaDescribedByIds7(id)
+          }
+        )
+      ]
+    }
+  );
 }
 
+// src/TextareaWidget/TextareaWidget.tsx
+import { FormControl as FormControl9, FormLabel as FormLabel7, Textarea } from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds8,
+  labelValue as labelValue7
+} from "@rjsf/utils";
+import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
 function TextareaWidget({
   id,
   placeholder,
@@ -1207,107 +1132,99 @@ function TextareaWidget({
   required,
   rawErrors
 }) {
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const _onChange = ({
-    target: {
-      value
-    }
-  }) => onChange(value === '' ? options.emptyValue : value);
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, value);
-  const _onFocus = ({
-    target: {
-      value
+  const chakraProps = getChakra({ uiSchema });
+  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, value2);
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, value2);
+  return /* @__PURE__ */ jsxs15(
+    FormControl9,
+    {
+      mb: 1,
+      ...chakraProps,
+      isDisabled: disabled || readonly,
+      isRequired: required,
+      isReadOnly: readonly,
+      isInvalid: rawErrors && rawErrors.length > 0,
+      children: [
+        labelValue7(/* @__PURE__ */ jsx23(FormLabel7, { htmlFor: id, children: label }), hideLabel || !label),
+        /* @__PURE__ */ jsx23(
+          Textarea,
+          {
+            id,
+            name: id,
+            value: value ?? "",
+            placeholder,
+            autoFocus: autofocus,
+            onChange: _onChange,
+            onBlur: _onBlur,
+            onFocus: _onFocus,
+            "aria-describedby": ariaDescribedByIds8(id)
+          }
+        )
+      ]
     }
-  }) => onFocus(id, value);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    isInvalid: rawErrors && rawErrors.length > 0,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      children: label
-    }), hideLabel || !label), jsx(Textarea, {
-      id: id,
-      name: id,
-      value: value ?? '',
-      placeholder: placeholder,
-      autoFocus: autofocus,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": ariaDescribedByIds(id)
-    })]
-  });
+  );
 }
 
+// src/UpDownWidget/UpDownWidget.tsx
+import {
+  NumberInput,
+  NumberDecrementStepper,
+  NumberIncrementStepper,
+  NumberInputField,
+  NumberInputStepper,
+  FormControl as FormControl10,
+  FormLabel as FormLabel8
+} from "@chakra-ui/react";
+import {
+  ariaDescribedByIds as ariaDescribedByIds9,
+  labelValue as labelValue8
+} from "@rjsf/utils";
+import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
 function UpDownWidget(props) {
-  const {
-    id,
-    uiSchema,
-    readonly,
-    disabled,
-    label,
-    hideLabel,
-    value,
-    onChange,
-    onBlur,
-    onFocus,
-    rawErrors,
-    required
-  } = props;
-  const chakraProps = getChakra({
-    uiSchema
-  });
-  const _onChange = value => onChange(value);
-  const _onBlur = ({
-    target: {
-      value
-    }
-  }) => onBlur(id, value);
-  const _onFocus = ({
-    target: {
-      value
+  const { id, uiSchema, readonly, disabled, label, hideLabel, value, onChange, onBlur, onFocus, rawErrors, required } = props;
+  const chakraProps = getChakra({ uiSchema });
+  const _onChange = (value2) => onChange(value2);
+  const _onBlur = ({ target: { value: value2 } }) => onBlur(id, value2);
+  const _onFocus = ({ target: { value: value2 } }) => onFocus(id, value2);
+  return /* @__PURE__ */ jsxs16(
+    FormControl10,
+    {
+      mb: 1,
+      ...chakraProps,
+      isDisabled: disabled || readonly,
+      isRequired: required,
+      isReadOnly: readonly,
+      isInvalid: rawErrors && rawErrors.length > 0,
+      children: [
+        labelValue8(/* @__PURE__ */ jsx24(FormLabel8, { htmlFor: id, children: label }), hideLabel || !label),
+        /* @__PURE__ */ jsxs16(
+          NumberInput,
+          {
+            value: value ?? "",
+            onChange: _onChange,
+            onBlur: _onBlur,
+            onFocus: _onFocus,
+            "aria-describedby": ariaDescribedByIds9(id),
+            children: [
+              /* @__PURE__ */ jsx24(NumberInputField, { id, name: id }),
+              /* @__PURE__ */ jsxs16(NumberInputStepper, { children: [
+                /* @__PURE__ */ jsx24(NumberIncrementStepper, {}),
+                /* @__PURE__ */ jsx24(NumberDecrementStepper, {})
+              ] })
+            ]
+          }
+        )
+      ]
     }
-  }) => onFocus(id, value);
-  return jsxs(FormControl, {
-    mb: 1,
-    ...chakraProps,
-    isDisabled: disabled || readonly,
-    isRequired: required,
-    isReadOnly: readonly,
-    isInvalid: rawErrors && rawErrors.length > 0,
-    children: [labelValue(jsx(FormLabel, {
-      htmlFor: id,
-      children: label
-    }), hideLabel || !label), jsxs(NumberInput, {
-      value: value ?? '',
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": ariaDescribedByIds(id),
-      children: [jsx(NumberInputField, {
-        id: id,
-        name: id
-      }), jsxs(NumberInputStepper, {
-        children: [jsx(NumberIncrementStepper, {}), jsx(NumberDecrementStepper, {})]
-      })]
-    })]
-  });
+  );
 }
 
+// src/Widgets/Widgets.ts
 function generateWidgets() {
   return {
-    AltDateTimeWidget,
-    AltDateWidget,
+    AltDateTimeWidget: AltDateTimeWidget_default,
+    AltDateWidget: AltDateWidget_default,
     CheckboxWidget,
     CheckboxesWidget,
     RadioWidget,
@@ -1317,44 +1234,36 @@ function generateWidgets() {
     UpDownWidget
   };
 }
-var Widgets = /*#__PURE__*/generateWidgets();
+var Widgets_default = generateWidgets();
 
+// src/Theme/Theme.tsx
 function generateTheme() {
   return {
     templates: generateTemplates(),
     widgets: generateWidgets()
   };
 }
-var Theme = /*#__PURE__*/generateTheme();
+var Theme_default = generateTheme();
 
+// src/Form/Form.tsx
 function generateForm() {
   return withTheme(generateTheme());
 }
-var Form = /*#__PURE__*/generateForm();
+var Form_default = generateForm();
 
-/**
- *
- * The reason we need this is for ChakraProvider styling in Playground.
- * The User Developer would be responsible for styling with ChakraProvider in their app.
- *
- * Exact duplicate of `@chakra-ui/react`'s `CSSReset` component. Except for the following:
- *
-  ```css
-    input {
-      border-width: revert;
-      border-color: revert;
-      border-style: revert;
-    }
-    .array-item > hr {
-      margin-top: 16px;
-      margin-bottom: 16px;
-    }
-  ```
+// src/ChakraFrameProvider.tsx
+import { CacheProvider } from "@emotion/react";
+import createCache from "@emotion/cache";
+import weakMemoize from "@emotion/weak-memoize";
+import { ChakraProvider } from "@chakra-ui/react";
 
-  It is located at the bottom of the styles string.
- */
-const CSSReset = () => jsx(Global, {
-  styles: `
+// src/CssReset.tsx
+import { Global } from "@emotion/react";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var CSSReset = () => /* @__PURE__ */ jsx25(
+  Global,
+  {
+    styles: `
       html {
         line-height: 1.5;
         -webkit-text-size-adjust: 100%;
@@ -1595,45 +1504,35 @@ const CSSReset = () => jsx(Global, {
         margin-bottom: 16px;
       }
     `
-});
+  }
+);
+var CssReset_default = CSSReset;
 
-/**
- * __createChakraFrameProvider is used to ensure that <Global> emotion components
- * can be rendered within an iframe without changing the styles of the parent page.
- * Required for using Chakra UI in the playground.
- *
- * We have to define ChakraFrameProvider in this library, as opposed to the playground,
- * in order to avoid conflicting versions of emotion, which breaks the styling.
- *
- * NOTE: This is an internal component only used by @rjsf/playground (no
- * backwards compatibility guarantees!)
- *
- * From: https://codesandbox.io/s/p98y9o7jz0?file=/src/frame-provider.js:0-650
- * Also see: https://github.com/emotion-js/emotion/issues/760#issuecomment-404353706
- */
-const memoizedCreateCacheWithContainer = /*#__PURE__*/weakMemoize(container => {
-  const newCache = createCache({
-    container,
-    key: 'rjsf'
-  });
+// src/ChakraFrameProvider.tsx
+import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
+var memoizedCreateCacheWithContainer = weakMemoize((container) => {
+  const newCache = createCache({ container, key: "rjsf" });
   return newCache;
 });
-const __createChakraFrameProvider = props => ({
-  document
-}) => {
-  return jsx("div", {
-    style: {
-      margin: 2
-    },
-    children: jsx(CacheProvider, {
-      value: memoizedCreateCacheWithContainer(document.head),
-      children: jsxs(ChakraProvider, {
-        resetCSS: false,
-        children: [jsx(CSSReset, {}), props.children]
-      })
-    })
-  });
+var __createChakraFrameProvider = (props) => ({ document }) => {
+  return /* @__PURE__ */ jsx26("div", { style: { margin: 2 }, children: /* @__PURE__ */ jsx26(CacheProvider, { value: memoizedCreateCacheWithContainer(document.head), children: /* @__PURE__ */ jsxs17(ChakraProvider, { resetCSS: false, children: [
+    /* @__PURE__ */ jsx26(CssReset_default, {}),
+    props.children
+  ] }) }) });
 };
 
-export { Form, Templates, Theme, Widgets, __createChakraFrameProvider, Form as default, generateForm, generateTemplates, generateTheme, generateWidgets };
+// src/index.ts
+var src_default = Form_default;
+export {
+  Form_default as Form,
+  Templates_default as Templates,
+  Theme_default as Theme,
+  Widgets_default as Widgets,
+  __createChakraFrameProvider,
+  src_default as default,
+  generateForm,
+  generateTemplates,
+  generateTheme,
+  generateWidgets
+};
 //# sourceMappingURL=chakra-ui.esm.js.map