@rabex-kit/rabex-ui 0.1.56 → 0.2.1

package/dist/Container/index.d.ts

@@ -8,7 +8,7 @@ export declare type ContainerProps = MuiContainerProps;
  * You can read Material-UI Container Documentation [here](https://mui.com/material-ui/api/Container/).
  *
  * ```typescript
- *  import { Container } from '@rabex-kit/core';
+ *  import { Container } from '@rabex-kit/rabex-ui';
  *  ```
  *
  *

package/dist/Theme/Container/index.d.ts

@@ -5,6 +5,18 @@ declare const _default: {
                 '&.MuiContainer-root': {
                     padding: number;
                 };
+                '@media (min-width: 1200px)': {
+                    maxWidth: string;
+                };
+                '@media (min-width: 1440px)': {
+                    maxWidth: string;
+                };
+                '@media (min-width: 1536px)': {
+                    maxWidth: string;
+                };
+                '@media (min-width: 1920px)': {
+                    maxWidth: string;
+                };
             };
         };
     };

package/dist/hooks/useResponsive.d.ts

@@ -8,4 +8,5 @@ export default function useResponsive(): {
         xxl?: any;
         xxxl?: any;
     }) => any;
+    currentBreakpoint: string;
 };

package/dist/rabex-ui.cjs.development.js

@@ -669,8 +669,20 @@ function useResponsive() {
     if (_hasValue(props.xxxl) && isXXXL) result = props.xxxl;
     return result;
   }
+  // Determine current breakpoint from media queries
+  var getCurrentBreakpoint = function getCurrentBreakpoint() {
+    if (isXXXL) return 'xxxl';
+    if (isXXL) return 'xxl';
+    if (isXL) return 'xl';
+    if (isLG) return 'lg';
+    if (isMD) return 'md';
+    if (isSM) return 'sm';
+    return 'xs';
+  };
+  var currentBreakpoint = getCurrentBreakpoint();
   return {
-    matches: matches
+    matches: matches,
+    currentBreakpoint: currentBreakpoint
   };
 }
 
@@ -4806,6 +4818,19 @@ var RabexContainer = {
       root: {
         '&.MuiContainer-root': {
           padding: 0
+        },
+        // These styles will apply to all containers
+        '@media (min-width: 1200px)': {
+          maxWidth: '928px'
+        },
+        '@media (min-width: 1440px)': {
+          maxWidth: '1168px'
+        },
+        '@media (min-width: 1536px)': {
+          maxWidth: '1264px'
+        },
+        '@media (min-width: 1920px)': {
+          maxWidth: '1376px'
         }
       }
     }
@@ -5082,7 +5107,7 @@ var Collapse = function Collapse(_ref) {
  * You can read Material-UI Container Documentation [here](https://mui.com/material-ui/api/Container/).
  *
  * ```typescript
- *  import { Container } from '@rabex-kit/core';
+ *  import { Container } from '@rabex-kit/rabex-ui';
  *  ```
  *
  *