diff --git a/demo/docusaurus.config.ts b/demo/docusaurus.config.ts index fdea35862..61dc408a0 100644 --- a/demo/docusaurus.config.ts +++ b/demo/docusaurus.config.ts @@ -133,7 +133,15 @@ const config: Config = { copyright: `Copyright © ${new Date().getFullYear()} Palo Alto Networks, Inc. Built with Docusaurus ${DOCUSAURUS_VERSION}.`, }, prism: { - additionalLanguages: ["ruby", "csharp", "php", "java", "powershell"], + additionalLanguages: [ + "ruby", + "csharp", + "php", + "java", + "powershell", + "json", + "bash", + ], }, languageTabs: [ { diff --git a/demo/package.json b/demo/package.json index 3df02f3b2..1b3ad0db7 100644 --- a/demo/package.json +++ b/demo/package.json @@ -27,7 +27,7 @@ "clsx": "^1.1.1", "docusaurus-plugin-openapi-docs": "^3.0.0-beta.3", "docusaurus-theme-openapi-docs": "^3.0.0-beta.3", - "prism-react-renderer": "^2.1.0", + "prism-react-renderer": "^2.3.0", "react": "^18.2.0", "react-dom": "^18.2.0" }, diff --git a/packages/docusaurus-plugin-openapi-docs/package.json b/packages/docusaurus-plugin-openapi-docs/package.json index 83d4b15fa..8bdead4be 100644 --- a/packages/docusaurus-plugin-openapi-docs/package.json +++ b/packages/docusaurus-plugin-openapi-docs/package.json @@ -49,6 +49,7 @@ "fs-extra": "^9.0.1", "json-pointer": "^0.6.2", "json-schema-merge-allof": "^0.8.1", + "json5": "^2.2.3", "lodash": "^4.17.20", "mustache": "^4.2.0", "slugify": "^1.6.5", diff --git a/packages/docusaurus-plugin-openapi-docs/src/index.ts b/packages/docusaurus-plugin-openapi-docs/src/index.ts index 390f50761..a92820ca4 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/index.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/index.ts @@ -12,6 +12,7 @@ import zlib from "zlib"; import type { LoadContext, Plugin } from "@docusaurus/types"; import { Globby, posixPath } from "@docusaurus/utils"; import chalk from "chalk"; +import JSON5 from "json5"; import { render } from "mustache"; import { createApiPageMD, createInfoPageMD, createTagPageMD } from "./markdown"; @@ -144,12 +145,15 @@ export default function pluginOpenAPIDocs( docPath ); - let sidebarSliceTemplate = `import {SidebarConfig} from "@docusaurus/plugin-content-docs/src/sidebars/types";\n\n`; - sidebarSliceTemplate += `const sidebar: SidebarConfig = {{{slice}}};\n\n`; - sidebarSliceTemplate += `export default sidebar;`; + let sidebarSliceTemplate = `import type { SidebarsConfig } from "@docusaurus/plugin-content-docs";\n\n`; + sidebarSliceTemplate += `const sidebar: SidebarsConfig = {{{slice}}};\n\n`; + sidebarSliceTemplate += `export default sidebar.apisidebar;\n`; const view = render(sidebarSliceTemplate, { - slice: JSON.stringify(sidebarSlice, null, 2), + slice: JSON5.stringify( + { apisidebar: sidebarSlice }, + { space: 2, quote: '"' } + ), }); if (!fs.existsSync(`${outputDir}/sidebar.ts`)) { @@ -427,7 +431,11 @@ import {useCurrentSidebarCategory} from '@docusaurus/theme-common'; const versionsJson = JSON.stringify(versionsArray, null, 2); try { - fs.writeFileSync(`${outputDir}/versions.json`, versionsJson, "utf8"); + fs.writeFileSync( + `${outputDir}/versions.json`, + versionsJson + "\n", + "utf8" + ); console.log( chalk.green(`Successfully created "${outputDir}/versions.json"`) ); diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createAuthentication.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createAuthentication.ts index 013764016..fe8012ad9 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createAuthentication.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createAuthentication.ts @@ -5,9 +5,9 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { OAuthFlowObject, SecuritySchemeObject } from "../openapi/types"; import { createDescription } from "./createDescription"; import { create, guard } from "./utils"; +import { OAuthFlowObject, SecuritySchemeObject } from "../openapi/types"; export function createAuthentication(securitySchemes: SecuritySchemeObject) { if (!securitySchemes || !Object.keys(securitySchemes).length) return ""; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createContactInfo.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createContactInfo.ts index db19e0223..8d292dbc9 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createContactInfo.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createContactInfo.ts @@ -5,8 +5,8 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { ContactObject } from "../openapi/types"; import { create, guard } from "./utils"; +import { ContactObject } from "../openapi/types"; export function createContactInfo(contact: ContactObject) { if (!contact || !Object.keys(contact).length) return ""; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createLicense.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createLicense.ts index c1d981dbc..86cc17780 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createLicense.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createLicense.ts @@ -5,8 +5,8 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { LicenseObject } from "../openapi/types"; import { create, guard } from "./utils"; +import { LicenseObject } from "../openapi/types"; export function createLicense(license: LicenseObject) { if (!license || !Object.keys(license).length) return ""; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createLogo.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createLogo.ts index 8e9006bb0..090255985 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createLogo.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createLogo.ts @@ -5,8 +5,8 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { LogoObject } from "../openapi/types"; import { create, guard } from "./utils"; +import { LogoObject } from "../openapi/types"; export function createLogo( logo: LogoObject | undefined, diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createParamsDetails.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createParamsDetails.ts index 9c5b1db49..f3415e286 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createParamsDetails.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createParamsDetails.ts @@ -5,10 +5,10 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { ApiItem } from "../types"; import { createDetails } from "./createDetails"; import { createDetailsSummary } from "./createDetailsSummary"; import { create } from "./utils"; +import { ApiItem } from "../types"; interface Props { parameters: ApiItem["parameters"]; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestBodyDetails.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestBodyDetails.ts index 47aa0b861..55cb8f564 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestBodyDetails.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestBodyDetails.ts @@ -5,8 +5,8 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { MediaTypeObject } from "../openapi/types"; import { createRequestSchema } from "./createRequestSchema"; +import { MediaTypeObject } from "../openapi/types"; interface Props { title: string; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestSchema.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestSchema.ts index d22dd2c3f..06d01c978 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestSchema.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createRequestSchema.ts @@ -5,12 +5,12 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { MediaTypeObject } from "../openapi/types"; import { createDescription } from "./createDescription"; import { createDetails } from "./createDetails"; import { createDetailsSummary } from "./createDetailsSummary"; import { createNodes } from "./createSchema"; import { create, guard } from "./utils"; +import { MediaTypeObject } from "../openapi/types"; interface Props { style?: any; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createResponseSchema.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createResponseSchema.ts index 7a645c289..4c9e2a73c 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createResponseSchema.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createResponseSchema.ts @@ -5,7 +5,6 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { MediaTypeObject } from "../openapi/types"; import { createDescription } from "./createDescription"; import { createDetails } from "./createDetails"; import { createDetailsSummary } from "./createDetailsSummary"; @@ -16,6 +15,7 @@ import { createResponseExamples, } from "./createStatusCodes"; import { create, guard } from "./utils"; +import { MediaTypeObject } from "../openapi/types"; interface Props { style?: any; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.test.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.test.ts index 26492297f..eba7ac882 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.test.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.test.ts @@ -7,8 +7,8 @@ import * as prettier from "prettier"; -import { SchemaObject } from "../openapi/types"; import { createNodes } from "./createSchema"; +import { SchemaObject } from "../openapi/types"; describe("createNodes", () => { it("should create readable MODs for oneOf primitive properties", async () => { diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.ts index deb374a03..5c93db087 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createSchema.ts @@ -7,7 +7,6 @@ import clsx from "clsx"; -import { SchemaObject } from "../openapi/types"; import { createClosingArrayBracket, createOpeningArrayBracket, @@ -17,6 +16,7 @@ import { createDetails } from "./createDetails"; import { createDetailsSummary } from "./createDetailsSummary"; import { getQualifierMessage, getSchemaName } from "./schema"; import { create, guard } from "./utils"; +import { SchemaObject } from "../openapi/types"; const jsonSchemaMergeAllOf = require("json-schema-merge-allof"); diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/createStatusCodes.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/createStatusCodes.ts index c7376f712..0c26d8371 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/createStatusCodes.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/createStatusCodes.ts @@ -7,14 +7,14 @@ import format from "xml-formatter"; -import { sampleResponseFromSchema } from "../openapi/createResponseExample"; -import { ApiItem } from "../types"; import { createDescription } from "./createDescription"; import { createDetails } from "./createDetails"; import { createDetailsSummary } from "./createDetailsSummary"; import { createResponseSchema } from "./createResponseSchema"; import { create } from "./utils"; import { guard } from "./utils"; +import { sampleResponseFromSchema } from "../openapi/createResponseExample"; +import { ApiItem } from "../types"; export default function json2xml(o: any, tab: any) { var toXml = function (v: any, name: string, ind: any) { diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/index.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/index.ts index dc294d416..2c2b11a17 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/index.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/index.ts @@ -5,13 +5,6 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import { - ContactObject, - LicenseObject, - MediaTypeObject, - SecuritySchemeObject, -} from "../openapi/types"; -import { ApiPageMetadata, InfoPageMetadata, TagPageMetadata } from "../types"; import { createAuthentication } from "./createAuthentication"; import { createAuthorization } from "./createAuthorization"; import { createContactInfo } from "./createContactInfo"; @@ -30,6 +23,13 @@ import { createTermsOfService } from "./createTermsOfService"; import { createVendorExtensions } from "./createVendorExtensions"; import { createVersionBadge } from "./createVersionBadge"; import { render } from "./utils"; +import { + ContactObject, + LicenseObject, + MediaTypeObject, + SecuritySchemeObject, +} from "../openapi/types"; +import { ApiPageMetadata, InfoPageMetadata, TagPageMetadata } from "../types"; interface Props { title: string; diff --git a/packages/docusaurus-plugin-openapi-docs/src/markdown/utils.ts b/packages/docusaurus-plugin-openapi-docs/src/markdown/utils.ts index 4cd8d8ebb..635734963 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/markdown/utils.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/markdown/utils.ts @@ -50,8 +50,8 @@ export const lessThan = export const greaterThan = /(?/gu; export const codeFence = /`{1,3}[\s\S]*?`{1,3}/g; -export const curlyBrackets = /\{(.*)}/g; -export const codeBlock = /^(```.*[\s\S]*?```)$/gm; +export const curlyBrackets = /([{|}])/g; +export const codeBlock = /(^```.*[\s\S]*?```$|`[^`].+?`)/gm; export function clean(value: string | undefined): string { if (!value) { @@ -60,14 +60,14 @@ export function clean(value: string | undefined): string { let sections = value.split(codeBlock); for (let sectionIndex in sections) { - if (!sections[sectionIndex].startsWith("```")) { + if (!sections[sectionIndex].startsWith("`")) { sections[sectionIndex] = sections[sectionIndex] .replace(lessThan, "<") .replace(greaterThan, ">") .replace(codeFence, function (match) { return match.replace(/\\>/g, ">"); }) - .replace(curlyBrackets, "\\{$1\\}"); + .replace(curlyBrackets, "\\$1"); } } return sections.join(""); diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/createRequestExample.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/createRequestExample.ts index 8413cb8ea..4ec427383 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/createRequestExample.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/createRequestExample.ts @@ -8,8 +8,8 @@ import chalk from "chalk"; import merge from "lodash/merge"; -import { mergeAllOf } from "../markdown/createSchema"; import { SchemaObject } from "./types"; +import { mergeAllOf } from "../markdown/createSchema"; interface OASTypeToTypeMap { string: string; diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/createResponseExample.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/createResponseExample.ts index 11a287e8b..7b0492dab 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/createResponseExample.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/createResponseExample.ts @@ -8,8 +8,8 @@ import chalk from "chalk"; import merge from "lodash/merge"; -import { mergeAllOf } from "../markdown/createSchema"; import { SchemaObject } from "./types"; +import { mergeAllOf } from "../markdown/createSchema"; interface OASTypeToTypeMap { string: string; diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/openapi.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/openapi.ts index 8dde3c8d0..b7425c561 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/openapi.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/openapi.ts @@ -18,6 +18,9 @@ import kebabCase from "lodash/kebabCase"; import unionBy from "lodash/unionBy"; import uniq from "lodash/uniq"; +import { sampleRequestFromSchema } from "./createRequestExample"; +import { OpenApiObject, TagObject } from "./types"; +import { loadAndResolveSpec } from "./utils/loadAndResolveSpec"; import { isURL } from "../index"; import { ApiMetadata, @@ -27,9 +30,6 @@ import { SidebarOptions, TagPageMetadata, } from "../types"; -import { sampleRequestFromSchema } from "./createRequestExample"; -import { OpenApiObject, TagObject } from "./types"; -import { loadAndResolveSpec } from "./utils/loadAndResolveSpec"; /** * Convenience function for converting raw JSON to a Postman Collection object. diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/loadAndResolveSpec.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/loadAndResolveSpec.ts index ee59054b2..2b75c3844 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/loadAndResolveSpec.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/loadAndResolveSpec.ts @@ -13,8 +13,8 @@ import chalk from "chalk"; // @ts-ignore import { convertObj } from "swagger2openapi"; -import { OpenApiObject } from "../types"; import { OpenAPIParser } from "./services/OpenAPIParser"; +import { OpenApiObject } from "../types"; function serializer(replacer: any, cycleReplacer: any) { var stack: any = [], diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/services/OpenAPIParser.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/services/OpenAPIParser.ts index f43a32c5b..974dff27e 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/services/OpenAPIParser.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/services/OpenAPIParser.ts @@ -7,11 +7,11 @@ // @ts-nocheck +import { RedocNormalizedOptions } from "./RedocNormalizedOptions"; import { OpenAPIRef, OpenAPISchema, OpenAPISpec, Referenced } from "../types"; import { isArray, isBoolean } from "../utils/helpers"; import { JsonPointer } from "../utils/JsonPointer"; import { getDefinitionName, isNamedDefinition } from "../utils/openapi"; -import { RedocNormalizedOptions } from "./RedocNormalizedOptions"; export type MergedOpenAPISchema = OpenAPISchema & { parentRefs?: string[] }; diff --git a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/utils/openapi.ts b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/utils/openapi.ts index 76b16ec2c..5c569169a 100644 --- a/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/utils/openapi.ts +++ b/packages/docusaurus-plugin-openapi-docs/src/openapi/utils/utils/openapi.ts @@ -9,6 +9,13 @@ import { dirname } from "path"; +import { + isNumeric, + removeQueryString, + resolveUrl, + isArray, + isBoolean, +} from "./helpers"; import { OpenAPIParser } from "../services/OpenAPIParser"; import { OpenAPIEncoding, @@ -21,13 +28,6 @@ import { OpenAPIServer, Referenced, } from "../types"; -import { - isNumeric, - removeQueryString, - resolveUrl, - isArray, - isBoolean, -} from "./helpers"; function isWildcardStatusCode( statusCode: string | number diff --git a/packages/docusaurus-theme-openapi-docs/package.json b/packages/docusaurus-theme-openapi-docs/package.json index 40efc166c..0fb309101 100644 --- a/packages/docusaurus-theme-openapi-docs/package.json +++ b/packages/docusaurus-theme-openapi-docs/package.json @@ -49,7 +49,7 @@ "file-saver": "^2.0.5", "lodash": "^4.17.20", "node-polyfill-webpack-plugin": "^2.0.1", - "prism-react-renderer": "^2.1.0", + "prism-react-renderer": "^2.3.0", "react-hook-form": "^7.43.8", "react-live": "^4.0.0", "react-magic-dropzone": "^1.0.1", diff --git a/packages/docusaurus-theme-openapi-docs/src/markdown/utils.ts b/packages/docusaurus-theme-openapi-docs/src/markdown/utils.ts index b18701e07..1a5dd5ee6 100644 --- a/packages/docusaurus-theme-openapi-docs/src/markdown/utils.ts +++ b/packages/docusaurus-theme-openapi-docs/src/markdown/utils.ts @@ -5,7 +5,9 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -export type Children = string | undefined | (string | undefined)[]; +import { ReactNode } from "react"; + +export type Children = ReactNode | string | undefined | (string | undefined)[]; export type Props = Record & { children?: Children }; @@ -35,7 +37,7 @@ export function render(children: Children): string { if (Array.isArray(children)) { return children.filter((c) => c !== undefined).join(""); } - return children ?? ""; + return (children as string) ?? ""; } export function toString(value: any): string | undefined { diff --git a/packages/docusaurus-theme-openapi-docs/src/theme-classic.d.ts b/packages/docusaurus-theme-openapi-docs/src/theme-classic.d.ts index 8bd7254d6..c8bed45cd 100644 --- a/packages/docusaurus-theme-openapi-docs/src/theme-classic.d.ts +++ b/packages/docusaurus-theme-openapi-docs/src/theme-classic.d.ts @@ -8,6 +8,73 @@ /// declare module "@docusaurus/theme-common/internal" { - function useDoc(): any; - export const { useDoc }; + import { CSSProperties, ReactNode, RefObject } from "react"; + + import type { PropDocContent } from "@docusaurus/plugin-content-docs"; + import { MagicCommentConfig } from "@docusaurus/theme-common/lib/utils/codeBlockUtils"; + import { + TabsProps as ITabsProps, + TabValue, + } from "@docusaurus/theme-common/lib/utils/tabsUtils"; + import { Props as ICodeBlockProps } from "@theme/CodeBlock"; + import { Props as ICopyButtonProps } from "@theme/CodeBlock/CopyButton"; + import { Props as ILineProps } from "@theme/CodeBlock/Line"; + import { PrismTheme } from "prism-react-renderer"; + + export interface TabProps extends ITabsProps {} + + export interface CopyButtonProps extends ICopyButtonProps {} + export interface LineProps extends ILineProps {} + export interface CodeBlockProps extends ICodeBlockProps {} + + export function useDoc(); + + export function usePrismTheme(): PrismTheme; + + export function sanitizeTabsChildren(children: TabProps["children"]); + + export function getPrismCssVariables(prismTheme: PrismTheme): CSSProperties; + + export function parseCodeBlockTitle(metastring?: string): string; + + export function parseLanguage(className: string): string | undefined; + + export function containsLineNumbers(metastring?: string): boolean; + + export function useScrollPositionBlocker(): { + blockElementScrollPositionUntilNextRender: (el: HTMLElement) => void; + }; + + export function DocProvider({ + children, + content, + }: { + children: ReactNode; + content: PropDocContent; + }); + + export function useTabs(props: TabProps): { + selectedValue: string; + selectValue: (value: string) => void; + tabValues: readonly TabValue[]; + }; + + export function parseLines( + content: string, + options: { + metastring: string | undefined; + language: string | undefined; + magicComments: MagicCommentConfig[]; + } + ): { + lineClassNames: { [lineIndex: number]: string[] }; + code: string; + }; + + export function useCodeWordWrap(): { + readonly codeBlockRef: RefObject; + readonly isEnabled: boolean; + readonly isCodeScrollable: boolean; + readonly toggle: () => void; + }; } diff --git a/packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.js b/packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.tsx similarity index 89% rename from packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.js rename to packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.tsx index cb71c3299..87b85d33c 100644 --- a/packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.js +++ b/packages/docusaurus-theme-openapi-docs/src/theme/ApiDemoPanel/ApiCodeBlock/ExpandButton/index.tsx @@ -9,14 +9,28 @@ import React, { useEffect } from "react"; import { usePrismTheme } from "@docusaurus/theme-common"; import { translate } from "@docusaurus/Translate"; -import Container from "@theme/ApiDemoPanel/ApiCodeBlock/Container"; -import CopyButton from "@theme/ApiDemoPanel/ApiCodeBlock/CopyButton"; -import ExitButton from "@theme/ApiDemoPanel/ApiCodeBlock/ExitButton"; -import Line from "@theme/ApiDemoPanel/ApiCodeBlock/Line"; +// @ts-ignore +import Container from "@theme/ApiExplorer/ApiCodeBlock/Container"; +// @ts-ignore +import CopyButton from "@theme/ApiExplorer/ApiCodeBlock/CopyButton"; +// @ts-ignore +import ExitButton from "@theme/ApiExplorer/ApiCodeBlock/ExitButton"; +// @ts-ignore +import Line from "@theme/ApiExplorer/ApiCodeBlock/Line"; import clsx from "clsx"; -import Highlight, { defaultProps } from "prism-react-renderer"; +import { Highlight, type Language } from "prism-react-renderer"; import Modal from "react-modal"; +interface Props { + code: string; + className: string; + language: Language; + showLineNumbers: boolean; + blockClassName: string; + title: string; + lineClassNames: string[]; +} + export default function ExpandButton({ code, className, @@ -25,7 +39,7 @@ export default function ExpandButton({ blockClassName, title, lineClassNames, -}) { +}: Props): React.JSX.Element { const prismTheme = usePrismTheme(); function openModal() { @@ -111,7 +125,6 @@ export default function ExpandButton({ )}
))} diff --git a/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.js b/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.tsx similarity index 80% rename from packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.js rename to packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.tsx index f9ac31ac4..68f8dffb2 100644 --- a/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.js +++ b/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/Container/index.tsx @@ -5,19 +5,22 @@ * LICENSE file in the root directory of this source tree. * ========================================================================== */ -import React from "react"; +import React, { ComponentProps } from "react"; import { ThemeClassNames, usePrismTheme } from "@docusaurus/theme-common"; import { getPrismCssVariables } from "@docusaurus/theme-common/internal"; import clsx from "clsx"; -export default function CodeBlockContainer({ as: As, ...props }) { +export default function CodeBlockContainer({ + as: As, + ...props +}: { as: T } & ComponentProps): React.JSX.Element { const prismTheme = usePrismTheme(); const prismCssVariables = getPrismCssVariables(prismTheme); return ( tags in markdown map to CodeBlocks. They may contain JSX children. When // the children is not a simple string, we just return a styled block without // actually highlighting. -export default function CodeBlockJSX({ children, className }) { +export default function CodeBlockJSX({ + children, + className, +}: Props): React.JSX.Element { return (
diff --git a/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.js b/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.tsx similarity index 91% rename from packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.js rename to packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.tsx index a85b866b2..1c57d9dbc 100644 --- a/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.js +++ b/packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.tsx @@ -7,14 +7,17 @@ import React, { useCallback, useState, useRef, useEffect } from "react"; +import { CopyButtonProps } from "@docusaurus/theme-common/internal"; import { translate } from "@docusaurus/Translate"; import clsx from "clsx"; -// @ts-expect-error: TODO, we need to make theme-classic have type: module import copy from "copy-text-to-clipboard"; -export default function CopyButton({ code, className }) { +export default function CopyButton({ + code, + className, +}: CopyButtonProps): React.JSX.Element { const [isCopied, setIsCopied] = useState(false); - const copyTimeout = useRef(undefined); + const copyTimeout = useRef(undefined); const handleCopyCode = useCallback(() => { copy(code); setIsCopied(true); @@ -22,7 +25,9 @@ export default function CopyButton({ code, className }) { setIsCopied(false); }, 1000); }, [code]); + useEffect(() => () => window.clearTimeout(copyTimeout.current), []); + return (