@gitbook/react-openapi 1.2.0 → 1.3.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @gitbook/react-openapi
 
+## 1.3.0
+
+### Minor Changes
+
+- 326e28e: Design tweaks to code blocks and OpenAPI pages
+
+### Patch Changes
+
+- 42ca7e1: Fix openapi CR preview
+- 5e975ab: Fix code highlighting for HTTP
+- 580101d: Fix schemas disclosure label causing client error
+- 20ebecb: Missing top-level required OpenAPI alternatives
+- 80cb52a: Handle OpenAPI alternatives from schema.items
+- cb5598d: Handle invalid OpenAPI Responses
+- c6637b0: Use default value if string number or boolean in generateSchemaExample
+- a3ec264: Fix Python code sample "null vs None"
+- Updated dependencies [d00dc8c]
+  - @gitbook/openapi-parser@2.1.4
+
+## 1.2.1
+
+### Patch Changes
+
+- ebc39e9: Missing select icon
+- b6b09d4: Fix OpenAPI responses select placement and icon
+
 ## 1.2.0
 
 ### Minor Changes

package/dist/OpenAPIDisclosure.d.ts

@@ -4,6 +4,7 @@ import type React from 'react';
  */
 export declare function OpenAPIDisclosure(props: {
     icon: React.ReactNode;
+    header: React.ReactNode;
     children: React.ReactNode;
     label: string | ((isExpanded: boolean) => string);
     className?: string;

package/dist/OpenAPIDisclosure.jsx

@@ -6,7 +6,7 @@ import { Button, Disclosure, DisclosurePanel } from 'react-aria-components';
  * Display an interactive OpenAPI disclosure.
  */
 export function OpenAPIDisclosure(props) {
-    var icon = props.icon, children = props.children, label = props.label, className = props.className;
+    var icon = props.icon, header = props.header, label = props.label, children = props.children, className = props.className;
     var _a = useState(false), isExpanded = _a[0], setIsExpanded = _a[1];
     return (<Disclosure className={clsx('openapi-disclosure', className)} isExpanded={isExpanded} onExpandedChange={setIsExpanded}>
             <Button slot="trigger" className="openapi-disclosure-trigger" style={function (_a) {
@@ -17,8 +17,11 @@ export function OpenAPIDisclosure(props) {
                     : 'none',
             });
         }}>
-                {icon}
-                <span>{typeof label === 'function' ? label(isExpanded) : label}</span>
+                {header}
+                <div className="openapi-disclosure-trigger-label">
+                    <span>{typeof label === 'function' ? label(isExpanded) : label}</span>
+                    {icon}
+                </div>
             </Button>
             <DisclosurePanel className="openapi-disclosure-panel">
                 {isExpanded ? children : null}

package/dist/OpenAPIDisclosureGroup.jsx

@@ -50,29 +50,30 @@ function DisclosureItem(props) {
     var store = useSelectState(selectStateKey, defaultTab);
     var selectedTab = ((_d = group.tabs) === null || _d === void 0 ? void 0 : _d.find(function (tab) { return tab.key === store.key; })) || ((_e = group.tabs) === null || _e === void 0 ? void 0 : _e[0]);
     return (<div className="openapi-disclosure-group" aria-expanded={state.isExpanded}>
-            <div className="openapi-disclosure-group-header">
-                <button slot="trigger" ref={triggerRef} {...mergeProps(buttonProps, focusProps)} disabled={isDisabled} style={{
+            <div slot="trigger" ref={triggerRef} {...mergeProps(buttonProps, focusProps)} aria-disabled={isDisabled} style={{
             outline: isFocusVisible
                 ? '2px solid rgb(var(--primary-color-500)/0.4)'
                 : 'none',
         }} className="openapi-disclosure-group-trigger">
-                    <div className="openapi-disclosure-group-icon">
-                        {icon || (<svg viewBox="0 0 24 24" className="openapi-disclosure-group-icon">
-                                <path d="m8.25 4.5 7.5 7.5-7.5 7.5"/>
-                            </svg>)}
-                    </div>
+                <div className="openapi-disclosure-group-icon">
+                    {icon || (<svg viewBox="0 0 24 24" className="openapi-disclosure-group-icon">
+                            <path d="m8.25 4.5 7.5 7.5-7.5 7.5"/>
+                        </svg>)}
+                </div>
 
+                <div className="openapi-disclosure-group-label">
                     {group.label}
-                </button>
-                {group.tabs ? (<div className="openapi-disclosure-group-mediatype" onClick={function (e) { return e.stopPropagation(); }}>
-                        {((_f = group.tabs) === null || _f === void 0 ? void 0 : _f.length) > 1 ? (<OpenAPISelect icon={selectIcon} stateKey={selectStateKey} onSelectionChange={function () {
+
+                    {group.tabs ? (<div className="openapi-disclosure-group-mediatype" onClick={function (e) { return e.stopPropagation(); }}>
+                            {((_f = group.tabs) === null || _f === void 0 ? void 0 : _f.length) > 1 ? (<OpenAPISelect icon={selectIcon} stateKey={selectStateKey} onSelectionChange={function () {
                     state.expand();
-                }} items={group.tabs}>
-                                {group.tabs.map(function (tab) { return (<OpenAPISelectItem key={tab.key} id={tab.key} value={tab}>
-                                        {tab.label}
-                                    </OpenAPISelectItem>); })}
-                            </OpenAPISelect>) : ((_g = group.tabs[0]) === null || _g === void 0 ? void 0 : _g.label) ? (<span>{group.tabs[0].label}</span>) : null}
-                    </div>) : null}
+                }} items={group.tabs} placement="bottom end">
+                                    {group.tabs.map(function (tab) { return (<OpenAPISelectItem key={tab.key} id={tab.key} value={tab}>
+                                            {tab.label}
+                                        </OpenAPISelectItem>); })}
+                                </OpenAPISelect>) : ((_g = group.tabs[0]) === null || _g === void 0 ? void 0 : _g.label) ? (<span>{group.tabs[0].label}</span>) : null}
+                        </div>) : null}
+                </div>
             </div>
 
             {state.isExpanded && selectedTab && (<div className="openapi-disclosure-group-panel" ref={panelRef} {...panelProps}>

package/dist/OpenAPIResponse.jsx

@@ -10,7 +10,9 @@ var __assign = (this && this.__assign) || function () {
     return __assign.apply(this, arguments);
 };
 import { OpenAPIDisclosure } from './OpenAPIDisclosure';
+import { OpenAPISchemaPresentation } from './OpenAPISchema';
 import { OpenAPISchemaProperties } from './OpenAPISchemaServer';
+import { tString } from './translate';
 import { parameterToProperty, resolveDescription } from './utils';
 /**
  * Display an interactive response body.
@@ -28,14 +30,28 @@ export function OpenAPIResponse(props) {
         return null;
     }
     return (<div className="openapi-response-body">
-            {headers.length > 0 ? (<OpenAPIDisclosure icon={context.icons.plus} label="Headers">
+            {headers.length > 0 ? (<OpenAPIDisclosure header={<OpenAPISchemaPresentation context={context} property={{
+                    propertyName: tString(context.translation, 'headers'),
+                    schema: {
+                        type: 'object',
+                    },
+                    required: null,
+                }}/>} icon={context.icons.plus} label={function (isExpanded) {
+                return tString(context.translation, isExpanded ? 'hide' : 'show', tString(context.translation, headers.length === 1 ? 'header' : 'headers'));
+            }}>
                     <OpenAPISchemaProperties properties={headers.map(function (_a) {
                 var name = _a[0], header = _a[1];
                 return parameterToProperty(__assign({ name: name }, header));
             })} context={context}/>
                 </OpenAPIDisclosure>) : null}
             {mediaType.schema && (<div className="openapi-responsebody">
-                    <OpenAPISchemaProperties id={"response-".concat(context.blockKey)} properties={[{ schema: mediaType.schema }]} context={context}/>
+                    <OpenAPISchemaProperties id={"response-".concat(context.blockKey)} properties={[
+                {
+                    schema: mediaType.schema,
+                    propertyName: tString(context.translation, 'response'),
+                    required: null,
+                },
+            ]} context={context}/>
                 </div>)}
         </div>);
 }

package/dist/OpenAPIResponseExample.jsx

@@ -4,8 +4,8 @@ import { OpenAPIMediaTypeContent } from './OpenAPIMediaType';
 import { OpenAPIResponseExampleContent } from './OpenAPIResponseExampleContent';
 import { getOpenAPIClientContext } from './context';
 import { getExampleFromReference, getExamples } from './util/example';
-import { createStateKey, getStatusCodeDefaultLabel } from './utils';
-import { checkIsReference, resolveDescription } from './utils';
+import { createStateKey, getStatusCodeDefaultLabel, resolveDescription } from './utils';
+import { checkIsReference } from './utils';
 /**
  * Display an example of the response content.
  */
@@ -34,7 +34,12 @@ export function OpenAPIResponseExample(props) {
         }
         return Number(a) - Number(b);
     });
-    var tabs = responses.map(function (_a) {
+    var tabs = responses
+        .filter(function (_a) {
+        var _ = _a[0], responseObject = _a[1];
+        return responseObject && typeof responseObject === 'object';
+    })
+        .map(function (_a) {
         var key = _a[0], responseObject = _a[1];
         var description = resolveDescription(responseObject);
         var label = description ? (<Markdown source={description}/>) : (getStatusCodeDefaultLabel(key, context));

package/dist/OpenAPIResponses.jsx

@@ -13,7 +13,12 @@ import { createStateKey, getStatusCodeClassName, getStatusCodeDefaultLabel } fro
 export function OpenAPIResponses(props) {
     var _a;
     var responses = props.responses, context = props.context;
-    var groups = Object.entries(responses).map(function (_a) {
+    var groups = Object.entries(responses)
+        .filter(function (_a) {
+        var _ = _a[0], response = _a[1];
+        return response && typeof response === 'object';
+    })
+        .map(function (_a) {
         var statusCode = _a[0], response = _a[1];
         var tabs = (function () {
             var _a;
@@ -56,6 +61,6 @@ export function OpenAPIResponses(props) {
             var _a;
             var key = (_a = keys.values().next().value) !== null && _a !== void 0 ? _a : null;
             state.setKey(key);
-        }} groups={groups} selectStateKey={createStateKey('response-media-types', context.blockKey)}/>
+        }} groups={groups} selectIcon={context.icons.chevronDown} selectStateKey={createStateKey('response-media-types', context.blockKey)}/>
         </StaticSection>);
 }

package/dist/OpenAPISchema.d.ts

@@ -1,8 +1,8 @@
 import type { OpenAPIV3 } from '@gitbook/openapi-parser';
 import type { OpenAPIClientContext } from './context';
 export interface OpenAPISchemaPropertyEntry {
-    propertyName?: string | undefined;
-    required?: boolean | undefined;
+    propertyName?: string;
+    required?: boolean | null;
     schema: OpenAPIV3.SchemaObject;
 }
 export declare function OpenAPISchemaPropertiesFromServer(props: {
@@ -14,6 +14,13 @@ export declare function OpenAPIRootSchemaFromServer(props: {
     schema: string;
     context: OpenAPIClientContext;
 }): import("react").JSX.Element;
+/**
+ * Render the top row of a schema. e.g: name, type, and required status.
+ */
+export declare function OpenAPISchemaPresentation(props: {
+    property: OpenAPISchemaPropertyEntry;
+    context: OpenAPIClientContext;
+}): import("react").JSX.Element;
 /**
  * Get the alternatives to display for a schema.
  */

package/dist/OpenAPISchema.jsx

@@ -10,6 +10,17 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 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)) {
@@ -26,6 +37,7 @@ import { OpenAPICopyButton } from './OpenAPICopyButton';
 import { OpenAPIDisclosure } from './OpenAPIDisclosure';
 import { OpenAPISchemaName } from './OpenAPISchemaName';
 import { retrocycle } from './decycle';
+import { getDisclosureLabel } from './getDisclosureLabel';
 import { stringifyOpenAPI } from './stringifyOpenAPI';
 import { tString } from './translate';
 import { checkIsReference, resolveDescription, resolveFirstExample } from './utils';
@@ -33,34 +45,42 @@ import { checkIsReference, resolveDescription, resolveFirstExample } from './uti
  * Render a property of an OpenAPI schema.
  */
 function OpenAPISchemaProperty(props) {
-    var parentCircularRefs = props.circularRefs, context = props.context, className = props.className, property = props.property;
+    var parentCircularRefs = props.circularRefs, context = props.context, className = props.className, property = props.property, rest = __rest(props, ["circularRefs", "context", "className", "property"]);
     var schema = property.schema;
     var id = useId();
-    return (<div id={id} className={clsx('openapi-schema', className)}>
-            <OpenAPISchemaPresentation context={context} property={property}/>
-            {(function () {
-            var circularRefId = parentCircularRefs.get(schema);
-            // Avoid recursing infinitely, and instead render a link to the parent schema
-            if (circularRefId) {
-                return <OpenAPISchemaCircularRef id={circularRefId} schema={schema}/>;
-            }
-            var circularRefs = new Map(parentCircularRefs);
-            circularRefs.set(schema, id);
-            var properties = getSchemaProperties(schema);
-            if (properties === null || properties === void 0 ? void 0 : properties.length) {
-                return (<OpenAPIDisclosure icon={context.icons.plus} label={function (isExpanded) {
-                        return getDisclosureLabel({ schema: schema, isExpanded: isExpanded, context: context });
-                    }}>
-                            <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;
-        })()}
+    var circularRefId = parentCircularRefs.get(schema);
+    // Avoid recursing infinitely, and instead render a link to the parent schema
+    if (circularRefId) {
+        return <OpenAPISchemaCircularRef id={circularRefId} schema={schema}/>;
+    }
+    var circularRefs = new Map(parentCircularRefs);
+    circularRefs.set(schema, id);
+    var properties = getSchemaProperties(schema);
+    var ancestors = new Set(circularRefs.keys());
+    var alternatives = getSchemaAlternatives(schema, ancestors);
+    var header = <OpenAPISchemaPresentation context={context} property={property}/>;
+    var content = (function () {
+        if (properties === null || properties === void 0 ? void 0 : properties.length) {
+            return (<OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>);
+        }
+        if (alternatives) {
+            return (<div className="openapi-schema-alternatives">
+                    {alternatives.map(function (alternativeSchema, index) { return (<div key={index} className="openapi-schema-alternative">
+                            <OpenAPISchemaAlternative schema={alternativeSchema} circularRefs={circularRefs} context={context}/>
+                            {index < alternatives.length - 1 ? (<OpenAPISchemaAlternativeSeparator schema={schema} context={context}/>) : null}
+                        </div>); })}
+                </div>);
+        }
+        return null;
+    })();
+    if (properties === null || properties === void 0 ? void 0 : properties.length) {
+        return (<OpenAPIDisclosure icon={context.icons.plus} className={clsx('openapi-schema', className)} header={header} label={function (isExpanded) { return getDisclosureLabel({ schema: schema, isExpanded: isExpanded, context: context }); }} {...rest}>
+                {content}
+            </OpenAPIDisclosure>);
+    }
+    return (<div id={id} {...rest} className={clsx('openapi-schema', className)}>
+            {header}
+            {content}
         </div>);
 }
 /**
@@ -70,7 +90,7 @@ 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}/>);
+            return (<OpenAPISchemaProperty key={index} circularRefs={circularRefs} property={property} context={context} style={{ animationDelay: "".concat(index * 0.02, "s") }}/>);
         })}
         </div>);
 }
@@ -105,14 +125,24 @@ export function OpenAPIRootSchemaFromServer(props) {
  */
 function OpenAPISchemaAlternative(props) {
     var schema = props.schema, circularRefs = props.circularRefs, context = props.context;
-    var description = resolveDescription(schema);
     var properties = getSchemaProperties(schema);
-    return (<>
-            {description ? (<Markdown source={description} className="openapi-schema-description"/>) : null}
-            <OpenAPIDisclosure icon={context.icons.plus} label={function (isExpanded) { return getDisclosureLabel({ schema: schema, isExpanded: isExpanded, context: context }); }}>
-                {(properties === null || properties === void 0 ? void 0 : properties.length) ? (<OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>) : (<OpenAPISchemaProperty property={{ schema: schema }} circularRefs={circularRefs} context={context}/>)}
-            </OpenAPIDisclosure>
-        </>);
+    return (properties === null || properties === void 0 ? void 0 : properties.length) ? (<OpenAPIDisclosure icon={context.icons.plus} header={<OpenAPISchemaPresentation property={{ schema: schema }} context={context}/>} label={function (isExpanded) { return getDisclosureLabel({ schema: schema, isExpanded: isExpanded, context: context }); }}>
+            <OpenAPISchemaProperties properties={properties} circularRefs={circularRefs} context={context}/>
+        </OpenAPIDisclosure>) : (<OpenAPISchemaProperty property={{ schema: schema }} circularRefs={circularRefs} context={context}/>);
+}
+function OpenAPISchemaAlternativeSeparator(props) {
+    var _a, _b, _c;
+    var schema = props.schema, context = props.context;
+    var anyOf = schema.anyOf || ((_a = schema.items) === null || _a === void 0 ? void 0 : _a.anyOf);
+    var oneOf = schema.oneOf || ((_b = schema.items) === null || _b === void 0 ? void 0 : _b.oneOf);
+    var allOf = schema.allOf || ((_c = schema.items) === null || _c === void 0 ? void 0 : _c.allOf);
+    if (!anyOf && !oneOf && !allOf) {
+        return null;
+    }
+    return (<span className="openapi-schema-alternative-separator">
+            {(anyOf || oneOf) && tString(context.translation, 'or')}
+            {allOf && tString(context.translation, 'and')}
+        </span>);
 }
 /**
  * Render a circular reference to a schema.
@@ -161,7 +191,7 @@ function OpenAPISchemaEnum(props) {
         return null;
     }
     return (<span className="openapi-schema-enum">
-            Available options:{' '}
+            {tString(context.translation, 'possible_values')}:{' '}
             {enumValues.map(function (item, index) { return (<span key={index} className="openapi-schema-enum-value">
                     <OpenAPICopyButton value={item.value} label={item.description} withTooltip={!!item.description} context={context}>
                         <code>{"".concat(item.value)}</code>
@@ -172,7 +202,7 @@ function OpenAPISchemaEnum(props) {
 /**
  * Render the top row of a schema. e.g: name, type, and required status.
  */
-function OpenAPISchemaPresentation(props) {
+export function OpenAPISchemaPresentation(props) {
     var _a = props.property, schema = _a.schema, propertyName = _a.propertyName, required = _a.required, context = props.context;
     var description = resolveDescription(schema);
     var example = resolveFirstExample(schema);
@@ -255,6 +285,11 @@ function getSchemaProperties(schema) {
  */
 export function getSchemaAlternatives(schema, ancestors) {
     if (ancestors === void 0) { ancestors = new Set(); }
+    // Search for alternatives in the items property if it exists
+    if (schema.items &&
+        ('oneOf' in schema.items || 'allOf' in schema.items || 'anyOf' in schema.items)) {
+        return getSchemaAlternatives(schema.items, ancestors);
+    }
     var alternatives = (function () {
         if (schema.anyOf) {
             return ['anyOf', schema.anyOf];
@@ -332,6 +367,8 @@ function mergeAlternatives(alternativeType, schemasOrRefs) {
     }
 }
 function flattenAlternatives(alternativeType, schemasOrRefs, ancestors) {
+    // Get the parent schema's required fields from the most recent ancestor
+    var latestAncestor = Array.from(ancestors).pop();
     return schemasOrRefs.reduce(function (acc, schemaOrRef) {
         if (checkIsReference(schemaOrRef)) {
             return acc;
@@ -339,14 +376,28 @@ function flattenAlternatives(alternativeType, schemasOrRefs, ancestors) {
         if (schemaOrRef[alternativeType] && !ancestors.has(schemaOrRef)) {
             var schemas = getSchemaAlternatives(schemaOrRef, ancestors);
             if (schemas) {
-                acc.push.apply(acc, schemas);
+                acc.push.apply(acc, schemas.map(function (schema) { return (__assign(__assign({}, schema), { required: mergeRequiredFields(schema, latestAncestor) })); }));
             }
             return acc;
         }
-        acc.push(schemaOrRef);
+        // For direct schemas, handle required fields
+        var schema = __assign(__assign({}, schemaOrRef), { required: mergeRequiredFields(schemaOrRef, latestAncestor) });
+        acc.push(schema);
         return acc;
     }, []);
 }
+/**
+ * Merge the required fields of a schema with the required fields of its latest ancestor.
+ */
+function mergeRequiredFields(schemaOrRef, latestAncestor) {
+    if (!schemaOrRef.required && !(latestAncestor === null || latestAncestor === void 0 ? void 0 : latestAncestor.required)) {
+        return undefined;
+    }
+    if (checkIsReference(schemaOrRef)) {
+        return latestAncestor === null || latestAncestor === void 0 ? void 0 : latestAncestor.required;
+    }
+    return Array.from(new Set(__spreadArray(__spreadArray([], ((latestAncestor === null || latestAncestor === void 0 ? void 0 : latestAncestor.required) || []), true), (schemaOrRef.required || []), true)));
+}
 function getSchemaTitle(schema) {
     var _a;
     // Otherwise try to infer a nice title
@@ -366,6 +417,10 @@ function getSchemaTitle(schema) {
         if (schema.format) {
             type += " \u00B7 ".concat(schema.format);
         }
+        // Only add the title if it's an object (no need for the title of a string, number, etc.)
+        if (type === 'object' && schema.title) {
+            type += " \u00B7 ".concat(schema.title.replaceAll(' ', ''));
+        }
     }
     if ('anyOf' in schema) {
         type = 'any of';
@@ -381,24 +436,3 @@ function getSchemaTitle(schema) {
     }
     return type;
 }
-function getDisclosureLabel(props) {
-    var _a, _b;
-    var schema = props.schema, isExpanded = props.isExpanded, context = props.context;
-    var label;
-    if (schema.type === 'array' && !!schema.items) {
-        if (schema.items.oneOf) {
-            label = tString(context.translation, 'available_items').toLowerCase();
-        }
-        // Fallback to "child attributes" for enums and objects
-        else if (schema.items.enum || schema.items.type === 'object') {
-            label = tString(context.translation, 'child_attributes').toLowerCase();
-        }
-        else {
-            label = (_b = (_a = schema.items.title) !== null && _a !== void 0 ? _a : schema.title) !== null && _b !== void 0 ? _b : getSchemaTitle(schema.items);
-        }
-    }
-    else {
-        label = schema.title || tString(context.translation, 'child_attributes').toLowerCase();
-    }
-    return "".concat(isExpanded ? tString(context.translation, 'hide') : tString(context.translation, 'show'), " ").concat(label);
-}

package/dist/OpenAPISchemaName.d.ts

@@ -4,7 +4,7 @@ import type { OpenAPIClientContext } from './context';
 interface OpenAPISchemaNameProps {
     schema?: OpenAPIV3.SchemaObject;
     propertyName?: string | React.JSX.Element;
-    required?: boolean;
+    required?: boolean | null;
     type?: string;
     context: OpenAPIClientContext;
 }

package/dist/OpenAPISchemaName.jsx

@@ -20,7 +20,7 @@ export function OpenAPISchemaName(props) {
             {(schema === null || schema === void 0 ? void 0 : schema.writeOnly) ? (<span className="openapi-schema-writeonly">
                     {t(context.translation, 'write_only')}
                 </span>) : null}
-            {required ? (<span className="openapi-schema-required">
+            {required === null ? null : required ? (<span className="openapi-schema-required">
                     {t(context.translation, 'required')}
                 </span>) : (<span className="openapi-schema-optional">
                     {t(context.translation, 'optional')}

package/dist/StaticSection.jsx

@@ -4,7 +4,7 @@ export function Section(props) {
     return <div {...props} className={clsx('openapi-section', props.className)}/>;
 }
 export function SectionHeader(props) {
-    return (<div {...props} className={clsx('openapi-section-header', props.className && "".concat(props.className, "-header"))}/>);
+    return (<div {...props} className={clsx('openapi-section-header', props.className ? "".concat(props.className, "-header") : undefined)}/>);
 }
 export function SectionHeaderContent(props) {
     return (<div {...props} className={clsx('openapi-section-header-content', props.className && "".concat(props.className, "-header-content"))}/>);

package/dist/code-samples.js

@@ -16,7 +16,7 @@ export var codeSampleGenerators = [
     {
         id: 'http',
         label: 'HTTP',
-        syntax: 'bash',
+        syntax: 'http',
         generate: function (_a) {
             var method = _a.method, url = _a.url, _b = _a.headers, headers = _b === void 0 ? {} : _b, body = _a.body;
             var _c = parseHostAndPath(url), host = _c.host, path = _c.path;
@@ -340,12 +340,15 @@ var BodyGenerators = {
                         return '$$__TRUE__$$';
                     case false:
                         return '$$__FALSE__$$';
+                    case null:
+                        return '$$__NULL__$$';
                     default:
                         return value;
                 }
             })
                 .replaceAll('"$$__TRUE__$$"', 'True')
-                .replaceAll('"$$__FALSE__$$"', 'False');
+                .replaceAll('"$$__FALSE__$$"', 'False')
+                .replaceAll('"$$__NULL__$$"', 'None');
         }
         return { body: body, code: code, headers: headers };
     },

package/dist/generateSchemaExample.js

@@ -159,6 +159,11 @@ var getExampleFromSchema = function (schema, options, level, parentSchema, name,
     if (schema.example !== undefined) {
         return cache(schema, schema.example);
     }
+    // Use a default value, if there’s one and it’s a string or number
+    if (schema.default !== undefined &&
+        ['string', 'number', 'boolean'].includes(typeof schema.default)) {
+        return cache(schema, schema.default);
+    }
     // enum: [ 'available', 'pending', 'sold' ]
     if (Array.isArray(schema.enum) && schema.enum.length > 0) {
         return cache(schema, schema.enum[0]);

package/dist/getDisclosureLabel.d.ts

@@ -0,0 +1,7 @@
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import type { OpenAPIClientContext } from './context';
+export declare function getDisclosureLabel(props: {
+    schema: OpenAPIV3.SchemaObject;
+    isExpanded: boolean;
+    context: OpenAPIClientContext;
+}): string;

package/dist/getDisclosureLabel.js

@@ -0,0 +1,18 @@
+'use client';
+import { tString } from './translate';
+export function getDisclosureLabel(props) {
+    var schema = props.schema, isExpanded = props.isExpanded, context = props.context;
+    var label;
+    if (schema.type === 'array' && !!schema.items) {
+        if (schema.items.oneOf) {
+            label = tString(context.translation, 'available_items').toLowerCase();
+        }
+        else {
+            label = tString(context.translation, 'properties').toLowerCase();
+        }
+    }
+    else {
+        label = tString(context.translation, 'properties').toLowerCase();
+    }
+    return tString(context.translation, isExpanded ? 'hide' : 'show', label);
+}

package/dist/schemas/OpenAPISchemaItem.d.ts

@@ -0,0 +1,7 @@
+import type { OpenAPIV3 } from '@gitbook/openapi-parser';
+import type { OpenAPIClientContext } from '../context';
+export declare function OpenAPISchemaItem(props: {
+    name: string;
+    schema: OpenAPIV3.SchemaObject;
+    context: OpenAPIClientContext;
+}): import("react").JSX.Element;

package/dist/schemas/OpenAPISchemaItem.jsx

@@ -0,0 +1,16 @@
+'use client';
+import { SectionBody } from '../StaticSection';
+import { OpenAPIDisclosure } from '../OpenAPIDisclosure';
+import { OpenAPIRootSchema } from '../OpenAPISchemaServer';
+import { Section } from '../StaticSection';
+import { getDisclosureLabel } from '../getDisclosureLabel';
+export function OpenAPISchemaItem(props) {
+    var schema = props.schema, context = props.context, name = props.name;
+    return (<OpenAPIDisclosure className="openapi-schemas-disclosure" key={name} icon={context.icons.plus} header={name} label={function (isExpanded) { return getDisclosureLabel({ schema: schema, isExpanded: isExpanded, context: context }); }}>
+            <Section className="openapi-section-schemas">
+                <SectionBody>
+                    <OpenAPIRootSchema schema={schema} context={context}/>
+                </SectionBody>
+            </Section>
+        </OpenAPIDisclosure>);
+}

package/dist/schemas/OpenAPISchemas.jsx

@@ -1,11 +1,11 @@
 import clsx from 'clsx';
-import { OpenAPIDisclosure } from '../OpenAPIDisclosure';
 import { OpenAPIExample } from '../OpenAPIExample';
 import { OpenAPIRootSchema } from '../OpenAPISchemaServer';
-import { Section, SectionBody, StaticSection } from '../StaticSection';
+import { StaticSection } from '../StaticSection';
 import { getOpenAPIClientContext, resolveOpenAPIContext, } from '../context';
 import { t } from '../translate';
 import { getExampleFromSchema } from '../util/example';
+import { OpenAPISchemaItem } from './OpenAPISchemaItem';
 /**
  * OpenAPI Schemas component.
  */
@@ -53,13 +53,7 @@ export function OpenAPISchemas(props) {
     return (<div className={clsx('openapi-schemas', className)}>
             {schemas.map(function (_a) {
             var name = _a.name, schema = _a.schema;
-            return (<OpenAPIDisclosure className="openapi-schemas-disclosure" key={name} icon={context.icons.chevronRight} label={name}>
-                        <Section className="openapi-section-schemas">
-                            <SectionBody>
-                                <OpenAPIRootSchema schema={schema} context={clientContext}/>
-                            </SectionBody>
-                        </Section>
-                    </OpenAPIDisclosure>);
+            return (<OpenAPISchemaItem key={name} name={name} context={clientContext} schema={schema}/>);
         })}
         </div>);
 }