@stoplight/elements-core 7.7.11 → 7.7.12

package/index.esm.js

@@ -10,6 +10,7 @@ import { parse } from '@stoplight/yaml';
 import { isArray as isArray$1, Box, Panel, CopyButton, Menu, Button, Text, Flex, Input, Icon, Select, FieldButton, Image, Link, useThemeIsDark, HStack, VStack, InvertTheme, Tooltip, Badge, LinkHeading as LinkHeading$1, NodeAnnotation, Tabs, TabList, Tab, TabPanels, TabPanel, Heading, useClipboard, useBreakpoints, useMosaicContext, Provider as Provider$1 } from '@stoplight/mosaic';
 import isObject from 'lodash/isObject.js';
 import { withErrorBoundary } from '@stoplight/react-error-boundary';
+import { useLocation, BrowserRouter, MemoryRouter, HashRouter, StaticRouter, Route } from 'react-router-dom';
 import { MarkdownViewer as MarkdownViewer$1, DefaultSMDComponents, MarkdownViewerProvider } from '@stoplight/markdown-viewer';
 export { DefaultSMDComponents } from '@stoplight/markdown-viewer';
 import cn from 'classnames';
@@ -38,7 +39,6 @@ import uniqBy from 'lodash/uniqBy.js';
 import formatXml from 'xml-formatter';
 import entries from 'lodash/entries.js';
 import keys from 'lodash/keys.js';
-import { useLocation, BrowserRouter, MemoryRouter, HashRouter, StaticRouter, Route } from 'react-router-dom';
 import { JsonSchemaViewer } from '@stoplight/json-schema-viewer';
 import sortBy from 'lodash/sortBy.js';
 import { HashLink } from 'react-router-hash-link';
@@ -246,14 +246,22 @@ function parseUnknown() {
     return undefined;
 }
 
+const RouterTypeContext = React.createContext(null);
+const useRouterType = () => {
+    return React.useContext(RouterTypeContext);
+};
+
 const MarkdownViewer = (props) => {
     return React.createElement(MarkdownViewer$1, Object.assign({}, props));
 };
 MarkdownViewer.displayName = 'MarkdownViewer';
 
 const ArticleComponent = React.memo(({ data }) => {
+    const { pathname } = useLocation();
+    const routerKind = React.useContext(RouterTypeContext);
+    const basePath = routerKind === 'hash' ? `#${pathname.split('#')[0]}` : '';
     return (React.createElement(Box, { className: "sl-elements-article" },
-        React.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true })));
+        React.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true, tocBasePath: basePath })));
 });
 const Article = withErrorBoundary(ArticleComponent, { recoverableProps: ['data'] });
 
@@ -2122,11 +2130,6 @@ ${scopes.map(([key, value]) => `- \`${key}\` - ${value}`).join('\n')}`;
     return description;
 }
 
-const RouterTypeContext = React.createContext(null);
-const useRouterType = () => {
-    return React.useContext(RouterTypeContext);
-};
-
 const LinkHeading = React.memo(function LinkHeading(props) {
     const isUsingRouter = !!useRouterType();
     const Comp = isUsingRouter ? CustomLinkHeading : LinkHeading$1;

package/index.js

@@ -13,6 +13,7 @@ var yaml = require('@stoplight/yaml');
 var mosaic = require('@stoplight/mosaic');
 var isObject = require('lodash/isObject.js');
 var reactErrorBoundary = require('@stoplight/react-error-boundary');
+var reactRouterDom = require('react-router-dom');
 var markdownViewer = require('@stoplight/markdown-viewer');
 var cn = require('classnames');
 var utils = require('jotai/utils');
@@ -40,7 +41,6 @@ var uniqBy = require('lodash/uniqBy.js');
 var formatXml = require('xml-formatter');
 var entries = require('lodash/entries.js');
 var keys = require('lodash/keys.js');
-var reactRouterDom = require('react-router-dom');
 var jsonSchemaViewer = require('@stoplight/json-schema-viewer');
 var sortBy = require('lodash/sortBy.js');
 var reactRouterHashLink = require('react-router-hash-link');
@@ -300,14 +300,22 @@ function parseUnknown() {
     return undefined;
 }
 
+const RouterTypeContext = React__namespace.createContext(null);
+const useRouterType = () => {
+    return React__namespace.useContext(RouterTypeContext);
+};
+
 const MarkdownViewer = (props) => {
     return React__namespace.createElement(markdownViewer.MarkdownViewer, Object.assign({}, props));
 };
 MarkdownViewer.displayName = 'MarkdownViewer';
 
 const ArticleComponent = React__namespace.memo(({ data }) => {
+    const { pathname } = reactRouterDom.useLocation();
+    const routerKind = React__namespace.useContext(RouterTypeContext);
+    const basePath = routerKind === 'hash' ? `#${pathname.split('#')[0]}` : '';
     return (React__namespace.createElement(mosaic.Box, { className: "sl-elements-article" },
-        React__namespace.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true })));
+        React__namespace.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true, tocBasePath: basePath })));
 });
 const Article = reactErrorBoundary.withErrorBoundary(ArticleComponent, { recoverableProps: ['data'] });
 
@@ -2176,11 +2184,6 @@ ${scopes.map(([key, value]) => `- \`${key}\` - ${value}`).join('\n')}`;
     return description;
 }
 
-const RouterTypeContext = React__namespace.createContext(null);
-const useRouterType = () => {
-    return React__namespace.useContext(RouterTypeContext);
-};
-
 const LinkHeading = React__namespace.memo(function LinkHeading(props) {
     const isUsingRouter = !!useRouterType();
     const Comp = isUsingRouter ? CustomLinkHeading : mosaic.LinkHeading;

package/index.mjs

@@ -10,6 +10,7 @@ import { parse } from '@stoplight/yaml';
 import { isArray as isArray$1, Box, Panel, CopyButton, Menu, Button, Text, Flex, Input, Icon, Select, FieldButton, Image, Link, useThemeIsDark, HStack, VStack, InvertTheme, Tooltip, Badge, LinkHeading as LinkHeading$1, NodeAnnotation, Tabs, TabList, Tab, TabPanels, TabPanel, Heading, useClipboard, useBreakpoints, useMosaicContext, Provider as Provider$1 } from '@stoplight/mosaic';
 import isObject from 'lodash/isObject.js';
 import { withErrorBoundary } from '@stoplight/react-error-boundary';
+import { useLocation, BrowserRouter, MemoryRouter, HashRouter, StaticRouter, Route } from 'react-router-dom';
 import { MarkdownViewer as MarkdownViewer$1, DefaultSMDComponents, MarkdownViewerProvider } from '@stoplight/markdown-viewer';
 export { DefaultSMDComponents } from '@stoplight/markdown-viewer';
 import cn from 'classnames';
@@ -38,7 +39,6 @@ import uniqBy from 'lodash/uniqBy.js';
 import formatXml from 'xml-formatter';
 import entries from 'lodash/entries.js';
 import keys from 'lodash/keys.js';
-import { useLocation, BrowserRouter, MemoryRouter, HashRouter, StaticRouter, Route } from 'react-router-dom';
 import { JsonSchemaViewer } from '@stoplight/json-schema-viewer';
 import sortBy from 'lodash/sortBy.js';
 import { HashLink } from 'react-router-hash-link';
@@ -246,14 +246,22 @@ function parseUnknown() {
     return undefined;
 }
 
+const RouterTypeContext = React.createContext(null);
+const useRouterType = () => {
+    return React.useContext(RouterTypeContext);
+};
+
 const MarkdownViewer = (props) => {
     return React.createElement(MarkdownViewer$1, Object.assign({}, props));
 };
 MarkdownViewer.displayName = 'MarkdownViewer';
 
 const ArticleComponent = React.memo(({ data }) => {
+    const { pathname } = useLocation();
+    const routerKind = React.useContext(RouterTypeContext);
+    const basePath = routerKind === 'hash' ? `#${pathname.split('#')[0]}` : '';
     return (React.createElement(Box, { className: "sl-elements-article" },
-        React.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true })));
+        React.createElement(MarkdownViewer, { className: "sl-elements-article-content", markdown: data, includeToc: true, tocBasePath: basePath })));
 });
 const Article = withErrorBoundary(ArticleComponent, { recoverableProps: ['data'] });
 
@@ -2122,11 +2130,6 @@ ${scopes.map(([key, value]) => `- \`${key}\` - ${value}`).join('\n')}`;
     return description;
 }
 
-const RouterTypeContext = React.createContext(null);
-const useRouterType = () => {
-    return React.useContext(RouterTypeContext);
-};
-
 const LinkHeading = React.memo(function LinkHeading(props) {
     const isUsingRouter = !!useRouterType();
     const Comp = isUsingRouter ? CustomLinkHeading : LinkHeading$1;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stoplight/elements-core",
-  "version": "7.7.11",
+  "version": "7.7.12",
   "main": "./index.js",
   "sideEffects": [
     "web-components.min.js",
@@ -29,7 +29,7 @@
     "@stoplight/json-schema-ref-parser": "^9.0.5",
     "@stoplight/json-schema-sampler": "0.2.3",
     "@stoplight/json-schema-viewer": "^4.9.0",
-    "@stoplight/markdown-viewer": "^5.5.0",
+    "@stoplight/markdown-viewer": "^5.6.0",
     "@stoplight/mosaic": "^1.33.0",
     "@stoplight/mosaic-code-editor": "^1.33.0",
     "@stoplight/mosaic-code-viewer": "^1.33.0",