@gravity-ui/navigation 3.3.6 → 3.3.7

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.
@@ -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-DupjiCHB.js');
5
+ var index = require('./index-ZYbXPDC-.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-1-ElFsv6.js.map
70
+ //# sourceMappingURL=index-iyVw1u9f.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index-1-ElFsv6.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":"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"}
1
+ {"version":3,"file":"index-iyVw1u9f.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":"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"}
@@ -1,6 +1,6 @@
1
1
  'use strict';
2
2
 
3
- var index = require('./index-DupjiCHB.js');
3
+ var index = require('./index-ZYbXPDC-.js');
4
4
  require('react');
5
5
  require('@bem-react/classname');
6
6
  require('@gravity-ui/uikit');
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { type DrawerDirection } from './utils';
2
+ import { type DrawerDirection, type OnResizeContinueHandler, type OnResizeHandler } from './utils';
3
3
  import './Drawer.scss';
4
4
  export interface DrawerItemProps {
5
5
  /** Unique identifier for the drawer item. */
@@ -31,14 +31,15 @@ export interface DrawerItemProps {
31
31
  /**
32
32
  * Called at the end of resizing. Can be used to save the new width.
33
33
  * @param width The new width of the drawer item
34
+ * @param event The original event
34
35
  */
35
- onResize?: (width: number) => void;
36
+ onResize?: OnResizeHandler;
36
37
  /**
37
38
  * Callback function called each time when the drawer item is resizing.
38
39
  * Do not use it to store the new width for DrawerItem `width` prop. Use `onResize` instead.
39
40
  * @param width The new width of the drawer item
40
41
  */
41
- onResizeContinue?: (width: number) => void;
42
+ onResizeContinue?: OnResizeContinueHandler;
42
43
  /** The minimum width of the resizable drawer item */
43
44
  minResizeWidth?: number;
44
45
  /** The maximum width of the resizable drawer item */
@@ -3,11 +3,12 @@ export declare const DRAWER_ITEM_MIN_RESIZE_WIDTH = 200;
3
3
  export declare const DRAWER_ITEM_MAX_RESIZE_WIDTH = 800;
4
4
  export declare const DRAWER_ITEM_INITIAL_RESIZE_WIDTH = 400;
5
5
  export type DrawerDirection = 'right' | 'left' | 'top' | 'bottom';
6
- export type OnResizeHandler = (width: number) => void;
6
+ export type OnResizeHandler = (width: number, event: MouseEvent | TouchEvent) => void;
7
+ export type OnResizeContinueHandler = (width: number) => void;
7
8
  export interface UseResizeHandlersParams {
8
9
  onStart: () => void;
9
10
  onMove: (delta: number) => void;
10
- onEnd: (delta: number) => void;
11
+ onEnd: (delta: number, event: MouseEvent | TouchEvent) => void;
11
12
  direction?: 'horizontal' | 'vertical';
12
13
  }
13
14
  export declare function useResizeHandlers({ onStart, onMove, onEnd, direction, }: UseResizeHandlersParams): {
@@ -21,7 +22,7 @@ export interface UseResizableDrawerItemParams {
21
22
  maxResizeWidth?: number;
22
23
  onResizeStart?: VoidFunction;
23
24
  onResize?: OnResizeHandler;
24
- onResizeContinue?: OnResizeHandler;
25
+ onResizeContinue?: OnResizeContinueHandler;
25
26
  }
26
27
  export declare function useResizableDrawerItem(params: UseResizableDrawerItemParams): {
27
28
  resizedWidth: number;
@@ -1,6 +1,6 @@
1
1
  import React__default from 'react';
2
2
  import { Alert, Text } from '@gravity-ui/uikit';
3
- import { d as debounceFn, s as styleInject, b as block } from './index-DTziVw1v.js';
3
+ import { d as debounceFn, s as styleInject, b as block } from './index-DOyI3dmf.js';
4
4
  import '@bem-react/classname';
5
5
  import '@gravity-ui/icons';
6
6
  import '@gravity-ui/uikit/i18n';
@@ -65,4 +65,4 @@ const TopAlert = ({ alert, className, mobileView = false }) => {
65
65
  };
66
66
 
67
67
  export { TopAlert };
68
- //# sourceMappingURL=index-BzjAiTZH.js.map
68
+ //# sourceMappingURL=index-BPmWn9HE.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index-BzjAiTZH.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":["React"],"mappings":";;;;;;;;;;AAWA,MAAM,iBAAiB,GAAG,QAAQ;AAE3B,MAAM,iBAAiB,GAAG,CAAC,EAAC,KAAK,EAA0B,KAA4B;IAC1F,MAAM,QAAQ,GAAGA,cAAK,CAAC,MAAM,CAAiB,IAAI,CAAC;IAEnD,MAAM,sBAAsB,GAAGA,cAAK,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,GAAGA,cAAK,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,IAAAA,cAAK,CAAC,eAAe,CAAC,MAAK;AACvB,QAAA,MAAM,qBAAqB,GAAG,UAAU,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,GAAG,KAAK,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,GAAGA,cAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;AAEhD,IAAA,MAAM,WAAW,GAAGA,cAAK,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,IAAAA,cAAK,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,QACIA,cAAA,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,KACHA,cAAC,CAAA,aAAA,CAAA,KAAK,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,IACNA,6BAAC,IAAI,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;;;;"}
1
+ {"version":3,"file":"index-BPmWn9HE.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":["React"],"mappings":"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"}
@@ -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{inset:var(--gn-top-alert-height,0) 0 0;max-height:calc(100vh - var(--gn-top-alert-height, 0));overflow:auto;position:fixed;z-index:var(--gn-aside-header-panel-z-index,98)}.gn-aside-header__panel{height:100%}.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-BzjAiTZH.js').then((module) => ({ default: module.TopAlert })));
124
+ const TopAlert$1 = React__default.lazy(() => import('./index-BPmWn9HE.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]);
@@ -1510,7 +1510,7 @@ function isMenuItem(item) {
1510
1510
  return (item === null || item === undefined ? undefined : item.id) !== undefined;
1511
1511
  }
1512
1512
 
1513
- var css_248z$q = ".gn-composite-bar-item{--gn-composite-bar-item-action-size:36px;--_--horizontal-divider-line-color:var(--g-color-line-generic);--_--item-background-color-hover:var(--g-color-base-simple-hover);--_--item-general-icon-color:var(--g-color-text-primary);--_--item-icon-color:var(--g-color-text-complementary);--_--item-text-color:var(--g-color-text-primary);--_--item-collapsed-radius:7px;--_--item-selected-text-color:var(--g-color-text-primary);--_--item-selected-background-color:var(--g-color-base-selection);align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;height:100%;min-width:0;outline:inherit;padding:0;text-decoration:inherit;width:100%}.gn-composite-bar-item:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.gn-composite-bar-item__icon{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color))}.gn-composite-bar-item_current .gn-composite-bar-item__icon{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-item-icon-color,var(--_--item-icon-color)))}.gn-composite-bar-highlighted-item .gn-composite-bar-item__icon,.gn-composite-bar_subheader .gn-composite-bar-item__icon,.gn-footer-item .gn-composite-bar-item__icon{color:var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color))}.gn-composite-bar-highlighted-item.gn-composite-bar-item_current .gn-composite-bar-item__icon,.gn-composite-bar_subheader .gn-composite-bar-item_current .gn-composite-bar-item__icon,.gn-footer-item.gn-composite-bar-item_current .gn-composite-bar-item__icon{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.gn-composite-bar-item__icon-tooltip .g-action-tooltip__description{color:var(--g-color-text-light-primary);margin-block-start:0}.gn-composite-bar-item__icon-place{align-items:center;display:flex;flex-shrink:0;height:100%;justify-content:center;width:var(--gn-aside-header-min-width)}.gn-composite-bar-item__title{align-items:center;display:flex;margin-right:16px;overflow:hidden}.gn-composite-bar-item__title-text{-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--gn-aside-header-item-text-color,var(--_--item-text-color));display:-webkit-box;overflow:hidden;text-align:start}.gn-composite-bar-item_current .gn-composite-bar-item__title-text{color:var(--gn-aside-header-item-current-text-color,var(--_--item-selected-text-color))}.gn-composite-bar-item__title-adornment{margin:0 10px}.gn-composite-bar-item__collapse-item{--_--item-icon-color:var(--g-color-text-misc);align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;height:100%;outline:inherit;padding:0 16px;text-decoration:inherit;width:100%}.gn-composite-bar-item__collapse-item:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.gn-composite-bar-item__collapse-item-icon{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color));margin-right:10px}.gn-composite-bar-item__collapse-item .gn-composite-bar-item__title-adornment{margin-right:0}.gn-composite-bar-item__menu-divider{border-top:1px solid var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));cursor:default;margin:0 8px;width:100%}.gn-composite-bar-item__collapse-items-popup-content{padding:4px 0}.gn-composite-bar-item__link{align-items:center;display:flex;height:100%;width:100%}.gn-composite-bar-item__link,.gn-composite-bar-item__link:active,.gn-composite-bar-item__link:focus,.gn-composite-bar-item__link:hover,.gn-composite-bar-item__link:visited{color:inherit;outline:none;text-decoration:none}.gn-composite-bar-item__btn-icon{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.gn-composite-bar-item_type_action{background:var(--g-color-base-float);border-radius:var(--gn-composite-bar-item-action-size);box-shadow:0 0 0 1px rgba(0,0,0,.03),0 5px 6px rgba(0,0,0,.12);height:var(--gn-composite-bar-item-action-size);justify-content:center;margin:0 10px 8px;transition:transform .1s ease-out,background-color .15s linear}.gn-composite-bar-item_type_action:focus-visible{box-shadow:0 0 0 2px var(--g-color-line-misc)}.gn-composite-bar-item_type_action:hover{background-color:var(--g-color-base-float-hover)}.gn-composite-bar-item_type_action:active{box-shadow:0 1px 2px var(--g-color-sfx-shadow);transform:scale(.96);transition:none}.gn-composite-bar-item_type_action .gn-composite-bar-item__icon-place{width:var(--gn-composite-bar-item-action-size)}.gn-composite-bar-item__icon-tooltip_item-type_action{margin-left:10px}.gn-composite-bar-item:not(.gn-composite-bar-item_compact).gn-composite-bar-item_current.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item:not(.gn-composite-bar-item_compact):hover.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item:not(.gn-composite-bar-item_compact):not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item_compact.gn-composite-bar-item_type_action{width:var(--gn-composite-bar-item-action-size)}.gn-composite-bar-item_compact.gn-composite-bar-item_type_action .gn-composite-bar-item__title{margin:0}.gn-composite-bar-item_compact.gn-composite-bar-item_current.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact.gn-composite-bar-item_current.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.gn-composite-bar-item_compact:hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact:hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.gn-composite-bar-item_compact:not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact:not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}";
1513
+ var css_248z$q = ".gn-composite-bar-item{--gn-composite-bar-item-action-size:36px;--_--horizontal-divider-line-color:var(--g-color-line-generic);--_--item-background-color-hover:var(--g-color-base-simple-hover);--_--item-general-icon-color:var(--g-color-text-primary);--_--item-icon-color:var(--g-color-text-complementary);--_--item-text-color:var(--g-color-text-primary);--_--item-collapsed-radius:7px;--_--item-selected-text-color:var(--g-color-text-primary);--_--item-selected-background-color:var(--g-color-base-selection);align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;height:100%;min-width:0;outline:inherit;padding:0;text-decoration:inherit;width:100%}.gn-composite-bar-item:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.gn-composite-bar-item__icon{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color))}.gn-composite-bar-item_current .gn-composite-bar-item__icon{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-item-icon-color,var(--_--item-icon-color)))}.gn-composite-bar-highlighted-item .gn-composite-bar-item__icon,.gn-composite-bar_subheader .gn-composite-bar-item__icon,.gn-footer-item .gn-composite-bar-item__icon{color:var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color))}.gn-composite-bar-highlighted-item.gn-composite-bar-item_current .gn-composite-bar-item__icon,.gn-composite-bar_subheader .gn-composite-bar-item_current .gn-composite-bar-item__icon,.gn-footer-item.gn-composite-bar-item_current .gn-composite-bar-item__icon{color:var(--gn-aside-header-item-current-icon-color,var(--gn-aside-header-general-item-icon-color,var(--_--item-general-icon-color)))}.gn-composite-bar-item__icon-tooltip .g-action-tooltip__description{color:var(--g-color-text-light-primary);margin-block-start:0}.gn-composite-bar-item__icon-place{align-items:center;display:flex;flex-shrink:0;height:100%;justify-content:center;width:var(--gn-aside-header-min-width)}.gn-composite-bar-item__title{align-items:center;display:flex;margin-right:16px;overflow:hidden}.gn-composite-bar-item__title-text{-webkit-box-orient:vertical;-webkit-line-clamp:2;color:var(--gn-aside-header-item-text-color,var(--_--item-text-color));display:-webkit-box;overflow:hidden;text-align:start}.gn-composite-bar-item_current .gn-composite-bar-item__title-text{color:var(--gn-aside-header-item-current-text-color,var(--_--item-selected-text-color))}.gn-composite-bar-item__title-adornment{margin:0 10px}.gn-composite-bar-item__collapse-item{--_--item-icon-color:var(--g-color-text-misc);align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;font:inherit;height:100%;outline:inherit;padding:0 16px;text-decoration:inherit;width:100%}.gn-composite-bar-item__collapse-item:focus-visible{outline:solid var(--g-color-line-misc);outline-offset:-2px}.gn-composite-bar-item__collapse-item-icon{color:var(--gn-aside-header-item-icon-color,var(--_--item-icon-color));margin-right:10px}.gn-composite-bar-item__collapse-item .gn-composite-bar-item__title-adornment{margin-right:0}.gn-composite-bar-item__menu-divider{border-top:1px solid var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));cursor:default;margin:0 8px;width:100%}.gn-composite-bar-item__collapse-items-popup-content{padding:4px 0}.gn-composite-bar-item__link{align-items:center;display:flex;height:100%;width:100%}.gn-composite-bar-item__link,.gn-composite-bar-item__link:active,.gn-composite-bar-item__link:focus,.gn-composite-bar-item__link:hover,.gn-composite-bar-item__link:visited{color:inherit;outline:none;text-decoration:none}.gn-composite-bar-item__btn-icon{align-items:center;display:flex;height:100%;justify-content:center;width:100%}.gn-composite-bar-item_type_action{background:var(--g-color-base-float);border-radius:var(--gn-composite-bar-item-action-size);box-shadow:0 0 0 1px rgba(0,0,0,.03),0 5px 6px rgba(0,0,0,.12);height:var(--gn-composite-bar-item-action-size);justify-content:center;margin:0 10px 8px;transition:transform .1s ease-out,background-color .15s linear}.gn-composite-bar-item_type_action:focus-visible{box-shadow:0 0 0 2px var(--g-color-line-misc)}.gn-composite-bar-item_type_action:hover{background-color:var(--g-color-base-float-hover)}.gn-composite-bar-item_type_action:active{box-shadow:0 1px 2px var(--g-color-sfx-shadow);transform:scale(.96);transition:none}.gn-composite-bar-item_type_action .gn-composite-bar-item__icon-place{width:var(--gn-composite-bar-item-action-size)}.gn-composite-bar-item_type_action.gn-footer-item{width:calc(100% - 20px)}.gn-composite-bar-item__icon-tooltip_item-type_action{margin-left:10px}.gn-composite-bar-item:not(.gn-composite-bar-item_compact).gn-composite-bar-item_current.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item:not(.gn-composite-bar-item_compact):hover.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item:not(.gn-composite-bar-item_compact):not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-expanded-radius)}.gn-composite-bar-item_compact.gn-composite-bar-item_type_action{width:var(--gn-composite-bar-item-action-size)}.gn-composite-bar-item_compact.gn-composite-bar-item_type_action .gn-composite-bar-item__title{margin:0}.gn-composite-bar-item_compact.gn-composite-bar-item_current.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact.gn-composite-bar-item_current.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.gn-composite-bar-item_compact:hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact:hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-current-background-color-hover,var(--gn-aside-header-item-current-background-color,var(--_--item-selected-background-color)));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}.gn-composite-bar-item_compact:not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon{background-color:transparent;position:relative}.gn-composite-bar-item_compact:not(.gn-composite-bar-item_current):hover.gn-composite-bar-item_type_regular .gn-composite-bar-item__btn-icon:before{background-color:var(--gn-aside-header-item-background-color-hover,var(--_--item-background-color-hover));border-radius:var(--gn-aside-header-item-collapsed-radius,var(--_--item-collapsed-radius));content:\"\";height:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));left:50%;margin-left:-19px;margin-top:-19px;position:absolute;top:50%;width:var(--gn-aside-header-item-icon-background-size,var(--_--item-icon-background-size));z-index:-1}";
1514
1514
  styleInject(css_248z$q);
1515
1515
 
1516
1516
  const b$r = block('composite-bar-item');
@@ -4395,7 +4395,7 @@ function useResizeHandlers({ onStart, onMove, onEnd, direction = 'horizontal', }
4395
4395
  document.body.style.removeProperty('cursor');
4396
4396
  const current = getEventClientPosition(e, direction);
4397
4397
  const delta = initialPosition.current - current;
4398
- onEnd(delta);
4398
+ onEnd(delta, e);
4399
4399
  }, [handleMove, disableSelect, direction, onEnd]);
4400
4400
  const handleStart = React.useCallback((e) => {
4401
4401
  const current = getEventClientPosition(e, direction);
@@ -4436,11 +4436,11 @@ function useResizableDrawerItem(params) {
4436
4436
  setResizeDelta(delta);
4437
4437
  onResizeContinue === null || onResizeContinue === undefined ? undefined : onResizeContinue(getResizedWidth(delta));
4438
4438
  }, [getResizedWidth, onResizeContinue]);
4439
- const onEnd = React.useCallback((delta) => {
4439
+ const onEnd = React.useCallback((delta, event) => {
4440
4440
  const newWidth = getResizedWidth(delta);
4441
4441
  setIsResizing(false);
4442
4442
  setInternalWidth(newWidth);
4443
- onResize === null || onResize === undefined ? undefined : onResize(newWidth);
4443
+ onResize === null || onResize === undefined ? undefined : onResize(newWidth, event);
4444
4444
  }, [getResizedWidth, onResize]);
4445
4445
  const displayWidth = isResizing
4446
4446
  ? getResizedWidth(resizeDelta)
@@ -5626,7 +5626,7 @@ const OverlapPanel = ({ title, renderContent, className, onClose, action, closeT
5626
5626
  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}";
5627
5627
  styleInject(css_248z$4);
5628
5628
 
5629
- const TopAlert = React__default.lazy(() => import('./index-BzjAiTZH.js').then((module) => ({ default: module.TopAlert })));
5629
+ const TopAlert = React__default.lazy(() => import('./index-BPmWn9HE.js').then((module) => ({ default: module.TopAlert })));
5630
5630
  const b$4 = block('mobile-header');
5631
5631
  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) => {
5632
5632
  const targetRef = useForwardRef(ref);
@@ -5917,4 +5917,4 @@ const MobileFooter = ({ className, menuItems: providedMenuItems, withDivider, mo
5917
5917
  };
5918
5918
 
5919
5919
  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, useSettingsSelectionContext as h, useSettingsContext 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 };
5920
- //# sourceMappingURL=index-DTziVw1v.js.map
5920
+ //# sourceMappingURL=index-DOyI3dmf.js.map