Skip to content

Commit 1db8cee

Browse files
author
Krzysztof Wilk
committed
Generate version 4.1.0
1 parent 3d42089 commit 1db8cee

File tree

80 files changed

+537
-1509
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

80 files changed

+537
-1509
lines changed

‎README.txt

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
MDB 5 React
22

3-
Version: FREE 4.0.0
3+
Version: FREE 4.1.0
44

55
Documentation:
66
https://mdbootstrap.com/docs/b5/react/

‎app/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "mdb-react-ui-kit-demo",
3-
"version": "4.0.0",
3+
"version": "4.1.0",
44
"main": "index.js",
55
"repository": {
66
"type": "git",

‎app/src/components/Accordion/AccordionItem/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import React from 'react';
2-
import { BaseComponent } from 'src/types/baseComponent';
1+
import React from "react";
2+
import { BaseComponent } from "../../../types/baseComponent";
33

44
interface AccordionItemProps extends BaseComponent {
55
bodyClassName?: string;

‎app/src/components/Accordion/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import React from 'react';
2-
import { BaseComponent } from 'src/types/baseComponent';
1+
import React from "react";
2+
import { BaseComponent } from "../../types/baseComponent";
33

44
interface AccordionProps extends BaseComponent {
55
alwaysOpen?: boolean;

‎app/src/components/Badge/types.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React from 'react';
2-
import { BaseComponent } from 'src/types/baseComponent';
3-
import { backgroundColor } from 'src/types/colors';
1+
import React from "react";
2+
import { BaseComponent } from "../../types/baseComponent";
3+
import { backgroundColor } from "../../types/colors";
44

55
interface BadgeProps extends BaseComponent {
66
color?: backgroundColor;

‎app/src/components/ButtonGroup/types.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
2-
import { size } from 'src/types/size';
1+
import { BaseComponent } from "../../types/baseComponent";
2+
import { size } from "../../types/size";
33

44
interface ButtonGroupProps extends BaseComponent {
55
ref?: React.ForwardedRef<HTMLAllCollection>;
66
size?: size;
7-
shadow?: '0' | '1' | '2' | '3' | '4' | '5';
7+
shadow?: "0" | "1" | "2" | "3" | "4" | "5";
88
toolbar?: boolean;
99
vertical?: boolean;
1010
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardBody/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface CardBodyProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardFooter/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
2-
import { backgroundColor } from 'src/types/colors';
1+
import { BaseComponent } from "../../../types/baseComponent";
2+
import { backgroundColor } from "../../../types/colors";
33

44
interface CardFooterProps extends BaseComponent {
55
border?: string;

‎app/src/components/Card/CardGroup/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface CardGroupProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardHeader/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
2-
import { backgroundColor } from 'src/types/colors';
1+
import { BaseComponent } from "../../../types/baseComponent";
2+
import { backgroundColor } from "../../../types/colors";
33

44
interface CardHeaderProps extends BaseComponent {
55
border?: string;

‎app/src/components/Card/CardOverlay/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface CardOverlayProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardSubTitle/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from '../../../types/baseComponent';
22

33
interface CardSubTitleProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardText/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface CardTextProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/CardTitle/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface CardTitleProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Card/types.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1-
import { backgroundColor } from 'src/types/colors';
2-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { backgroundColor } from "../../types/colors";
2+
import { BaseComponent } from "../../types/baseComponent";
33

44
interface CardProps extends BaseComponent {
55
alignment?: string;
66
border?: string;
77
background?: backgroundColor;
8-
shadow?: '0' | '1' | '2' | '3' | '4' | '5';
8+
shadow?: "0" | "1" | "2" | "3" | "4" | "5";
99
ref?: React.ForwardedRef<HTMLAllCollection>;
1010
tag?: React.ComponentProps<any>;
1111
}

‎app/src/components/Carousel/Carousel.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ const MDBCarousel: React.FC<CarouselProps> = ({
3232
const [active, setActive] = useState(0);
3333
const [imagesCount, setImagesCount] = useState(0);
3434
const [clientTouch, setClientTouch] = useState({ initialX: 0, initialY: 0 });
35-
const [isTransitioning, setIsTransitioning] = useState(false)
35+
const [isTransitioning, setIsTransitioning] = useState(false);
3636

3737
const carouselInnerRef = useRef<HTMLElement>(null);
3838
const carouselReference = carouselRef ? carouselRef : carouselInnerRef;
@@ -162,7 +162,7 @@ const MDBCarousel: React.FC<CarouselProps> = ({
162162
nextElement.classList.add(directionalClassName);
163163

164164
const completeCallBack = () => {
165-
setIsTransitioning(false)
165+
setIsTransitioning(false);
166166
nextElement.classList.remove(directionalClassName, orderClassName);
167167
nextElement.classList.add('active');
168168

@@ -286,9 +286,9 @@ const MDBCarousel: React.FC<CarouselProps> = ({
286286
setImagesCount(imgLength);
287287
}, [carouselReference]);
288288

289-
useEffect(()=>{
290-
onSlide?.()
291-
},[isTransitioning, onSlide])
289+
useEffect(() => {
290+
onSlide?.();
291+
}, [isTransitioning, onSlide]);
292292

293293
useEffect(() => {
294294
if (keyboard) {

‎app/src/components/Carousel/index.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ declare const MDBCarousel: React.FunctionComponent<{
66
className?: string;
77
fade?: boolean;
88
keyboard?: boolean;
9-
onSlide?: ()=>any;
9+
onSlide?: () => any;
1010
pause?: boolean;
1111
showControls?: boolean;
1212
showIndicators?: boolean;

‎app/src/components/Dropdown/DropdownDivider/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface DropdownDividerProps extends BaseComponent {
44
tag?: React.ComponentProps<any>;

‎app/src/components/Dropdown/DropdownMenu/types.tsx

+14-14
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface DropdownMenuProps extends BaseComponent {
44
dark?: boolean;
55
responsive?:
6-
| ''
7-
| 'start'
8-
| 'end'
9-
| 'sm-start'
10-
| 'md-start'
11-
| 'lg-start'
12-
| 'xl-start'
13-
| 'xxl-start'
14-
| 'sm-end'
15-
| 'md-end'
16-
| 'lg-end'
17-
| 'xl-end'
18-
| 'xxl-end';
6+
| ""
7+
| "start"
8+
| "end"
9+
| "sm-start"
10+
| "md-start"
11+
| "lg-start"
12+
| "xl-start"
13+
| "xxl-start"
14+
| "sm-end"
15+
| "md-end"
16+
| "lg-end"
17+
| "xl-end"
18+
| "xxl-end";
1919
tag?: React.ComponentProps<any>;
2020
}
2121

‎app/src/components/Dropdown/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { placement } from 'src/types/placement';
2-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { placement } from "../../types/placement";
2+
import { BaseComponent } from "../../types/baseComponent";
33

44
interface DropdownProps extends BaseComponent {
55
animation?: boolean;

‎app/src/components/ListGroup/ListGroupItem/types.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React from 'react';
2-
import { backgroundColor } from 'src/types/colors';
3-
import { BaseComponent } from 'src/types/baseComponent';
1+
import React from "react";
2+
import { backgroundColor } from "../../../types/colors";
3+
import { BaseComponent } from "../../../types/baseComponent";
44

55
interface ListGroupItemProps extends BaseComponent {
66
action?: boolean;

‎app/src/components/ListGroup/types.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import React from 'react';
2-
import { BaseComponent } from 'src/types/baseComponent';
1+
import React from "react";
2+
import { BaseComponent } from "../../types/baseComponent";
33

44
interface ListGroupProps extends BaseComponent {
55
horizontal?: boolean;

‎app/src/components/Modal/Modal.tsx

+29-19
Original file line numberDiff line numberDiff line change
@@ -6,19 +6,20 @@ import ReactDOM from 'react-dom';
66
const MDBModal: React.FC<ModalProps> = ({
77
animationDirection,
88
appendToBody,
9-
backdrop,
9+
backdrop = true,
1010
children,
1111
className,
12-
closeOnEsc,
12+
closeOnEsc = true,
1313
setShow,
14-
leaveHiddenModal,
14+
leaveHiddenModal = true,
1515
modalRef,
1616
onHide,
1717
onHidePrevented,
1818
onShow,
1919
show,
2020
staticBackdrop,
21-
tag: Tag,
21+
nonInvasive = false,
22+
tag: Tag = 'div',
2223
...props
2324
}) => {
2425
const [isOpenBackdrop, setIsOpenBackrop] = useState(show);
@@ -37,6 +38,7 @@ const MDBModal: React.FC<ModalProps> = ({
3738
animationDirection,
3839
'fade',
3940
isOpenModal && 'show',
41+
isOpenBackdrop && nonInvasive && 'modal-non-invasive-show',
4042
className
4143
);
4244
const backdropClasses = clsx('modal-backdrop', 'fade', isOpenBackdrop && 'show');
@@ -47,7 +49,7 @@ const MDBModal: React.FC<ModalProps> = ({
4749

4850
setTimeout(() => {
4951
setIsOpenBackrop(false);
50-
setShow && setShow(false);
52+
setShow?.(false);
5153
}, 150);
5254
setTimeout(() => {
5355
setInnerShow(false);
@@ -56,7 +58,7 @@ const MDBModal: React.FC<ModalProps> = ({
5658
}, [onHide, setShow]);
5759

5860
const handleClickOutside = useCallback(
59-
(event: any) => {
61+
(event: MouseEvent) => {
6062
if (isOpenModal && event.target === modalReference.current) {
6163
if (!staticBackdrop) {
6264
closeModal();
@@ -100,10 +102,10 @@ const MDBModal: React.FC<ModalProps> = ({
100102
useEffect(() => {
101103
const focusable = modalReference.current?.querySelectorAll(
102104
'button, a, input, select, textarea, [tabindex]'
103-
) as any as Array<HTMLElement>;
105+
) as NodeListOf<HTMLElement>;
104106

105107
const filtered = Array.from(focusable)
106-
.filter((el: any) => el.tabIndex !== -1)
108+
.filter((el) => el.tabIndex !== -1)
107109
.sort((a, b) => {
108110
if (a.tabIndex === b.tabIndex) {
109111
return 0;
@@ -140,7 +142,7 @@ const MDBModal: React.FC<ModalProps> = ({
140142

141143
const hasVScroll = window.innerWidth > document.documentElement.clientWidth && window.innerWidth >= 576;
142144

143-
if (innerShow && hasVScroll) {
145+
if (innerShow && hasVScroll && !nonInvasive) {
144146
const scrollbarWidth = getScrollbarWidth();
145147
document.body.classList.add('modal-open');
146148
document.body.style.overflow = 'hidden';
@@ -156,7 +158,7 @@ const MDBModal: React.FC<ModalProps> = ({
156158
document.body.style.overflow = '';
157159
document.body.style.paddingRight = '';
158160
};
159-
}, [innerShow]);
161+
}, [innerShow, nonInvasive]);
160162

161163
useEffect(() => {
162164
if (show) {
@@ -167,22 +169,24 @@ const MDBModal: React.FC<ModalProps> = ({
167169
}, 0);
168170
setTimeout(() => {
169171
setIsOpenModal(true);
170-
setShow && setShow(true);
172+
setShow?.(true);
171173
}, 150);
172174
} else {
173175
closeModal();
174176
}
175177
}, [show, closeModal, setShow, onShow]);
176178

177179
useEffect(() => {
178-
window.addEventListener('click', handleClickOutside);
179-
window.addEventListener('keydown', handleKeydown);
180+
if (!nonInvasive) {
181+
window.addEventListener('click', handleClickOutside);
182+
window.addEventListener('keydown', handleKeydown);
183+
}
180184

181185
return () => {
182186
window.removeEventListener('click', handleClickOutside);
183187
window.removeEventListener('keydown', handleKeydown);
184188
};
185-
}, [handleKeydown, handleClickOutside]);
189+
}, [handleKeydown, handleClickOutside, nonInvasive]);
186190

187191
const appendToBodyTemplate = (
188192
<>
@@ -192,12 +196,15 @@ const MDBModal: React.FC<ModalProps> = ({
192196
<Tag
193197
className={classes}
194198
ref={modalReference}
195-
style={{ display: innerShow || show ? 'block' : 'none' }}
199+
style={{ display: innerShow || show ? 'block' : 'none', pointerEvents: nonInvasive ? 'none' : 'initial' }}
196200
{...props}
197201
>
198202
{children}
199203
</Tag>
200-
{ReactDOM.createPortal(backdrop && innerShow && <div className={backdropClasses}></div>, document.body)}
204+
{ReactDOM.createPortal(
205+
backdrop && innerShow && !nonInvasive && <div className={backdropClasses}></div>,
206+
document.body
207+
)}
201208
</>,
202209
document.body
203210
)}
@@ -211,18 +218,21 @@ const MDBModal: React.FC<ModalProps> = ({
211218
<Tag
212219
className={classes}
213220
ref={modalReference}
214-
style={{ display: innerShow || show ? 'block' : 'none' }}
221+
style={{ display: innerShow || show ? 'block' : 'none', pointerEvents: nonInvasive ? 'none' : 'initial' }}
215222
{...props}
216223
>
217224
{children}
218225
</Tag>
219-
{ReactDOM.createPortal(backdrop && innerShow && <div className={backdropClasses}></div>, document.body)}
226+
{ReactDOM.createPortal(
227+
backdrop && innerShow && !nonInvasive && <div className={backdropClasses}></div>,
228+
document.body
229+
)}
220230
</>
221231
)}
222232
</>
223233
);
224234

225235
return <>{appendToBody ? appendToBodyTemplate : modalTemplate}</>;
226236
};
227-
MDBModal.defaultProps = { tag: 'div', backdrop: true, closeOnEsc: true, leaveHiddenModal: true };
237+
228238
export default MDBModal;

‎app/src/components/Modal/ModalBody/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface ModalBodyProps extends BaseComponent {
44
ref?: React.ForwardedRef<HTMLAllCollection>;

‎app/src/components/Modal/ModalContent/types.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BaseComponent } from 'src/types/baseComponent';
1+
import { BaseComponent } from "../../../types/baseComponent";
22

33
interface ModalContentProps extends BaseComponent {
44
ref?: React.ForwardedRef<HTMLAllCollection>;

0 commit comments

Comments
 (0)