next-helios-fe 1.8.131 → 1.8.133

package/package.json

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

package/src/components/dropdown/index.tsx

@@ -30,7 +30,7 @@ export const Dropdown: DropdownComponent = ({
   return (
     <Dd
       label=""
-      className="w-min max-h-96 px-1 z-[999] rounded-md border-default bg-secondary-bg overflow-x-hidden overflow-y-auto"
+      className="w-min max-h-96 px-1 z-20 rounded-md border-default bg-secondary-bg overflow-x-hidden overflow-y-auto"
       dismissOnClick={rest.dismissOnClick ?? true}
       theme={{
         floating: {

package/src/components/table/index.tsx

@@ -546,33 +546,17 @@ export const Table: TableComponentProps = ({
                       </button>
                     }
                   >
-                    <div className="flex flex-col gap-2">
-                      <Calendar
-                        options={{ enableSelectRange: true }}
-                        value={dateFilter[item.key]}
-                        onChange={(e) => {
-                          const tempDateFilter = { ...dateFilter };
-
-                          tempDateFilter[item.key] = e;
-
-                          setDateFilter(tempDateFilter);
-                        }}
-                      />
-                      {dateFilter[item.key]?.length !== 0 && (
-                        <Button
-                          options={{ variant: "danger", position: "center" }}
-                          onClick={() => {
-                            const tempDateFilter = { ...dateFilter };
+                    <Calendar
+                      options={{ enableSelectRange: true }}
+                      value={dateFilter[item.key] || []}
+                      onChange={(e) => {
+                        const tempDateFilter = { ...dateFilter };
 
-                            tempDateFilter[item.key] = [];
+                        tempDateFilter[item.key] = e;
 
-                            setDateFilter(tempDateFilter);
-                          }}
-                        >
-                          Remove Filter
-                        </Button>
-                      )}
-                    </div>
+                        setDateFilter(tempDateFilter);
+                      }}
+                    />
                   </Dropdown>
                 </div>
               )}
@@ -592,7 +576,7 @@ export const Table: TableComponentProps = ({
                 <input
                   type="search"
                   className={`w-full border-x-0 border-t-0 border-default bg-secondary-bg pb-0.5 pt-0 text-sm font-normal placeholder:translate-x-0 placeholder:text-silent placeholder:duration-300 focus:border-primary-dark focus:outline-none focus:ring-0 focus:placeholder:translate-x-1 [&::-webkit-search-cancel-button]:appearance-none ${
-                    item.type !== "date" ? "px-6 border-b" : "border-b-0"
+                    item.type !== "date" ? "px-6 border-b" : "pe-6 border-b-0"
                   }`}
                   placeholder="Search..."
                   disabled={item.type === "date"}
@@ -635,19 +619,32 @@ export const Table: TableComponentProps = ({
                     );
                   }}
                 />
-                {filter?.find((filterItem) => filterItem.key === item.key)
-                  ?.value && (
+                {((item?.type === "date" &&
+                  dateFilter[item.key]?.length !== 0) ||
+                  filter?.find((filterItem) => filterItem.key === item.key)
+                    ?.value) && (
                   <button
                     type="button"
                     className="absolute right-0 rounded-full text-disabled hover:bg-secondary-light"
                     onClick={() => {
-                      setFilter(
-                        filter?.map((filterItem) => {
-                          return filterItem.key === item.key
-                            ? { ...filterItem, value: "" }
-                            : filterItem;
-                        })
-                      );
+                      if (item.type !== "date") {
+                        setFilter(
+                          filter?.map((filterItem) => {
+                            return filterItem.key === item.key
+                              ? { ...filterItem, value: "" }
+                              : filterItem;
+                          })
+                        );
+                      } else if (
+                        item?.type === "date" &&
+                        dateFilter[item.key]?.length !== 0
+                      ) {
+                        const tempDateFilter = { ...dateFilter };
+
+                        tempDateFilter[item.key] = [];
+
+                        setDateFilter(tempDateFilter);
+                      }
                     }}
                   >
                     <Icon icon="pajamas:close" className="text-sm" />