@rjsf/semantic-ui 6.6.1 → 6.6.2

package/dist/index.cjs

@@ -89,14 +89,13 @@ function getSemanticProps({
   const formContextProps = formContext.semantic;
   const schemaProps = (0, import_utils2.getUiOptions)(uiSchema).semantic;
   const optionProps = options.semantic;
-  return Object.assign(
-    {},
-    { ...defaultSchemaProps },
-    { ...defaultContextProps },
-    schemaProps,
-    optionProps,
-    formContextProps
-  );
+  return {
+    ...defaultSchemaProps,
+    ...defaultContextProps,
+    ...schemaProps,
+    ...optionProps,
+    ...formContextProps
+  };
 }
 function getSemanticErrorProps({
   formContext = {},
@@ -108,7 +107,7 @@ function getSemanticErrorProps({
   const semanticOptions = (0, import_utils2.getUiOptions)(uiSchema).semantic;
   const schemaProps = semanticOptions && semanticOptions.errorOptions;
   const optionProps = options.semantic && options.semantic.errorOptions;
-  return Object.assign({}, { ...defaultProps }, schemaProps, optionProps, formContextProps);
+  return { ...defaultProps, ...schemaProps, ...optionProps, ...formContextProps };
 }
 function cleanClassNames(classNameArr, omit = []) {
   const classList = classNameArr.filter(Boolean).reduce((previous, current) => previous.concat(current.trim().split(/\s+/)), []);
@@ -278,10 +277,10 @@ function BaseInputTemplate(props) {
     formContext: registry.formContext,
     options
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
-  const _onClear = (0, import_react.useCallback)(
+  const handleChange = ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue);
+  const handleBlur = () => onBlur && onBlur(id, value);
+  const handleFocus = () => onFocus && onFocus(id, value);
+  const handleClear = (0, import_react.useCallback)(
     (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -305,14 +304,14 @@ function BaseInputTemplate(props) {
         ...semanticProps,
         value: value || value === 0 ? value : "",
         error: rawErrors.length > 0,
-        onChange: onChangeOverride || _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: onChangeOverride || handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         "aria-describedby": (0, import_utils5.ariaDescribedByIds)(id, !!schema.examples)
       },
       id
     ),
-    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ClearButton2, { registry, onClick: _onClear }),
+    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ClearButton2, { registry, onClick: handleClear }),
     /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core.SchemaExamples, { id, schema })
   ] });
 }
@@ -339,7 +338,10 @@ function ErrorList({
   const { translateString } = registry;
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_semantic_ui_react4.Message, { negative: true, children: [
     /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.Header, { children: translateString(import_utils6.TranslatableString.ErrorsLabel) }),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.List, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.Item, { children: error.stack }, `error-${index}`)) })
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.List, { children: errors.map((error, index) => (
+      // oxlint-disable-next-line react/no-array-index-key
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_semantic_ui_react4.Message.Item, { children: error.stack }, `error-${index}`)
+    )) })
   ] });
 }
 
@@ -454,10 +456,11 @@ function GridTemplate(props) {
 }
 
 // src/IconButton/IconButton.tsx
+var import_react2 = require("react");
 var import_utils10 = require("@rjsf/utils");
 var import_semantic_ui_react9 = require("semantic-ui-react");
 var import_jsx_runtime12 = require("react/jsx-runtime");
-function IconButton(props) {
+function IconButtonFn(props) {
   const { icon, iconType, color, className, uiSchema, registry, ...otherProps } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     import_semantic_ui_react9.Button,
@@ -470,36 +473,42 @@ function IconButton(props) {
     }
   );
 }
-function CopyButton(props) {
+var IconButton = (0, import_react2.memo)(IconButtonFn);
+function CopyButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.CopyButton), ...props, icon: "copy" });
 }
-function MoveDownButton(props) {
+var CopyButton = (0, import_react2.memo)(CopyButtonFn);
+function MoveDownButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveDownButton), ...props, icon: "angle down" });
 }
-function MoveUpButton(props) {
+var MoveDownButton = (0, import_react2.memo)(MoveDownButtonFn);
+function MoveUpButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.MoveUpButton), ...props, icon: "angle up" });
 }
-function RemoveButton(props) {
+var MoveUpButton = (0, import_react2.memo)(MoveUpButtonFn);
+function RemoveButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.RemoveButton), ...props, icon: "trash" });
 }
-function ClearButton(props) {
+var RemoveButton = (0, import_react2.memo)(RemoveButtonFn);
+function ClearButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(IconButton, { title: translateString(import_utils10.TranslatableString.ClearButton), ...props, icon: "close" });
 }
+var ClearButton = (0, import_react2.memo)(ClearButtonFn);
 
 // src/MultiSchemaFieldTemplate/MultiSchemaFieldTemplate.tsx
 var import_jsx_runtime13 = require("react/jsx-runtime");
@@ -607,7 +616,8 @@ function OptionalDataControlsTemplate(props) {
         size: "mini"
       }
     );
-  } else if (onRemoveClick) {
+  }
+  if (onRemoveClick) {
     return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       RemoveButton,
       {
@@ -700,13 +710,13 @@ function WrapIfAdditionalTemplate(props) {
         className: "form-group",
         hasFeedback: true,
         fluid: true,
-        htmlFor: `${id}`,
+        htmlFor: id,
         label: displayLabel ? keyLabel : void 0,
         required,
         defaultValue: label,
         disabled: disabled || readonlyAsDisabled && readonly,
-        id: `${id}`,
-        name: `${id}`,
+        id,
+        name: id,
         onBlur: !readonly ? onKeyRenameBlur : void 0,
         style: wrapperStyle,
         type: "text"
@@ -793,21 +803,21 @@ function CheckboxesWidget(props) {
       inverted: "false"
     }
   });
-  const _onChange = (index) => ({ target: { checked } }) => {
+  const handleChange = (index) => ({ target: { checked } }) => {
     if (checked) {
       onChange((0, import_utils14.enumOptionsSelectValue)(index, checkboxesValues, enumOptions));
     } else {
       onChange((0, import_utils14.enumOptionsDeselectValue)(index, checkboxesValues, enumOptions));
     }
   };
-  const _onBlur = () => onBlur(id, value);
-  const _onFocus = () => onFocus(id, value);
+  const handleBlur = () => onBlur(id, value);
+  const handleFocus = () => onFocus(id, value);
   const inlineOption = inline ? { inline: true } : { grouped: true };
   return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
     !hideLabel && !!label && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(TitleFieldTemplate, { id: (0, import_utils14.titleId)(id), title: label, schema, uiSchema, registry }),
     /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_semantic_ui_react14.Form.Group, { id, name: htmlName || id, ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
       const checked = (0, import_utils14.enumOptionsIsSelected)(option.value, checkboxesValues);
-      const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+      const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
       return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
         import_semantic_ui_react14.Form.Checkbox,
         {
@@ -819,12 +829,12 @@ function CheckboxesWidget(props) {
           error: rawErrors.length > 0,
           disabled: disabled || itemDisabled || readonly,
           autoFocus: autofocus && index === 0,
-          onChange: _onChange(index),
-          onBlur: _onBlur,
-          onFocus: _onFocus,
+          onChange: handleChange(index),
+          onBlur: handleBlur,
+          onFocus: handleFocus,
           "aria-describedby": (0, import_utils14.ariaDescribedByIds)(id)
         },
-        index
+        String(option.value)
       );
     }) })
   ] });
@@ -867,10 +877,10 @@ function CheckboxWidget(props) {
     options
   );
   const required = (0, import_utils15.schemaRequiresTrueValue)(schema);
-  const checked = value == "true" || value == true;
-  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 handleChange = (_, data) => onChange && onChange(data.checked);
+  const handleBlur = () => onBlur && onBlur(id, value);
+  const handleFocus = () => onFocus && onFocus(id, value);
   const description = options.description ?? schema.description;
   return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
     !hideLabel && description && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
@@ -893,9 +903,9 @@ function CheckboxWidget(props) {
         ...semanticProps,
         checked: typeof value === "undefined" ? false : checked,
         error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         required,
         label: (0, import_utils15.labelValue)(label, hideLabel, false),
         "aria-describedby": (0, import_utils15.ariaDescribedByIds)(id)
@@ -908,7 +918,7 @@ function CheckboxWidget(props) {
 var import_utils16 = require("@rjsf/utils");
 var import_semantic_ui_react16 = require("semantic-ui-react");
 var import_jsx_runtime21 = require("react/jsx-runtime");
-var import_react2 = require("react");
+var import_react3 = require("react");
 function RadioWidget(props) {
   const {
     id,
@@ -932,16 +942,14 @@ function RadioWidget(props) {
     options,
     uiSchema
   });
-  const _onChange = (_, { value: eventValue }) => {
-    return onChange((0, import_utils16.enumOptionValueDecoder)(String(eventValue), enumOptions, optionValueFormat, emptyValue));
-  };
-  const _onBlur = () => onBlur(id, value);
-  const _onFocus = () => onFocus(id, value);
+  const handleChange = (_, { value: eventValue }) => onChange((0, import_utils16.enumOptionValueDecoder)(String(eventValue), enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = () => onBlur(id, value);
+  const handleFocus = () => onFocus(id, value);
   const inlineOption = options.inline ? { inline: true } : { grouped: true };
   return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_semantic_ui_react16.Form.Group, { ...inlineOption, children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const checked = (0, import_utils16.enumOptionsIsSelected)(option.value, value);
-    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
-    return /* @__PURE__ */ (0, import_react2.createElement)(
+    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
+    return /* @__PURE__ */ (0, import_react3.createElement)(
       import_semantic_ui_react16.Form.Field,
       {
         required,
@@ -949,13 +957,13 @@ function RadioWidget(props) {
         id: (0, import_utils16.optionId)(id, index),
         name: htmlName || id,
         ...semanticProps,
-        onFocus: _onFocus,
-        onBlur: _onBlur,
-        onChange: _onChange,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        onChange: handleChange,
         label: option.label,
         value: (0, import_utils16.enumOptionValueEncoder)(option.value, index, optionValueFormat),
         error: rawErrors.length > 0,
-        key: index,
+        key: String(option.value),
         checked,
         disabled: disabled || itemDisabled || readonly,
         "aria-describedby": (0, import_utils16.ariaDescribedByIds)(id)
@@ -992,9 +1000,9 @@ function RangeWidget(props) {
       fluid: true
     }
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
+  const handleChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
+  const handleBlur = () => onBlur && onBlur(id, value);
+  const handleFocus = () => onFocus && onFocus(id, value);
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
       import_semantic_ui_react17.Input,
@@ -1008,9 +1016,9 @@ function RangeWidget(props) {
         ...semanticProps,
         value: value || "",
         error: rawErrors.length > 0,
-        onChange: _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         "aria-describedby": (0, import_utils17.ariaDescribedByIds)(id)
       },
       id
@@ -1027,7 +1035,7 @@ var import_jsx_runtime23 = require("react/jsx-runtime");
 function createDefaultValueOptionsForDropDown(enumOptions, enumDisabled, showPlaceholderOption, placeholder, format = "indexed") {
   const disabledOptions = enumDisabled || [];
   const options = (0, import_map.default)(enumOptions, ({ label, value }, index) => ({
-    disabled: disabledOptions.indexOf(value) !== -1,
+    disabled: disabledOptions.includes(value),
     key: label,
     text: label,
     value: (0, import_utils18.enumOptionValueEncoder)(value, index, format)
@@ -1082,9 +1090,9 @@ function SelectWidget(props) {
     placeholder,
     optionValueFormat
   );
-  const _onChange = (_, { value: value2 }) => onChange((0, import_utils18.enumOptionValueDecoder)(value2, enumOptions, optionValueFormat, optEmptyVal));
-  const _onBlur = (_, { target }) => onBlur(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
-  const _onFocus = (_, { target }) => onFocus(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
+  const handleChange = (_, { value: enumValue }) => onChange((0, import_utils18.enumOptionValueDecoder)(enumValue, enumOptions, optionValueFormat, optEmptyVal));
+  const handleBlur = (_, { target }) => onBlur(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
+  const handleFocus = (_, { target }) => onFocus(id, (0, import_utils18.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, optEmptyVal));
   return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
     import_semantic_ui_react18.Form.Dropdown,
     {
@@ -1101,9 +1109,9 @@ function SelectWidget(props) {
       autoFocus: autofocus,
       readOnly: readonly,
       options: dropdownOptions,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
       "aria-describedby": (0, import_utils18.ariaDescribedByIds)(id)
     },
     id
@@ -1138,9 +1146,9 @@ function TextareaWidget(props) {
     options,
     defaultSchemaProps: { inverted: "false" }
   });
-  const _onChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = () => onBlur && onBlur(id, value);
-  const _onFocus = () => onFocus && onFocus(id, value);
+  const handleChange = ({ target: { value: value2 } }) => onChange && onChange(value2 === "" ? options.emptyValue : value2);
+  const handleBlur = () => onBlur && onBlur(id, value);
+  const handleFocus = () => onFocus && onFocus(id, value);
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_semantic_ui_react19.Form.TextArea,
     {
@@ -1155,9 +1163,9 @@ function TextareaWidget(props) {
       value: value || "",
       error: rawErrors.length > 0,
       rows: options.rows || 5,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
       "aria-describedby": (0, import_utils19.ariaDescribedByIds)(id)
     },
     id