@eztrak/shared 0.13.0 → 0.13.2

package/dist/components/index.js

@@ -675,6 +675,7 @@ function CustomPagination({
 }
 
 // src/components/search-filters/DropdownFilter.tsx
+var import_react2 = require("react");
 var import_react_select = __toESM(require("react-select"));
 var import_react_router_dom2 = require("react-router-dom");
 
@@ -686,13 +687,13 @@ var themeColors = {
   textColor: "black",
   white: "white"
 };
-var dropdownStyles = (_borderRadius = "5px") => ({
+var dropdownStyles = (_borderRadius) => ({
   control: (provided, state) => ({
     ...provided,
     fontSize: "14px",
     padding: "4px 8px",
     minWidth: "180px",
-    borderRadius: "5px",
+    borderRadius: _borderRadius,
     cursor: "pointer",
     borderColor: state.isFocused ? themeColors.primary : "#e0e0e0",
     boxShadow: state.isFocused ? "0 0 0 2px rgba(255, 115, 53, 0.3)" : "none",
@@ -746,6 +747,37 @@ var dropdownStyles = (_borderRadius = "5px") => ({
   })
 });
 
+// src/utils/localStorage.ts
+function getStorage() {
+  if (typeof window === "undefined") return null;
+  return window.localStorage;
+}
+function getItem(key, fallback = null) {
+  try {
+    const raw = getStorage()?.getItem(key);
+    if (raw === null || raw === void 0) {
+      return fallback;
+    }
+    return JSON.parse(raw);
+  } catch {
+    return fallback;
+  }
+}
+function setItem(key, value) {
+  try {
+    getStorage()?.setItem(key, JSON.stringify(value));
+  } catch {
+  }
+}
+function removeItem(key) {
+  try {
+    getStorage()?.removeItem(key);
+  } catch {
+  }
+}
+var getItemFromLocalStorage = getItem;
+var storeItemInLocalStorage = setItem;
+
 // src/components/search-filters/DropdownFilter.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function DropdownFilter({
@@ -759,22 +791,44 @@ function DropdownFilter({
   isSearchable = true,
   isDisabled = false,
   isLoading = false,
+  saveToLocalStorage = false,
   ...otherProps
 }) {
   const [searchParams, setSearchParams] = (0, import_react_router_dom2.useSearchParams)();
+  const hasRestoredFromStorage = (0, import_react2.useRef)(false);
+  (0, import_react2.useEffect)(() => {
+    if (!saveToLocalStorage || hasRestoredFromStorage.current) return;
+    hasRestoredFromStorage.current = true;
+    if (searchParams.get(name)) return;
+    const stored = getItemFromLocalStorage(name);
+    if (stored != null && stored !== "") {
+      setSearchParams((prev) => {
+        prev.set(name, String(stored));
+        return prev;
+      });
+    }
+  }, [saveToLocalStorage, name, searchParams, setSearchParams]);
   const currentValue = searchParams.get(name);
   const selectedOption = currentValue ? options?.find(
     (option) => option[valueKey]?.toString() === currentValue
   ) ?? null : null;
   const handleChange = (selected) => {
+    const selectedValue = selected && selected[valueKey] !== "" ? String(selected[valueKey]) : null;
     setSearchParams((prev) => {
-      if (!selected || selected[valueKey] === "") {
+      if (!selectedValue) {
         prev.delete(name);
       } else {
-        prev.set(name, String(selected[valueKey]));
+        prev.set(name, selectedValue);
       }
       return prev;
     });
+    if (saveToLocalStorage) {
+      if (selectedValue) {
+        storeItemInLocalStorage(name, selectedValue);
+      } else {
+        removeItem(name);
+      }
+    }
   };
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: cn(className), children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     import_react_select.default,
@@ -865,7 +919,7 @@ function ResetFiltersButton({
 }
 
 // src/components/search-filters/SearchInput.tsx
-var import_react2 = require("react");
+var import_react3 = require("react");
 var import_fi = require("react-icons/fi");
 var import_react_router_dom4 = require("react-router-dom");
 var import_jsx_runtime5 = require("react/jsx-runtime");
@@ -887,8 +941,8 @@ function SearchInput({
 }) {
   const [searchParams, setSearchParams] = (0, import_react_router_dom4.useSearchParams)();
   const queryParam = searchParams.get(defaultParam) || defaultValue || "";
-  const [inputValue, setInputValue] = (0, import_react2.useState)(queryParam);
-  const debounceTimerRef = (0, import_react2.useRef)(null);
+  const [inputValue, setInputValue] = (0, import_react3.useState)(queryParam);
+  const debounceTimerRef = (0, import_react3.useRef)(null);
   const updateSearchParams = (searchQuery) => {
     if (searchQuery?.trim()) {
       setSearchParams((prev) => {
@@ -927,10 +981,10 @@ function SearchInput({
       updateSearchParams("");
     }
   };
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     setInputValue(queryParam);
   }, [queryParam]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     return () => {
       if (debounceTimerRef.current) {
         clearTimeout(debounceTimerRef.current);
@@ -981,7 +1035,7 @@ function SearchInput({
 
 // src/components/modal/Modal.tsx
 var import_framer_motion = require("framer-motion");
-var import_react3 = require("react");
+var import_react4 = require("react");
 var import_react_dom = require("react-dom");
 var import_fa = require("react-icons/fa");
 var import_io5 = require("react-icons/io5");
@@ -1026,13 +1080,13 @@ function Modal({
   customLoader = null,
   footerClassName
 }) {
-  const modalRef = (0, import_react3.useRef)(null);
+  const modalRef = (0, import_react4.useRef)(null);
   const handleBackdropClick = (e) => {
     if (e.target === e.currentTarget && closeOnBackdropClick) {
       onClose();
     }
   };
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     const handleEscape = (e) => {
       if (e.key === "Escape" && isOpen && closeOnEscape) {
         onClose();
@@ -1276,7 +1330,7 @@ function CardSkeleton({
 }
 
 // src/components/tooltip/ToolTip.tsx
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_react_tooltip = require("react-tooltip");
 var import_jsx_runtime9 = require("react/jsx-runtime");
 var defaultTooltipStyle = {
@@ -1301,7 +1355,7 @@ function ToolTip({
   disabled = false,
   children
 }) {
-  const generatedId = (0, import_react4.useId)();
+  const generatedId = (0, import_react5.useId)();
   const tooltipId = `eztrak-tooltip-${generatedId.replace(/:/g, "")}`;
   const tooltipText = String(text ?? "");
   if (disabled || !tooltipText) {
@@ -1400,7 +1454,7 @@ function TooltipText({
 }
 
 // src/components/cell-editor/CustomCellEditor.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_react_hot_toast2 = __toESM(require("react-hot-toast"));
 var import_jsx_runtime11 = require("react/jsx-runtime");
 function ButtonSpinner() {
@@ -1447,7 +1501,7 @@ function normalizeInitialValue(initialValue, inputType) {
   }
   return initialValue;
 }
-var CustomCellEditor = (0, import_react5.forwardRef)(
+var CustomCellEditor = (0, import_react6.forwardRef)(
   ({
     value: initialValue,
     name,
@@ -1472,11 +1526,11 @@ var CustomCellEditor = (0, import_react5.forwardRef)(
     cancelButtonClassName
   }, ref) => {
     const normalizedInitial = normalizeInitialValue(initialValue, inputType);
-    const [value, setValue] = (0, import_react5.useState)(normalizedInitial);
-    const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
-    const inputRef = (0, import_react5.useRef)(null);
-    const selectRef = (0, import_react5.useRef)(null);
-    const normalizedOptions = (0, import_react5.useMemo)(() => {
+    const [value, setValue] = (0, import_react6.useState)(normalizedInitial);
+    const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
+    const inputRef = (0, import_react6.useRef)(null);
+    const selectRef = (0, import_react6.useRef)(null);
+    const normalizedOptions = (0, import_react6.useMemo)(() => {
       if (customOptions && customOptions.length > 0) {
         return customOptions.map((opt) => ({
           value: String(opt[valueKey] ?? ""),
@@ -1486,13 +1540,13 @@ var CustomCellEditor = (0, import_react5.forwardRef)(
       return dropdownOptions;
     }, [customOptions, dropdownOptions, valueKey, labelKey]);
     const isDropdown = inputType === "dropdown" || normalizedOptions.length > 0;
-    (0, import_react5.useImperativeHandle)(ref, () => ({
+    (0, import_react6.useImperativeHandle)(ref, () => ({
       getValue: () => value,
       isCancelBeforeStart: () => false,
       isCancelAfterEnd: () => false,
       isPopup: () => true
     }));
-    (0, import_react5.useEffect)(() => {
+    (0, import_react6.useEffect)(() => {
       if (isDropdown) {
         selectRef.current?.focus();
         return;
@@ -1629,8 +1683,8 @@ var CustomCellEditor = (0, import_react5.forwardRef)(
 CustomCellEditor.displayName = "CustomCellEditor";
 
 // src/components/popup-cell-renderer/PopupCellRenderer.tsx
-var import_react6 = require("react");
-var import_react7 = __toESM(require("@tippyjs/react"));
+var import_react7 = require("react");
+var import_react8 = __toESM(require("@tippyjs/react"));
 var import_bi = require("react-icons/bi");
 var import_jsx_runtime12 = require("react/jsx-runtime");
 function PopupCellRenderer({
@@ -1644,7 +1698,7 @@ function PopupCellRenderer({
   placement = "bottom-end",
   tippyProps
 }) {
-  const [visible, setVisible] = (0, import_react6.useState)(false);
+  const [visible, setVisible] = (0, import_react7.useState)(false);
   const show = () => setVisible(true);
   const hide = () => setVisible(false);
   const rowData = params?.data;
@@ -1654,7 +1708,7 @@ function PopupCellRenderer({
   };
   const content = typeof dropDownContent === "function" ? dropDownContent(handleAction) : dropDownContent;
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex h-full", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_react7.default,
+    import_react8.default,
     {
       content,
       visible,