fix(theme): use import type for plugin type imports (#1292)

Fix webpack build error caused by importing TypeScript source files
from the plugin's src/ directory without proper transpilation.

Changes:
- Add `import type` to all type imports from plugin src/ directories
- Move runtime import (sampleFromSchema) to use plugin's lib/ directory
- Re-export SchemaObject from plugin in theme's types.d.ts for consistency

Type-only imports are erased during TypeScript compilation, so they
don't require webpack to process the source TypeScript files.

Author: sserrata

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Authorization/slice.ts

@@ -7,7 +7,7 @@
 
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 import { createStorage, hashArray } from "@theme/ApiExplorer/storage-utils";
-import {
+import type {
   SecurityRequirementObject,
   SecuritySchemeObject,
 } from "docusaurus-plugin-openapi-docs/src/openapi/types";

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Body/FileArrayFormBodyItem/index.tsx

@@ -6,8 +6,10 @@
  * ========================================================================== */
 
 import React, { useState } from "react";
+
 import FormFileUpload from "@theme/ApiExplorer/FormFileUpload";
 import { useTypedDispatch } from "@theme/ApiItem/hooks";
+
 import { FileContent, setFileArrayFormBody } from "../slice";
 
 interface FileArrayFormItemProps {

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Body/FormBodyItem/index.tsx

@@ -6,14 +6,16 @@
  * ========================================================================== */
 
 import React from "react";
+
 import FormFileUpload from "@theme/ApiExplorer/FormFileUpload";
 import FormSelect from "@theme/ApiExplorer/FormSelect";
 import FormTextInput from "@theme/ApiExplorer/FormTextInput";
 import LiveApp from "@theme/ApiExplorer/LiveEditor";
 import { useTypedDispatch } from "@theme/ApiItem/hooks";
-import { SchemaObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
-import { clearFormBodyKey, setFileFormBody, setStringFormBody } from "../slice";
+import type { SchemaObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+
 import FileArrayFormBodyItem from "../FileArrayFormBodyItem";
+import { clearFormBodyKey, setFileFormBody, setStringFormBody } from "../slice";
 
 interface FormBodyItemProps {
   schemaObject: SchemaObject;

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Body/index.tsx

@@ -8,7 +8,6 @@
 import React, { useEffect, useMemo } from "react";
 
 import { translate } from "@docusaurus/Translate";
-
 import json2xml from "@theme/ApiExplorer/Body/json2xml";
 import FormFileUpload from "@theme/ApiExplorer/FormFileUpload";
 import FormItem from "@theme/ApiExplorer/FormItem";
@@ -18,13 +17,13 @@ import Markdown from "@theme/Markdown";
 import SchemaTabs from "@theme/SchemaTabs";
 import TabItem from "@theme/TabItem";
 import { OPENAPI_BODY, OPENAPI_REQUEST } from "@theme/translationIds";
-import { RequestBodyObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
-import { sampleFromSchema } from "docusaurus-plugin-openapi-docs/src/openapi/createSchemaExample";
+import { sampleFromSchema } from "docusaurus-plugin-openapi-docs/lib/openapi/createSchemaExample";
+import type { RequestBodyObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 import format from "xml-formatter";
 
-import { clearRawBody, setFileRawBody, setStringRawBody } from "./slice";
 import FormBodyItem from "./FormBodyItem";
 import { resolveSchemaWithSelections } from "./resolveSchemaWithSelections";
+import { clearRawBody, setFileRawBody, setStringRawBody } from "./slice";
 
 export interface Props {
   jsonRequestBodyExample: string;

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Body/resolveSchemaWithSelections.ts

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
-import { SchemaObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+import type { SchemaObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 import merge from "lodash/merge";
 
 export interface SchemaSelections {

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/FormItem/index.tsx

@@ -9,7 +9,6 @@ import React from "react";
 
 import { translate } from "@docusaurus/Translate";
 import { OPENAPI_SCHEMA_ITEM } from "@theme/translationIds";
-
 import clsx from "clsx";
 
 export interface Props {

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/ParamOptions/slice.ts

@@ -6,7 +6,7 @@
  * ========================================================================== */
 
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-import { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+import type { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
 
 export type Param = ParameterObject & { value?: string[] | string };
 

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Request/index.tsx

@@ -27,8 +27,8 @@ import {
 import Server from "@theme/ApiExplorer/Server";
 import { useTypedDispatch, useTypedSelector } from "@theme/ApiItem/hooks";
 import { OPENAPI_REQUEST } from "@theme/translationIds";
-import { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
-import { ApiItem } from "docusaurus-plugin-openapi-docs/src/types";
+import type { ParameterObject } from "docusaurus-plugin-openapi-docs/src/openapi/types";
+import type { ApiItem } from "docusaurus-plugin-openapi-docs/src/types";
 import type { ThemeConfig } from "docusaurus-theme-openapi-docs/src/types";
 import * as sdk from "postman-collection";
 import { FormProvider, useForm } from "react-hook-form";

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/Response/index.tsx

@@ -17,7 +17,7 @@ import SchemaTabs from "@theme/SchemaTabs";
 import TabItem from "@theme/TabItem";
 import { OPENAPI_RESPONSE } from "@theme/translationIds";
 import clsx from "clsx";
-import { ApiItem } from "docusaurus-plugin-openapi-docs/src/types";
+import type { ApiItem } from "docusaurus-plugin-openapi-docs/src/types";
 import type { ThemeConfig } from "docusaurus-theme-openapi-docs/src/types";
 
 import { clearResponse, clearCode, clearHeaders } from "./slice";
@@ -47,8 +47,7 @@ function Response({ item }: { item: ApiItem }) {
   const { siteConfig } = useDocusaurusContext();
   const themeConfig = siteConfig.themeConfig as ThemeConfig;
   const hideSendButton = metadata.frontMatter.hide_send_button;
-  const proxy =
-    metadata.frontMatter.proxy ?? themeConfig.api?.proxy;
+  const proxy = metadata.frontMatter.proxy ?? themeConfig.api?.proxy;
   const prismTheme = usePrismTheme();
   const code = useTypedSelector((state: any) => state.response.code);
   const headers = useTypedSelector((state: any) => state.response.headers);

packages/docusaurus-theme-openapi-docs/src/theme/ApiExplorer/SecuritySchemes/index.tsx

@@ -7,11 +7,10 @@
 
 import React from "react";
 
-import { translate } from "@docusaurus/Translate";
-import { OPENAPI_SECURITY_SCHEMES } from "@theme/translationIds";
-
 import Link from "@docusaurus/Link";
+import { translate } from "@docusaurus/Translate";
 import { useTypedSelector } from "@theme/ApiItem/hooks";
+import { OPENAPI_SECURITY_SCHEMES } from "@theme/translationIds";
 
 function SecuritySchemes(props: any) {
   const options = useTypedSelector((state: any) => state.auth.options);