@redocly/theme 0.45.2-rc.0 → 0.45.2

package/lib/components/CodeBlock/CodeBlock.js

@@ -37,15 +37,7 @@ const CodeBlockControls_1 = require("../../components/CodeBlock/CodeBlockControl
 function CodeBlock({ lang, source, externalSource, header, dataTestId = 'source-code', codeBlockRef, highlightedHtml, withLineNumbers, startLineNumber, className, codeBlockMaxHeight, tabs, hideCodeColors, wrapContents = false, children, }) {
     var _a, _b, _c, _d, _e, _f;
     const [sourceCode, setSourceCode] = (0, react_1.useState)((_c = (source || ((_b = (_a = externalSource === null || externalSource === void 0 ? void 0 : externalSource.sample) === null || _a === void 0 ? void 0 : _a.get) === null || _b === void 0 ? void 0 : _b.call(_a, externalSource)))) !== null && _c !== void 0 ? _c : '');
-    const { useCodeHighlight } = (0, hooks_1.useThemeHooks)();
-    const { highlight } = useCodeHighlight() || {};
-    const highlightedCode = highlightedHtml
-        ? withLineNumbers
-            ? (0, utils_1.addLineNumbers)(highlightedHtml, startLineNumber)
-            : highlightedHtml
-        : children
-            ? null
-            : highlight === null || highlight === void 0 ? void 0 : highlight(sourceCode, lang, { withLineNumbers, startLineNumber });
+    const highlightedCode = highlightedHtml || (children ? null : (0, utils_1.highlight)(sourceCode, lang));
     // The same initial value should be returned for ssr and frontend to avoid issues
     // Because we don't have session storage in ssr and can't get the security details there
     // Issue for more details https://github.com/Redocly/reference-docs/issues/888
@@ -62,9 +54,11 @@ function CodeBlock({ lang, source, externalSource, header, dataTestId = 'source-
     return (react_1.default.createElement(CodeBlockWrapper, { "data-component-name": "CodeBlock/CodeBlock", className: className },
         react_1.default.createElement(ContainerWrapper, null,
             react_1.default.createElement(CodeBlockControls_1.CodeBlockControls, { tabs: tabs, className: header === null || header === void 0 ? void 0 : header.className, title: header === null || header === void 0 ? void 0 : header.title, controls: controls }),
-            react_1.default.createElement(CodeBlockContainer_1.CodeBlockContainer, { ref: codeBlockRef, withLineNumbers: withLineNumbers, dangerouslySetInnerHTML: highlightedCode
+            react_1.default.createElement(CodeBlockContainer_1.CodeBlockContainer, { ref: codeBlockRef, className: withLineNumbers ? 'line-numbers' : '', dangerouslySetInnerHTML: highlightedCode
                     ? {
-                        __html: highlightedCode,
+                        __html: withLineNumbers
+                            ? (0, utils_1.addLineNumbers)(highlightedCode, startLineNumber)
+                            : highlightedCode,
                     }
                     : undefined, suppressHydrationWarning // TODO: investigate issue
                 : true, "data-testid": dataTestId, hideCodeColors: hideCodeColors, maxHeight: codeBlockMaxHeight, wrapContents: wrapContents, tabIndex: 0 }, children),

package/lib/components/CodeBlock/CodeBlockContainer.d.ts

@@ -4,7 +4,7 @@ export type CodeBlockContainerProps = PropsWithChildren<{
     maxHeight?: string;
     wrapContents?: boolean;
     ref?: (instance: HTMLPreElement | null) => void;
-    withLineNumbers?: boolean;
+    className?: string;
     dangerouslySetInnerHTML?: {
         __html: string;
     };

package/lib/components/CodeBlock/CodeBlockContainer.js

@@ -127,243 +127,29 @@ const CodeBlockContainerComponent = styled_components_1.default.pre `
     cursor: help;
   }
 
-  .line-number {
-    display: inline-block;
-    min-width: 2.5em;
-    padding-right: 0.8em;
-    text-align: right;
-    pointer-events: none;
-    user-select: none;
+  .code-line {
+    &:before {
+      content: attr(data-line-number);
+      display: inline-block;
+      min-width: 2em;
+      padding-right: 0.8em;
+      text-align: right;
+      pointer-events: none;
+      user-select: none;
+    }
   }
 
   .highlighted {
     background: var(--tag-basic-bg-color);
   }
 
-  /*
-  * Shiki styles
-   */
-
-  .line {
-    display: block;
-  }
-
-  .has-diff {
-    > .line {
-      &:before {
-        content: ' ';
-        display: inline-block;
-        min-width: 1em;
-        padding-right: 0.4em;
-        text-align: right;
-        pointer-events: none;
-        user-select: none;
-      }
-    }
-  }
-
-  .diff {
-    &.add {
-      background: var(--color-grass-2);
-      &:before {
-        content: '+';
-      }
-    }
-    &.remove {
-      background: var(--color-red-2);
-
-      &:before {
-        content: '-';
-      }
-    }
-  }
-
-  .highlighted-word {
-    background: var(--color-carrot-2);
-    border: 1px solid var(--color-carrot-5);
-    border-radius: 4px;
-  }
-
-  .has-focused {
-    .line {
-      opacity: 0.7;
-      filter: blur(0.095rem);
-      transition:
-        filter 0.35s,
-        opacity 0.35s;
-      &.focused {
-        opacity: 1;
-        filter: blur(0);
-      }
-    }
-
-    &:hover {
-      .line {
-        opacity: 1;
-        filter: blur(0);
-      }
-    }
-  }
-
-  /*
-  * Tree view styles
-   */
-
-  .tree-view-line {
-    display: flex;
-  }
-
-  .tree-view-branch {
-    color: var(--code-block-tree-view-lines-color);
-  }
-
-  .tree-view-file {
-    display: inline-flex;
-    &::before {
-      content: '\\ea01';
-      margin-right: 0.5rem;
-      font-family: 'TreeViewIcons';
-    }
-
-    &.no-file {
-      &::before {
-        content: '';
-        margin-right: 0;
-      }
-    }
-
-    &.ext-folder {
-      &::before {
-        content: '\\ea02';
-      }
-    }
-
-    &.ext-img,
-    &.ext-png,
-    &.ext-jpg,
-    &.ext-jpeg,
-    &.ext-gif,
-    &.ext-svg {
-      &::before {
-        content: '\\ea03';
-      }
-    }
-
-    &.ext-mp2,
-    &.ext-mp3,
-    &.ext-wav,
-    &.ext-ogg,
-    &.ext-flac {
-      &::before {
-        content: '\\ea04';
-        margin-right: 0.5rem;
-      }
-    }
-
-    &.ext-mp4,
-    &.ext-mkv,
-    &.ext-avi,
-    &.ext-mov,
-    &.ext-wmv,
-    &.ext-flv {
-      &::before {
-        content: '\\ea05';
-        margin-right: 0.5rem;
-      }
-    }
-
-    &.ext-txt,
-    &.ext-text,
-    &.ext-md,
-    &.ext-markdown {
-      &::before {
-        content: '\\ea06';
-        margin-right: 0.5rem;
-      }
-    }
-
-    &.ext-js,
-    &.ext-ts,
-    &.ext-jsx,
-    &.ext-tsx,
-    &.ext-json,
-    &.ext-yaml,
-    &.ext-yml,
-    &.ext-xml,
-    &.ext-html,
-    &.ext-css,
-    &.ext-scss,
-    &.ext-less,
-    &.ext-sass,
-    &.ext-java,
-    &.ext-c,
-    &.ext-cpp,
-    &.ext-cs,
-    &.ext-php,
-    &.ext-py,
-    &.ext-rb,
-    &.ext-go,
-    &.ext-swift,
-    &.ext-sql,
-    &.ext-perl,
-    &.ext-lua,
-    &.ext-scala,
-    &.ext-sh {
-      &::before {
-        content: '\\ea07';
-        margin-right: 0.5rem;
-      }
-    }
-
-    &.ext-zip,
-    &.ext-rar,
-    &.ext-tar,
-    &.ext-gz,
-    &.ext-iso {
-      &::before {
-        content: '\\ea08';
-      }
-    }
-
-    &.ext-pdf,
-    &.ext-PDF {
-      &::before {
-        content: '\\ea09';
-      }
-    }
-
-    &.ext-excel,
-    &.ext-xls,
-    &.ext-xlsx {
-      &::before {
-        content: '\\ea0a';
-      }
-    }
-
-    &.ext-powerpoint,
-    &.ext-ppt,
-    &.ext-pptx {
-      &::before {
-        content: '\\ea0b';
-      }
-    }
-
-    &.ext-doc,
-    &.ext-docx,
-    &.ext-rtf {
-      &::before {
-        content: '\\ea0c';
-      }
-    }
-  }
-
   ${(0, utils_1.generateCodeBlockTokens)()}
 
   ${({ hideCodeColors }) => hideCodeColors &&
     (0, styled_components_1.css) `
-      .line-number:not(.highlighted),
-      .line-number:not(.highlighted) > span,
-      .line-number:not(.highlighted) > span > span {
+      .code-line:not(.highlighted),
+      .code-line:not(.highlighted) > span,
+      .code-line:not(.highlighted) > span > span {
         color: grey;
       }
     `}

package/lib/components/CodeBlock/variables.js

@@ -3,30 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.code = void 0;
 const styled_components_1 = require("styled-components");
 exports.code = (0, styled_components_1.css) `
-  /**
-    * Tree view icons font
-    */
-  @font-face {
-    font-family: 'TreeViewIcons';
-    /**
-    * Use the following escape sequences to refer to a specific icon:
-    *
-    * - \\ea01 file
-    * - \\ea02 folder
-    * - \\ea03 image
-    * - \\ea04 audio
-    * - \\ea05 video
-    * - \\ea06 text
-    * - \\ea07 code
-    * - \\ea08 archive
-    * - \\ea09 pdf
-    * - \\ea0a excel
-    * - \\ea0b powerpoint
-    * - \\ea0c word
-    */
-    src: url('data:application/font-woff;base64,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') format('woff');
-  }
-  
   /**
     * @tokens Code base styles
     */
@@ -114,12 +90,6 @@ exports.code = (0, styled_components_1.css) `
   --code-block-tokens-class-name-color: var(--color-carrot-7); // @presenter Color
   --code-block-tokens-function-color: var(--color-carrot-7); // @presenter Color
 
-  /**
-    * @tokens Code Block tree view
-   */
-  --code-block-tree-view-icon-font-family: 'TreeViewIcons'; // @presenter FontFamily
-  --code-block-tree-view-lines-color: var(--border-color-primary); // @presenter Color
-
   // @tokens End
 `;
 //# sourceMappingURL=variables.js.map

package/lib/components/Filter/FilterContent.js

@@ -10,6 +10,7 @@ const FilterInput_1 = require("../../components/Filter/FilterInput");
 const hooks_1 = require("../../core/hooks");
 const Button_1 = require("../../components/Button/Button");
 const Filter_1 = require("../../components/Filter/Filter");
+const utils_1 = require("../../core/utils");
 function FilterContent({ setFilterTerm, filters, filterTerm, filterValuesCasing, }) {
     const { useTranslate } = (0, hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
@@ -19,7 +20,9 @@ function FilterContent({ setFilterTerm, filters, filterTerm, filterValuesCasing,
         if (filter.selectedOptions && filter.selectedOptions instanceof Set) {
             return filter.selectedOptions.size;
         }
-        else if (filter.selectedOptions.from && filter.selectedOptions.to) {
+        else if ((0, utils_1.isFromToSelectedOptions)(filter.selectedOptions) &&
+            filter.selectedOptions.from &&
+            filter.selectedOptions.to) {
             return true;
         }
     });

package/lib/components/Footer/FooterColumn.js

@@ -17,7 +17,7 @@ function FooterColumn({ column, className }) {
     const iconsOnly = items.every((item) => item.label === item.link && (item.icon || item.srcSet));
     const label = translate(column.labelTranslationKey, column.label);
     return (react_1.default.createElement(FooterColumnWrapper, { "data-component-name": "Footer/FooterColumn", className: className },
-        react_1.default.createElement(FooterColumnTitle, null, column.link ? (react_1.default.createElement(Link_1.Link, { to: column.link, external: column.external, target: column.target }, label)) : (label)),
+        react_1.default.createElement(FooterColumnTitle, null, (0, utils_1.isNavLinkItem)(column) ? (react_1.default.createElement(Link_1.Link, { to: column.link, external: column.external, target: column.target }, label)) : (label)),
         react_1.default.createElement(FooterColumnItems, { iconsOnly: iconsOnly }, items === null || items === void 0 ? void 0 : items.map((columnItem, columnItemIndex) => (react_1.default.createElement(FooterItem_1.FooterItem, { item: columnItem, iconsOnly: iconsOnly, key: columnItemIndex }))))));
 }
 const FooterColumnWrapper = styled_components_1.default.div `

package/lib/components/Markdown/variables.js

@@ -7,7 +7,7 @@ exports.markdown = (0, styled_components_1.css) `
   * @tokens Markdown Content
   */
 
-  --md-content-max-width: 910px;
+  --md-content-max-width: 688px;
   --md-content-padding: 25px 0px 25px 0px; // @presenter Spacing
   --md-content-font-size: var(--font-size-base); // @presenter FontSize
   --md-content-font-family: var(--font-family-base); // @presenter FontFamily

package/lib/components/Search/SearchFilterField.js

@@ -8,12 +8,12 @@ const react_1 = __importDefault(require("react"));
 const styled_components_1 = __importDefault(require("styled-components"));
 const Button_1 = require("../../components/Button/Button");
 const ResetIcon_1 = require("../../icons/ResetIcon/ResetIcon");
-const core_1 = require("../../core");
+const hooks_1 = require("../../core/hooks");
 const SearchFilterFieldSelect_1 = require("../../components/Search/FilterFields/SearchFilterFieldSelect");
 const SearchFilterFieldTags_1 = require("../../components/Search/FilterFields/SearchFilterFieldTags");
 function SearchFilterField({ className, facet, filter, query, onFilterChange, onFacetReset, }) {
     var _a;
-    const { useTranslate } = (0, core_1.useThemeHooks)();
+    const { useTranslate } = (0, hooks_1.useThemeHooks)();
     const { translate } = useTranslate();
     const selectedValues = ((_a = filter.find((item) => item.field === facet.field)) === null || _a === void 0 ? void 0 : _a.values) || [];
     const onChange = (value) => {

package/lib/components/UserMenu/LogoutMenuItem.js

@@ -7,7 +7,7 @@ exports.LogoutMenuItem = LogoutMenuItem;
 const react_1 = __importDefault(require("react"));
 const hooks_1 = require("../../core/hooks");
 const LogoutIcon_1 = require("../../icons/LogoutIcon/LogoutIcon");
-const DropdownMenuItem_1 = require("../Dropdown/DropdownMenuItem");
+const DropdownMenuItem_1 = require("../../components/Dropdown/DropdownMenuItem");
 function LogoutMenuItem({ iconOnly, className }) {
     const { useTranslate, useTelemetry, useUserMenu } = (0, hooks_1.useThemeHooks)();
     const { handleLogout } = useUserMenu();

package/lib/components/UserMenu/UserMenu.js

@@ -15,7 +15,7 @@ const UserAvatar_1 = require("../../components/UserMenu/UserAvatar");
 const UserInfoMenuItem_1 = require("../../components/UserMenu/UserInfoMenuItem");
 const Dropdown_1 = require("../../components/Dropdown/Dropdown");
 const LogoutMenuItem_1 = require("../../components/UserMenu/LogoutMenuItem");
-const core_1 = require("../../core");
+const utils_1 = require("../../core/utils");
 function UserMenu({ className }) {
     const { userMenu } = (0, hooks_1.useThemeConfig)();
     const { useTranslate, useUserMenu } = (0, hooks_1.useThemeHooks)();
@@ -52,7 +52,7 @@ function UserMenu({ className }) {
 const UserMenuWrapper = styled_components_1.default.div `
   display: none;
 
-  @media screen and (min-width: ${core_1.breakpoints.medium}) {
+  @media screen and (min-width: ${utils_1.breakpoints.medium}) {
     display: block;
   }
 `;

package/lib/core/types/hooks.d.ts

@@ -95,12 +95,6 @@ export type ThemeHooks = {
     };
     useUserTeams: () => string[];
     usePageProps: <T extends Record<string, unknown>>() => PageProps & T;
-    useCodeHighlight: () => {
-        highlight: (code: string, language: string | undefined, { withLineNumbers, startLineNumber }: {
-            withLineNumbers?: boolean;
-            startLineNumber?: number;
-        }) => string;
-    };
 };
 export type L10nConfig = {
     currentLocale: string;

package/lib/core/utils/highlight.d.ts

@@ -0,0 +1,35 @@
+import 'prismjs/components/prism-bash.js';
+import 'prismjs/components/prism-c.js';
+import 'prismjs/components/prism-clike.js';
+import 'prismjs/components/prism-coffeescript.js';
+import 'prismjs/components/prism-cpp.js';
+import 'prismjs/components/prism-csharp.js';
+import 'prismjs/components/prism-go.js';
+import 'prismjs/components/prism-http.js';
+import 'prismjs/components/prism-java.js';
+import 'prismjs/components/prism-lua.js';
+import 'prismjs/components/prism-markdown.js';
+import 'prismjs/components/prism-markup-templating.js';
+import 'prismjs/components/prism-markup.js';
+import 'prismjs/components/prism-objectivec.js';
+import 'prismjs/components/prism-perl.js';
+import 'prismjs/components/prism-php.js';
+import 'prismjs/components/prism-python.js';
+import 'prismjs/components/prism-ruby.js';
+import 'prismjs/components/prism-scala.js';
+import 'prismjs/components/prism-sql.js';
+import 'prismjs/components/prism-swift.js';
+import 'prismjs/components/prism-graphql.js';
+import 'prismjs/plugins/treeview/prism-treeview.js';
+/**
+ * map language names to Prism.js names
+ */
+export declare function mapLang(lang: string): string;
+/**
+ * Highlight source code string using Prism.js
+ * @param source source code to highlight
+ * @param lang highlight language
+ * @return highlighted source code as **html string**
+ */
+export declare function highlight(source: string | number | boolean, lang?: string): string;
+export declare function addLineNumbers(highlightedCode: string, start?: number): string;

package/lib/core/utils/highlight.js

@@ -0,0 +1,129 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mapLang = mapLang;
+exports.highlight = highlight;
+exports.addLineNumbers = addLineNumbers;
+const Prism = __importStar(require("prismjs"));
+require("prismjs/components/prism-bash.js");
+require("prismjs/components/prism-c.js");
+require("prismjs/components/prism-clike.js");
+require("prismjs/components/prism-coffeescript.js");
+require("prismjs/components/prism-cpp.js");
+require("prismjs/components/prism-csharp.js");
+require("prismjs/components/prism-go.js");
+require("prismjs/components/prism-http.js");
+require("prismjs/components/prism-java.js");
+require("prismjs/components/prism-lua.js");
+require("prismjs/components/prism-markdown.js");
+require("prismjs/components/prism-markup-templating.js"); // dep of php
+require("prismjs/components/prism-markup.js"); // xml
+require("prismjs/components/prism-objectivec.js");
+require("prismjs/components/prism-perl.js");
+require("prismjs/components/prism-php.js");
+require("prismjs/components/prism-python.js");
+require("prismjs/components/prism-ruby.js");
+require("prismjs/components/prism-scala.js");
+require("prismjs/components/prism-sql.js");
+require("prismjs/components/prism-swift.js");
+require("prismjs/components/prism-graphql.js");
+require("prismjs/plugins/treeview/prism-treeview.js");
+const DEFAULT_LANG = 'clike';
+const NEW_LINE_EXP = /\n(?!$)/g;
+Prism.languages.insertBefore('javascript', 'string', {
+    'property string': {
+        pattern: /([{,]\s*)"(?:\\.|[^\\"\r\n])*"(?=\s*:)/i,
+        lookbehind: true,
+    },
+}, undefined);
+Prism.languages.insertBefore('javascript', 'punctuation', {
+    property: {
+        pattern: /([{,]\s*)[a-z]\w*(?=\s*:)/i,
+        lookbehind: true,
+    },
+}, undefined);
+Prism.languages.markdoc = Object.assign(Object.assign({}, Prism.languages.markdown), { tag: {
+        pattern: /{%(.|\n)*?%}/i,
+        inside: {
+            keyword: {
+                pattern: /^({%\s*\/?)(\w*|-)*\b/i,
+                lookbehind: true,
+            },
+            id: /#(\w|-)*\b/,
+            string: /".*?"/,
+            equals: /=/,
+            number: /\b\d+\b/i,
+            variable: {
+                pattern: /\$[\w.]+/i,
+                inside: {
+                    punctuation: /\./i,
+                },
+            },
+            function: /\b\w+(?=\()/,
+            punctuation: /({%|\/?%})/i,
+            boolean: /false|true/,
+        },
+    }, variable: {
+        pattern: /\$\w+/i,
+    }, function: {
+        pattern: /\b\w+(?=\()/i,
+    } });
+/**
+ * map language names to Prism.js names
+ */
+function mapLang(lang) {
+    return ({
+        json: 'js',
+        'c++': 'cpp',
+        'c#': 'csharp',
+        'c#+newtonsoft': 'csharp',
+        'java8+apache': 'java',
+        'objective-c': 'objectivec',
+        shell: 'bash',
+        viml: 'vim',
+        curl: 'bash',
+        'node.js': 'js',
+    }[lang] || DEFAULT_LANG);
+}
+/**
+ * Highlight source code string using Prism.js
+ * @param source source code to highlight
+ * @param lang highlight language
+ * @return highlighted source code as **html string**
+ */
+function highlight(source, lang = DEFAULT_LANG) {
+    lang = lang.toLowerCase();
+    const grammar = Prism.languages[lang] || Prism.languages[mapLang(lang)];
+    return Prism.highlight(source.toString(), grammar, lang);
+}
+function addLineNumbers(highlightedCode, start = 1) {
+    const codeLines = highlightedCode.split(NEW_LINE_EXP);
+    return codeLines
+        .map((line, i) => {
+        return `<span class="code-line" data-line-number=${start + i}>${line}</span>`;
+    })
+        .join('\n');
+}
+//# sourceMappingURL=highlight.js.map

package/lib/core/utils/index.d.ts

@@ -1,6 +1,6 @@
 export * from '../../core/utils/clipboard-service';
 export * from '../../core/utils/css-variables';
-export * from '../../core/utils/add-line-numbers';
+export * from '../../core/utils/highlight';
 export * from '../../core/utils/media-css';
 export * from '../../core/utils/theme-helpers';
 export * from '../../core/utils/class-names';

package/lib/core/utils/index.js

@@ -16,7 +16,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("../../core/utils/clipboard-service"), exports);
 __exportStar(require("../../core/utils/css-variables"), exports);
-__exportStar(require("../../core/utils/add-line-numbers"), exports);
+__exportStar(require("../../core/utils/highlight"), exports);
 __exportStar(require("../../core/utils/media-css"), exports);
 __exportStar(require("../../core/utils/theme-helpers"), exports);
 __exportStar(require("../../core/utils/class-names"), exports);

package/lib/core/utils/type-guards.d.ts

@@ -1,5 +1,11 @@
+import { ResolvedNavItem, ResolvedNavLinkItem } from '@redocly/config';
 export declare function isUndefined<T>(value: T | undefined): value is undefined;
 export declare function isNull<T>(value: T | null): value is null;
 export declare function isString<T>(value: T | string): value is string;
 export declare function isNotNull<T>(value: T): value is NonNullable<T>;
 export declare const isObject: (item: unknown) => item is object;
+export declare const isNavLinkItem: (item: ResolvedNavItem) => item is ResolvedNavLinkItem;
+export declare const isFromToSelectedOptions: (options: unknown) => options is {
+    from: string;
+    to: string;
+};

package/lib/core/utils/type-guards.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isObject = void 0;
+exports.isFromToSelectedOptions = exports.isNavLinkItem = exports.isObject = void 0;
 exports.isUndefined = isUndefined;
 exports.isNull = isNull;
 exports.isString = isString;
@@ -21,4 +21,12 @@ const isObject = (item) => {
     return isNotNull(item) && typeof item === 'object';
 };
 exports.isObject = isObject;
+const isNavLinkItem = (item) => {
+    return item.link !== undefined;
+};
+exports.isNavLinkItem = isNavLinkItem;
+const isFromToSelectedOptions = (options) => {
+    return (0, exports.isObject)(options) && 'from' in options && 'to' in options;
+};
+exports.isFromToSelectedOptions = isFromToSelectedOptions;
 //# sourceMappingURL=type-guards.js.map