@admin-layout/tailwind-ui 10.0.9-alpha.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +297 -0
- package/lib/components/ErrorHandlers/ApplicationErrorHandler.d.ts +2 -0
- package/lib/components/ErrorHandlers/ApplicationErrorHandler.d.ts.map +1 -0
- package/lib/components/ErrorHandlers/ApplicationErrorHandler.js +24 -0
- package/lib/components/ErrorHandlers/ApplicationErrorHandler.js.map +1 -0
- package/lib/components/ErrorHandlers/ErrorBoundary.d.ts +2 -0
- package/lib/components/ErrorHandlers/ErrorBoundary.d.ts.map +1 -0
- package/lib/components/ErrorHandlers/ErrorBoundary.js +48 -0
- package/lib/components/ErrorHandlers/ErrorBoundary.js.map +1 -0
- package/lib/components/ErrorHandlers/LayoutErrorBoundary.d.ts +2 -0
- package/lib/components/ErrorHandlers/LayoutErrorBoundary.d.ts.map +1 -0
- package/lib/components/ErrorHandlers/LayoutErrorBoundary.js +34 -0
- package/lib/components/ErrorHandlers/LayoutErrorBoundary.js.map +1 -0
- package/lib/components/ErrorHandlers/index.d.ts +4 -0
- package/lib/components/ErrorHandlers/index.d.ts.map +1 -0
- package/lib/components/ErrorPages/403.d.ts +2 -0
- package/lib/components/ErrorPages/403.d.ts.map +1 -0
- package/lib/components/ErrorPages/403.js +29 -0
- package/lib/components/ErrorPages/403.js.map +1 -0
- package/lib/components/ErrorPages/404.d.ts +2 -0
- package/lib/components/ErrorPages/404.d.ts.map +1 -0
- package/lib/components/ErrorPages/404.js +29 -0
- package/lib/components/ErrorPages/404.js.map +1 -0
- package/lib/components/ErrorPages/500.d.ts +2 -0
- package/lib/components/ErrorPages/500.d.ts.map +1 -0
- package/lib/components/ErrorPages/500.js +29 -0
- package/lib/components/ErrorPages/500.js.map +1 -0
- package/lib/components/ErrorPages/index.d.ts +4 -0
- package/lib/components/ErrorPages/index.d.ts.map +1 -0
- package/lib/components/OTP/OTPInput.d.ts +4 -0
- package/lib/components/OTP/OTPInput.d.ts.map +1 -0
- package/lib/components/OTP/OTPInput.js +82 -0
- package/lib/components/OTP/OTPInput.js.map +1 -0
- package/lib/components/OTP/OTPVerification.d.ts +4 -0
- package/lib/components/OTP/OTPVerification.d.ts.map +1 -0
- package/lib/components/OTP/OTPVerification.js +155 -0
- package/lib/components/OTP/OTPVerification.js.map +1 -0
- package/lib/components/OTP/SingleInput.d.ts +10 -0
- package/lib/components/OTP/SingleInput.d.ts.map +1 -0
- package/lib/components/OTP/SingleInput.js +43 -0
- package/lib/components/OTP/SingleInput.js.map +1 -0
- package/lib/components/OTP/hooks.d.ts +3 -0
- package/lib/components/OTP/hooks.d.ts.map +1 -0
- package/lib/components/OTP/hooks.js +95 -0
- package/lib/components/OTP/hooks.js.map +1 -0
- package/lib/components/OTP/index.d.ts +6 -0
- package/lib/components/OTP/index.d.ts.map +1 -0
- package/lib/components/OTP/types.d.ts +110 -0
- package/lib/components/OTP/types.d.ts.map +1 -0
- package/lib/components/OTP/utils.d.ts +26 -0
- package/lib/components/OTP/utils.d.ts.map +1 -0
- package/lib/components/OTP/utils.js +36 -0
- package/lib/components/OTP/utils.js.map +1 -0
- package/lib/components/PageContainer/PageContainer.d.ts +4 -0
- package/lib/components/PageContainer/PageContainer.d.ts.map +1 -0
- package/lib/components/PageContainer/PageContainer.js +57 -0
- package/lib/components/PageContainer/PageContainer.js.map +1 -0
- package/lib/components/PageContainer/index.d.ts +2 -0
- package/lib/components/PageContainer/index.d.ts.map +1 -0
- package/lib/components/PageContainer/types.d.ts +51 -0
- package/lib/components/PageContainer/types.d.ts.map +1 -0
- package/lib/components/PageLoading/index.d.ts +6 -0
- package/lib/components/PageLoading/index.d.ts.map +1 -0
- package/lib/components/PageLoading/index.js +9 -0
- package/lib/components/PageLoading/index.js.map +1 -0
- package/lib/components/ReactTable/Table.d.ts +18 -0
- package/lib/components/ReactTable/Table.d.ts.map +1 -0
- package/lib/components/ReactTable/Table.js +151 -0
- package/lib/components/ReactTable/Table.js.map +1 -0
- package/lib/components/ReactTable/TableFilters.d.ts +8 -0
- package/lib/components/ReactTable/TableFilters.d.ts.map +1 -0
- package/lib/components/ReactTable/TableFilters.js +58 -0
- package/lib/components/ReactTable/TableFilters.js.map +1 -0
- package/lib/components/ReactTable/index.d.ts +3 -0
- package/lib/components/ReactTable/index.d.ts.map +1 -0
- package/lib/components/Spin/index.d.ts +10 -0
- package/lib/components/Spin/index.d.ts.map +1 -0
- package/lib/components/Spin/index.js +31 -0
- package/lib/components/Spin/index.js.map +1 -0
- package/lib/components/index.d.ts +9 -0
- package/lib/components/index.d.ts.map +1 -0
- package/lib/hooks/useToast.d.ts +17 -0
- package/lib/hooks/useToast.d.ts.map +1 -0
- package/lib/hooks/useToast.js +163 -0
- package/lib/hooks/useToast.js.map +1 -0
- package/lib/icons/index.d.ts +15 -0
- package/lib/icons/index.d.ts.map +1 -0
- package/lib/icons/index.js +14 -0
- package/lib/icons/index.js.map +1 -0
- package/lib/index.d.ts +3 -0
- package/lib/index.d.ts.map +1 -0
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -0
- package/lib/machines/otpMachine.d.ts +3 -0
- package/lib/machines/otpMachine.d.ts.map +1 -0
- package/lib/machines/otpMachine.js +131 -0
- package/lib/machines/otpMachine.js.map +1 -0
- package/lib/utils/hooks/useDebounceFn/index.d.ts +8 -0
- package/lib/utils/hooks/useDebounceFn/index.d.ts.map +1 -0
- package/lib/utils/hooks/useDeepCompareEffect/index.d.ts +5 -0
- package/lib/utils/hooks/useDeepCompareEffect/index.d.ts.map +1 -0
- package/lib/utils/hooks/useDocumentTitle/index.d.ts +7 -0
- package/lib/utils/hooks/useDocumentTitle/index.d.ts.map +1 -0
- package/lib/utils/hooks/usePrevious/index.d.ts +3 -0
- package/lib/utils/hooks/usePrevious/index.d.ts.map +1 -0
- package/lib/utils/hooks/useWindowDimensions/index.d.ts +5 -0
- package/lib/utils/hooks/useWindowDimensions/index.d.ts.map +1 -0
- package/lib/utils/hooks/useWindowDimensions/index.js +21 -0
- package/lib/utils/hooks/useWindowDimensions/index.js.map +1 -0
- package/lib/utils/index.d.ts +21 -0
- package/lib/utils/index.d.ts.map +1 -0
- package/lib/utils/isBrowser/index.d.ts +3 -0
- package/lib/utils/isBrowser/index.d.ts.map +1 -0
- package/lib/utils/isDropdownValueType/index.d.ts +3 -0
- package/lib/utils/isDropdownValueType/index.d.ts.map +1 -0
- package/lib/utils/isImg/index.d.ts +4 -0
- package/lib/utils/isImg/index.d.ts.map +1 -0
- package/lib/utils/isNil/index.d.ts +3 -0
- package/lib/utils/isNil/index.d.ts.map +1 -0
- package/lib/utils/isUrl/index.d.ts +3 -0
- package/lib/utils/isUrl/index.d.ts.map +1 -0
- package/lib/utils/omitUndefined/index.d.ts +3 -0
- package/lib/utils/omitUndefined/index.d.ts.map +1 -0
- package/lib/utils/omitUndefinedAndEmptyArr/index.d.ts +3 -0
- package/lib/utils/omitUndefinedAndEmptyArr/index.d.ts.map +1 -0
- package/lib/utils/typing.d.ts +142 -0
- package/lib/utils/typing.d.ts.map +1 -0
- package/package.json +38 -0
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import {jsx,jsxs}from'react/jsx-runtime';import {useState,useEffect}from'react';import {useLocation,useNavigate}from'@remix-run/react';import {Spin}from'../Spin/index.js';const PageContainer = props => {
|
|
2
|
+
const {
|
|
3
|
+
tabList,
|
|
4
|
+
tabActiveKey,
|
|
5
|
+
onTabChange,
|
|
6
|
+
tabBarExtraContent,
|
|
7
|
+
loading
|
|
8
|
+
} = props;
|
|
9
|
+
const [activeTabKey, setActiveTabKey] = useState(tabActiveKey);
|
|
10
|
+
const location = useLocation();
|
|
11
|
+
const navigate = useNavigate();
|
|
12
|
+
useEffect(() => {
|
|
13
|
+
if (tabList && tabList.length > 0) {
|
|
14
|
+
const currentPath = location.pathname;
|
|
15
|
+
const matchedTab = tabList.find(tab => currentPath === tab.path);
|
|
16
|
+
const defaultKey = tabList[0]?.path;
|
|
17
|
+
setActiveTabKey(matchedTab ? matchedTab.path : defaultKey);
|
|
18
|
+
}
|
|
19
|
+
}, [location.pathname, tabList]);
|
|
20
|
+
const handleTabChange = path => {
|
|
21
|
+
setActiveTabKey(path);
|
|
22
|
+
onTabChange?.(path);
|
|
23
|
+
navigate(path);
|
|
24
|
+
};
|
|
25
|
+
tabList?.map(tab => ({
|
|
26
|
+
label: tab.tab,
|
|
27
|
+
key: tab.path
|
|
28
|
+
}));
|
|
29
|
+
if (loading) {
|
|
30
|
+
return jsx(Spin, {});
|
|
31
|
+
}
|
|
32
|
+
return jsxs("div", {
|
|
33
|
+
className: "custom-page-container",
|
|
34
|
+
children: [tabList && tabList.length > 0 && jsx("div", {
|
|
35
|
+
className: "mb-4 border-b border-gray-200",
|
|
36
|
+
children: jsxs("div", {
|
|
37
|
+
className: "flex items-center justify-between",
|
|
38
|
+
children: [jsx("ul", {
|
|
39
|
+
className: "flex flex-wrap -mb-px",
|
|
40
|
+
children: tabList.map(tab => jsx("li", {
|
|
41
|
+
className: "mr-2",
|
|
42
|
+
children: jsx("button", {
|
|
43
|
+
onClick: () => handleTabChange(tab.path),
|
|
44
|
+
className: `inline-block p-4 ${activeTabKey === tab.path ? 'border-b-2 border-blue-500 text-blue-500' : 'border-b-2 border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-600'}`,
|
|
45
|
+
children: tab.tab
|
|
46
|
+
})
|
|
47
|
+
}, tab.path))
|
|
48
|
+
}), tabBarExtraContent && jsx("div", {
|
|
49
|
+
children: tabBarExtraContent
|
|
50
|
+
})]
|
|
51
|
+
})
|
|
52
|
+
}), jsx("div", {
|
|
53
|
+
className: "page-content",
|
|
54
|
+
children: props.children
|
|
55
|
+
})]
|
|
56
|
+
});
|
|
57
|
+
};export{PageContainer};//# sourceMappingURL=PageContainer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PageContainer.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageContainer/index.tsx"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import type { ReactNode, Key } from 'react';
|
|
2
|
+
interface CustomTabPaneProps {
|
|
3
|
+
component?: () => Promise<{
|
|
4
|
+
default: React.FC;
|
|
5
|
+
}>;
|
|
6
|
+
tab?: ReactNode;
|
|
7
|
+
key?: Key;
|
|
8
|
+
path: string;
|
|
9
|
+
route?: string;
|
|
10
|
+
exact?: boolean;
|
|
11
|
+
strict?: boolean;
|
|
12
|
+
hideInMenu?: boolean;
|
|
13
|
+
hideChildrenInMenu?: boolean;
|
|
14
|
+
locale?: string | false;
|
|
15
|
+
name?: string;
|
|
16
|
+
icon?: any;
|
|
17
|
+
disabled?: boolean;
|
|
18
|
+
flatMenu?: boolean;
|
|
19
|
+
}
|
|
20
|
+
export type PageHeaderTabConfig = {
|
|
21
|
+
tabList?: CustomTabPaneProps[];
|
|
22
|
+
tabActiveKey?: string;
|
|
23
|
+
onTabChange?: (key: string) => void;
|
|
24
|
+
tabBarExtraContent?: ReactNode;
|
|
25
|
+
tabProps?: any;
|
|
26
|
+
fixHeader?: boolean;
|
|
27
|
+
fixedHeader?: boolean;
|
|
28
|
+
};
|
|
29
|
+
export type PageContainerProps = {
|
|
30
|
+
title?: ReactNode | false;
|
|
31
|
+
content?: ReactNode;
|
|
32
|
+
extraContent?: ReactNode;
|
|
33
|
+
prefixCls?: string;
|
|
34
|
+
footer?: ReactNode[];
|
|
35
|
+
token?: any;
|
|
36
|
+
header?: Partial<any> & {
|
|
37
|
+
children?: ReactNode;
|
|
38
|
+
};
|
|
39
|
+
pageHeaderRender?: (props: PageContainerProps) => ReactNode;
|
|
40
|
+
affixProps?: any;
|
|
41
|
+
loading?: boolean | any;
|
|
42
|
+
breadcrumbRender?: any;
|
|
43
|
+
waterMarkProps?: any;
|
|
44
|
+
breadcrumb?: any;
|
|
45
|
+
children?: ReactNode;
|
|
46
|
+
stylish?: any;
|
|
47
|
+
footerStylish?: any;
|
|
48
|
+
footerToolBarProps?: any;
|
|
49
|
+
} & PageHeaderTabConfig & Omit<any, 'title' | 'footer' | 'breadcrumbRender' | 'breadcrumb'>;
|
|
50
|
+
export {};
|
|
51
|
+
//# sourceMappingURL=types.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/PageContainer/types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAE5C,UAAU,kBAAkB;IACxB,SAAS,CAAC,EAAE,MAAM,OAAO,CAAC;QAAE,OAAO,EAAE,KAAK,CAAC,EAAE,CAAA;KAAE,CAAC,CAAC;IACjD,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,GAAG,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,mBAAmB,GAAG;IAC9B,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,KAAK,CAAC;IAC1B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,EAAE,CAAC;IACrB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC,GAAG,CAAC,GAAG;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,CAAC;IACjD,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,SAAS,CAAC;IAC5D,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,GAAG,GAAG,CAAC;IACxB,gBAAgB,CAAC,EAAE,GAAG,CAAC;IACvB,cAAc,CAAC,EAAE,GAAG,CAAC;IACrB,UAAU,CAAC,EAAE,GAAG,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,OAAO,CAAC,EAAE,GAAG,CAAC;IACd,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,kBAAkB,CAAC,EAAE,GAAG,CAAC;CAC5B,GAAG,mBAAmB,GACnB,IAAI,CAAC,GAAG,EAAE,OAAO,GAAG,QAAQ,GAAG,kBAAkB,GAAG,YAAY,CAAC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageLoading/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;IACxB,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAIA,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import {jsx}from'react/jsx-runtime';import {Spin}from'../Spin/index.js';const PageLoading = ({
|
|
2
|
+
tip
|
|
3
|
+
}) => jsx("div", {
|
|
4
|
+
className: "pt-24 text-center",
|
|
5
|
+
children: jsx(Spin, {
|
|
6
|
+
size: "large",
|
|
7
|
+
tip: tip
|
|
8
|
+
})
|
|
9
|
+
});export{PageLoading as default};//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/PageLoading/index.tsx"],"sourcesContent":[null],"names":["_jsx"],"mappings":"wEAIO,MAAA,WAAU,GAAA,CAAA;AAChB,EAIA;AAED,CAAA,KAAAA,GAAA,CAAA;;;;;;"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
export interface IReactTableInterface {
|
|
2
|
+
columns: any[];
|
|
3
|
+
data: any[];
|
|
4
|
+
noDataText?: string;
|
|
5
|
+
showPagination?: boolean;
|
|
6
|
+
pageOptions?: number[];
|
|
7
|
+
pageNumber?: number;
|
|
8
|
+
pages?: number;
|
|
9
|
+
pageSizeCount?: number;
|
|
10
|
+
resolveData?: any[];
|
|
11
|
+
setPageSizeCount?: Function;
|
|
12
|
+
setPageNumber?: Function;
|
|
13
|
+
allowRowSelection?: Boolean;
|
|
14
|
+
showFilters?: Boolean;
|
|
15
|
+
onSelectedRowsChange?: Function;
|
|
16
|
+
}
|
|
17
|
+
export declare const ReactTable: (props: IReactTableInterface) => import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
//# sourceMappingURL=Table.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/ReactTable/Table.tsx"],"names":[],"mappings":"AAyCA,MAAM,WAAW,oBAAoB;IACjC,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,GAAG,EAAE,CAAC;IACpB,gBAAgB,CAAC,EAAE,QAAQ,CAAC;IAC5B,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,oBAAoB,CAAC,EAAE,QAAQ,CAAC;CACnC;AAED,eAAO,MAAM,UAAU,UAAW,oBAAoB,4CAgNrD,CAAC"}
|
|
@@ -0,0 +1,151 @@
|
|
|
1
|
+
import {jsxs,jsx}from'react/jsx-runtime';import React__default,{useEffect}from'react';import {useReactTable,getCoreRowModel,getSortedRowModel,getFilteredRowModel,getPaginationRowModel,flexRender}from'@tanstack/react-table';import useWindowDimensions from'../../utils/hooks/useWindowDimensions/index.js';import {DefaultColumnFilter}from'./TableFilters.js';import {useLayoutSettings}from'@admin-layout/client';import {icons}from'../../icons/index.js';const ReactTable = props => {
|
|
2
|
+
const {
|
|
3
|
+
columns,
|
|
4
|
+
data,
|
|
5
|
+
pageOptions,
|
|
6
|
+
onSelectedRowsChange,
|
|
7
|
+
allowRowSelection,
|
|
8
|
+
showPagination,
|
|
9
|
+
pageNumber,
|
|
10
|
+
pages,
|
|
11
|
+
pageSizeCount,
|
|
12
|
+
setPageSizeCount,
|
|
13
|
+
setPageNumber,
|
|
14
|
+
noDataText,
|
|
15
|
+
showFilters
|
|
16
|
+
} = props;
|
|
17
|
+
const {
|
|
18
|
+
OutlineLeftIcon,
|
|
19
|
+
OutlineRightIcon
|
|
20
|
+
} = icons;
|
|
21
|
+
const [pagination, setPagination] = React__default.useState({
|
|
22
|
+
pageIndex: pageNumber || 0,
|
|
23
|
+
pageSize: pageSizeCount || 10
|
|
24
|
+
});
|
|
25
|
+
React__default.useMemo(() => ({
|
|
26
|
+
Filter: showFilters ? DefaultColumnFilter : ''
|
|
27
|
+
}), []);
|
|
28
|
+
const table = useReactTable({
|
|
29
|
+
state: {
|
|
30
|
+
pagination
|
|
31
|
+
},
|
|
32
|
+
columns,
|
|
33
|
+
data,
|
|
34
|
+
debugTable: true,
|
|
35
|
+
getCoreRowModel: getCoreRowModel(),
|
|
36
|
+
getSortedRowModel: getSortedRowModel(),
|
|
37
|
+
getFilteredRowModel: getFilteredRowModel(),
|
|
38
|
+
getPaginationRowModel: getPaginationRowModel(),
|
|
39
|
+
onPaginationChange: setPagination,
|
|
40
|
+
manualPagination: true
|
|
41
|
+
});
|
|
42
|
+
const currentListStartingIndex = table.getState().pagination.pageIndex * table.getState().pagination.pageSize;
|
|
43
|
+
const {
|
|
44
|
+
settings
|
|
45
|
+
} = useLayoutSettings();
|
|
46
|
+
const {
|
|
47
|
+
width
|
|
48
|
+
} = useWindowDimensions();
|
|
49
|
+
const isDarkMode = settings.navTheme === 'realDark';
|
|
50
|
+
useEffect(() => {
|
|
51
|
+
if (setPageNumber && table.getState().pagination.pageIndex > -1) {
|
|
52
|
+
setPageNumber(table.getState().pagination.pageIndex);
|
|
53
|
+
}
|
|
54
|
+
}, [table.getState().pagination.pageIndex]);
|
|
55
|
+
useEffect(() => {
|
|
56
|
+
if (setPageSizeCount) {
|
|
57
|
+
setPageSizeCount(table.getState().pagination.pageSize);
|
|
58
|
+
}
|
|
59
|
+
}, [table.getState().pagination.pageSize]);
|
|
60
|
+
return jsxs("div", {
|
|
61
|
+
className: "overflow-auto",
|
|
62
|
+
children: [jsxs("table", {
|
|
63
|
+
className: `w-full border border-opacity-10 ${isDarkMode ? 'border-gray-700' : 'border-gray-200'}`,
|
|
64
|
+
children: [jsx("thead", {
|
|
65
|
+
className: isDarkMode ? 'bg-gray-800 shadow-md' : 'bg-gray-50 shadow',
|
|
66
|
+
children: table.getHeaderGroups().map(headerGroup => jsx("tr", {
|
|
67
|
+
children: headerGroup.headers.map(header => jsx("th", {
|
|
68
|
+
className: `border-r border-opacity-5 p-2 text-left ${isDarkMode ? 'border-gray-600 text-gray-200' : 'border-gray-200 text-gray-700'}`,
|
|
69
|
+
children: flexRender(header.column.columnDef.header, header.getContext())
|
|
70
|
+
}, header.id))
|
|
71
|
+
}, headerGroup.id))
|
|
72
|
+
}), jsx("tbody", {
|
|
73
|
+
children: table.getRowModel().rows.length ? table.getRowModel().rows.slice(currentListStartingIndex, currentListStartingIndex + table.getState().pagination.pageSize).map(row => {
|
|
74
|
+
return jsx("tr", {
|
|
75
|
+
className: `border-b border-opacity-5 ${isDarkMode ? 'border-gray-700' : 'border-gray-200'}`,
|
|
76
|
+
children: row.getVisibleCells().map(cell => {
|
|
77
|
+
return jsx("td", {
|
|
78
|
+
className: `overflow-hidden border-r border-opacity-2 whitespace-nowrap p-2 text-ellipsis ${isDarkMode ? 'border-gray-700' : 'border-gray-200'}`,
|
|
79
|
+
children: flexRender(cell.column.columnDef.cell, cell.getContext())
|
|
80
|
+
}, cell.id);
|
|
81
|
+
})
|
|
82
|
+
}, row.id);
|
|
83
|
+
}) : jsx("tr", {
|
|
84
|
+
className: "h-24",
|
|
85
|
+
children: jsx("td", {
|
|
86
|
+
colSpan: columns.length,
|
|
87
|
+
className: "relative",
|
|
88
|
+
children: jsx("div", {
|
|
89
|
+
className: "absolute left-0 right-0 mt-10 w-full text-center text-gray-500",
|
|
90
|
+
children: noDataText || 'No Data'
|
|
91
|
+
})
|
|
92
|
+
})
|
|
93
|
+
})
|
|
94
|
+
})]
|
|
95
|
+
}), showPagination && jsxs("div", {
|
|
96
|
+
className: `flex border border-opacity-10 p-2 ${isDarkMode ? 'border-gray-700' : 'border-gray-200'}`,
|
|
97
|
+
children: [jsx("div", {
|
|
98
|
+
children: jsx("button", {
|
|
99
|
+
onClick: () => table.previousPage(),
|
|
100
|
+
disabled: !table.getCanPreviousPage(),
|
|
101
|
+
className: `${width < 768 ? 'h-8 w-8' : 'h-10 px-4'} ${isDarkMode ? 'bg-gray-800 text-white border-gray-600' : 'bg-gray-100 text-gray-700 border-transparent'} rounded border ${!table.getCanPreviousPage() ? 'opacity-50' : 'hover:bg-gray-700 hover:text-white'}`,
|
|
102
|
+
children: width < 768 ? jsx(OutlineLeftIcon, {
|
|
103
|
+
className: "mx-auto text-lg"
|
|
104
|
+
}) : 'Previous'
|
|
105
|
+
})
|
|
106
|
+
}), jsxs("div", {
|
|
107
|
+
className: `mx-auto flex gap-${width < 768 ? '5' : '24'}`,
|
|
108
|
+
children: [jsxs("div", {
|
|
109
|
+
className: "flex items-center",
|
|
110
|
+
children: [jsx("span", {
|
|
111
|
+
className: `${isDarkMode ? 'text-gray-300' : 'text-gray-700'}`,
|
|
112
|
+
children: "Page"
|
|
113
|
+
}), jsx("input", {
|
|
114
|
+
type: "number",
|
|
115
|
+
value: table.getState().pagination.pageIndex + 1,
|
|
116
|
+
onChange: e => {
|
|
117
|
+
const page = e.target.value ? Number(e.target.value) - 1 : 0;
|
|
118
|
+
table.setPageIndex(page);
|
|
119
|
+
},
|
|
120
|
+
min: 1,
|
|
121
|
+
max: table.getPageCount(),
|
|
122
|
+
className: `mx-2 ${width < 768 ? 'h-8 w-8' : 'h-10 w-16'} rounded border px-2 ${isDarkMode ? 'bg-gray-800 text-white border-gray-600' : 'bg-white text-gray-700 border-gray-300'}`
|
|
123
|
+
}), jsxs("span", {
|
|
124
|
+
className: `${isDarkMode ? 'text-gray-300' : 'text-gray-700'}`,
|
|
125
|
+
children: ["of ", data.length === 0 ? 1 : table.getPageCount()]
|
|
126
|
+
})]
|
|
127
|
+
}), jsx("div", {
|
|
128
|
+
children: jsx("select", {
|
|
129
|
+
value: table.getState().pagination.pageSize,
|
|
130
|
+
onChange: e => table.setPageSize(Number(e.target.value)),
|
|
131
|
+
className: `${width < 768 ? 'h-8' : 'h-10'} rounded border px-2 ${isDarkMode ? 'bg-gray-800 text-white border-gray-600' : 'bg-white text-gray-700 border-gray-300'}`,
|
|
132
|
+
children: (pageOptions || [10, 15, 20, 25]).map(value => jsx("option", {
|
|
133
|
+
value: value,
|
|
134
|
+
children: `${value} rows`
|
|
135
|
+
}, value))
|
|
136
|
+
})
|
|
137
|
+
})]
|
|
138
|
+
}), jsx("div", {
|
|
139
|
+
className: "ml-auto",
|
|
140
|
+
children: jsx("button", {
|
|
141
|
+
onClick: () => table.nextPage(),
|
|
142
|
+
disabled: !table.getCanNextPage(),
|
|
143
|
+
className: `${width < 768 ? 'h-8 w-8' : 'h-10 px-4'} ${isDarkMode ? 'bg-gray-800 text-white border-gray-600' : 'bg-gray-100 text-gray-700 border-transparent'} rounded border ${!table.getCanNextPage() ? 'opacity-50' : 'hover:bg-gray-700 hover:text-white'}`,
|
|
144
|
+
children: width < 768 ? jsx(OutlineRightIcon, {
|
|
145
|
+
className: "mx-auto text-lg"
|
|
146
|
+
}) : 'Next'
|
|
147
|
+
})
|
|
148
|
+
})]
|
|
149
|
+
})]
|
|
150
|
+
});
|
|
151
|
+
};export{ReactTable};//# sourceMappingURL=Table.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Table.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
export declare function SelectColumnFilter(filter: any): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare function DefaultColumnFilter({ column: { filterValue, setFilter } }: {
|
|
3
|
+
column: {
|
|
4
|
+
filterValue: any;
|
|
5
|
+
setFilter: any;
|
|
6
|
+
};
|
|
7
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
//# sourceMappingURL=TableFilters.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableFilters.d.ts","sourceRoot":"","sources":["../../../src/components/ReactTable/TableFilters.tsx"],"names":[],"mappings":"AAOA,wBAAgB,kBAAkB,CAAC,MAAM,KAAA,2CA2BxC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE;;;;;CAAA,2CA4BzE"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import {jsx,jsxs}from'react/jsx-runtime';import React__default from'react';function SelectColumnFilter(filter) {
|
|
2
|
+
const options = React__default.useMemo(() => {
|
|
3
|
+
const options = new Set();
|
|
4
|
+
filter.column.preFilteredRows.forEach(row => {
|
|
5
|
+
options.add({
|
|
6
|
+
label: row.values[filter.column.id],
|
|
7
|
+
value: row.values[filter.column.id]
|
|
8
|
+
});
|
|
9
|
+
});
|
|
10
|
+
return [...options];
|
|
11
|
+
}, [filter.column.id, filter.column.preFilteredRows]);
|
|
12
|
+
return jsx("div", {
|
|
13
|
+
className: "relative",
|
|
14
|
+
children: jsxs("select", {
|
|
15
|
+
className: "w-full rounded-md border border-gray-300 bg-white px-3 py-2 text-gray-700 shadow-sm focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500",
|
|
16
|
+
onChange: e => filter.column.setFilter(e.target.value || undefined),
|
|
17
|
+
children: [jsx("option", {
|
|
18
|
+
value: "",
|
|
19
|
+
children: "All"
|
|
20
|
+
}), options.map((option, i) => jsx("option", {
|
|
21
|
+
value: option?.value,
|
|
22
|
+
children: option?.label
|
|
23
|
+
}, i))]
|
|
24
|
+
})
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
function DefaultColumnFilter({
|
|
28
|
+
column: {
|
|
29
|
+
filterValue,
|
|
30
|
+
setFilter
|
|
31
|
+
}
|
|
32
|
+
}) {
|
|
33
|
+
return jsxs("div", {
|
|
34
|
+
className: "relative",
|
|
35
|
+
children: [jsx("input", {
|
|
36
|
+
type: "text",
|
|
37
|
+
value: filterValue || '',
|
|
38
|
+
onChange: e => {
|
|
39
|
+
setFilter(e.target.value || undefined);
|
|
40
|
+
},
|
|
41
|
+
className: "w-full rounded-md border border-gray-300 px-3 py-2 text-gray-700 shadow-sm focus:border-blue-500 focus:outline-none focus:ring-1 focus:ring-blue-500",
|
|
42
|
+
placeholder: "Type to search..."
|
|
43
|
+
}), filterValue && jsx("button", {
|
|
44
|
+
className: "absolute right-2 top-2 text-gray-400 hover:text-gray-600",
|
|
45
|
+
onClick: () => setFilter(undefined),
|
|
46
|
+
children: jsx("svg", {
|
|
47
|
+
className: "h-4 w-4",
|
|
48
|
+
fill: "currentColor",
|
|
49
|
+
viewBox: "0 0 20 20",
|
|
50
|
+
children: jsx("path", {
|
|
51
|
+
fillRule: "evenodd",
|
|
52
|
+
d: "M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z",
|
|
53
|
+
clipRule: "evenodd"
|
|
54
|
+
})
|
|
55
|
+
})
|
|
56
|
+
})]
|
|
57
|
+
});
|
|
58
|
+
}export{DefaultColumnFilter,SelectColumnFilter};//# sourceMappingURL=TableFilters.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TableFilters.js","sources":["../../../src/components/ReactTable/TableFilters.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;;MAgEC,OAAA,CAAA,GAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ReactTable/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type SpinSize = 'small' | 'default' | 'large';
|
|
3
|
+
export type SpinProps = {
|
|
4
|
+
size?: SpinSize;
|
|
5
|
+
tip?: string;
|
|
6
|
+
fullPage?: boolean;
|
|
7
|
+
className?: string;
|
|
8
|
+
};
|
|
9
|
+
export declare const Spin: React.FC<SpinProps>;
|
|
10
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Spin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AACrD,MAAM,MAAM,SAAS,GAAG;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA4BpC,CAAC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import {jsxs,jsx}from'react/jsx-runtime';const Spin = ({
|
|
2
|
+
size = 'default',
|
|
3
|
+
tip,
|
|
4
|
+
fullPage = false,
|
|
5
|
+
className = ''
|
|
6
|
+
}) => {
|
|
7
|
+
// Map sizes to Tailwind classes
|
|
8
|
+
const sizeClasses = {
|
|
9
|
+
small: 'h-4 w-4 border-2',
|
|
10
|
+
default: 'h-6 w-6 border-2',
|
|
11
|
+
large: 'h-8 w-8 border-4'
|
|
12
|
+
};
|
|
13
|
+
// Spinner component with size variation
|
|
14
|
+
const SpinnerElement = jsxs("div", {
|
|
15
|
+
className: "inline-flex flex-col items-center justify-center",
|
|
16
|
+
children: [jsx("div", {
|
|
17
|
+
className: `${sizeClasses[size]} animate-spin rounded-full border-gray-300 border-t-blue-500 ${className}`
|
|
18
|
+
}), tip && jsx("div", {
|
|
19
|
+
className: `mt-2 text-${size === 'small' ? 'xs' : 'sm'} text-gray-600`,
|
|
20
|
+
children: tip
|
|
21
|
+
})]
|
|
22
|
+
});
|
|
23
|
+
// If fullPage is true, center in viewport
|
|
24
|
+
if (fullPage) {
|
|
25
|
+
return jsx("div", {
|
|
26
|
+
className: "fixed inset-0 z-50 flex items-center justify-center bg-white bg-opacity-80",
|
|
27
|
+
children: SpinnerElement
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
return SpinnerElement;
|
|
31
|
+
};export{Spin};//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/components/Spin/index.tsx"],"sourcesContent":[null],"names":[],"mappings":"yCAEY,aAAQ,CAAG;AACvB,EAAM,IAAA,GAAA;KACE;UACE,GAAA,KAAO;WACL,GAAG;MACF;;AAGb,EAAO,MAAA,WAAA;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import PageLoading from './PageLoading';
|
|
2
|
+
export * from './ErrorHandlers';
|
|
3
|
+
export * from './ReactTable';
|
|
4
|
+
export * from './ErrorPages';
|
|
5
|
+
export * from './PageContainer';
|
|
6
|
+
export * from './Spin';
|
|
7
|
+
export * from './OTP';
|
|
8
|
+
export { PageLoading };
|
|
9
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAC;AACxC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,OAAO,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export type ToastStatus = 'success' | 'error' | 'warning' | 'info';
|
|
3
|
+
export interface ToastOptions {
|
|
4
|
+
title?: string;
|
|
5
|
+
description?: string;
|
|
6
|
+
status?: ToastStatus;
|
|
7
|
+
duration?: number;
|
|
8
|
+
isClosable?: boolean;
|
|
9
|
+
position?: 'top' | 'top-right' | 'top-left' | 'bottom' | 'bottom-right' | 'bottom-left';
|
|
10
|
+
onClose?: () => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const ToastContainer: ({ children }: {
|
|
13
|
+
children: React.ReactNode;
|
|
14
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export declare const useToast: () => (options: ToastOptions) => void;
|
|
16
|
+
export declare const useToastCloseAll: () => () => void;
|
|
17
|
+
//# sourceMappingURL=useToast.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/hooks/useToast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAKtE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,YAAY;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,cAAc,GAAG,aAAa,CAAC;IACxF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AA+GD,eAAO,MAAM,cAAc,iBAAkB;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,4CAgCzE,CAAC;AAGF,eAAO,MAAM,QAAQ,kBA/IA,YAAY,KAAK,IAqJrC,CAAC;AAGF,eAAO,MAAM,gBAAgB,cAvJT,IA6JnB,CAAC"}
|