@gravity-ui/navigation 3.7.1 → 3.7.3

package/build/esm/{index-BaZqZCxx.js → index-f1GutIB3.js}

@@ -118,10 +118,10 @@ function styleInject(css, ref) {
   }
 }
 
-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)}";
+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)}";
 styleInject(css_248z$u);
 
-const TopAlert$1 = React__default.lazy(() => import('./index-GjroEBM5.js').then((module) => ({ default: module.TopAlert })));
+const TopAlert$1 = React__default.lazy(() => import('./index-BwxN_FEJ.js').then((module) => ({ default: module.TopAlert })));
 const Layout = ({ compact, className, children, topAlert }) => {
     const size = compact ? ASIDE_HEADER_COMPACT_WIDTH : ASIDE_HEADER_EXPANDED_WIDTH;
     const asideHeaderContextValue = useMemo(() => ({ size, compact }), [compact, size]);
@@ -4470,7 +4470,7 @@ function useResizableDrawerItem(params) {
     return { resizedWidth: displayWidth, resizerHandlers: handlers, isResizing };
 }
 
-var css_248z$l = ".gn-drawer{--_--item-shadow-default:0 1px 5px 0 var(--g-color-sfx-shadow);--_--item-position:fixed;--_--resizer-width:8px;--_--resizer-color:var(--g-color-base-generic);--_--resizer-handle-color:var(--g-color-line-generic);--_--resizer-handle-color-hover:var(--g-color-line-generic-hover);--_--resizer-z-index:100;--_--veil-background-color:var(--g-color-sfx-veil);pointer-events:none}.gn-drawer_hideVeil{--_--item-shadow:var(--gn-drawer-item-shadow,var(--_--item-shadow-default))}.gn-drawer__item{background-color:var(--g-color-base-background);bottom:0;box-shadow:var(--_--item-shadow,none);height:100%;left:var(--gn-aside-header-size,0);pointer-events:auto;position:var(--gn-drawer-item-position,var(--_--item-position));top:var(--gn-top-alert-height,0);will-change:transform;z-index:var(--gn-drawer-item-z-index)}.gn-drawer__item_direction_right{left:auto;right:0}.gn-drawer__item_direction_top{bottom:auto;right:0}.gn-drawer__item_direction_bottom{right:0;top:auto}.gn-drawer__item-transition-enter{transform:translate(-100%)}.gn-drawer__item-transition_direction_right-enter{transform:translate(100%)}.gn-drawer__item-transition_direction_top-enter{transform:translateY(-100%)}.gn-drawer__item-transition_direction_bottom-enter{transform:translateY(100%)}.gn-drawer__item-transition-enter-active,.gn-drawer__item-transition_direction_bottom-enter-active,.gn-drawer__item-transition_direction_right-enter-active,.gn-drawer__item-transition_direction_top-enter-active{transform:translate(0);transition:transform .3s}.gn-drawer__item-transition-enter-done,.gn-drawer__item-transition_direction_bottom-enter-done,.gn-drawer__item-transition_direction_right-enter-done,.gn-drawer__item-transition_direction_top-enter-done{filter:blur(0);transform:translateZ(0)}.gn-drawer__item-transition-exit,.gn-drawer__item-transition_direction_bottom-exit,.gn-drawer__item-transition_direction_right-exit,.gn-drawer__item-transition_direction_top-exit{transform:translate(0)}.gn-drawer__item-transition-exit-active,.gn-drawer__item-transition_direction_bottom-exit-active,.gn-drawer__item-transition_direction_right-exit-active,.gn-drawer__item-transition_direction_top-exit-active{transition:transform .3s}.gn-drawer__item-transition-exit-active{transform:translate(-100%)}.gn-drawer__item-transition_direction_right-exit-active{transform:translate(100%)}.gn-drawer__item-transition_direction_top-exit-active{transform:translateY(-100%)}.gn-drawer__item-transition_direction_bottom-exit-active{transform:translateY(100%)}.gn-drawer__item-transition-exit-done,.gn-drawer__item-transition_direction_bottom-exit-done,.gn-drawer__item-transition_direction_right-exit-done,.gn-drawer__item-transition_direction_top-exit-done,.gn-drawer__item_hidden{visibility:hidden}.gn-drawer__veil{background-color:var(--gn-drawer-veil-background-color,var(--_--veil-background-color));inset:0;pointer-events:auto;position:absolute;z-index:var(--gn-drawer-veil-z-index)}.gn-drawer__veil_hidden{display:none}.gn-drawer__veil-transition-enter{opacity:0}.gn-drawer__veil-transition-enter-active{opacity:1;transition:opacity .3s}.gn-drawer__veil-transition-exit{opacity:1}.gn-drawer__veil-transition-exit-active{opacity:0;transition:opacity .3s}.gn-drawer__veil-transition-exit-done{visibility:hidden}.gn-drawer__resizer-handle{background:var(--gn-drawer-item-resizer-handle-color,var(--_--resizer-handle-color));border-radius:2px;height:28px;width:2px}.gn-drawer__resizer-handle_direction_bottom,.gn-drawer__resizer-handle_direction_top{height:2px;width:28px}.gn-drawer__resizer{align-items:center;background:var(--gn-drawer-item-resizer-color,var(--_--resizer-color));cursor:col-resize;display:flex;flex-direction:column;height:100%;justify-content:center;position:absolute;top:0;width:var(--gn-drawer-item-resizer-width,var(--_--resizer-width));z-index:var(--gn-drawer-item-resizer-z-index,var(--_--resizer-z-index))}.gn-drawer__resizer_direction_right{left:0;top:var(--gn-top-alert-height,0)}.gn-drawer__resizer_direction_left{right:0;top:var(--gn-top-alert-height,0)}.gn-drawer__resizer_direction_top{bottom:0;left:0;top:unset}.gn-drawer__resizer_direction_bottom{left:0;top:0}.gn-drawer__resizer_direction_bottom,.gn-drawer__resizer_direction_top{cursor:row-resize;height:var(--gn-drawer-item-resizer-width,var(--_--resizer-width));width:100%}.gn-drawer__resizer:hover .gn-drawer__resizer-handle{background:var(--gn-drawer-item-resizer-handle-color-hover,var(--_--resizer-handle-color-hover))}";
+var css_248z$l = ".gn-drawer{--_--item-shadow-default:0 1px 5px 0 var(--g-color-sfx-shadow);--_--item-position:fixed;--_--resizer-width:8px;--_--resizer-color:var(--g-color-base-generic);--_--resizer-handle-color:var(--g-color-line-generic);--_--resizer-handle-color-hover:var(--g-color-line-generic-hover);--_--resizer-z-index:100;--_--veil-background-color:var(--g-color-sfx-veil);pointer-events:none;z-index:var(--gn-drawer-z-index)}.gn-drawer_hideVeil{--_--item-shadow:var(--gn-drawer-item-shadow,var(--_--item-shadow-default))}.gn-drawer__item{background-color:var(--g-color-base-background);bottom:0;box-shadow:var(--_--item-shadow,none);height:100%;left:var(--gn-aside-header-size,0);pointer-events:auto;position:var(--gn-drawer-item-position,var(--_--item-position));top:var(--gn-top-alert-height,0);will-change:transform;z-index:var(--gn-drawer-item-z-index)}.gn-drawer__item_direction_right{left:auto;right:0}.gn-drawer__item_direction_top{bottom:auto;right:0}.gn-drawer__item_direction_bottom{right:0;top:auto}.gn-drawer__item-transition-enter{transform:translate(-100%)}.gn-drawer__item-transition_direction_right-enter{transform:translate(100%)}.gn-drawer__item-transition_direction_top-enter{transform:translateY(-100%)}.gn-drawer__item-transition_direction_bottom-enter{transform:translateY(100%)}.gn-drawer__item-transition-enter-active,.gn-drawer__item-transition_direction_bottom-enter-active,.gn-drawer__item-transition_direction_right-enter-active,.gn-drawer__item-transition_direction_top-enter-active{transform:translate(0);transition:transform .3s}.gn-drawer__item-transition-enter-done,.gn-drawer__item-transition_direction_bottom-enter-done,.gn-drawer__item-transition_direction_right-enter-done,.gn-drawer__item-transition_direction_top-enter-done{filter:blur(0);transform:translateZ(0)}.gn-drawer__item-transition-exit,.gn-drawer__item-transition_direction_bottom-exit,.gn-drawer__item-transition_direction_right-exit,.gn-drawer__item-transition_direction_top-exit{transform:translate(0)}.gn-drawer__item-transition-exit-active,.gn-drawer__item-transition_direction_bottom-exit-active,.gn-drawer__item-transition_direction_right-exit-active,.gn-drawer__item-transition_direction_top-exit-active{transition:transform .3s}.gn-drawer__item-transition-exit-active{transform:translate(-100%)}.gn-drawer__item-transition_direction_right-exit-active{transform:translate(100%)}.gn-drawer__item-transition_direction_top-exit-active{transform:translateY(-100%)}.gn-drawer__item-transition_direction_bottom-exit-active{transform:translateY(100%)}.gn-drawer__item-transition-exit-done,.gn-drawer__item-transition_direction_bottom-exit-done,.gn-drawer__item-transition_direction_right-exit-done,.gn-drawer__item-transition_direction_top-exit-done,.gn-drawer__item_hidden{visibility:hidden}.gn-drawer__veil{background-color:var(--gn-drawer-veil-background-color,var(--_--veil-background-color));inset:0;pointer-events:auto;position:absolute;z-index:var(--gn-drawer-veil-z-index)}.gn-drawer__veil_hidden{display:none}.gn-drawer__veil-transition-enter{opacity:0}.gn-drawer__veil-transition-enter-active{opacity:1;transition:opacity .3s}.gn-drawer__veil-transition-exit{opacity:1}.gn-drawer__veil-transition-exit-active{opacity:0;transition:opacity .3s}.gn-drawer__veil-transition-exit-done{visibility:hidden}.gn-drawer__resizer-handle{background:var(--gn-drawer-item-resizer-handle-color,var(--_--resizer-handle-color));border-radius:2px;height:28px;width:2px}.gn-drawer__resizer-handle_direction_bottom,.gn-drawer__resizer-handle_direction_top{height:2px;width:28px}.gn-drawer__resizer{align-items:center;background:var(--gn-drawer-item-resizer-color,var(--_--resizer-color));cursor:col-resize;display:flex;flex-direction:column;height:100%;justify-content:center;position:absolute;top:0;width:var(--gn-drawer-item-resizer-width,var(--_--resizer-width));z-index:var(--gn-drawer-item-resizer-z-index,var(--_--resizer-z-index))}.gn-drawer__resizer_direction_right{left:0;top:var(--gn-top-alert-height,0)}.gn-drawer__resizer_direction_left{right:0;top:var(--gn-top-alert-height,0)}.gn-drawer__resizer_direction_top{bottom:0;left:0;top:unset}.gn-drawer__resizer_direction_bottom{left:0;top:0}.gn-drawer__resizer_direction_bottom,.gn-drawer__resizer_direction_top{cursor:row-resize;height:var(--gn-drawer-item-resizer-width,var(--_--resizer-width));width:100%}.gn-drawer__resizer:hover .gn-drawer__resizer-handle{background:var(--gn-drawer-item-resizer-handle-color-hover,var(--_--resizer-handle-color-hover))}";
 styleInject(css_248z$l);
 
 const b$m = block('drawer');
@@ -4569,7 +4569,7 @@ const Drawer = ({ className, veilClassName, children, style, onVeilClick, onEsca
 
 const Panels = () => {
     const { panelItems, onClosePanel, size } = useAsideHeaderInnerContext();
-    return panelItems ? (React__default.createElement(Drawer, { className: b$v('panels'), onVeilClick: onClosePanel, onEscape: onClosePanel, style: { left: size } }, panelItems.map((item) => (React__default.createElement(DrawerItem, Object.assign({ key: item.id }, item)))))) : null;
+    return panelItems ? (React__default.createElement(Drawer, { className: b$v('panels'), onVeilClick: onClosePanel, onEscape: onClosePanel, style: { left: size } }, panelItems.map((item) => (React__default.createElement(DrawerItem, Object.assign({ key: item.id, className: b$v('panel') }, item)))))) : null;
 };
 
 const MENU_ITEMS_COMPOSITE_ID = 'gravity-ui/navigation-menu-items-composite-bar';
@@ -5168,23 +5168,9 @@ function requireIdentity () {
 var identityExports = requireIdentity();
 var identity = /*@__PURE__*/getDefaultExportFromCjs(identityExports);
 
-function isSectionSelected(selected, pageId, section) {
-    var _a;
-    if (!selected.section || selected.setting) {
-        return false;
-    }
-    else if (selected.section.id && selected.section.id === section.id) {
-        return true;
-    }
-    else if (((_a = selected.page) === null || _a === undefined ? undefined : _a.id) === pageId &&
-        selected.section.title &&
-        selected.section.title === section.title) {
-        return true;
-    }
-    else {
-        return false;
-    }
-}
+const SettingsContext = React__default.createContext({});
+
+const useSettingsContext = () => React__default.useContext(SettingsContext);
 
 var css_248z$c = ".gn-settings-menu__group-heading{display:inline-block;font-weight:var(--g-text-accent-font-weight);line-height:18px;margin-bottom:12px;padding:0 20px}.gn-settings-menu__group+.gn-settings-menu__group{margin-top:24px}.gn-settings-menu__item+.gn-settings-menu__group{margin-top:8px}.gn-settings-menu__item{align-items:center;color:var(--g-color-text-primary);cursor:pointer;display:flex;height:40px;padding:0 20px}.gn-settings-menu__item-icon{color:var(--g-color-text-misc);margin-right:5px}.gn-settings-menu__item:hover,.gn-settings-menu__item_focused{background:var(--g-color-base-simple-hover)}.gn-settings-menu__item_selected{background:var(--g-color-base-selection)}.gn-settings-menu__item_selected.gn-settings-menu__item_focused,.gn-settings-menu__item_selected:hover{background:var(--g-color-base-selection-hover)}.gn-settings-menu__item_disabled{color:var(--g-color-text-secondary);cursor:auto}.gn-settings-menu__item_disabled:hover{background:none}.gn-settings-menu__item_disabled .gn-settings-menu__item-icon{color:var(--g-color-base-misc-heavy)}.gn-settings-menu__item_badge{position:relative}.gn-settings-menu__item_badge:after{background-color:var(--g-color-text-danger);border-radius:50%;content:\"\";display:block;height:6px;position:absolute;right:9px;top:calc(50% - 3px);width:6px}";
 styleInject(css_248z$c);
@@ -5291,7 +5277,97 @@ const SettingsMenuMobile = ({ items, onChange, activeItemId, className, }) => {
         React__default.createElement(Tabs, { items: tabItems, className: b$c(null, className), size: "l", activeTab: activeItemId, onSelectTab: onChange })));
 };
 
-const b$b = block('settings-search');
+function isSectionSelected(selected, pageId, section) {
+    var _a;
+    if (!selected.section || selected.setting) {
+        return false;
+    }
+    else if (selected.section.id && selected.section.id === section.id) {
+        return true;
+    }
+    else if (((_a = selected.page) === null || _a === undefined ? undefined : _a.id) === pageId &&
+        selected.section.title &&
+        selected.section.title === section.title) {
+        return true;
+    }
+    else {
+        return false;
+    }
+}
+
+const b$b = block('settings');
+
+function prepareTitle(string, search) {
+    let temp = string.slice(0);
+    const title = [];
+    const parts = escapeStringForRegExp(search).split(' ').filter(Boolean);
+    let key = 0;
+    for (const part of parts) {
+        const regex = new RegExp(part, 'ig');
+        const match = regex.exec(temp);
+        if (match) {
+            const m = match[0];
+            const i = match.index;
+            if (i > 0) {
+                title.push(temp.slice(0, i));
+            }
+            title.push(React__default.createElement("strong", { key: key++, className: b$b('found') }, m));
+            temp = temp.slice(i + m.length);
+        }
+    }
+    if (temp) {
+        title.push(temp);
+    }
+    return title;
+}
+
+const SettingRow = ({ title: settingTitle, element, search, }) => {
+    return (React__default.createElement("div", { className: b$b('section-item') }, React__default.cloneElement(element, Object.assign(Object.assign({}, element.props), { highlightedTitle: search && settingTitle ? prepareTitle(settingTitle, search) : settingTitle }))));
+};
+SettingRow.displayName = 'SettingRow';
+
+const SettingsSection = React__default.forwardRef((_a, ref) => {
+    var { search, isMobile, isSelected } = _a, section = __rest(_a, ["search", "isMobile", "isSelected"]);
+    const { renderSectionRightAdornment, showRightAdornmentOnHover } = useSettingsContext();
+    return (React__default.createElement("div", { className: b$b('section', { selected: isSelected }), ref: isSelected ? ref : undefined },
+        section.title && !section.hideTitle && (React__default.createElement("h3", { className: b$b('section-heading') }, renderSectionRightAdornment ? (React__default.createElement(Flex, { gap: 2, alignItems: 'center' },
+            section.title,
+            React__default.createElement("div", { className: b$b('section-right-adornment', {
+                    hidden: showRightAdornmentOnHover,
+                }) }, renderSectionRightAdornment(section)))) : (section.title))),
+        section.header &&
+            (isMobile ? (React__default.createElement("div", { className: b$b('section-subheader') }, section.header)) : (section.header)),
+        section.items.map((setting) => setting.hidden ? null : (React__default.createElement(SettingRow, Object.assign({}, setting, { key: setting.title, search: search }))))));
+});
+SettingsSection.displayName = 'SettingsSection';
+
+const getPageTitleById = (menu, activePage) => {
+    for (const firstLevel of menu) {
+        if ('groupTitle' in firstLevel) {
+            for (const secondLevel of firstLevel.items)
+                if (secondLevel.id === activePage)
+                    return secondLevel.title;
+        }
+        else if (firstLevel.id === activePage)
+            return firstLevel.title;
+    }
+    return '';
+};
+
+const SettingsPageComponent = ({ menu, pages, selected, isMobile, search, page, renderNotFound, emptyPlaceholder, onClose, }) => {
+    if (!page) {
+        return typeof renderNotFound === 'function' ? (React__default.createElement(React__default.Fragment, null, renderNotFound())) : (React__default.createElement("div", { className: b$b('not-found') }, emptyPlaceholder));
+    }
+    const filteredSections = pages[page].sections.filter((section) => !section.hidden);
+    return (React__default.createElement(React__default.Fragment, null,
+        !isMobile && (React__default.createElement(Title, { hasSeparator: true, onClose: onClose }, getPageTitleById(menu, page))),
+        React__default.createElement("div", { className: b$b('content') }, filteredSections.map((section) => {
+            const isSelected = isSectionSelected(selected, page, section);
+            return (React__default.createElement(SettingsSection, Object.assign({ isSelected: isSelected, isMobile: isMobile, search: search }, section, { key: section.title })));
+        }))));
+};
+
+const b$a = block('settings-search');
 function SettingsSearch({ className, initialValue, onChange, debounce = 200, inputRef, inputSize, placeholder, autoFocus = true, selection, }) {
     const [value, setValue] = React__default.useState(initialValue !== null && initialValue !== undefined ? initialValue : '');
     const onChangeDebounced = debounceFn(onChange, debounce);
@@ -5308,7 +5384,7 @@ function SettingsSearch({ className, initialValue, onChange, debounce = 200, inp
         // Remove any search, if selection is passed
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [selection]);
-    return (React__default.createElement("div", { className: b$b(null, className) },
+    return (React__default.createElement("div", { className: b$a(null, className) },
         React__default.createElement(TextInput, { value: value, controlRef: inputRef, hasClear: true, autoFocus: autoFocus, size: inputSize, placeholder: placeholder, onUpdate: handleUpdate, controlProps: {
                 'aria-label': i18n$1('label_search'),
             } })));
@@ -5317,32 +5393,16 @@ function SettingsSearch({ className, initialValue, onChange, debounce = 200, inp
 var css_248z$a = ".gn-settings{display:grid;grid-template-columns:216px 1fr;height:100%;width:834px}.gn-settings_view_mobile{display:block;height:calc(80vh - 56px);overflow-x:hidden;width:auto}@supports (height:90dvh){.gn-settings_view_mobile{height:calc(90dvh - 56px)}}.gn-settings_view_mobile.gn-settings_loading{text-align:center}.gn-settings_view_mobile .gn-settings__loader{margin-top:20px}.gn-settings_view_mobile .gn-settings__search{margin:4px 0 16px;padding:0 20px}.gn-settings_view_mobile .gn-settings__page{overflow-y:visible}.gn-settings_view_mobile .gn-settings__tabs .g-tabs__item:first-child{margin-left:20px}.gn-settings_view_mobile .gn-settings__tabs .g-tabs__item:last-child{margin-right:20px}.gn-settings_view_mobile .gn-settings__section-heading{font-family:var(--g-text-subheader-font-family);font-size:var(--g-text-subheader-3-font-size);font-weight:var(--g-text-subheader-font-weight);line-height:var(--g-text-subheader-3-line-height)}.gn-settings_view_mobile .gn-settings__section-subheader{color:var(--g-color-text-secondary)}.gn-settings_view_mobile .gn-settings__section-heading+.gn-settings-subheader{margin-top:8px}.gn-settings_view_mobile .gn-settings__section-item{margin-top:0}.gn-settings_view_mobile .gn-settings__section-heading+.gn-settings__section-item,.gn-settings_view_mobile .gn-settings__section-subheader+.gn-settings__section-item{margin-top:30px}.gn-settings_view_mobile .gn-settings__section-item+.gn-settings__section-item{margin-top:22px}.gn-settings_view_mobile .gn-settings__item:not(.gn-settings_view_mobile .gn-settings__item_mode_row){gap:8px;grid-template-columns:1fr}.gn-settings_view_mobile .gn-settings__item-heading{font-family:var(--g-text-body-font-family);font-size:var(--g-text-body-2-font-size);font-weight:var(--g-text-body-font-weight);line-height:var(--g-text-body-2-line-height)}.gn-settings_view_mobile .gn-settings__item-description{font-family:var(--g-text-body-font-family);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)}.gn-settings_view_mobile .gn-settings__item_mode_row{grid-template-columns:1fr auto}.gn-settings_view_mobile .gn-settings__item_mode_row .gn-settings__item-heading{padding-right:20px}.gn-settings_view_mobile .gn-settings__item-content{width:100%}.gn-settings_view_mobile .gn-settings__not-found{color:var(--g-color-text-hint);font-family:var(--g-text-body-font-family);font-size:var(--g-text-body-2-font-size);font-weight:var(--g-text-body-font-weight);justify-items:start;line-height:var(--g-text-body-2-line-height);margin:20px 0 0 20px}.gn-settings_loading{grid-template-columns:auto}.gn-settings__loader{place-self:center}.gn-settings__not-found{display:grid;height:100%;place-items:center}.gn-settings__menu{border-right:1px solid var(--g-color-line-generic)}.gn-settings__heading{font-family:var(--g-text-subheader-font-family);font-size:var(--g-text-subheader-2-font-size);font-weight:var(--g-text-subheader-font-weight);line-height:var(--g-text-subheader-2-line-height);margin:20px 20px 0}.gn-settings__search{margin:0 20px 16px}.gn-settings__page{overflow-y:auto}.gn-settings__content{padding:20px}.gn-settings__section-right-adornment_hidden{opacity:0;transition:opacity .2s}.gn-settings__section-heading:hover .gn-settings__section-right-adornment_hidden{opacity:1}.gn-settings__section-heading{font-family:var(--g-text-subheader-font-family);font-size:var(--g-text-subheader-2-font-size);font-weight:var(--g-text-subheader-font-weight);line-height:var(--g-text-subheader-2-line-height);margin:0}.gn-settings__section-item{margin-top:24px}.gn-settings__section+.gn-settings__section{margin-top:32px}.gn-settings__section:only-child .gn-settings__section-item:first-of-type{margin-top:0}.gn-settings__section:only-child .gn-settings__section-heading{display:none}.gn-settings__item{display:grid;grid-template-columns:216px 1fr;justify-items:start}.gn-settings__item_align_top{align-items:start}.gn-settings__item_align_center{align-items:center}.gn-settings__item-title_badge{position:relative}.gn-settings__item-title_badge:after{background-color:var(--g-color-text-danger);border-radius:50%;content:\"\";display:block;height:6px;position:absolute;right:-8px;top:1px;width:6px}.gn-settings__item-description{color:var(--g-color-text-secondary);display:block;font-family:var(--g-text-caption-font-family);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);margin-top:2px;padding-right:20px}.gn-settings__item-right-adornment_hidden{opacity:0;transition:opacity .2s}.gn-settings__item:hover .gn-settings__item-right-adornment_hidden{opacity:1}.gn-settings__item_selected,.gn-settings__section_selected{background:var(--g-color-base-selection);border-radius:8px;margin-left:-8px;padding:8px}.gn-settings__found{background:var(--g-color-base-selection);font-weight:var(--g-text-accent-font-weight)}";
 styleInject(css_248z$a);
 
-const b$a = block('settings');
-const SettingsContext = React__default.createContext({});
-const useSettingsContext = () => React__default.useContext(SettingsContext);
 function Settings(_a) {
     var { loading, renderLoading, children, view = 'normal', renderRightAdornment, renderSectionRightAdornment, showRightAdornmentOnHover = true } = _a, props = __rest(_a, ["loading", "renderLoading", "children", "view", "renderRightAdornment", "renderSectionRightAdornment", "showRightAdornmentOnHover"]);
     if (loading) {
-        return (React__default.createElement("div", { className: b$a({ loading: true, view }) }, typeof renderLoading === 'function' ? (renderLoading()) : (React__default.createElement(Loader, { className: b$a('loader'), size: "m" }))));
+        return (React__default.createElement("div", { className: b$b({ loading: true, view }) }, typeof renderLoading === 'function' ? (renderLoading()) : (React__default.createElement(Loader, { className: b$b('loader'), size: "m" }))));
     }
     return (React__default.createElement(SettingsContext.Provider, { value: { renderRightAdornment, renderSectionRightAdornment, showRightAdornmentOnHover } },
         React__default.createElement(SettingsContent, Object.assign({ view: view }, props), children)));
 }
-const getPageTitleById = (menu, activePage) => {
-    for (const firstLevel of menu) {
-        if ('groupTitle' in firstLevel) {
-            for (const secondLevel of firstLevel.items)
-                if (secondLevel.id === activePage)
-                    return secondLevel.title;
-        }
-        else if (firstLevel.id === activePage)
-            return firstLevel.title;
-    }
-    return '';
-};
 function SettingsContent({ initialPage, initialSearch, selection, children, renderNotFound, title = i18n$1('label_title'), filterPlaceholder = i18n$1('label_filter-placeholder'), emptyPlaceholder = i18n$1('label_empty-placeholder'), view, onPageChange, onClose, }) {
     var _a;
-    const { renderSectionRightAdornment, showRightAdornmentOnHover } = useSettingsContext();
     const [search, setSearch] = React__default.useState(initialSearch !== null && initialSearch !== undefined ? initialSearch : '');
     const { menu, pages } = getSettingsFromChildren(children, search);
     const selected = useSettingsSelectionProviderValue(pages, selection);
@@ -5399,35 +5459,11 @@ function SettingsContent({ initialPage, initialSearch, selection, children, rend
             selected.selectedRef.current.scrollIntoView();
         }
     }, [selected.selectedRef]);
-    const renderSetting = ({ title: settingTitle, element }) => {
-        return (React__default.createElement("div", { key: settingTitle, className: b$a('section-item') }, React__default.cloneElement(element, Object.assign(Object.assign({}, element.props), { highlightedTitle: search && settingTitle ? prepareTitle(settingTitle, search) : settingTitle }))));
-    };
-    const renderSection = (page, section) => {
-        const isSelected = isSectionSelected(selected, page, section);
-        return (React__default.createElement("div", { key: section.title, className: b$a('section', { selected: isSelected }), ref: isSelected ? selected.selectedRef : undefined },
-            section.title && !section.hideTitle && (React__default.createElement("h3", { className: b$a('section-heading') }, renderSectionRightAdornment ? (React__default.createElement(Flex, { gap: 2, alignItems: 'center' },
-                section.title,
-                React__default.createElement("div", { className: b$a('section-right-adornment', {
-                        hidden: showRightAdornmentOnHover,
-                    }) }, renderSectionRightAdornment(section)))) : (section.title))),
-            section.header &&
-                (isMobile ? (React__default.createElement("div", { className: b$a('section-subheader') }, section.header)) : (section.header)),
-            section.items.map((setting) => (setting.hidden ? null : renderSetting(setting)))));
-    };
-    const renderPageContent = (page) => {
-        if (!page) {
-            return typeof renderNotFound === 'function' ? (renderNotFound()) : (React__default.createElement("div", { className: b$a('not-found') }, emptyPlaceholder));
-        }
-        const filteredSections = pages[page].sections.filter((section) => !section.hidden);
-        return (React__default.createElement(React__default.Fragment, null,
-            !isMobile && (React__default.createElement(Title, { hasSeparator: true, onClose: onClose }, getPageTitleById(menu, page))),
-            React__default.createElement("div", { className: b$a('content') }, filteredSections.map((section) => renderSection(page, section)))));
-    };
     return (React__default.createElement(SettingsSelectionContextProvider, { value: selected },
-        React__default.createElement("div", { className: b$a({ view }) },
+        React__default.createElement("div", { className: b$b({ view }) },
             isMobile ? (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement(SettingsSearch, { inputRef: searchInputRef, className: b$a('search'), initialValue: initialSearch, selection: selection, onChange: setSearch, autoFocus: false, inputSize: 'xl' }),
-                React__default.createElement(SettingsMenuMobile, { items: menu, onChange: handlePageChange, activeItemId: activePage, className: b$a('tabs') }))) : (React__default.createElement("div", { className: b$a('menu'), onClick: () => {
+                React__default.createElement(SettingsSearch, { inputRef: searchInputRef, className: b$b('search'), initialValue: initialSearch, selection: selection, onChange: setSearch, autoFocus: false, inputSize: 'xl' }),
+                React__default.createElement(SettingsMenuMobile, { items: menu, onChange: handlePageChange, activeItemId: activePage, className: b$b('tabs') }))) : (React__default.createElement("div", { className: b$b('menu'), onClick: () => {
                     if (searchInputRef.current) {
                         searchInputRef.current.focus();
                     }
@@ -5439,9 +5475,10 @@ function SettingsContent({ initialPage, initialSearch, selection, children, rend
                     }
                 } },
                 React__default.createElement(Title, null, title),
-                React__default.createElement(SettingsSearch, { inputRef: searchInputRef, className: b$a('search'), initialValue: initialSearch, selection: selection, onChange: setSearch, placeholder: filterPlaceholder, autoFocus: true }),
+                React__default.createElement(SettingsSearch, { inputRef: searchInputRef, className: b$b('search'), initialValue: initialSearch, selection: selection, onChange: setSearch, placeholder: filterPlaceholder, autoFocus: true }),
                 React__default.createElement(SettingsMenu, { ref: menuRef, items: menu, onChange: handlePageChange, activeItemId: activePage }))),
-            React__default.createElement("div", { className: b$a('page') }, renderPageContent(activePage)))));
+            React__default.createElement("div", { className: b$b('page') },
+                React__default.createElement(SettingsPageComponent, { menu: menu, pages: pages, selected: selected, search: search, isMobile: isMobile, page: activePage, emptyPlaceholder: emptyPlaceholder, renderNotFound: renderNotFound, onClose: onClose })))));
 }
 Settings.Group = function SettingsGroup({ children }) {
     return React__default.createElement(React__default.Fragment, null, children);
@@ -5457,40 +5494,17 @@ Settings.Item = function SettingsItem(setting) {
     const selected = useSettingsSelectionContext();
     const isSettingSelected = selected.setting && selected.setting.id === id;
     const { renderRightAdornment, showRightAdornmentOnHover } = useSettingsContext();
-    const titleNode = (React__default.createElement("span", { className: b$a('item-title', { badge: withBadge }) }, renderTitleComponent(highlightedTitle)));
-    return (React__default.createElement("div", { className: b$a('item', { align, mode, selected: isSettingSelected }), ref: isSettingSelected ? selected.selectedRef : undefined },
-        React__default.createElement("label", { className: b$a('item-heading'), id: labelId },
-            renderRightAdornment ? (React__default.createElement(Flex, { className: b$a('item-title-wrapper'), gap: 3 },
+    const titleNode = (React__default.createElement("span", { className: b$b('item-title', { badge: withBadge }) }, renderTitleComponent(highlightedTitle)));
+    return (React__default.createElement("div", { className: b$b('item', { align, mode, selected: isSettingSelected }), ref: isSettingSelected ? selected.selectedRef : undefined },
+        React__default.createElement("label", { className: b$b('item-heading'), id: labelId },
+            renderRightAdornment ? (React__default.createElement(Flex, { className: b$b('item-title-wrapper'), gap: 3 },
                 titleNode,
-                React__default.createElement("div", { className: b$a('item-right-adornment', {
+                React__default.createElement("div", { className: b$b('item-right-adornment', {
                         hidden: showRightAdornmentOnHover,
                     }) }, renderRightAdornment(setting)))) : (titleNode),
-            description ? React__default.createElement("span", { className: b$a('item-description') }, description) : null),
-        React__default.createElement("div", { className: b$a('item-content') }, children)));
+            description ? React__default.createElement("span", { className: b$b('item-description') }, description) : null),
+        React__default.createElement("div", { className: b$b('item-content') }, children)));
 };
-function prepareTitle(string, search) {
-    let temp = string.slice(0);
-    const title = [];
-    const parts = escapeStringForRegExp(search).split(' ').filter(Boolean);
-    let key = 0;
-    for (const part of parts) {
-        const regex = new RegExp(part, 'ig');
-        const match = regex.exec(temp);
-        if (match) {
-            const m = match[0];
-            const i = match.index;
-            if (i > 0) {
-                title.push(temp.slice(0, i));
-            }
-            title.push(React__default.createElement("strong", { key: key++, className: b$a('found') }, m));
-            temp = temp.slice(i + m.length);
-        }
-    }
-    if (temp) {
-        title.push(temp);
-    }
-    return title;
-}
 
 const useForwardRef = (ref, initialValue = null) => {
     const targetRef = React__default.useRef(initialValue);
@@ -5669,7 +5683,7 @@ const OverlapPanel = ({ title, renderContent, className, onClose, action, closeT
 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}";
 styleInject(css_248z$4);
 
-const TopAlert = React__default.lazy(() => import('./index-GjroEBM5.js').then((module) => ({ default: module.TopAlert })));
+const TopAlert = React__default.lazy(() => import('./index-BwxN_FEJ.js').then((module) => ({ default: module.TopAlert })));
 const b$4 = block('mobile-header');
 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) => {
     const targetRef = useForwardRef(ref);
@@ -5962,5 +5976,5 @@ const MobileFooter = ({ className, menuItems: providedMenuItems, withDivider, mo
                 React__default.createElement(Logo, Object.assign({}, logo)))))));
 };
 
-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 };
-//# sourceMappingURL=index-BaZqZCxx.js.map
+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 };
+//# sourceMappingURL=index-f1GutIB3.js.map