@rjsf/chakra-ui 5.11.2 → 5.12.1

package/dist/chakra-ui.umd.development.js

@@ -1,1652 +0,0 @@
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('react/jsx-runtime'), require('@rjsf/utils'), require('@chakra-ui/react'), require('@chakra-ui/icons'), require('react'), require('chakra-react-select'), require('@emotion/react'), require('@emotion/cache'), require('@emotion/weak-memoize')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'react/jsx-runtime', '@rjsf/utils', '@chakra-ui/react', '@chakra-ui/icons', 'react', 'chakra-react-select', '@emotion/react', '@emotion/cache', '@emotion/weak-memoize'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@rjsf/chakra-ui"] = {}, global.core, global.jsxRuntime, global.utils, global.react, global.icons, global.React, global.chakraReactSelect, global.react$2, global.createCache, global.weakMemoize));
-})(this, (function (exports, core, jsxRuntime, utils, react, icons, react$1, chakraReactSelect, react$2, createCache, weakMemoize) { 'use strict';
-
-  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-  var createCache__default = /*#__PURE__*/_interopDefaultLegacy(createCache);
-  var weakMemoize__default = /*#__PURE__*/_interopDefaultLegacy(weakMemoize);
-
-  function AddButton({
-    uiSchema,
-    registry,
-    ...props
-  }) {
-    const {
-      translateString
-    } = registry;
-    return jsxRuntime.jsx(react.Button, {
-      leftIcon: jsxRuntime.jsx(icons.AddIcon, {}),
-      ...props,
-      children: translateString(utils.TranslatableString.AddItemButton)
-    });
-  }
-
-  function ArrayFieldItemTemplate(props) {
-    const {
-      children,
-      disabled,
-      hasToolbar,
-      hasCopy,
-      hasMoveDown,
-      hasMoveUp,
-      hasRemove,
-      index,
-      onCopyIndexClick,
-      onDropIndexClick,
-      onReorderClick,
-      readonly,
-      uiSchema,
-      registry
-    } = props;
-    const {
-      CopyButton,
-      MoveDownButton,
-      MoveUpButton,
-      RemoveButton
-    } = registry.templates.ButtonTemplates;
-    const onCopyClick = react$1.useMemo(() => onCopyIndexClick(index), [index, onCopyIndexClick]);
-    const onRemoveClick = react$1.useMemo(() => onDropIndexClick(index), [index, onDropIndexClick]);
-    const onArrowUpClick = react$1.useMemo(() => onReorderClick(index, index - 1), [index, onReorderClick]);
-    const onArrowDownClick = react$1.useMemo(() => onReorderClick(index, index + 1), [index, onReorderClick]);
-    return jsxRuntime.jsxs(react.HStack, {
-      alignItems: 'flex-end',
-      py: 1,
-      children: [jsxRuntime.jsx(react.Box, {
-        w: '100%',
-        children: children
-      }), hasToolbar && jsxRuntime.jsx(react.Box, {
-        children: jsxRuntime.jsxs(react.ButtonGroup, {
-          isAttached: true,
-          mb: 1,
-          children: [(hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveUpButton, {
-            disabled: disabled || readonly || !hasMoveUp,
-            onClick: onArrowUpClick,
-            uiSchema: uiSchema,
-            registry: registry
-          }), (hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveDownButton, {
-            disabled: disabled || readonly || !hasMoveDown,
-            onClick: onArrowDownClick,
-            uiSchema: uiSchema,
-            registry: registry
-          }), hasCopy && jsxRuntime.jsx(CopyButton, {
-            disabled: disabled || readonly,
-            onClick: onCopyClick,
-            uiSchema: uiSchema,
-            registry: registry
-          }), hasRemove && jsxRuntime.jsx(RemoveButton, {
-            disabled: disabled || readonly,
-            onClick: onRemoveClick,
-            uiSchema: uiSchema,
-            registry: registry
-          })]
-        })
-      })]
-    });
-  }
-
-  function ArrayFieldTemplate(props) {
-    const {
-      canAdd,
-      disabled,
-      idSchema,
-      uiSchema,
-      items,
-      onAddClick,
-      readonly,
-      registry,
-      required,
-      schema,
-      title
-    } = props;
-    const uiOptions = utils.getUiOptions(uiSchema);
-    const ArrayFieldDescriptionTemplate = utils.getTemplate('ArrayFieldDescriptionTemplate', registry, uiOptions);
-    const ArrayFieldItemTemplate = utils.getTemplate('ArrayFieldItemTemplate', registry, uiOptions);
-    const ArrayFieldTitleTemplate = utils.getTemplate('ArrayFieldTitleTemplate', registry, uiOptions);
-    // Button templates are not overridden in the uiSchema
-    const {
-      ButtonTemplates: {
-        AddButton
-      }
-    } = registry.templates;
-    return jsxRuntime.jsxs(react.Box, {
-      children: [jsxRuntime.jsx(ArrayFieldTitleTemplate, {
-        idSchema: idSchema,
-        title: uiOptions.title || title,
-        schema: schema,
-        uiSchema: uiSchema,
-        required: required,
-        registry: registry
-      }), jsxRuntime.jsx(ArrayFieldDescriptionTemplate, {
-        idSchema: idSchema,
-        description: uiOptions.description || schema.description,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsxs(react.Grid, {
-        children: [jsxRuntime.jsx(react.GridItem, {
-          children: items.length > 0 && items.map(({
-            key,
-            ...itemProps
-          }) => jsxRuntime.jsx(ArrayFieldItemTemplate, {
-            ...itemProps
-          }, key))
-        }), canAdd && jsxRuntime.jsx(react.GridItem, {
-          justifySelf: 'flex-end',
-          children: jsxRuntime.jsx(react.Box, {
-            mt: 2,
-            children: jsxRuntime.jsx(AddButton, {
-              className: 'array-item-add',
-              onClick: onAddClick,
-              disabled: disabled || readonly,
-              uiSchema: uiSchema,
-              registry: 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.
-       */
-      if (react.shouldForwardProp(key)) {
-        delete chakraProps[key];
-      }
-    });
-    return chakraProps;
-  }
-
-  function BaseInputTemplate(props) {
-    const {
-      id,
-      type,
-      value,
-      label,
-      hideLabel,
-      schema,
-      uiSchema,
-      onChange,
-      onChangeOverride,
-      onBlur,
-      onFocus,
-      options,
-      required,
-      readonly,
-      rawErrors,
-      autofocus,
-      placeholder,
-      disabled
-    } = props;
-    const inputProps = utils.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
-      }
-    }) => onFocus(id, value);
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        id: `${id}-label`,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsx(react.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 ? utils.examplesId(id) : undefined,
-        "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
-      }), Array.isArray(schema.examples) ? jsxRuntime.jsx("datalist", {
-        id: utils.examplesId(id),
-        children: schema.examples.concat(schema.default && !schema.examples.includes(schema.default) ? [schema.default] : []).map(example => {
-          return jsxRuntime.jsx("option", {
-            value: example
-          }, example);
-        })
-      }) : null]
-    });
-  }
-
-  function DescriptionField({
-    description,
-    id
-  }) {
-    if (!description) {
-      return null;
-    }
-    if (typeof description === 'string') {
-      return jsxRuntime.jsx(react.Text, {
-        id: id,
-        mt: 2,
-        mb: 4,
-        children: description
-      });
-    }
-    return jsxRuntime.jsx(jsxRuntime.Fragment, {
-      children: description
-    });
-  }
-
-  function ErrorList({
-    errors,
-    registry
-  }) {
-    const {
-      translateString
-    } = registry;
-    return jsxRuntime.jsxs(react.Alert, {
-      flexDirection: 'column',
-      alignItems: 'flex-start',
-      gap: 3,
-      status: 'error',
-      children: [jsxRuntime.jsx(react.AlertTitle, {
-        children: translateString(utils.TranslatableString.ErrorsLabel)
-      }), jsxRuntime.jsx(react.List, {
-        children: errors.map((error, i) => jsxRuntime.jsxs(react.ListItem, {
-          children: [jsxRuntime.jsx(react.ListIcon, {
-            as: icons.WarningIcon,
-            color: 'red.500'
-          }), error.stack]
-        }, i))
-      })]
-    });
-  }
-
-  function ChakraIconButton(props) {
-    const {
-      icon,
-      iconType,
-      uiSchema,
-      registry,
-      ...otherProps
-    } = props;
-    return jsxRuntime.jsx(react.IconButton, {
-      "aria-label": props.title,
-      ...otherProps,
-      icon: icon
-    });
-  }
-  ChakraIconButton.displayName = 'ChakraIconButton';
-  var ChakraIconButton$1 = /*#__PURE__*/react$1.memo(ChakraIconButton);
-
-  function CopyButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(ChakraIconButton$1, {
-      title: translateString(utils.TranslatableString.CopyButton),
-      ...props,
-      icon: jsxRuntime.jsx(icons.CopyIcon, {})
-    });
-  }
-  function MoveDownButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(ChakraIconButton$1, {
-      title: translateString(utils.TranslatableString.MoveDownButton),
-      ...props,
-      icon: jsxRuntime.jsx(icons.ArrowDownIcon, {})
-    });
-  }
-  function MoveUpButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(ChakraIconButton$1, {
-      title: translateString(utils.TranslatableString.MoveUpButton),
-      ...props,
-      icon: jsxRuntime.jsx(icons.ArrowUpIcon, {})
-    });
-  }
-  function RemoveButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(ChakraIconButton$1, {
-      title: translateString(utils.TranslatableString.RemoveButton),
-      ...props,
-      icon: jsxRuntime.jsx(icons.DeleteIcon, {})
-    });
-  }
-
-  /** The `FieldErrorTemplate` component renders the errors local to the particular field
-   *
-   * @param props - The `FieldErrorProps` for the errors being rendered
-   */
-  function FieldErrorTemplate(props) {
-    const {
-      errors = [],
-      idSchema
-    } = props;
-    if (errors.length === 0) {
-      return null;
-    }
-    const id = utils.errorId(idSchema);
-    return jsxRuntime.jsx(react.List, {
-      children: errors.map((error, i) => {
-        return jsxRuntime.jsx(react.ListItem, {
-          children: jsxRuntime.jsx(react.FormErrorMessage, {
-            id: id,
-            children: error
-          })
-        }, i);
-      })
-    });
-  }
-
-  /** The `FieldHelpTemplate` component renders any help desired for a field
-   *
-   * @param props - The `FieldHelpProps` to be rendered
-   */
-  function FieldHelpTemplate(props) {
-    const {
-      idSchema,
-      help
-    } = props;
-    if (!help) {
-      return null;
-    }
-    const id = utils.helpId(idSchema);
-    return jsxRuntime.jsx(react.FormHelperText, {
-      id: id,
-      children: help
-    });
-  }
-
-  function FieldTemplate(props) {
-    const {
-      id,
-      children,
-      classNames,
-      style,
-      disabled,
-      displayLabel,
-      hidden,
-      label,
-      onDropPropertyClick,
-      onKeyChange,
-      readonly,
-      registry,
-      required,
-      rawErrors = [],
-      errors,
-      help,
-      description,
-      rawDescription,
-      schema,
-      uiSchema
-    } = props;
-    const uiOptions = utils.getUiOptions(uiSchema);
-    const WrapIfAdditionalTemplate = utils.getTemplate('WrapIfAdditionalTemplate', registry, uiOptions);
-    if (hidden) {
-      return jsxRuntime.jsx("div", {
-        style: {
-          display: 'none'
-        },
-        children: children
-      });
-    }
-    return jsxRuntime.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: jsxRuntime.jsxs(react.FormControl, {
-        isRequired: required,
-        isInvalid: rawErrors && rawErrors.length > 0,
-        children: [children, displayLabel && rawDescription ? jsxRuntime.jsx(react.Text, {
-          mt: 2,
-          children: description
-        }) : null, errors, help]
-      })
-    });
-  }
-
-  function ObjectFieldTemplate(props) {
-    const {
-      description,
-      title,
-      properties,
-      required,
-      disabled,
-      readonly,
-      uiSchema,
-      idSchema,
-      schema,
-      formData,
-      onAddClick,
-      registry
-    } = props;
-    const uiOptions = utils.getUiOptions(uiSchema);
-    const TitleFieldTemplate = utils.getTemplate('TitleFieldTemplate', registry, uiOptions);
-    const DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, uiOptions);
-    // Button templates are not overridden in the uiSchema
-    const {
-      ButtonTemplates: {
-        AddButton
-      }
-    } = registry.templates;
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [title && jsxRuntime.jsx(TitleFieldTemplate, {
-        id: utils.titleId(idSchema),
-        title: title,
-        required: required,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), description && jsxRuntime.jsx(DescriptionFieldTemplate, {
-        id: utils.descriptionId(idSchema),
-        description: description,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsxs(react.Grid, {
-        gap: description ? 2 : 6,
-        mb: 4,
-        children: [properties.map((element, index) => element.hidden ? element.content : jsxRuntime.jsx(react.GridItem, {
-          children: element.content
-        }, `${idSchema.$id}-${element.name}-${index}`)), utils.canExpand(schema, uiSchema, formData) && jsxRuntime.jsx(react.GridItem, {
-          justifySelf: 'flex-end',
-          children: jsxRuntime.jsx(AddButton, {
-            className: 'object-property-expand',
-            onClick: onAddClick(schema),
-            disabled: disabled || readonly,
-            uiSchema: uiSchema,
-            registry: registry
-          })
-        })]
-      })]
-    });
-  }
-
-  function SubmitButton({
-    uiSchema
-  }) {
-    const {
-      submitText,
-      norender,
-      props: submitButtonProps
-    } = utils.getSubmitButtonOptions(uiSchema);
-    if (norender) {
-      return null;
-    }
-    return jsxRuntime.jsx(react.Box, {
-      marginTop: 3,
-      children: jsxRuntime.jsx(react.Button, {
-        type: 'submit',
-        variant: 'solid',
-        ...submitButtonProps,
-        children: submitText
-      })
-    });
-  }
-
-  function TitleField({
-    id,
-    title
-  }) {
-    return jsxRuntime.jsxs(react.Box, {
-      id: id,
-      mt: 1,
-      mb: 4,
-      children: [jsxRuntime.jsx(react.Heading, {
-        as: 'h5',
-        children: title
-      }), jsxRuntime.jsx(react.Divider, {})]
-    });
-  }
-
-  function WrapIfAdditionalTemplate(props) {
-    const {
-      children,
-      classNames,
-      style,
-      disabled,
-      id,
-      label,
-      onDropPropertyClick,
-      onKeyChange,
-      readonly,
-      registry,
-      required,
-      schema,
-      uiSchema
-    } = props;
-    const {
-      templates,
-      translateString
-    } = registry;
-    // Button templates are not overridden in the uiSchema
-    const {
-      RemoveButton
-    } = templates.ButtonTemplates;
-    const keyLabel = translateString(utils.TranslatableString.KeyLabel, [label]);
-    const additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
-    if (!additional) {
-      return jsxRuntime.jsx("div", {
-        className: classNames,
-        style: style,
-        children: children
-      });
-    }
-    const handleBlur = ({
-      target
-    }) => onKeyChange(target.value);
-    return jsxRuntime.jsxs(react.Grid, {
-      className: classNames,
-      style: style,
-      alignItems: 'center',
-      gap: 2,
-      children: [jsxRuntime.jsx(react.GridItem, {
-        children: jsxRuntime.jsxs(react.FormControl, {
-          isRequired: required,
-          children: [jsxRuntime.jsx(react.FormLabel, {
-            htmlFor: `${id}-key`,
-            id: `${id}-key-label`,
-            children: keyLabel
-          }), jsxRuntime.jsx(react.Input, {
-            defaultValue: label,
-            disabled: disabled || readonly,
-            id: `${id}-key`,
-            name: `${id}-key`,
-            onBlur: !readonly ? handleBlur : undefined,
-            type: 'text',
-            mb: 1
-          })]
-        })
-      }), jsxRuntime.jsx(react.GridItem, {
-        children: children
-      }), jsxRuntime.jsx(react.GridItem, {
-        children: jsxRuntime.jsx(RemoveButton, {
-          disabled: disabled || readonly,
-          onClick: onDropPropertyClick(label),
-          uiSchema: uiSchema,
-          registry: registry
-        })
-      })]
-    }, `${id}-key`);
-  }
-
-  function generateTemplates() {
-    return {
-      ArrayFieldItemTemplate,
-      ArrayFieldTemplate,
-      BaseInputTemplate,
-      ButtonTemplates: {
-        CopyButton,
-        AddButton,
-        MoveDownButton,
-        MoveUpButton,
-        RemoveButton,
-        SubmitButton
-      },
-      DescriptionFieldTemplate: DescriptionField,
-      ErrorListTemplate: ErrorList,
-      FieldErrorTemplate,
-      FieldHelpTemplate,
-      FieldTemplate,
-      ObjectFieldTemplate,
-      TitleFieldTemplate: TitleField,
-      WrapIfAdditionalTemplate
-    };
-  }
-  var Templates = /*#__PURE__*/generateTemplates();
-
-  const rangeOptions = (start, stop) => {
-    const options = [];
-    for (let i = start; i <= stop; i++) {
-      options.push({
-        value: i,
-        label: utils.pad(i, 2)
-      });
-    }
-    return options;
-  };
-  function DateElement(props) {
-    const {
-      SelectWidget
-    } = props.registry.widgets;
-    const value = props.value ? props.value : undefined;
-    return jsxRuntime.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": utils.ariaDescribedByIds(props.name)
-    });
-  }
-  const 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 [state, setState] = react$1.useState(utils.parseDateString(value, showTime));
-    react$1.useEffect(() => {
-      setState(utils.parseDateString(value, showTime));
-    }, [showTime, value]);
-    const handleChange = (property, nextValue) => {
-      const nextState = {
-        ...state,
-        [property]: typeof nextValue === 'undefined' ? -1 : nextValue
-      };
-      if (readyForChange(nextState)) {
-        onChange(utils.toDateString(nextState, showTime));
-      } else {
-        setState(nextState);
-      }
-    };
-    const handleNow = event => {
-      event.preventDefault();
-      if (disabled || readonly) {
-        return;
-      }
-      const nextState = utils.parseDateString(new Date().toJSON(), showTime);
-      onChange(utils.toDateString(nextState, showTime));
-    };
-    const handleClear = event => {
-      event.preventDefault();
-      if (disabled || readonly) {
-        return;
-      }
-      onChange(undefined);
-    };
-    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
-      }];
-      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
-        });
-      }
-      return data;
-    };
-    return jsxRuntime.jsxs(react.Box, {
-      children: [jsxRuntime.jsx(react.Box, {
-        display: 'flex',
-        flexWrap: 'wrap',
-        alignItems: 'center',
-        children: dateElementProps().map((elemProps, i) => {
-          const elemId = id + '_' + elemProps.type;
-          return jsxRuntime.jsx(react.Box, {
-            mr: '2',
-            mb: '2',
-            children: jsxRuntime.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);
-        })
-      }), jsxRuntime.jsxs(react.Box, {
-        display: 'flex',
-        children: [!options.hideNowButton && jsxRuntime.jsx(react.Button, {
-          onClick: e => handleNow(e),
-          mr: '2',
-          children: translateString(utils.TranslatableString.NowLabel)
-        }), !options.hideClearButton && jsxRuntime.jsx(react.Button, {
-          onClick: e => handleClear(e),
-          children: translateString(utils.TranslatableString.ClearLabel)
-        })]
-      })]
-    });
-  }
-  AltDateWidget.defaultProps = {
-    autofocus: false,
-    disabled: false,
-    readonly: false,
-    showTime: false,
-    options: {
-      yearsRange: [1900, /*#__PURE__*/new Date().getFullYear() + 2]
-    }
-  };
-
-  function AltDateTimeWidget(props) {
-    const {
-      AltDateWidget
-    } = props.registry.widgets;
-    return jsxRuntime.jsx(AltDateWidget, {
-      ...props,
-      showTime: true
-    });
-  }
-  AltDateTimeWidget.defaultProps = {
-    ...AltDateWidget.defaultProps,
-    showTime: true
-  };
-
-  function CheckboxWidget(props) {
-    const {
-      id,
-      value,
-      disabled,
-      readonly,
-      onChange,
-      onBlur,
-      onFocus,
-      label,
-      hideLabel,
-      registry,
-      options,
-      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 required = utils.schemaRequiresTrueValue(schema);
-    const DescriptionFieldTemplate = utils.getTemplate('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 jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isRequired: required,
-      children: [!hideLabel && !!description && jsxRuntime.jsx(DescriptionFieldTemplate, {
-        id: utils.descriptionId(id),
-        description: description,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsx(react.Checkbox, {
-        id: id,
-        name: id,
-        isChecked: typeof value === 'undefined' ? false : value,
-        isDisabled: disabled || readonly,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id),
-        children: utils.labelValue(jsxRuntime.jsx(react.Text, {
-          children: label
-        }), hideLabel || !label)
-      })]
-    });
-  }
-
-  function CheckboxesWidget(props) {
-    const {
-      id,
-      disabled,
-      options,
-      value,
-      readonly,
-      onChange,
-      onBlur,
-      onFocus,
-      required,
-      label,
-      hideLabel,
-      uiSchema,
-      rawErrors = []
-    } = props;
-    const {
-      enumOptions,
-      enumDisabled,
-      emptyValue
-    } = options;
-    const chakraProps = getChakra({
-      uiSchema
-    });
-    const checkboxesValues = Array.isArray(value) ? value : [value];
-    const _onBlur = ({
-      target: {
-        value
-      }
-    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const _onFocus = ({
-      target: {
-        value
-      }
-    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const row = options ? options.inline : false;
-    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, true);
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        id: `${id}-label`,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsx(react.CheckboxGroup, {
-        onChange: option => onChange(utils.enumOptionsValueForIndex(option, enumOptions, emptyValue)),
-        defaultValue: selectedIndexes,
-        "aria-describedby": utils.ariaDescribedByIds(id),
-        children: jsxRuntime.jsx(react.Stack, {
-          direction: row ? 'row' : 'column',
-          children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-            const checked = utils.enumOptionsIsSelected(option.value, checkboxesValues);
-            const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-            return jsxRuntime.jsx(react.Checkbox, {
-              id: utils.optionId(id, index),
-              name: id,
-              value: String(index),
-              isChecked: checked,
-              isDisabled: disabled || itemDisabled || readonly,
-              onBlur: _onBlur,
-              onFocus: _onFocus,
-              children: option.label && jsxRuntime.jsx(react.Text, {
-                children: option.label
-              })
-            }, index);
-          })
-        })
-      })]
-    });
-  }
-
-  function RadioWidget({
-    id,
-    options,
-    value,
-    required,
-    disabled,
-    readonly,
-    label,
-    hideLabel,
-    onChange,
-    onBlur,
-    onFocus,
-    uiSchema
-  }) {
-    const {
-      enumOptions,
-      enumDisabled,
-      emptyValue
-    } = options;
-    const chakraProps = getChakra({
-      uiSchema
-    });
-    const _onChange = nextValue => onChange(utils.enumOptionsValueForIndex(nextValue, enumOptions, emptyValue));
-    const _onBlur = ({
-      target: {
-        value
-      }
-    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const _onFocus = ({
-      target: {
-        value
-      }
-    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const row = options ? options.inline : false;
-    const selectedIndex = utils.enumOptionsIndexForValue(value, enumOptions) ?? null;
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        id: `${id}-label`,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsx(react.RadioGroup, {
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        value: selectedIndex,
-        name: id,
-        "aria-describedby": utils.ariaDescribedByIds(id),
-        children: jsxRuntime.jsx(react.Stack, {
-          direction: row ? 'row' : 'column',
-          children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-            const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-            return jsxRuntime.jsx(react.Radio, {
-              value: String(index),
-              id: utils.optionId(id, index),
-              disabled: disabled || itemDisabled || readonly,
-              children: option.label
-            }, index);
-          })
-        })
-      })]
-    });
-  }
-
-  function RangeWidget({
-    value,
-    readonly,
-    disabled,
-    onBlur,
-    onFocus,
-    options,
-    schema,
-    uiSchema,
-    onChange,
-    label,
-    hideLabel,
-    id
-  }) {
-    const chakraProps = getChakra({
-      uiSchema
-    });
-    const sliderWidgetProps = {
-      value,
-      label,
-      id,
-      ...utils.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 jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsxs(react.Slider, {
-        ...sliderWidgetProps,
-        id: id,
-        name: id,
-        isDisabled: disabled || readonly,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id),
-        children: [jsxRuntime.jsx(react.SliderTrack, {
-          children: jsxRuntime.jsx(react.SliderFilledTrack, {})
-        }), jsxRuntime.jsx(react.SliderThumb, {})]
-      })]
-    });
-  }
-
-  function SelectWidget(props) {
-    const {
-      id,
-      options,
-      label,
-      hideLabel,
-      placeholder,
-      multiple,
-      required,
-      disabled,
-      readonly,
-      value,
-      autofocus,
-      onChange,
-      onBlur,
-      onFocus,
-      rawErrors = [],
-      uiSchema
-    } = props;
-    const {
-      enumOptions,
-      enumDisabled,
-      emptyValue
-    } = options;
-    const chakraProps = getChakra({
-      uiSchema
-    });
-    const _onMultiChange = e => {
-      return onChange(utils.enumOptionsValueForIndex(e.map(v => {
-        return v.value;
-      }), enumOptions, emptyValue));
-    };
-    const _onChange = e => {
-      return onChange(utils.enumOptionsValueForIndex(e.value, enumOptions, emptyValue));
-    };
-    const _onBlur = ({
-      target: {
-        value
-      }
-    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const _onFocus = ({
-      target: {
-        value
-      }
-    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, emptyValue));
-    const _valueLabelMap = {};
-    const displayEnumOptions = Array.isArray(enumOptions) ? enumOptions.map((option, index) => {
-      const {
-        value,
-        label
-      } = option;
-      _valueLabelMap[index] = label || String(value);
-      return {
-        label,
-        value: String(index),
-        isDisabled: Array.isArray(enumDisabled) && enumDisabled.indexOf(value) !== -1
-      };
-    }) : [];
-    const isMultiple = typeof multiple !== 'undefined' && Boolean(enumOptions);
-    const selectedIndex = utils.enumOptionsIndexForValue(value, enumOptions, isMultiple);
-    const formValue = isMultiple ? (selectedIndex || []).map(i => {
-      return {
-        label: _valueLabelMap[i],
-        value: i
-      };
-    }) : {
-      label: _valueLabelMap[selectedIndex] || '',
-      selectedIndex
-    };
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        id: `${id}-label`,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsx(chakraReactSelect.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": utils.ariaDescribedByIds(id)
-      })]
-    });
-  }
-
-  function TextareaWidget({
-    id,
-    placeholder,
-    value,
-    label,
-    hideLabel,
-    disabled,
-    autofocus,
-    readonly,
-    onBlur,
-    onFocus,
-    onChange,
-    options,
-    uiSchema,
-    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
-      }
-    }) => onFocus(id, value);
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsx(react.Textarea, {
-        id: id,
-        name: id,
-        value: value ?? '',
-        placeholder: placeholder,
-        autoFocus: autofocus,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id)
-      })]
-    });
-  }
-
-  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
-      }
-    }) => onFocus(id, value);
-    return jsxRuntime.jsxs(react.FormControl, {
-      mb: 1,
-      ...chakraProps,
-      isDisabled: disabled || readonly,
-      isRequired: required,
-      isReadOnly: readonly,
-      isInvalid: rawErrors && rawErrors.length > 0,
-      children: [utils.labelValue(jsxRuntime.jsx(react.FormLabel, {
-        htmlFor: id,
-        children: label
-      }), hideLabel || !label), jsxRuntime.jsxs(react.NumberInput, {
-        value: value ?? '',
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id),
-        children: [jsxRuntime.jsx(react.NumberInputField, {
-          id: id,
-          name: id
-        }), jsxRuntime.jsxs(react.NumberInputStepper, {
-          children: [jsxRuntime.jsx(react.NumberIncrementStepper, {}), jsxRuntime.jsx(react.NumberDecrementStepper, {})]
-        })]
-      })]
-    });
-  }
-
-  function generateWidgets() {
-    return {
-      AltDateTimeWidget,
-      AltDateWidget,
-      CheckboxWidget,
-      CheckboxesWidget,
-      RadioWidget,
-      RangeWidget,
-      SelectWidget,
-      TextareaWidget,
-      UpDownWidget
-    };
-  }
-  var Widgets = /*#__PURE__*/generateWidgets();
-
-  function generateTheme() {
-    return {
-      templates: generateTemplates(),
-      widgets: generateWidgets()
-    };
-  }
-  var Theme = /*#__PURE__*/generateTheme();
-
-  function generateForm() {
-    return core.withTheme(generateTheme());
-  }
-  var Form = /*#__PURE__*/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;
-      }
-    ```
-
-    It is located at the bottom of the styles string.
-   */
-  const CSSReset = () => jsxRuntime.jsx(react$2.Global, {
-    styles: `
-      html {
-        line-height: 1.5;
-        -webkit-text-size-adjust: 100%;
-        font-family: system-ui, sans-serif;
-        -webkit-font-smoothing: antialiased;
-        text-rendering: optimizeLegibility;
-        -moz-osx-font-smoothing: grayscale;
-        touch-action: manipulation;
-      }
-      body {
-        position: relative;
-        min-height: 100%;
-        font-feature-settings: 'kern';
-      }
-      *,
-      *::before,
-      *::after {
-        border-width: 0;
-        border-style: solid;
-        box-sizing: border-box;
-      }
-      main {
-        display: block;
-      }
-      hr {
-        border-top-width: 1px;
-        box-sizing: content-box;
-        height: 0;
-        overflow: visible;
-      }
-      pre,
-      code,
-      kbd,
-      samp {
-        font-family: SFMono-Regular,  Menlo, Monaco, Consolas, monospace;
-        font-size: 1em;
-      }
-      a {
-        background-color: transparent;
-        color: inherit;
-        text-decoration: inherit;
-      }
-      abbr[title] {
-        border-bottom: none;
-        text-decoration: underline;
-        -webkit-text-decoration: underline dotted;
-        text-decoration: underline dotted;
-      }
-      b,
-      strong {
-        font-weight: bold;
-      }
-      small {
-        font-size: 80%;
-      }
-      sub,
-      sup {
-        font-size: 75%;
-        line-height: 0;
-        position: relative;
-        vertical-align: baseline;
-      }
-      sub {
-        bottom: -0.25em;
-      }
-      sup {
-        top: -0.5em;
-      }
-      img {
-        border-style: none;
-      }
-      button,
-      input,
-      optgroup,
-      select,
-      textarea {
-        font-family: inherit;
-        font-size: 100%;
-        line-height: 1.15;
-        margin: 0;
-      }
-      button,
-      input {
-        overflow: visible;
-      }
-      button,
-      select {
-        text-transform: none;
-      }
-      button::-moz-focus-inner,
-      [type="button"]::-moz-focus-inner,
-      [type="reset"]::-moz-focus-inner,
-      [type="submit"]::-moz-focus-inner {
-        border-style: none;
-        padding: 0;
-      }
-      fieldset {
-        padding: 0.35em 0.75em 0.625em;
-      }
-      legend {
-        box-sizing: border-box;
-        color: inherit;
-        display: table;
-        max-width: 100%;
-        padding: 0;
-        white-space: normal;
-      }
-      progress {
-        vertical-align: baseline;
-      }
-      textarea {
-        overflow: auto;
-      }
-      [type="checkbox"],
-      [type="radio"] {
-        box-sizing: border-box;
-        padding: 0;
-      }
-      [type="number"]::-webkit-inner-spin-button,
-      [type="number"]::-webkit-outer-spin-button {
-        -webkit-appearance: none !important;
-      }
-      input[type="number"] {
-        -moz-appearance: textfield;
-      }
-      [type="search"] {
-        -webkit-appearance: textfield;
-        outline-offset: -2px;
-      }
-      [type="search"]::-webkit-search-decoration {
-        -webkit-appearance: none !important;
-      }
-      ::-webkit-file-upload-button {
-        -webkit-appearance: button;
-        font: inherit;
-      }
-      details {
-        display: block;
-      }
-      summary {
-        display: list-item;
-      }
-      template {
-        display: none;
-      }
-      [hidden] {
-        display: none !important;
-      }
-      body,
-      blockquote,
-      dl,
-      dd,
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6,
-      hr,
-      figure,
-      p,
-      pre {
-        margin: 0;
-      }
-      button {
-        background: transparent;
-        padding: 0;
-      }
-      fieldset {
-        margin: 0;
-        padding: 0;
-      }
-      ol,
-      ul {
-        margin: 0;
-        padding: 0;
-      }
-      textarea {
-        resize: vertical;
-      }
-      button,
-      [role="button"] {
-        cursor: pointer;
-      }
-      button::-moz-focus-inner {
-        border: 0 !important;
-      }
-      table {
-        border-collapse: collapse;
-      }
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6 {
-        font-size: inherit;
-        font-weight: inherit;
-      }
-      button,
-      input,
-      optgroup,
-      select,
-      textarea {
-        padding: 0;
-        line-height: inherit;
-        color: inherit;
-      }
-      img,
-      svg,
-      video,
-      canvas,
-      audio,
-      iframe,
-      embed,
-      object {
-        display: block;
-      }
-      img,
-      video {
-        max-width: 100%;
-        height: auto;
-      }
-      [data-js-focus-visible] :focus:not([data-focus-visible-added]) {
-        outline: none;
-        box-shadow: none;
-      }
-      select::-ms-expand {
-        display: none;
-      }
-      input {
-        border-width: revert;
-        border-color: revert;
-        border-style: revert;
-      }
-      .array-item > hr {
-        margin-top: 16px;
-        margin-bottom: 16px;
-      }
-    `
-  });
-
-  /**
-   * __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__default["default"](container => {
-    const newCache = createCache__default["default"]({
-      container,
-      key: 'rjsf'
-    });
-    return newCache;
-  });
-  const __createChakraFrameProvider = props => ({
-    document
-  }) => {
-    return jsxRuntime.jsx("div", {
-      style: {
-        margin: 2
-      },
-      children: jsxRuntime.jsx(react$2.CacheProvider, {
-        value: memoizedCreateCacheWithContainer(document.head),
-        children: jsxRuntime.jsxs(react.ChakraProvider, {
-          resetCSS: false,
-          children: [jsxRuntime.jsx(CSSReset, {}), props.children]
-        })
-      })
-    });
-  };
-
-  exports.Form = Form;
-  exports.Templates = Templates;
-  exports.Theme = Theme;
-  exports.Widgets = Widgets;
-  exports.__createChakraFrameProvider = __createChakraFrameProvider;
-  exports["default"] = Form;
-  exports.generateForm = generateForm;
-  exports.generateTemplates = generateTemplates;
-  exports.generateTheme = generateTheme;
-  exports.generateWidgets = generateWidgets;
-
-  Object.defineProperty(exports, '__esModule', { value: true });
-
-}));
-//# sourceMappingURL=chakra-ui.umd.development.js.map