@rjsf/semantic-ui 5.11.2 → 5.12.1

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

@@ -1,1333 +0,0 @@
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@rjsf/core'), require('semantic-ui-react'), require('react/jsx-runtime'), require('@rjsf/utils'), require('nanoid'), require('react'), require('lodash-es/map')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@rjsf/core', 'semantic-ui-react', 'react/jsx-runtime', '@rjsf/utils', 'nanoid', 'react', 'lodash-es/map'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@rjsf/semantic-ui"] = {}, global.core, global.semanticUiReact, global.jsxRuntime, global.utils, global.nanoid, global.React, global.map));
-})(this, (function (exports, core, semanticUiReact, jsxRuntime, utils, nanoid, react, map) { 'use strict';
-
-  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-  var map__default = /*#__PURE__*/_interopDefaultLegacy(map);
-
-  /** The `AddButton` renders a button that represent the `Add` action on a form
-   */
-  function AddButton({
-    uiSchema,
-    registry,
-    color,
-    ...props
-  }) {
-    const {
-      translateString
-    } = registry;
-    return jsxRuntime.jsx(semanticUiReact.Button, {
-      title: translateString(utils.TranslatableString.AddItemButton),
-      color: color,
-      ...props,
-      icon: true,
-      size: 'tiny',
-      children: jsxRuntime.jsx(semanticUiReact.Icon, {
-        name: 'plus'
-      })
-    });
-  }
-
-  /**
-   * Extract props meant for semantic UI components from props that are
-   * passed to Widgets, Templates and Fields.
-   * @param {Object} params
-   * @param {Object?} params.formContext
-   * @param {Object?} params.uiSchema
-   * @param {Object?} params.options
-   * @param {Object?} params.defaultSchemaProps
-   * @param {Object?} params.defaultContextProps
-   * @returns {any}
-   */
-  function getSemanticProps({
-    formContext = {},
-    uiSchema = {},
-    options = {},
-    defaultSchemaProps = {
-      fluid: true,
-      inverted: false
-    },
-    defaultContextProps = {}
-  }) {
-    const formContextProps = formContext.semantic;
-    const schemaProps = utils.getUiOptions(uiSchema).semantic;
-    const optionProps = options.semantic;
-    // formContext props should overide other props
-    return Object.assign({}, {
-      ...defaultSchemaProps
-    }, {
-      ...defaultContextProps
-    }, schemaProps, optionProps, formContextProps);
-  }
-  /**
-   * Extract error props meant for semantic UI components from props that are
-   * passed to Widgets, Templates and Fields.
-   * @param {Object} params
-   * @param {Object?} params.formContext
-   * @param {Object?} params.uiSchema
-   * @param {Object?} params.defaultProps
-   * @returns {any}
-   */
-  function getSemanticErrorProps({
-    formContext = {},
-    uiSchema = {},
-    options = {},
-    defaultProps = {
-      size: 'small',
-      pointing: 'above'
-    }
-  }) {
-    const formContextProps = formContext.semantic && formContext.semantic.errorOptions;
-    const semanticOptions = utils.getUiOptions(uiSchema).semantic;
-    const schemaProps = semanticOptions && semanticOptions.errorOptions;
-    const optionProps = options.semantic && options.semantic.errorOptions;
-    return Object.assign({}, {
-      ...defaultProps
-    }, schemaProps, optionProps, formContextProps);
-  }
-  /**
-   * Combine multiple strings containing class names into a single string,
-   * removing duplicates. E.g.
-   * cleanClassNames('bar', 'baz bar', 'x y ', undefined)
-   * // 'bar baz x y'
-   * @param {Array} classNameArr
-   * @param {Array} omit
-   * @returns {string}
-   */
-  function cleanClassNames(classNameArr, omit = []) {
-    // Split each arg on whitespace, and add it to an array. Skip false-y args
-    // like "" and undefined.
-    const classList = classNameArr.filter(Boolean).reduce((previous, current) => previous.concat(current.trim().split(/\s+/)), []);
-    // Remove any class names from omit, and make the rest unique before
-    // returning them as a string
-    return [...new Set(classList.filter(cn => !omit.includes(cn)))].join(' ');
-  }
-  /**
-   *
-   * @param {boolean} wrap
-   * @param Component
-   * @param {Object} props
-   * @returns {*}
-   * @constructor
-   */
-  function MaybeWrap({
-    wrap,
-    component: Component = 'div',
-    ...props
-  }) {
-    return wrap ? jsxRuntime.jsx(Component, {
-      ...props
-    }) : props.children;
-  }
-
-  const gridStyle = vertical => ({
-    display: 'grid',
-    gridTemplateColumns: `1fr ${vertical ? 65 : 150}px`
-  });
-  /** The `ArrayFieldItemTemplate` component is the template used to render an items of an array.
-   *
-   * @param props - The `ArrayFieldTemplateItemType` props for the component
-   */
-  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 uiOptions = utils.getUiOptions(uiSchema);
-    // Pull the semantic props out of the uiOptions that were put in via the ArrayFieldTemplate
-    const {
-      horizontalButtons = true,
-      wrapItem = false
-    } = uiOptions.semantic;
-    return jsxRuntime.jsx("div", {
-      className: 'array-item',
-      children: jsxRuntime.jsx(MaybeWrap, {
-        wrap: wrapItem,
-        component: semanticUiReact.Segment,
-        children: jsxRuntime.jsxs(semanticUiReact.Grid, {
-          style: {
-            ...gridStyle(!horizontalButtons),
-            alignItems: 'center'
-          },
-          children: [jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-            width: 16,
-            verticalAlign: 'middle',
-            children: children
-          }), hasToolbar && jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-            children: (hasMoveUp || hasMoveDown || hasRemove) && jsxRuntime.jsxs(semanticUiReact.Button.Group, {
-              size: 'mini',
-              vertical: !horizontalButtons,
-              children: [(hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveUpButton, {
-                className: 'array-item-move-up',
-                disabled: disabled || readonly || !hasMoveUp,
-                onClick: onReorderClick(index, index - 1),
-                uiSchema: uiSchema,
-                registry: registry
-              }), (hasMoveUp || hasMoveDown) && jsxRuntime.jsx(MoveDownButton, {
-                className: 'array-item-move-down',
-                disabled: disabled || readonly || !hasMoveDown,
-                onClick: onReorderClick(index, index + 1),
-                uiSchema: uiSchema,
-                registry: registry
-              }), hasCopy && jsxRuntime.jsx(CopyButton, {
-                className: 'array-item-copy',
-                disabled: disabled || readonly,
-                onClick: onCopyIndexClick(index),
-                uiSchema: uiSchema,
-                registry: registry
-              }), hasRemove && jsxRuntime.jsx(RemoveButton, {
-                className: 'array-item-remove',
-                disabled: disabled || readonly,
-                onClick: onDropIndexClick(index),
-                uiSchema: uiSchema,
-                registry: registry
-              })]
-            })
-          })]
-        })
-      })
-    });
-  }
-
-  /** The `ArrayFieldTemplate` component is the template used to render all items in an array.
-   *
-   * @param props - The `ArrayFieldTemplateItemType` props for the component
-   */
-  function ArrayFieldTemplate(props) {
-    const {
-      uiSchema,
-      idSchema,
-      canAdd,
-      className,
-      // classNames, This is not part of the type, so it is likely never passed in
-      disabled,
-      formContext,
-      items,
-      onAddClick,
-      // options, This is not part of the type, so it is likely never passed in
-      readonly,
-      required,
-      schema,
-      title,
-      registry
-    } = props;
-    const semanticProps = getSemanticProps({
-      uiSchema,
-      formContext,
-      defaultSchemaProps: {
-        horizontalButtons: true,
-        wrapItem: false
-      }
-    });
-    const {
-      horizontalButtons,
-      wrapItem
-    } = semanticProps;
-    const semantic = {
-      horizontalButtons,
-      wrapItem
-    };
-    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("div", {
-      className: cleanClassNames([className, utils.isFixedItems(schema) ? '' : 'sortable-form-fields']),
-      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("div", {
-        children: [jsxRuntime.jsx("div", {
-          className: 'row array-item-list',
-          children: items && items.map(({
-            key,
-            uiSchema: itemUiSchema = {},
-            ...props
-          }) => {
-            // Merge in the semantic props from the ArrayFieldTemplate into each of the items
-            const mergedUiSchema = {
-              ...itemUiSchema,
-              [utils.UI_OPTIONS_KEY]: {
-                ...itemUiSchema[utils.UI_OPTIONS_KEY],
-                semantic
-              }
-            };
-            return jsxRuntime.jsx(ArrayFieldItemTemplate, {
-              ...props,
-              uiSchema: mergedUiSchema
-            }, key);
-          })
-        }), canAdd && jsxRuntime.jsx("div", {
-          style: {
-            marginTop: '1rem',
-            position: 'relative',
-            textAlign: 'right'
-          },
-          children: jsxRuntime.jsx(AddButton, {
-            onClick: onAddClick,
-            disabled: disabled || readonly,
-            uiSchema: uiSchema,
-            registry: registry
-          })
-        })]
-      }, `array-item-list-${idSchema.$id}`)]
-    });
-  }
-
-  /** The `BaseInputTemplate` is the template to use to render the basic `<input>` component for the `core` theme.
-   * It is used as the template for rendering many of the <input> based widgets that differ by `type` and callbacks only.
-   * It can be customized/overridden for other themes or individual implementations as needed.
-   *
-   * @param props - The `WidgetProps` for this template
-   */
-  function BaseInputTemplate(props) {
-    const {
-      id,
-      placeholder,
-      label,
-      hideLabel,
-      value,
-      required,
-      readonly,
-      disabled,
-      onChange,
-      onChangeOverride,
-      onBlur,
-      onFocus,
-      autofocus,
-      options,
-      schema,
-      uiSchema,
-      formContext,
-      type,
-      rawErrors = []
-    } = props;
-    const inputProps = utils.getInputProps(schema, type, options);
-    const semanticProps = getSemanticProps({
-      uiSchema,
-      formContext,
-      options
-    });
-    const _onChange = ({
-      target: {
-        value
-      }
-    }) => onChange(value === '' ? options.emptyValue : value);
-    const _onBlur = () => onBlur && onBlur(id, value);
-    const _onFocus = () => onFocus && onFocus(id, value);
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [jsxRuntime.jsx(semanticUiReact.Form.Input, {
-        id: id,
-        name: id,
-        placeholder: placeholder,
-        ...inputProps,
-        label: utils.labelValue(label || undefined, hideLabel, false),
-        required: required,
-        autoFocus: autofocus,
-        disabled: disabled || readonly,
-        list: schema.examples ? utils.examplesId(id) : undefined,
-        ...semanticProps,
-        value: value || value === 0 ? value : '',
-        error: rawErrors.length > 0,
-        onChange: onChangeOverride || _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id, !!schema.examples)
-      }, id), 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);
-        })
-      })]
-    });
-  }
-
-  /** The `DescriptionField` is the template to use to render the description of a field
-   *
-   * @param props - The `DescriptionFieldProps` for this component
-   */
-  function DescriptionField(props) {
-    const {
-      id,
-      description
-    } = props;
-    if (!description) {
-      return null;
-    }
-    return jsxRuntime.jsx("p", {
-      id: id,
-      className: 'sui-description',
-      children: description
-    });
-  }
-
-  /** The `ErrorList` component is the template that renders the all the errors associated with the fields in the `Form`
-   *
-   * @param props - The `ErrorListProps` for this component
-   */
-  function ErrorList({
-    errors,
-    registry
-  }) {
-    const {
-      translateString
-    } = registry;
-    return jsxRuntime.jsxs(semanticUiReact.Message, {
-      negative: true,
-      children: [jsxRuntime.jsx(semanticUiReact.Message.Header, {
-        children: translateString(utils.TranslatableString.ErrorsLabel)
-      }), jsxRuntime.jsx(semanticUiReact.Message.List, {
-        children: errors.map((error, index) => jsxRuntime.jsx(semanticUiReact.Message.Item, {
-          children: error.stack
-        }, `error-${index}`))
-      })]
-    });
-  }
-
-  function IconButton(props) {
-    const {
-      icon,
-      iconType,
-      color,
-      className,
-      uiSchema,
-      registry,
-      ...otherProps
-    } = props;
-    return jsxRuntime.jsx(semanticUiReact.Button, {
-      icon: icon,
-      size: iconType,
-      color: color,
-      className: className,
-      ...otherProps
-    });
-  }
-  function CopyButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(IconButton, {
-      title: translateString(utils.TranslatableString.CopyButton),
-      ...props,
-      icon: 'copy'
-    });
-  }
-  function MoveDownButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(IconButton, {
-      title: translateString(utils.TranslatableString.MoveDownButton),
-      ...props,
-      icon: 'angle down'
-    });
-  }
-  function MoveUpButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(IconButton, {
-      title: translateString(utils.TranslatableString.MoveUpButton),
-      ...props,
-      icon: 'angle up'
-    });
-  }
-  function RemoveButton(props) {
-    const {
-      registry: {
-        translateString
-      }
-    } = props;
-    return jsxRuntime.jsx(IconButton, {
-      title: translateString(utils.TranslatableString.RemoveButton),
-      ...props,
-      icon: 'trash'
-    });
-  }
-
-  const DEFAULT_OPTIONS$1 = {
-    options: {
-      pointing: 'above',
-      size: 'small'
-    }
-  };
-  /** The `FieldErrorTemplate` component renders the errors local to the particular field
-   *
-   * @param props - The `FieldErrorProps` for the errors being rendered
-   */
-  function FieldErrorTemplate({
-    errors,
-    idSchema,
-    uiSchema,
-    registry
-  }) {
-    const {
-      formContext
-    } = registry;
-    const options = getSemanticErrorProps({
-      formContext,
-      uiSchema,
-      defaultProps: DEFAULT_OPTIONS$1
-    });
-    const {
-      pointing,
-      size
-    } = options;
-    if (errors && errors.length > 0) {
-      const id = utils.errorId(idSchema);
-      return jsxRuntime.jsx(semanticUiReact.Label, {
-        id: id,
-        color: 'red',
-        pointing: pointing || 'above',
-        size: size || 'small',
-        basic: true,
-        children: jsxRuntime.jsx(semanticUiReact.List, {
-          bulleted: true,
-          children: errors.map(error => jsxRuntime.jsx(semanticUiReact.List.Item, {
-            children: error
-          }, nanoid.nanoid()))
-        })
-      });
-    }
-    return null;
-  }
-
-  /** 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) {
-      const id = utils.helpId(idSchema);
-      return jsxRuntime.jsx(semanticUiReact.Message, {
-        size: 'mini',
-        info: true,
-        id: id,
-        content: help
-      });
-    }
-    return null;
-  }
-
-  /** The `FieldTemplate` component is the template used by `SchemaField` to render any field. It renders the field
-   * content, (label, description, children, errors and help) inside of a `WrapIfAdditional` component.
-   *
-   * @param props - The `FieldTemplateProps` for this component
-   */
-  function FieldTemplate(props) {
-    const {
-      id,
-      children,
-      classNames,
-      style,
-      displayLabel,
-      label,
-      errors,
-      help,
-      hidden,
-      description,
-      rawDescription,
-      registry,
-      schema,
-      uiSchema,
-      ...otherProps
-    } = props;
-    const semanticProps = getSemanticProps(otherProps);
-    const {
-      wrapLabel,
-      wrapContent
-    } = semanticProps;
-    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,
-      id: id,
-      label: label,
-      registry: registry,
-      schema: schema,
-      uiSchema: uiSchema,
-      ...otherProps,
-      children: jsxRuntime.jsx(semanticUiReact.Form.Group, {
-        widths: 'equal',
-        grouped: true,
-        children: jsxRuntime.jsxs(MaybeWrap, {
-          wrap: wrapContent,
-          className: 'sui-field-content',
-          children: [children, displayLabel && rawDescription && jsxRuntime.jsx(MaybeWrap, {
-            wrap: wrapLabel,
-            className: 'sui-field-label',
-            children: description
-          }), help, errors]
-        })
-      }, id)
-    });
-  }
-
-  /** The `ObjectFieldTemplate` is the template to use to render all the inner properties of an object along with the
-   * title and description if available. If the object is expandable, then an `AddButton` is also rendered after all
-   * the properties.
-   *
-   * @param props - The `ObjectFieldTemplateProps` for this component
-   */
-  function ObjectFieldTemplate(props) {
-    const {
-      description,
-      onAddClick,
-      title,
-      properties,
-      disabled,
-      readonly,
-      required,
-      uiSchema,
-      schema,
-      formData,
-      idSchema,
-      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
-      }), properties.map(prop => prop.content), utils.canExpand(schema, uiSchema, formData) && jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-        width: 16,
-        verticalAlign: 'middle',
-        children: jsxRuntime.jsx(semanticUiReact.Grid.Row, {
-          children: jsxRuntime.jsx("div", {
-            style: {
-              marginTop: '1rem',
-              position: 'relative',
-              textAlign: 'right'
-            },
-            children: jsxRuntime.jsx(AddButton, {
-              onClick: onAddClick(schema),
-              disabled: disabled || readonly,
-              uiSchema: uiSchema,
-              registry: registry
-            })
-          })
-        })
-      })]
-    });
-  }
-
-  /** The `SubmitButton` renders a button that represent the `Submit` action on a form
-   */
-  function SubmitButton({
-    uiSchema
-  }) {
-    const {
-      submitText,
-      norender,
-      props: submitButtonProps = {}
-    } = utils.getSubmitButtonOptions(uiSchema);
-    if (norender) {
-      return null;
-    }
-    return jsxRuntime.jsx(semanticUiReact.Button, {
-      type: 'submit',
-      primary: true,
-      ...submitButtonProps,
-      children: submitText
-    });
-  }
-
-  const DEFAULT_OPTIONS = {
-    inverted: false,
-    dividing: true
-  };
-  /** The `TitleField` is the template to use to render the title of a field
-   *
-   * @param props - The `TitleFieldProps` for this component
-   */
-  function TitleField({
-    id,
-    title,
-    uiSchema
-  }) {
-    const semanticProps = getSemanticProps({
-      uiSchema,
-      defaultSchemaProps: DEFAULT_OPTIONS
-    });
-    if (!title) {
-      return null;
-    }
-    return jsxRuntime.jsx(semanticUiReact.Header, {
-      id: id,
-      ...semanticProps,
-      as: 'h5',
-      children: title
-    });
-  }
-
-  /** The `WrapIfAdditional` component is used by the `FieldTemplate` to rename, or remove properties that are
-   * part of an `additionalProperties` part of a schema.
-   *
-   * @param props - The `WrapIfAdditionalProps` for this component
-   */
-  function WrapIfAdditionalTemplate(props) {
-    const {
-      children,
-      classNames,
-      style,
-      disabled,
-      id,
-      label,
-      onDropPropertyClick,
-      onKeyChange,
-      readonly,
-      required,
-      schema,
-      uiSchema,
-      registry
-    } = 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 {
-      readonlyAsDisabled = true,
-      wrapperStyle
-    } = registry.formContext;
-    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.jsx("div", {
-      className: classNames,
-      style: style,
-      children: jsxRuntime.jsx(semanticUiReact.Grid, {
-        columns: 'equal',
-        children: jsxRuntime.jsxs(semanticUiReact.Grid.Row, {
-          children: [jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-            className: 'form-additional',
-            children: jsxRuntime.jsx(semanticUiReact.Form.Group, {
-              widths: 'equal',
-              grouped: true,
-              children: jsxRuntime.jsx(semanticUiReact.Form.Input, {
-                className: 'form-group',
-                hasFeedback: true,
-                fluid: true,
-                htmlFor: `${id}`,
-                label: keyLabel,
-                required: required,
-                defaultValue: label,
-                disabled: disabled || readonlyAsDisabled && readonly,
-                id: `${id}`,
-                name: `${id}`,
-                onBlur: !readonly ? handleBlur : undefined,
-                style: wrapperStyle,
-                type: 'text'
-              })
-            })
-          }), jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-            className: 'form-additional',
-            verticalAlign: 'middle',
-            children: children
-          }), jsxRuntime.jsx(semanticUiReact.Grid.Column, {
-            children: jsxRuntime.jsx(RemoveButton, {
-              iconType: 'mini',
-              className: 'array-item-remove',
-              disabled: disabled || readonly,
-              onClick: onDropPropertyClick(label),
-              uiSchema: uiSchema,
-              registry: registry
-            })
-          })]
-        })
-      })
-    }, `${id}-key`);
-  }
-
-  function generateTemplates() {
-    return {
-      ArrayFieldItemTemplate,
-      ArrayFieldTemplate,
-      BaseInputTemplate,
-      ButtonTemplates: {
-        AddButton,
-        CopyButton,
-        MoveDownButton,
-        MoveUpButton,
-        RemoveButton,
-        SubmitButton
-      },
-      DescriptionFieldTemplate: DescriptionField,
-      ErrorListTemplate: ErrorList,
-      FieldErrorTemplate,
-      FieldHelpTemplate,
-      FieldTemplate,
-      ObjectFieldTemplate,
-      TitleFieldTemplate: TitleField,
-      WrapIfAdditionalTemplate
-    };
-  }
-  var Templates = /*#__PURE__*/generateTemplates();
-
-  /** The `CheckBoxWidget` is a widget for rendering boolean properties.
-   *  It is typically used to represent a boolean.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function CheckboxWidget(props) {
-    const {
-      id,
-      value,
-      disabled,
-      readonly,
-      label = '',
-      hideLabel,
-      autofocus,
-      onChange,
-      onBlur,
-      options,
-      onFocus,
-      formContext,
-      schema,
-      uiSchema,
-      rawErrors = [],
-      registry
-    } = props;
-    const semanticProps = getSemanticProps({
-      options,
-      formContext,
-      uiSchema,
-      defaultSchemaProps: {
-        inverted: 'false'
-      }
-    });
-    const DescriptionFieldTemplate = utils.getTemplate('DescriptionFieldTemplate', registry, options);
-    // 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 _onChange = (_, data) => onChange && onChange(data.checked);
-    const _onBlur = () => onBlur && onBlur(id, value);
-    const _onFocus = () => onFocus && onFocus(id, value);
-    const checked = value == 'true' || value == true;
-    const description = options.description ?? schema.description;
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [!hideLabel && !!description && jsxRuntime.jsx(DescriptionFieldTemplate, {
-        id: utils.descriptionId(id),
-        description: description,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsx(semanticUiReact.Form.Checkbox, {
-        id: id,
-        name: id,
-        disabled: disabled || readonly,
-        autoFocus: autofocus,
-        ...semanticProps,
-        checked: typeof value === 'undefined' ? false : checked,
-        error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        required: required,
-        label: utils.labelValue(label, hideLabel, false),
-        "aria-describedby": utils.ariaDescribedByIds(id)
-      })]
-    });
-  }
-
-  /** The `CheckboxesWidget` is a widget for rendering checkbox groups.
-   *  It is typically used to represent an array of enums.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function CheckboxesWidget(props) {
-    const {
-      id,
-      disabled,
-      options,
-      value,
-      autofocus,
-      readonly,
-      label,
-      hideLabel,
-      onChange,
-      onBlur,
-      onFocus,
-      formContext,
-      schema,
-      uiSchema,
-      rawErrors = [],
-      registry
-    } = props;
-    const TitleFieldTemplate = utils.getTemplate('TitleFieldTemplate', registry, options);
-    const {
-      enumOptions,
-      enumDisabled,
-      inline
-    } = options;
-    const checkboxesValues = Array.isArray(value) ? value : [value];
-    const semanticProps = getSemanticProps({
-      options,
-      formContext,
-      uiSchema,
-      defaultSchemaProps: {
-        inverted: 'false'
-      }
-    });
-    const _onChange = index => ({
-      target: {
-        checked
-      }
-    }) => {
-      // eslint-disable-next-line no-shadow
-      if (checked) {
-        onChange(utils.enumOptionsSelectValue(index, checkboxesValues, enumOptions));
-      } else {
-        onChange(utils.enumOptionsDeselectValue(index, checkboxesValues, enumOptions));
-      }
-    };
-    const _onBlur = () => onBlur(id, value);
-    const _onFocus = () => onFocus(id, value);
-    const inlineOption = inline ? {
-      inline: true
-    } : {
-      grouped: true
-    };
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [!hideLabel && !!label && jsxRuntime.jsx(TitleFieldTemplate, {
-        id: utils.titleId(id),
-        title: label,
-        schema: schema,
-        uiSchema: uiSchema,
-        registry: registry
-      }), jsxRuntime.jsx(semanticUiReact.Form.Group, {
-        id: id,
-        name: id,
-        ...inlineOption,
-        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(semanticUiReact.Form.Checkbox, {
-            id: utils.optionId(id, index),
-            name: id,
-            label: option.label,
-            ...semanticProps,
-            checked: checked,
-            error: rawErrors.length > 0,
-            disabled: disabled || itemDisabled || readonly,
-            autoFocus: autofocus && index === 0,
-            onChange: _onChange(index),
-            onBlur: _onBlur,
-            onFocus: _onFocus,
-            "aria-describedby": utils.ariaDescribedByIds(id)
-          }, index);
-        })
-      })]
-    });
-  }
-
-  /** The `RadioWidget` is a widget for rendering a radio group.
-   *  It is typically used with a string property constrained with enum options.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function RadioWidget(props) {
-    const {
-      id,
-      value,
-      required,
-      disabled,
-      readonly,
-      onChange,
-      onBlur,
-      onFocus,
-      options,
-      formContext,
-      uiSchema,
-      rawErrors = []
-    } = props;
-    const {
-      enumOptions,
-      enumDisabled,
-      emptyValue
-    } = options;
-    const semanticProps = getSemanticProps({
-      formContext,
-      options,
-      uiSchema
-    });
-    const _onChange = (_, {
-      value: eventValue
-    }) => {
-      return onChange(utils.enumOptionsValueForIndex(eventValue, enumOptions, emptyValue));
-    };
-    const _onBlur = () => onBlur(id, value);
-    const _onFocus = () => onFocus(id, value);
-    const inlineOption = options.inline ? {
-      inline: true
-    } : {
-      grouped: true
-    };
-    return jsxRuntime.jsx(semanticUiReact.Form.Group, {
-      ...inlineOption,
-      children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-        const checked = utils.enumOptionsIsSelected(option.value, value);
-        const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-        return /*#__PURE__*/react.createElement(semanticUiReact.Form.Field, {
-          required: required,
-          control: semanticUiReact.Radio,
-          id: utils.optionId(id, index),
-          name: id,
-          ...semanticProps,
-          onFocus: _onFocus,
-          onBlur: _onBlur,
-          onChange: _onChange,
-          label: option.label,
-          value: String(index),
-          error: rawErrors.length > 0,
-          key: index,
-          checked: checked,
-          disabled: disabled || itemDisabled || readonly,
-          "aria-describedby": utils.ariaDescribedByIds(id)
-        });
-      })
-    });
-  }
-
-  /** The `RangeWidget` component uses the `BaseInputTemplate` changing the type to `range` and wrapping the result
-   * in a div, with the value along side it.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function RangeWidget(props) {
-    const {
-      id,
-      value,
-      required,
-      readonly,
-      disabled,
-      onChange,
-      onBlur,
-      onFocus,
-      options,
-      schema,
-      uiSchema,
-      formContext,
-      rawErrors = []
-    } = props;
-    const semanticProps = getSemanticProps({
-      formContext,
-      options,
-      uiSchema,
-      defaultSchemaProps: {
-        fluid: true
-      }
-    });
-    // eslint-disable-next-line no-shadow
-    const _onChange = ({
-      target: {
-        value
-      }
-    }) => onChange && onChange(value === '' ? options.emptyValue : value);
-    const _onBlur = () => onBlur && onBlur(id, value);
-    const _onFocus = () => onFocus && onFocus(id, value);
-    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [jsxRuntime.jsx(semanticUiReact.Input, {
-        id: id,
-        name: id,
-        type: 'range',
-        required: required,
-        disabled: disabled || readonly,
-        ...utils.rangeSpec(schema),
-        ...semanticProps,
-        value: value || '',
-        error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
-        "aria-describedby": utils.ariaDescribedByIds(id)
-      }, id), jsxRuntime.jsx("span", {
-        children: value
-      })]
-    });
-  }
-
-  /**
-   * Returns and creates an array format required for semantic drop down
-   * @param {array} enumOptions- array of items for the dropdown
-   * @param {array} enumDisabled - array of enum option values to disable
-   * @returns {*}
-   */
-  function createDefaultValueOptionsForDropDown(enumOptions, enumDisabled) {
-    const disabledOptions = enumDisabled || [];
-    const options = map__default["default"](enumOptions, ({
-      label,
-      value
-    }, index) => ({
-      disabled: disabledOptions.indexOf(value) !== -1,
-      key: label,
-      text: label,
-      value: String(index)
-    }));
-    return options;
-  }
-  /** The `SelectWidget` is a widget for rendering dropdowns.
-   *  It is typically used with string properties constrained with enum options.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function SelectWidget(props) {
-    const {
-      uiSchema,
-      formContext,
-      id,
-      options,
-      label,
-      hideLabel,
-      required,
-      disabled,
-      readonly,
-      value,
-      multiple,
-      placeholder,
-      autofocus,
-      onChange,
-      onBlur,
-      onFocus,
-      rawErrors = []
-    } = props;
-    const semanticProps = getSemanticProps({
-      uiSchema,
-      formContext,
-      options,
-      defaultSchemaProps: {
-        inverted: 'false',
-        selection: true,
-        fluid: true,
-        scrolling: true,
-        upward: false
-      }
-    });
-    const {
-      enumDisabled,
-      enumOptions,
-      emptyValue: optEmptyVal
-    } = options;
-    const emptyValue = multiple ? [] : '';
-    const dropdownOptions = createDefaultValueOptionsForDropDown(enumOptions, enumDisabled);
-    const _onChange = (_, {
-      value
-    }) => onChange(utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    // eslint-disable-next-line no-shadow
-    const _onBlur = (_, {
-      target: {
-        value
-      }
-    }) => onBlur(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    const _onFocus = (_, {
-      target: {
-        value
-      }
-    }) => onFocus(id, utils.enumOptionsValueForIndex(value, enumOptions, optEmptyVal));
-    const selectedIndexes = utils.enumOptionsIndexForValue(value, enumOptions, multiple);
-    return jsxRuntime.jsx(semanticUiReact.Form.Dropdown, {
-      id: id,
-      name: id,
-      label: utils.labelValue(label || undefined, hideLabel, false),
-      multiple: typeof multiple === 'undefined' ? false : multiple,
-      value: typeof value === 'undefined' ? emptyValue : selectedIndexes,
-      error: rawErrors.length > 0,
-      disabled: disabled,
-      placeholder: placeholder,
-      ...semanticProps,
-      required: required,
-      autoFocus: autofocus,
-      readOnly: readonly,
-      options: dropdownOptions,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": utils.ariaDescribedByIds(id)
-    }, id);
-  }
-
-  /** The `TextareaWidget` is a widget for rendering input fields as textarea.
-   *
-   * @param props - The `WidgetProps` for this component
-   */
-  function TextareaWidget(props) {
-    const {
-      id,
-      placeholder,
-      value,
-      required,
-      disabled,
-      autofocus,
-      label,
-      hideLabel,
-      readonly,
-      onBlur,
-      onFocus,
-      onChange,
-      options,
-      formContext,
-      rawErrors = []
-    } = props;
-    const semanticProps = getSemanticProps({
-      formContext,
-      options,
-      defaultSchemaProps: {
-        inverted: 'false'
-      }
-    });
-    // eslint-disable-next-line no-shadow
-    const _onChange = ({
-      target: {
-        value
-      }
-    }) => onChange && onChange(value === '' ? options.emptyValue : value);
-    const _onBlur = () => onBlur && onBlur(id, value);
-    const _onFocus = () => onFocus && onFocus(id, value);
-    return jsxRuntime.jsx(semanticUiReact.Form.TextArea, {
-      id: id,
-      name: id,
-      label: utils.labelValue(label || undefined, hideLabel, false),
-      placeholder: placeholder,
-      autoFocus: autofocus,
-      required: required,
-      disabled: disabled || readonly,
-      ...semanticProps,
-      value: value || '',
-      error: rawErrors.length > 0,
-      rows: options.rows || 5,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
-      "aria-describedby": utils.ariaDescribedByIds(id)
-    }, id);
-  }
-
-  function generateWidgets() {
-    return {
-      CheckboxWidget,
-      CheckboxesWidget,
-      RadioWidget,
-      RangeWidget,
-      SelectWidget,
-      TextareaWidget
-    };
-  }
-  var Widgets = /*#__PURE__*/generateWidgets();
-
-  function generateTheme() {
-    return {
-      templates: generateTemplates(),
-      widgets: generateWidgets(),
-      _internalFormWrapper: semanticUiReact.Form
-    };
-  }
-  var Theme = /*#__PURE__*/generateTheme();
-
-  function generateForm() {
-    return core.withTheme(generateTheme());
-  }
-  var SemanticUIForm = /*#__PURE__*/generateForm();
-
-  exports.Form = SemanticUIForm;
-  exports.Templates = Templates;
-  exports.Theme = Theme;
-  exports.Widgets = Widgets;
-  exports["default"] = SemanticUIForm;
-  exports.generateForm = generateForm;
-  exports.generateTemplates = generateTemplates;
-  exports.generateTheme = generateTheme;
-  exports.generateWidgets = generateWidgets;
-
-  Object.defineProperty(exports, '__esModule', { value: true });
-
-}));
-//# sourceMappingURL=semantic-ui.umd.development.js.map