@gravity-ui/navigation 3.0.0-beta.1 → 3.0.0-beta.3

package/build/esm/components/Settings/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/build/esm/components/Title/Title.js

@@ -0,0 +1,18 @@
+import React__default from 'react';
+import { Xmark } from '@gravity-ui/icons';
+import { Text, Button, Icon } from '@gravity-ui/uikit';
+import { block } from '../utils/cn.js';
+import i18n from './i18n/index.js';
+import './Title.scss.js';
+
+const b = block('title');
+const Title = ({ children, closeIconSize = 23, hasSeparator, closeTitle = i18n('button_close'), onClose, }) => {
+    return (React__default.createElement("div", { className: b({ separator: hasSeparator }) },
+        React__default.createElement(Text, { className: b('text'), as: 'h3', variant: 'subheader-3' }, children),
+        onClose && (React__default.createElement(Button, { onClick: onClose, view: "flat", size: "l", "aria-label": closeTitle },
+            React__default.createElement(Icon, { data: Xmark, size: closeIconSize })))));
+};
+Title.displayName = 'Title';
+
+export { Title };
+//# sourceMappingURL=Title.js.map

package/build/esm/components/Title/Title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.js","sources":["../../../../../src/components/Title/Title.tsx"],"sourcesContent":["import React from 'react';\n\nimport {Xmark} from '@gravity-ui/icons';\nimport {Button, Icon, Text} from '@gravity-ui/uikit';\n\nimport {block} from '../utils/cn';\n\nimport i18n from './i18n';\n\nimport './Title.scss';\n\nconst b = block('title');\n\ninterface TitleProps {\n    hasSeparator?: boolean;\n    closeTitle?: string;\n    closeIconSize?: number;\n    onClose?: () => void;\n}\nexport const Title: React.FC<React.PropsWithChildren<TitleProps>> = ({\n    children,\n    closeIconSize = 23,\n    hasSeparator,\n    closeTitle = i18n('button_close'),\n    onClose,\n}) => {\n    return (\n        <div className={b({separator: hasSeparator})}>\n            <Text className={b('text')} as={'h3'} variant={'subheader-3'}>\n                {children}\n            </Text>\n            {onClose && (\n                <Button onClick={onClose} view=\"flat\" size=\"l\" aria-label={closeTitle}>\n                    <Icon data={Xmark} size={closeIconSize} />\n                </Button>\n            )}\n        </div>\n    );\n};\n\nTitle.displayName = 'Title';\n"],"names":["React"],"mappings":";;;;;;;AAWA,MAAM,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC;AAQX,MAAA,KAAK,GAAkD,CAAC,EACjE,QAAQ,EACR,aAAa,GAAG,EAAE,EAClB,YAAY,EACZ,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,EACjC,OAAO,GACV,KAAI;IACD,QACIA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,CAAC,CAAC,EAAC,SAAS,EAAE,YAAY,EAAC,CAAC,EAAA;AACxC,QAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,aAAa,EAAA,EACvD,QAAQ,CACN;AACN,QAAA,OAAO,KACJA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,GAAG,gBAAa,UAAU,EAAA;AACjE,YAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,aAAa,EAAI,CAAA,CACrC,CACZ,CACC;AAEd;AAEA,KAAK,CAAC,WAAW,GAAG,OAAO;;;;"}

package/build/esm/components/Title/Title.scss.js

@@ -0,0 +1,7 @@
+import styleInject from '../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".gn-title{align-items:center;box-sizing:border-box;display:flex;justify-content:space-between;min-height:64px;padding:14px 10px 14px 20px}.gn-title_separator{border-bottom:1px solid var(--g-color-line-generic)}.gn-title__text{margin:0 20px 0 0}";
+styleInject(css_248z);
+
+export { css_248z as default };
+//# sourceMappingURL=Title.scss.js.map

package/build/esm/components/Title/Title.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/components/Title/i18n/en.json.js

@@ -0,0 +1,7 @@
+var button_close = "Close";
+var en = {
+	button_close: button_close
+};
+
+export { button_close, en as default };
+//# sourceMappingURL=en.json.js.map

package/build/esm/components/Title/i18n/en.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/components/Title/i18n/index.d.ts

@@ -1,2 +1,6 @@
-declare const _default: (key: "button_close", params?: import("@gravity-ui/i18n").Params | undefined) => string;
+declare const _default: ((key: "button_close", params?: import("@gravity-ui/i18n").Params) => string) & {
+    keysetData: {
+        "gn-Title": Record<"button_close", import("@gravity-ui/i18n").KeyData>;
+    };
+};
 export default _default;

package/build/esm/components/Title/i18n/index.js

@@ -0,0 +1,10 @@
+import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
+import { NAMESPACE } from '../../utils/cn.js';
+import en from './en.json.js';
+import ru from './ru.json.js';
+
+const COMPONENT = 'Title';
+var i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}${COMPONENT}`);
+
+export { i18n as default };
+//# sourceMappingURL=index.js.map

package/build/esm/components/Title/i18n/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/Title/i18n/index.ts"],"sourcesContent":["import {addComponentKeysets} from '@gravity-ui/uikit/i18n';\n\nimport {NAMESPACE} from '../../utils/cn';\n\nimport en from './en.json';\nimport ru from './ru.json';\n\nconst COMPONENT = 'Title';\nexport default addComponentKeysets({en, ru}, `${NAMESPACE}${COMPONENT}`);\n"],"names":[],"mappings":";;;;;AAOA,MAAM,SAAS,GAAG,OAAO;AACzB,WAAe,mBAAmB,CAAC,EAAC,EAAE,EAAE,EAAE,EAAC,EAAE,CAAA,EAAG,SAAS,CAAA,EAAG,SAAS,CAAA,CAAE,CAAC;;;;"}

package/build/esm/components/Title/i18n/ru.json.js

@@ -0,0 +1,7 @@
+var button_close = "Закрыть";
+var ru = {
+	button_close: button_close
+};
+
+export { button_close, ru as default };
+//# sourceMappingURL=ru.json.js.map

package/build/esm/components/Title/i18n/ru.json.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/components/Title/index.js

@@ -0,0 +1,2 @@
+export { Title } from './Title.js';
+//# sourceMappingURL=index.js.map

package/build/esm/components/Title/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/esm/components/TopAlert/TopAlert.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TopAlertProps } from '../types';
+import './TopAlert.scss';
+type Props = {
+    alert?: TopAlertProps;
+    className?: string;
+    mobileView?: boolean;
+};
+export declare const TopAlert: ({ alert, className, mobileView }: Props) => React.JSX.Element | null;
+export {};

package/build/esm/components/TopAlert/TopAlert.js

@@ -0,0 +1,31 @@
+import React__default from 'react';
+import { Alert, Text } from '@gravity-ui/uikit';
+import { block } from '../utils/cn.js';
+import { useTopAlertHeight } from './useTopAlertHeight.js';
+import './TopAlert.scss.js';
+
+const b = block('top-alert');
+const TopAlert = ({ alert, className, mobileView = false }) => {
+    const { alertRef, updateTopSize } = useTopAlertHeight({ alert });
+    const [opened, setOpened] = React__default.useState(true);
+    const handleClose = React__default.useCallback(() => {
+        var _a;
+        setOpened(false);
+        (_a = alert === null || alert === undefined ? undefined : alert.onCloseTopAlert) === null || _a === undefined ? undefined : _a.call(alert);
+    }, [alert]);
+    React__default.useEffect(() => {
+        if (!opened) {
+            updateTopSize();
+        }
+    }, [opened, updateTopSize]);
+    if (!alert || !alert.message) {
+        return null;
+    }
+    return (React__default.createElement("div", { ref: alertRef, className: b('wrapper', { 'with-bottom-border': !mobileView && opened }, className) }, opened && (React__default.createElement(Alert, { className: b('', {
+            centered: alert.centered,
+            dense: alert.dense,
+        }), corners: "square", layout: "horizontal", align: alert.align, theme: alert.theme || 'warning', view: alert.view, icon: alert.icon, title: alert.title, message: mobileView ? (React__default.createElement(Text, { ellipsisLines: 5, variant: "body-2" }, alert.message)) : (alert.message), actions: alert.actions, onClose: alert.closable ? handleClose : undefined }))));
+};
+
+export { TopAlert };
+//# sourceMappingURL=TopAlert.js.map

package/build/esm/components/TopAlert/TopAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopAlert.js","sources":["../../../../../src/components/TopAlert/TopAlert.tsx"],"sourcesContent":["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,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;;;;"}

package/build/esm/components/TopAlert/TopAlert.scss.js

@@ -0,0 +1,7 @@
+import styleInject from '../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".g-root{--gn-top-alert-height:0px}.gn-top-alert_centered{display:flex;justify-content:space-around}.gn-top-alert_dense{padding-bottom:var(--g-spacing-2);padding-top:var(--g-spacing-2)}.gn-top-alert__wrapper_with-bottom-border:after{background-color:var(--gn-aside-header-divider-horizontal-color,var(--_--horizontal-divider-line-color));content:\"\";display:block;height:1px;margin-top:-1px}";
+styleInject(css_248z);
+
+export { css_248z as default };
+//# sourceMappingURL=TopAlert.scss.js.map

package/build/esm/components/TopAlert/TopAlert.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopAlert.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/build/esm/components/TopAlert/index.d.ts

@@ -0,0 +1 @@
+export { TopAlert } from './TopAlert';

package/build/esm/components/TopAlert/index.js

@@ -0,0 +1,2 @@
+export { TopAlert } from './TopAlert.js';
+//# sourceMappingURL=index.js.map

package/build/esm/components/TopAlert/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/esm/components/TopAlert/useTopAlertHeight.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { TopAlertProps } from '../types';
+type TopAlertHeightControls = {
+    alertRef: React.RefObject<HTMLDivElement>;
+    updateTopSize: () => void;
+};
+export declare const useTopAlertHeight: ({ alert }: {
+    alert?: TopAlertProps;
+}) => TopAlertHeightControls;
+export {};

package/build/esm/components/TopAlert/useTopAlertHeight.js

@@ -0,0 +1,35 @@
+import React__default from 'react';
+import debounceFn from '../../_virtual/debounce.js';
+
+const G_ROOT_CLASS_NAME = 'g-root';
+const useTopAlertHeight = ({ alert }) => {
+    const alertRef = React__default.useRef(null);
+    const setAsideTopPanelHeight = React__default.useCallback((clientHeight) => {
+        const gRootElement = document
+            .getElementsByClassName(G_ROOT_CLASS_NAME)
+            .item(0);
+        gRootElement === null || gRootElement === undefined ? undefined : gRootElement.style.setProperty('--gn-top-alert-height', clientHeight + 'px');
+    }, []);
+    const updateTopSize = React__default.useCallback(() => {
+        var _a;
+        setAsideTopPanelHeight(((_a = alertRef.current) === null || _a === undefined ? undefined : _a.clientHeight) || 0);
+    }, [setAsideTopPanelHeight]);
+    React__default.useLayoutEffect(() => {
+        const updateTopSizeDebounce = debounceFn(updateTopSize, 200, { leading: true });
+        if (alert) {
+            window.addEventListener('resize', updateTopSizeDebounce);
+            updateTopSizeDebounce();
+        }
+        return () => {
+            window.removeEventListener('resize', updateTopSizeDebounce);
+            setAsideTopPanelHeight(0);
+        };
+    }, [alert, alertRef, updateTopSize, setAsideTopPanelHeight]);
+    return {
+        alertRef,
+        updateTopSize,
+    };
+};
+
+export { useTopAlertHeight };
+//# sourceMappingURL=useTopAlertHeight.js.map

package/build/esm/components/TopAlert/useTopAlertHeight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTopAlertHeight.js","sources":["../../../../../src/components/TopAlert/useTopAlertHeight.ts"],"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"],"names":["React"],"mappings":";;;AAWA,MAAM,iBAAiB,GAAG,QAAQ;MAErB,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;;;;"}

package/build/esm/components/constants.js

@@ -0,0 +1,8 @@
+const ASIDE_HEADER_ICON_SIZE = 18;
+const ASIDE_HEADER_COMPACT_WIDTH = 56;
+const ASIDE_HEADER_EXPANDED_WIDTH = 236;
+const ITEM_HEIGHT = 40;
+const HEADER_DIVIDER_HEIGHT = 29;
+
+export { ASIDE_HEADER_COMPACT_WIDTH, ASIDE_HEADER_EXPANDED_WIDTH, ASIDE_HEADER_ICON_SIZE, HEADER_DIVIDER_HEIGHT, ITEM_HEIGHT };
+//# sourceMappingURL=constants.js.map

package/build/esm/components/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/constants.ts"],"sourcesContent":["export const ASIDE_HEADER_ICON_SIZE = 18;\nexport const ASIDE_HEADER_COMPACT_WIDTH = 56;\nexport const ASIDE_HEADER_EXPANDED_WIDTH = 236;\nexport const ITEM_HEIGHT = 40;\nexport const HEADER_DIVIDER_HEIGHT = 29;\n"],"names":[],"mappings":"AAAO,MAAM,sBAAsB,GAAG;AAC/B,MAAM,0BAA0B,GAAG;AACnC,MAAM,2BAA2B,GAAG;AACpC,MAAM,WAAW,GAAG;AACpB,MAAM,qBAAqB,GAAG;;;;"}

package/build/esm/components/types.d.ts

@@ -1,5 +1,5 @@
 import React, { HTMLAttributeAnchorTarget } from 'react';
-import { AlertProps, IconProps, QAProps } from '@gravity-ui/uikit';
+import { AlertProps, ButtonProps, IconProps, QAProps } from '@gravity-ui/uikit';
 import { ItemProps } from 'src/components/CompositeBar/Item/Item';
 export type MenuItemType = 'regular' | 'action' | 'divider';
 export type OpenModalSubscriber = (open: boolean) => void;
@@ -17,7 +17,7 @@ export interface MenuItem extends QAProps {
     link?: string;
     current?: boolean;
     pinned?: boolean;
-    onItemClick?: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+    onItemClick?: (item: MenuItem, collapsed: boolean, event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
     onItemClickCapture?: (event: React.SyntheticEvent) => void;
     onCollapseItemClick?: () => void;
     itemWrapper?: (p: MakeItemParams, makeItem: (p: MakeItemParams) => React.ReactNode, opts: {
@@ -42,6 +42,10 @@ export interface MenuItem extends QAProps {
      * The category to which the menu item belongs. Need for grouping in the display/editing mode of all pages
      */
     category?: string;
+    /**
+     * Pass extra props to UIKit Button for action type item
+     */
+    extraButtonProps?: ButtonProps;
 }
 export type SubheaderMenuItem = Omit<ItemProps, 'onItemClick' | 'onItemClickCapture'>;
 export interface LogoProps {
@@ -59,16 +63,16 @@ export interface LogoProps {
     'aria-label'?: string;
     'aria-labelledby'?: string;
 }
-export type AsideHeaderTopAlertProps = {
+export interface TopAlertProps {
+    align?: AlertProps['align'];
     message: AlertProps['message'];
     title?: AlertProps['title'];
     icon?: AlertProps['icon'];
     view?: AlertProps['view'];
     theme?: AlertProps['theme'];
     actions?: AlertProps['actions'];
-    align?: AlertProps['align'];
     closable?: boolean;
     centered?: boolean;
     dense?: boolean;
     onCloseTopAlert?: () => void;
-};
+}

package/build/esm/{cn-ffe5e9f5.js → components/utils/cn.js}

@@ -4,5 +4,5 @@ const NAMESPACE = 'gn-';
 withNaming({ e: '__', m: '_' });
 const block = withNaming({ n: NAMESPACE, e: '__', m: '_' });
 
-export { NAMESPACE as N, block as b };
-//# sourceMappingURL=cn-ffe5e9f5.js.map
+export { NAMESPACE, block };
+//# sourceMappingURL=cn.js.map

package/build/esm/components/utils/cn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cn.js","sources":["../../../../../src/components/utils/cn.ts"],"sourcesContent":["import {withNaming} from '@bem-react/classname';\n\nexport type CnMods = Record<string, string | boolean | undefined>;\n\nexport const NAMESPACE = 'gn-';\n\nexport const cn = withNaming({e: '__', m: '_'});\nexport const block = withNaming({n: NAMESPACE, e: '__', m: '_'});\n\nexport type CnBlock = ReturnType<typeof cn>;\n"],"names":[],"mappings":";;AAIO,MAAM,SAAS,GAAG;AAEP,UAAU,CAAC,EAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAC;MACjC,KAAK,GAAG,UAAU,CAAC,EAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAC;;;;"}

package/build/esm/hooks/useForwardRef.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const useForwardRef: <T>(ref: React.MutableRefObject<T | null> | ((instance: T | null) => void) | null, initialValue?: any) => React.MutableRefObject<T>;
+export declare const useForwardRef: <T>(ref: ((instance: T | null) => void) | React.MutableRefObject<T | null> | null, initialValue?: any) => React.MutableRefObject<T>;

package/build/esm/hooks/useForwardRef.js

@@ -0,0 +1,19 @@
+import React__default from 'react';
+
+const useForwardRef = (ref, initialValue = null) => {
+    const targetRef = React__default.useRef(initialValue);
+    React__default.useEffect(() => {
+        if (!ref)
+            return;
+        if (typeof ref === 'function') {
+            ref(targetRef.current);
+        }
+        else {
+            ref.current = targetRef.current;
+        }
+    }, [ref]);
+    return targetRef;
+};
+
+export { useForwardRef };
+//# sourceMappingURL=useForwardRef.js.map

package/build/esm/hooks/useForwardRef.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useForwardRef.js","sources":["../../../../src/hooks/useForwardRef.tsx"],"sourcesContent":["import React from 'react';\n\nexport const useForwardRef = <T,>(\n    ref: ((instance: T | null) => void) | React.MutableRefObject<T | null> | null,\n    initialValue: any = null,\n) => {\n    const targetRef = React.useRef<T>(initialValue);\n\n    React.useEffect(() => {\n        if (!ref) return;\n\n        if (typeof ref === 'function') {\n            ref(targetRef.current);\n        } else {\n            ref.current = targetRef.current;\n        }\n    }, [ref]);\n\n    return targetRef;\n};\n"],"names":["React"],"mappings":";;AAEa,MAAA,aAAa,GAAG,CACzB,GAA6E,EAC7E,YAAA,GAAoB,IAAI,KACxB;IACA,MAAM,SAAS,GAAGA,cAAK,CAAC,MAAM,CAAI,YAAY,CAAC;AAE/C,IAAAA,cAAK,CAAC,SAAS,CAAC,MAAK;AACjB,QAAA,IAAI,CAAC,GAAG;YAAE;AAEV,QAAA,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE;AAC3B,YAAA,GAAG,CAAC,SAAS,CAAC,OAAO,CAAC;;aACnB;AACH,YAAA,GAAG,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO;;AAEvC,KAAC,EAAE,CAAC,GAAG,CAAC,CAAC;AAET,IAAA,OAAO,SAAS;AACpB;;;;"}

package/build/esm/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.js

@@ -0,0 +1,64 @@
+import { useState, useLayoutEffect, useMemo } from 'react';
+import debounceFn from '../../_virtual/debounce.js';
+
+function useOverflowingHorizontalListItems({ containerRef, items, itemSelector, moreButtonWidth = 0, }) {
+    const [containerWidth, setContainerWidth] = useState(0);
+    const [itemWidths, setItemWidths] = useState([]);
+    useLayoutEffect(() => {
+        if (!containerRef.current) {
+            return;
+        }
+        const measureItemSizes = () => {
+            var _a, _b;
+            const itemElements = Array.from((_b = (_a = containerRef.current) === null || _a === undefined ? undefined : _a.querySelectorAll(itemSelector)) !== null && _b !== undefined ? _b : []);
+            setItemWidths(itemElements.map((item) => item.clientWidth));
+        };
+        measureItemSizes();
+    }, [containerRef, itemSelector]);
+    useLayoutEffect(() => {
+        const footerMenu = containerRef.current;
+        if (!footerMenu) {
+            return;
+        }
+        const updateContainerSize = (entries) => {
+            if (entries.length > 0 && footerMenu) {
+                setContainerWidth(entries[0].contentRect.width);
+            }
+        };
+        const updateContainerSizeDebounced = debounceFn(updateContainerSize, 100);
+        const footerMenuResizeObserver = new ResizeObserver(updateContainerSizeDebounced);
+        footerMenuResizeObserver.observe(footerMenu);
+    }, [containerRef]);
+    const isMeasured = containerWidth > 0;
+    const { visibleItems, hiddenItems } = useMemo(() => {
+        var _a, _b;
+        if (!isMeasured) {
+            return {
+                visibleItems: items !== null && items !== undefined ? items : [],
+                hiddenItems: [],
+            };
+        }
+        const itemsCount = itemWidths.length;
+        let visibleItemsCount = 0;
+        let remainingContainerWidth = containerWidth;
+        for (const width of itemWidths) {
+            remainingContainerWidth -= width;
+            if (remainingContainerWidth < moreButtonWidth) {
+                const isMoreThanOneItemLeft = itemsCount !== visibleItemsCount + 1;
+                const hasNoSpaceForTheLastItem = remainingContainerWidth < 0;
+                if (isMoreThanOneItemLeft || hasNoSpaceForTheLastItem) {
+                    break;
+                }
+            }
+            visibleItemsCount++;
+        }
+        return {
+            visibleItems: (_a = items === null || items === undefined ? undefined : items.slice(0, visibleItemsCount)) !== null && _a !== undefined ? _a : [],
+            hiddenItems: (_b = items === null || items === undefined ? undefined : items.slice(visibleItemsCount)) !== null && _b !== undefined ? _b : [],
+        };
+    }, [containerWidth, isMeasured, itemWidths, items, moreButtonWidth]);
+    return { visibleItems, hiddenItems, measured: isMeasured };
+}
+
+export { useOverflowingHorizontalListItems };
+//# sourceMappingURL=useOverflowingHorizontalListItems.js.map

package/build/esm/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOverflowingHorizontalListItems.js","sources":["../../../../../src/hooks/useOverflowingHorizontalListItems/useOverflowingHorizontalListItems.ts"],"sourcesContent":["import {useLayoutEffect, useMemo, useState} from 'react';\nimport type {RefObject} from 'react';\n\nimport debounceFn from 'lodash/debounce';\n\nexport type UseOverflowingContainerListItemsProps<ItemType extends unknown> = {\n    containerRef: RefObject<HTMLElement>;\n    items?: ItemType[];\n    itemSelector: string;\n    moreButtonWidth?: number;\n};\n\nexport function useOverflowingHorizontalListItems<ItemType>({\n    containerRef,\n    items,\n    itemSelector,\n    moreButtonWidth = 0,\n}: UseOverflowingContainerListItemsProps<ItemType>) {\n    const [containerWidth, setContainerWidth] = useState<number>(0);\n    const [itemWidths, setItemWidths] = useState<number[]>([]);\n\n    useLayoutEffect(() => {\n        if (!containerRef.current) {\n            return;\n        }\n\n        const measureItemSizes = () => {\n            const itemElements = Array.from(\n                containerRef.current?.querySelectorAll(itemSelector) ?? [],\n            );\n            setItemWidths(itemElements.map((item) => item.clientWidth));\n        };\n\n        measureItemSizes();\n    }, [containerRef, itemSelector]);\n\n    useLayoutEffect(() => {\n        const footerMenu = containerRef.current;\n        if (!footerMenu) {\n            return;\n        }\n\n        const updateContainerSize = (entries: ResizeObserverEntry[]) => {\n            if (entries.length > 0 && footerMenu) {\n                setContainerWidth(entries[0].contentRect.width);\n            }\n        };\n\n        const updateContainerSizeDebounced = debounceFn(updateContainerSize, 100);\n        const footerMenuResizeObserver = new ResizeObserver(updateContainerSizeDebounced);\n\n        footerMenuResizeObserver.observe(footerMenu);\n    }, [containerRef]);\n\n    const isMeasured = containerWidth > 0;\n\n    const {visibleItems, hiddenItems} = useMemo(() => {\n        if (!isMeasured) {\n            return {\n                visibleItems: items ?? [],\n                hiddenItems: [],\n            };\n        }\n\n        const itemsCount = itemWidths.length;\n        let visibleItemsCount = 0;\n        let remainingContainerWidth = containerWidth;\n        for (const width of itemWidths) {\n            remainingContainerWidth -= width;\n            if (remainingContainerWidth < moreButtonWidth) {\n                const isMoreThanOneItemLeft = itemsCount !== visibleItemsCount + 1;\n                const hasNoSpaceForTheLastItem = remainingContainerWidth < 0;\n                if (isMoreThanOneItemLeft || hasNoSpaceForTheLastItem) {\n                    break;\n                }\n            }\n\n            visibleItemsCount++;\n        }\n\n        return {\n            visibleItems: items?.slice(0, visibleItemsCount) ?? [],\n            hiddenItems: items?.slice(visibleItemsCount) ?? [],\n        };\n    }, [containerWidth, isMeasured, itemWidths, items, moreButtonWidth]);\n\n    return {visibleItems, hiddenItems, measured: isMeasured};\n}\n"],"names":[],"mappings":"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"}

package/build/esm/index.js

@@ -1,170 +1,21 @@
-export { AsideHeader } from './AsideHeader.js';
-export { AsideHeaderContextProvider, useAsideHeaderContext } from './AsideHeaderContext.js';
-export { FooterItem } from './FooterItem.js';
-export { PageLayout } from './PageLayout.js';
-import { L as Logo } from './PageLayoutAside-5d010e96.js';
-export { L as Logo, P as PageLayoutAside } from './PageLayoutAside-5d010e96.js';
-export { AsideFallback } from './AsideFallback.js';
-export { Drawer, DrawerItem } from './Drawer.js';
-export { M as MOBILE_HEADER_EVENT_NAMES, a as MobileHeader, F as MobileHeaderFooterItem, b as MobileLogo, g as getMobileHeaderCustomEvent } from './FooterItem-3cc816a3.js';
-import React__default, { useState, useLayoutEffect, useMemo, useRef, useCallback } from 'react';
-import { Menu, DropdownMenu, Button, Icon, Sheet } from '@gravity-ui/uikit';
-import { d as debounce_1 } from './debounce-64cd2b4c.js';
-import { b as block } from './cn-ffe5e9f5.js';
-import { _ as __rest } from './tslib.es6-3cd4e99f.js';
-import { s as styleInject } from './style-inject.es-1f59c1d0.js';
-import { Ellipsis } from '@gravity-ui/icons';
-export { P as ActionBar } from './ActionBar-834b178a.js';
-export { T as Title } from './Title-03b4255a.js';
-export { H as HotkeysPanel } from './HotkeysPanel-0576deee.js';
-export { S as Settings, a as useSettingsContext, u as useSettingsSelectionContext } from './Settings-e660a4c5.js';
-import './Item-55899ec8.js';
-import './constants-b1604ff5.js';
-import './Content-f94ba85d.js';
-import './utils-117463a5.js';
-import '@gravity-ui/uikit/i18n';
-import './divider-collapsed-a0ef54c3.js';
-import 'react-dom';
-import '@bem-react/classname';
-
-function useOverflowingHorizontalListItems({ containerRef, items, itemSelector, moreButtonWidth = 0, }) {
-    const [containerWidth, setContainerWidth] = useState(0);
-    const [itemWidths, setItemWidths] = useState([]);
-    useLayoutEffect(() => {
-        if (!containerRef.current) {
-            return;
-        }
-        const measureItemSizes = () => {
-            var _a, _b;
-            const itemElements = Array.from((_b = (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelectorAll(itemSelector)) !== null && _b !== void 0 ? _b : []);
-            setItemWidths(itemElements.map((item) => item.clientWidth));
-        };
-        measureItemSizes();
-    }, [containerRef, itemSelector]);
-    useLayoutEffect(() => {
-        const footerMenu = containerRef.current;
-        if (!footerMenu) {
-            return;
-        }
-        const updateContainerSize = (entries) => {
-            if (entries.length > 0 && footerMenu) {
-                setContainerWidth(entries[0].contentRect.width);
-            }
-        };
-        const updateContainerSizeDebounced = debounce_1(updateContainerSize, 100);
-        const footerMenuResizeObserver = new ResizeObserver(updateContainerSizeDebounced);
-        footerMenuResizeObserver.observe(footerMenu);
-    }, [containerRef]);
-    const isMeasured = containerWidth > 0;
-    const { visibleItems, hiddenItems } = useMemo(() => {
-        var _a, _b;
-        if (!isMeasured) {
-            return {
-                visibleItems: items !== null && items !== void 0 ? items : [],
-                hiddenItems: [],
-            };
-        }
-        const itemsCount = itemWidths.length;
-        let visibleItemsCount = 0;
-        let remainingContainerWidth = containerWidth;
-        for (const width of itemWidths) {
-            remainingContainerWidth -= width;
-            if (remainingContainerWidth < moreButtonWidth) {
-                const isMoreThanOneItemLeft = itemsCount !== visibleItemsCount + 1;
-                const hasNoSpaceForTheLastItem = remainingContainerWidth < 0;
-                if (isMoreThanOneItemLeft || hasNoSpaceForTheLastItem) {
-                    break;
-                }
-            }
-            visibleItemsCount++;
-        }
-        return {
-            visibleItems: (_a = items === null || items === void 0 ? void 0 : items.slice(0, visibleItemsCount)) !== null && _a !== void 0 ? _a : [],
-            hiddenItems: (_b = items === null || items === void 0 ? void 0 : items.slice(visibleItemsCount)) !== null && _b !== void 0 ? _b : [],
-        };
-    }, [containerWidth, isMeasured, itemWidths, items, moreButtonWidth]);
-    return { visibleItems, hiddenItems, measured: isMeasured };
-}
-
-var css_248z$2 = ".gn-footer-menu-item{align-items:center;align-self:stretch;display:flex;height:100%;justify-content:center}.gn-footer-menu-item .g-menu__item-content{color:var(--g-color-text-secondary);font-size:var(--g-text-body-1-font-size);font-weight:var(--g-text-body-font-weight);line-height:var(--g-text-body-1-line-height);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.gn-footer-menu-item[class]:hover{background-color:inherit}.gn-footer-menu-item[class]:hover[href] .g-menu__item-content{color:var(--g-color-text-link-hover)}";
-styleInject(css_248z$2);
-
-const b$2 = block('footer-menu-item');
-const MenuItem = (_a) => {
-    var { text, className } = _a, menuItemProps = __rest(_a, ["text", "className"]);
-    return (React__default.createElement(Menu.Item, Object.assign({ className: b$2(null, className) }, menuItemProps), text));
-};
-
-const moreItemsPopupProps = {
-    placement: 'top-start',
-};
-
-var css_248z$1 = ".gn-footer_desktop{align-items:center;background:var(--g-color-base-background);display:flex;gap:var(--g-spacing-6);height:40px;justify-content:flex-end;padding:0 var(--g-spacing-6) 0 var(--g-spacing-3)}.gn-footer_desktop .gn-footer__menu{align-items:center;align-self:stretch;display:flex;flex:1;min-width:0;visibility:hidden}.gn-footer_desktop .gn-footer__menu_measured{visibility:visible}.gn-footer_desktop .gn-footer__list[class]{background-color:inherit;display:flex;height:100%;padding:0}.gn-footer_desktop .gn-footer__more-button svg{color:var(--g-color-text-secondary)}.gn-footer_desktop .gn-footer__right{align-items:center;display:flex;gap:var(--g-spacing-5)}.gn-footer_desktop .gn-footer__copyright{color:var(--g-color-text-secondary);font-size:var(--g-text-body-1-font-size);font-weight:var(--g-text-body-font-weight);line-height:var(--g-text-body-1-line-height);white-space:nowrap}.gn-footer_desktop .gn-footer__copyright_small{font-size:var(--g-text-caption-2-font-size);font-weight:var(--g-text-caption-font-weight);line-height:var(--g-text-caption-2-line-height)}.gn-footer_with-divider{border-top:1px solid var(--g-color-line-generic)}.gn-footer_view_clear{background:transparent;z-index:-1}";
-styleInject(css_248z$1);
-
-const b$1 = block('footer');
-const Footer = ({ className, menuItems: providedMenuItems, withDivider, moreButtonTitle, onMoreButtonClick, view = 'normal', logo, logoWrapperClassName, copyright, }) => {
-    var _a;
-    const menuContainerRef = useRef(null);
-    const menuItems = view === 'clear' ? undefined : providedMenuItems;
-    const { visibleItems, hiddenItems, measured } = useOverflowingHorizontalListItems({
-        containerRef: menuContainerRef,
-        items: menuItems,
-        itemSelector: `.${b$1('menu-item')}`,
-        moreButtonWidth: 28,
-    });
-    const moreButtonProps = useMemo(() => ({
-        title: moreButtonTitle,
-    }), [moreButtonTitle]);
-    const dropdownMenuItems = useMemo(() => hiddenItems.map((item) => (Object.assign(Object.assign({}, item), { action: item.onClick }))), [hiddenItems]);
-    const shouldRenderLogo = view !== 'clear' && Boolean(logo);
-    const shouldRenderMenu = ((_a = menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) !== null && _a !== void 0 ? _a : 0) > 0;
-    return (React__default.createElement("footer", { className: b$1({ desktop: true, 'with-divider': withDivider, view }, className) },
-        shouldRenderMenu && (React__default.createElement("div", { className: b$1('menu', { measured }), ref: menuContainerRef },
-            visibleItems.length > 0 && (React__default.createElement(Menu, { className: b$1('list') }, visibleItems.map((item, index) => (React__default.createElement(MenuItem, Object.assign({ key: index }, item, { className: b$1('menu-item', item.className) })))))),
-            dropdownMenuItems.length > 0 && (React__default.createElement(DropdownMenu, { items: dropdownMenuItems, switcherWrapperClassName: b$1('more-button'), popupProps: moreItemsPopupProps, defaultSwitcherProps: moreButtonProps, onSwitcherClick: onMoreButtonClick })))),
-        React__default.createElement("div", { className: b$1('right') },
-            React__default.createElement("small", { className: b$1('copyright', { small: !(menuItems === null || menuItems === void 0 ? void 0 : menuItems.length) }) }, copyright),
-            shouldRenderLogo && (React__default.createElement("div", { className: logoWrapperClassName },
-                React__default.createElement(Logo, Object.assign({}, logo)))))));
-};
-
-var css_248z = ".gn-footer_mobile{background:var(--g-color-base-background);display:flex;flex-direction:column;padding:var(--g-spacing-1) var(--g-spacing-6) var(--g-spacing-3) var(--g-spacing-3)}.gn-footer_mobile .gn-footer_with-divider{border-top:1px solid var(--g-color-line-generic)}.gn-footer_mobile .gn-footer__menu{align-items:center;display:flex;justify-content:space-between;margin-bottom:var(--g-spacing-1);visibility:hidden}.gn-footer_mobile .gn-footer__menu_measured{visibility:visible}.gn-footer_mobile .gn-footer__list[class]{background-color:inherit;display:flex;padding:0}.gn-footer_mobile .gn-footer__menu-item{box-sizing:border-box;padding:var(--g-spacing-2) var(--g-spacing-3)}.gn-footer_mobile .gn-footer__bottom-row{align-items:center;display:flex;justify-content:space-between}.gn-footer_mobile .gn-footer__copyright{color:var(--g-color-text-secondary);font-size:var(--g-text-caption-2-font-size);font-weight:var(--g-text-caption-font-weight);line-height:var(--g-text-caption-2-line-height);padding:0 var(--g-spacing-3);white-space:nowrap}.gn-footer__modal .gn-footer__menu-item{color:var(--g-color-text-primary);font-size:var(--g-text-body-2-font-size);font-weight:var(--g-text-body-font-weight);height:48px;line-height:var(--g-text-body-2-line-height)}.gn-footer_view_clear{background:transparent;z-index:-1}.gn-footer_view_clear .gn-footer__bottom-row{justify-content:flex-end}";
-styleInject(css_248z);
-
-const b = block('footer');
-const modalId = 'footer-more-items';
-const MobileFooter = ({ className, menuItems: providedMenuItems, withDivider, moreButtonTitle, onMoreButtonClick, view = 'normal', logo, logoWrapperClassName, copyright, }) => {
-    const [moreItemsMenuVisible, setMoreItemsMenuVisible] = useState(false);
-    const menuContainerRef = useRef(null);
-    const handleOpenMoreItemsMenu = useCallback((event) => {
-        setMoreItemsMenuVisible(true);
-        onMoreButtonClick === null || onMoreButtonClick === void 0 ? void 0 : onMoreButtonClick(event);
-    }, [onMoreButtonClick]);
-    const handleCloseMoreItemsMenu = useCallback(() => {
-        setMoreItemsMenuVisible(false);
-    }, []);
-    const menuItems = view === 'clear' ? undefined : providedMenuItems;
-    const { visibleItems, hiddenItems, measured } = useOverflowingHorizontalListItems({
-        containerRef: menuContainerRef,
-        items: menuItems,
-        itemSelector: `.${b('menu-item')}`,
-        moreButtonWidth: 28,
-    });
-    const renderMenu = (items) => (React__default.createElement(Menu, { className: b('list') }, items.map((item, index) => (React__default.createElement(MenuItem, Object.assign({ key: index }, item, { className: b('menu-item', item.className) }))))));
-    const shouldRenderLogo = view !== 'clear' && Boolean(logo);
-    return (React__default.createElement("footer", { className: b({ mobile: true, 'with-divider': withDivider, view }, className) },
-        React__default.createElement("div", { className: b('menu', { measured }), ref: menuContainerRef },
-            visibleItems.length > 0 && renderMenu(visibleItems),
-            hiddenItems.length > 0 && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement(Button, { view: "flat-secondary", size: "l", onClick: handleOpenMoreItemsMenu, title: moreButtonTitle },
-                    React__default.createElement(Icon, { data: Ellipsis, size: 16 })),
-                React__default.createElement(Sheet, { id: modalId, visible: moreItemsMenuVisible, className: b('modal'), contentClassName: b('modal-content'), onClose: handleCloseMoreItemsMenu }, renderMenu(hiddenItems))))),
-        React__default.createElement("div", { className: b('bottom-row') },
-            React__default.createElement("small", { className: b('copyright') }, copyright),
-            shouldRenderLogo && (React__default.createElement("div", { className: logoWrapperClassName },
-                React__default.createElement(Logo, Object.assign({}, logo)))))));
-};
-
-export { Footer, MobileFooter };
+export { AsideHeader } from './components/AsideHeader/AsideHeader.js';
+export { AsideHeaderContextProvider, useAsideHeaderContext } from './components/AsideHeader/AsideHeaderContext.js';
+export { FooterItem } from './components/FooterItem/FooterItem.js';
+export { PageLayout } from './components/AsideHeader/components/PageLayout/PageLayout.js';
+export { PageLayoutAside } from './components/AsideHeader/components/PageLayout/PageLayoutAside.js';
+export { AsideFallback } from './components/AsideHeader/components/PageLayout/AsideFallback.js';
+export { Drawer, DrawerItem } from './components/Drawer/Drawer.js';
+export { ActionBar } from './components/ActionBar/ActionBar.js';
+export { Title } from './components/Title/Title.js';
+export { HotkeysPanel } from './components/HotkeysPanel/HotkeysPanel.js';
+export { useSettingsSelectionContext } from './components/Settings/Selection/context.js';
+export { Settings, useSettingsContext } from './components/Settings/Settings.js';
+export { MobileHeader } from './components/MobileHeader/MobileHeader.js';
+export { FooterItem as MobileHeaderFooterItem } from './components/MobileHeader/FooterItem/FooterItem.js';
+export { getMobileHeaderCustomEvent } from './components/MobileHeader/utils.js';
+export { MOBILE_HEADER_EVENT_NAMES } from './components/MobileHeader/constants.js';
+export { Logo } from './components/Logo/Logo.js';
+export { MobileLogo } from './components/MobileLogo/MobileLogo.js';
+export { Footer } from './components/Footer/desktop/Footer.js';
+export { MobileFooter } from './components/Footer/mobile/Footer.js';
 //# sourceMappingURL=index.js.map