@campxdev/shared 1.7.10 → 1.7.12

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.
Files changed (221) hide show
  1. package/antd.customize.less +73 -73
  2. package/exports.ts +19 -19
  3. package/package.json +86 -86
  4. package/src/assets/fonts/avenir/index.ts +13 -13
  5. package/src/assets/fonts/poppins/index.ts +18 -18
  6. package/src/assets/images/index.ts +17 -17
  7. package/src/assets/images/unauth.svg +92 -92
  8. package/src/components/ActionButton.tsx +20 -20
  9. package/src/components/Attachment.tsx +26 -26
  10. package/src/components/AutocompleteSearch/AutocompleteSearch.tsx +57 -57
  11. package/src/components/AutocompleteSearch/index.tsx +1 -1
  12. package/src/components/Breadcrumbs.tsx +72 -72
  13. package/src/components/Card.tsx +98 -98
  14. package/src/components/CardsGrid.tsx +28 -28
  15. package/src/components/ChangePassword.tsx +123 -123
  16. package/src/components/Chips.tsx +81 -81
  17. package/src/components/Detail.tsx +15 -15
  18. package/src/components/DetailsGrid.tsx +52 -52
  19. package/src/components/DividerHeading.tsx +41 -41
  20. package/src/components/DrawerWrapper/DialogWrapper.tsx +67 -67
  21. package/src/components/DrawerWrapper/DrawerTemplate.tsx +53 -53
  22. package/src/components/DrawerWrapper/DrawerWrapper.tsx +53 -53
  23. package/src/components/DropDownButton/AnchorElement.tsx +44 -44
  24. package/src/components/DropDownButton/DropDownButton.tsx +184 -184
  25. package/src/components/DropDownButton/DropdownMenuItem.tsx +110 -110
  26. package/src/components/DropDownButton/index.tsx +1 -1
  27. package/src/components/DropDownButton/styles.tsx +59 -59
  28. package/src/components/ErrorBoundary/ErrorBoundary.tsx +28 -28
  29. package/src/components/ErrorBoundary/ErrorFallback.tsx +236 -236
  30. package/src/components/ErrorBoundary/GlobalNetworkLoadingIndicator.tsx +13 -13
  31. package/src/components/ErrorBoundary/index.tsx +1 -1
  32. package/src/components/ErrorBox.tsx +42 -42
  33. package/src/components/FilterComponents/FilterButton.tsx +56 -56
  34. package/src/components/FilterComponents/SearchBar.tsx +45 -45
  35. package/src/components/FloatingContainer.tsx +33 -33
  36. package/src/components/Form/Form.tsx +147 -147
  37. package/src/components/Form/RenderForm.tsx +189 -189
  38. package/src/components/FullScreenLoader.tsx +19 -19
  39. package/src/components/HookForm/AutoCompleteSearch.tsx +113 -113
  40. package/src/components/HookForm/DatePicker.tsx +40 -40
  41. package/src/components/HookForm/DateTimePicker.tsx +47 -47
  42. package/src/components/HookForm/FormLabel.tsx +14 -14
  43. package/src/components/HookForm/MultiCheckbox.tsx +69 -69
  44. package/src/components/HookForm/MultiSelect.tsx +53 -53
  45. package/src/components/HookForm/RadioGroup.tsx +47 -47
  46. package/src/components/HookForm/SingleCheckbox.tsx +34 -34
  47. package/src/components/HookForm/SingleSelect.tsx +46 -46
  48. package/src/components/HookForm/TextField.tsx +40 -40
  49. package/src/components/HookForm/TimePicker.tsx +40 -40
  50. package/src/components/HookForm/index.ts +23 -23
  51. package/src/components/IconButtons/IconButtons.tsx +137 -137
  52. package/src/components/IconButtons/Icons.tsx +268 -268
  53. package/src/components/IconButtons/assets/edit.svg +4 -4
  54. package/src/components/IconButtons/assets/eye.svg +6 -6
  55. package/src/components/IconButtons/assets/trash.svg +7 -7
  56. package/src/components/IconButtons/index.tsx +8 -8
  57. package/src/components/IconLabel.tsx +37 -37
  58. package/src/components/Image/Image.tsx +45 -45
  59. package/src/components/Image/index.tsx +1 -1
  60. package/src/components/ImageUpload.tsx +98 -98
  61. package/src/components/Input/AsyncSearchSelect/AsyncSearchSelect.tsx +216 -216
  62. package/src/components/Input/AsyncSearchSelect/index.tsx +1 -1
  63. package/src/components/Input/AsyncSearchSelect/styles.tsx +105 -105
  64. package/src/components/Input/AutoCompleteSearch.tsx +121 -121
  65. package/src/components/Input/DatePicker.tsx +76 -76
  66. package/src/components/Input/DateRangePicker.tsx +105 -105
  67. package/src/components/Input/DateTimePicker.tsx +84 -84
  68. package/src/components/Input/FormLabel.tsx +21 -21
  69. package/src/components/Input/MultiCheckbox.tsx +64 -64
  70. package/src/components/Input/MultiSelect.tsx +150 -150
  71. package/src/components/Input/RadioGroup.tsx +104 -104
  72. package/src/components/Input/SingleCheckbox.tsx +78 -78
  73. package/src/components/Input/SingleSelect.tsx +104 -104
  74. package/src/components/Input/TextField.tsx +46 -46
  75. package/src/components/Input/TimePicker.tsx +77 -77
  76. package/src/components/Input/index.ts +26 -26
  77. package/src/components/Input/types.ts +3 -3
  78. package/src/components/JsonPreview.tsx +7 -7
  79. package/src/components/LabelValue.tsx +21 -21
  80. package/src/components/Layout/ChangePassword.tsx +49 -49
  81. package/src/components/Layout/Header/AppHeader.tsx +112 -112
  82. package/src/components/Layout/Header/AppsMenu.tsx +105 -105
  83. package/src/components/Layout/Header/HeaderActions/CogWheelMenu.tsx +33 -33
  84. package/src/components/Layout/Header/HeaderActions/FreshDeskHelpButton.tsx +24 -24
  85. package/src/components/Layout/Header/HeaderActions/HeaderActions.tsx +18 -18
  86. package/src/components/Layout/Header/HeaderActions/UserBox.tsx +56 -56
  87. package/src/components/Layout/Header/Notification.tsx +13 -13
  88. package/src/components/Layout/Header/applications.ts +103 -103
  89. package/src/components/Layout/Header/assets/campx_square_small.svg +8 -8
  90. package/src/components/Layout/Header/assets/commutex.svg +14 -14
  91. package/src/components/Layout/Header/assets/commutexSmall.svg +11 -11
  92. package/src/components/Layout/Header/assets/enroll.svg +14 -14
  93. package/src/components/Layout/Header/assets/enrollx.svg +14 -14
  94. package/src/components/Layout/Header/assets/exams_small.svg +11 -11
  95. package/src/components/Layout/Header/assets/examsx.svg +14 -14
  96. package/src/components/Layout/Header/assets/hostel_small.svg +13 -13
  97. package/src/components/Layout/Header/assets/hostelx.svg +13 -13
  98. package/src/components/Layout/Header/assets/index.ts +35 -35
  99. package/src/components/Layout/Header/assets/libraryx.svg +12 -12
  100. package/src/components/Layout/Header/assets/pay_small.svg +15 -15
  101. package/src/components/Layout/Header/assets/payx.svg +19 -19
  102. package/src/components/Layout/Header/assets/people_small.svg +9 -9
  103. package/src/components/Layout/Header/assets/peoplex.svg +12 -12
  104. package/src/components/Layout/Header/assets/squarex.svg +12 -12
  105. package/src/components/Layout/Header/icons.tsx +57 -57
  106. package/src/components/Layout/Header/index.tsx +1 -1
  107. package/src/components/Layout/Header/styles.tsx +133 -133
  108. package/src/components/Layout/Helmet.tsx +49 -49
  109. package/src/components/Layout/LayoutWrapper.tsx +28 -28
  110. package/src/components/Layout/SideMenuHeader.tsx +29 -29
  111. package/src/components/Layout/SideNav.tsx +168 -168
  112. package/src/components/Layout/Tickets/HelpWidget/HelpWidget.tsx +273 -273
  113. package/src/components/Layout/Tickets/HelpWidget/styles.tsx +94 -94
  114. package/src/components/Layout/Tickets/MyTickets.tsx +72 -72
  115. package/src/components/Layout/Tickets/TicketDetails.tsx +65 -65
  116. package/src/components/Layout/Tickets/TimeLine.tsx +64 -64
  117. package/src/components/Layout/Tickets/index.tsx +1 -1
  118. package/src/components/Layout/Tickets/services.ts +11 -11
  119. package/src/components/Layout/Tickets/styles.tsx +136 -136
  120. package/src/components/LinearProgress.tsx +19 -19
  121. package/src/components/ListItemButton.tsx +95 -95
  122. package/src/components/LoginForm.tsx +171 -171
  123. package/src/components/MediaRow/MediaRow.tsx +67 -67
  124. package/src/components/MediaRow/index.tsx +1 -1
  125. package/src/components/ModalButtons/DialogButton.tsx +126 -126
  126. package/src/components/ModalButtons/DrawerButton.tsx +115 -115
  127. package/src/components/ModalButtons/index.tsx +4 -4
  128. package/src/components/NoDataIllustration.tsx +32 -32
  129. package/src/components/PageContent.tsx +12 -12
  130. package/src/components/PageHeader.tsx +55 -55
  131. package/src/components/PageNotFound.tsx +26 -26
  132. package/src/components/PopupConfirm/ConfirmContextProvider.tsx +40 -40
  133. package/src/components/PopupConfirm/PopupConfirm.tsx +67 -67
  134. package/src/components/PopupConfirm/index.tsx +1 -1
  135. package/src/components/PopupConfirm/useConfirm.ts +47 -47
  136. package/src/components/ResetPassword.tsx +107 -107
  137. package/src/components/Row.tsx +24 -24
  138. package/src/components/Spinner.tsx +18 -18
  139. package/src/components/StepsHeader/StepsHeader.tsx +115 -115
  140. package/src/components/StepsHeader/index.tsx +1 -1
  141. package/src/components/StyledTableContainer.tsx +33 -33
  142. package/src/components/SwitchButton.tsx +41 -41
  143. package/src/components/Table.tsx +42 -42
  144. package/src/components/Tables/BasicTable/Table.tsx +198 -198
  145. package/src/components/Tables/BasicTable/TableFooter.tsx +86 -86
  146. package/src/components/Tables/BasicTable/index.tsx +1 -1
  147. package/src/components/Tables/ReactTable/BatchActionsHeader.tsx +58 -58
  148. package/src/components/Tables/ReactTable/ReactTable.tsx +295 -295
  149. package/src/components/Tables/ReactTable/RenderTableBody.tsx +49 -49
  150. package/src/components/Tables/ReactTable/index.tsx +1 -1
  151. package/src/components/Tables/ReactTable/react-table-config.d.ts +128 -128
  152. package/src/components/Tables/common/NoRecordsFound.tsx +27 -27
  153. package/src/components/Tables/common/TableStats.tsx +22 -22
  154. package/src/components/Tables/common/icons.tsx +50 -50
  155. package/src/components/Tables/common/styles.tsx +170 -170
  156. package/src/components/Tables/common/types.ts +57 -57
  157. package/src/components/Tabs/NavigationTabs.tsx +80 -80
  158. package/src/components/Tabs/Tabs.tsx +53 -53
  159. package/src/components/Tabs/TabsContainer.tsx +50 -50
  160. package/src/components/Tabs/index.tsx +1 -1
  161. package/src/components/Tabs/styles.tsx +55 -55
  162. package/src/components/ToastContainer/ToastContainer.tsx +57 -57
  163. package/src/components/ToastContainer/index.tsx +1 -1
  164. package/src/components/UploadButton/UploadButton.tsx +126 -126
  165. package/src/components/UploadButton/index.tsx +1 -1
  166. package/src/components/UploadButton/types.ts +19 -19
  167. package/src/components/UploadDocument.tsx +108 -108
  168. package/src/components/UploadFileDialog/UploadFileDialog.tsx +238 -238
  169. package/src/components/UploadFileDialog/index.tsx +1 -1
  170. package/src/components/index.ts +102 -102
  171. package/src/config/axios.ts +73 -73
  172. package/src/config/axiosEvaluator.ts +53 -53
  173. package/src/config/axiosXTenant.ts +57 -57
  174. package/src/constants/UIConstants.ts +97 -97
  175. package/src/constants/formValidations.ts +6 -6
  176. package/src/constants/index.ts +5 -5
  177. package/src/constants/isDevelopment.ts +3 -3
  178. package/src/constants/permissions.ts +67 -67
  179. package/src/constants/validateMessages.ts +12 -12
  180. package/src/contexts/LoginFormProvider.tsx +39 -39
  181. package/src/contexts/Providers.tsx +44 -44
  182. package/src/contexts/PublicProviders.tsx +30 -30
  183. package/src/contexts/QueryClientProvider.tsx +22 -22
  184. package/src/hooks/index.ts +4 -4
  185. package/src/hooks/useAuth.ts +96 -96
  186. package/src/hooks/useFetch.ts +53 -53
  187. package/src/hooks/useFilters.ts +80 -80
  188. package/src/hooks/useRouter.ts +31 -31
  189. package/src/layouts/Components/DashBoardMenu.tsx +232 -232
  190. package/src/layouts/Components/icons/index.tsx +403 -403
  191. package/src/layouts/Components/styles.tsx +74 -74
  192. package/src/layouts/ComponentsLayout.tsx +3 -3
  193. package/src/permissions/PageWithPermission.tsx +18 -18
  194. package/src/permissions/PermissionDeniedPage.tsx +16 -16
  195. package/src/permissions/ValidateAccess.tsx +18 -18
  196. package/src/permissions/index.ts +2 -2
  197. package/src/react-app-env.d.ts +1 -1
  198. package/src/shared-state/AssetsStore.ts +15 -15
  199. package/src/shared-state/PermissionsStore.ts +352 -352
  200. package/src/shared-state/UserStore.ts +13 -13
  201. package/src/shared-state/index.ts +4 -4
  202. package/src/theme/App.less +3 -3
  203. package/src/theme/MuiThemeProvider.tsx +18 -18
  204. package/src/theme/customCssBaseline.ts +135 -135
  205. package/src/theme/index.css +28 -28
  206. package/src/theme/muiTheme.ts +595 -595
  207. package/src/theme/theme.d.ts +75 -75
  208. package/src/utils/alphabet.ts +23 -23
  209. package/src/utils/arrayPadEnd.ts +3 -3
  210. package/src/utils/formatCurrency.ts +9 -9
  211. package/src/utils/getUrlParams.ts +5 -5
  212. package/src/utils/index.ts +7 -7
  213. package/src/utils/logout.ts +31 -25
  214. package/src/utils/ordinalSuffixOf.ts +14 -14
  215. package/src/utils/romanize.ts +40 -40
  216. package/src/utils/withRouteWrapper.tsx +25 -25
  217. package/src/utils/withSuspense.tsx +6 -6
  218. package/styled-components.tsx +60 -60
  219. package/tsconfig.json +21 -21
  220. package/yarn-error.log +109 -0
  221. package/src/components/Layout/Header/assets/commuteX.png +0 -0
@@ -1,126 +1,126 @@
1
- import { Close } from '@mui/icons-material'
2
- import {
3
- Box,
4
- Dialog,
5
- DialogProps,
6
- DialogTitle,
7
- Grow,
8
- IconButton,
9
- styled,
10
- } from '@mui/material'
11
- import { TransitionProps } from '@mui/material/transitions'
12
- import { forwardRef, ReactNode, useState } from 'react'
13
- import { SCROLLBAR_DARK } from '../../theme/muiTheme'
14
-
15
- const StyledDialogHeader = styled(Box)(() => ({
16
- height: '64px',
17
- backgroundColor: '#f7f7f7',
18
- display: 'flex',
19
- justifyContent: 'space-between',
20
- alignItems: 'end',
21
- padding: '0.6rem 1rem',
22
- paddingBottom: '10px',
23
- }))
24
-
25
- const StyledDialogContent = styled(Box)(() => ({
26
- width: '100%',
27
- padding: '1rem',
28
- maxHeight: 'calc(100vh - 64px)',
29
- overflow: 'auto',
30
- ...SCROLLBAR_DARK,
31
- }))
32
-
33
- export const Transition = forwardRef(function Transition(
34
- props: TransitionProps & {
35
- children: React.ReactElement
36
- },
37
- ref: React.Ref<unknown>,
38
- ) {
39
- return <Grow timeout={1000} ref={ref} {...props} />
40
- })
41
-
42
- interface DrawerButtonProps {
43
- anchor: (props: { open: () => void }) => ReactNode
44
- content: (props: { close: () => void }) => ReactNode
45
- title: string
46
- dialogProps?: Omit<DialogProps, 'open'>
47
- onDialogClose?: () => void
48
- }
49
-
50
- export default function DialogButton({
51
- content,
52
- title,
53
- dialogProps,
54
- onDialogClose,
55
- anchor,
56
- }: DrawerButtonProps) {
57
- const [open, setOpen] = useState(false)
58
-
59
- const onClose = () => {
60
- onDialogClose && onDialogClose()
61
- setOpen(false)
62
- }
63
-
64
- const onOpen = () => {
65
- setOpen(true)
66
- }
67
-
68
- return (
69
- <>
70
- {anchor({
71
- open: onOpen,
72
- })}
73
- <CustomDialog
74
- open={open}
75
- content={content}
76
- dialogProps={dialogProps}
77
- onClose={onClose}
78
- title={title}
79
- />
80
- </>
81
- )
82
- }
83
-
84
- interface CustomDialogProps {
85
- content: (props: { close: () => void }) => ReactNode
86
- title: string
87
- onClose: () => void
88
- open: boolean
89
- dialogProps?: Omit<DialogProps, 'open'>
90
- }
91
-
92
- export const CustomDialog = ({
93
- onClose,
94
- dialogProps,
95
- title,
96
- content,
97
- open,
98
- }: CustomDialogProps) => {
99
- return (
100
- <Dialog
101
- PaperProps={{
102
- ...dialogProps?.PaperProps,
103
- elevation: 2,
104
- sx: { borderRadius: '10px' },
105
- }}
106
- fullWidth
107
- onClose={onClose}
108
- open={open}
109
- transitionDuration={140}
110
- TransitionComponent={Transition}
111
- sx={{
112
- ...dialogProps?.sx,
113
- '& .MuiBackdrop-root': { backgroundColor: 'rgba(0, 0, 0, 0.4)' },
114
- }}
115
- {...dialogProps}
116
- >
117
- <StyledDialogHeader>
118
- <DialogTitle>{title}</DialogTitle>
119
- <IconButton onClick={onClose} sx={{ color: 'black' }}>
120
- <Close />
121
- </IconButton>
122
- </StyledDialogHeader>
123
- <StyledDialogContent>{content({ close: onClose })}</StyledDialogContent>
124
- </Dialog>
125
- )
126
- }
1
+ import { Close } from '@mui/icons-material'
2
+ import {
3
+ Box,
4
+ Dialog,
5
+ DialogProps,
6
+ DialogTitle,
7
+ Grow,
8
+ IconButton,
9
+ styled,
10
+ } from '@mui/material'
11
+ import { TransitionProps } from '@mui/material/transitions'
12
+ import { forwardRef, ReactNode, useState } from 'react'
13
+ import { SCROLLBAR_DARK } from '../../theme/muiTheme'
14
+
15
+ const StyledDialogHeader = styled(Box)(() => ({
16
+ height: '64px',
17
+ backgroundColor: '#f7f7f7',
18
+ display: 'flex',
19
+ justifyContent: 'space-between',
20
+ alignItems: 'end',
21
+ padding: '0.6rem 1rem',
22
+ paddingBottom: '10px',
23
+ }))
24
+
25
+ const StyledDialogContent = styled(Box)(() => ({
26
+ width: '100%',
27
+ padding: '1rem',
28
+ maxHeight: 'calc(100vh - 64px)',
29
+ overflow: 'auto',
30
+ ...SCROLLBAR_DARK,
31
+ }))
32
+
33
+ export const Transition = forwardRef(function Transition(
34
+ props: TransitionProps & {
35
+ children: React.ReactElement
36
+ },
37
+ ref: React.Ref<unknown>,
38
+ ) {
39
+ return <Grow timeout={1000} ref={ref} {...props} />
40
+ })
41
+
42
+ interface DrawerButtonProps {
43
+ anchor: (props: { open: () => void }) => ReactNode
44
+ content: (props: { close: () => void }) => ReactNode
45
+ title: string
46
+ dialogProps?: Omit<DialogProps, 'open'>
47
+ onDialogClose?: () => void
48
+ }
49
+
50
+ export default function DialogButton({
51
+ content,
52
+ title,
53
+ dialogProps,
54
+ onDialogClose,
55
+ anchor,
56
+ }: DrawerButtonProps) {
57
+ const [open, setOpen] = useState(false)
58
+
59
+ const onClose = () => {
60
+ onDialogClose && onDialogClose()
61
+ setOpen(false)
62
+ }
63
+
64
+ const onOpen = () => {
65
+ setOpen(true)
66
+ }
67
+
68
+ return (
69
+ <>
70
+ {anchor({
71
+ open: onOpen,
72
+ })}
73
+ <CustomDialog
74
+ open={open}
75
+ content={content}
76
+ dialogProps={dialogProps}
77
+ onClose={onClose}
78
+ title={title}
79
+ />
80
+ </>
81
+ )
82
+ }
83
+
84
+ interface CustomDialogProps {
85
+ content: (props: { close: () => void }) => ReactNode
86
+ title: string
87
+ onClose: () => void
88
+ open: boolean
89
+ dialogProps?: Omit<DialogProps, 'open'>
90
+ }
91
+
92
+ export const CustomDialog = ({
93
+ onClose,
94
+ dialogProps,
95
+ title,
96
+ content,
97
+ open,
98
+ }: CustomDialogProps) => {
99
+ return (
100
+ <Dialog
101
+ PaperProps={{
102
+ ...dialogProps?.PaperProps,
103
+ elevation: 2,
104
+ sx: { borderRadius: '10px' },
105
+ }}
106
+ fullWidth
107
+ onClose={onClose}
108
+ open={open}
109
+ transitionDuration={140}
110
+ TransitionComponent={Transition}
111
+ sx={{
112
+ ...dialogProps?.sx,
113
+ '& .MuiBackdrop-root': { backgroundColor: 'rgba(0, 0, 0, 0.4)' },
114
+ }}
115
+ {...dialogProps}
116
+ >
117
+ <StyledDialogHeader>
118
+ <DialogTitle>{title}</DialogTitle>
119
+ <IconButton onClick={onClose} sx={{ color: 'black' }}>
120
+ <Close />
121
+ </IconButton>
122
+ </StyledDialogHeader>
123
+ <StyledDialogContent>{content({ close: onClose })}</StyledDialogContent>
124
+ </Dialog>
125
+ )
126
+ }
@@ -1,115 +1,115 @@
1
- import { Close } from '@mui/icons-material'
2
- import {
3
- Box,
4
- ButtonProps,
5
- DialogTitle,
6
- Drawer,
7
- DrawerProps,
8
- IconButton,
9
- styled,
10
- } from '@mui/material'
11
- import { ReactNode, useState } from 'react'
12
- import { SCROLLBAR_DARK } from '../../theme/muiTheme'
13
-
14
- const StyledDrawerHeader = styled(Box)(({ theme }) => ({
15
- height: '64px',
16
- backgroundColor: '#f7f7f7',
17
- display: 'flex',
18
- justifyContent: 'space-between',
19
- alignItems: 'end',
20
- padding: '0.6rem 1rem',
21
- paddingBottom: '10px',
22
- }))
23
-
24
- const StyledDrawerContent = styled(Box)(({ theme }) => ({
25
- padding: '1rem',
26
- height: 'calc(100vh - 64px)',
27
- overflowY: 'auto',
28
- paddingBottom: '4rem',
29
- ...SCROLLBAR_DARK,
30
- }))
31
-
32
- export interface DrawerButtonProps {
33
- anchor: (props: { open: () => void }) => ReactNode
34
- content: (props: { close: () => void }) => ReactNode
35
- title: string | ReactNode
36
- btnTxt?: string | ReactNode
37
- btnProps?: ButtonProps
38
- }
39
-
40
- export default function DrawerButton({
41
- content,
42
- title,
43
- anchor,
44
- }: DrawerButtonProps) {
45
- const [open, setOpen] = useState(false)
46
-
47
- const onOpen = () => {
48
- setOpen(true)
49
- }
50
-
51
- const onClose = () => {
52
- setOpen(false)
53
- }
54
- return (
55
- <>
56
- {anchor({ open: onOpen })}
57
- <CustomDrawer
58
- content={content}
59
- onClose={onClose}
60
- open={open}
61
- title={title}
62
- />
63
- </>
64
- )
65
- }
66
-
67
- interface CustomDrawerProps {
68
- content: (props: { close: () => void }) => ReactNode
69
- title: string | ReactNode
70
- drawerProps?: Omit<DrawerProps, 'open'>
71
- onClose: () => void
72
- open: boolean
73
- }
74
-
75
- export const CustomDrawer = ({
76
- onClose,
77
- drawerProps,
78
- title,
79
- content,
80
- open,
81
- }: CustomDrawerProps) => {
82
- return (
83
- <Drawer
84
- anchor="right"
85
- elevation={2}
86
- onClose={onClose}
87
- open={open}
88
- PaperProps={{
89
- ...drawerProps?.PaperProps,
90
- elevation: 2,
91
- }}
92
- sx={{
93
- ...drawerProps?.sx,
94
- zIndex: 500,
95
- '& .MuiDrawer-paper': {
96
- boxSizing: 'border-box',
97
- width: 600,
98
- },
99
- '& .MuiBackdrop-root': {
100
- backgroundColor: 'rgba(0, 0, 0, 0.4)',
101
- },
102
- }}
103
- transitionDuration={140}
104
- {...drawerProps}
105
- >
106
- <StyledDrawerHeader>
107
- <DialogTitle>{title}</DialogTitle>
108
- <IconButton onClick={onClose} sx={{ color: 'black' }}>
109
- <Close />
110
- </IconButton>
111
- </StyledDrawerHeader>
112
- <StyledDrawerContent>{content({ close: onClose })}</StyledDrawerContent>
113
- </Drawer>
114
- )
115
- }
1
+ import { Close } from '@mui/icons-material'
2
+ import {
3
+ Box,
4
+ ButtonProps,
5
+ DialogTitle,
6
+ Drawer,
7
+ DrawerProps,
8
+ IconButton,
9
+ styled,
10
+ } from '@mui/material'
11
+ import { ReactNode, useState } from 'react'
12
+ import { SCROLLBAR_DARK } from '../../theme/muiTheme'
13
+
14
+ const StyledDrawerHeader = styled(Box)(({ theme }) => ({
15
+ height: '64px',
16
+ backgroundColor: '#f7f7f7',
17
+ display: 'flex',
18
+ justifyContent: 'space-between',
19
+ alignItems: 'end',
20
+ padding: '0.6rem 1rem',
21
+ paddingBottom: '10px',
22
+ }))
23
+
24
+ const StyledDrawerContent = styled(Box)(({ theme }) => ({
25
+ padding: '1rem',
26
+ height: 'calc(100vh - 64px)',
27
+ overflowY: 'auto',
28
+ paddingBottom: '4rem',
29
+ ...SCROLLBAR_DARK,
30
+ }))
31
+
32
+ export interface DrawerButtonProps {
33
+ anchor: (props: { open: () => void }) => ReactNode
34
+ content: (props: { close: () => void }) => ReactNode
35
+ title: string | ReactNode
36
+ btnTxt?: string | ReactNode
37
+ btnProps?: ButtonProps
38
+ }
39
+
40
+ export default function DrawerButton({
41
+ content,
42
+ title,
43
+ anchor,
44
+ }: DrawerButtonProps) {
45
+ const [open, setOpen] = useState(false)
46
+
47
+ const onOpen = () => {
48
+ setOpen(true)
49
+ }
50
+
51
+ const onClose = () => {
52
+ setOpen(false)
53
+ }
54
+ return (
55
+ <>
56
+ {anchor({ open: onOpen })}
57
+ <CustomDrawer
58
+ content={content}
59
+ onClose={onClose}
60
+ open={open}
61
+ title={title}
62
+ />
63
+ </>
64
+ )
65
+ }
66
+
67
+ interface CustomDrawerProps {
68
+ content: (props: { close: () => void }) => ReactNode
69
+ title: string | ReactNode
70
+ drawerProps?: Omit<DrawerProps, 'open'>
71
+ onClose: () => void
72
+ open: boolean
73
+ }
74
+
75
+ export const CustomDrawer = ({
76
+ onClose,
77
+ drawerProps,
78
+ title,
79
+ content,
80
+ open,
81
+ }: CustomDrawerProps) => {
82
+ return (
83
+ <Drawer
84
+ anchor="right"
85
+ elevation={2}
86
+ onClose={onClose}
87
+ open={open}
88
+ PaperProps={{
89
+ ...drawerProps?.PaperProps,
90
+ elevation: 2,
91
+ }}
92
+ sx={{
93
+ ...drawerProps?.sx,
94
+ zIndex: 500,
95
+ '& .MuiDrawer-paper': {
96
+ boxSizing: 'border-box',
97
+ width: 600,
98
+ },
99
+ '& .MuiBackdrop-root': {
100
+ backgroundColor: 'rgba(0, 0, 0, 0.4)',
101
+ },
102
+ }}
103
+ transitionDuration={140}
104
+ {...drawerProps}
105
+ >
106
+ <StyledDrawerHeader>
107
+ <DialogTitle>{title}</DialogTitle>
108
+ <IconButton onClick={onClose} sx={{ color: 'black' }}>
109
+ <Close />
110
+ </IconButton>
111
+ </StyledDrawerHeader>
112
+ <StyledDrawerContent>{content({ close: onClose })}</StyledDrawerContent>
113
+ </Drawer>
114
+ )
115
+ }
@@ -1,4 +1,4 @@
1
- import DialogButton from './DialogButton'
2
- import DrawerButton from './DrawerButton'
3
-
4
- export { DialogButton, DrawerButton }
1
+ import DialogButton from './DialogButton'
2
+ import DrawerButton from './DrawerButton'
3
+
4
+ export { DialogButton, DrawerButton }
@@ -1,32 +1,32 @@
1
- import { Box, Typography } from '@mui/material'
2
- import Image from './Image'
3
- import { ReactNode } from 'react'
4
-
5
- interface Props {
6
- imageSrc: string
7
- height?: string
8
- message?: string | ReactNode
9
- }
10
-
11
- export default function NoData({
12
- imageSrc,
13
- height = '300px',
14
- message = 'No Data Found',
15
- }: Props) {
16
- return (
17
- <Box
18
- sx={{
19
- marginTop: '20px',
20
- }}
21
- >
22
- <Image alt="No Data Found" height={height} width="auto" src={imageSrc} />
23
- {typeof message === 'string' ? (
24
- <Typography marginTop={'20px'} textAlign={'center'}>
25
- {message}
26
- </Typography>
27
- ) : (
28
- <>{message}</>
29
- )}
30
- </Box>
31
- )
32
- }
1
+ import { Box, Typography } from '@mui/material'
2
+ import Image from './Image'
3
+ import { ReactNode } from 'react'
4
+
5
+ interface Props {
6
+ imageSrc: string
7
+ height?: string
8
+ message?: string | ReactNode
9
+ }
10
+
11
+ export default function NoData({
12
+ imageSrc,
13
+ height = '300px',
14
+ message = 'No Data Found',
15
+ }: Props) {
16
+ return (
17
+ <Box
18
+ sx={{
19
+ marginTop: '20px',
20
+ }}
21
+ >
22
+ <Image alt="No Data Found" height={height} width="auto" src={imageSrc} />
23
+ {typeof message === 'string' ? (
24
+ <Typography marginTop={'20px'} textAlign={'center'}>
25
+ {message}
26
+ </Typography>
27
+ ) : (
28
+ <>{message}</>
29
+ )}
30
+ </Box>
31
+ )
32
+ }
@@ -1,12 +1,12 @@
1
- import { Box, BoxProps, styled } from '@mui/material'
2
-
3
- const StyledPageContent = styled(Box)(() => ({
4
- paddingLeft: '25px',
5
- paddingRight: '25px',
6
- marginTop: '16px',
7
- paddingBottom: '3rem',
8
- }))
9
-
10
- export function PageContent(props: BoxProps) {
11
- return <StyledPageContent {...props}>{props.children}</StyledPageContent>
12
- }
1
+ import { Box, BoxProps, styled } from '@mui/material'
2
+
3
+ const StyledPageContent = styled(Box)(() => ({
4
+ paddingLeft: '25px',
5
+ paddingRight: '25px',
6
+ marginTop: '16px',
7
+ paddingBottom: '3rem',
8
+ }))
9
+
10
+ export function PageContent(props: BoxProps) {
11
+ return <StyledPageContent {...props}>{props.children}</StyledPageContent>
12
+ }