1.1.0

Author: unknown

README.txt

@@ -1,6 +1,6 @@
 MDB 5 React
 
-Version: FREE 1.0.0
+Version: FREE 1.1.0
 
 Documentation:
 https://mdbootstrap.com/docs/b5/react/

app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdb-react-ui-kit-demo",
-  "version": "1.0.0",
+  "version": "1.1.0",
   "main": "index.js",
   "repository": {
     "type": "git",

app/src/components/Button/Button.tsx

@@ -101,6 +101,6 @@ const MDBBtn: React.FC<ButtonProps> = React.forwardRef<HTMLAllCollection, Button
   }
 );
 
-MDBBtn.defaultProps = { tag: 'button', type: 'button', role: 'button', color: 'primary' };
+MDBBtn.defaultProps = { tag: 'button', role: 'button', color: 'primary' };
 
 export default MDBBtn;

app/src/components/Modal/Modal.tsx

@@ -37,7 +37,7 @@ const MDBModal: React.FC<ModalProps> = ({
 
     setTimeout(() => {
       setIsOpenBackrop(false);
-      getOpenState(false);
+      getOpenState && getOpenState(false);
     }, 150);
     setTimeout(() => {
       setInnerShow(false);
@@ -104,7 +104,7 @@ const MDBModal: React.FC<ModalProps> = ({
       }, 0);
       setTimeout(() => {
         setIsOpenModal(true);
-        getOpenState(true);
+        getOpenState && getOpenState(true);
       }, 150);
     } else {
       closeModal();

app/src/forms/Input/Input.tsx

@@ -55,11 +55,15 @@ const MDBInput: React.FC<InputProps> = ({
 
   useEffect(() => {
     if (labelReference.current) {
-      setLabelWidth(labelReference.current.clientWidth * 0.8 + 8);
+      if (labelReference.current?.clientWidth !== 0) setLabelWidth(labelReference.current.clientWidth * 0.8 + 8);
     }
+  }, [labelReference, labelReference.current?.clientWidth]);
 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  const setWidth = () => {
+    if (labelReference.current) {
+      setLabelWidth(labelReference.current.clientWidth * 0.8 + 8);
+    }
+  };
 
   useEffect(() => {
     if (value === undefined) return;
@@ -86,6 +90,7 @@ const MDBInput: React.FC<InputProps> = ({
           className={inputClasses}
           onBlur={handleBlur}
           onChange={handleChange}
+          onFocus={setWidth}
           value={value}
           id={id}
           ref={inputReference}
@@ -96,6 +101,7 @@ const MDBInput: React.FC<InputProps> = ({
           className={inputClasses}
           onBlur={handleBlur}
           onChange={handleChange}
+          onFocus={setWidth}
           value={value}
           id={id}
           ref={inputReference}

app/src/navigation/Navbar/Navbar.tsx

@@ -34,15 +34,14 @@ const MDBNavbar: React.FC<NavbarProps> = React.forwardRef<HTMLAllCollection, Nav
 
     const classes = clsx(
       {
-        'fixed-top': fixed,
-        'sticky-top': sticky,
-
         'navbar-light': light,
         'navbar-dark': dark,
         'scrolling-navbar': scrolling || scrollingNavbarOffset,
         'top-nav-collapse': collapsed,
         [`text-${color}`]: color && transparent ? collapsed : color,
       },
+      fixed && `fixed-${fixed}`,
+      sticky && 'sticky-top',
       'navbar',
       expand && getExpandClass(expand),
       bgColor && `bg-${bgColor}`,

app/src/navigation/Navbar/index.d.ts

@@ -23,7 +23,7 @@ declare const MDBNavbar: React.FunctionComponent<{
     | 'white-50';
   expand?: string | boolean;
   bgColor?: 'white' | 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'light' | 'dark';
-  fixed?: boolean;
+  fixed?: string;
   sticky?: boolean;
 }>;
 

app/src/navigation/Navbar/types.tsx

@@ -8,7 +8,7 @@ type NavbarProps = {
   color?: string;
   expand?: string | boolean;
   bgColor?: string;
-  fixed?: boolean;
+  fixed?: string;
   sticky?: boolean;
 };
 

dist/index.d.ts

@@ -305,7 +305,7 @@ declare const MDBNavbar: React$1.FunctionComponent<{
     | 'white-50';
   expand?: string | boolean;
   bgColor?: 'white' | 'primary' | 'secondary' | 'success' | 'info' | 'warning' | 'danger' | 'light' | 'dark';
-  fixed?: boolean;
+  fixed?: string;
   sticky?: boolean;
 }>;