@capsitech/react-utilities 0.1.6 → 0.1.8

package/README.md

@@ -1,3 +1,77 @@
 # `Capsitech.ReactUtilities`
 
 A set of javascript utility methods
+
+## Installation
+
+```bash
+npm install @capsitech/react-utilities
+# or
+yarn add @capsitech/react-utilities
+```
+
+## ApiUtility Configuration
+
+The `ApiUtility` now supports flexible configuration for different deployment environments.
+
+### Quick Start
+
+```typescript
+import { ApiUtility } from '@capsitech/react-utilities';
+
+// Configure once at app startup
+ApiUtility.configure({
+  baseURL: 'https://api.yourapp.com',
+});
+
+// Use throughout your app
+const users = await ApiUtility.getResult('/users');
+```
+
+### Configuration Options
+
+```typescript
+import { ApiUtility, IApiUtilityConfig } from '@capsitech/react-utilities';
+
+const config: IApiUtilityConfig = {
+  baseURL: 'https://api.example.com', // Base URL for all API calls
+  accessToken: 'your-jwt-token', // JWT token for authorization
+  handleError: (error, errors) => {
+    // Custom error handler
+    console.error('API Error:', error);
+  },
+};
+
+ApiUtility.configure(config);
+```
+
+### Environment Integration
+
+#### Next.js
+
+```typescript
+// In your _app.tsx or layout.tsx
+ApiUtility.configure({
+  baseURL: process.env.NEXT_PUBLIC_API_URL,
+});
+```
+
+#### Vite
+
+```typescript
+// In your main.tsx
+ApiUtility.configure({
+  baseURL: import.meta.env.VITE_API_URL,
+});
+```
+
+#### Create React App
+
+```typescript
+// In your index.tsx
+ApiUtility.configure({
+  baseURL: process.env.REACT_APP_API_URL,
+});
+```
+
+For more detailed configuration examples, see [API_CONFIGURATION.md](./docs/API_CONFIGURATION.md).

package/lib/Components.d.ts

@@ -0,0 +1,2 @@
+export * from './Components/index'
+export {}

package/lib/Components.js

@@ -0,0 +1,5 @@
+import { SuspenseRoute as p } from "./src/Components/SuspenseRoute.js";
+export {
+  p as SuspenseRoute
+};
+//# sourceMappingURL=Components.js.map

package/lib/Components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Components.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/lib/Hooks/index.d.ts

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, MutableRefObject } from 'react';
 export * from './useInfiniteScroll';
 export * from './useNetworkState';
 export * from './useShortcuts';
@@ -13,7 +13,7 @@ export declare const useUpdateEffect: typeof useEffect;
  *
  * @param value the value or function to persist
  */
-export declare function useLatestRef<T>(value: T): import("react").MutableRefObject<T>;
+export declare function useLatestRef<T>(value: T): MutableRefObject<T>;
 /**
  * useCallbackRef hook
  *

package/lib/Hooks/useInfiniteScroll.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { default as React } from 'react';
 /**
  * Infinite scrolling with intersection observer
  * @param scrollRef Reference object for observe bottom boundary

package/lib/Hooks.d.ts

@@ -0,0 +1,2 @@
+export * from './Hooks/index'
+export {}

package/lib/Hooks.js

@@ -0,0 +1,67 @@
+import { useRef as u, useEffect as n, useCallback as i } from "react";
+import { useInfiniteScroll as b } from "./src/Hooks/useInfiniteScroll.js";
+import { isBrowser as R, isNavigator as x, useNetworkState as C } from "./src/Hooks/useNetworkState.js";
+import { disabledEventPropagation as E, useShortcuts as T } from "./src/Hooks/useShortcuts.js";
+const a = (t, r) => {
+  const e = u(!1);
+  return n(() => {
+    if (e.current)
+      return t();
+    e.current = !0;
+  }, r), e.current;
+};
+function c(t) {
+  const r = u(t);
+  return n(() => {
+    r.current = t;
+  }, [t]), r;
+}
+const l = (t) => {
+  const r = u(t);
+  return n(() => {
+    r.current = t;
+  }), i(
+    ((...e) => r.current?.(...e)),
+    []
+  );
+}, m = () => {
+  const t = u(!0);
+  return t.current ? (t.current = !1, !0) : t.current;
+};
+function p(t, r) {
+  const e = c(t);
+  n(() => {
+    const s = () => {
+      e.current?.();
+    };
+    if (r !== null) {
+      const o = setInterval(s, r);
+      return () => clearInterval(o);
+    }
+  }, [r, e]);
+}
+function d(t, r) {
+  const e = c(t);
+  n(() => {
+    if (r == null) return;
+    const s = setTimeout(() => {
+      e.current?.();
+    }, r);
+    return () => clearTimeout(s);
+  }, [r, e]);
+}
+export {
+  E as disabledEventPropagation,
+  R as isBrowser,
+  x as isNavigator,
+  l as useCallbackRef,
+  m as useFirstRenderState,
+  b as useInfiniteScroll,
+  p as useInterval,
+  c as useLatestRef,
+  C as useNetworkState,
+  T as useShortcuts,
+  d as useTimeout,
+  a as useUpdateEffect
+};
+//# sourceMappingURL=Hooks.js.map

package/lib/Hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hooks.js","sources":["../src/Hooks/index.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\r\n\r\nexport * from './useInfiniteScroll';\r\nexport * from './useNetworkState';\r\nexport * from './useShortcuts';\r\n\r\n/**\r\n * React effect hook that invokes only on update.\r\n * It doesn't invoke on mount\r\n */\r\nexport const useUpdateEffect: typeof useEffect = (effect, deps) => {\r\n  const mounted = useRef(false);\r\n\r\n  useEffect(() => {\r\n    if (mounted.current) {\r\n      return effect();\r\n    }\r\n    mounted.current = true;\r\n    return undefined;\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, deps);\r\n\r\n  return mounted.current;\r\n};\r\n\r\n/**\r\n * React hook to persist any value between renders,\r\n * but keeps it up-to-date if it changes.\r\n *\r\n * @param value the value or function to persist\r\n */\r\nexport function useLatestRef<T>(value: T) {\r\n  const ref = useRef(value);\r\n\r\n  useEffect(() => {\r\n    ref.current = value;\r\n  }, [value]);\r\n\r\n  return ref;\r\n}\r\n\r\n/**\r\n * useCallbackRef hook\r\n *\r\n * A custom hook that converts a callback to a ref to avoid triggering re-renders\r\n * ..when passed as a prop or avoid re-executing effects when passed as a dependency\r\n *\r\n * @param callback The callback to write to a ref object\r\n */\r\nexport const useCallbackRef = <T extends (...args: any[]) => any>(callback: T | undefined): T => {\r\n  const callbackRef = useRef(callback);\r\n\r\n  useEffect(() => {\r\n    callbackRef.current = callback;\r\n  });\r\n\r\n  return useCallback(\r\n    ((...args) => {\r\n      return callbackRef.current?.(...args);\r\n    }) as T,\r\n    []\r\n  );\r\n};\r\n\r\n/**\r\n * useFirstRenderState hook\r\n *\r\n * Returns \"true\" if component is just mounted (first render), else \"false\".\r\n */\r\nexport const useFirstRenderState = (): boolean => {\r\n  const isFirst = useRef(true);\r\n\r\n  if (isFirst.current) {\r\n    isFirst.current = false;\r\n    return true;\r\n  }\r\n\r\n  return isFirst.current;\r\n};\r\n\r\n/**\r\n * React Hook that provides a declarative `setInterval`\r\n *\r\n * @param callback the callback to execute at interval\r\n * @param delay the `setInterval` delay (in ms)\r\n */\r\nexport function useInterval(callback: () => void, delay: number | null) {\r\n  const savedCallback = useLatestRef(callback);\r\n\r\n  useEffect(() => {\r\n    const tick = () => {\r\n      savedCallback.current?.();\r\n    };\r\n    if (delay !== null) {\r\n      const id = setInterval(tick, delay);\r\n      return () => clearInterval(id);\r\n    }\r\n  }, [delay, savedCallback]);\r\n}\r\n\r\n/**\r\n * React hook that provides a declarative `setTimeout`\r\n *\r\n * @param callback the callback to run after specified delay\r\n * @param delay the delay (in ms)\r\n */\r\nexport function useTimeout(callback: Function, delay: number | null) {\r\n  const savedCallback = useLatestRef(callback);\r\n\r\n  useEffect(() => {\r\n    if (delay == null) return;\r\n\r\n    const timeoutId = setTimeout(() => {\r\n      savedCallback.current?.();\r\n    }, delay);\r\n\r\n    return () => clearTimeout(timeoutId);\r\n  }, [delay, savedCallback]);\r\n}\r\n"],"names":["useUpdateEffect","effect","deps","mounted","useRef","useEffect","useLatestRef","value","ref","useCallbackRef","callback","callbackRef","useCallback","args","useFirstRenderState","isFirst","useInterval","delay","savedCallback","tick","id","useTimeout","timeoutId"],"mappings":";;;;AAUO,MAAMA,IAAoC,CAACC,GAAQC,MAAS;AACjE,QAAMC,IAAUC,EAAO,EAAK;AAE5B,SAAAC,EAAU,MAAM;AACd,QAAIF,EAAQ;AACV,aAAOF,EAAA;AAET,IAAAE,EAAQ,UAAU;AAAA,EAGpB,GAAGD,CAAI,GAEAC,EAAQ;AACjB;AAQO,SAASG,EAAgBC,GAAU;AACxC,QAAMC,IAAMJ,EAAOG,CAAK;AAExB,SAAAF,EAAU,MAAM;AACd,IAAAG,EAAI,UAAUD;AAAA,EAChB,GAAG,CAACA,CAAK,CAAC,GAEHC;AACT;AAUO,MAAMC,IAAiB,CAAoCC,MAA+B;AAC/F,QAAMC,IAAcP,EAAOM,CAAQ;AAEnC,SAAAL,EAAU,MAAM;AACd,IAAAM,EAAY,UAAUD;AAAA,EACxB,CAAC,GAEME;AAAA,KACJ,IAAIC,MACIF,EAAY,UAAU,GAAGE,CAAI;AAAA,IAEtC,CAAA;AAAA,EAAC;AAEL,GAOaC,IAAsB,MAAe;AAChD,QAAMC,IAAUX,EAAO,EAAI;AAE3B,SAAIW,EAAQ,WACVA,EAAQ,UAAU,IACX,MAGFA,EAAQ;AACjB;AAQO,SAASC,EAAYN,GAAsBO,GAAsB;AACtE,QAAMC,IAAgBZ,EAAaI,CAAQ;AAE3C,EAAAL,EAAU,MAAM;AACd,UAAMc,IAAO,MAAM;AACjB,MAAAD,EAAc,UAAA;AAAA,IAChB;AACA,QAAID,MAAU,MAAM;AAClB,YAAMG,IAAK,YAAYD,GAAMF,CAAK;AAClC,aAAO,MAAM,cAAcG,CAAE;AAAA,IAC/B;AAAA,EACF,GAAG,CAACH,GAAOC,CAAa,CAAC;AAC3B;AAQO,SAASG,EAAWX,GAAoBO,GAAsB;AACnE,QAAMC,IAAgBZ,EAAaI,CAAQ;AAE3C,EAAAL,EAAU,MAAM;AACd,QAAIY,KAAS,KAAM;AAEnB,UAAMK,IAAY,WAAW,MAAM;AACjC,MAAAJ,EAAc,UAAA;AAAA,IAChB,GAAGD,CAAK;AAER,WAAO,MAAM,aAAaK,CAAS;AAAA,EACrC,GAAG,CAACL,GAAOC,CAAa,CAAC;AAC3B;"}

package/lib/Utilities/ApiUtility.axios.d.ts

@@ -32,9 +32,22 @@ export type DownloadCallback = (status: FileDownloadStatus, error?: any) => void
 export interface IAxiosRequestConfigWithoutParams extends Omit<AxiosRequestConfig, 'params' | 'paramsSerializer'> {
     contentType?: string;
 }
-declare class ApiUtilityBase {
+export interface IApiUtilityConfig {
+    baseURL?: string;
     accessToken?: string;
-    handleError: (error: string, errors?: any) => void;
+    handleError?: (error: string, errors?: any) => void;
+}
+declare class ApiUtilityBase {
+    private config;
+    get accessToken(): string | undefined;
+    set accessToken(token: string | undefined);
+    get handleError(): (error: string, errors?: any) => void;
+    set handleError(handler: (error: string, errors?: any) => void);
+    /**
+     * Configure the API utility with base URL and other options
+     * @param config Configuration object
+     */
+    configure(config: IApiUtilityConfig): void;
     getResponse: <T = any>(endpoint: string, params?: any, options?: IAxiosRequestConfigWithoutParams) => Promise<AxiosResponse<T, any>>;
     get: <T = IApiResponse>(endpoint: string, params?: any, throwErrorOn401?: boolean, options?: IAxiosRequestConfigWithoutParams) => Promise<T>;
     getResult: <T = any>(endpoint: string, params?: any, throwErrorOn401?: boolean, options?: IAxiosRequestConfigWithoutParams) => Promise<T | null>;
@@ -54,7 +67,7 @@ declare class ApiUtilityBase {
     handleAxiosError: <T = IApiResponse>(error: AxiosError, throwErrorOn401?: boolean) => T;
     handleErrorResponse: (message: any, errors?: any) => void;
     _axiosOptions: (options?: IAxiosRequestConfigWithoutParams) => AxiosRequestConfig;
-    getBaseUrl: () => string | undefined;
+    getBaseUrl: () => any;
 }
 export declare const ApiUtility: ApiUtilityBase;
 export {};

package/lib/Utilities/RouteUtils.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import { default as React } from 'react';
 export declare enum FeatureStatus {
     placeholder = 0,
     alpha = 1,

package/lib/Utilities/Utils.d.ts

@@ -1,5 +1,5 @@
 import { Dayjs } from 'dayjs';
-import React from 'react';
+import { default as React } from 'react';
 import { IAddress } from './Types';
 export declare const StorageMessageKey = "ao-message";
 export interface IStorageMessage extends Record<string, any> {

package/lib/Utilities/dayjs.d.ts

@@ -1,14 +1,13 @@
-import dayjsBase from 'dayjs';
-import 'dayjs/locale/en-gb';
-import AdvancedFormat from 'dayjs/plugin/advancedFormat';
-import CustomParseFormat from 'dayjs/plugin/customParseFormat';
-import Duration from 'dayjs/plugin/duration';
-import IsSameOrAfter from 'dayjs/plugin/isSameOrAfter';
-import IsSameOrBefore from 'dayjs/plugin/isSameOrBefore';
-import RelativeTime from 'dayjs/plugin/relativeTime';
-import tz from 'dayjs/plugin/timezone';
-import utc from 'dayjs/plugin/utc';
-import Weekday from 'dayjs/plugin/weekday';
+import { default as dayjsBase } from 'dayjs';
+import { default as AdvancedFormat } from 'dayjs/plugin/advancedFormat';
+import { default as CustomParseFormat } from 'dayjs/plugin/customParseFormat';
+import { default as Duration } from 'dayjs/plugin/duration';
+import { default as IsSameOrAfter } from 'dayjs/plugin/isSameOrAfter';
+import { default as IsSameOrBefore } from 'dayjs/plugin/isSameOrBefore';
+import { default as RelativeTime } from 'dayjs/plugin/relativeTime';
+import { default as tz } from 'dayjs/plugin/timezone';
+import { default as utc } from 'dayjs/plugin/utc';
+import { default as Weekday } from 'dayjs/plugin/weekday';
 declare module 'dayjs' {
     interface Dayjs {
         addWorkdays(amount: number): dayjsBase.Dayjs;

package/lib/Utilities.d.ts

@@ -0,0 +1,2 @@
+export * from './Utilities/index'
+export {}

package/lib/Utilities.js

@@ -0,0 +1,54 @@
+import { ApiUtility as o, FileDownloadStatus as r, HttpMethods as i } from "./src/Utilities/ApiUtility.axios.js";
+import { getBrowserDoNotTrackStatus as s, getBrowserPluginsAsString as a, getDeviceLocalIPAsString as g, getScreenColourDepth as m, getScreenHeight as p, getScreenScalingFactor as l, getScreenWidth as u, getTimezone as d, getUserAgent as f, getWindowHeight as S, getWindowWidth as c, resetDeviceIpString as x, resetDeviceIpTimeStamp as D } from "./src/Utilities/BrowserInfo.js";
+import { AllCountries as w, getCountries as y, getCountryByPhoneNumber as A, getCountryOptions as C } from "./src/Utilities/Countries.js";
+import { CustomEventEmitter as H } from "./src/Utilities/CustomEventEmitter.js";
+import { d as T } from "./dayjs-aKjfjjRl.mjs";
+import { fastCompare as I } from "./src/Utilities/FastCompare.js";
+import { HideablePromise as U } from "./src/Utilities/HideablePromise.js";
+import { LoadScript as B } from "./src/Utilities/LoadScripts.js";
+import { fraudPreventionHeadersEnum as M, getFraudPreventionHeaders as O, getScreenDetails as b, windowDetails as L } from "./src/Utilities/MTDFraudPrevention.js";
+import { AllNationalities as Z, getNationalityOptions as j } from "./src/Utilities/Nationalities.js";
+import { FeatureStatus as z, RouteUtils as K } from "./src/Utilities/RouteUtils.js";
+import { AllTimeZones as G, getTimeZoneOptions as J } from "./src/Utilities/TimeZones.js";
+import { StorageMessageKey as V, Utils as X, useIsMountedRef as Y } from "./src/Utilities/Utils.js";
+export {
+  w as AllCountries,
+  Z as AllNationalities,
+  G as AllTimeZones,
+  o as ApiUtility,
+  H as CustomEventEmitter,
+  z as FeatureStatus,
+  r as FileDownloadStatus,
+  U as HideablePromise,
+  i as HttpMethods,
+  B as LoadScript,
+  K as RouteUtils,
+  V as StorageMessageKey,
+  X as Utils,
+  T as dayjs,
+  I as fastCompare,
+  M as fraudPreventionHeadersEnum,
+  s as getBrowserDoNotTrackStatus,
+  a as getBrowserPluginsAsString,
+  y as getCountries,
+  A as getCountryByPhoneNumber,
+  C as getCountryOptions,
+  g as getDeviceLocalIPAsString,
+  O as getFraudPreventionHeaders,
+  j as getNationalityOptions,
+  m as getScreenColourDepth,
+  b as getScreenDetails,
+  p as getScreenHeight,
+  l as getScreenScalingFactor,
+  u as getScreenWidth,
+  J as getTimeZoneOptions,
+  d as getTimezone,
+  f as getUserAgent,
+  S as getWindowHeight,
+  c as getWindowWidth,
+  x as resetDeviceIpString,
+  D as resetDeviceIpTimeStamp,
+  Y as useIsMountedRef,
+  L as windowDetails
+};
+//# sourceMappingURL=Utilities.js.map

package/lib/Utilities.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Utilities.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}