@jpmorganchase/elemental-dev-portal 2.9.1 → 2.10.1

package/index.mjs

@@ -1,11 +1,11 @@
 import { Menu, FieldButton, Modal, Input, Box, Icon, ListBox, ListBoxItem, Flex, VStack, Heading } from '@stoplight/mosaic';
 import * as React from 'react';
 import React__default, { useRef, useEffect, useMemo, useCallback, useState } from 'react';
-import { withPersistenceBoundary, withQueryClientProvider, withMosaicProvider, MarkdownComponentsProvider, MockingProvider, Docs, withStyles, NodeTypeIconDefs, NodeTypeColors, TableOfContents as TableOfContents$1, PoweredByLink, useRouter, RouterTypeContext, findFirstNode, ReactRouterMarkdownLink, SidebarLayout } from '@jpmorganchase/elemental-core';
+import { withPersistenceBoundary, withQueryClientProvider, withMosaicProvider, MarkdownComponentsProvider, LinkHeading, MockingProvider, Docs, withStyles, NodeTypeIconDefs, NodeTypeColors, TableOfContents as TableOfContents$1, PoweredByLink, useRouter, RouterTypeContext, findFirstNode, ReactRouterMarkdownLink, SidebarLayout } from '@jpmorganchase/elemental-core';
 import { resolve, dirname } from '@stoplight/path';
 import { NodeType } from '@stoplight/types';
 import flow from 'lodash/flow.js';
-import { Route, useParams, useHistory, Redirect, Link } from 'react-router-dom';
+import { Switch, Route, useParams, useHistory, Redirect, Link } from 'react-router-dom';
 import { useQuery } from 'react-query';
 
 const BranchSelector = ({ branchSlug, branches, onChange }) => {
@@ -23,7 +23,7 @@ const BranchSelector = ({ branchSlug, branches, onChange }) => {
                 onChange: handleChange,
                 value: (currentBranch === null || currentBranch === void 0 ? void 0 : currentBranch.slug) || '',
                 children: branches.map(branch => ({
-                    label: branch.name || branch.slug,
+                    title: branch.name || branch.slug,
                     value: branch.slug,
                     meta: branch.is_default ? 'Default' : undefined,
                 })),
@@ -32,15 +32,66 @@ const BranchSelector = ({ branchSlug, branches, onChange }) => {
 };
 
 const PlatformContext = React.createContext({ platformUrl: 'https://stoplight.io' });
-const PlatformProvider = ({ platformUrl = 'https://stoplight.io', platformAuthToken, children, }) => {
-    return React.createElement(PlatformContext.Provider, { value: { platformUrl, platformAuthToken } }, children);
+const PlatformProvider = ({ platformUrl = 'https://stoplight.io', platformAuthToken, isLoggedIn, children, }) => {
+    return (React.createElement(PlatformContext.Provider, { value: { platformUrl, platformAuthToken, isLoggedIn } }, children));
 };
 const DevPortalProvider = withPersistenceBoundary(withQueryClientProvider(withMosaicProvider(PlatformProvider)));
 
-const NodeContent = ({ node, Link, hideMocking, refResolver, tryItCorsProxy, tryItCredentialsPolicy, nodeHasChanged, nodeUnsupported, compact, hideTryIt, hideTryItPanel, hideExport, onExportRequest, }) => {
+/*! *****************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
+const NodeContent = ({ node, Link, hideMocking, refResolver, maxRefDepth, tryItCorsProxy, tryItCredentialsPolicy, nodeHasChanged, nodeUnsupported, compact, hideTryIt, hideTryItPanel, hideExport, onExportRequest, }) => {
     var _a, _b, _c, _d;
     return (React.createElement(NodeLinkContext.Provider, { value: [node, Link] },
-        React.createElement(MarkdownComponentsProvider, { value: { a: LinkComponent } },
+        React.createElement(MarkdownComponentsProvider, { value: {
+                a: LinkComponent,
+                h2: (_a) => {
+                    var props = __rest(_a, ["color"]);
+                    return React.createElement(LinkHeading, Object.assign({ size: 2 }, props));
+                },
+                h3: (_a) => {
+                    var props = __rest(_a, ["color"]);
+                    return React.createElement(LinkHeading, Object.assign({ size: 3 }, props));
+                },
+                h4: (_a) => {
+                    var props = __rest(_a, ["color"]);
+                    return React.createElement(LinkHeading, Object.assign({ size: 4 }, props));
+                },
+            } },
             React.createElement(MockingProvider, { mockUrl: node.links.mock_url, hideMocking: hideMocking },
                 React.createElement(Docs, { nodeType: node.type, nodeData: node.data, nodeTitle: node.title, layoutOptions: {
                         compact,
@@ -49,7 +100,7 @@ const NodeContent = ({ node, Link, hideMocking, refResolver, tryItCorsProxy, try
                         hideExport: hideExport ||
                             ((_b = (_a = node.links.export_url) !== null && _a !== void 0 ? _a : node.links.export_original_file_url) !== null && _b !== void 0 ? _b : node.links.export_bundled_file_url) ===
                                 undefined,
-                    }, useNodeForRefResolving: true, refResolver: refResolver, tryItCorsProxy: tryItCorsProxy, exportProps: [NodeType.HttpService, NodeType.Model].includes(node.type)
+                    }, useNodeForRefResolving: true, refResolver: refResolver, maxRefDepth: maxRefDepth, tryItCorsProxy: tryItCorsProxy, exportProps: [NodeType.HttpService, NodeType.Model].includes(node.type)
                         ? {
                             original: onExportRequest
                                 ? { onPress: () => onExportRequest('original') }
@@ -164,43 +215,6 @@ const SearchResultsList = ({ searchResults, onClick, isEmbedded, showDivider = t
 const SearchResults = flow(withStyles, withPersistenceBoundary, withMosaicProvider, withQueryClientProvider)(SearchResultsList);
 const Search = flow(withStyles, withPersistenceBoundary, withMosaicProvider, withQueryClientProvider)(SearchImpl);
 
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
 const TableOfContents = (_a) => {
     var { tableOfContents, activeId, Link, collapseTableOfContents = false, externalScrollbar, isInResponsiveMode = false, onLinkClick } = _a, boxProps = __rest(_a, ["tableOfContents", "activeId", "Link", "collapseTableOfContents", "externalScrollbar", "isInResponsiveMode", "onLinkClick"]);
     return (React.createElement(Flex, Object.assign({ bg: isInResponsiveMode ? 'canvas' : 'canvas-100' }, boxProps, { flexDirection: "col", maxH: "full" }),
@@ -249,7 +263,7 @@ const UpgradeToStarter = () => (React__default.createElement(Flex, { as: "a", hr
     React__default.createElement(Icon, { icon: ['fas', 'exclamation-triangle'], size: "4x" }),
     React__default.createElement(Box, { pt: 3 }, "Please upgrade your Stoplight Workspace to the Starter Plan to use Elements Dev Portal in production.")));
 
-const appVersion = '2.9.1';
+const appVersion = '2.10.1';
 
 class ResponseError extends Error {
     constructor(message, responseCode) {
@@ -294,15 +308,15 @@ const getBranches = ({ projectId, platformUrl = 'https://stoplight.io', platform
 });
 
 function useGetBranches({ projectId }) {
-    const { platformUrl, platformAuthToken } = React.useContext(PlatformContext);
-    return useQuery([...devPortalCacheKeys.branchesList(projectId), platformUrl, platformAuthToken], () => getBranches({ projectId, platformUrl, platformAuthToken }), {
+    const { platformUrl, platformAuthToken, isLoggedIn } = React.useContext(PlatformContext);
+    return useQuery([...devPortalCacheKeys.branchesList(projectId), platformUrl, isLoggedIn], () => getBranches({ projectId, platformUrl, platformAuthToken }), {
         enabled: projectId ? true : false,
     });
 }
 
 function useGetNodeContent({ nodeSlug, projectId, branchSlug, }) {
-    const { platformUrl, platformAuthToken } = React.useContext(PlatformContext);
-    return useQuery([...devPortalCacheKeys.branchNodeDetails(projectId, branchSlug !== null && branchSlug !== void 0 ? branchSlug : '', nodeSlug), platformUrl, platformAuthToken], () => getNodeContent({ nodeSlug, projectId, branchSlug, platformUrl, platformAuthToken }), { enabled: nodeSlug && projectId ? true : false });
+    const { platformUrl, platformAuthToken, isLoggedIn } = React.useContext(PlatformContext);
+    return useQuery([...devPortalCacheKeys.branchNodeDetails(projectId, branchSlug !== null && branchSlug !== void 0 ? branchSlug : '', nodeSlug), platformUrl, isLoggedIn], () => getNodeContent({ nodeSlug, projectId, branchSlug, platformUrl, platformAuthToken }), { enabled: nodeSlug && projectId ? true : false });
 }
 
 const getTableOfContents = ({ projectId, branchSlug, platformUrl = 'https://stoplight.io', platformAuthToken, }) => __awaiter(void 0, void 0, void 0, function* () {
@@ -320,8 +334,8 @@ const getTableOfContents = ({ projectId, branchSlug, platformUrl = 'https://stop
 });
 
 function useGetTableOfContents({ projectId, branchSlug }) {
-    const { platformUrl, platformAuthToken } = React.useContext(PlatformContext);
-    return useQuery([...devPortalCacheKeys.branchTOC(projectId, branchSlug !== null && branchSlug !== void 0 ? branchSlug : ''), platformUrl, platformAuthToken], () => getTableOfContents({ projectId, branchSlug, platformUrl, platformAuthToken }), { enabled: projectId ? true : false });
+    const { platformUrl, platformAuthToken, isLoggedIn } = React.useContext(PlatformContext);
+    return useQuery([...devPortalCacheKeys.branchTOC(projectId, branchSlug !== null && branchSlug !== void 0 ? branchSlug : ''), platformUrl, isLoggedIn], () => getTableOfContents({ projectId, branchSlug, platformUrl, platformAuthToken }), { enabled: projectId ? true : false });
 }
 
 const StoplightProjectImpl = ({ projectId, hideTryIt, hideMocking, hideExport, collapseTableOfContents = false, tryItCredentialsPolicy, tryItCorsProxy, }) => {
@@ -377,7 +391,7 @@ const StoplightProjectImpl = ({ projectId, hideTryIt, hideMocking, hideExport, c
         }
     };
     return (React.createElement(SidebarLayout, { ref: container, sidebar: React.createElement(React.Fragment, null,
-            branches && branches.length > 1 ? (React.createElement(BranchSelector, { branchSlug: branchSlug, branches: branches, onChange: branch => {
+            branches && branches.items.length > 1 ? (React.createElement(BranchSelector, { branchSlug: branchSlug, branches: branches.items, onChange: branch => {
                     const encodedBranchSlug = encodeURIComponent(branch.slug);
                     history.push(branch.is_default ? `/${nodeSlug}` : `/branches/${encodedBranchSlug}/${nodeSlug}`);
                 } })) : null,
@@ -389,12 +403,13 @@ const StoplightProjectRouter = (_a) => {
     return (React.createElement(DevPortalProvider, { platformUrl: platformUrl },
         React.createElement(RouterTypeContext.Provider, { value: router },
             React.createElement(Router, Object.assign({}, routerProps, { key: basePath }),
-                React.createElement(Route, { path: "/branches/:branchSlug/:nodeSlug", exact: true },
-                    React.createElement(StoplightProjectImpl, Object.assign({}, props))),
-                React.createElement(Route, { path: "/:nodeSlug", exact: true },
-                    React.createElement(StoplightProjectImpl, Object.assign({}, props))),
-                React.createElement(Route, { path: "/", exact: true },
-                    React.createElement(StoplightProjectImpl, Object.assign({}, props)))))));
+                React.createElement(Switch, null,
+                    React.createElement(Route, { path: "/branches/:branchSlug/:nodeSlug+", exact: true },
+                        React.createElement(StoplightProjectImpl, Object.assign({}, props))),
+                    React.createElement(Route, { path: "/:nodeSlug+", exact: true },
+                        React.createElement(StoplightProjectImpl, Object.assign({}, props))),
+                    React.createElement(Route, { path: "/", exact: true },
+                        React.createElement(StoplightProjectImpl, Object.assign({}, props))))))));
 };
 const StoplightProject = withStyles(StoplightProjectRouter);
 
@@ -675,12 +690,12 @@ function useDebounce(value, delay, options) {
 }
 
 function useGetNodes({ search, workspaceId, projectIds, branch, pause, }) {
-    const { platformUrl, platformAuthToken } = React.useContext(PlatformContext);
+    const { platformUrl, platformAuthToken, isLoggedIn } = React.useContext(PlatformContext);
     const [debounceSearch] = useDebounce(search, 500);
     return useQuery([
         ...devPortalCacheKeys.searchNodes({ projectIds, branchSlug: branch, workspaceId, search: debounceSearch }),
         platformUrl,
-        platformAuthToken,
+        isLoggedIn,
     ], () => getNodes({ workspaceId, projectIds, branchSlug: branch, search: debounceSearch, platformUrl, platformAuthToken }), { enabled: !pause, keepPreviousData: true });
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jpmorganchase/elemental-dev-portal",
-  "version": "2.9.1",
+  "version": "2.10.1",
   "description": "UI components for composing beautiful developer documentation.",
   "keywords": [],
   "main": "./index.js",
@@ -27,13 +27,13 @@
     "react-dom": ">=16.8"
   },
   "dependencies": {
-    "@jpmorganchase/elemental-core": "^1.15.1",
-    "@stoplight/markdown-viewer": "^5.5.0",
-    "@stoplight/mosaic": "^ 1.53.4",
+    "@jpmorganchase/elemental-core": "^1.17.1",
+    "@stoplight/markdown-viewer": "^5.7.0",
+    "@stoplight/mosaic": "^1.53.4",
     "@stoplight/path": "^1.3.2",
     "@stoplight/types": "^14.0.0",
     "classnames": "^2.2.6",
-    "lodash": "^4.17.19",
+    "lodash": "^4.17.21",
     "react-query": "^3.34.19",
     "react-router-dom": "^5.2.0",
     "use-debounce": "^6.0.1"