From 9a15e3a88ad97063e2d50965439fcf1827e4b4c2 Mon Sep 17 00:00:00 2001 From: aeei <18022843+aeei@users.noreply.github.com> Date: Mon, 10 Aug 2026 00:59:55 +0900 Subject: [PATCH] feat(theme): restore Base Nova OpenAPI surfaces --- README.md | 14 +- UPSTREAM.md | 2 +- demo/customMdGenerators.ts | 2 +- demo/docs/intro.mdx | 2 + demo/docusaurus.config.ts | 25 +- demo/package.json | 4 +- demo/src/components/PalettePicker/index.tsx | 258 +++------ .../PalettePicker/styles.module.css | 203 ------- demo/src/css/custom.css | 544 +++++++----------- demo/templates/api.mustache | 14 +- .../src/markdown/createAuthentication.test.ts | 24 + .../src/markdown/createAuthentication.ts | 13 +- .../src/markdown/index.ts | 7 +- .../package.json | 4 +- .../src/theme/ApiExplorer/Accept/index.tsx | 2 +- .../ApiCodeBlock/Container/_Container.scss | 5 +- .../ApiCodeBlock/Content/String.tsx | 4 +- .../ApiCodeBlock/Content/_Content.scss | 82 +-- .../ApiCodeBlock/CopyButton/_CopyButton.scss | 2 +- .../ApiCodeBlock/CopyButton/index.tsx | 35 +- .../ApiCodeBlock/ExitButton/_ExitButton.scss | 16 - .../ApiCodeBlock/ExitButton/index.tsx | 55 -- .../ExpandButton/_ExpandButton.scss | 72 +-- .../ApiCodeBlock/ExpandButton/index.tsx | 176 +++--- .../ApiExplorer/ApiCodeBlock/Line/_Line.scss | 30 +- .../ApiCodeBlock/WordWrapButton/index.tsx | 29 +- .../theme/ApiExplorer/Authorization/index.tsx | 4 +- .../ApiExplorer/Body/FormBodyItem/index.tsx | 6 +- .../src/theme/ApiExplorer/Body/index.tsx | 2 +- .../theme/ApiExplorer/CodeTabs/_CodeTabs.scss | 297 ++-------- .../src/theme/ApiExplorer/CodeTabs/index.tsx | 247 ++++---- .../theme/ApiExplorer/ContentType/index.tsx | 4 +- .../src/theme/ApiExplorer/Export/index.tsx | 66 +-- .../FloatingButton/_FloatingButton.scss | 2 +- .../ApiExplorer/FloatingButton/index.tsx | 8 +- .../FormFileUpload/_FormFileUpload.scss | 24 +- .../ApiExplorer/FormFileUpload/index.tsx | 15 +- .../theme/ApiExplorer/FormItem/_FormItem.scss | 6 +- .../src/theme/ApiExplorer/FormLabel/index.tsx | 8 +- .../FormMultiSelect/_FormMultiSelect.scss | 10 +- .../ApiExplorer/FormSelect/_FormSelect.scss | 43 -- .../theme/ApiExplorer/FormSelect/index.tsx | 55 +- .../FormTextInput/_FormTextInput.scss | 36 +- .../theme/ApiExplorer/FormTextInput/index.tsx | 11 +- .../ApiExplorer/LiveEditor/_LiveEditor.scss | 4 +- .../MethodEndpoint/_MethodEndpoint.scss | 25 +- .../ApiExplorer/MethodEndpoint/index.tsx | 106 ++-- .../ParamFormItems/ParamArrayFormItem.tsx | 18 +- .../ParamFormItems/ParamBooleanFormItem.tsx | 3 +- .../ParamFormItems/ParamSelectFormItem.tsx | 3 +- .../ParamOptions/_ParamOptions.scss | 22 +- .../theme/ApiExplorer/ParamOptions/index.tsx | 20 +- .../theme/ApiExplorer/Request/_Request.scss | 140 ----- .../src/theme/ApiExplorer/Request/index.tsx | 326 +++++------ .../theme/ApiExplorer/Response/_Response.scss | 131 +---- .../src/theme/ApiExplorer/Response/index.tsx | 79 ++- .../ApiExplorer/SecuritySchemes/index.tsx | 12 +- .../src/theme/ApiExplorer/Server/_Server.scss | 6 +- .../src/theme/ApiExplorer/Server/index.tsx | 8 +- .../src/theme/ApiItem/Layout/index.tsx | 91 ++- .../theme/ApiItem/Layout/styles.module.css | 17 - .../src/theme/ApiItem/index.tsx | 6 +- .../theme/{TabItem => ApiTabItem}/index.tsx | 0 .../{TabItem => ApiTabItem}/styles.module.css | 0 .../src/theme/ApiTabs/_ApiTabs.scss | 30 +- .../src/theme/ApiTabs/index.tsx | 217 ++----- .../DiscriminatorTabs/_DiscriminatorTabs.scss | 2 +- .../src/theme/DiscriminatorTabs/index.tsx | 218 +------ .../src/theme/Example/index.tsx | 5 +- .../src/theme/Markdown/Details/_Details.scss | 55 +- .../src/theme/Markdown/index.js | 22 +- .../src/theme/MimeTabs/index.tsx | 242 ++------ .../src/theme/OpenApiTable/index.tsx | 7 + .../src/theme/OperationTabs/index.tsx | 207 +------ .../src/theme/ParamsDetails/index.tsx | 2 +- .../src/theme/ParamsItem/_ParamsItem.scss | 6 +- .../src/theme/ParamsItem/index.tsx | 16 +- .../src/theme/RequestSchema/index.tsx | 17 +- .../src/theme/ResponseExamples/index.tsx | 2 +- .../src/theme/ResponseSchema/index.tsx | 11 +- .../src/theme/Schema/index.tsx | 94 ++- .../src/theme/Schema/normalize.test.ts | 9 + .../src/theme/Schema/normalize.ts | 60 +- .../SchemaExpansion/_SchemaExpansion.scss | 10 +- .../src/theme/SchemaExpansion/index.tsx | 248 ++------ .../src/theme/SchemaItem/_SchemaItem.scss | 10 +- .../src/theme/SchemaItem/index.tsx | 22 +- .../src/theme/SchemaTabs/index.tsx | 258 ++------- .../src/theme/StatusCodes/index.tsx | 4 +- .../base-nova-integration-contract.test.ts | 113 ++++ .../src/theme/components/method-badge.tsx | 36 ++ .../src/theme/components/openapi-tab-list.tsx | 92 +++ .../theme/components/schema-status-badge.tsx | 24 + .../theme/components/tab-scroll-button.tsx | 27 + .../src/theme/components/value-badge.tsx | 11 + .../src/theme/styles.scss | 165 ++---- packages/docusaurus-theme/README.md | 11 + packages/docusaurus-theme/package.json | 2 +- .../src/container-width.test.ts | 43 ++ packages/docusaurus-theme/src/index.ts | 40 +- .../src/package-contract.test.ts | 2 +- .../src/plugin-content-docs.d.ts | 2 + .../src/search/build-index.test.ts | 27 +- .../src/search/build-index.ts | 28 +- packages/docusaurus-theme/src/search/types.ts | 3 + .../src/theme/AnnouncementBar/index.tsx | 45 ++ .../src/theme/Details/index.tsx | 22 +- .../DocCategoryGeneratedIndexPage/index.tsx | 59 ++ .../src/theme/DocRoot/Layout/index.tsx | 2 +- .../theme/DocSidebarItem/Category/index.tsx | 1 + .../src/theme/DocSidebarItem/Link/index.tsx | 6 +- packages/docusaurus-theme/src/theme/base.scss | 64 ++- .../docusaurus-theme/src/theme/base.test.ts | 40 +- .../src/theme/components/ui/select.tsx | 202 +++++++ .../src/theme/navbar-shell-contract.test.ts | 4 +- .../theme/registry-source-contract.test.ts | 2 + .../src/theme/sidebar-contract.test.ts | 8 +- playwright.config.ts | 1 + playwright.openapi.config.ts | 26 + tests/openapi-theme.spec.ts | 260 +++++++++ yarn.lock | 34 -- 121 files changed, 2759 insertions(+), 3902 deletions(-) delete mode 100644 demo/src/components/PalettePicker/styles.module.css create mode 100644 packages/docusaurus-plugin-openapi-docs/src/markdown/createAuthentication.test.ts delete mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/ExitButton/_ExitButton.scss delete mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ApiCodeBlock/ExitButton/index.tsx delete mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/FormSelect/_FormSelect.scss delete mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Request/_Request.scss delete mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/ApiItem/Layout/styles.module.css rename packages/docusaurus-theme-openapi-docs/src/theme/{TabItem => ApiTabItem}/index.tsx (100%) rename packages/docusaurus-theme-openapi-docs/src/theme/{TabItem => ApiTabItem}/styles.module.css (100%) create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/OpenApiTable/index.tsx create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/base-nova-integration-contract.test.ts create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/components/method-badge.tsx create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/components/openapi-tab-list.tsx create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/components/schema-status-badge.tsx create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/components/tab-scroll-button.tsx create mode 100644 packages/docusaurus-theme-openapi-docs/src/theme/components/value-badge.tsx create mode 100644 packages/docusaurus-theme/src/container-width.test.ts create mode 100644 packages/docusaurus-theme/src/theme/AnnouncementBar/index.tsx create mode 100644 packages/docusaurus-theme/src/theme/DocCategoryGeneratedIndexPage/index.tsx create mode 100644 packages/docusaurus-theme/src/theme/components/ui/select.tsx create mode 100644 playwright.openapi.config.ts create mode 100644 tests/openapi-theme.spec.ts diff --git a/README.md b/README.md index 8d9329e3d..76f4bf023 100644 --- a/README.md +++ b/README.md @@ -61,6 +61,18 @@ export default config; The package ships Base Nova tokens, fonts, preflight, animations, and compiled theme CSS. Consumer Tailwind/Sass config is neither required nor read. +## Container width + +The navbar, docs content, footer, OpenAPI layout, and large dialogs share a `90rem` maximum width by default. Set one theme option to use a narrower or wider constant: + +```ts +themes: [ + ["@aeei/docusaurus-theme", { containerMaxWidth: "80rem" }], +], +``` + +Positive `px`/`rem` strings are accepted. Numbers are interpreted as pixels. + ## Search Search is disabled by default. @@ -172,7 +184,7 @@ Requirements: Consumers then install a pinned release: ```bash -npm install @aeei/docusaurus-theme@0.1.10 +npm install @aeei/docusaurus-theme@0.1.11 ``` This repository does not publish automatically from an unapproved working tree. diff --git a/UPSTREAM.md b/UPSTREAM.md index 5a2051d51..add3864cf 100644 --- a/UPSTREAM.md +++ b/UPSTREAM.md @@ -37,4 +37,4 @@ This repository is a maintained fork of [`PaloAltoNetworks/docusaurus-openapi-do - Last integrated upstream release: `v5.1.3` - Upstream baseline commit: `d5af4f22e951712e084df8b7c513a1708e56d372` -- Current AEEI theme release: `0.1.10` +- Current AEEI theme release: `0.1.11` diff --git a/demo/customMdGenerators.ts b/demo/customMdGenerators.ts index 004988eb3..74fc30d9e 100644 --- a/demo/customMdGenerators.ts +++ b/demo/customMdGenerators.ts @@ -48,7 +48,7 @@ export function myCustomApiMdGenerator({ `import RequestSchema from "@theme/RequestSchema";\n`, `import StatusCodes from "@theme/StatusCodes";\n`, `import OperationTabs from "@theme/OperationTabs";\n`, - `import TabItem from "@theme/TabItem";\n`, + `import TabItem from "@theme/ApiTabItem";\n`, `import Heading from "@theme/Heading";\n`, `import Translate from "@docusaurus/Translate";\n\n`, createHeading(title), diff --git a/demo/docs/intro.mdx b/demo/docs/intro.mdx index 6dee428cf..96793eaf9 100644 --- a/demo/docs/intro.mdx +++ b/demo/docs/intro.mdx @@ -239,6 +239,8 @@ The `docusaurus-plugin-openapi-docs` plugin can be configured with the following > You may optionally configure a `sidebarOptions`. In doing so, an individual `sidebar.js` slice with the configured options will be generated within the respective `outputDir`. +### versions + `versions` can be configured with the following options: | Name | Type | Default | Description | diff --git a/demo/docusaurus.config.ts b/demo/docusaurus.config.ts index 15baf699a..f920991cf 100644 --- a/demo/docusaurus.config.ts +++ b/demo/docusaurus.config.ts @@ -63,6 +63,7 @@ const config: Config = { respectPrefersColorScheme: true, }, navbar: { + title: "OpenAPI Docs", logo: { alt: "OpenAPI Docs", src: "img/docusaurus-openapi-docs-logo.svg", @@ -96,15 +97,13 @@ const config: Config = { { type: "custom-PalettePicker", position: "right" }, { href: "https://medium.com/palo-alto-networks-developer-blog", + label: "Blog", position: "right", - className: "header-medium-link", - "aria-label": "Palo Alto Networks Developer Blog", }, { href: "https://github.com/PaloAltoNetworks/docusaurus-openapi-docs", + label: "GitHub", position: "right", - className: "header-github-link", - "aria-label": "GitHub repository", }, ], }, @@ -262,11 +261,6 @@ const config: Config = { logoClass: "rust", }, ], - algolia: { - apiKey: "441074cace987cbf4640c039ebed303c", - appId: "J0EABTYI1A", - indexName: "docusaurus-openapi", - }, announcementBar: { id: "announcementBar_2", content: "v5.0.0 is now available! Requires Docusaurus 3.10.0+", @@ -387,7 +381,6 @@ const config: Config = { } satisfies Plugin.PluginOptions, }, ], - // FOUC prevention: restore saved palette before React hydrates function paletteScript() { return { name: "palette-fouc-script", @@ -404,12 +397,12 @@ const config: Config = { }; }, ], - themes: ["docusaurus-theme-openapi-docs"], - stylesheets: [ - { - href: "https://use.fontawesome.com/releases/v5.11.0/css/all.css", - type: "text/css", - }, + themes: [ + "docusaurus-theme-openapi-docs", + [ + "@aeei/docusaurus-theme", + { search: "local", copyPage: true, containerMaxWidth: "90rem" }, + ], ], }; diff --git a/demo/package.json b/demo/package.json index f96b58fc9..913b87c26 100644 --- a/demo/package.json +++ b/demo/package.json @@ -16,7 +16,7 @@ "clean-api-docs": "docusaurus clean-api-docs", "gen-api-docs:version": "docusaurus gen-api-docs:version", "clean-api-docs:version": "docusaurus clean-api-docs:version", - "gen-all": "docusaurus gen-api-docs all --all-versions", + "gen-all": "docusaurus clean-api-docs all --all-versions && docusaurus gen-api-docs all --all-versions", "clean-all": "docusaurus clean-api-docs all --all-versions", "re-gen": "yarn clean-all-versions && yarn gen-all-versions" }, @@ -25,9 +25,11 @@ "@docusaurus/faster": "3.10.2", "@docusaurus/plugin-google-gtag": "3.10.2", "@docusaurus/preset-classic": "3.10.2", + "@aeei/docusaurus-theme": "*", "clsx": "^2.1.1", "docusaurus-plugin-openapi-docs": "*", "docusaurus-theme-openapi-docs": "*", + "lucide-react": "^0.468.0", "prism-react-renderer": "^2.3.0", "react": "^19.0.0", "react-dom": "^19.0.0" diff --git a/demo/src/components/PalettePicker/index.tsx b/demo/src/components/PalettePicker/index.tsx index ee31f2361..f21262e66 100644 --- a/demo/src/components/PalettePicker/index.tsx +++ b/demo/src/components/PalettePicker/index.tsx @@ -1,16 +1,17 @@ -/* ============================================================================ - * PalettePicker — runtime color palette switcher for the navbar. - * - * Desktop: pill button in the top bar that opens a dropdown. - * Mobile: section rendered inside the hamburger drawer (mobile={true}). - * - * Dynamically injects /themes/.css into and persists - * the choice in localStorage under 'openapi-demo-palette'. - * ========================================================================== */ +import React, { useEffect, useState } from "react"; -import React, { useEffect, useRef, useState } from "react"; +import { ChevronDown } from "lucide-react"; -import styles from "./styles.module.css"; +import { Button } from "@aeei/docusaurus-theme/lib-theme/theme/components/ui/button"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuGroup, + DropdownMenuLabel, + DropdownMenuRadioGroup, + DropdownMenuRadioItem, + DropdownMenuTrigger, +} from "@aeei/docusaurus-theme/lib-theme/theme/components/ui/dropdown-menu"; const THEMES = [ { id: "evergreen", label: "Evergreen", color: "#2e8555" }, @@ -27,6 +28,10 @@ type ThemeId = (typeof THEMES)[number]["id"]; const STORAGE_KEY = "openapi-demo-palette"; const DEFAULT_PALETTE: ThemeId = "evergreen"; +function isThemeId(value: string | null): value is ThemeId { + return THEMES.some((theme) => theme.id === value); +} + function applyPalette(id: ThemeId): void { let link = document.getElementById( "openapi-palette-link" @@ -41,204 +46,71 @@ function applyPalette(id: ThemeId): void { localStorage.setItem(STORAGE_KEY, id); } -function MobileSection({ - active, - onSelect, - current, -}: { - active: ThemeId; - onSelect: (id: ThemeId) => void; - current: (typeof THEMES)[number]; -}) { - const [expanded, setExpanded] = useState(false); - +function PaletteSwatch({ color }: { color: string }) { return ( -
- - - {expanded && ( -
- {THEMES.map((theme) => ( - - ))} -
- )} -
+