@livechat/design-system-react-components 2.0.0-alpha.7 → 2.0.0-alpha.8

package/dist/components/AppFrame/components/MobileNavigation/MobileNavigation.d.ts

@@ -0,0 +1,3 @@
+import { IMobileNavigationProps } from './types';
+import * as React from 'react';
+export declare const MobileNavigation: React.FC<IMobileNavigationProps>;

package/dist/components/AppFrame/components/MobileNavigation/types.d.ts

@@ -0,0 +1,8 @@
+import { ComponentCoreProps } from '../../../../utils/types';
+import * as React from 'react';
+export interface IMobileNavigationProps extends ComponentCoreProps {
+    /**
+     * It will display your navigation elements
+     */
+    children: React.ReactNode;
+}

package/dist/components/AppFrame/components/index.d.ts

@@ -7,3 +7,4 @@ export { Navigation } from './Navigation/Navigation';
 export { NavigationTopBar, NavigationTopBarAlert, NavigationTopBarTitle, } from './NavigationTopBar/NavigationTopBar';
 export { SIDE_NAVIGATION_ITEM_TEST_ID, SIDE_NAVIGATION_ACTIVE_ITEM_TEST_ID, SIDE_NAVIGATION_PARENT_ICON_TEST_ID, } from './SideNavigationItem/constants';
 export { ExpirationCounter } from './ExpirationCounter/ExpirationCounter';
+export { MobileNavigation } from './MobileNavigation/MobileNavigation';

package/dist/components/AppFrame/types.d.ts

@@ -9,6 +9,10 @@ export interface IAppFrameProps extends ComponentCoreProps {
      * It will display navigation elements
      */
     navigation: React.ReactNode;
+    /**
+     * It will display mobile navigation elements
+     */
+    mobileNavigation: React.ReactNode;
     /**
      * It will display the side navigation bar
      */
@@ -29,6 +33,11 @@ export interface IAppFrameProps extends ComponentCoreProps {
      * The CSS class for the content container
      */
     contentClassName?: string;
+    /**
+     * The value that will determine on which resolution mobile view will be displayed
+     * @default 705
+     */
+    mobileViewBreakpoint?: number;
 }
 export type { INavigationProps } from './components/Navigation/types';
 export type { INavigationGroupProps } from './components/NavigationGroup/types';

package/dist/hooks/helpers.d.ts

@@ -0,0 +1,3 @@
+import { NODE } from './types';
+
+export declare const resizeCallback: (node: NODE, handler: (newSize: DOMRectReadOnly) => void) => void;

package/dist/hooks/index.d.ts

@@ -1,2 +1,3 @@
 export { useAnimations } from './useAnimations';
 export { useHeightResizer } from './useHeightResizer';
+export { useMobileViewDetector } from './useMobileViewDetector';

package/dist/hooks/types.d.ts

@@ -0,0 +1,13 @@
+export type NODE = HTMLDivElement | null;
+export type CALLBACK = (newSize: DOMRectReadOnly) => void;
+export interface IUseHeightResizer {
+    size: number;
+    handleResizeRef: (node: NODE) => void;
+}
+export interface IUseMobileViewDetectorProps {
+    mobileBreakpoint: number;
+}
+export interface IUseMobileViewDetector {
+    isMobile: boolean;
+    handleResizeRef: (node: NODE) => void;
+}

package/dist/hooks/useHeightResizer.d.ts

@@ -1,7 +1,3 @@
-type NODE = HTMLDivElement | null;
-interface IUseResizer {
-    size: number;
-    handleResize: (node: NODE) => void;
-}
-export declare const useHeightResizer: () => IUseResizer;
-export {};
+import { IUseHeightResizer } from './types';
+
+export declare const useHeightResizer: () => IUseHeightResizer;

package/dist/hooks/useMobileViewDetector.d.ts

@@ -0,0 +1,3 @@
+import { IUseMobileViewDetector, IUseMobileViewDetectorProps } from './types';
+
+export declare const useMobileViewDetector: ({ mobileBreakpoint, }: IUseMobileViewDetectorProps) => IUseMobileViewDetector;

package/dist/hooks/useSharedResizeObserver.d.ts

@@ -0,0 +1,6 @@
+import { CALLBACK, NODE } from './types';
+
+export declare const useSharedResizeObserver: {
+    observe: (node: NODE, callback: CALLBACK) => void;
+    unobserve: (node: NODE) => void;
+};