@gravity-ui/navigation 3.7.4 → 3.7.5
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.
- package/build/cjs/components/AllPagesPanel/index.d.ts +1 -1
- package/build/cjs/components/AsideHeader/AsideHeaderContext.d.ts +0 -2
- package/build/cjs/components/AsideHeader/components/CollapseButton/CollapseButton.d.ts +2 -1
- package/build/cjs/components/AsideHeader/components/PageLayout/AsideFallback.d.ts +2 -1
- package/build/cjs/components/AsideHeader/types.d.ts +4 -3
- package/build/cjs/components/CompositeBar/CompositeBar.d.ts +1 -1
- package/build/cjs/components/CompositeBar/Item/Item.d.ts +1 -3
- package/build/cjs/components/CompositeBar/MultipleTooltip/MultipleTooltip.d.ts +2 -1
- package/build/cjs/components/CompositeBar/MultipleTooltip/index.d.ts +0 -1
- package/build/cjs/components/CompositeBar/utils.d.ts +0 -1
- package/build/cjs/components/Drawer/utils.d.ts +2 -14
- package/build/cjs/components/Footer/MenuItem/MenuItem.d.ts +2 -1
- package/build/cjs/components/MobileHeader/types.d.ts +2 -1
- package/build/cjs/components/Settings/collect-settings.d.ts +2 -1
- package/build/cjs/components/Settings/types.d.ts +1 -1
- package/build/cjs/components/utils/cn.d.ts +0 -2
- package/build/cjs/hooks/useOverflowingHorizontalListItems/index.d.ts +1 -1
- package/build/cjs/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.d.ts +2 -1
- package/build/cjs/{index-6IkDuB63.js → index-CLbIRuop.js} +12 -5
- package/build/cjs/index-CLbIRuop.js.map +1 -0
- package/build/cjs/{index-Dbssunyq.js → index-tQGJrJNG.js} +2 -2
- package/build/cjs/{index-Dbssunyq.js.map → index-tQGJrJNG.js.map} +1 -1
- package/build/cjs/index.js +1 -1
- package/build/esm/components/AllPagesPanel/index.d.ts +1 -1
- package/build/esm/components/AsideHeader/AsideHeaderContext.d.ts +0 -2
- package/build/esm/components/AsideHeader/components/CollapseButton/CollapseButton.d.ts +2 -1
- package/build/esm/components/AsideHeader/components/PageLayout/AsideFallback.d.ts +2 -1
- package/build/esm/components/AsideHeader/types.d.ts +4 -3
- package/build/esm/components/CompositeBar/CompositeBar.d.ts +1 -1
- package/build/esm/components/CompositeBar/Item/Item.d.ts +1 -3
- package/build/esm/components/CompositeBar/MultipleTooltip/MultipleTooltip.d.ts +2 -1
- package/build/esm/components/CompositeBar/MultipleTooltip/index.d.ts +0 -1
- package/build/esm/components/CompositeBar/utils.d.ts +0 -1
- package/build/esm/components/Drawer/utils.d.ts +2 -14
- package/build/esm/components/Footer/MenuItem/MenuItem.d.ts +2 -1
- package/build/esm/components/MobileHeader/types.d.ts +2 -1
- package/build/esm/components/Settings/collect-settings.d.ts +2 -1
- package/build/esm/components/Settings/types.d.ts +1 -1
- package/build/esm/components/utils/cn.d.ts +0 -2
- package/build/esm/hooks/useOverflowingHorizontalListItems/index.d.ts +1 -1
- package/build/esm/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.d.ts +2 -1
- package/build/esm/{index-91wssyHT.js → index-Bpe5-gfa.js} +12 -5
- package/build/esm/index-Bpe5-gfa.js.map +1 -0
- package/build/esm/{index-CXVH4ncN.js → index-Cv3AVgdb.js} +2 -2
- package/build/esm/{index-CXVH4ncN.js.map → index-Cv3AVgdb.js.map} +1 -1
- package/build/esm/index.js +1 -1
- package/package.json +5 -4
- package/build/cjs/index-6IkDuB63.js.map +0 -1
- package/build/esm/index-91wssyHT.js.map +0 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var uikit = require('@gravity-ui/uikit');
|
|
5
|
-
var index = require('./index-
|
|
5
|
+
var index = require('./index-CLbIRuop.js');
|
|
6
6
|
require('@bem-react/classname');
|
|
7
7
|
require('@gravity-ui/icons');
|
|
8
8
|
require('@gravity-ui/uikit/i18n');
|
|
@@ -67,4 +67,4 @@ const TopAlert = ({ alert, className, mobileView = false }) => {
|
|
|
67
67
|
};
|
|
68
68
|
|
|
69
69
|
exports.TopAlert = TopAlert;
|
|
70
|
-
//# sourceMappingURL=index-
|
|
70
|
+
//# sourceMappingURL=index-tQGJrJNG.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index-
|
|
1
|
+
{"version":3,"file":"index-tQGJrJNG.js","sources":["../../../src/components/TopAlert/useTopAlertHeight.ts","../../../src/components/TopAlert/TopAlert.tsx"],"sourcesContent":["import React from 'react';\n\nimport debounceFn from 'lodash/debounce';\n\nimport {TopAlertProps} from '../types';\n\ntype TopAlertHeightControls = {\n alertRef: React.RefObject<HTMLDivElement>;\n updateTopSize: () => void;\n};\n\nconst G_ROOT_CLASS_NAME = 'g-root';\n\nexport const useTopAlertHeight = ({alert}: {alert?: TopAlertProps}): TopAlertHeightControls => {\n const alertRef = React.useRef<HTMLDivElement>(null);\n\n const setAsideTopPanelHeight = React.useCallback((clientHeight: number) => {\n const gRootElement = document\n .getElementsByClassName(G_ROOT_CLASS_NAME)\n .item(0) as HTMLElement | null;\n gRootElement?.style.setProperty('--gn-top-alert-height', clientHeight + 'px');\n }, []);\n\n const updateTopSize = React.useCallback(() => {\n setAsideTopPanelHeight(alertRef.current?.clientHeight || 0);\n }, [setAsideTopPanelHeight]);\n\n React.useLayoutEffect(() => {\n const updateTopSizeDebounce = debounceFn(updateTopSize, 200, {leading: true});\n\n if (alert) {\n window.addEventListener('resize', updateTopSizeDebounce);\n updateTopSizeDebounce();\n }\n return () => {\n window.removeEventListener('resize', updateTopSizeDebounce);\n setAsideTopPanelHeight(0);\n };\n }, [alert, alertRef, updateTopSize, setAsideTopPanelHeight]);\n\n return {\n alertRef,\n updateTopSize,\n };\n};\n","import React from 'react';\n\nimport {Alert, Text} from '@gravity-ui/uikit';\n\nimport {TopAlertProps} from '../types';\nimport {block} from '../utils/cn';\n\nimport {useTopAlertHeight} from './useTopAlertHeight';\n\nimport './TopAlert.scss';\n\nconst b = block('top-alert');\n\ntype Props = {\n alert?: TopAlertProps;\n className?: string;\n mobileView?: boolean;\n};\n\nexport const TopAlert = ({alert, className, mobileView = false}: Props) => {\n const {alertRef, updateTopSize} = useTopAlertHeight({alert});\n\n const [opened, setOpened] = React.useState(true);\n\n const handleClose = React.useCallback(() => {\n setOpened(false);\n alert?.onCloseTopAlert?.();\n }, [alert]);\n\n React.useEffect(() => {\n if (!opened) {\n updateTopSize();\n }\n }, [opened, updateTopSize]);\n\n if (!alert || !alert.message) {\n return null;\n }\n\n return (\n <div\n ref={alertRef}\n className={b('wrapper', {'with-bottom-border': !mobileView && opened}, className)}\n >\n {opened && (\n <Alert\n className={b('', {\n centered: alert.centered,\n dense: alert.dense,\n })}\n corners=\"square\"\n layout=\"horizontal\"\n align={alert.align}\n theme={alert.theme || 'warning'}\n view={alert.view}\n icon={alert.icon}\n title={alert.title}\n message={\n mobileView ? (\n <Text ellipsisLines={5} variant=\"body-2\">\n {alert.message}\n </Text>\n ) : (\n alert.message\n )\n }\n actions={alert.actions}\n onClose={alert.closable ? handleClose : undefined}\n />\n )}\n </div>\n );\n};\n"],"names":["debounceFn","block","Alert","Text"],"mappings":";;;;;;;;;;;;AAWA,MAAM,iBAAiB,GAAG,QAAQ;AAE3B,MAAM,iBAAiB,GAAG,CAAC,EAAC,KAAK,EAA0B,KAA4B;IAC1F,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC;IAEnD,MAAM,sBAAsB,GAAG,KAAK,CAAC,WAAW,CAAC,CAAC,YAAoB,KAAI;QACtE,MAAM,YAAY,GAAG;aAChB,sBAAsB,CAAC,iBAAiB;aACxC,IAAI,CAAC,CAAC,CAAuB;AAClC,QAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,SAAA,GAAA,SAAA,GAAA,YAAY,CAAE,KAAK,CAAC,WAAW,CAAC,uBAAuB,EAAE,YAAY,GAAG,IAAI,CAAC;KAChF,EAAE,EAAE,CAAC;AAEN,IAAA,MAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,MAAK;;QACzC,sBAAsB,CAAC,CAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,SAAA,GAAA,SAAA,GAAA,EAAA,CAAE,YAAY,KAAI,CAAC,CAAC;AAC/D,KAAC,EAAE,CAAC,sBAAsB,CAAC,CAAC;AAE5B,IAAA,KAAK,CAAC,eAAe,CAAC,MAAK;AACvB,QAAA,MAAM,qBAAqB,GAAGA,gBAAU,CAAC,aAAa,EAAE,GAAG,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC;QAE7E,IAAI,KAAK,EAAE;AACP,YAAA,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,qBAAqB,CAAC;AACxD,YAAA,qBAAqB,EAAE;;AAE3B,QAAA,OAAO,MAAK;AACR,YAAA,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,qBAAqB,CAAC;YAC3D,sBAAsB,CAAC,CAAC,CAAC;AAC7B,SAAC;KACJ,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAE,sBAAsB,CAAC,CAAC;IAE5D,OAAO;QACH,QAAQ;QACR,aAAa;KAChB;AACL,CAAC;;;;;ACjCD,MAAM,CAAC,GAAGC,WAAK,CAAC,WAAW,CAAC;AAQrB,MAAM,QAAQ,GAAG,CAAC,EAAC,KAAK,EAAE,SAAS,EAAE,UAAU,GAAG,KAAK,EAAQ,KAAI;AACtE,IAAA,MAAM,EAAC,QAAQ,EAAE,aAAa,EAAC,GAAG,iBAAiB,CAAC,EAAC,KAAK,EAAC,CAAC;AAE5D,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;AAEhD,IAAA,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,MAAK;;QACvC,SAAS,CAAC,KAAK,CAAC;QAChB,CAAA,EAAA,GAAA,KAAK,aAAL,KAAK,KAAA,SAAA,GAAA,SAAA,GAAL,KAAK,CAAE,eAAe,2DAAI;AAC9B,KAAC,EAAE,CAAC,KAAK,CAAC,CAAC;AAEX,IAAA,KAAK,CAAC,SAAS,CAAC,MAAK;QACjB,IAAI,CAAC,MAAM,EAAE;AACT,YAAA,aAAa,EAAE;;AAEvB,KAAC,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC;IAE3B,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;AAC1B,QAAA,OAAO,IAAI;;AAGf,IAAA,QACI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACI,GAAG,EAAE,QAAQ,EACb,SAAS,EAAE,CAAC,CAAC,SAAS,EAAE,EAAC,oBAAoB,EAAE,CAAC,UAAU,IAAI,MAAM,EAAC,EAAE,SAAS,CAAC,EAAA,EAEhF,MAAM,KACH,KAAC,CAAA,aAAA,CAAAC,WAAK,IACF,SAAS,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,QAAQ,EAAE,KAAK,CAAC,QAAQ;YACxB,KAAK,EAAE,KAAK,CAAC,KAAK;SACrB,CAAC,EACF,OAAO,EAAC,QAAQ,EAChB,MAAM,EAAC,YAAY,EACnB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,SAAS,EAC/B,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EACH,UAAU,IACN,oBAACC,UAAI,EAAA,EAAC,aAAa,EAAE,CAAC,EAAE,OAAO,EAAC,QAAQ,EACnC,EAAA,KAAK,CAAC,OAAO,CACX,KAEP,KAAK,CAAC,OAAO,CAChB,EAEL,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,OAAO,EAAE,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,SAAS,EACnD,CAAA,CACL,CACC;AAEd;;;;"}
|
package/build/cjs/index.js
CHANGED
|
@@ -7,13 +7,11 @@ export interface AsideHeaderInnerContextType extends AsideHeaderInnerProps {
|
|
|
7
7
|
allPagesIsAvailable: boolean;
|
|
8
8
|
onItemClick: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
9
9
|
}
|
|
10
|
-
export declare const AsideHeaderInnerContext: React.Context<AsideHeaderInnerContextType | undefined>;
|
|
11
10
|
export declare const AsideHeaderInnerContextProvider: React.Provider<AsideHeaderInnerContextType | undefined>;
|
|
12
11
|
export declare const useAsideHeaderInnerContext: () => AsideHeaderInnerContextType;
|
|
13
12
|
export interface AsideHeaderContextType {
|
|
14
13
|
compact: boolean;
|
|
15
14
|
size: number;
|
|
16
15
|
}
|
|
17
|
-
export declare const AsideHeaderContext: React.Context<AsideHeaderContextType | undefined>;
|
|
18
16
|
export declare const AsideHeaderContextProvider: React.Provider<AsideHeaderContextType | undefined>;
|
|
19
17
|
export declare const useAsideHeaderContext: () => AsideHeaderContextType;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import './CollapseButton.scss';
|
|
3
|
-
|
|
3
|
+
interface CollapseButtonProps {
|
|
4
4
|
className?: string;
|
|
5
5
|
}
|
|
6
6
|
export declare const CollapseButton: ({ className }: CollapseButtonProps) => string | number | boolean | Iterable<React.ReactNode> | React.JSX.Element | null | undefined;
|
|
7
|
+
export {};
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { QAProps } from '@gravity-ui/uikit';
|
|
3
|
-
|
|
3
|
+
interface Props extends QAProps {
|
|
4
4
|
headerDecoration?: boolean;
|
|
5
5
|
subheaderItemsCount?: number;
|
|
6
6
|
}
|
|
7
7
|
export declare const AsideFallback: React.FC<Props>;
|
|
8
|
+
export {};
|
|
@@ -8,14 +8,14 @@ export interface LayoutProps {
|
|
|
8
8
|
className?: string;
|
|
9
9
|
topAlert?: TopAlertProps;
|
|
10
10
|
}
|
|
11
|
-
|
|
11
|
+
interface EditMenuProps {
|
|
12
12
|
onOpenEditMode?: () => void;
|
|
13
13
|
onToggleMenuItem?: (changedItem: MenuItem) => void;
|
|
14
14
|
onResetSettingsToDefault?: () => void;
|
|
15
15
|
enableSorting?: boolean;
|
|
16
16
|
onChangeItemsOrder?: (changedItem: MenuItem, oldIndex: number, newIndex: number) => void;
|
|
17
17
|
}
|
|
18
|
-
|
|
18
|
+
interface AsideHeaderGeneralProps extends QAProps {
|
|
19
19
|
logo?: LogoProps;
|
|
20
20
|
multipleTooltip?: boolean;
|
|
21
21
|
className?: string;
|
|
@@ -43,7 +43,7 @@ export interface AsideHeaderGeneralProps extends QAProps {
|
|
|
43
43
|
onAllPagesClick?: () => void;
|
|
44
44
|
openModalSubscriber?: (subscriber: OpenModalSubscriber) => void;
|
|
45
45
|
}
|
|
46
|
-
|
|
46
|
+
interface AsideHeaderDefaultProps {
|
|
47
47
|
panelItems?: DrawerItemProps[];
|
|
48
48
|
subheaderItems?: SubheaderMenuItem[];
|
|
49
49
|
menuItems?: MenuItem[];
|
|
@@ -57,3 +57,4 @@ export interface AsideHeaderProps extends AsideHeaderGeneralProps, LayoutProps,
|
|
|
57
57
|
export declare enum InnerPanels {
|
|
58
58
|
AllPages = "all-pages"
|
|
59
59
|
}
|
|
60
|
+
export {};
|
|
@@ -9,7 +9,7 @@ type CompositeBarItems = {
|
|
|
9
9
|
type: 'subheader';
|
|
10
10
|
items: SubheaderMenuItem[];
|
|
11
11
|
};
|
|
12
|
-
|
|
12
|
+
type CompositeBarProps = CompositeBarItems & {
|
|
13
13
|
onItemClick?: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
|
14
14
|
multipleTooltip?: boolean;
|
|
15
15
|
menuMoreTitle?: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { PopupProps } from '@gravity-ui/uikit';
|
|
3
3
|
import { MenuItem } from '../../types';
|
|
4
4
|
import './Item.scss';
|
|
5
5
|
interface ItemPopup {
|
|
@@ -39,7 +39,5 @@ interface ItemInnerProps extends ItemProps {
|
|
|
39
39
|
onMouseEnter?: () => void;
|
|
40
40
|
onMouseLeave?: () => void;
|
|
41
41
|
}
|
|
42
|
-
export declare const defaultPopupPlacement: PopupPlacement;
|
|
43
|
-
export declare const defaultPopupOffset: NonNullable<PopupProps['offset']>;
|
|
44
42
|
export declare const Item: React.FC<ItemInnerProps>;
|
|
45
43
|
export {};
|
|
@@ -2,7 +2,8 @@ import React from 'react';
|
|
|
2
2
|
import { PopupProps } from '@gravity-ui/uikit';
|
|
3
3
|
import { MenuItem } from '../../types';
|
|
4
4
|
import './MultipleTooltip.scss';
|
|
5
|
-
|
|
5
|
+
type MultipleTooltipProps = Pick<PopupProps, 'open' | 'anchorRef' | 'placement'> & {
|
|
6
6
|
items: MenuItem[];
|
|
7
7
|
};
|
|
8
8
|
export declare const MultipleTooltip: React.FC<MultipleTooltipProps>;
|
|
9
|
+
export {};
|
|
@@ -3,7 +3,6 @@ import { MenuItem } from './../types';
|
|
|
3
3
|
export declare function getItemHeight(item: CompositeBarItem): 40 | 50 | 15;
|
|
4
4
|
export declare function getItemsHeight<T extends CompositeBarItem>(items: T[]): number;
|
|
5
5
|
export declare function getSelectedItemIndex(items: MenuItem[]): number | undefined;
|
|
6
|
-
export declare function getPinnedItems(items: MenuItem[]): MenuItem[];
|
|
7
6
|
export declare function getItemsMinHeight(items: MenuItem[]): number;
|
|
8
7
|
export declare function getMoreButtonItem(menuMoreTitle?: string): MenuItem;
|
|
9
8
|
export declare function getAutosizeListItems(items: MenuItem[], height: number, collapseItem: MenuItem): {
|
|
@@ -1,22 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
export declare const DRAWER_ITEM_MIN_RESIZE_WIDTH = 200;
|
|
3
|
-
export declare const DRAWER_ITEM_MAX_RESIZE_WIDTH = 800;
|
|
4
|
-
export declare const DRAWER_ITEM_INITIAL_RESIZE_WIDTH = 400;
|
|
5
2
|
export type DrawerDirection = 'right' | 'left' | 'top' | 'bottom';
|
|
6
3
|
export type OnResizeHandler = (width: number, event: MouseEvent | TouchEvent) => void;
|
|
7
4
|
export type OnResizeContinueHandler = (width: number) => void;
|
|
8
5
|
export declare function useScrollLock(enabled: boolean): void;
|
|
9
|
-
|
|
10
|
-
onStart: () => void;
|
|
11
|
-
onMove: (delta: number) => void;
|
|
12
|
-
onEnd: (delta: number, event: MouseEvent | TouchEvent) => void;
|
|
13
|
-
direction?: 'horizontal' | 'vertical';
|
|
14
|
-
}
|
|
15
|
-
export declare function useResizeHandlers({ onStart, onMove, onEnd, direction, }: UseResizeHandlersParams): {
|
|
16
|
-
onMouseDown: (e: React.MouseEvent | React.TouchEvent) => void;
|
|
17
|
-
onTouchStart: (e: React.MouseEvent | React.TouchEvent) => void;
|
|
18
|
-
};
|
|
19
|
-
export interface UseResizableDrawerItemParams {
|
|
6
|
+
interface UseResizableDrawerItemParams {
|
|
20
7
|
direction?: DrawerDirection;
|
|
21
8
|
width?: number;
|
|
22
9
|
minResizeWidth?: number;
|
|
@@ -33,3 +20,4 @@ export declare function useResizableDrawerItem(params: UseResizableDrawerItemPar
|
|
|
33
20
|
};
|
|
34
21
|
isResizing: boolean;
|
|
35
22
|
};
|
|
23
|
+
export {};
|
|
@@ -9,7 +9,7 @@ export interface ModalItem {
|
|
|
9
9
|
renderContent?: () => React.ReactNode;
|
|
10
10
|
onClose?: () => void;
|
|
11
11
|
}
|
|
12
|
-
|
|
12
|
+
type MobileMenuItemType = 'regular' | 'divider';
|
|
13
13
|
export interface MobileMenuItem extends Omit<MenuItem, 'tooltipText' | 'pinned' | 'rightAdornment' | 'afterMoreButton' | 'itemWrapper' | 'onItemClick'> {
|
|
14
14
|
type?: MobileMenuItemType;
|
|
15
15
|
closeMenuOnClick?: boolean;
|
|
@@ -25,3 +25,4 @@ export type ItemEventsConfig = {
|
|
|
25
25
|
export type MobileHeaderEventOptions = {
|
|
26
26
|
panelName?: string;
|
|
27
27
|
};
|
|
28
|
+
export {};
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import { IconProps } from '@gravity-ui/uikit';
|
|
3
3
|
import { SettingsSelection } from './Selection/types';
|
|
4
4
|
export type SettingsMenu = (SettingsMenuGroup | SettingsMenuItem)[];
|
|
5
|
-
|
|
5
|
+
interface SettingsMenuGroup {
|
|
6
6
|
groupTitle: string;
|
|
7
7
|
items: SettingsMenuItem[];
|
|
8
8
|
}
|
|
@@ -47,3 +47,4 @@ export interface SettingsDescription {
|
|
|
47
47
|
}
|
|
48
48
|
export declare function getSettingsFromChildren(children: React.ReactNode, searchText?: string): SettingsDescription;
|
|
49
49
|
export declare function getSelectedSettingsPart(pages: Record<string, SettingsPage>, selection: SettingsSelection): SelectedSettingsPart;
|
|
50
|
+
export {};
|
|
@@ -2,7 +2,7 @@ import type React from 'react';
|
|
|
2
2
|
import type { IconProps } from '@gravity-ui/uikit';
|
|
3
3
|
import type { SettingsSelection } from './Selection';
|
|
4
4
|
import type { SettingsPageSection } from './collect-settings';
|
|
5
|
-
|
|
5
|
+
interface GroupItem {
|
|
6
6
|
groupTitle: string;
|
|
7
7
|
items: Item[];
|
|
8
8
|
}
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
export type CnMods = Record<string, string | boolean | undefined>;
|
|
2
1
|
export declare const NAMESPACE = "gn-";
|
|
3
2
|
export declare const cn: import("@bem-react/classname").ClassNameInitilizer;
|
|
4
3
|
export declare const block: import("@bem-react/classname").ClassNameInitilizer;
|
|
5
|
-
export type CnBlock = ReturnType<typeof cn>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export
|
|
1
|
+
export { useOverflowingHorizontalListItems } from './useOverflowingHorizontalListItems';
|
package/build/esm/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { RefObject } from 'react';
|
|
2
|
-
|
|
2
|
+
type UseOverflowingContainerListItemsProps<ItemType extends unknown> = {
|
|
3
3
|
containerRef: RefObject<HTMLElement>;
|
|
4
4
|
items?: ItemType[];
|
|
5
5
|
itemSelector: string;
|
|
@@ -10,3 +10,4 @@ export declare function useOverflowingHorizontalListItems<ItemType>({ containerR
|
|
|
10
10
|
hiddenItems: ItemType[];
|
|
11
11
|
measured: boolean;
|
|
12
12
|
};
|
|
13
|
+
export {};
|
|
@@ -121,7 +121,7 @@ function styleInject(css, ref) {
|
|
|
121
121
|
var css_248z$u = ".g-root{--gn-aside-top-panel-height:0px}.gn-aside-header{--gn-aside-header-min-width:56px;--_--item-icon-background-size:38px;--_--background-color:var(--g-color-base-background);--_--decoration-collapsed-background-color:var(--g-color-base-warning-light);--_--decoration-expanded-background-color:var(--g-color-base-warning-light);--_--vertical-divider-line-color:var(--g-color-line-generic);--_--horizontal-divider-line-color:var(--g-color-line-generic);background-color:var(--g-color-base-background);height:100%;position:relative;width:100%}.gn-aside-header__aside{background-color:var(--gn-aside-header-expanded-background-color,var(--gn-aside-header-background-color,var(--_--background-color)));box-sizing:border-box;display:flex;flex-direction:column;height:100vh;left:0;margin-top:var(--gn-top-alert-height,0);max-height:calc(100vh - var(--gn-top-alert-height, 0));position:sticky;top:var(--gn-top-alert-height,0);width:inherit;z-index:var(--gn-aside-header-z-index,100)}.gn-aside-header__aside:after{background-color:var(--gn-aside-header-divider-vertical-color,var(--_--vertical-divider-line-color));content:\"\";height:100%;position:absolute;right:0;top:0;width:1px;z-index:2}.gn-aside-header__aside-popup-anchor{inset:0;position:absolute;z-index:1}.gn-aside-header__aside-content{--gradient-height:334px;display:flex;flex-direction:column;height:inherit;overflow-x:hidden;padding-top:var(--gn-aside-header-padding-top);position:relative;user-select:none;width:inherit;z-index:2}.gn-aside-header__aside-content>.gn-aside-header-logo{margin:8px 0}.gn-aside-header__aside-content_with-decoration{background:linear-gradient(180deg,var(--gn-aside-header-decoration-expanded-background-color,var(--_--decoration-expanded-background-color)) calc(var(--gradient-height)*.33),transparent calc(var(--gradient-height)*.88))}.gn-aside-header__aside-custom-background{bottom:0;display:flex;position:absolute;top:0;width:var(--gn-aside-header-size);z-index:-1}.gn-aside-header_compact .gn-aside-header__aside{background-color:var(--gn-aside-header-collapsed-background-color,var(--gn-aside-header-background-color,var(--_--background-color)))}.gn-aside-header_compact .gn-aside-header__aside-content{background:transparent}.gn-aside-header__header{--gn-aside-header-header-divider-height:29px;box-sizing:border-box;flex:none;padding-bottom:22px;padding-top:8px;position:relative;width:100%;z-index:1}.gn-aside-header__header .gn-aside-header__header-divider{bottom:0;color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));display:none;left:0;position:absolute;z-index:-2}.gn-aside-header__header_with-decoration:before{background-color:var(--gn-aside-header-decoration-collapsed-background-color,var(--_--decoration-collapsed-background-color));content:\"\";display:none;height:calc(100% - var(--gn-aside-header-header-divider-height));left:0;position:absolute;top:0;width:100%;z-index:-2}.gn-aside-header__header:after{background-color:var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));bottom:12px;content:\"\";height:1px;left:0;position:absolute;width:100%;z-index:-2}.gn-aside-header_compact .gn-aside-header__header:before,.gn-aside-header_compact .gn-aside-header__header_with-decoration .gn-aside-header__header-divider{display:block}.gn-aside-header_compact .gn-aside-header__header_with-decoration:after{display:none}.gn-aside-header__logo-button .gn-aside-header__logo-icon-place{height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));width:var(--gn-aside-header-min-width)}.gn-aside-header__menu-items{flex-grow:1}.gn-aside-header__footer{display:flex;flex-direction:column;flex-shrink:0;margin:8px 0;width:100%}.gn-aside-header__panels{--gn-drawer-z-index:var(--gn-aside-header-panel-z-index,98);display:flex;flex-direction:column;inset:var(--gn-top-alert-height,0) 0 0;max-height:calc(100vh - var(--gn-top-alert-height, 0));overflow:auto;position:fixed}.gn-aside-header__panel{flex-grow:1;height:auto}.gn-aside-header__pane-container{display:flex;flex-direction:row;outline:none;overflow:visible;user-select:text}.gn-aside-header__top-alert{background:var(--g-color-base-background);position:fixed;top:0;width:100%;z-index:var(--gn-aside-header-pane-top-z-index,98)}.gn-aside-header__content{margin-top:var(--gn-top-alert-height,0);width:calc(100% - var(--gn-aside-header-size));z-index:var(--gn-aside-header-content-z-index,95)}";
|
|
122
122
|
styleInject(css_248z$u);
|
|
123
123
|
|
|
124
|
-
const TopAlert$1 = React__default.lazy(() => import('./index-
|
|
124
|
+
const TopAlert$1 = React__default.lazy(() => import('./index-Cv3AVgdb.js').then((module) => ({ default: module.TopAlert })));
|
|
125
125
|
const Layout = ({ compact, className, children, topAlert }) => {
|
|
126
126
|
const size = compact ? ASIDE_HEADER_COMPACT_WIDTH : ASIDE_HEADER_EXPANDED_WIDTH;
|
|
127
127
|
const asideHeaderContextValue = useMemo(() => ({ size, compact }), [compact, size]);
|
|
@@ -5680,10 +5680,10 @@ const OverlapPanel = ({ title, renderContent, className, onClose, action, closeT
|
|
|
5680
5680
|
React__default.createElement("div", { className: b$5('content') }, renderContent()))));
|
|
5681
5681
|
};
|
|
5682
5682
|
|
|
5683
|
-
var css_248z$4 = ".gn-mobile-header{--mobile-header-min-heigth:50px;--mobile-header-icon-size:20px;background-color:var(--g-color-base-background)}.gn-mobile-header__header-container{background-color:var(--g-color-base-background);position:sticky;top:0;z-index:var(--gn-mobile-header-z-index,100)}.gn-mobile-header__header{align-items:center;border-bottom:1px solid var(--g-color-line-generic);box-sizing:border-box;display:flex;justify-content:space-between;padding:0 10px}.gn-mobile-header__burger{padding:12px}.gn-mobile-header__panel-item{--gn-drawer-item-position:var(--gn-mobile-header-panel-position,absolute)}.gn-mobile-header__burger-menu,.gn-mobile-header__panel-item{background-color:var(--g-color-base-background);max-height:100%;max-width:90vw;width:320px}.gn-mobile-header__user-menu{overflow-y:auto}.gn-mobile-header__overlap-panel,.gn-mobile-header__panels{z-index:var(--gn-mobile-header-panel-z-index,98)}.gn-mobile-header__panels{inset:var(--mobile-header-min-heigth) 0 0;overflow:hidden;position:fixed}.gn-mobile-header__panel-item{top:unset}.gn-mobile-header__content{overflow:auto}";
|
|
5683
|
+
var css_248z$4 = ".gn-mobile-header{--mobile-header-min-heigth:50px;--mobile-header-icon-size:20px;background-color:var(--g-color-base-background)}.gn-mobile-header__header-container{background-color:var(--g-color-base-background);position:sticky;top:0;z-index:var(--gn-mobile-header-z-index,100)}.gn-mobile-header__header{align-items:center;border-bottom:1px solid var(--g-color-line-generic);box-sizing:border-box;display:flex;justify-content:space-between;padding:0 10px}.gn-mobile-header__burger{padding:12px}.gn-mobile-header__panel-item{--gn-drawer-item-position:var(--gn-mobile-header-panel-position,absolute)}.gn-mobile-header__burger-menu,.gn-mobile-header__panel-item{background-color:var(--g-color-base-background);max-height:100%;max-width:90vw;width:320px}.gn-mobile-header__user-menu{overflow-y:auto}.gn-mobile-header__overlap-panel,.gn-mobile-header__panels{z-index:var(--gn-mobile-header-panel-z-index,98)}.gn-mobile-header__panels{inset:var(--mobile-header-min-heigth) 0 0;overflow:hidden;position:fixed}.gn-mobile-header__panel-item{height:100%;top:unset}.gn-mobile-header__content{overflow:auto}";
|
|
5684
5684
|
styleInject(css_248z$4);
|
|
5685
5685
|
|
|
5686
|
-
const TopAlert = React__default.lazy(() => import('./index-
|
|
5686
|
+
const TopAlert = React__default.lazy(() => import('./index-Cv3AVgdb.js').then((module) => ({ default: module.TopAlert })));
|
|
5687
5687
|
const b$4 = block('mobile-header');
|
|
5688
5688
|
const MobileHeader = React__default.forwardRef(({ logo, burgerMenu, burgerCloseTitle = i18n('burger_button_close'), burgerOpenTitle = i18n('burger_button_open'), panelItems = [], renderContent, sideItemRenderContent, onClosePanel, onEvent, className, contentClassName, overlapPanel, topAlert, }, ref) => {
|
|
5689
5689
|
const targetRef = useForwardRef(ref);
|
|
@@ -5767,7 +5767,14 @@ const MobileHeader = React__default.forwardRef(({ logo, burgerMenu, burgerCloseT
|
|
|
5767
5767
|
const burgerPanelItem = useMemo(() => ({
|
|
5768
5768
|
id: BURGER_PANEL_ITEM_ID,
|
|
5769
5769
|
content: (React__default.createElement(BurgerMenu, { items: burgerMenu.items, modalItem: burgerMenu.modalItem, renderFooter: renderBurgerMenuFooter, onItemClick: onBurgerMenuItemClick, className: b$4('burger-menu') })),
|
|
5770
|
-
|
|
5770
|
+
className: burgerMenu.className,
|
|
5771
|
+
}), [
|
|
5772
|
+
burgerMenu.items,
|
|
5773
|
+
burgerMenu.modalItem,
|
|
5774
|
+
burgerMenu.className,
|
|
5775
|
+
onBurgerMenuItemClick,
|
|
5776
|
+
renderBurgerMenuFooter,
|
|
5777
|
+
]);
|
|
5771
5778
|
useEffect(() => {
|
|
5772
5779
|
const node = targetRef === null || targetRef === undefined ? undefined : targetRef.current;
|
|
5773
5780
|
if (node) {
|
|
@@ -5977,4 +5984,4 @@ const MobileFooter = ({ className, menuItems: providedMenuItems, withDivider, mo
|
|
|
5977
5984
|
};
|
|
5978
5985
|
|
|
5979
5986
|
export { AsideHeader as A, DrawerItem as D, FooterItem$1 as F, HotkeysPanel as H, Logo as L, MOBILE_HEADER_EVENT_NAMES as M, PageLayout as P, Settings as S, Title as T, AsideHeaderContextProvider as a, block as b, PageLayoutAside as c, debounceFn as d, AsideFallback as e, Drawer as f, PublicActionBar as g, useSettingsContext as h, useSettingsSelectionContext as i, FooterItem as j, getMobileHeaderCustomEvent as k, MobileHeader as l, MobileLogo as m, Footer as n, MobileFooter as o, styleInject as s, useAsideHeaderContext as u };
|
|
5980
|
-
//# sourceMappingURL=index-
|
|
5987
|
+
//# sourceMappingURL=index-Bpe5-gfa.js.map
|