@rjsf/shadcn 6.6.0 → 6.6.2

package/dist/index.cjs

@@ -267,10 +267,10 @@ function BaseInputTemplate({
     ...extraProps,
     ...(0, import_utils7.getInputProps)(schema, type, options)
   };
-  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = ({ target }) => onBlur(id, target && target.value);
-  const _onFocus = ({ target }) => onFocus(id, target && target.value);
-  const _onClear = (0, import_react.useCallback)(
+  const handleChange = ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue);
+  const handleBlur = ({ target }) => onBlur(id, target && target.value);
+  const handleFocus = ({ target }) => onFocus(id, target && target.value);
+  const handleClear = (0, import_react.useCallback)(
     (e) => {
       e.preventDefault();
       e.stopPropagation();
@@ -294,13 +294,13 @@ function BaseInputTemplate({
         list: schema.examples ? (0, import_utils7.examplesId)(id) : void 0,
         ...inputProps,
         value: value || value === 0 ? value : "",
-        onChange: onChangeOverride || _onChange,
-        onBlur: _onBlur,
-        onFocus: _onFocus,
+        onChange: onChangeOverride || handleChange,
+        onBlur: handleBlur,
+        onFocus: handleFocus,
         "aria-describedby": (0, import_utils7.ariaDescribedByIds)(id, !!schema.examples)
       }
     ),
-    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ClearButton2, { onClick: _onClear, registry }),
+    options.allowClearTextInputs && !readonly && !disabled && value && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ClearButton2, { onClick: handleClear, registry }),
     children,
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core.SchemaExamples, { id, schema })
   ] });
@@ -374,27 +374,29 @@ function ErrorList({
   return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Alert, { variant: "destructive", className: "mb-2", children: [
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react2.AlertCircle, { className: "h-4 w-4" }),
     /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AlertTitle, { children: translateString(import_utils10.TranslatableString.ErrorsLabel) }),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AlertDescription, { className: "flex flex-col gap-1", children: errors.map((error, i) => {
-      return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AlertDescription, { className: "flex flex-col gap-1", children: errors.map((error, i) => (
+      // oxlint-disable-next-line react/no-array-index-key
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { children: [
         "\u2022 ",
         error.stack
-      ] }, i);
-    }) })
+      ] }, i)
+    )) })
   ] });
 }
 
 // src/FieldErrorTemplate/FieldErrorTemplate.tsx
 var import_utils11 = require("@rjsf/utils");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime10 = (
+  // oxlint-disable-next-line react/no-array-index-key
+  require("react/jsx-runtime")
+);
 function FieldErrorTemplate(props) {
   const { errors = [], fieldPathId } = props;
   if (errors.length === 0) {
     return null;
   }
   const id = (0, import_utils11.errorId)(fieldPathId);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col gap-1", id, children: errors.map((error, i) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs font-medium text-destructive mb-1", children: error }, i);
-  }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col gap-1", id, children: errors.map((error, i) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs font-medium text-destructive mb-1", children: error }, i)) });
 }
 
 // src/FieldHelpTemplate/FieldHelpTemplate.tsx
@@ -508,20 +510,24 @@ function GridTemplate(props) {
 }
 
 // src/IconButton/IconButton.tsx
+var import_react2 = require("react");
 var import_utils17 = require("@rjsf/utils");
 var import_lucide_react3 = require("lucide-react");
 var import_jsx_runtime14 = require("react/jsx-runtime");
-function IconButton(props) {
+function IconButtonFn(props) {
   const { icon, iconType, className, uiSchema, registry, ...otherProps } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button, { size: "icon", variant: "outline", className, ...otherProps, type: "button", children: icon });
 }
-function CopyButton(props) {
+var IconButton = (0, import_react2.memo)(IconButtonFn);
+var IconButton_default = IconButton;
+function CopyButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IconButton, { title: translateString(import_utils17.TranslatableString.CopyButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react3.Copy, { className: "h-4 w-4" }) });
 }
-function MoveDownButton(props) {
+var CopyButton = (0, import_react2.memo)(CopyButtonFn);
+function MoveDownButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
@@ -534,7 +540,8 @@ function MoveDownButton(props) {
     }
   );
 }
-function MoveUpButton(props) {
+var MoveDownButton = (0, import_react2.memo)(MoveDownButtonFn);
+function MoveUpButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
@@ -547,7 +554,8 @@ function MoveUpButton(props) {
     }
   );
 }
-function RemoveButton(props) {
+var MoveUpButton = (0, import_react2.memo)(MoveUpButtonFn);
+function RemoveButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
@@ -561,12 +569,14 @@ function RemoveButton(props) {
     }
   );
 }
-function ClearButton(props) {
+var RemoveButton = (0, import_react2.memo)(RemoveButtonFn);
+function ClearButtonFn(props) {
   const {
     registry: { translateString }
   } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(IconButton, { title: translateString(import_utils17.TranslatableString.ClearButton), ...props, icon: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react3.X, {}) });
 }
+var ClearButton = (0, import_react2.memo)(ClearButtonFn);
 
 // src/MultiSchemaFieldTemplate/MultiSchemaFieldTemplate.tsx
 var import_jsx_runtime15 = require("react/jsx-runtime");
@@ -631,7 +641,7 @@ function ObjectFieldTemplate({
     ),
     /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-2", children: [
       !showOptionalDataControlInTitle ? optionalDataControl : void 0,
-      properties.map((element, index) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: `${element.hidden ? "hidden" : ""} flex`, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "w-full", children: element.content }) }, index)),
+      properties.map((element) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: `${element.hidden ? "hidden" : ""} flex`, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "w-full", children: element.content }) }, element.name)),
       (0, import_utils19.canExpand)(schema, uiSchema, formData) ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "mt-2 flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         AddButton2,
         {
@@ -654,7 +664,7 @@ function OptionalDataControlsTemplate(props) {
   const { id, registry, label, onAddClick, onRemoveClick } = props;
   if (onAddClick) {
     return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      IconButton,
+      IconButton_default,
       {
         id,
         registry,
@@ -665,7 +675,8 @@ function OptionalDataControlsTemplate(props) {
         size: "xs"
       }
     );
-  } else if (onRemoveClick) {
+  }
+  if (onRemoveClick) {
     return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       RemoveButton,
       {
@@ -904,11 +915,11 @@ function CheckboxesWidget({
   const { enumOptions, enumDisabled, inline, emptyValue } = options;
   const optionValueFormat = (0, import_utils27.getOptionValueFormat)(options);
   const checkboxesValues = Array.isArray(value) ? value : [value];
-  const _onBlur = ({ target }) => onBlur(id, (0, import_utils27.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
-  const _onFocus = ({ target }) => onFocus(id, (0, import_utils27.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = ({ target }) => onBlur(id, (0, import_utils27.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleFocus = ({ target }) => onFocus(id, (0, import_utils27.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
   return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: cn({ "flex flex-col gap-2": !inline, "flex flex-row gap-4 flex-wrap": inline }), children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
     const checked = (0, import_utils27.enumOptionsIsSelected)(option.value, checkboxesValues);
-    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+    const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
     const indexOptionId = (0, import_utils27.optionId)(id, index);
     return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
@@ -928,8 +939,8 @@ function CheckboxesWidget({
           className,
           checked,
           autoFocus: autofocus && index === 0,
-          onBlur: _onBlur,
-          onFocus: _onFocus,
+          onBlur: handleBlur,
+          onFocus: handleFocus,
           "aria-describedby": (0, import_utils27.ariaDescribedByIds)(id)
         }
       ),
@@ -966,9 +977,9 @@ function CheckboxWidget(props) {
     registry,
     options
   );
-  const _onChange = (checked) => onChange(checked);
-  const _onBlur = () => onBlur(id, value);
-  const _onFocus = () => onFocus(id, value);
+  const handleChange = (checked) => onChange(checked);
+  const handleBlur = () => onBlur(id, value);
+  const handleFocus = () => onFocus(id, value);
   const description = options.description || schema.description;
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
     "div",
@@ -996,9 +1007,9 @@ function CheckboxWidget(props) {
               required,
               disabled: disabled || readonly,
               autoFocus: autofocus,
-              onCheckedChange: _onChange,
-              onBlur: _onBlur,
-              onFocus: _onFocus,
+              onCheckedChange: handleChange,
+              onBlur: handleBlur,
+              onFocus: handleFocus,
               className
             }
           ),
@@ -1050,9 +1061,9 @@ function RadioWidget({
 }) {
   const { enumOptions, enumDisabled, emptyValue } = options;
   const optionValueFormat = (0, import_utils31.getOptionValueFormat)(options);
-  const _onChange = (value2) => onChange((0, import_utils31.enumOptionValueDecoder)(value2, enumOptions, optionValueFormat, emptyValue));
-  const _onBlur = ({ target }) => onBlur(id, (0, import_utils31.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
-  const _onFocus = ({ target }) => onFocus(id, (0, import_utils31.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleChange = (enumValue) => onChange((0, import_utils31.enumOptionValueDecoder)(enumValue, enumOptions, optionValueFormat, emptyValue));
+  const handleBlur = ({ target }) => onBlur(id, (0, import_utils31.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
+  const handleFocus = ({ target }) => onFocus(id, (0, import_utils31.enumOptionValueDecoder)(target && target.value, enumOptions, optionValueFormat, emptyValue));
   const inline = Boolean(options && options.inline);
   return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "mb-0", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
     RadioGroup,
@@ -1061,15 +1072,15 @@ function RadioWidget({
       required,
       disabled: disabled || readonly,
       onValueChange: (e) => {
-        _onChange(e);
+        handleChange(e);
       },
-      onBlur: _onBlur,
-      onFocus: _onFocus,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
       "aria-describedby": (0, import_utils31.ariaDescribedByIds)(id),
       orientation: inline ? "horizontal" : "vertical",
       className: cn("flex flex-wrap", { "flex-col": !inline }, className),
       children: Array.isArray(enumOptions) && enumOptions.map((option, index) => {
-        const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) !== -1;
+        const itemDisabled = Array.isArray(enumDisabled) && enumDisabled.includes(option.value);
         const checked = (0, import_utils31.enumOptionsIsSelected)(option.value, value);
         return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
@@ -1093,14 +1104,19 @@ var import_utils34 = require("@rjsf/utils");
 var import_pick = __toESM(require("lodash/pick"), 1);
 
 // src/components/ui/slider.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 var import_react_slider = require("@radix-ui/react-slider");
 var import_jsx_runtime28 = require("react/jsx-runtime");
 function Slider({ className, defaultValue, value, min = 0, max = 100, ...props }) {
-  const _values = (0, import_react2.useMemo)(
-    () => Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max],
-    [value, defaultValue, min, max]
-  );
+  const enumValues = (0, import_react3.useMemo)(() => {
+    if (Array.isArray(value)) {
+      return value;
+    }
+    if (Array.isArray(defaultValue)) {
+      return defaultValue;
+    }
+    return [min, max];
+  }, [value, defaultValue, min, max]);
   return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
     import_react_slider.Root,
     {
@@ -1131,7 +1147,7 @@ function Slider({ className, defaultValue, value, min = 0, max = 100, ...props }
             )
           }
         ),
-        Array.from({ length: _values.length }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+        Array.from({ length: enumValues.length }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
           import_react_slider.Thumb,
           {
             "data-slot": "slider-thumb",
@@ -1171,7 +1187,7 @@ function RangeWidget({
   label,
   id
 }) {
-  const _onChange = (value2) => onChange(value2[0]);
+  const handleChange = (newValue) => onChange(newValue[0]);
   const sliderProps = { value, label, id, ...(0, import_utils34.rangeSpec)(schema) };
   const uiProps = { id, ...(0, import_pick.default)(options.props || {}, allowedProps) };
   return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(import_jsx_runtime29.Fragment, { children: [
@@ -1183,7 +1199,7 @@ function RangeWidget({
         max: sliderProps.max,
         step: sliderProps.step,
         value: [value],
-        onValueChange: _onChange,
+        onValueChange: handleChange,
         ...uiProps,
         "aria-describedby": (0, import_utils34.ariaDescribedByIds)(id)
       }
@@ -1196,7 +1212,7 @@ function RangeWidget({
 var import_utils40 = require("@rjsf/utils");
 
 // src/components/ui/fancy-multi-select.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_cmdk2 = require("cmdk");
 var import_isEqual = __toESM(require("lodash/isEqual"), 1);
 var import_lucide_react8 = require("lucide-react");
@@ -1232,7 +1248,7 @@ function Badge({
 }
 
 // src/components/ui/command.tsx
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_cmdk = require("cmdk");
 var import_lucide_react7 = require("lucide-react");
 
@@ -1243,23 +1259,21 @@ var import_jsx_runtime31 = require("react/jsx-runtime");
 
 // src/components/ui/command.tsx
 var import_jsx_runtime32 = require("react/jsx-runtime");
-var Command = (0, import_react3.forwardRef)(
-  ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
-      import_cmdk.Command,
-      {
-        ref,
-        "data-slot": "command",
-        className: cn(
-          "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
-          className
-        ),
-        ...props
-      }
-    );
-  }
+var Command = (0, import_react4.forwardRef)(
+  ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+    import_cmdk.Command,
+    {
+      ref,
+      "data-slot": "command",
+      className: cn(
+        "bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-md",
+        className
+      ),
+      ...props
+    }
+  )
 );
-var CommandInput = (0, import_react3.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex items-center border-b px-3", ...{ "cmdk-input-wrapper": "" }, children: [
+var CommandInput = (0, import_react4.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex items-center border-b px-3", ...{ "cmdk-input-wrapper": "" }, children: [
   /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react7.Search, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
   /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
     import_cmdk.Command.Input,
@@ -1327,18 +1341,18 @@ function FancyMultiSelect({
   className,
   id
 }) {
-  const inputRef = (0, import_react4.useRef)(null);
-  const [open, setOpen] = (0, import_react4.useState)(false);
-  const [inputValue, setInputValue] = (0, import_react4.useState)("");
-  const selectedItems = (0, import_react4.useMemo)(
+  const inputRef = (0, import_react5.useRef)(null);
+  const [open, setOpen] = (0, import_react5.useState)(false);
+  const [inputValue, setInputValue] = (0, import_react5.useState)("");
+  const selectedItems = (0, import_react5.useMemo)(
     () => items.filter((item) => selected.some((selectedValue) => (0, import_isEqual.default)(item.value, selectedValue))),
     [items, selected]
   );
-  const selectables = (0, import_react4.useMemo)(
+  const selectables = (0, import_react5.useMemo)(
     () => items.filter((framework) => !selectedItems.some((item) => (0, import_isEqual.default)(item.value, framework.value))),
     [items, selectedItems]
   );
-  const handleUnselect = (0, import_react4.useCallback)(
+  const handleUnselect = (0, import_react5.useCallback)(
     (framework) => {
       if (disabled) {
         return;
@@ -1348,7 +1362,7 @@ function FancyMultiSelect({
     },
     [selectedItems, onValueChange, disabled]
   );
-  const handleKeyDown = (0, import_react4.useCallback)(
+  const handleKeyDown = (0, import_react5.useCallback)(
     (e) => {
       if (disabled || !inputRef.current || inputRef.current.value !== "") {
         return;
@@ -1362,18 +1376,18 @@ function FancyMultiSelect({
     },
     [selectedItems, onValueChange, disabled]
   );
-  const handleSelect = (0, import_react4.useCallback)(
+  const handleSelect = (0, import_react5.useCallback)(
     (item) => {
       if (disabled) {
         return;
       }
       setInputValue("");
       const newSelected = multiple ? [...selectedItems, item] : [item];
-      onValueChange?.(newSelected.map((item2) => item2.index));
+      onValueChange?.(newSelected.map((selectedItem) => selectedItem.index));
     },
     [multiple, selectedItems, onValueChange, disabled]
   );
-  const handleFocus = (0, import_react4.useCallback)(
+  const handleFocus = (0, import_react5.useCallback)(
     (e) => {
       if (!disabled) {
         setOpen(true);
@@ -1470,7 +1484,7 @@ function FancyMultiSelect({
 }
 
 // src/components/ui/fancy-select.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_lucide_react9 = require("lucide-react");
 var import_jsx_runtime34 = require("react/jsx-runtime");
 function FancySelect({
@@ -1487,11 +1501,11 @@ function FancySelect({
   onBlur,
   className
 }) {
-  const [open, setOpen] = (0, import_react5.useState)(false);
+  const [open, setOpen] = (0, import_react6.useState)(false);
   const selectedItem = items?.find((item) => item.value === selected);
-  const selectedRef = (0, import_react5.useRef)(null);
-  const containerRef = (0, import_react5.useRef)(null);
-  (0, import_react5.useEffect)(() => {
+  const selectedRef = (0, import_react6.useRef)(null);
+  const containerRef = (0, import_react6.useRef)(null);
+  (0, import_react6.useEffect)(() => {
     if (open && selectedRef.current) {
       requestAnimationFrame(() => {
         selectedRef.current?.scrollIntoView({ block: "nearest" });
@@ -1519,7 +1533,10 @@ function FancySelect({
         /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
           "div",
           {
+            role: "button",
+            tabIndex: disabled ? -1 : 0,
             onClick: () => !disabled && setOpen(!open),
+            onKeyDown: (e) => (e.key === "Enter" || e.key === " ") && !disabled && setOpen(!open),
             className: cn(
               "flex h-9 w-full items-center justify-between gap-2 whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
               !selectedItem && required && "border-red-500",
@@ -1590,17 +1607,17 @@ function SelectWidget({
 }) {
   const { enumOptions, enumDisabled, emptyValue: optEmptyValue } = options;
   const optionValueFormat = (0, import_utils40.getOptionValueFormat)(options);
-  const _onFancyFocus = () => {
+  const handleFancyFocus = () => {
     onFocus(id, (0, import_utils40.enumOptionValueDecoder)(value, enumOptions, optionValueFormat, optEmptyValue));
   };
-  const _onFancyBlur = () => {
+  const handleFancyBlur = () => {
     onBlur(id, (0, import_utils40.enumOptionValueDecoder)(value, enumOptions, optionValueFormat, optEmptyValue));
   };
-  const items = enumOptions?.map(({ value: value2, label }, index) => ({
-    value: multiple ? value2 : (0, import_utils40.enumOptionValueEncoder)(value2, index, optionValueFormat),
-    label,
+  const items = enumOptions?.map(({ value: enumValue, label: enumLabel }, index) => ({
+    value: multiple ? enumValue : (0, import_utils40.enumOptionValueEncoder)(enumValue, index, optionValueFormat),
+    label: enumLabel,
     index,
-    disabled: Array.isArray(enumDisabled) && enumDisabled.includes(value2)
+    disabled: Array.isArray(enumDisabled) && enumDisabled.includes(enumValue)
   }));
   const cnClassName = cn({ "border-destructive": rawErrors.length > 0 }, className);
   return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "p-0.5", children: !multiple ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
@@ -1616,8 +1633,8 @@ function SelectWidget({
       required,
       placeholder,
       className: cnClassName,
-      onFocus: _onFancyFocus,
-      onBlur: _onFancyBlur,
+      onFocus: handleFancyFocus,
+      onBlur: handleFancyBlur,
       ariaDescribedby: (0, import_utils40.ariaDescribedByIds)(id)
     }
   ) : /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
@@ -1633,8 +1650,8 @@ function SelectWidget({
       onValueChange: (values) => {
         onChange((0, import_utils40.enumOptionValueDecoder)(values.map(String), enumOptions, optionValueFormat, optEmptyValue));
       },
-      onFocus: _onFancyFocus,
-      onBlur: _onFancyBlur
+      onFocus: handleFancyFocus,
+      onBlur: handleFancyBlur
     }
   ) });
 }
@@ -1675,9 +1692,9 @@ function TextareaWidget({
   options,
   className
 }) {
-  const _onChange = ({ target: { value: value2 } }) => onChange(value2 === "" ? options.emptyValue : value2);
-  const _onBlur = ({ target }) => onBlur(id, target && target.value);
-  const _onFocus = ({ target }) => onFocus(id, target && target.value);
+  const handleChange = ({ target: { value: newValue } }) => onChange(newValue === "" ? options.emptyValue : newValue);
+  const handleBlur = ({ target }) => onBlur(id, target && target.value);
+  const handleFocus = ({ target }) => onFocus(id, target && target.value);
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex p-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     Textarea,
     {
@@ -1690,9 +1707,9 @@ function TextareaWidget({
       required,
       autoFocus: autofocus,
       rows: options.rows || 5,
-      onChange: _onChange,
-      onBlur: _onBlur,
-      onFocus: _onFocus,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      onFocus: handleFocus,
       "aria-describedby": (0, import_utils43.ariaDescribedByIds)(id),
       className
     }