docusaurus-theme-openapi-docs 4.3.7 → 4.5.0

package/lib/theme/ParamsItem/index.js

@@ -44,9 +44,12 @@ function ParamsItem({ param, ...rest }) {
   } = param;
   let schema = param.schema;
   let defaultValue;
-  if (!schema || !schema?.type) {
+  if (!schema) {
     schema = { type: "any" };
   }
+  if (!schema.type) {
+    schema.type = "any";
+  }
   if (schema) {
     if (schema.items) {
       defaultValue = schema.items.default;

package/lib/theme/ResponseExamples/index.js

@@ -17,8 +17,8 @@ exports.ExampleFromSchema =
     void 0;
 exports.json2xml = json2xml;
 const react_1 = __importDefault(require("react"));
+const CodeSamples_1 = __importDefault(require("@theme/CodeSamples"));
 const Markdown_1 = __importDefault(require("@theme/Markdown"));
-const ResponseSamples_1 = __importDefault(require("@theme/ResponseSamples"));
 const TabItem_1 = __importDefault(require("@theme/TabItem"));
 const createResponseExample_1 = require("docusaurus-plugin-openapi-docs/lib/openapi/createResponseExample");
 const xml_formatter_1 = __importDefault(require("xml-formatter"));
@@ -80,8 +80,8 @@ const ResponseExamples = ({ responseExamples, mimeType }) => {
               { className: "openapi-example__summary" },
               exampleValue.summary
             ),
-          react_1.default.createElement(ResponseSamples_1.default, {
-            responseExample: responseExample,
+          react_1.default.createElement(CodeSamples_1.default, {
+            example: responseExample,
             language: language,
           })
         )
@@ -114,8 +114,8 @@ const ResponseExample = ({ responseExample, mimeType }) => {
           { className: "openapi-example__summary" },
           responseExample.summary
         ),
-      react_1.default.createElement(ResponseSamples_1.default, {
-        responseExample: exampleContent,
+      react_1.default.createElement(CodeSamples_1.default, {
+        example: exampleContent,
         language: language,
       })
     )
@@ -164,8 +164,8 @@ const ExampleFromSchema = ({ schema, mimeType }) => {
         react_1.default.createElement(
           TabItem_1.default,
           { label: "Example (auto)", value: "Example (auto)" },
-          react_1.default.createElement(ResponseSamples_1.default, {
-            responseExample: xmlExample,
+          react_1.default.createElement(CodeSamples_1.default, {
+            example: xmlExample,
             language: "xml",
           })
         )
@@ -181,8 +181,8 @@ const ExampleFromSchema = ({ schema, mimeType }) => {
       react_1.default.createElement(
         TabItem_1.default,
         { label: "Example (auto)", value: "Example (auto)" },
-        react_1.default.createElement(ResponseSamples_1.default, {
-          responseExample: JSON.stringify(responseExample, null, 2),
+        react_1.default.createElement(CodeSamples_1.default, {
+          example: JSON.stringify(responseExample, null, 2),
           language: "json",
         })
       )

package/lib/theme/Schema/index.js

@@ -108,15 +108,13 @@ const AnyOneOf = ({ schema, schemaType }) => {
       SchemaTabs_1.default,
       null,
       schema[type]?.map((anyOneSchema, index) => {
-        const label = anyOneSchema.title || `MOD${index + 1}`;
+        const label = anyOneSchema.title || anyOneSchema.type;
         return (
           // @ts-ignore
           react_1.default.createElement(
             TabItem_1.default,
             { key: index, label: label, value: `${index}-item-properties` },
-            ["string", "number", "integer", "boolean"].includes(
-              anyOneSchema.type
-            ) &&
+            (isPrimitive(anyOneSchema) || anyOneSchema.const) &&
               react_1.default.createElement(SchemaItem_1.default, {
                 collapsible: false,
                 name: undefined,
@@ -344,7 +342,8 @@ const DiscriminatorNode = ({ discriminator, schema, schemaType }) => {
       mergedSubSchema = mergeAllOf(subSchema);
     }
     const subProperties = subSchema.properties || mergedSubSchema.properties;
-    if (subProperties[discriminator.propertyName]) {
+    // Add a safeguard check to avoid referencing subProperties if it's undefined
+    if (subProperties && subProperties[discriminator.propertyName]) {
       if (schema.properties) {
         schema.properties[discriminator.propertyName] = {
           ...schema.properties[discriminator.propertyName],
@@ -482,111 +481,45 @@ const SchemaNodeDetails = ({
   );
 };
 const Items = ({ schema, schemaType }) => {
-  // Handles case when schema.items has properties
-  if (schema.items?.properties) {
-    return react_1.default.createElement(
-      react_1.default.Fragment,
-      null,
-      react_1.default.createElement(ArrayBrackets_1.OpeningArrayBracket, null),
-      react_1.default.createElement(Properties, {
-        schema: schema.items,
-        schemaType: schemaType,
-      }),
-      react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-    );
-  }
-  // Handles case when schema.items has additionalProperties
-  if (schema.items?.additionalProperties) {
-    return react_1.default.createElement(
-      react_1.default.Fragment,
-      null,
-      react_1.default.createElement(ArrayBrackets_1.OpeningArrayBracket, null),
-      react_1.default.createElement(AdditionalProperties, {
-        schema: schema.items,
-        schemaType: schemaType,
-      }),
-      react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-    );
+  // Process schema.items to handle allOf merging
+  let itemsSchema = schema.items;
+  if (schema.items?.allOf) {
+    itemsSchema = mergeAllOf(schema.items);
   }
-  // Handles case when schema.items has oneOf or anyOf
-  if (schema.items?.oneOf || schema.items?.anyOf) {
+  // Handle complex schemas with multiple schema types
+  const hasOneOfAnyOf = itemsSchema?.oneOf || itemsSchema?.anyOf;
+  const hasProperties = itemsSchema?.properties;
+  const hasAdditionalProperties = itemsSchema?.additionalProperties;
+  if (hasOneOfAnyOf || hasProperties || hasAdditionalProperties) {
     return react_1.default.createElement(
       react_1.default.Fragment,
       null,
       react_1.default.createElement(ArrayBrackets_1.OpeningArrayBracket, null),
-      react_1.default.createElement(AnyOneOf, {
-        schema: schema.items,
-        schemaType: schemaType,
-      }),
-      react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-    );
-  }
-  // Handles case when schema.items has allOf
-  if (schema.items?.allOf) {
-    const mergedSchemas = mergeAllOf(schema.items);
-    // Handles combo anyOf/oneOf + properties
-    if (
-      (mergedSchemas.oneOf || mergedSchemas.anyOf) &&
-      mergedSchemas.properties
-    ) {
-      return react_1.default.createElement(
-        react_1.default.Fragment,
-        null,
-        react_1.default.createElement(
-          ArrayBrackets_1.OpeningArrayBracket,
-          null
-        ),
+      hasOneOfAnyOf &&
         react_1.default.createElement(AnyOneOf, {
-          schema: mergedSchemas,
+          schema: itemsSchema,
           schemaType: schemaType,
         }),
+      hasProperties &&
         react_1.default.createElement(Properties, {
-          schema: mergedSchemas,
+          schema: itemsSchema,
           schemaType: schemaType,
         }),
-        react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-      );
-    }
-    // Handles only anyOf/oneOf
-    if (mergedSchemas.oneOf || mergedSchemas.anyOf) {
-      return react_1.default.createElement(
-        react_1.default.Fragment,
-        null,
-        react_1.default.createElement(
-          ArrayBrackets_1.OpeningArrayBracket,
-          null
-        ),
-        react_1.default.createElement(AnyOneOf, {
-          schema: mergedSchemas,
+      hasAdditionalProperties &&
+        react_1.default.createElement(AdditionalProperties, {
+          schema: itemsSchema,
           schemaType: schemaType,
         }),
-        react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-      );
-    }
-    // Handles properties
-    if (mergedSchemas.properties) {
-      return react_1.default.createElement(
-        react_1.default.Fragment,
-        null,
-        react_1.default.createElement(
-          ArrayBrackets_1.OpeningArrayBracket,
-          null
-        ),
-        react_1.default.createElement(Properties, {
-          schema: mergedSchemas,
-          schemaType: schemaType,
-        }),
-        react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
-      );
-    }
+      react_1.default.createElement(ArrayBrackets_1.ClosingArrayBracket, null)
+    );
   }
   // Handles basic types (string, number, integer, boolean, object)
   if (
-    schema.items?.type === "string" ||
-    schema.items?.type === "number" ||
-    schema.items?.type === "integer" ||
-    schema.items?.type === "boolean" ||
-    schema.items?.type === "object"
+    itemsSchema?.type === "string" ||
+    itemsSchema?.type === "number" ||
+    itemsSchema?.type === "integer" ||
+    itemsSchema?.type === "boolean" ||
+    itemsSchema?.type === "object"
   ) {
     return react_1.default.createElement(
       "div",
@@ -595,9 +528,9 @@ const Items = ({ schema, schemaType }) => {
       react_1.default.createElement(SchemaItem_1.default, {
         collapsible: false,
         name: "", // No name for array items
-        schemaName: (0, schema_1.getSchemaName)(schema.items),
-        qualifierMessage: (0, schema_1.getQualifierMessage)(schema.items),
-        schema: schema.items,
+        schemaName: (0, schema_1.getSchemaName)(itemsSchema),
+        qualifierMessage: (0, schema_1.getQualifierMessage)(itemsSchema),
+        schema: itemsSchema,
         discriminator: false,
         children: null,
       }),
@@ -609,7 +542,7 @@ const Items = ({ schema, schemaType }) => {
     react_1.default.Fragment,
     null,
     react_1.default.createElement(ArrayBrackets_1.OpeningArrayBracket, null),
-    Object.entries(schema.items || {}).map(([key, val]) =>
+    Object.entries(itemsSchema || {}).map(([key, val]) =>
       react_1.default.createElement(SchemaEdge, {
         key: key,
         name: key,
@@ -777,6 +710,37 @@ const SchemaEdge = ({ name, schema, required, discriminator, schemaType }) => {
     children: null,
   });
 };
+function renderChildren(schema, schemaType) {
+  return react_1.default.createElement(
+    react_1.default.Fragment,
+    null,
+    schema.oneOf &&
+      react_1.default.createElement(AnyOneOf, {
+        schema: schema,
+        schemaType: schemaType,
+      }),
+    schema.anyOf &&
+      react_1.default.createElement(AnyOneOf, {
+        schema: schema,
+        schemaType: schemaType,
+      }),
+    schema.properties &&
+      react_1.default.createElement(Properties, {
+        schema: schema,
+        schemaType: schemaType,
+      }),
+    schema.additionalProperties &&
+      react_1.default.createElement(AdditionalProperties, {
+        schema: schema,
+        schemaType: schemaType,
+      }),
+    schema.items &&
+      react_1.default.createElement(Items, {
+        schema: schema,
+        schemaType: schemaType,
+      })
+  );
+}
 const SchemaNode = ({ schema, schemaType }) => {
   if (
     (schemaType === "request" && schema.readOnly) ||
@@ -826,12 +790,6 @@ const SchemaNode = ({ schema, schemaType }) => {
         })
     );
   }
-  if (schema.oneOf || schema.anyOf) {
-    return react_1.default.createElement(AnyOneOf, {
-      schema: schema,
-      schemaType: schemaType,
-    });
-  }
   // Handle primitives
   if (
     schema.type &&
@@ -854,34 +812,16 @@ const SchemaNode = ({ schema, schemaType }) => {
       children: null,
     });
   }
-  return react_1.default.createElement(
-    "div",
-    null,
-    schema.oneOf &&
-      react_1.default.createElement(AnyOneOf, {
-        schema: schema,
-        schemaType: schemaType,
-      }),
-    schema.anyOf &&
-      react_1.default.createElement(AnyOneOf, {
-        schema: schema,
-        schemaType: schemaType,
-      }),
-    schema.properties &&
-      react_1.default.createElement(Properties, {
-        schema: schema,
-        schemaType: schemaType,
-      }),
-    schema.additionalProperties &&
-      react_1.default.createElement(AdditionalProperties, {
-        schema: schema,
-        schemaType: schemaType,
-      }),
-    schema.items &&
-      react_1.default.createElement(Items, {
-        schema: schema,
-        schemaType: schemaType,
-      })
-  );
+  return renderChildren(schema, schemaType);
 };
 exports.default = SchemaNode;
+const PRIMITIVE_TYPES = {
+  string: true,
+  number: true,
+  integer: true,
+  boolean: true,
+  null: true,
+};
+const isPrimitive = (schema) => {
+  return PRIMITIVE_TYPES[schema.type];
+};

package/lib/theme/SchemaItem/index.js

@@ -51,6 +51,7 @@ function SchemaItem(props) {
   let example;
   let nullable;
   let enumDescriptions = [];
+  let constValue;
   if (schema) {
     deprecated = schema.deprecated;
     schemaDescription = schema.description;
@@ -60,6 +61,7 @@ function SchemaItem(props) {
     nullable =
       schema.nullable ||
       (Array.isArray(schema.type) && schema.type.includes("null")); // support JSON Schema nullable
+    constValue = schema.const;
   }
   const renderRequired = (0, utils_1.guard)(
     Array.isArray(required) ? required.includes(name) : required,
@@ -170,6 +172,37 @@ function SchemaItem(props) {
     }
     return undefined;
   }
+  function renderConstValue() {
+    if (constValue !== undefined) {
+      if (typeof constValue === "string") {
+        return react_1.default.createElement(
+          "div",
+          null,
+          react_1.default.createElement("strong", null, "Constant value: "),
+          react_1.default.createElement(
+            "span",
+            null,
+            react_1.default.createElement("code", null, constValue)
+          )
+        );
+      }
+      return react_1.default.createElement(
+        "div",
+        null,
+        react_1.default.createElement("strong", null, "Constant value: "),
+        react_1.default.createElement(
+          "span",
+          null,
+          react_1.default.createElement(
+            "code",
+            null,
+            JSON.stringify(constValue)
+          )
+        )
+      );
+    }
+    return undefined;
+  }
   const schemaContent = react_1.default.createElement(
     "div",
     null,
@@ -201,6 +234,7 @@ function SchemaItem(props) {
     renderSchemaDescription,
     renderEnumDescriptions,
     renderQualifierMessage,
+    renderConstValue(),
     renderDefaultValue(),
     renderExample(),
     collapsibleSchemaContent ?? collapsibleSchemaContent

package/lib/theme/styles.scss

@@ -38,7 +38,7 @@
 @use "./SchemaTabs/SchemaTabs";
 @use "./OperationTabs/OperationTabs";
 /* Code Samples */
-@use "./ResponseSamples/ResponseSamples";
+@use "./CodeSamples/CodeSamples";
 /* Markdown Styling */
 @use "./Markdown/Details/Details";
 

package/lib/types.d.ts

@@ -1,4 +1,4 @@
-import type { FrontMatterTag } from "@docusaurus/utils";
+import type { DocFrontMatter as DocusaurusDocFrontMatter } from "@docusaurus/plugin-content-docs";
 import type { JSONSchema4, JSONSchema6, JSONSchema7 } from "json-schema";
 export interface ThemeConfig {
     api?: {
@@ -6,9 +6,6 @@ export interface ThemeConfig {
         authPersistance?: false | "localStorage" | "sessionStorage";
     };
 }
-interface Map<T> {
-    [key: string]: T;
-}
 export type JSONSchema = JSONSchema4 | JSONSchema6 | JSONSchema7;
 export type SchemaObject = Omit<JSONSchema, "type" | "allOf" | "oneOf" | "anyOf" | "not" | "items" | "properties" | "additionalProperties"> & {
     type?: "string" | "number" | "integer" | "boolean" | "object" | "array";
@@ -17,7 +14,7 @@ export type SchemaObject = Omit<JSONSchema, "type" | "allOf" | "oneOf" | "anyOf"
     anyOf?: SchemaObject[];
     not?: SchemaObject;
     items?: SchemaObject;
-    properties?: Map<SchemaObject>;
+    properties?: Record<string, SchemaObject>;
     additionalProperties?: boolean | SchemaObject;
     nullable?: boolean;
     discriminator?: DiscriminatorObject;
@@ -30,7 +27,7 @@ export type SchemaObject = Omit<JSONSchema, "type" | "allOf" | "oneOf" | "anyOf"
 };
 export interface DiscriminatorObject {
     propertyName: string;
-    mapping?: Map<string>;
+    mapping?: Record<string, string>;
 }
 export interface XMLObject {
     name?: string;
@@ -43,115 +40,7 @@ export interface ExternalDocumentationObject {
     description?: string;
     url: string;
 }
-export type FileChange = {
-    author?: string;
-    /** Date can be any
-     * [parsable date string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse).
-     */
-    date?: Date | string;
-};
-export type DocFrontMatter = {
-    /**
-     * The last part of the doc ID (will be refactored in the future to be the
-     * full ID instead)
-     * @see {@link DocMetadata.id}
-     */
-    id?: string;
-    /**
-     * Will override the default title collected from h1 heading.
-     * @see {@link DocMetadata.title}
-     */
-    title?: string;
-    /**
-     * Front matter tags, unnormalized.
-     * @see {@link DocMetadata.tags}
-     */
-    tags?: FrontMatterTag[];
-    /**
-     * If there isn't a Markdown h1 heading (which, if there is, we don't
-     * remove), this front matter will cause the front matter title to not be
-     * displayed in the doc page.
-     */
-    hide_title?: boolean;
-    /** Hide the TOC on the right. */
-    hide_table_of_contents?: boolean;
-    /** Used in the head meta. */
-    keywords?: string[];
-    /** Used in the head meta. Should use `assets.image` in priority. */
-    image?: string;
-    /**
-     * Will override the default excerpt.
-     * @see {@link DocMetadata.description}
-     */
-    description?: string;
-    /**
-     * Custom slug appended after /<baseUrl>/<routeBasePath>/<versionPath>
-     * @see {@link DocMetadata.slug}
-     */
-    slug?: string;
-    /** Customizes the sidebar label for this doc. Will default to its title. */
-    sidebar_label?: string;
-    /**
-     * Controls the position of a doc inside the generated sidebar slice when
-     * using autogenerated sidebar items.
-     *
-     * @see https://docusaurus.io/docs/sidebar#autogenerated-sidebar-metadata
-     */
-    sidebar_position?: number;
-    /**
-     * Gives the corresponding sidebar label a special class name when using
-     * autogenerated sidebars.
-     */
-    sidebar_class_name?: string;
-    /**
-     * Will be propagated to the final sidebars data structure. Useful if you
-     * have swizzled sidebar-related code or simply querying doc data through
-     * sidebars.
-     */
-    sidebar_custom_props?: {
-        [key: string]: unknown;
-    };
-    /**
-     * Changes the sidebar association of the current doc. Use `null` to make
-     * the current doc not associated to any sidebar.
-     */
-    displayed_sidebar?: string | null;
-    /**
-     * Customizes the pagination label for this doc. Will default to the sidebar
-     * label.
-     */
-    pagination_label?: string;
-    /** Overrides the default URL computed for this doc. */
-    custom_edit_url?: string | null;
-    /**
-     * Whether number prefix parsing is disabled on this doc.
-     * @see https://docusaurus.io/docs/sidebar#using-number-prefixes
-     */
-    parse_number_prefixes?: boolean;
-    /**
-     * Minimum TOC heading level. Must be between 2 and 6 and lower or equal to
-     * the max value.
-     */
-    toc_min_heading_level?: number;
-    /** Maximum TOC heading level. Must be between 2 and 6. */
-    toc_max_heading_level?: number;
-    /**
-     * The ID of the documentation you want the "Next" pagination to link to.
-     * Use `null` to disable showing "Next" for this page.
-     * @see {@link DocMetadata.next}
-     */
-    pagination_next?: string | null;
-    /**
-     * The ID of the documentation you want the "Previous" pagination to link
-     * to. Use `null` to disable showing "Previous" for this page.
-     * @see {@link DocMetadata.prev}
-     */
-    pagination_prev?: string | null;
-    /** Should this doc be excluded from production builds? */
-    draft?: boolean;
-    /** Allows overriding the last updated author and/or date. */
-    last_update?: FileChange;
+export interface DocFrontMatter extends DocusaurusDocFrontMatter {
     /** Provides OpenAPI Docs with a reference path to their respective Info Doc */
     info_path?: string;
-};
-export {};
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "docusaurus-theme-openapi-docs",
   "description": "OpenAPI theme for Docusaurus.",
-  "version": "4.3.7",
+  "version": "4.5.0",
   "license": "MIT",
   "keywords": [
     "openapi",
@@ -35,8 +35,10 @@
     "@types/file-saver": "^2.0.5",
     "@types/lodash": "^4.14.176",
     "@types/pako": "^2.0.3",
+    "@types/postman-collection": "^3.5.11",
+    "@types/react-modal": "^3.16.3",
     "concurrently": "^5.2.0",
-    "docusaurus-plugin-openapi-docs": "^4.3.7",
+    "docusaurus-plugin-openapi-docs": "^4.5.0",
     "docusaurus-plugin-sass": "^0.2.3",
     "eslint-plugin-prettier": "^5.0.1"
   },
@@ -79,5 +81,5 @@
   "engines": {
     "node": ">=14"
   },
-  "gitHead": "e4d3ec4ebfb8415e97951076ce2f0901e8d88168"
+  "gitHead": "cb0ed6e02d7a963d51073e2bfd78d944fbb7ee34"
 }

package/src/theme/ApiExplorer/ApiCodeBlock/Content/String.tsx

@@ -96,7 +96,7 @@ export default function CodeBlockString({
                     getLineProps={getLineProps}
                     getTokenProps={getTokenProps}
                     classNames={lineClassNames[i]}
-                    showLineNumbers={showLineNumbers}
+                    showLineNumbers={!!showLineNumbers}
                   />
                 ))}
               </code>
@@ -122,9 +122,9 @@ export default function CodeBlockString({
             )}
             code={code}
             language={(language ?? "text") as Language}
-            showLineNumbers={showLineNumbers}
+            showLineNumbers={!!showLineNumbers}
             blockClassName={blockClassName}
-            title={title}
+            title={typeof title === "string" ? title : undefined}
             lineClassNames={lineClassNames}
           />
         </div>

package/src/theme/ApiExplorer/ApiCodeBlock/CopyButton/index.tsx

@@ -7,11 +7,15 @@
 
 import React, { useCallback, useState, useRef, useEffect } from "react";
 
-import { CopyButtonProps } from "@docusaurus/theme-common/internal";
 import { translate } from "@docusaurus/Translate";
 import clsx from "clsx";
 import copy from "copy-text-to-clipboard";
 
+interface CopyButtonProps {
+  code: string;
+  className?: string;
+}
+
 export default function CopyButton({
   code,
   className,

package/src/theme/ApiExplorer/Body/index.tsx

@@ -237,8 +237,7 @@ function Body({
         try {
           // If the value is already valid JSON we shouldn't double encode the value
           JSON.parse(example.value);
-        }
-        catch (e) {
+        } catch (e) {
           body = JSON.stringify(example.value, null, 2);
         }
 

package/src/theme/ApiExplorer/CodeSnippets/index.tsx

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  * ========================================================================== */
 
-import React, { useState, useEffect, type JSX } from "react";
+import React, { useState, useEffect } from "react";
 
 import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
 import ApiCodeBlock from "@theme/ApiExplorer/ApiCodeBlock";
@@ -14,7 +14,7 @@ import CodeTabs from "@theme/ApiExplorer/CodeTabs";
 import { useTypedSelector } from "@theme/ApiItem/hooks";
 import cloneDeep from "lodash/cloneDeep";
 import codegen from "postman-code-generators";
-import sdk from "postman-collection";
+import * as sdk from "postman-collection";
 
 import { CodeSample, Language } from "./code-snippets-types";
 import {
@@ -31,7 +31,7 @@ export interface Props {
   codeSamples: CodeSample[];
 }
 
-function CodeTab({ children, hidden, className }: any): JSX.Element {
+function CodeTab({ children, hidden, className }: any): React.JSX.Element {
   return (
     <div role="tabpanel" className={className} {...{ hidden }}>
       {children}