@rjsf/daisyui 6.4.2 → 6.5.1

package/dist/chakra-ui.esm.js

@@ -737,7 +737,8 @@ function WrapIfAdditionalTemplate(props) {
           onBlur: onKeyRenameBlur,
           defaultValue: label,
           disabled: disabled || readonly
-        }
+        },
+        label
       )
     ] }),
     children,
@@ -947,6 +948,11 @@ function CheckboxWidget(props) {
 
 // src/widgets/CheckboxesWidget/CheckboxesWidget.tsx
 import { useCallback as useCallback4 } from "react";
+import {
+  enumOptionValueDecoder,
+  enumOptionValueEncoder,
+  getOptionValueFormat
+} from "@rjsf/utils";
 import { jsx as jsx23, jsxs as jsxs12 } from "react/jsx-runtime";
 function CheckboxesWidget({
   id,
@@ -960,7 +966,8 @@ function CheckboxesWidget({
   onFocus,
   onBlur
 }) {
-  const { enumOptions } = options;
+  const { enumOptions, emptyValue } = options;
+  const optionValueFormat = getOptionValueFormat(options);
   const isEnumeratedObject = enumOptions && enumOptions[0]?.value && typeof enumOptions[0].value === "object";
   const isChecked = useCallback4(
     (option) => {
@@ -994,26 +1001,18 @@ function CheckboxesWidget({
   const handleFocus = useCallback4(
     (event) => {
       if (onFocus) {
-        const index = Number(event.target.dataset.index);
-        const option = enumOptions?.[index];
-        if (option) {
-          onFocus(id, option.value);
-        }
+        onFocus(id, enumOptionValueDecoder(event.target.value, enumOptions, optionValueFormat, emptyValue));
       }
     },
-    [onFocus, id, enumOptions]
+    [onFocus, id, enumOptions, optionValueFormat, emptyValue]
   );
   const handleBlur = useCallback4(
     (event) => {
       if (onBlur) {
-        const index = Number(event.target.dataset.index);
-        const option = enumOptions?.[index];
-        if (option) {
-          onBlur(id, option.value);
-        }
+        onBlur(id, enumOptionValueDecoder(event.target.value, enumOptions, optionValueFormat, emptyValue));
       }
     },
-    [onBlur, id, enumOptions]
+    [onBlur, id, enumOptions, optionValueFormat, emptyValue]
   );
   return /* @__PURE__ */ jsx23("div", { className: "form-control", children: /* @__PURE__ */ jsx23("div", { className: "flex flex-col gap-2 mt-1", children: enumOptions?.map((option, index) => /* @__PURE__ */ jsxs12("label", { className: "flex items-center cursor-pointer gap-2", children: [
     /* @__PURE__ */ jsx23(
@@ -1023,6 +1022,7 @@ function CheckboxesWidget({
         id: `${id}-${option.value}`,
         className: "checkbox",
         name: htmlName || id,
+        value: enumOptionValueEncoder(option.value, index, optionValueFormat),
         checked: isChecked(option),
         required,
         disabled: disabled || readonly,
@@ -1554,6 +1554,11 @@ function DateWidget(props) {
 
 // src/widgets/RadioWidget/RadioWidget.tsx
 import { useCallback as useCallback7 } from "react";
+import {
+  enumOptionValueDecoder as enumOptionValueDecoder2,
+  enumOptionValueEncoder as enumOptionValueEncoder2,
+  getOptionValueFormat as getOptionValueFormat2
+} from "@rjsf/utils";
 import { jsx as jsx26, jsxs as jsxs15 } from "react/jsx-runtime";
 function RadioWidget({
   id,
@@ -1567,11 +1572,9 @@ function RadioWidget({
   onFocus,
   onBlur
 }) {
-  const { enumOptions } = options;
+  const { enumOptions, emptyValue } = options;
+  const optionValueFormat = getOptionValueFormat2(options);
   const isEnumeratedObject = enumOptions && enumOptions[0]?.value && typeof enumOptions[0].value === "object";
-  const getValue = (option) => {
-    return option.value;
-  };
   const isChecked = (option) => {
     if (isEnumeratedObject) {
       return value && value.name === option.value.name;
@@ -1581,33 +1584,28 @@ function RadioWidget({
   const handleFocus = useCallback7(
     (event) => {
       if (onFocus) {
-        const index = Number(event.target.dataset.index);
-        const optionValue = enumOptions?.[index]?.value;
-        onFocus(id, optionValue);
+        onFocus(id, enumOptionValueDecoder2(event.target.value, enumOptions, optionValueFormat, emptyValue));
       }
     },
-    [onFocus, id, enumOptions]
+    [onFocus, id, enumOptions, optionValueFormat, emptyValue]
   );
   const handleBlur = useCallback7(
     (event) => {
       if (onBlur) {
-        const index = Number(event.target.dataset.index);
-        const optionValue = enumOptions?.[index]?.value;
-        onBlur(id, optionValue);
+        onBlur(id, enumOptionValueDecoder2(event.target.value, enumOptions, optionValueFormat, emptyValue));
       }
     },
-    [onBlur, id, enumOptions]
+    [onBlur, id, enumOptions, optionValueFormat, emptyValue]
   );
   const handleChange = useCallback7(
     (event) => {
-      const index = Number(event.target.dataset.index);
-      const option = enumOptions?.[index];
-      if (option) {
-        onChange(isEnumeratedObject ? option.value : option.value);
+      const decoded = enumOptionValueDecoder2(event.target.value, enumOptions, optionValueFormat, emptyValue);
+      if (decoded !== void 0) {
+        onChange(decoded);
         event.target.blur();
       }
     },
-    [onChange, isEnumeratedObject, enumOptions]
+    [onChange, enumOptions, optionValueFormat, emptyValue]
   );
   return /* @__PURE__ */ jsx26("div", { className: "form-control", children: /* @__PURE__ */ jsx26("div", { className: "flex flex-col gap-2 mt-1", children: enumOptions?.map((option, index) => /* @__PURE__ */ jsxs15("label", { className: "flex items-center cursor-pointer gap-2", children: [
     /* @__PURE__ */ jsx26(
@@ -1617,7 +1615,7 @@ function RadioWidget({
         id: `${id}-${option.value}`,
         className: "radio",
         name: htmlName || id,
-        value: getValue(option),
+        value: enumOptionValueEncoder2(option.value, index, optionValueFormat),
         checked: isChecked(option),
         required,
         disabled: disabled || readonly,
@@ -1762,8 +1760,10 @@ function RatingWidget({
 // src/widgets/SelectWidget/SelectWidget.tsx
 import { useCallback as useCallback10 } from "react";
 import {
-  enumOptionsIndexForValue,
-  enumOptionsValueForIndex
+  enumOptionSelectedValue,
+  enumOptionValueDecoder as enumOptionValueDecoder3,
+  enumOptionValueEncoder as enumOptionValueEncoder3,
+  getOptionValueFormat as getOptionValueFormat3
 } from "@rjsf/utils";
 import { jsx as jsx29, jsxs as jsxs17 } from "react/jsx-runtime";
 function SelectWidget({
@@ -1781,6 +1781,7 @@ function SelectWidget({
   onFocus
 }) {
   const { enumOptions, emptyValue: optEmptyVal } = options;
+  const optionValueFormat = getOptionValueFormat3(options);
   multiple = typeof multiple === "undefined" ? false : !!multiple;
   const getDisplayValue = (val) => {
     if (!val) {
@@ -1803,37 +1804,38 @@ function SelectWidget({
       }
       if (multiple) {
         const currentValue = Array.isArray(value) ? value : [];
-        const optionValue = isEnumeratedObject ? enumOptions[index].value : enumOptionsValueForIndex(String(index), enumOptions, optEmptyVal);
+        const optionValue = isEnumeratedObject ? enumOptions[index].value : enumOptionValueDecoder3(String(index), enumOptions, optionValueFormat, optEmptyVal);
         const newValue = currentValue.includes(optionValue) ? currentValue.filter((v) => v !== optionValue) : [...currentValue, optionValue];
         onChange(newValue);
       } else {
         onChange(
-          isEnumeratedObject ? enumOptions[index].value : enumOptionsValueForIndex(String(index), enumOptions, optEmptyVal)
+          isEnumeratedObject ? enumOptions[index].value : enumOptionValueDecoder3(String(index), enumOptions, optionValueFormat, optEmptyVal)
         );
       }
     },
-    [value, multiple, isEnumeratedObject, enumOptions, optEmptyVal, onChange]
+    [value, multiple, isEnumeratedObject, enumOptions, optEmptyVal, optionValueFormat, onChange]
   );
   const _onBlur = useCallback10(
     ({ target }) => {
       const dataValue = target?.getAttribute("data-value");
       if (dataValue !== null) {
-        onBlur(id, enumOptionsValueForIndex(dataValue, enumOptions, optEmptyVal));
+        onBlur(id, enumOptionValueDecoder3(dataValue, enumOptions, optionValueFormat, optEmptyVal));
       }
     },
-    [onBlur, id, enumOptions, optEmptyVal]
+    [onBlur, id, enumOptions, optEmptyVal, optionValueFormat]
   );
   const _onFocus = useCallback10(
     ({ target }) => {
       const dataValue = target?.getAttribute("data-value");
       if (dataValue !== null) {
-        onFocus(id, enumOptionsValueForIndex(dataValue, enumOptions, optEmptyVal));
+        onFocus(id, enumOptionValueDecoder3(dataValue, enumOptions, optionValueFormat, optEmptyVal));
       }
     },
-    [onFocus, id, enumOptions, optEmptyVal]
+    [onFocus, id, enumOptions, optEmptyVal, optionValueFormat]
   );
-  const selectedIndexes = enumOptionsIndexForValue(value, enumOptions, multiple);
-  const selectedValues = Array.isArray(selectedIndexes) ? selectedIndexes : [selectedIndexes];
+  const selectedValues = [
+    enumOptionSelectedValue(value, enumOptions, !!multiple, optionValueFormat, multiple ? [] : "")
+  ].flat().filter((v) => v !== "");
   const optionsList = enumOptions || (Array.isArray(schema.examples) ? schema.examples.map((example) => ({ value: example, label: example })) : []);
   return /* @__PURE__ */ jsx29("div", { className: "form-control w-full", children: /* @__PURE__ */ jsxs17("div", { className: "dropdown w-full", children: [
     /* @__PURE__ */ jsxs17(
@@ -1850,29 +1852,32 @@ function SelectWidget({
         ]
       }
     ),
-    /* @__PURE__ */ jsx29("ul", { className: "dropdown-content z-[1] bg-base-100 w-full max-h-60 overflow-auto rounded-box shadow-lg", children: optionsList.map(({ label: label2 }, i) => /* @__PURE__ */ jsx29(
-      "li",
-      {
-        role: "button",
-        tabIndex: 0,
-        className: `px-4 py-2 hover:bg-base-200 cursor-pointer ${selectedValues.includes(String(i)) ? "bg-primary/10" : ""}`,
-        onClick: handleOptionClick,
-        "data-value": i,
-        children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
-          multiple && /* @__PURE__ */ jsx29(
-            "input",
-            {
-              type: "checkbox",
-              className: "checkbox checkbox-sm",
-              checked: selectedValues.includes(String(i)),
-              readOnly: true
-            }
-          ),
-          /* @__PURE__ */ jsx29("span", { children: isEnumeratedObject ? label2 : getDisplayValue(label2) })
-        ] })
-      },
-      i
-    )) })
+    /* @__PURE__ */ jsx29("ul", { className: "dropdown-content z-[1] bg-base-100 w-full max-h-60 overflow-auto rounded-box shadow-lg", children: optionsList.map(({ value: optValue, label: label2 }, i) => {
+      const encodedValue = enumOptionValueEncoder3(optValue, i, optionValueFormat);
+      return /* @__PURE__ */ jsx29(
+        "li",
+        {
+          role: "button",
+          tabIndex: 0,
+          className: `px-4 py-2 hover:bg-base-200 cursor-pointer ${selectedValues.includes(encodedValue) ? "bg-primary/10" : ""}`,
+          onClick: handleOptionClick,
+          "data-value": i,
+          children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+            multiple && /* @__PURE__ */ jsx29(
+              "input",
+              {
+                type: "checkbox",
+                className: "checkbox checkbox-sm",
+                checked: selectedValues.includes(encodedValue),
+                readOnly: true
+              }
+            ),
+            /* @__PURE__ */ jsx29("span", { children: isEnumeratedObject ? label2 : getDisplayValue(label2) })
+          ] })
+        },
+        i
+      );
+    }) })
   ] }) });
 }