@trackunit/react-core-hooks 1.3.71 → 1.3.72

package/index.cjs.js

@@ -377,6 +377,165 @@ const OemBrandingContextProvider = (props) => {
     return jsxRuntime.jsx(OEMBrandingService.Provider, { ...props });
 };
 
+/**
+ * The usePrevious hook is a useful tool for tracking the previous value of a variable in a functional component. This can be particularly handy in scenarios where it is necessary to compare the current value with the previous one, such as triggering actions or rendering based on changes.
+ *
+ * @example
+ * const [color, setColor] = React.useState(getRandomColor());
+  const previousColor = usePrevious(color);
+ */
+const usePrevious = (value) => {
+    const ref = react.useRef(undefined);
+    react.useEffect(() => {
+        ref.current = value;
+    }, [value]);
+    const wrapper = {
+        get previous() {
+            return ref.current;
+        },
+    };
+    return wrapper.previous;
+};
+
+/**
+ * Validates the state object using a Zod schema.
+ *
+ * @template TState - The type of the state.
+ * @param {ValidateStateOptions<TState>} params - The parameters for the validateState function.
+ */
+const validateState = ({ state, schema, onValidationFailed, onValidationSuccessful, defaultState, }) => {
+    try {
+        const parsedState = schema.parse(state);
+        onValidationSuccessful?.(parsedState);
+        return parsedState;
+    }
+    catch (error) {
+        // eslint-disable-next-line no-console
+        console.error("Failed to parse and validate the state from local storage.", error);
+        onValidationFailed?.(error);
+        return defaultState;
+    }
+};
+
+/**
+ * Initializes the state from local storage, parsing and validating it if a Zod schema is provided.
+ *
+ * @template TState - The type of the state stored in local storage.
+ * @param {Omit<LocalStorageParams<TState>, "state">} params - The parameters for initializing the local storage state.
+ * @returns {TState} - The initialized state.
+ */
+const initLocalStorageState = ({ key, defaultState, schema, }) => {
+    const localStorageItem = localStorage.getItem(key);
+    if (!localStorageItem) {
+        return defaultState;
+    }
+    const localStorageItemJSON = JSON.parse(localStorageItem);
+    if (!schema) {
+        return localStorageItemJSON;
+    }
+    return validateState({ state: localStorageItemJSON, defaultState, schema });
+};
+
+/**
+ * Sets a value in the local storage with the specified key.
+ * Thin wrapper around localStorage.setItem() that is slightly more type safe
+ * Stringifies value automatically.
+ * Useful if you for some reason can't use the useLocalStorage hook for React lifecycle reasons
+ *
+ * @template TValue - The type of value to be stored.
+ * @param {string} key - The key under which to store the value.
+ * @param {TValue} value - The value to store in the local storage.
+ */
+const setLocalStorage = (key, value) => {
+    localStorage.setItem(key, JSON.stringify(value));
+};
+
+/**
+ * Custom hook for synchronizing a state variable with local storage,
+ * with optional schema validation and callbacks.
+ *
+ * @template TState - The type of the state variable.
+ * @param {LocalStorageParams<TState> & LocalStorageCallbacks & { state: TState }} params - The parameters for the useLocalStorageEffect hook.
+ */
+const useLocalStorageEffect = ({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
+    const prevState = usePrevious(state);
+    react.useEffect(() => {
+        if (JSON.stringify(prevState) === JSON.stringify(state)) {
+            return;
+        }
+        if (schema) {
+            validateState({
+                state,
+                schema,
+                defaultState,
+                onValidationFailed: error => {
+                    // eslint-disable-next-line no-console
+                    console.error(`State validation failed. Resetting local storage to default state: ${defaultState}.`, error);
+                    localStorage.removeItem(key);
+                    onValidationFailed?.(error);
+                },
+                onValidationSuccessful: data => {
+                    setLocalStorage(key, data);
+                    onValidationSuccessful?.(data);
+                },
+            });
+        }
+        else {
+            const stringifiedState = JSON.stringify(state);
+            localStorage.setItem(key, stringifiedState);
+        }
+    }, [state, key, schema, defaultState, prevState, onValidationFailed, onValidationSuccessful]);
+};
+
+/**
+ * Works like a normal useState, but saves to local storage and has optional schema validation.
+ *
+ * @template TState - The type of the value stored in local storage.
+ * @param {Omit<LocalStorageParams<TState>, "state"> & LocalStorageCallbacks} options - The options for useLocalStorage.
+ * @returns {[TState, Dispatch<SetStateAction<TState>>, () => void]} - A tuple containing the current value, a function to update the value, and a function to remove the value from local storage.
+ */
+const useLocalStorage = ({ key, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
+    if (!key) {
+        throw new Error("useLocalStorage key may not be falsy");
+    }
+    const [state, setState] = react.useState(initLocalStorageState({ key, defaultState, schema }));
+    const prevKey = usePrevious(key);
+    react.useEffect(() => {
+        if (key !== prevKey) {
+            setState(initLocalStorageState({ key, defaultState, schema }));
+        }
+    }, [key, prevKey, defaultState, schema]);
+    useLocalStorageEffect({
+        key,
+        state,
+        defaultState,
+        schema,
+        onValidationFailed,
+        onValidationSuccessful,
+    });
+    const reset = () => {
+        setState(defaultState);
+    };
+    return [state, setState, reset];
+};
+
+/**
+ * Works like a normal useReducer, but saves to local storage and has optional schema validation.
+ *
+ * @template TState - The type of the state.
+ * @template TAction - The type of the action.
+ * @param {LocalStorageParams<TState> & LocalStorageCallbacks} params - The parameters for the useLocalStorageReducer function.
+ * @returns {[TState, Dispatch<TAction>]} - A tuple containing the state and the dispatch function.
+ */
+const useLocalStorageReducer = ({ key, defaultState, reducer, schema, onValidationFailed, onValidationSuccessful, }) => {
+    if (!key) {
+        throw new Error("useLocalStorage key may not be falsy");
+    }
+    const [state, dispatch] = react.useReducer(reducer, defaultState, () => initLocalStorageState({ key, defaultState, schema }));
+    useLocalStorageEffect({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful });
+    return [state, dispatch];
+};
+
 const ModalDialogContext = react.createContext(null);
 /**
  * This is a provider for the ModalDialogContext.
@@ -705,6 +864,33 @@ const useUserSubscription = () => {
     return context;
 };
 
+const TimeRangeContext = react.createContext(null);
+/**
+ * This is a hook to use the TimeRangeProvider.
+ *
+ * @requires TimeRangeProvider
+ * @example
+ * import { useTimeRange } from "@trackunit/react-core-hooks";
+ *
+ * export const useTimeRange = () => {
+ *   const { timeRange } = useTimeRange();
+ *
+ *   ...
+ * };
+ * @see {@link TimeRangeContext}
+ */
+const useTimeRange = () => {
+    const context = react.useContext(TimeRangeContext);
+    if (!context) {
+        throw new Error("useTimeRange must be used within the TimeRangeContext");
+    }
+    return context;
+};
+/**
+ * This is a provider for the TimeRangeContext.
+ */
+const TimeRangeProvider = (props) => jsxRuntime.jsx(TimeRangeContext.Provider, { ...props });
+
 const ToastContext = react.createContext(null);
 /**
  * This is a provider for the ToastContext.
@@ -735,27 +921,6 @@ const useToast = () => {
     return toastContext;
 };
 
-/**
- * Hook for filtering a list of items by text search, client side search in a list.
- *
- * @template TSearchableItem
- * @param items The list of items to filter.
- * @param props The properties to search in each item.
- * @returns {[TSearchableItem[], string, Dispatch<string>]} A tuple with the filtered items, the search text and a setter for the search text.
- * @example
- * const [result, searchText, setSearchText] = useTextSearch(items, item => [item.name, item.description]);
- */
-function useTextSearch(items, props) {
-    const [searchText, setSearchText] = react.useState("");
-    const result = react.useMemo(() => {
-        if (!searchText) {
-            return items;
-        }
-        return sharedUtils.filterByMultiple(items, props, searchText);
-    }, [items, props, searchText]);
-    return [result, searchText, setSearchText];
-}
-
 const CurrentUserPreferenceContext = react.createContext(null);
 /**
  *
@@ -879,163 +1044,25 @@ const useCurrentUser = () => {
 };
 
 /**
- * The usePrevious hook is a useful tool for tracking the previous value of a variable in a functional component. This can be particularly handy in scenarios where it is necessary to compare the current value with the previous one, such as triggering actions or rendering based on changes.
+ * Hook for filtering a list of items by text search, client side search in a list.
  *
+ * @template TSearchableItem
+ * @param items The list of items to filter.
+ * @param props The properties to search in each item.
+ * @returns {[TSearchableItem[], string, Dispatch<string>]} A tuple with the filtered items, the search text and a setter for the search text.
  * @example
- * const [color, setColor] = React.useState(getRandomColor());
-  const previousColor = usePrevious(color);
- */
-const usePrevious = (value) => {
-    const ref = react.useRef(undefined);
-    react.useEffect(() => {
-        ref.current = value;
-    }, [value]);
-    const wrapper = {
-        get previous() {
-            return ref.current;
-        },
-    };
-    return wrapper.previous;
-};
-
-/**
- * Validates the state object using a Zod schema.
- *
- * @template TState - The type of the state.
- * @param {ValidateStateOptions<TState>} params - The parameters for the validateState function.
- */
-const validateState = ({ state, schema, onValidationFailed, onValidationSuccessful, defaultState, }) => {
-    try {
-        const parsedState = schema.parse(state);
-        onValidationSuccessful?.(parsedState);
-        return parsedState;
-    }
-    catch (error) {
-        // eslint-disable-next-line no-console
-        console.error("Failed to parse and validate the state from local storage.", error);
-        onValidationFailed?.(error);
-        return defaultState;
-    }
-};
-
-/**
- * Initializes the state from local storage, parsing and validating it if a Zod schema is provided.
- *
- * @template TState - The type of the state stored in local storage.
- * @param {Omit<LocalStorageParams<TState>, "state">} params - The parameters for initializing the local storage state.
- * @returns {TState} - The initialized state.
- */
-const initLocalStorageState = ({ key, defaultState, schema, }) => {
-    const localStorageItem = localStorage.getItem(key);
-    if (!localStorageItem) {
-        return defaultState;
-    }
-    const localStorageItemJSON = JSON.parse(localStorageItem);
-    if (!schema) {
-        return localStorageItemJSON;
-    }
-    return validateState({ state: localStorageItemJSON, defaultState, schema });
-};
-
-/**
- * Sets a value in the local storage with the specified key.
- * Thin wrapper around localStorage.setItem() that is slightly more type safe
- * Stringifies value automatically.
- * Useful if you for some reason can't use the useLocalStorage hook for React lifecycle reasons
- *
- * @template TValue - The type of value to be stored.
- * @param {string} key - The key under which to store the value.
- * @param {TValue} value - The value to store in the local storage.
- */
-const setLocalStorage = (key, value) => {
-    localStorage.setItem(key, JSON.stringify(value));
-};
-
-/**
- * Custom hook for synchronizing a state variable with local storage,
- * with optional schema validation and callbacks.
- *
- * @template TState - The type of the state variable.
- * @param {LocalStorageParams<TState> & LocalStorageCallbacks & { state: TState }} params - The parameters for the useLocalStorageEffect hook.
- */
-const useLocalStorageEffect = ({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
-    const prevState = usePrevious(state);
-    react.useEffect(() => {
-        if (JSON.stringify(prevState) === JSON.stringify(state)) {
-            return;
-        }
-        if (schema) {
-            validateState({
-                state,
-                schema,
-                defaultState,
-                onValidationFailed: error => {
-                    // eslint-disable-next-line no-console
-                    console.error(`State validation failed. Resetting local storage to default state: ${defaultState}.`, error);
-                    localStorage.removeItem(key);
-                    onValidationFailed?.(error);
-                },
-                onValidationSuccessful: data => {
-                    setLocalStorage(key, data);
-                    onValidationSuccessful?.(data);
-                },
-            });
-        }
-        else {
-            const stringifiedState = JSON.stringify(state);
-            localStorage.setItem(key, stringifiedState);
-        }
-    }, [state, key, schema, defaultState, prevState, onValidationFailed, onValidationSuccessful]);
-};
-
-/**
- * Works like a normal useState, but saves to local storage and has optional schema validation.
- *
- * @template TState - The type of the value stored in local storage.
- * @param {Omit<LocalStorageParams<TState>, "state"> & LocalStorageCallbacks} options - The options for useLocalStorage.
- * @returns {[TState, Dispatch<SetStateAction<TState>>, () => void]} - A tuple containing the current value, a function to update the value, and a function to remove the value from local storage.
+ * const [result, searchText, setSearchText] = useTextSearch(items, item => [item.name, item.description]);
  */
-const useLocalStorage = ({ key, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
-    if (!key) {
-        throw new Error("useLocalStorage key may not be falsy");
-    }
-    const [state, setState] = react.useState(initLocalStorageState({ key, defaultState, schema }));
-    const prevKey = usePrevious(key);
-    react.useEffect(() => {
-        if (key !== prevKey) {
-            setState(initLocalStorageState({ key, defaultState, schema }));
+function useTextSearch(items, props) {
+    const [searchText, setSearchText] = react.useState("");
+    const result = react.useMemo(() => {
+        if (!searchText) {
+            return items;
         }
-    }, [key, prevKey, defaultState, schema]);
-    useLocalStorageEffect({
-        key,
-        state,
-        defaultState,
-        schema,
-        onValidationFailed,
-        onValidationSuccessful,
-    });
-    const reset = () => {
-        setState(defaultState);
-    };
-    return [state, setState, reset];
-};
-
-/**
- * Works like a normal useReducer, but saves to local storage and has optional schema validation.
- *
- * @template TState - The type of the state.
- * @template TAction - The type of the action.
- * @param {LocalStorageParams<TState> & LocalStorageCallbacks} params - The parameters for the useLocalStorageReducer function.
- * @returns {[TState, Dispatch<TAction>]} - A tuple containing the state and the dispatch function.
- */
-const useLocalStorageReducer = ({ key, defaultState, reducer, schema, onValidationFailed, onValidationSuccessful, }) => {
-    if (!key) {
-        throw new Error("useLocalStorage key may not be falsy");
-    }
-    const [state, dispatch] = react.useReducer(reducer, defaultState, () => initLocalStorageState({ key, defaultState, schema }));
-    useLocalStorageEffect({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful });
-    return [state, dispatch];
-};
+        return sharedUtils.filterByMultiple(items, props, searchText);
+    }, [items, props, searchText]);
+    return [result, searchText, setSearchText];
+}
 
 exports.AnalyticsContext = AnalyticsContext;
 exports.AnalyticsContextProvider = AnalyticsContextProvider;
@@ -1050,6 +1077,7 @@ exports.FilterBarProvider = FilterBarProvider;
 exports.ModalDialogContextProvider = ModalDialogContextProvider;
 exports.NavigationContextProvider = NavigationContextProvider;
 exports.OemBrandingContextProvider = OemBrandingContextProvider;
+exports.TimeRangeProvider = TimeRangeProvider;
 exports.ToastProvider = ToastProvider;
 exports.TokenProvider = TokenProvider;
 exports.UserSubscriptionProvider = UserSubscriptionProvider;
@@ -1081,6 +1109,7 @@ exports.useOemBrandingContext = useOemBrandingContext;
 exports.usePrevious = usePrevious;
 exports.useSiteRuntime = useSiteRuntime;
 exports.useTextSearch = useTextSearch;
+exports.useTimeRange = useTimeRange;
 exports.useToast = useToast;
 exports.useToken = useToken;
 exports.useUserSubscription = useUserSubscription;

package/index.esm.js

@@ -1,4 +1,4 @@
-import { createContext, useContext, useMemo, useState, useCallback, useEffect, useRef, useReducer } from 'react';
+import { createContext, useContext, useMemo, useState, useCallback, useRef, useEffect, useReducer } from 'react';
 import { jsx } from 'react/jsx-runtime';
 import { AssetRuntime, CustomerRuntime, EventRuntime, ParamsRuntime, SiteRuntime } from '@trackunit/iris-app-runtime-core';
 import { filterByMultiple } from '@trackunit/shared-utils';
@@ -375,6 +375,165 @@ const OemBrandingContextProvider = (props) => {
     return jsx(OEMBrandingService.Provider, { ...props });
 };
 
+/**
+ * The usePrevious hook is a useful tool for tracking the previous value of a variable in a functional component. This can be particularly handy in scenarios where it is necessary to compare the current value with the previous one, such as triggering actions or rendering based on changes.
+ *
+ * @example
+ * const [color, setColor] = React.useState(getRandomColor());
+  const previousColor = usePrevious(color);
+ */
+const usePrevious = (value) => {
+    const ref = useRef(undefined);
+    useEffect(() => {
+        ref.current = value;
+    }, [value]);
+    const wrapper = {
+        get previous() {
+            return ref.current;
+        },
+    };
+    return wrapper.previous;
+};
+
+/**
+ * Validates the state object using a Zod schema.
+ *
+ * @template TState - The type of the state.
+ * @param {ValidateStateOptions<TState>} params - The parameters for the validateState function.
+ */
+const validateState = ({ state, schema, onValidationFailed, onValidationSuccessful, defaultState, }) => {
+    try {
+        const parsedState = schema.parse(state);
+        onValidationSuccessful?.(parsedState);
+        return parsedState;
+    }
+    catch (error) {
+        // eslint-disable-next-line no-console
+        console.error("Failed to parse and validate the state from local storage.", error);
+        onValidationFailed?.(error);
+        return defaultState;
+    }
+};
+
+/**
+ * Initializes the state from local storage, parsing and validating it if a Zod schema is provided.
+ *
+ * @template TState - The type of the state stored in local storage.
+ * @param {Omit<LocalStorageParams<TState>, "state">} params - The parameters for initializing the local storage state.
+ * @returns {TState} - The initialized state.
+ */
+const initLocalStorageState = ({ key, defaultState, schema, }) => {
+    const localStorageItem = localStorage.getItem(key);
+    if (!localStorageItem) {
+        return defaultState;
+    }
+    const localStorageItemJSON = JSON.parse(localStorageItem);
+    if (!schema) {
+        return localStorageItemJSON;
+    }
+    return validateState({ state: localStorageItemJSON, defaultState, schema });
+};
+
+/**
+ * Sets a value in the local storage with the specified key.
+ * Thin wrapper around localStorage.setItem() that is slightly more type safe
+ * Stringifies value automatically.
+ * Useful if you for some reason can't use the useLocalStorage hook for React lifecycle reasons
+ *
+ * @template TValue - The type of value to be stored.
+ * @param {string} key - The key under which to store the value.
+ * @param {TValue} value - The value to store in the local storage.
+ */
+const setLocalStorage = (key, value) => {
+    localStorage.setItem(key, JSON.stringify(value));
+};
+
+/**
+ * Custom hook for synchronizing a state variable with local storage,
+ * with optional schema validation and callbacks.
+ *
+ * @template TState - The type of the state variable.
+ * @param {LocalStorageParams<TState> & LocalStorageCallbacks & { state: TState }} params - The parameters for the useLocalStorageEffect hook.
+ */
+const useLocalStorageEffect = ({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
+    const prevState = usePrevious(state);
+    useEffect(() => {
+        if (JSON.stringify(prevState) === JSON.stringify(state)) {
+            return;
+        }
+        if (schema) {
+            validateState({
+                state,
+                schema,
+                defaultState,
+                onValidationFailed: error => {
+                    // eslint-disable-next-line no-console
+                    console.error(`State validation failed. Resetting local storage to default state: ${defaultState}.`, error);
+                    localStorage.removeItem(key);
+                    onValidationFailed?.(error);
+                },
+                onValidationSuccessful: data => {
+                    setLocalStorage(key, data);
+                    onValidationSuccessful?.(data);
+                },
+            });
+        }
+        else {
+            const stringifiedState = JSON.stringify(state);
+            localStorage.setItem(key, stringifiedState);
+        }
+    }, [state, key, schema, defaultState, prevState, onValidationFailed, onValidationSuccessful]);
+};
+
+/**
+ * Works like a normal useState, but saves to local storage and has optional schema validation.
+ *
+ * @template TState - The type of the value stored in local storage.
+ * @param {Omit<LocalStorageParams<TState>, "state"> & LocalStorageCallbacks} options - The options for useLocalStorage.
+ * @returns {[TState, Dispatch<SetStateAction<TState>>, () => void]} - A tuple containing the current value, a function to update the value, and a function to remove the value from local storage.
+ */
+const useLocalStorage = ({ key, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
+    if (!key) {
+        throw new Error("useLocalStorage key may not be falsy");
+    }
+    const [state, setState] = useState(initLocalStorageState({ key, defaultState, schema }));
+    const prevKey = usePrevious(key);
+    useEffect(() => {
+        if (key !== prevKey) {
+            setState(initLocalStorageState({ key, defaultState, schema }));
+        }
+    }, [key, prevKey, defaultState, schema]);
+    useLocalStorageEffect({
+        key,
+        state,
+        defaultState,
+        schema,
+        onValidationFailed,
+        onValidationSuccessful,
+    });
+    const reset = () => {
+        setState(defaultState);
+    };
+    return [state, setState, reset];
+};
+
+/**
+ * Works like a normal useReducer, but saves to local storage and has optional schema validation.
+ *
+ * @template TState - The type of the state.
+ * @template TAction - The type of the action.
+ * @param {LocalStorageParams<TState> & LocalStorageCallbacks} params - The parameters for the useLocalStorageReducer function.
+ * @returns {[TState, Dispatch<TAction>]} - A tuple containing the state and the dispatch function.
+ */
+const useLocalStorageReducer = ({ key, defaultState, reducer, schema, onValidationFailed, onValidationSuccessful, }) => {
+    if (!key) {
+        throw new Error("useLocalStorage key may not be falsy");
+    }
+    const [state, dispatch] = useReducer(reducer, defaultState, () => initLocalStorageState({ key, defaultState, schema }));
+    useLocalStorageEffect({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful });
+    return [state, dispatch];
+};
+
 const ModalDialogContext = createContext(null);
 /**
  * This is a provider for the ModalDialogContext.
@@ -703,6 +862,33 @@ const useUserSubscription = () => {
     return context;
 };
 
+const TimeRangeContext = createContext(null);
+/**
+ * This is a hook to use the TimeRangeProvider.
+ *
+ * @requires TimeRangeProvider
+ * @example
+ * import { useTimeRange } from "@trackunit/react-core-hooks";
+ *
+ * export const useTimeRange = () => {
+ *   const { timeRange } = useTimeRange();
+ *
+ *   ...
+ * };
+ * @see {@link TimeRangeContext}
+ */
+const useTimeRange = () => {
+    const context = useContext(TimeRangeContext);
+    if (!context) {
+        throw new Error("useTimeRange must be used within the TimeRangeContext");
+    }
+    return context;
+};
+/**
+ * This is a provider for the TimeRangeContext.
+ */
+const TimeRangeProvider = (props) => jsx(TimeRangeContext.Provider, { ...props });
+
 const ToastContext = createContext(null);
 /**
  * This is a provider for the ToastContext.
@@ -733,27 +919,6 @@ const useToast = () => {
     return toastContext;
 };
 
-/**
- * Hook for filtering a list of items by text search, client side search in a list.
- *
- * @template TSearchableItem
- * @param items The list of items to filter.
- * @param props The properties to search in each item.
- * @returns {[TSearchableItem[], string, Dispatch<string>]} A tuple with the filtered items, the search text and a setter for the search text.
- * @example
- * const [result, searchText, setSearchText] = useTextSearch(items, item => [item.name, item.description]);
- */
-function useTextSearch(items, props) {
-    const [searchText, setSearchText] = useState("");
-    const result = useMemo(() => {
-        if (!searchText) {
-            return items;
-        }
-        return filterByMultiple(items, props, searchText);
-    }, [items, props, searchText]);
-    return [result, searchText, setSearchText];
-}
-
 const CurrentUserPreferenceContext = createContext(null);
 /**
  *
@@ -877,162 +1042,24 @@ const useCurrentUser = () => {
 };
 
 /**
- * The usePrevious hook is a useful tool for tracking the previous value of a variable in a functional component. This can be particularly handy in scenarios where it is necessary to compare the current value with the previous one, such as triggering actions or rendering based on changes.
+ * Hook for filtering a list of items by text search, client side search in a list.
  *
+ * @template TSearchableItem
+ * @param items The list of items to filter.
+ * @param props The properties to search in each item.
+ * @returns {[TSearchableItem[], string, Dispatch<string>]} A tuple with the filtered items, the search text and a setter for the search text.
  * @example
- * const [color, setColor] = React.useState(getRandomColor());
-  const previousColor = usePrevious(color);
- */
-const usePrevious = (value) => {
-    const ref = useRef(undefined);
-    useEffect(() => {
-        ref.current = value;
-    }, [value]);
-    const wrapper = {
-        get previous() {
-            return ref.current;
-        },
-    };
-    return wrapper.previous;
-};
-
-/**
- * Validates the state object using a Zod schema.
- *
- * @template TState - The type of the state.
- * @param {ValidateStateOptions<TState>} params - The parameters for the validateState function.
- */
-const validateState = ({ state, schema, onValidationFailed, onValidationSuccessful, defaultState, }) => {
-    try {
-        const parsedState = schema.parse(state);
-        onValidationSuccessful?.(parsedState);
-        return parsedState;
-    }
-    catch (error) {
-        // eslint-disable-next-line no-console
-        console.error("Failed to parse and validate the state from local storage.", error);
-        onValidationFailed?.(error);
-        return defaultState;
-    }
-};
-
-/**
- * Initializes the state from local storage, parsing and validating it if a Zod schema is provided.
- *
- * @template TState - The type of the state stored in local storage.
- * @param {Omit<LocalStorageParams<TState>, "state">} params - The parameters for initializing the local storage state.
- * @returns {TState} - The initialized state.
- */
-const initLocalStorageState = ({ key, defaultState, schema, }) => {
-    const localStorageItem = localStorage.getItem(key);
-    if (!localStorageItem) {
-        return defaultState;
-    }
-    const localStorageItemJSON = JSON.parse(localStorageItem);
-    if (!schema) {
-        return localStorageItemJSON;
-    }
-    return validateState({ state: localStorageItemJSON, defaultState, schema });
-};
-
-/**
- * Sets a value in the local storage with the specified key.
- * Thin wrapper around localStorage.setItem() that is slightly more type safe
- * Stringifies value automatically.
- * Useful if you for some reason can't use the useLocalStorage hook for React lifecycle reasons
- *
- * @template TValue - The type of value to be stored.
- * @param {string} key - The key under which to store the value.
- * @param {TValue} value - The value to store in the local storage.
- */
-const setLocalStorage = (key, value) => {
-    localStorage.setItem(key, JSON.stringify(value));
-};
-
-/**
- * Custom hook for synchronizing a state variable with local storage,
- * with optional schema validation and callbacks.
- *
- * @template TState - The type of the state variable.
- * @param {LocalStorageParams<TState> & LocalStorageCallbacks & { state: TState }} params - The parameters for the useLocalStorageEffect hook.
- */
-const useLocalStorageEffect = ({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
-    const prevState = usePrevious(state);
-    useEffect(() => {
-        if (JSON.stringify(prevState) === JSON.stringify(state)) {
-            return;
-        }
-        if (schema) {
-            validateState({
-                state,
-                schema,
-                defaultState,
-                onValidationFailed: error => {
-                    // eslint-disable-next-line no-console
-                    console.error(`State validation failed. Resetting local storage to default state: ${defaultState}.`, error);
-                    localStorage.removeItem(key);
-                    onValidationFailed?.(error);
-                },
-                onValidationSuccessful: data => {
-                    setLocalStorage(key, data);
-                    onValidationSuccessful?.(data);
-                },
-            });
-        }
-        else {
-            const stringifiedState = JSON.stringify(state);
-            localStorage.setItem(key, stringifiedState);
-        }
-    }, [state, key, schema, defaultState, prevState, onValidationFailed, onValidationSuccessful]);
-};
-
-/**
- * Works like a normal useState, but saves to local storage and has optional schema validation.
- *
- * @template TState - The type of the value stored in local storage.
- * @param {Omit<LocalStorageParams<TState>, "state"> & LocalStorageCallbacks} options - The options for useLocalStorage.
- * @returns {[TState, Dispatch<SetStateAction<TState>>, () => void]} - A tuple containing the current value, a function to update the value, and a function to remove the value from local storage.
+ * const [result, searchText, setSearchText] = useTextSearch(items, item => [item.name, item.description]);
  */
-const useLocalStorage = ({ key, defaultState, schema, onValidationFailed, onValidationSuccessful, }) => {
-    if (!key) {
-        throw new Error("useLocalStorage key may not be falsy");
-    }
-    const [state, setState] = useState(initLocalStorageState({ key, defaultState, schema }));
-    const prevKey = usePrevious(key);
-    useEffect(() => {
-        if (key !== prevKey) {
-            setState(initLocalStorageState({ key, defaultState, schema }));
+function useTextSearch(items, props) {
+    const [searchText, setSearchText] = useState("");
+    const result = useMemo(() => {
+        if (!searchText) {
+            return items;
         }
-    }, [key, prevKey, defaultState, schema]);
-    useLocalStorageEffect({
-        key,
-        state,
-        defaultState,
-        schema,
-        onValidationFailed,
-        onValidationSuccessful,
-    });
-    const reset = () => {
-        setState(defaultState);
-    };
-    return [state, setState, reset];
-};
-
-/**
- * Works like a normal useReducer, but saves to local storage and has optional schema validation.
- *
- * @template TState - The type of the state.
- * @template TAction - The type of the action.
- * @param {LocalStorageParams<TState> & LocalStorageCallbacks} params - The parameters for the useLocalStorageReducer function.
- * @returns {[TState, Dispatch<TAction>]} - A tuple containing the state and the dispatch function.
- */
-const useLocalStorageReducer = ({ key, defaultState, reducer, schema, onValidationFailed, onValidationSuccessful, }) => {
-    if (!key) {
-        throw new Error("useLocalStorage key may not be falsy");
-    }
-    const [state, dispatch] = useReducer(reducer, defaultState, () => initLocalStorageState({ key, defaultState, schema }));
-    useLocalStorageEffect({ key, state, defaultState, schema, onValidationFailed, onValidationSuccessful });
-    return [state, dispatch];
-};
+        return filterByMultiple(items, props, searchText);
+    }, [items, props, searchText]);
+    return [result, searchText, setSearchText];
+}
 
-export { AnalyticsContext, AnalyticsContextProvider, AssetSortingProvider, ConfirmationDialogProvider, CurrentUserPreferenceProvider, CurrentUserProvider, EnvironmentContextProvider, ErrorHandlingContext, ErrorHandlingContextProvider, FilterBarProvider, ModalDialogContextProvider, NavigationContextProvider, OemBrandingContextProvider, ToastProvider, TokenProvider, UserSubscriptionProvider, fetchAssetBlobUrl, useAnalytics, useAssetRuntime, useAssetSorting, useConfirmationDialog, useCurrentUser, useCurrentUserLanguage, useCurrentUserSystemOfMeasurement, useCurrentUserTimeZonePreference, useCustomerRuntime, useEnvironment, useErrorHandler, useEventRuntime, useFeatureBranchQueryString, useFilterBarContext, useHasAccessTo, useImageUploader, useIrisAppId, useIrisAppImage, useIrisAppName, useLocalStorage, useLocalStorageReducer, useModalDialogContext, useNavigateInHost, useOemBrandingContext, usePrevious, useSiteRuntime, useTextSearch, useToast, useToken, useUserSubscription };
+export { AnalyticsContext, AnalyticsContextProvider, AssetSortingProvider, ConfirmationDialogProvider, CurrentUserPreferenceProvider, CurrentUserProvider, EnvironmentContextProvider, ErrorHandlingContext, ErrorHandlingContextProvider, FilterBarProvider, ModalDialogContextProvider, NavigationContextProvider, OemBrandingContextProvider, TimeRangeProvider, ToastProvider, TokenProvider, UserSubscriptionProvider, fetchAssetBlobUrl, useAnalytics, useAssetRuntime, useAssetSorting, useConfirmationDialog, useCurrentUser, useCurrentUserLanguage, useCurrentUserSystemOfMeasurement, useCurrentUserTimeZonePreference, useCustomerRuntime, useEnvironment, useErrorHandler, useEventRuntime, useFeatureBranchQueryString, useFilterBarContext, useHasAccessTo, useImageUploader, useIrisAppId, useIrisAppImage, useIrisAppName, useLocalStorage, useLocalStorageReducer, useModalDialogContext, useNavigateInHost, useOemBrandingContext, usePrevious, useSiteRuntime, useTextSearch, useTimeRange, useToast, useToken, useUserSubscription };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-core-hooks",
-  "version": "1.3.71",
+  "version": "1.3.72",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -10,8 +10,8 @@
     "react": "19.0.0",
     "jest-fetch-mock": "^3.0.3",
     "zod": "3.22.4",
-    "@trackunit/react-core-contexts-api": "1.4.69",
-    "@trackunit/iris-app-runtime-core": "1.4.70",
+    "@trackunit/react-core-contexts-api": "1.4.70",
+    "@trackunit/iris-app-runtime-core": "1.4.71",
     "@trackunit/shared-utils": "1.5.68"
   },
   "module": "./index.esm.js",

package/src/index.d.ts

@@ -8,6 +8,8 @@ export * from "./filter-bar/FilterBarProvider";
 export * from "./images/useImageUploader";
 export * from "./images/useIrisAppImage";
 export * from "./irisOemApp/IrisOemAppContextProvider";
+export * from "./localStorage/useLocalStorage";
+export * from "./localStorage/useLocalStorageReducer";
 export * from "./modalDialog/ModalDialogProvider";
 export * from "./navigation/NavigationContextProvider";
 export * from "./runtimes/useAssetRuntime";
@@ -16,12 +18,11 @@ export * from "./runtimes/useEventRuntime";
 export * from "./runtimes/useParamsRuntime";
 export * from "./runtimes/useSiteRuntime";
 export * from "./subscription/UserSubscriptionProvider";
+export * from "./timeRange/TimeRangeProvider";
 export * from "./toast/ToastProvider";
 export * from "./token/TokenProvider";
 export * from "./useFeatureBranchQueryString";
-export * from "./useTextSearch";
+export * from "./usePrevious";
 export * from "./user/CurrentUserPreferenceProvider";
 export * from "./user/CurrentUserProvider";
-export * from "./localStorage/useLocalStorage";
-export * from "./localStorage/useLocalStorageReducer";
-export * from "./usePrevious";
+export * from "./useTextSearch";

package/src/timeRange/TimeRangeProvider.d.ts

@@ -0,0 +1,26 @@
+import { TimeRangeContext as TimeRangeContextType } from "@trackunit/react-core-contexts-api";
+import { ReactNode } from "react";
+/**
+ * This is a hook to use the TimeRangeProvider.
+ *
+ * @requires TimeRangeProvider
+ * @example
+ * import { useTimeRange } from "@trackunit/react-core-hooks";
+ *
+ * export const useTimeRange = () => {
+ *   const { timeRange } = useTimeRange();
+ *
+ *   ...
+ * };
+ * @see {@link TimeRangeContext}
+ */
+export declare const useTimeRange: () => TimeRangeContextType;
+interface TimeRangeContextProps {
+    value: TimeRangeContextType;
+    children?: ReactNode;
+}
+/**
+ * This is a provider for the TimeRangeContext.
+ */
+export declare const TimeRangeProvider: (props: TimeRangeContextProps) => import("react/jsx-runtime").JSX.Element;
+export {};