eddev 2.0.0-beta.54 → 2.0.0-beta.56

package/dist/app/lib/blocks/ContentBlocks.d.ts

@@ -20,7 +20,7 @@ export type ContentBlock = {
 /**
  * Represents a block instance's position in the hierarchy via relationships with other blocks.
  */
-type BlocksContext = {
+export type BlocksContext = {
     ancestors: ContentBlock[];
     parent?: ContentBlock;
     prev?: ContentBlock;

package/dist/app/lib/blocks/ContentBlocks.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment, createContext, memo, useContext, useMemo } from "react";
 import { blockManifestReader } from "../internal/read-block-manifest.js";
-import { ErrorBoundaryFrontend } from "./ErrorBoundaryFrontend.js";
+import { BlockErrorBoundary } from "../../utils/BlockErrorBoundary.js";
 import { InlineEditingContextProvider, ReadonlyInlineEditingProvider } from "./inline-editing.js";
 import { addBlockMetadata } from "./block-utils.js";
 export const BlocksContext = createContext(undefined);
@@ -63,7 +63,7 @@ export const ContentBlocks = memo((props) => {
                 }
             }
             // Attempt to wrap the block
-            return (_jsxs(Fragment, { children: [spaceBefore, _jsx(ErrorBoundaryFrontend, { children: blockNode }), spaceAfter] }, index));
+            return (_jsxs(Fragment, { children: [spaceBefore, _jsx(BlockErrorBoundary, { block: block, blockContext: ctx, children: blockNode }), spaceAfter] }, index));
         });
     }, [blocks, props.wrapBlock, props.spacer]);
     if (env.admin) {

package/dist/app/lib/devtools/hooks/useTailwind.d.ts

@@ -908,15 +908,18 @@ export declare function useTailwindConfig(): {
             readonly size?: boolean | undefined;
             readonly backgroundColor?: boolean | undefined;
             readonly inset?: boolean | undefined;
+            readonly invert?: boolean | undefined;
+            readonly outlineOffset?: boolean | undefined;
             readonly borderRadius?: boolean | undefined;
             readonly padding?: boolean | undefined;
             readonly flex?: boolean | undefined;
             readonly blur?: boolean | undefined;
             readonly resize?: boolean | undefined;
+            readonly position?: boolean | undefined;
+            readonly columns?: boolean | undefined;
             readonly preflight?: boolean | undefined;
             readonly container?: boolean | undefined;
             readonly accessibility?: boolean | undefined;
-            readonly position?: boolean | undefined;
             readonly isolation?: boolean | undefined;
             readonly zIndex?: boolean | undefined;
             readonly gridColumn?: boolean | undefined;
@@ -956,7 +959,6 @@ export declare function useTailwindConfig(): {
             readonly listStyleType?: boolean | undefined;
             readonly listStyleImage?: boolean | undefined;
             readonly appearance?: boolean | undefined;
-            readonly columns?: boolean | undefined;
             readonly breakBefore?: boolean | undefined;
             readonly breakInside?: boolean | undefined;
             readonly breakAfter?: boolean | undefined;
@@ -1028,7 +1030,6 @@ export declare function useTailwindConfig(): {
             readonly boxShadowColor?: boolean | undefined;
             readonly outlineStyle?: boolean | undefined;
             readonly outlineWidth?: boolean | undefined;
-            readonly outlineOffset?: boolean | undefined;
             readonly outlineColor?: boolean | undefined;
             readonly ringWidth?: boolean | undefined;
             readonly ringColor?: boolean | undefined;
@@ -1040,7 +1041,6 @@ export declare function useTailwindConfig(): {
             readonly dropShadow?: boolean | undefined;
             readonly grayscale?: boolean | undefined;
             readonly hueRotate?: boolean | undefined;
-            readonly invert?: boolean | undefined;
             readonly saturate?: boolean | undefined;
             readonly sepia?: boolean | undefined;
             readonly backdropBlur?: boolean | undefined;
@@ -1953,15 +1953,18 @@ export declare function useTailwindConfig(): {
                     readonly size?: boolean | undefined;
                     readonly backgroundColor?: boolean | undefined;
                     readonly inset?: boolean | undefined;
+                    readonly invert?: boolean | undefined;
+                    readonly outlineOffset?: boolean | undefined;
                     readonly borderRadius?: boolean | undefined;
                     readonly padding?: boolean | undefined;
                     readonly flex?: boolean | undefined;
                     readonly blur?: boolean | undefined;
                     readonly resize?: boolean | undefined;
+                    readonly position?: boolean | undefined;
+                    readonly columns?: boolean | undefined;
                     readonly preflight?: boolean | undefined;
                     readonly container?: boolean | undefined;
                     readonly accessibility?: boolean | undefined;
-                    readonly position?: boolean | undefined;
                     readonly isolation?: boolean | undefined;
                     readonly zIndex?: boolean | undefined;
                     readonly gridColumn?: boolean | undefined;
@@ -2001,7 +2004,6 @@ export declare function useTailwindConfig(): {
                     readonly listStyleType?: boolean | undefined;
                     readonly listStyleImage?: boolean | undefined;
                     readonly appearance?: boolean | undefined;
-                    readonly columns?: boolean | undefined;
                     readonly breakBefore?: boolean | undefined;
                     readonly breakInside?: boolean | undefined;
                     readonly breakAfter?: boolean | undefined;
@@ -2073,7 +2075,6 @@ export declare function useTailwindConfig(): {
                     readonly boxShadowColor?: boolean | undefined;
                     readonly outlineStyle?: boolean | undefined;
                     readonly outlineWidth?: boolean | undefined;
-                    readonly outlineOffset?: boolean | undefined;
                     readonly outlineColor?: boolean | undefined;
                     readonly ringWidth?: boolean | undefined;
                     readonly ringColor?: boolean | undefined;
@@ -2085,7 +2086,6 @@ export declare function useTailwindConfig(): {
                     readonly dropShadow?: boolean | undefined;
                     readonly grayscale?: boolean | undefined;
                     readonly hueRotate?: boolean | undefined;
-                    readonly invert?: boolean | undefined;
                     readonly saturate?: boolean | undefined;
                     readonly sepia?: boolean | undefined;
                     readonly backdropBlur?: boolean | undefined;
@@ -2973,15 +2973,18 @@ export declare function useTailwindConfig(): {
         readonly size?: boolean | undefined;
         readonly backgroundColor?: boolean | undefined;
         readonly inset?: boolean | undefined;
+        readonly invert?: boolean | undefined;
+        readonly outlineOffset?: boolean | undefined;
         readonly borderRadius?: boolean | undefined;
         readonly padding?: boolean | undefined;
         readonly flex?: boolean | undefined;
         readonly blur?: boolean | undefined;
         readonly resize?: boolean | undefined;
+        readonly position?: boolean | undefined;
+        readonly columns?: boolean | undefined;
         readonly preflight?: boolean | undefined;
         readonly container?: boolean | undefined;
         readonly accessibility?: boolean | undefined;
-        readonly position?: boolean | undefined;
         readonly isolation?: boolean | undefined;
         readonly zIndex?: boolean | undefined;
         readonly gridColumn?: boolean | undefined;
@@ -3021,7 +3024,6 @@ export declare function useTailwindConfig(): {
         readonly listStyleType?: boolean | undefined;
         readonly listStyleImage?: boolean | undefined;
         readonly appearance?: boolean | undefined;
-        readonly columns?: boolean | undefined;
         readonly breakBefore?: boolean | undefined;
         readonly breakInside?: boolean | undefined;
         readonly breakAfter?: boolean | undefined;
@@ -3093,7 +3095,6 @@ export declare function useTailwindConfig(): {
         readonly boxShadowColor?: boolean | undefined;
         readonly outlineStyle?: boolean | undefined;
         readonly outlineWidth?: boolean | undefined;
-        readonly outlineOffset?: boolean | undefined;
         readonly outlineColor?: boolean | undefined;
         readonly ringWidth?: boolean | undefined;
         readonly ringColor?: boolean | undefined;
@@ -3105,7 +3106,6 @@ export declare function useTailwindConfig(): {
         readonly dropShadow?: boolean | undefined;
         readonly grayscale?: boolean | undefined;
         readonly hueRotate?: boolean | undefined;
-        readonly invert?: boolean | undefined;
         readonly saturate?: boolean | undefined;
         readonly sepia?: boolean | undefined;
         readonly backdropBlur?: boolean | undefined;
@@ -4018,15 +4018,18 @@ export declare function useTailwindConfig(): {
                 readonly size?: boolean | undefined;
                 readonly backgroundColor?: boolean | undefined;
                 readonly inset?: boolean | undefined;
+                readonly invert?: boolean | undefined;
+                readonly outlineOffset?: boolean | undefined;
                 readonly borderRadius?: boolean | undefined;
                 readonly padding?: boolean | undefined;
                 readonly flex?: boolean | undefined;
                 readonly blur?: boolean | undefined;
                 readonly resize?: boolean | undefined;
+                readonly position?: boolean | undefined;
+                readonly columns?: boolean | undefined;
                 readonly preflight?: boolean | undefined;
                 readonly container?: boolean | undefined;
                 readonly accessibility?: boolean | undefined;
-                readonly position?: boolean | undefined;
                 readonly isolation?: boolean | undefined;
                 readonly zIndex?: boolean | undefined;
                 readonly gridColumn?: boolean | undefined;
@@ -4066,7 +4069,6 @@ export declare function useTailwindConfig(): {
                 readonly listStyleType?: boolean | undefined;
                 readonly listStyleImage?: boolean | undefined;
                 readonly appearance?: boolean | undefined;
-                readonly columns?: boolean | undefined;
                 readonly breakBefore?: boolean | undefined;
                 readonly breakInside?: boolean | undefined;
                 readonly breakAfter?: boolean | undefined;
@@ -4138,7 +4140,6 @@ export declare function useTailwindConfig(): {
                 readonly boxShadowColor?: boolean | undefined;
                 readonly outlineStyle?: boolean | undefined;
                 readonly outlineWidth?: boolean | undefined;
-                readonly outlineOffset?: boolean | undefined;
                 readonly outlineColor?: boolean | undefined;
                 readonly ringWidth?: boolean | undefined;
                 readonly ringColor?: boolean | undefined;
@@ -4150,7 +4151,6 @@ export declare function useTailwindConfig(): {
                 readonly dropShadow?: boolean | undefined;
                 readonly grayscale?: boolean | undefined;
                 readonly hueRotate?: boolean | undefined;
-                readonly invert?: boolean | undefined;
                 readonly saturate?: boolean | undefined;
                 readonly sepia?: boolean | undefined;
                 readonly backdropBlur?: boolean | undefined;

package/dist/app/lib/hooks/index.d.ts

@@ -1,4 +1,4 @@
 export * from "./useAppData.js";
 export * from "./useRPC.js";
 export * from "./queryUtils.js";
-export * from "./apiConfig.js";
+export * from "../runtime/apiConfig.js";

package/dist/app/lib/hooks/index.js

@@ -1,4 +1,4 @@
 export * from "./useAppData.js";
 export * from "./useRPC.js";
 export * from "./queryUtils.js";
-export * from "./apiConfig.js";
+export * from "../runtime/apiConfig.js";

package/dist/app/lib/hooks/queryUtils.d.ts

@@ -7,10 +7,17 @@ type OptionalMaybes<T> = T extends any[] ? T : T extends {
 type MaybeVars = {
     [key: string]: any;
 } | undefined;
-export type QueryError = Error & {
+declare class QueryError extends Error {
+    name: string;
     messages: string[];
     statusCode: number;
-};
+    constructor(args: {
+        messages: string[];
+        statusCode: number;
+        type: "query" | "mutation";
+        queryName: string;
+    });
+}
 /** Regular queries */
 type CreateUseQueryOptions = {
     name: string;

package/dist/app/lib/hooks/queryUtils.js

@@ -2,12 +2,17 @@ import { useInfiniteQuery, useMutation, useQuery, } from "@tanstack/react-query"
 import { useEffect, useState } from "react";
 import { joinURL } from "ufo";
 import { getQueryClient } from "../../utils/query-client.js";
-import { apiConfig } from "./apiConfig.js";
-function createQueryError(messages, statusCode) {
-    const error = new Error(messages.join(", "));
-    error.statusCode = statusCode;
-    error.messages = messages;
-    return error;
+import { apiConfig } from "../runtime/apiConfig.js";
+class QueryError extends Error {
+    name = "QueryError";
+    messages;
+    statusCode;
+    constructor(args) {
+        const msg = args.messages.join(", ");
+        super(msg);
+        this.statusCode = args.statusCode;
+        this.messages = args.messages;
+    }
 }
 const fetchGETQuery = async (name, params, opts) => {
     let url;
@@ -34,7 +39,12 @@ const fetchGETQuery = async (name, params, opts) => {
         apiConfig.onResponse(response, "query", name, params, url, options);
     const payload = await response.json();
     if (payload.errors?.length > 0) {
-        throw createQueryError(payload.errors.map((e) => e.message), response.status);
+        throw new QueryError({
+            messages: payload.errors.map((e) => e.message),
+            statusCode: response.status,
+            queryName: name,
+            type: "query",
+        });
     }
     return payload.data;
 };
@@ -159,7 +169,12 @@ const fetchMutation = async (name, params, opts) => {
         apiConfig.onResponse(response, "mutation", name, params, url, options);
     const payload = await response.json();
     if (payload.errors?.length > 0) {
-        throw createQueryError(payload.errors.map((e) => e.message), response.status);
+        throw new QueryError({
+            messages: payload.errors.map((e) => e.message),
+            statusCode: response.status,
+            queryName: name,
+            type: "mutation",
+        });
     }
     return payload.data;
 };

package/dist/app/lib/routing/components/RouteRenderer.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo, useMemo } from "react";
+import { RouteErrorBoundary } from "../../../utils/RouteErrorBoundary.js";
 import { RouteItemContext } from "../context.js";
 import { useRouter } from "../hooks/useRouter.js";
 import { useRouterState } from "../hooks/useRouterState.js";
-import { ErrorBoundaryFrontend } from "../../blocks/ErrorBoundaryFrontend.js";
 export const AppRenderer = memo(() => {
     const { appData, appComponent: AppComponent } = useRouter().loader;
     const { activeRoute } = useRouterState();
@@ -23,7 +23,7 @@ export function RouteDisplay(props) {
     }
     return useMemo(() => {
         let child = !!Component && _jsx(Component, { ...props.route.props });
-        return (_jsx(ErrorBoundaryFrontend, { children: _jsx(RouteItemContext.Provider, { value: props.route, children: child }) }));
+        return (_jsx(RouteErrorBoundary, { route: props.route, children: _jsx(RouteItemContext.Provider, { value: props.route, children: child }) }));
     }, [Component, props.route, props.route]);
 }
 RouteDisplay.displayName = "RouteDisplay";

package/dist/app/lib/{hooks → runtime}/apiConfig.d.ts

@@ -1,3 +1,6 @@
+/**
+ * Configuration options for manipulating how the client interacts with the GraphQL API
+ */
 export type APIConfigStore = {
     /**
      * Any value, which will be used as part of the cache key for each query.
@@ -17,4 +20,3 @@ export type APIConfigStore = {
     set: (config: Partial<APIConfigStore>) => void;
 };
 export declare const apiConfig: APIConfigStore;
-export declare function useAPIConfig(): APIConfigStore;

package/dist/app/lib/{hooks → runtime}/apiConfig.js

@@ -4,6 +4,3 @@ export const apiConfig = proxy({
         Object.assign(apiConfig, config);
     },
 });
-export function useAPIConfig() {
-    return apiConfig;
-}

package/dist/app/lib/runtime/errorHandling.d.ts

@@ -0,0 +1,39 @@
+import { ContentBlock } from "../blocks";
+import { ReactNode } from "react";
+import { RouteState } from "../routing";
+export type ErrorEvent = {
+    /** The runtime error that occurred */
+    error: Error;
+    /** The Component stack (not available in renderBlockError) */
+    componentStack?: string;
+} & ({
+    type: "block";
+    /** The block which had an error, including it's type information, props, content and children */
+    block: ContentBlock;
+} | {
+    type: "route";
+    /** The route which had an error */
+    route: RouteState;
+});
+/**
+ * Configuration options for manipulating how the client interacts with the GraphQL API
+ */
+export type ErrorHandlingConfig = {
+    /**
+     * Triggered when a runtime error occurs in a block
+     * @param event The error event, containing the error and block information
+     **/
+    onReactError?(event: ErrorEvent): void;
+    /**
+     * Triggered when a React rendering error occurs, and allows you to return some JSX to render as a fallback.
+     * If not provided, the block will be hidden from the user.
+     * @param error The error event, containing the error and contextual information
+     * @param defaultDisplay The default display for the block — in development, this will display the error message. In production, this will be `null`.
+     */
+    renderFallback?(event: ErrorEvent, defaultDisplay: ReactNode): ReactNode;
+    /**
+     * Update the error handling configuration all at once
+     */
+    set: (config: Partial<ErrorHandlingConfig>) => void;
+};
+export declare const errorHandling: ErrorHandlingConfig;

package/dist/app/lib/runtime/errorHandling.js

@@ -0,0 +1,6 @@
+import { proxy } from "valtio";
+export const errorHandling = proxy({
+    set: (config) => {
+        Object.assign(errorHandling, config);
+    },
+});

package/dist/app/lib/runtime/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./apiConfig";
+export * from "./errorHandling";

package/dist/app/lib/runtime/index.js

@@ -0,0 +1,2 @@
+export * from "./apiConfig";
+export * from "./errorHandling";

package/dist/app/utils/BlockErrorBoundary.d.ts

@@ -0,0 +1,19 @@
+import { Component, ErrorInfo, ReactNode } from "react";
+import { BlocksContext, ContentBlock } from "../lib/blocks/ContentBlocks";
+interface Props {
+    block: ContentBlock;
+    blockContext: BlocksContext;
+    children: ReactNode;
+}
+interface State {
+    hasError: boolean;
+    error?: Error;
+    errorInfo?: ErrorInfo;
+}
+export declare class BlockErrorBoundary extends Component<Props, State> {
+    state: State;
+    static getDerivedStateFromError(error: Error): State;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
+    render(): ReactNode;
+}
+export {};

package/dist/app/utils/BlockErrorBoundary.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Component } from "react";
+import { errorHandling } from "../lib/runtime";
+import { ErrorMessage } from "./ErrorMessage";
+export class BlockErrorBoundary extends Component {
+    state = {
+        hasError: false,
+    };
+    static getDerivedStateFromError(error) {
+        // Update state so the next render will show the fallback UI.
+        return { hasError: true, error: error };
+    }
+    componentDidCatch(error, errorInfo) {
+        if (errorHandling.onReactError) {
+            errorHandling.onReactError({
+                type: "block",
+                block: this.props.block,
+                error,
+                componentStack: errorInfo.componentStack,
+            });
+        }
+    }
+    render() {
+        if (this.state.hasError) {
+            const err = this.state.error;
+            let display = env.dev ? _jsx(ErrorMessage, { error: err }) : null;
+            if (errorHandling.renderFallback) {
+                display = errorHandling.renderFallback({
+                    type: "block",
+                    block: this.props.block,
+                    error: err,
+                }, display);
+            }
+            return display;
+        }
+        return this.props.children;
+    }
+}

package/dist/app/utils/ErrorMessage.d.ts

@@ -0,0 +1,5 @@
+type Props = {
+    error: Error;
+};
+export declare function ErrorMessage({ error }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/app/utils/ErrorMessage.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ErrorMessage({ error }) {
+    return (_jsx("pre", { style: {
+            backgroundColor: "#060309",
+            fontSize: "12px",
+            color: "#d92a0b",
+            outline: "1px solid #d92a0b",
+            outlineOffset: "-4px",
+            borderRadius: "6px",
+            padding: "12px 16px",
+            overflowX: "auto",
+            fontFamily: '"Roboto Mono", Menlo, monospace',
+        }, children: error.stack ?? String(error) }));
+}

package/dist/app/{lib/blocks/ErrorBoundaryFrontend.d.ts → utils/RouteErrorBoundary.d.ts}

@@ -1,15 +1,18 @@
 import { Component, ErrorInfo, ReactNode } from "react";
+import { RouteState } from "../lib/routing";
 interface Props {
+    route: RouteState;
     children: ReactNode;
 }
 interface State {
     hasError: boolean;
     error?: Error;
+    errorInfo?: ErrorInfo;
 }
-export declare class ErrorBoundaryFrontend extends Component<Props, State> {
+export declare class RouteErrorBoundary extends Component<Props, State> {
     state: State;
-    static getDerivedStateFromError(err: Error): State;
+    static getDerivedStateFromError(error: Error): State;
     componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
-    render(): string | number | boolean | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element | null | undefined;
+    render(): ReactNode;
 }
 export {};

package/dist/app/utils/RouteErrorBoundary.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Component } from "react";
+import { errorHandling } from "../lib/runtime";
+import { ErrorMessage } from "./ErrorMessage";
+export class RouteErrorBoundary extends Component {
+    state = {
+        hasError: false,
+    };
+    static getDerivedStateFromError(error) {
+        // Update state so the next render will show the fallback UI.
+        return { hasError: true, error: error };
+    }
+    componentDidCatch(error, errorInfo) {
+        if (errorHandling.onReactError) {
+            errorHandling.onReactError({
+                type: "route",
+                route: this.props.route,
+                error,
+                componentStack: errorInfo.componentStack,
+            });
+        }
+    }
+    render() {
+        if (this.state.hasError) {
+            const err = this.state.error;
+            let display = env.dev ? _jsx(ErrorMessage, { error: err }) : null;
+            if (errorHandling.renderFallback) {
+                display = errorHandling.renderFallback({
+                    type: "route",
+                    route: this.props.route,
+                    error: err,
+                }, display);
+            }
+            return display;
+        }
+        return this.props.children;
+    }
+}

package/dist/node/cli/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "2.0.0-beta.54";
+export declare const VERSION = "2.0.0-beta.56";

package/dist/node/cli/version.js

@@ -1 +1 @@
-export const VERSION = "2.0.0-beta.54";
+export const VERSION = "2.0.0-beta.56";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eddev",
-  "version": "2.0.0-beta.54",
+  "version": "2.0.0-beta.56",
   "description": "",
   "main": "index.js",
   "type": "module",
@@ -38,6 +38,10 @@
       "types": "./dist/app/lib/devtools/index.d.ts",
       "import": "./dist/app/lib/devtools/index.js"
     },
+    "./runtime": {
+      "types": "./dist/app/lib/runtime/index.d.ts",
+      "import": "./dist/app/lib/runtime/index.js"
+    },
     "./server": {
       "types": "./dist/app/server/index.d.ts",
       "import": "./dist/app/server/index.js"

package/dist/app/lib/blocks/ErrorBoundaryFrontend.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Component } from "react";
-export class ErrorBoundaryFrontend extends Component {
-    state = {
-        hasError: false,
-    };
-    static getDerivedStateFromError(err) {
-        // Update state so the next render will show the fallback UI.
-        return { hasError: true, error: err };
-    }
-    componentDidCatch(error, errorInfo) {
-        console.log("Caught error:", error, errorInfo);
-        console.error("Uncaught error:", error, errorInfo);
-    }
-    render() {
-        if (this.state.hasError) {
-            const err = this.state.error;
-            if (env.dev) {
-                return (_jsx("pre", { style: {
-                        backgroundColor: "#fafafa",
-                        fontSize: "12px",
-                        color: "#d92a0b",
-                        border: "2px solid #d92a0b",
-                        borderRadius: "4px",
-                        padding: "8px",
-                        overflowX: "auto",
-                        fontFamily: '"Roboto Mono", Menlo, monospace',
-                    }, children: err.stack }));
-            }
-            else {
-                return null;
-            }
-        }
-        return this.props.children;
-    }
-}