@epam/ai-dial-ui-kit 0.7.0-rc.49 → 0.7.0-rc.50
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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { FC, ReactNode, Ref } from 'react';
|
|
1
|
+
import { FC, ReactNode, Ref, RefObject } from 'react';
|
|
2
2
|
import { ColDef, GridApi } from 'ag-grid-community';
|
|
3
3
|
import { DialFile, DialRootFolder } from '../../models/file';
|
|
4
4
|
import { DialFoldersTreeProps } from './components/FoldersTree/FoldersTree';
|
|
@@ -138,6 +138,7 @@ export interface DialFileManagerProps {
|
|
|
138
138
|
destinationFolderPopupOptions?: DialFileManagerDestinationFolderPopupOptions;
|
|
139
139
|
conflictResolutionPopupOptions?: DialFileManagerConflictResolutionPopupOptions;
|
|
140
140
|
compactViewWidthBreakpoint?: number;
|
|
141
|
+
customBreakpointRef?: RefObject<HTMLElement | null>;
|
|
141
142
|
onPathChange?: (nextPath?: string) => void;
|
|
142
143
|
onTableFileClick?: (file: GridRow) => void;
|
|
143
144
|
handleSelectionClick?: (file: GridRow[]) => void;
|
|
@@ -42,6 +42,7 @@ export interface FileManagerContextValue {
|
|
|
42
42
|
conflictResolutionPopupOptions?: DialFileManagerConflictResolutionPopupOptions;
|
|
43
43
|
fileMetadataPopupOptions?: FileMetadataPopupOptions;
|
|
44
44
|
compactViewWidthBreakpoint?: number;
|
|
45
|
+
customBreakpointRef?: RefObject<HTMLElement | null>;
|
|
45
46
|
currentPath?: string;
|
|
46
47
|
setCurrentPath: (p?: string) => void;
|
|
47
48
|
searchValue: string;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { RefObject } from 'react';
|
|
1
2
|
/**
|
|
2
3
|
* A React hook that tracks the width of a DOM element and determines if it is smaller than a specified breakpoint.
|
|
3
4
|
*
|
|
@@ -6,6 +7,7 @@
|
|
|
6
7
|
* The value updates automatically when the element is resized.
|
|
7
8
|
*
|
|
8
9
|
* @param {number} breakpoint - The width in pixels used as the threshold. `isBelowBreakpoint` is true when the element's width is less than this value.
|
|
10
|
+
* @param customBreakpointRef - Custom ref to an element to observe instead of the one returned by this hook. If not provided, the hook will observe the element attached to `containerRef`.
|
|
9
11
|
* @returns {{ containerRef: RefObject<HTMLElement>, isBelowBreakpoint: boolean }} An object containing the ref to attach to your element and the boolean indicating if it is smaller than the breakpoint.
|
|
10
12
|
*
|
|
11
13
|
* @example
|
|
@@ -17,7 +19,7 @@
|
|
|
17
19
|
* </div>
|
|
18
20
|
* );
|
|
19
21
|
*/
|
|
20
|
-
export declare function useWidthBreakpoint(breakpoint: number): {
|
|
21
|
-
containerRef:
|
|
22
|
+
export declare function useWidthBreakpoint(breakpoint: number, customBreakpointRef?: RefObject<HTMLElement | null>): {
|
|
23
|
+
containerRef: RefObject<HTMLElement | null>;
|
|
22
24
|
isBelowBreakpoint: boolean;
|
|
23
25
|
};
|