next-recomponents 1.7.27 → 1.7.29

package/dist/index.js

@@ -43669,7 +43669,7 @@ function TextArea(_a) {
     "onChange",
     "children"
   ]);
-  const [value, setValue] = (0, import_react27.useState)(children);
+  const [value, setValue] = (0, import_react27.useState)((props == null ? void 0 : props.value) || "");
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "w-full", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("label", { className: "flex flex-col gap-1", children: [
     /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "font-bold ", children: [
       label,
@@ -43683,14 +43683,14 @@ function TextArea(_a) {
           className: ["p-1 w-full rounded border shadow", className].join(
             " "
           ),
+          value,
           onChange: (e) => {
             if (maxLength) {
               e.target.value = e.target.value.slice(0, maxLength);
             }
             setValue(e.target.value);
             onChange == null ? void 0 : onChange(e);
-          },
-          children: value
+          }
         })
       ),
       maxLength && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: " text-xs text-gray text-right", children: [
@@ -43856,7 +43856,7 @@ function useResources({
         }
       });
       const findFunc = (id3, query) => __async(null, null, function* () {
-        var _a, _b, _c2, _d2;
+        var _a, _b, _c2;
         const options = {
           method: "GET",
           url: `${baseURI}/${key}/${id3}`,
@@ -43876,11 +43876,10 @@ function useResources({
           newInfo[key].errorMessage = "";
           newInfo[key].selectedItem = d;
           const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex((d2) => (d2 == null ? void 0 : d2.id) == id3);
-          console.log("index", index, (_c2 = newInfo[key]) == null ? void 0 : _c2.data);
           if (index >= 0) {
             newInfo[key].data[index] = d;
           } else {
-            if ((_d2 = newInfo[key]) == null ? void 0 : _d2.data) {
+            if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
               newInfo[key].data.unshift(d);
             } else {
               newInfo[key].data = [d];
@@ -44257,6 +44256,7 @@ function Select(_a) {
   const validOption = (value) => {
     return options.find((opt) => opt.label == value);
   };
+  const normalize = (str) => str.toLowerCase().replace(/,/g, "").trim();
   (0, import_react30.useEffect)(() => {
     const parsedOptions = import_react30.default.Children.toArray(children).filter((child) => {
       return child.type === "option";
@@ -44274,8 +44274,8 @@ function Select(_a) {
     setFiltered(
       options.filter(
         (opt) => {
-          var _a2, _b2;
-          return (_b2 = (_a2 = opt == null ? void 0 : opt.label) == null ? void 0 : _a2.toLowerCase()) == null ? void 0 : _b2.includes(inputValue == null ? void 0 : inputValue.toLowerCase());
+          var _a2;
+          return (_a2 = normalize(`${opt == null ? void 0 : opt.label}`)) == null ? void 0 : _a2.includes(normalize(inputValue));
         }
       )
     );
@@ -44348,7 +44348,7 @@ function Select(_a) {
                 e.target.classList.add("bg-green-200");
                 (_i = (_h = (_g = e.target) == null ? void 0 : _g.classList) == null ? void 0 : _h.remove) == null ? void 0 : _i.call(_h, "bg-red-200");
               }
-            }, 100);
+            }, 200);
           },
           onChange: (e) => {
             setInputValue(e.target.value);
@@ -44367,7 +44367,6 @@ function Select(_a) {
             setIsOpen(true);
             setInputValue("");
             if ((inputRef == null ? void 0 : inputRef.current) && strictMode) {
-              console.log(inputRef.current);
               (_c = (_b2 = (_a2 = inputRef.current) == null ? void 0 : _a2.classList) == null ? void 0 : _b2.remove) == null ? void 0 : _c.call(_b2, "bg-green-200");
               (_f = (_e = (_d = inputRef.current) == null ? void 0 : _d.classList) == null ? void 0 : _e.add) == null ? void 0 : _f.call(_e, "bg-red-200");
               inputRef.current.focus();
@@ -44388,9 +44387,12 @@ function Select(_a) {
               className: `p-2 cursor-pointer ${index === highlightedIndex ? "bg-blue-100" : "hover:bg-gray-100"}`,
               onClick: () => {
                 var _a2;
-                (_a2 = props == null ? void 0 : props.onChange) == null ? void 0 : _a2.call(props, {
-                  target: { value: (opt == null ? void 0 : opt.value) || opt.label }
-                });
+                try {
+                  (_a2 = props == null ? void 0 : props.onChange) == null ? void 0 : _a2.call(props, {
+                    target: { value: (opt == null ? void 0 : opt.value) || opt.label }
+                  });
+                } catch (error) {
+                }
                 const item = validOption(opt.label);
                 if (inputRef == null ? void 0 : inputRef.current) {
                   if (!item) {
@@ -44691,7 +44693,11 @@ function MyCalendar(_a) {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "relative", children: [
     /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("label", { className: "flex flex-col gap-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "font-bold", children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "font-bold", children: [
+        label,
+        " ",
+        (otherProps == null ? void 0 : otherProps.required) && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-red-500", children: "*" })
+      ] }),
       /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
         "div",
         {

package/dist/index.mjs

@@ -43653,7 +43653,7 @@ function TextArea(_a) {
     "onChange",
     "children"
   ]);
-  const [value, setValue] = useState8(children);
+  const [value, setValue] = useState8((props == null ? void 0 : props.value) || "");
   return /* @__PURE__ */ jsx16("div", { className: "w-full", children: /* @__PURE__ */ jsxs13("label", { className: "flex flex-col gap-1", children: [
     /* @__PURE__ */ jsxs13("div", { className: "font-bold ", children: [
       label,
@@ -43667,14 +43667,14 @@ function TextArea(_a) {
           className: ["p-1 w-full rounded border shadow", className].join(
             " "
           ),
+          value,
           onChange: (e) => {
             if (maxLength) {
               e.target.value = e.target.value.slice(0, maxLength);
             }
             setValue(e.target.value);
             onChange == null ? void 0 : onChange(e);
-          },
-          children: value
+          }
         })
       ),
       maxLength && /* @__PURE__ */ jsxs13("div", { className: " text-xs text-gray text-right", children: [
@@ -43840,7 +43840,7 @@ function useResources({
         }
       });
       const findFunc = (id3, query) => __async(null, null, function* () {
-        var _a, _b, _c2, _d2;
+        var _a, _b, _c2;
         const options = {
           method: "GET",
           url: `${baseURI}/${key}/${id3}`,
@@ -43860,11 +43860,10 @@ function useResources({
           newInfo[key].errorMessage = "";
           newInfo[key].selectedItem = d;
           const index = (_b = (_a = newInfo[key]) == null ? void 0 : _a.data) == null ? void 0 : _b.findIndex((d2) => (d2 == null ? void 0 : d2.id) == id3);
-          console.log("index", index, (_c2 = newInfo[key]) == null ? void 0 : _c2.data);
           if (index >= 0) {
             newInfo[key].data[index] = d;
           } else {
-            if ((_d2 = newInfo[key]) == null ? void 0 : _d2.data) {
+            if ((_c2 = newInfo[key]) == null ? void 0 : _c2.data) {
               newInfo[key].data.unshift(d);
             } else {
               newInfo[key].data = [d];
@@ -44245,6 +44244,7 @@ function Select(_a) {
   const validOption = (value) => {
     return options.find((opt) => opt.label == value);
   };
+  const normalize = (str) => str.toLowerCase().replace(/,/g, "").trim();
   useEffect8(() => {
     const parsedOptions = React7.Children.toArray(children).filter((child) => {
       return child.type === "option";
@@ -44262,8 +44262,8 @@ function Select(_a) {
     setFiltered(
       options.filter(
         (opt) => {
-          var _a2, _b2;
-          return (_b2 = (_a2 = opt == null ? void 0 : opt.label) == null ? void 0 : _a2.toLowerCase()) == null ? void 0 : _b2.includes(inputValue == null ? void 0 : inputValue.toLowerCase());
+          var _a2;
+          return (_a2 = normalize(`${opt == null ? void 0 : opt.label}`)) == null ? void 0 : _a2.includes(normalize(inputValue));
         }
       )
     );
@@ -44336,7 +44336,7 @@ function Select(_a) {
                 e.target.classList.add("bg-green-200");
                 (_i = (_h = (_g = e.target) == null ? void 0 : _g.classList) == null ? void 0 : _h.remove) == null ? void 0 : _i.call(_h, "bg-red-200");
               }
-            }, 100);
+            }, 200);
           },
           onChange: (e) => {
             setInputValue(e.target.value);
@@ -44355,7 +44355,6 @@ function Select(_a) {
             setIsOpen(true);
             setInputValue("");
             if ((inputRef == null ? void 0 : inputRef.current) && strictMode) {
-              console.log(inputRef.current);
               (_c = (_b2 = (_a2 = inputRef.current) == null ? void 0 : _a2.classList) == null ? void 0 : _b2.remove) == null ? void 0 : _c.call(_b2, "bg-green-200");
               (_f = (_e = (_d = inputRef.current) == null ? void 0 : _d.classList) == null ? void 0 : _e.add) == null ? void 0 : _f.call(_e, "bg-red-200");
               inputRef.current.focus();
@@ -44376,9 +44375,12 @@ function Select(_a) {
               className: `p-2 cursor-pointer ${index === highlightedIndex ? "bg-blue-100" : "hover:bg-gray-100"}`,
               onClick: () => {
                 var _a2;
-                (_a2 = props == null ? void 0 : props.onChange) == null ? void 0 : _a2.call(props, {
-                  target: { value: (opt == null ? void 0 : opt.value) || opt.label }
-                });
+                try {
+                  (_a2 = props == null ? void 0 : props.onChange) == null ? void 0 : _a2.call(props, {
+                    target: { value: (opt == null ? void 0 : opt.value) || opt.label }
+                  });
+                } catch (error) {
+                }
                 const item = validOption(opt.label);
                 if (inputRef == null ? void 0 : inputRef.current) {
                   if (!item) {
@@ -44683,7 +44685,11 @@ function MyCalendar(_a) {
   }
   return /* @__PURE__ */ jsxs16("div", { className: "relative", children: [
     /* @__PURE__ */ jsxs16("label", { className: "flex flex-col gap-1", children: [
-      /* @__PURE__ */ jsx24("div", { className: "font-bold", children: label }),
+      /* @__PURE__ */ jsxs16("div", { className: "font-bold", children: [
+        label,
+        " ",
+        (otherProps == null ? void 0 : otherProps.required) && /* @__PURE__ */ jsx24("span", { className: "text-red-500", children: "*" })
+      ] }),
       /* @__PURE__ */ jsx24("div", { children: /* @__PURE__ */ jsxs16(
         "div",
         {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-recomponents",
-  "version": "1.7.27",
+  "version": "1.7.29",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/calendar/index.tsx

@@ -64,7 +64,10 @@ export default function MyCalendar({
   return (
     <div className="relative">
       <label className="flex flex-col gap-1">
-        <div className="font-bold">{label}</div>
+        <div className="font-bold">
+          {label}{" "}
+          {otherProps?.required && <span className="text-red-500">*</span>}
+        </div>
         <div>
           <div
             onClick={() => modalRef?.current?.showModal?.()}

package/src/select/index.tsx

@@ -41,6 +41,8 @@ export default function Select({
   const validOption = (value: string) => {
     return options.find((opt) => opt.label == value);
   };
+  const normalize = (str: string) => str.toLowerCase().replace(/,/g, "").trim();
+
   useEffect(() => {
     const parsedOptions = React.Children.toArray(children)
       .filter((child): child is ReactElement => {
@@ -60,7 +62,7 @@ export default function Select({
   useEffect(() => {
     setFiltered(
       options.filter((opt) =>
-        opt?.label?.toLowerCase()?.includes(inputValue?.toLowerCase())
+        normalize(`${opt?.label}`)?.includes(normalize(inputValue))
       )
     );
     setHighlightedIndex(-1);
@@ -136,7 +138,7 @@ export default function Select({
                 e.target.classList.add("bg-green-200");
                 e.target?.classList?.remove?.("bg-red-200");
               }
-            }, 100);
+            }, 200);
 
             // props?.onChange?.(e);
           }}
@@ -159,7 +161,6 @@ export default function Select({
               setIsOpen(true);
               setInputValue("");
               if (inputRef?.current && strictMode) {
-                console.log(inputRef.current);
                 inputRef.current?.classList?.remove?.("bg-green-200");
                 inputRef.current?.classList?.add?.("bg-red-200");
                 inputRef.current.focus();
@@ -186,10 +187,11 @@ export default function Select({
                     : "hover:bg-gray-100"
                 }`}
                 onClick={() => {
-                  props?.onChange?.({
-                    target: { value: opt?.value || opt.label },
-                  } as React.ChangeEvent<HTMLInputElement>);
-
+                  try {
+                    props?.onChange?.({
+                      target: { value: opt?.value || opt.label },
+                    } as React.ChangeEvent<HTMLInputElement>);
+                  } catch (error) {}
                   const item = validOption(opt.label);
                   if (inputRef?.current) {
                     if (!item) {

package/src/text-area/index.tsx

@@ -20,7 +20,7 @@ export default function TextArea({
   children = "",
   ...props
 }: Props) {
-  const [value, setValue] = useState<string>(children as string);
+  const [value, setValue] = useState<string>((props?.value as string) || "");
   return (
     <div className="w-full">
       <label className="flex flex-col gap-1">
@@ -33,6 +33,7 @@ export default function TextArea({
             className={["p-1 w-full rounded border shadow", className].join(
               " "
             )}
+            value={value}
             onChange={(e) => {
               if (maxLength) {
                 e.target.value = e.target.value.slice(0, maxLength);
@@ -40,9 +41,7 @@ export default function TextArea({
               setValue(e.target.value);
               onChange?.(e);
             }}
-          >
-            {value}
-          </textarea>
+          ></textarea>
           {maxLength && (
             <div className=" text-xs text-gray text-right">
               {value.length} / {maxLength}

package/src/use-resources/index.ts

@@ -104,7 +104,7 @@ export default function useResources<T extends Record<string, ItemsRecord>>({
 
           newInfo[key].selectedItem = d;
           const index = newInfo[key]?.data?.findIndex((d: any) => d?.id == id);
-          console.log("index", index, newInfo[key]?.data);
+
           if (index >= 0) {
             newInfo[key].data[index] = d;
           } else {