@gitbook/react-openapi 1.4.3 → 1.5.2

package/dist/OpenAPIWebhook.d.ts

@@ -1,10 +1,15 @@
-import { type OpenAPIContextInput } from './context';
-import type { OpenAPIWebhookData } from './types';
+import { OpenAPIContextInput } from "./context.js";
+import { OpenAPIWebhookData } from "./types.js";
+import * as react0 from "react";
+
+//#region src/OpenAPIWebhook.d.ts
 /**
  * Display an interactive OpenAPI webhook.
  */
-export declare function OpenAPIWebhook(props: {
-    className?: string;
-    data: OpenAPIWebhookData;
-    context: OpenAPIContextInput;
-}): import("react").JSX.Element;
+declare function OpenAPIWebhook(props: {
+  className?: string;
+  data: OpenAPIWebhookData;
+  context: OpenAPIContextInput;
+}): react0.JSX.Element;
+//#endregion
+export { OpenAPIWebhook };

package/dist/OpenAPIWebhook.js

@@ -0,0 +1,28 @@
+import { resolveOpenAPIContext } from "./context.js";
+import { OpenAPIColumnSpec } from "./common/OpenAPIColumnSpec.js";
+import { OpenAPISummary } from "./common/OpenAPISummary.js";
+import { OpenAPIWebhookExample } from "./OpenAPIWebhookExample.js";
+import clsx from "classnames";
+
+//#region src/OpenAPIWebhook.tsx
+/**
+* Display an interactive OpenAPI webhook.
+*/
+function OpenAPIWebhook(props) {
+	const { className, data, context: contextInput } = props;
+	const context = resolveOpenAPIContext(contextInput);
+	return <div className={clsx("openapi-webhook", className)}>
+            <OpenAPISummary data={data} context={context} />
+            <div className="openapi-columns">
+                <OpenAPIColumnSpec data={data} context={context} />
+                <div className="openapi-column-preview">
+                    <div className="openapi-column-preview-body">
+                        <OpenAPIWebhookExample data={data} context={context} />
+                    </div>
+                </div>
+            </div>
+        </div>;
+}
+
+//#endregion
+export { OpenAPIWebhook };

package/dist/OpenAPIWebhookExample.js

@@ -0,0 +1,40 @@
+import { OpenAPIEmptyExample } from "./OpenAPIExample.js";
+import { createStateKey } from "./utils.js";
+import { getOpenAPIClientContext } from "./context.js";
+import { getExamples } from "./util/example.js";
+import { OpenAPIMediaTypeContent } from "./OpenAPIMediaType.js";
+
+//#region src/OpenAPIWebhookExample.tsx
+function OpenAPIWebhookExample(props) {
+	const { data, context } = props;
+	const { operation } = data;
+	const items = (() => {
+		if (!operation.requestBody) return [];
+		return Object.entries(operation.requestBody.content).map(([key, value]) => {
+			if (!value?.schema) return {
+				key,
+				label: key,
+				body: <OpenAPIEmptyExample context={context} />
+			};
+			return {
+				key,
+				label: key,
+				body: <></>,
+				examples: getExamples({
+					mediaTypeObject: value,
+					mediaType: key,
+					context
+				})
+			};
+		});
+	})();
+	return <div className="openapi-panel">
+            <h4 className="openapi-panel-heading">Payload</h4>
+            <div className="openapi-panel-body">
+                <OpenAPIMediaTypeContent selectIcon={context.icons.chevronDown} stateKey={createStateKey("request-body-media-type", context.blockKey)} items={items} context={getOpenAPIClientContext(context)} />
+            </div>
+        </div>;
+}
+
+//#endregion
+export { OpenAPIWebhookExample };

package/dist/ScalarApiButton.js

@@ -0,0 +1,87 @@
+'use client';
+
+
+import { t } from "./translate.js";
+import { useOpenAPIOperationContext } from "./OpenAPIOperationContext.js";
+import { useOpenAPIPrefillContext } from "./OpenAPIPrefillContextProvider.js";
+import { resolveTryItPrefillForOperation } from "./util/tryit-prefill.js";
+import { Suspense, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
+import { ApiClientModalProvider, useApiClientModal } from "@scalar/api-client-react";
+import { createPortal } from "react-dom";
+
+//#region src/ScalarApiButton.tsx
+/**
+* Button which launches the Scalar API Client
+*/
+function ScalarApiButton(props) {
+	const { method, path, securities, servers, specUrl, context } = props;
+	const [isOpen, setIsOpen] = useState(false);
+	const controllerRef = useRef(null);
+	return <div className="scalar scalar-activate">
+            <button className="scalar-activate-button button" onClick={() => {
+		controllerRef.current?.openClient?.();
+		setIsOpen(true);
+	}}>
+                {t(context.translation, "test_it")}
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 12" fill="currentColor">
+                    <path stroke="currentColor" strokeWidth="1.5" d="M1 10.05V1.43c0-.2.2-.31.37-.22l7.26 4.08c.17.1.17.33.01.43l-7.26 4.54a.25.25 0 0 1-.38-.21Z" />
+                </svg>
+            </button>
+
+            {isOpen && createPortal(<Suspense fallback={null}>
+                        <ScalarModal controllerRef={controllerRef} method={method} path={path} securities={securities} servers={servers} specUrl={specUrl} />
+                    </Suspense>, document.body)}
+        </div>;
+}
+function ScalarModal(props) {
+	const { method, path, securities, servers, specUrl, controllerRef } = props;
+	const prefillInputContext = useOpenAPIPrefillContext()();
+	const prefillConfig = resolveTryItPrefillForOperation({
+		operation: {
+			securities,
+			servers
+		},
+		prefillInputContext
+	});
+	return <ApiClientModalProvider configuration={{
+		url: specUrl,
+		...prefillConfig
+	}} initialRequest={{
+		method,
+		path
+	}}>
+            <ScalarModalController method={method} path={path} controllerRef={controllerRef} />
+        </ApiClientModalProvider>;
+}
+function ScalarModalController(props) {
+	const { method, path, controllerRef } = props;
+	const openScalarClient = useApiClientModal()?.open;
+	const { onOpenClient: trackClientOpening } = useOpenAPIOperationContext();
+	const openClient = useMemo(() => {
+		if (openScalarClient) return () => {
+			openScalarClient({
+				method,
+				path,
+				_source: "gitbook"
+			});
+			trackClientOpening({
+				method,
+				path
+			});
+		};
+		return null;
+	}, [
+		openScalarClient,
+		method,
+		path,
+		trackClientOpening
+	]);
+	useImperativeHandle(controllerRef, () => ({ openClient: openClient ? () => openClient() : void 0 }), [openClient]);
+	useEffect(() => {
+		openClient?.();
+	}, [openClient]);
+	return null;
+}
+
+//#endregion
+export { ScalarApiButton };

package/dist/StaticSection.js

@@ -0,0 +1,37 @@
+import clsx from "classnames";
+import { forwardRef } from "react";
+
+//#region src/StaticSection.tsx
+function Section(props) {
+	return <div {...props} className={clsx("openapi-section", props.className)} />;
+}
+function SectionHeader(props) {
+	return <div {...props} className={clsx("openapi-section-header", props.className ? `${props.className}-header` : void 0)} />;
+}
+function SectionHeaderContent(props) {
+	return <div {...props} className={clsx("openapi-section-header-content", props.className && `${props.className}-header-content`)} />;
+}
+const SectionBody = forwardRef(function SectionBody$1(props, ref) {
+	return <div ref={ref} {...props} className={clsx("openapi-section-body", props.className && `${props.className}-body`)} />;
+});
+function SectionFooter(props) {
+	return <div {...props} className={clsx("openapi-section-footer", props.className && `${props.className}-footer`)} />;
+}
+function SectionFooterContent(props) {
+	return <div {...props} className={clsx("openapi-section-footer-content", props.className && `${props.className}-footer-content`)} />;
+}
+function StaticSection(props) {
+	const { className, header, children, footer } = props;
+	return <Section className={className}>
+            {header ? <SectionHeader className={className}>
+                    <SectionHeaderContent className={className}>{header}</SectionHeaderContent>
+                </SectionHeader> : null}
+            <SectionBody className={className}>{children}</SectionBody>
+            {footer ? <SectionFooter className={className}>
+                    <SectionFooterContent className={className}>{footer}</SectionFooterContent>
+                </SectionFooter> : null}
+        </Section>;
+}
+
+//#endregion
+export { Section, SectionBody, SectionHeader, SectionHeaderContent, StaticSection };