next-helios-fe 1.8.8 → 1.8.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "next-helios-fe",
-  "version": "1.8.8",
+  "version": "1.8.10",
   "description": "",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/components/form/other/multipleSelect.tsx

@@ -69,25 +69,12 @@ export const MultipleSelect: React.FC<MultipleSelectProps> = ({
   }, []);
 
   useEffect(() => {
-    if (value) {
+    if (value?.length) {
       setTempValue(value);
       return;
     }
   }, [value]);
 
-  useEffect(() => {
-    onChange &&
-      onChange({
-        target: { value: tempValue },
-      });
-  }, [tempValue]);
-
-  useEffect(() => {
-    if (tempValue.length === 0) {
-      fakeInputRef.current;
-    }
-  }, [tempValue]);
-
   useEffect(() => {
     if (tempValue.length === 0) {
       inputRef.current?.setCustomValidity(
@@ -168,12 +155,7 @@ export const MultipleSelect: React.FC<MultipleSelectProps> = ({
                       className="flex items-center gap-2 px-2 py-0.5 rounded-md bg-primary text-white cursor-default pointer-events-auto"
                     >
                       <span>{menus.find((i) => i.value === item)?.label}</span>
-                      <div
-                        className="cursor-pointer"
-                        onClick={() => {
-                          setTempValue(tempValue.filter((i) => i !== item));
-                        }}
-                      >
+                      <div className="cursor-pointer">
                         <Icon icon="pajamas:close" />
                       </div>
                     </div>
@@ -210,6 +192,13 @@ export const MultipleSelect: React.FC<MultipleSelectProps> = ({
                     onClick={() => {
                       if (!disabled) {
                         setTempValue(tempValue.filter((i) => i !== item));
+                        if (onChange) {
+                          onChange({
+                            target: {
+                              value: tempValue.filter((i) => i !== item),
+                            },
+                          } as any);
+                        }
                       }
                     }}
                   >
@@ -258,6 +247,11 @@ export const MultipleSelect: React.FC<MultipleSelectProps> = ({
                   }
                   onClick={() => {
                     setTempValue([...tempValue, item.value]);
+                    if (onChange) {
+                      onChange({
+                        target: { value: [...tempValue, item.value] },
+                      } as any);
+                    }
                   }}
                 >
                   {item.label}

package/src/styles/calendar.scss

@@ -114,14 +114,14 @@
   }
   
   .react-calendar__tile:disabled {
-    background-color: #f0f0f0;
-    color: #ababab;
+    background-color: var(--color-secondary-light);
+    color: var(--color-disabled);
   }
   
   .react-calendar__month-view__days__day--neighboringMonth:disabled,
   .react-calendar__decade-view__years__year--neighboringDecade:disabled,
   .react-calendar__century-view__decades__decade--neighboringCentury:disabled {
-    color: #cdcdcd;
+    color: var(--color-silent);
   }
   
   .react-calendar__tile:enabled:hover,