@gitbook/react-openapi 1.1.5 → 1.1.7

package/dist/OpenAPISchema.jsx

@@ -1,55 +1,74 @@
+'use client';
 import { useId } from 'react';
 import clsx from 'clsx';
 import { Markdown } from './Markdown';
+import { OpenAPICopyButton } from './OpenAPICopyButton';
 import { OpenAPIDisclosure } from './OpenAPIDisclosure';
 import { OpenAPISchemaName } from './OpenAPISchemaName';
+import { retrocycle } from './decycle';
 import { checkIsReference, resolveDescription, resolveFirstExample } from './utils';
 /**
  * Render a property of an OpenAPI schema.
  */
 function OpenAPISchemaProperty(props) {
-    var property = props.property, _a = props.circularRefs, parentCircularRefs = _a === void 0 ? new Map() : _a, context = props.context, className = props.className;
+    var parentCircularRefs = props.circularRefs, context = props.context, className = props.className, property = props.property;
     var schema = property.schema;
     var id = useId();
     return (<div id={id} className={clsx('openapi-schema', className)}>
             <OpenAPISchemaPresentation property={property}/>
             {(function () {
-            var parentCircularRef = parentCircularRefs.get(schema);
+            var circularRefId = parentCircularRefs.get(schema);
             // Avoid recursing infinitely, and instead render a link to the parent schema
-            if (parentCircularRef) {
-                return <OpenAPISchemaCircularRef id={parentCircularRef} schema={schema}/>;
+            if (circularRefId) {
+                return <OpenAPISchemaCircularRef id={circularRefId} schema={schema}/>;
             }
-            var circularRefs = parentCircularRefs.set(schema, id);
+            var circularRefs = new Map(parentCircularRefs);
+            circularRefs.set(schema, id);
             var properties = getSchemaProperties(schema);
-            var alternatives = getSchemaAlternatives(schema, new Set(circularRefs.keys()));
-            return (<>
-                        {alternatives === null || alternatives === void 0 ? void 0 : alternatives.map(function (schema, index) { return (<OpenAPISchemaAlternative key={index} schema={schema} circularRefs={circularRefs} context={context}/>); })}
-                        {(properties === null || properties === void 0 ? void 0 : properties.length) ? (<OpenAPIDisclosure context={context} label={getDisclosureLabel(schema)}>
-                                <OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>
-                            </OpenAPIDisclosure>) : null}
-                    </>);
+            if (properties === null || properties === void 0 ? void 0 : properties.length) {
+                return (<OpenAPIDisclosure context={context} label={getDisclosureLabel(schema)}>
+                            <OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>
+                        </OpenAPIDisclosure>);
+            }
+            var ancestors = new Set(circularRefs.keys());
+            var alternatives = getSchemaAlternatives(schema, ancestors);
+            if (alternatives) {
+                return alternatives.map(function (schema, index) { return (<OpenAPISchemaAlternative key={index} schema={schema} circularRefs={circularRefs} context={context}/>); });
+            }
+            return null;
         })()}
         </div>);
 }
 /**
  * Render a set of properties of an OpenAPI schema.
  */
-export function OpenAPISchemaProperties(props) {
-    var id = props.id, properties = props.properties, circularRefs = props.circularRefs, context = props.context;
+function OpenAPISchemaProperties(props) {
+    var id = props.id, properties = props.properties, _a = props.circularRefs, circularRefs = _a === void 0 ? new Map() : _a, context = props.context;
     return (<div id={id} className="openapi-schema-properties">
-            {properties.map(function (property, index) { return (<OpenAPISchemaProperty key={index} circularRefs={circularRefs} property={property} context={context}/>); })}
+            {properties.map(function (property, index) {
+            return (<OpenAPISchemaProperty key={index} circularRefs={circularRefs} property={property} context={context}/>);
+        })}
         </div>);
 }
+export function OpenAPISchemaPropertiesFromServer(props) {
+    return (<OpenAPISchemaProperties id={props.id} properties={JSON.parse(props.properties, retrocycle())} context={props.context}/>);
+}
 /**
  * Render a root schema (such as the request body or response body).
  */
-export function OpenAPIRootSchema(props) {
-    var schema = props.schema, context = props.context;
+function OpenAPIRootSchema(props) {
+    var schema = props.schema, context = props.context, _a = props.circularRefs, parentCircularRefs = _a === void 0 ? new Map() : _a;
+    var id = useId();
     var properties = getSchemaProperties(schema);
     if (properties === null || properties === void 0 ? void 0 : properties.length) {
-        return <OpenAPISchemaProperties properties={properties} context={context}/>;
+        var circularRefs = new Map(parentCircularRefs);
+        circularRefs.set(schema, id);
+        return (<OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>);
     }
-    return (<OpenAPISchemaProperty className="openapi-schema-root" property={{ schema: schema }} context={context}/>);
+    return (<OpenAPISchemaProperty className="openapi-schema-root" property={{ schema: schema }} context={context} circularRefs={parentCircularRefs}/>);
+}
+export function OpenAPIRootSchemaFromServer(props) {
+    return (<OpenAPIRootSchema schema={JSON.parse(props.schema, retrocycle())} context={props.context}/>);
 }
 /**
  * Render a tab for an alternative schema.
@@ -81,15 +100,47 @@ function OpenAPISchemaCircularRef(props) {
  * Render the enum value for a schema.
  */
 function OpenAPISchemaEnum(props) {
-    var enumValues = props.enumValues;
+    var schema = props.schema;
+    var enumValues = (function () {
+        var _a;
+        // Render x-gitbook-enum first, as it has a different format
+        if (schema['x-gitbook-enum']) {
+            return Object.entries(schema['x-gitbook-enum']).map(function (_a) {
+                var name = _a[0], description = _a[1].description;
+                return {
+                    value: name,
+                    description: description,
+                };
+            });
+        }
+        if (schema['x-enumDescriptions']) {
+            return Object.entries(schema['x-enumDescriptions']).map(function (_a) {
+                var value = _a[0], description = _a[1];
+                return {
+                    value: value,
+                    description: description,
+                };
+            });
+        }
+        return (_a = schema.enum) === null || _a === void 0 ? void 0 : _a.map(function (value) {
+            return {
+                value: value,
+                description: undefined,
+            };
+        });
+    })();
+    if (!(enumValues === null || enumValues === void 0 ? void 0 : enumValues.length)) {
+        return null;
+    }
     return (<div className="openapi-schema-enum">
-            <span>
-                Options:{' '}
-                {enumValues.map(function (value, index) { return (<span key={index} className="openapi-schema-enum-value">
-                        <code>{"".concat(value)}</code>
-                        {index < enumValues.length - 1 ? ', ' : ''}
+            <span>Available options:</span>
+            <div className="openapi-schema-enum-list">
+                {enumValues.map(function (item, index) { return (<span key={index} className="openapi-schema-enum-value">
+                        <OpenAPICopyButton value={item.value} label={item.description} withTooltip={!!item.description}>
+                            <code>{"".concat(item.value)}</code>
+                        </OpenAPICopyButton>
                     </span>); })}
-            </span>
+            </div>
         </div>);
 }
 /**
@@ -114,7 +165,7 @@ function OpenAPISchemaPresentation(props) {
             {schema.pattern ? (<div className="openapi-schema-pattern">
                     Pattern: <code>{schema.pattern}</code>
                 </div>) : null}
-            {schema.enum && schema.enum.length > 0 ? (<OpenAPISchemaEnum enumValues={schema.enum}/>) : null}
+            <OpenAPISchemaEnum schema={schema}/>
         </div>);
 }
 /**
@@ -208,7 +259,7 @@ function getSchemaTitle(schema) {
     var _a;
     // Otherwise try to infer a nice title
     var type = 'any';
-    if (schema.enum) {
+    if (schema.enum || schema['x-enumDescriptions'] || schema['x-gitbook-enum']) {
         type = "".concat(schema.type, " \u00B7 enum");
         // check array AND schema.items as this is sometimes null despite what the type indicates
     }

package/dist/OpenAPISchemaName.jsx

@@ -1,3 +1,4 @@
+import { stringifyOpenAPI } from './stringifyOpenAPI';
 /**
  * Display the schema name row.
  * It includes the property name, type, required and deprecated status.
@@ -14,21 +15,22 @@ export function OpenAPISchemaName(props) {
                 {additionalItems ? (<span className="openapi-schema-type">{additionalItems}</span>) : null}
             </span>
             {(schema === null || schema === void 0 ? void 0 : schema.readOnly) ? <span className="openapi-schema-readonly">read-only</span> : null}
-            {required ? <span className="openapi-schema-required">required</span> : null}
+            {(schema === null || schema === void 0 ? void 0 : schema.writeOnly) ? (<span className="openapi-schema-writeonly">write-only</span>) : null}
+            {required ? (<span className="openapi-schema-required">required</span>) : (<span className="openapi-schema-optional">optional</span>)}
             {(schema === null || schema === void 0 ? void 0 : schema.deprecated) ? <span className="openapi-deprecated">Deprecated</span> : null}
         </div>);
 }
 function getAdditionalItems(schema) {
     var additionalItems = '';
-    if (schema.minimum || schema.minLength) {
-        additionalItems += " \u00B7 min: ".concat(schema.minimum || schema.minLength);
+    if (schema.minimum || schema.minLength || schema.minItems) {
+        additionalItems += " \u00B7 min: ".concat(schema.minimum || schema.minLength || schema.minItems);
     }
-    if (schema.maximum || schema.maxLength) {
-        additionalItems += " \u00B7 max: ".concat(schema.maximum || schema.maxLength);
+    if (schema.maximum || schema.maxLength || schema.maxItems) {
+        additionalItems += " \u00B7 max: ".concat(schema.maximum || schema.maxLength || schema.maxItems);
     }
     // If the schema has a default value, we display it
     if (typeof schema.default !== 'undefined') {
-        additionalItems += " \u00B7 default: ".concat(schema.default);
+        additionalItems += " \u00B7 default: ".concat(stringifyOpenAPI(schema.default));
     }
     if (schema.nullable) {
         additionalItems = ' | nullable';

package/dist/OpenAPISchemaServer.d.ts

@@ -0,0 +1,12 @@
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import { type OpenAPISchemaPropertyEntry } from './OpenAPISchema';
+import type { OpenAPIClientContext } from './types';
+export declare function OpenAPISchemaProperties(props: {
+    id?: string;
+    properties: OpenAPISchemaPropertyEntry[];
+    context: OpenAPIClientContext;
+}): import("react").JSX.Element;
+export declare function OpenAPIRootSchema(props: {
+    schema: OpenAPIV3.SchemaObject;
+    context: OpenAPIClientContext;
+}): import("react").JSX.Element;

package/dist/OpenAPISchemaServer.jsx

@@ -0,0 +1,8 @@
+import { OpenAPIRootSchemaFromServer, OpenAPISchemaPropertiesFromServer, } from './OpenAPISchema';
+import { decycle } from './decycle';
+export function OpenAPISchemaProperties(props) {
+    return (<OpenAPISchemaPropertiesFromServer id={props.id} properties={JSON.stringify(props.properties, decycle())} context={props.context}/>);
+}
+export function OpenAPIRootSchema(props) {
+    return (<OpenAPIRootSchemaFromServer schema={JSON.stringify(props.schema, decycle())} context={props.context}/>);
+}

package/dist/OpenAPISpec.d.ts

@@ -1,10 +1,4 @@
 import type { OpenAPIClientContext, OpenAPIOperationData } from './types';
-/**
- * Client component to render the spec for the request and response.
- *
- * We use a client component as rendering recursive JSON schema in the server is expensive
- * (the entire schema is rendered at once, while the client component only renders the visible part)
- */
 export declare function OpenAPISpec(props: {
     data: OpenAPIOperationData;
     context: OpenAPIClientContext;

package/dist/OpenAPISpec.jsx

@@ -1,15 +1,9 @@
 import { OpenAPIRequestBody } from './OpenAPIRequestBody';
 import { OpenAPIResponses } from './OpenAPIResponses';
-import { OpenAPISchemaProperties } from './OpenAPISchema';
+import { OpenAPISchemaProperties } from './OpenAPISchemaServer';
 import { OpenAPISecurities } from './OpenAPISecurities';
 import { StaticSection } from './StaticSection';
 import { parameterToProperty } from './utils';
-/**
- * Client component to render the spec for the request and response.
- *
- * We use a client component as rendering recursive JSON schema in the server is expensive
- * (the entire schema is rendered at once, while the client component only renders the visible part)
- */
 export function OpenAPISpec(props) {
     var _a;
     var data = props.data, context = props.context;
@@ -17,16 +11,16 @@ export function OpenAPISpec(props) {
     var parameters = (_a = operation.parameters) !== null && _a !== void 0 ? _a : [];
     var parameterGroups = groupParameters(parameters);
     return (<>
-            {securities.length > 0 ? (<OpenAPISecurities securities={securities} context={context}/>) : null}
+            {securities.length > 0 ? (<OpenAPISecurities key="securities" securities={securities} context={context}/>) : null}
 
             {parameterGroups.map(function (group) {
-            return (<StaticSection key={group.key} className="openapi-parameters" header={group.label}>
+            return (<StaticSection key={"parameter-".concat(group.key)} className="openapi-parameters" header={group.label}>
                         <OpenAPISchemaProperties properties={group.parameters.map(parameterToProperty)} context={context}/>
                     </StaticSection>);
         })}
 
-            {operation.requestBody ? (<OpenAPIRequestBody requestBody={operation.requestBody} context={context}/>) : null}
-            {operation.responses ? (<OpenAPIResponses responses={operation.responses} context={context}/>) : null}
+            {operation.requestBody ? (<OpenAPIRequestBody key="body" requestBody={operation.requestBody} context={context}/>) : null}
+            {operation.responses ? (<OpenAPIResponses key="responses" responses={operation.responses} context={context}/>) : null}
         </>);
 }
 function groupParameters(parameters) {

package/dist/OpenAPITabs.jsx

@@ -102,16 +102,8 @@ export function OpenAPITabsPanels() {
         return null;
     }
     var key = selectedTab.key.toString();
-    return (<TabPanel key={key} id={key} className="openapi-tabs-panel">
-            {selectedTab.body}
-            {selectedTab.footer ? (<OpenAPITabsPanelFooter>{selectedTab.footer}</OpenAPITabsPanelFooter>) : null}
+    return (<TabPanel id={key} className="openapi-tabs-panel">
+            <div className="openapi-tabs-body">{selectedTab.body}</div>
+            {selectedTab.footer ? (<div className="openapi-tabs-footer">{selectedTab.footer}</div>) : null}
         </TabPanel>);
 }
-/**
- * The OpenAPI Tabs panel footer component.
- * This component should be used as a child of the OpenAPITabs component.
- */
-function OpenAPITabsPanelFooter(props) {
-    var children = props.children;
-    return <div className="openapi-tabs-footer">{children}</div>;
-}

package/dist/code-samples.d.ts

@@ -4,7 +4,7 @@ export interface CodeSampleInput {
     headers?: Record<string, string>;
     body?: any;
 }
-interface CodeSampleGenerator {
+export interface CodeSampleGenerator {
     id: string;
     label: string;
     syntax: string;
@@ -15,4 +15,3 @@ export declare function parseHostAndPath(url: string): {
     host: string | undefined;
     path: string;
 };
-export {};

package/dist/code-samples.js

@@ -10,6 +10,7 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { isCSV, isFormData, isFormUrlEncoded, isGraphQL, isPDF, isPlainObject, isText, isXML, } from './contentTypeChecks';
+import { json2xml } from './json2xml';
 import { stringifyOpenAPI } from './stringifyOpenAPI';
 export var codeSampleGenerators = [
     {
@@ -201,9 +202,13 @@ var BodyGenerators = {
         else if (isText(contentType)) {
             body = "--data '".concat(String(body).replace(/"/g, ''), "'");
         }
-        else if (isXML(contentType) || isCSV(contentType)) {
+        else if (isXML(contentType)) {
+            // Convert to XML and ensure proper formatting
+            body = "--data-binary $'".concat(convertBodyToXML(body), "'");
+        }
+        else if (isCSV(contentType)) {
             // We use --data-binary to avoid cURL converting newlines to \r\n
-            body = "--data-binary $'".concat(stringifyOpenAPI(body).replace(/"/g, ''), "'");
+            body = "--data-binary $'".concat(stringifyOpenAPI(body).replace(/"/g, '').replace(/\\n/g, '\n'), "'");
         }
         else if (isGraphQL(contentType)) {
             body = "--data '".concat(stringifyOpenAPI(body), "'");
@@ -215,7 +220,7 @@ var BodyGenerators = {
             body = "--data-binary '@".concat(String(body), "'");
         }
         else {
-            body = "--data '".concat(stringifyOpenAPI(body, null, 2), "'");
+            body = "--data '".concat(stringifyOpenAPI(body, null, 2).replace(/\\n/g, '\n'), "'");
         }
         return {
             body: body,
@@ -285,7 +290,8 @@ var BodyGenerators = {
         }
         else if (isXML(contentType)) {
             code += 'const xml = `\n';
-            code += indent(String(body), 4);
+            // Convert JSON to XML if needed
+            code += indent(convertBodyToXML(body), 4);
             code += '`;\n\n';
             body = 'xml';
         }
@@ -319,6 +325,10 @@ var BodyGenerators = {
             code += '}\n\n';
             body = 'files';
         }
+        if (isXML(contentType)) {
+            // Convert JSON to XML if needed
+            body = convertBodyToXML(body);
+        }
         return { body: body, code: code, headers: headers };
     },
     getHTTPBody: function (body, headers) {
@@ -332,14 +342,18 @@ var BodyGenerators = {
                     ? Object.entries(body)
                         .map(function (_a) {
                         var key = _a[0], value = _a[1];
-                        return "".concat(key, "=").concat(String(value));
+                        return "".concat(key, "=").concat(stringifyOpenAPI(value));
                     })
                         .join('&')
-                    : String(body);
-                return "\"".concat(encoded, "\"");
+                    : stringifyOpenAPI(body);
+                return "\"".concat(encoded.replace(/"/g, "'"), "\"");
             },
             text: function () { return "\"".concat(String(body), "\""); },
-            xmlOrCsv: function () { return "\"".concat(stringifyOpenAPI(body).replace(/"/g, ''), "\""); },
+            xml: function () {
+                // Convert JSON to XML if needed
+                return "\"".concat(convertBodyToXML(body), "\"");
+            },
+            csv: function () { return "\"".concat(stringifyOpenAPI(body).replace(/"/g, ''), "\""); },
             default: function () { return "".concat(stringifyOpenAPI(body, null, 2)); },
         };
         if (isPDF(contentType))
@@ -348,9 +362,30 @@ var BodyGenerators = {
             return typeHandlers.formUrlEncoded();
         if (isText(contentType))
             return typeHandlers.text();
-        if (isXML(contentType) || isCSV(contentType)) {
-            return typeHandlers.xmlOrCsv();
-        }
+        if (isXML(contentType))
+            return typeHandlers.xml();
+        if (isCSV(contentType))
+            return typeHandlers.csv();
         return typeHandlers.default();
     },
 };
+/**
+ * Converts a body to XML format
+ */
+function convertBodyToXML(body) {
+    // If body is already a string and looks like XML, return it as is
+    if (typeof body === 'string' && body.trim().startsWith('<')) {
+        return body;
+    }
+    // If body is not an object, try to parse it as JSON
+    if (typeof body !== 'object' || body === null) {
+        try {
+            body = JSON.parse(body);
+        }
+        catch (_a) {
+            // If parsing fails, return the original body
+            return body;
+        }
+    }
+    return json2xml(body).replace(/"/g, '').replace(/\\n/g, '\n').replace(/\\t/g, '\t');
+}

package/dist/decycle.d.ts

@@ -0,0 +1,2 @@
+export declare const decycle: () => (this: any, key: string | symbol, value: any) => any;
+export declare function retrocycle(): (this: object, key: string | symbol, value: any) => any;

package/dist/decycle.js

@@ -0,0 +1,70 @@
+// Forked from: https://github.com/YChebotaev/json-decycle/blob/master/src/index.ts
+// Replaced `$ref` with `$reference` to avoid conflicts with OpenAPI
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+var isObject = function (value) {
+    return typeof value === 'object' &&
+        value != null &&
+        !(value instanceof Boolean) &&
+        !(value instanceof Date) &&
+        !(value instanceof Number) &&
+        !(value instanceof RegExp) &&
+        !(value instanceof String);
+};
+var toPointer = function (parts) {
+    return "#".concat(parts.map(function (part) { return String(part).replace(/~/g, '~0').replace(/\//g, '~1'); }).join('/'));
+};
+export var decycle = function () {
+    var paths = new WeakMap();
+    return function replacer(key, value) {
+        var _a;
+        if (key !== '$reference' && isObject(value)) {
+            var seen = paths.has(value);
+            if (seen) {
+                return { $reference: toPointer(paths.get(value)) };
+            }
+            paths.set(value, __spreadArray(__spreadArray([], ((_a = paths.get(this)) !== null && _a !== void 0 ? _a : []), true), [key], false));
+        }
+        return value;
+    };
+};
+export function retrocycle() {
+    var parents = new WeakMap();
+    var keys = new WeakMap();
+    var refs = new Set();
+    function dereference(ref) {
+        var _a;
+        var parts = ref.$reference.slice(1).split('/');
+        var key;
+        var value = this;
+        for (var i = 0; i < parts.length; i++) {
+            key = (_a = parts[i]) === null || _a === void 0 ? void 0 : _a.replace(/~1/g, '/').replace(/~0/g, '~');
+            value = value[key];
+        }
+        var parent = parents.get(ref);
+        parent[keys.get(ref)] = value;
+    }
+    return function reviver(key, value) {
+        if (key === '$reference') {
+            refs.add(this);
+        }
+        else if (isObject(value)) {
+            var isRoot = key === '' && Object.keys(this).length === 1;
+            if (isRoot) {
+                refs.forEach(dereference, this);
+            }
+            else {
+                parents.set(value, this);
+                keys.set(value, key);
+            }
+        }
+        return value;
+    };
+}

package/dist/generateSchemaExample.d.ts

@@ -1,5 +1,4 @@
 import type { OpenAPIV3 } from '@gitbook/openapi-parser';
-import { getExampleFromSchema } from '@scalar/oas-utils/spec-getters';
 type JSONValue = string | number | boolean | null | JSONValue[] | {
     [key: string]: JSONValue;
 };
@@ -12,5 +11,35 @@ export declare function generateSchemaExample(schema: OpenAPIV3.SchemaObject, op
 /**
  * Generate an example for a media type.
  */
-export declare function generateMediaTypeExample(mediaType: OpenAPIV3.MediaTypeObject, options?: GenerateSchemaExampleOptions): JSONValue | undefined;
+export declare function generateMediaTypeExamples(mediaType: OpenAPIV3.MediaTypeObject, options?: GenerateSchemaExampleOptions): OpenAPIV3.ExampleObject[];
+/**
+ * This function takes an OpenAPI schema and generates an example from it
+ * Forked from : https://github.com/scalar/scalar/blob/main/packages/oas-utils/src/spec-getters/getExampleFromSchema.ts
+ */
+declare const getExampleFromSchema: (schema: Record<string, any>, options?: {
+    /**
+     * The fallback string for empty string values.
+     * @default ''
+     */
+    emptyString?: string;
+    /**
+     * Whether to use the XML tag names as keys
+     * @default false
+     */
+    xml?: boolean;
+    /**
+     * Whether to show read-only/write-only properties. Otherwise all properties are shown.
+     * @default undefined
+     */
+    mode?: "read" | "write";
+    /**
+     * Dynamic values to add to the example.
+     */
+    variables?: Record<string, any>;
+    /**
+     * Whether to omit empty and optional properties.
+     * @default false
+     */
+    omitEmptyAndOptionalProperties?: boolean;
+}, level?: number, parentSchema?: Record<string, any>, name?: string) => any;
 export {};