@diplodoc/client 3.7.3 → 3.8.1

package/build/components/App/index.d.ts

@@ -1,8 +1,9 @@
 import type { NavigationData, PageContent } from '@gravity-ui/page-constructor';
 import type { SearchConfig } from '../Search';
 import type { RouterConfig } from '../Router';
-import { ReactElement } from 'react';
-import { DocContentPageData as DocContentPageDataBase, DocLeadingPageData, DocPageData, Lang } from '@diplodoc/components';
+import type { ReactElement } from 'react';
+import type { DocContentPageData as DocContentPageDataBase, DocLeadingPageData, DocPageData } from '@diplodoc/components';
+import { Lang } from '@diplodoc/components';
 import '@diplodoc/transform/dist/js/yfm';
 import '../../interceptors/leading-page-links';
 import './App.scss';

package/build/server/app.js

@@ -918,6 +918,7 @@ var LINK_KEYS = toConsumableArray_default()(new Set([].concat(LINK_KEYS_LEADING_
 ;// ./src/utils.ts
 
 
+
 function isBrowser() {
   return typeof document !== 'undefined';
 }
@@ -1012,6 +1013,58 @@ function setSetting(name, value) {
     sessionStorage.setItem(name, String(value));
   } catch (_unused2) {}
 }
+function isHeaderTag(el) {
+  if (!el) return false;
+  return ['H1', 'H2', 'H3', 'H4', 'H5', 'H6'].indexOf(el.tagName) !== -1;
+}
+function isCutTag(el) {
+  if (!el) return false;
+  return el.matches('.yfm-cut');
+}
+function focusActiveTab(cutNode) {
+  cutNode.classList.toggle('open');
+  cutNode.setAttribute('open', 'true');
+  cutNode.classList.add('cut-highlight');
+  cutNode.scrollIntoView(true);
+  window.scrollBy(0, -100);
+  setTimeout(function () {
+    cutNode.classList.remove('cut-highlight');
+  }, 1000);
+}
+
+/**
+ * Scrolls to the element.
+ * If the element is a heading - simply scrolls to it, since needed offset is already in css.
+ * If the element is of any other type - calculate the offset form the element position in heading and scroll to it.
+ * @param {HTMLElement} el
+ */
+
+function scrollToElement(el) {
+  if (!el) return;
+  if (isHeaderTag(el)) {
+    // Header already includes the offset in css
+    // That puts it where we want it when it's scrolled to
+    el.scrollIntoView();
+  } else if (isCutTag(el)) {
+    focusActiveTab(el);
+  } else {
+    var _header$clientHeight;
+    // For elements other than headers calculate the offset
+    var _ref2 = Array.from(document.getElementsByClassName('Layout__header')),
+      _ref3 = slicedToArray_default()(_ref2, 1),
+      header = _ref3[0];
+    var headerOffset = (_header$clientHeight = header === null || header === void 0 ? void 0 : header.clientHeight) !== null && _header$clientHeight !== void 0 ? _header$clientHeight : 0;
+    var anchorPosition = el.offsetTop;
+    window.scrollTo(0, anchorPosition - headerOffset);
+  }
+}
+function scrollToHash() {
+  var hash = window.location.hash.substring(1);
+  if (hash) {
+    var element = document.getElementById(hash);
+    scrollToElement(element);
+  }
+}
 // EXTERNAL MODULE: ./src/interceptors/leading-page-links.js
 var leading_page_links = __webpack_require__(44186);
 // EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/objectWithoutProperties.js
@@ -1561,8 +1614,8 @@ function useMobile() {
   }, [onResizeHandler]);
   return mobileView;
 }
-// EXTERNAL MODULE: ./node_modules/@diplodoc/mdx-extension/build/esm/index.js + 20 modules
-var esm = __webpack_require__(2097);
+// EXTERNAL MODULE: ./node_modules/@diplodoc/mdx-extension/build/esm/hooks/useMdxSsr.js + 8 modules
+var useMdxSsr = __webpack_require__(91353);
 ;// ./src/components/App/withMdxInit.tsx
 
 function withMdxInit_ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -1583,16 +1636,16 @@ var withMdxInit = function withMdxInit(_ref) {
         refCtr.current = v;
         return forwardRef(v);
       }, [forwardRef]);
-      (0,esm/* useMdxSsr */.Xf)({
+      var node = (0,useMdxSsr/* default */.A)({
         refCtr: refCtr,
         components: components,
         pureComponents: pureComponents,
         mdxArtifacts: mdxArtifacts,
         html: html
       });
-      return /*#__PURE__*/react.createElement(Component, withMdxInit_objectSpread(withMdxInit_objectSpread({}, props), {}, {
+      return /*#__PURE__*/react.createElement(react.Fragment, null, /*#__PURE__*/react.createElement(Component, withMdxInit_objectSpread(withMdxInit_objectSpread({}, props), {}, {
         forwardRef: forwardRefWrap
-      }));
+      })), node);
     };
   };
   return withMdx;
@@ -1681,6 +1734,7 @@ function App(props) {
     updateThemeClassName({
       theme: theme
     });
+    scrollToHash();
   }, [theme, mobileView, wideFormat, fullScreen, landingPage]);
   return /*#__PURE__*/react.createElement("div", {
     className: "App"