@inceptionbg/iui 2.0.24 → 2.0.26

package/src/components/Table/hooks/useTablePagination.ts

@@ -1,19 +1,19 @@
-import type { IPagination, IPaginationControl } from '../../../types/ITable';
-import { useMemo, useState } from 'react';
-
-export const useTablePagination = (defaultLimit: number = 5) => {
-  const [limit, setLimit] = useState(defaultLimit);
-  const [offset, setOffset] = useState(0);
-
-  const pagination: IPagination = useMemo(() => ({ limit, offset }), [limit, offset]);
-  const paginationControl: IPaginationControl = useMemo(
-    () => ({
-      ...pagination,
-      setLimit,
-      setOffset,
-    }),
-    [pagination]
-  );
-
-  return { pagination, paginationControl };
-};
+import type { IPagination, IPaginationControl } from '../../../types/ITable';
+import { useMemo, useState } from 'react';
+
+export const useTablePagination = (defaultLimit: number = 5) => {
+  const [limit, setLimit] = useState(defaultLimit);
+  const [offset, setOffset] = useState(0);
+
+  const pagination: IPagination = useMemo(() => ({ limit, offset }), [limit, offset]);
+  const paginationControl: IPaginationControl = useMemo(
+    () => ({
+      ...pagination,
+      setLimit,
+      setOffset,
+    }),
+    [pagination]
+  );
+
+  return { pagination, paginationControl };
+};

package/src/components/Table/hooks/useTablePrint.ts

@@ -1,83 +1,83 @@
-import type { IGetPrintData, IPrintData, ITableDataItem } from '../../../types/ITable';
-import { useEffect, useMemo, useState } from 'react';
-import { usePopupControl } from '../../../hooks/usePopupControl';
-
-type Props<T> = {
-  getPrintData: IGetPrintData<T>;
-  createTableData?: (data: T[]) => ITableDataItem<T>[];
-  totalRows?: number;
-};
-
-const limit = 1000;
-const defaultData = { items: [], totalRows: 0 };
-
-export const useTablePrint = <T>({
-  getPrintData,
-  createTableData,
-  totalRows: initialTotalRows = 0,
-}: Props<T>) => {
-  const printPopupControl = usePopupControl();
-
-  const [data, setData] = useState<{ items: T[]; totalRows: number }>(defaultData);
-  const [offset, setOffset] = useState(0);
-  const [isLoading, setIsLoading] = useState(false);
-
-  useEffect(() => {
-    if (printPopupControl.control.isOpen) {
-      setIsLoading(true);
-      setOffset(0);
-    }
-    return () => {
-      setIsLoading(false);
-      setData(defaultData);
-      setOffset(0);
-    };
-  }, [printPopupControl.control.isOpen]);
-
-  useEffect(() => {
-    if (printPopupControl.control.isOpen) {
-      getPrintData({
-        pagination: { limit, offset },
-        noTotalRows: !!initialTotalRows || offset > 0,
-      })
-        .then(({ items, totalRows: newTotalRows }) => {
-          setData(prevState => {
-            const newData = offset === 0 ? items : prevState.items.concat(items);
-            const totalRows =
-              newTotalRows || initialTotalRows || prevState.totalRows || 0;
-
-            if (items?.length === limit) {
-              setOffset(offset => offset + 1);
-            } else {
-              setIsLoading(false);
-            }
-
-            return { items: newData, totalRows };
-          });
-        })
-        .catch(() => setIsLoading(false));
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [printPopupControl.control.isOpen, initialTotalRows, offset]);
-
-  const loaded = data.items?.length;
-  const progress = data.totalRows ? (loaded / data.totalRows) * 100 : 0;
-
-  const tableData = useMemo(
-    () => (!isLoading ? (createTableData?.(data.items) ?? []) : []),
-    [isLoading, data.items, createTableData]
-  );
-
-  const printData: Pick<
-    IPrintData<T>,
-    'tableData' | 'printPopupControl' | 'isLoading' | 'progress' | 'items'
-  > = {
-    tableData,
-    printPopupControl,
-    isLoading,
-    progress,
-    items: data.items ?? [],
-  };
-
-  return printData;
-};
+import type { IGetPrintData, IPrintData, ITableDataItem } from '../../../types/ITable';
+import { useEffect, useMemo, useState } from 'react';
+import { usePopupControl } from '../../../hooks/usePopupControl';
+
+type Props<T> = {
+  getPrintData: IGetPrintData<T>;
+  createTableData?: (data: T[]) => ITableDataItem<T>[];
+  totalRows?: number;
+};
+
+const limit = 1000;
+const defaultData = { items: [], totalRows: 0 };
+
+export const useTablePrint = <T>({
+  getPrintData,
+  createTableData,
+  totalRows: initialTotalRows = 0,
+}: Props<T>) => {
+  const printPopupControl = usePopupControl();
+
+  const [data, setData] = useState<{ items: T[]; totalRows: number }>(defaultData);
+  const [offset, setOffset] = useState(0);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    if (printPopupControl.control.isOpen) {
+      setIsLoading(true);
+      setOffset(0);
+    }
+    return () => {
+      setIsLoading(false);
+      setData(defaultData);
+      setOffset(0);
+    };
+  }, [printPopupControl.control.isOpen]);
+
+  useEffect(() => {
+    if (printPopupControl.control.isOpen) {
+      getPrintData({
+        pagination: { limit, offset },
+        noTotalRows: !!initialTotalRows || offset > 0,
+      })
+        .then(({ items, totalRows: newTotalRows }) => {
+          setData(prevState => {
+            const newData = offset === 0 ? items : prevState.items.concat(items);
+            const totalRows =
+              newTotalRows || initialTotalRows || prevState.totalRows || 0;
+
+            if (items?.length === limit) {
+              setOffset(offset => offset + 1);
+            } else {
+              setIsLoading(false);
+            }
+
+            return { items: newData, totalRows };
+          });
+        })
+        .catch(() => setIsLoading(false));
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [printPopupControl.control.isOpen, initialTotalRows, offset]);
+
+  const loaded = data.items?.length;
+  const progress = data.totalRows ? (loaded / data.totalRows) * 100 : 0;
+
+  const tableData = useMemo(
+    () => (!isLoading ? (createTableData?.(data.items) ?? []) : []),
+    [isLoading, data.items, createTableData]
+  );
+
+  const printData: Pick<
+    IPrintData<T>,
+    'tableData' | 'printPopupControl' | 'isLoading' | 'progress' | 'items'
+  > = {
+    tableData,
+    printPopupControl,
+    isLoading,
+    progress,
+    items: data.items ?? [],
+  };
+
+  return printData;
+};

package/src/components/Table/hooks/useTableSearch.ts

@@ -1,31 +1,31 @@
-import type { Dispatch, SetStateAction } from 'react';
-import { useState } from 'react';
-import { deletePropsThatEndsWith } from '../../../utils/objectUtils';
-
-export interface ITableSearchProps<T> {
-  setOffset: Dispatch<SetStateAction<number>>;
-  resetSelectedRows?: () => void;
-  defaultSearch?: T;
-}
-
-export const useTableSearch = <T>({
-  setOffset,
-  resetSelectedRows,
-  defaultSearch = {} as T,
-}: ITableSearchProps<T>) => {
-  const [search, setSearch] = useState<T>(defaultSearch);
-  const [searchData, setSearchData] = useState<T>(defaultSearch);
-
-  const onSearch = (filters: T) => {
-    setOffset(0);
-    resetSelectedRows?.();
-    setSearch(<T>deletePropsThatEndsWith(filters, 'Obj'));
-  };
-
-  return {
-    search,
-    searchData,
-    setSearchData,
-    onSearch,
-  };
-};
+import type { Dispatch, SetStateAction } from 'react';
+import { useState } from 'react';
+import { deletePropsThatEndsWith } from '../../../utils/objectUtils';
+
+export interface ITableSearchProps<T> {
+  setOffset: Dispatch<SetStateAction<number>>;
+  resetSelectedRows?: () => void;
+  defaultSearch?: T;
+}
+
+export const useTableSearch = <T>({
+  setOffset,
+  resetSelectedRows,
+  defaultSearch = {} as T,
+}: ITableSearchProps<T>) => {
+  const [search, setSearch] = useState<T>(defaultSearch);
+  const [searchData, setSearchData] = useState<T>(defaultSearch);
+
+  const onSearch = (filters: T) => {
+    setOffset(0);
+    resetSelectedRows?.();
+    setSearch(<T>deletePropsThatEndsWith(filters, 'Obj'));
+  };
+
+  return {
+    search,
+    searchData,
+    setSearchData,
+    onSearch,
+  };
+};

package/src/components/Table/hooks/useTableSelect.ts

@@ -1,19 +1,19 @@
-import type { ITableSelectedAction } from '../../../types/ITable';
-import { useMemo, useState } from 'react';
-
-export const useTableSelect = (actions: ITableSelectedAction[] = []) => {
-  const [selectedRows, setSelectedRows] = useState(new Set<string>());
-
-  const rowSelect = useMemo(
-    () => ({
-      selectedRows,
-      setSelectedRows,
-      resetSelectedRows: () => setSelectedRows(new Set<string>()),
-      actions,
-    }),
-    // eslint-disable-next-line
-    [selectedRows]
-  );
-
-  return rowSelect;
-};
+import type { ITableSelectedAction } from '../../../types/ITable';
+import { useMemo, useState } from 'react';
+
+export const useTableSelect = (actions: ITableSelectedAction[] = []) => {
+  const [selectedRows, setSelectedRows] = useState(new Set<string>());
+
+  const rowSelect = useMemo(
+    () => ({
+      selectedRows,
+      setSelectedRows,
+      resetSelectedRows: () => setSelectedRows(new Set<string>()),
+      actions,
+    }),
+    // eslint-disable-next-line
+    [selectedRows]
+  );
+
+  return rowSelect;
+};

package/src/components/Table/hooks/useTableSort.ts

@@ -1,8 +1,8 @@
-import type { ITableSort } from '../../../types/ITable';
-import { useState } from 'react';
-
-export const useTableSort = (sortOptions: ITableSort[]) => {
-  const [sort, setSort] = useState('');
-
-  return { sort, setSort, sortOptions };
-};
+import type { ITableSort } from '../../../types/ITable';
+import { useState } from 'react';
+
+export const useTableSort = (sortOptions: ITableSort[]) => {
+  const [sort, setSort] = useState('');
+
+  return { sort, setSort, sortOptions };
+};

package/src/components/Tabs/Tabs.tsx

@@ -1,68 +1,68 @@
-import type { FC } from 'react';
-import type { ITab } from '../../types/ITab';
-import { useMemo, useState } from 'react';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import clsx from 'clsx';
-
-interface Props {
-  tabs: ITab[];
-  initialValue?: string;
-  control?: {
-    value: string;
-    setValue: (value: string) => void;
-  };
-  onChange?: (value: string) => void;
-  noWrap?: boolean;
-  className?: string;
-  classNameContent?: string;
-}
-
-export const Tabs: FC<Props> = ({
-  tabs,
-  initialValue,
-  control,
-  onChange,
-  noWrap,
-  className,
-  classNameContent,
-}) => {
-  const filteredTabs = useMemo(() => tabs.filter(e => !e.hidden), [tabs]);
-
-  const [selected, setSelected] = useState(initialValue || filteredTabs[0]?.value || '');
-
-  const activeTab = filteredTabs.find(tab => (control?.value ?? selected) === tab.value);
-
-  return filteredTabs.length > 0 ? (
-    <div className={className}>
-      <div className="iui-tabs">
-        {filteredTabs.map(tab => (
-          <div
-            id={tab.value}
-            key={tab.value}
-            className={clsx('iui-tab clickable', {
-              selected: (control?.value ?? selected) === tab.value,
-              disabled: tab.disabled,
-              'no-wrap': noWrap,
-            })}
-            onClick={
-              tab.disabled
-                ? undefined
-                : () => {
-                    !!control ? control.setValue(tab.value) : setSelected(tab.value);
-                    onChange?.(tab.value);
-                  }
-            }
-          >
-            {tab.icon && <FontAwesomeIcon icon={tab.icon} />}
-            {tab.label}
-          </div>
-        ))}
-      </div>
-      {activeTab && (
-        <div key={activeTab.value} className={clsx('iui-tab-content', classNameContent)}>
-          {activeTab.component}
-        </div>
-      )}
-    </div>
-  ) : null;
-};
+import type { FC } from 'react';
+import type { ITab } from '../../types/ITab';
+import { useMemo, useState } from 'react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import clsx from 'clsx';
+
+interface Props {
+  tabs: ITab[];
+  initialValue?: string;
+  control?: {
+    value: string;
+    setValue: (value: string) => void;
+  };
+  onChange?: (value: string) => void;
+  noWrap?: boolean;
+  className?: string;
+  classNameContent?: string;
+}
+
+export const Tabs: FC<Props> = ({
+  tabs,
+  initialValue,
+  control,
+  onChange,
+  noWrap,
+  className,
+  classNameContent,
+}) => {
+  const filteredTabs = useMemo(() => tabs.filter(e => !e.hidden), [tabs]);
+
+  const [selected, setSelected] = useState(initialValue || filteredTabs[0]?.value || '');
+
+  const activeTab = filteredTabs.find(tab => (control?.value ?? selected) === tab.value);
+
+  return filteredTabs.length > 0 ? (
+    <div className={className}>
+      <div className="iui-tabs">
+        {filteredTabs.map(tab => (
+          <div
+            id={tab.value}
+            key={tab.value}
+            className={clsx('iui-tab clickable', {
+              selected: (control?.value ?? selected) === tab.value,
+              disabled: tab.disabled,
+              'no-wrap': noWrap,
+            })}
+            onClick={
+              tab.disabled
+                ? undefined
+                : () => {
+                    !!control ? control.setValue(tab.value) : setSelected(tab.value);
+                    onChange?.(tab.value);
+                  }
+            }
+          >
+            {tab.icon && <FontAwesomeIcon icon={tab.icon} />}
+            {tab.label}
+          </div>
+        ))}
+      </div>
+      {activeTab && (
+        <div key={activeTab.value} className={clsx('iui-tab-content', classNameContent)}>
+          {activeTab.component}
+        </div>
+      )}
+    </div>
+  ) : null;
+};