@adiba-banking-cloud/backoffice 0.0.106 → 0.2.1

package/build/index.cjs.js/{heatmap-BJmii0aO.js → heatmap-D-qDlLOI.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BLpjQkzt.js');
+var index = require('./index-CWyl7EKZ.js');
 
 function _mergeNamespaces(n, m) {
 	m.forEach(function (e) {

package/build/index.cjs.js/{index-BLpjQkzt.js → index-CWyl7EKZ.js}

@@ -19,6 +19,11 @@ require('@fontsource/poppins/500.css');
 require('@fontsource/poppins/600.css');
 require('@fontsource/poppins/700.css');
 require('@fontsource/poppins/800.css');
+var axios = require('axios');
+var dates = require('@mantine/dates');
+require('@mantine/dates/styles.css');
+var reactQuery = require('@tanstack/react-query');
+var reactQueryDevtools = require('@tanstack/react-query-devtools');
 
 function _interopNamespaceDefault(e) {
 	var n = Object.create(null);
@@ -52,6 +57,7 @@ function _mergeNamespaces(n, m) {
 	return Object.freeze(n);
 }
 
+var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 var IconSax__namespace = /*#__PURE__*/_interopNamespaceDefault(IconSax);
 
 function getDefaultExportFromCjs (x) {
@@ -12166,7 +12172,7 @@ const initChart$1 = props => {
   }
 
   // Fallback: use dynamic import (async, but will work in Vite/Storybook)
-  Promise.resolve().then(function () { return require('./heatmap-BJmii0aO.js'); }).then(function (n) { return n.heatmap; }).then(heatmapModule => {
+  Promise.resolve().then(function () { return require('./heatmap-D-qDlLOI.js'); }).then(function (n) { return n.heatmap; }).then(heatmapModule => {
     const moduleFn = typeof heatmapModule === "function" ? heatmapModule : heatmapModule?.default || heatmapModule;
     if (typeof moduleFn === "function") {
       moduleFn(Highcharts);
@@ -14426,12 +14432,317 @@ const useManagedModals = () => {
   };
 };
 
+/**
+ * Default pagination page size
+ */
+const DEFAULT_PAGE_SIZE = 10;
+
+/**
+ * Maximum allowed page size for pagination
+ */
+const MAX_PAGE_SIZE = 100;
+
+/**
+ * Default API request timeout in milliseconds
+ */
+const DEFAULT_API_TIMEOUT = 30000;
+
+/**
+ * Configuration for URL filter hook
+ */
+
+/**
+ * Return type for useUrlFilters hook
+ */
+
+/**
+ * Generic hook for managing URL-based filters with pagination
+ *
+ * @example
+ * ```tsx
+ * interface MyFilters {
+ *   page: number;
+ *   limit: number;
+ *   name?: string;
+ *   status?: string;
+ * }
+ *
+ * const { filters, updateFilters, clearFilters } = useUrlFilters<MyFilters>({
+ *   parseFilters: (params) => ({
+ *     page: parseInt(params.get('page') || '1', 10),
+ *     limit: parseInt(params.get('limit') || '10', 10),
+ *     name: params.get('name') || undefined,
+ *     status: params.get('status') || undefined,
+ *   }),
+ *   serializeFilters: (filters, params) => {
+ *     if (filters.page) params.set('page', String(filters.page));
+ *     if (filters.limit) params.set('limit', String(filters.limit));
+ *     if (filters.name) params.set('name', filters.name);
+ *     if (filters.status) params.set('status', filters.status);
+ *   },
+ * });
+ * ```
+ */
+function useUrlFilters(options) {
+  const {
+    defaultPageSize = DEFAULT_PAGE_SIZE,
+    parseFilters,
+    serializeFilters,
+    hasActiveFilters: checkActiveFilters,
+    toApiParams
+  } = options;
+  const [searchParams, setSearchParams] = reactRouterDom.useSearchParams();
+  const filters = React.useMemo(() => {
+    const parsed = parseFilters(searchParams);
+
+    // Ensure page and limit are always present with valid defaults
+    const page = typeof parsed.page === "number" && parsed.page > 0 ? parsed.page : 1;
+    const limit = typeof parsed.limit === "number" && parsed.limit > 0 ? parsed.limit : defaultPageSize;
+    return {
+      ...parsed,
+      page,
+      limit
+    };
+  }, [searchParams, parseFilters, defaultPageSize]);
+  const updateFilters = newFilters => {
+    const params = new URLSearchParams(searchParams);
+
+    // Merge new filters with existing filters
+    const mergedFilters = {
+      ...filters,
+      ...newFilters
+    };
+
+    // Determine if we should reset page to 1
+    // Reset if: page is not explicitly set AND other filters are changing
+    const hasNonPaginationChanges = Object.keys(newFilters).some(key => key !== "page" && key !== "limit");
+    if (newFilters.page === undefined && hasNonPaginationChanges) {
+      mergedFilters.page = 1; // Reset to page 1
+    }
+
+    // Ensure page and limit are numbers
+    if (typeof mergedFilters.page !== "number" || mergedFilters.page < 1) {
+      mergedFilters.page = 1;
+    }
+    if (typeof mergedFilters.limit !== "number" || mergedFilters.limit < 1) {
+      mergedFilters.limit = defaultPageSize;
+    }
+
+    // Serialize all filters
+    serializeFilters(mergedFilters, params);
+    setSearchParams(params, {
+      replace: true
+    });
+  };
+  const clearFilters = () => {
+    const params = new URLSearchParams();
+    params.set("page", "1");
+    params.set("limit", String(defaultPageSize));
+    setSearchParams(params, {
+      replace: true
+    });
+  };
+  const hasActiveFilters = React.useMemo(() => {
+    if (checkActiveFilters) {
+      return checkActiveFilters(filters);
+    }
+    // Default: check if any non-pagination fields have values
+    return Object.keys(filters).some(key => {
+      if (key === "page" || key === "limit") return false;
+      const value = filters[key];
+      return value !== undefined && value !== null && value !== "";
+    });
+  }, [filters, checkActiveFilters]);
+  const apiParams = React.useMemo(() => {
+    if (toApiParams) {
+      return toApiParams(filters);
+    }
+    return undefined;
+  }, [filters, toApiParams]);
+  return {
+    filters,
+    updateFilters,
+    clearFilters,
+    hasActiveFilters,
+    apiParams
+  };
+}
+
+class ApiClient {
+  constructor(config) {
+    const {
+      baseURL = "/",
+      timeout = DEFAULT_API_TIMEOUT,
+      headers = {
+        "Content-Type": "application/json"
+      }
+    } = config;
+    this.client = axios.create({
+      baseURL,
+      timeout,
+      headers
+    });
+    this.setupInterceptors();
+  }
+  setupInterceptors() {
+    // Request interceptor
+    this.client.interceptors.request.use(config => {
+      // Add auth token, logging, etc. if needed
+      return config;
+    }, error => Promise.reject(error));
+
+    // Response interceptor
+    this.client.interceptors.response.use(response => {
+      return response;
+    }, error => {
+      // Handle errors globally
+      return Promise.reject(this.handleError(error));
+    });
+  }
+  handleError(error) {
+    if (error && typeof error === "object" && "response" in error) {
+      const axiosError = error;
+      if (axiosError.response) {
+        return {
+          status: "error",
+          code: axiosError.response.status,
+          message: axiosError.response.data?.message || "An error occurred",
+          error: axiosError.response.data?.error || axiosError.message || "An unexpected error occurred"
+        };
+      }
+    }
+    const errorMessage = error instanceof Error ? error.message : "An unexpected error occurred";
+    return {
+      status: "error",
+      code: 500,
+      message: "Network error",
+      error: errorMessage
+    };
+  }
+  async get(url, config) {
+    const response = await this.client.get(url, config);
+    return response.data;
+  }
+  async post(url, data, config) {
+    const response = await this.client.post(url, data, config);
+    return response.data;
+  }
+  async put(url, data, config) {
+    const response = await this.client.put(url, data, config);
+    return response.data;
+  }
+  async delete(url, config) {
+    const response = await this.client.delete(url, config);
+    return response.data;
+  }
+}
+
+/**
+ * Factory function to create a configured API client instance
+ * @param config - Configuration options for the API client
+ * @returns Configured ApiClient instance
+ */
+function createApiClient() {
+  let config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return new ApiClient(config);
+}
+
+/**
+ * Default API client instance with default configuration
+ * For custom configuration, use createApiClient() instead
+ */
+const apiClient = createApiClient();
+
+/**
+ * Wrapper component for modal content to ensure MantineProvider context is available
+ * This is needed because modals rendered by the appshell may not have access to the pilet's provider
+ */
+const ModalContentWrapper = _ref => {
+  let {
+    children
+  } = _ref;
+  return /*#__PURE__*/React__namespace.createElement(core.MantineProvider, {
+    theme: theme
+  }, /*#__PURE__*/React__namespace.createElement(dates.DatesProvider, {
+    settings: {
+      locale: "en",
+      timezone: "UTC"
+    }
+  }, children));
+};
+
+/**
+ * Default QueryClient configuration
+ */
+const defaultQueryClient = new reactQuery.QueryClient({
+  defaultOptions: {
+    queries: {
+      retry: 1,
+      refetchOnWindowFocus: false,
+      staleTime: 30000,
+      // 30 seconds
+      gcTime: 5 * 60 * 1000 // 5 minutes
+    },
+    mutations: {
+      retry: false
+    }
+  }
+});
+/**
+ * Higher-order component that wraps a component with all necessary providers:
+ * - QueryClientProvider (React Query)
+ * - MantineProvider (Mantine UI)
+ * - DatesProvider (Mantine Dates)
+ *
+ * @param Component - Component to wrap
+ * @param options - Optional configuration
+ * @returns Wrapped component with all providers
+ *
+ * @example
+ * ```tsx
+ * // Using default configuration
+ * const WrappedComponent = withProviders(MyComponent);
+ *
+ * // Using custom QueryClient
+ * const customQueryClient = new QueryClient({ ... });
+ * const WrappedComponent = withProviders(MyComponent, {
+ *   queryClient: customQueryClient,
+ * });
+ * ```
+ */
+function withProviders(Component) {
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  const {
+    queryClient = defaultQueryClient,
+    enableDevtools = true,
+    theme: customTheme = theme,
+    datesSettings = {
+      locale: "en",
+      timezone: "UTC"
+    }
+  } = options;
+  const WrappedComponent = props => {
+    const showDevtools = enableDevtools && typeof process !== "undefined" && process.env?.NODE_ENV === "development";
+    return /*#__PURE__*/React__namespace.createElement(reactQuery.QueryClientProvider, {
+      client: queryClient
+    }, /*#__PURE__*/React__namespace.createElement(core.MantineProvider, {
+      theme: customTheme
+    }, /*#__PURE__*/React__namespace.createElement(dates.DatesProvider, {
+      settings: datesSettings
+    }, /*#__PURE__*/React__namespace.createElement(Component, props), showDevtools && /*#__PURE__*/React__namespace.createElement(reactQueryDevtools.ReactQueryDevtools, null))));
+  };
+  WrappedComponent.displayName = `withProviders(${Component.displayName || Component.name || "Component"})`;
+  return WrappedComponent;
+}
+
 exports.ApplicationMenu = ApplicationMenu;
 exports.ApplicationPanel = ApplicationPanel;
 exports.AvatarLabelPanel = AvatarLabelPanel;
 exports.BasicHeatmap = BasicHeatmap;
 exports.CalendarHeatmap = CalendarHeatmap;
 exports.ConnectionPanel = ConnectionPanel;
+exports.DEFAULT_API_TIMEOUT = DEFAULT_API_TIMEOUT;
+exports.DEFAULT_PAGE_SIZE = DEFAULT_PAGE_SIZE;
 exports.DonutChart = DonutChart;
 exports.Drawer = Drawer;
 exports.DynamicLogo = DynamicLogo;
@@ -14443,7 +14754,9 @@ exports.Icons = Icons;
 exports.InfoModal = InfoModal;
 exports.InterpolatedHeatmap = InterpolatedHeatmap;
 exports.LabelPanel = LabelPanel;
+exports.MAX_PAGE_SIZE = MAX_PAGE_SIZE;
 exports.MaskedTilePanel = MaskedTilePanel;
+exports.ModalContentWrapper = ModalContentWrapper;
 exports.MultiAxisArea = MultiAxisArea;
 exports.PageTitle = PageTitle;
 exports.PaymentMethod = PaymentMethod;
@@ -14466,7 +14779,11 @@ exports.TitleWithIndex = TitleWithIndex;
 exports.TitledPanel = TitledPanel;
 exports.TwoFactorModal = TwoFactorModal;
 exports.UserMenu = UserMenu;
+exports.apiClient = apiClient;
+exports.createApiClient = createApiClient;
 exports.getDefaultExportFromCjs = getDefaultExportFromCjs;
 exports.theme = theme;
 exports.useManagedModals = useManagedModals;
 exports.useModal = useModal;
+exports.useUrlFilters = useUrlFilters;
+exports.withProviders = withProviders;

package/build/index.cjs.js/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BLpjQkzt.js');
+var index = require('./index-CWyl7EKZ.js');
 require('@mantine/modals');
 require('react');
 require('@mantine/core');
@@ -20,6 +20,11 @@ require('@fontsource/poppins/500.css');
 require('@fontsource/poppins/600.css');
 require('@fontsource/poppins/700.css');
 require('@fontsource/poppins/800.css');
+require('axios');
+require('@mantine/dates');
+require('@mantine/dates/styles.css');
+require('@tanstack/react-query');
+require('@tanstack/react-query-devtools');
 
 
 
@@ -29,6 +34,8 @@ exports.AvatarLabelPanel = index.AvatarLabelPanel;
 exports.BasicHeatmap = index.BasicHeatmap;
 exports.CalendarHeatmap = index.CalendarHeatmap;
 exports.ConnectionPanel = index.ConnectionPanel;
+exports.DEFAULT_API_TIMEOUT = index.DEFAULT_API_TIMEOUT;
+exports.DEFAULT_PAGE_SIZE = index.DEFAULT_PAGE_SIZE;
 exports.DonutChart = index.DonutChart;
 exports.Drawer = index.Drawer;
 exports.DynamicLogo = index.DynamicLogo;
@@ -40,7 +47,9 @@ exports.Icons = index.Icons;
 exports.InfoModal = index.InfoModal;
 exports.InterpolatedHeatmap = index.InterpolatedHeatmap;
 exports.LabelPanel = index.LabelPanel;
+exports.MAX_PAGE_SIZE = index.MAX_PAGE_SIZE;
 exports.MaskedTilePanel = index.MaskedTilePanel;
+exports.ModalContentWrapper = index.ModalContentWrapper;
 exports.MultiAxisArea = index.MultiAxisArea;
 exports.PageTitle = index.PageTitle;
 exports.PaymentMethod = index.PaymentMethod;
@@ -63,6 +72,10 @@ exports.TitleWithIndex = index.TitleWithIndex;
 exports.TitledPanel = index.TitledPanel;
 exports.TwoFactorModal = index.TwoFactorModal;
 exports.UserMenu = index.UserMenu;
+exports.apiClient = index.apiClient;
+exports.createApiClient = index.createApiClient;
 exports.theme = index.theme;
 exports.useManagedModals = index.useManagedModals;
 exports.useModal = index.useModal;
+exports.useUrlFilters = index.useUrlFilters;
+exports.withProviders = index.withProviders;

package/build/index.esm.js/{heatmap-yNnNxsAY.js → heatmap-CtdCSRhG.js}

@@ -1,4 +1,4 @@
-import { g as getDefaultExportFromCjs } from './index-CWjYoFnK.js';
+import { g as getDefaultExportFromCjs } from './index-D7Cza3cb.js';
 
 function _mergeNamespaces(n, m) {
 	m.forEach(function (e) {