@superblocksteam/util 0.0.14 → 0.0.16

package/.eslintrc.json

@@ -0,0 +1,51 @@
+{
+  "parser": "@typescript-eslint/parser",
+  "plugins": [
+    "@typescript-eslint",
+    "prettier",
+    "import",
+    "unicorn"
+  ],
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:prettier/recommended",
+    "prettier",
+    "plugin:import/typescript"
+  ],
+  "parserOptions": {
+    "ecmaVersion": 2020,
+    "sourceType": "module",
+    "project": true
+  },
+  "rules": {
+    "@typescript-eslint/explicit-module-boundary-types": "off",
+    "@typescript-eslint/no-explicit-any": "off",
+    "@typescript-eslint/no-unused-vars": "error",
+    "@typescript-eslint/no-var-requires": "off",
+    "@typescript-eslint/no-unsafe-return": "off",
+    "@typescript-eslint/no-unsafe-assignment": "off",
+    "@typescript-eslint/no-unsafe-member-access": "off",
+    "import/order": [
+      "error",
+      {
+        "alphabetize": { "order": "asc" },
+        "groups": [
+          "builtin",
+          "external",
+          "internal",
+          "parent",
+          "sibling",
+          "index",
+          "object",
+          "type"
+        ]
+      }
+    ],
+    "import/no-cycle": "error",
+    "no-template-curly-in-string": "off",
+    "no-useless-escape": "off",
+    "no-void": ["error", { "allowAsStatement": true }]
+  },
+  "ignorePatterns": ["public", "build", "node_modules", "dist", "tsup.config.ts"]
+}

package/dist/component-configs.d.ts

@@ -1 +1,4 @@
-export declare function getComponentConfigs(): Promise<Record<string, any>>;
+export declare function getComponentConfigs(generateTypesFiles: boolean): Promise<{
+    configs: Record<string, any>;
+    hasError: boolean;
+}>;

package/dist/component-configs.js

@@ -2,17 +2,37 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getComponentConfigs = void 0;
 const tslib_1 = require("tslib");
-const node_path_1 = tslib_1.__importDefault(require("node:path"));
+const child_process_1 = require("child_process");
 const node_os_1 = tslib_1.__importDefault(require("node:os"));
+const node_path_1 = tslib_1.__importDefault(require("node:path"));
 const fs = tslib_1.__importStar(require("fs-extra"));
 const constants_1 = require("./constants");
-const child_process_1 = require("child_process");
+const generate_component_types_1 = require("./generate-component-types");
+const validation_1 = require("./validation");
 const compileTypeScript = (inputFilePath, outputDir) => {
     return new Promise((resolve, reject) => {
         try {
             const tscPath = require.resolve("typescript/bin/tsc");
             if (tscPath) {
-                (0, child_process_1.execFile)(tscPath, [node_path_1.default.resolve(inputFilePath), "--outDir", outputDir, "--jsx", "react-jsx", "--target", "es2019", "--esModuleInterop", "true", "--moduleResolution", "node", "--module", "commonjs", "--strict", "true", "--skipLibCheck", "true"], (error, stdout, stderr) => {
+                (0, child_process_1.execFile)(tscPath, [
+                    node_path_1.default.resolve(inputFilePath),
+                    "--outDir",
+                    outputDir,
+                    "--jsx",
+                    "react-jsx",
+                    "--target",
+                    "es2019",
+                    "--esModuleInterop",
+                    "true",
+                    "--moduleResolution",
+                    "node",
+                    "--module",
+                    "commonjs",
+                    "--strict",
+                    "true",
+                    "--skipLibCheck",
+                    "true",
+                ], (error, stdout, stderr) => {
                     if (error) {
                         // Print any Typescript output to the user, such as errors
                         console.log(stdout);
@@ -47,13 +67,14 @@ async function getFolderPaths() {
         throw new Error("Could not access component directory, check your permissions");
     }
 }
-async function getComponentConfigs() {
+async function getComponentConfigs(generateTypesFiles) {
     const folderPaths = await getFolderPaths();
+    let hasError = false;
     const promiseConfigFiles = folderPaths.map(async (ccpath) => {
         try {
-            const ret = await fs.readJSON(`${ccpath}/config.json`);
+            const config = await fs.readJSON(`${ccpath}/config.json`);
             console.log(`Found component in ${ccpath}`);
-            return ret;
+            return { ccpath, config };
         }
         catch (e) {
             // Noop because there is a fallback
@@ -71,9 +92,15 @@ async function getComponentConfigs() {
                 .slice(2)}`);
             await compileTypeScript(fileName, outputDirectory);
             console.log(`Typescript compiled to ${ccpath}`);
-            const ret = (await Promise.resolve(`${outputDirectory + "/config.js"}`).then(s => tslib_1.__importStar(require(s)))).default;
-            console.log(`Found component in ${ccpath}`);
-            return ret;
+            const config = (await Promise.resolve(`${outputDirectory + "/config.js"}`).then(s => tslib_1.__importStar(require(s)))).default;
+            const isValid = (0, validation_1.validateCustomComponents)(config);
+            if (!isValid.valid) {
+                // Not throwing because we don't need a stack trace here
+                console.log(`Invalid config.ts file found`);
+                console.log(isValid.message);
+                hasError = true;
+            }
+            return { ccpath, config };
         }
         catch (e) {
             console.error(e);
@@ -81,12 +108,23 @@ async function getComponentConfigs() {
             throw e;
         }
     });
-    const configFiles = (await Promise.all(promiseConfigFiles))
-        .filter((file) => file !== null)
-        .reduce((acc, config) => {
+    const configFiles = await Promise.all(promiseConfigFiles);
+    if (generateTypesFiles) {
+        for (const { config, ccpath } of configFiles) {
+            const typesFileContents = (0, generate_component_types_1.generateComponentTypesFile)(config);
+            await fs.writeFile(`${ccpath}/types.ts`, typesFileContents);
+            console.log(`Generated ${ccpath}/types.ts`);
+        }
+    }
+    const configs = configFiles
+        .filter((component) => component.config !== null)
+        .reduce((acc, { config }) => {
         acc[config.id] = config;
         return acc;
     }, {});
-    return configFiles;
+    return {
+        configs,
+        hasError,
+    };
 }
 exports.getComponentConfigs = getComponentConfigs;

package/dist/generate-component-types.d.ts

@@ -0,0 +1 @@
+export declare function generateComponentTypesFile(config: any): string;

package/dist/generate-component-types.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateComponentTypesFile = void 0;
+const input_types_1 = require("./input-types");
+const indent = (str, spaces) => {
+    const spacesString = " ".repeat(spaces);
+    return str
+        .split("\n")
+        .map((line) => `${spacesString}${line}`)
+        .join("\n");
+};
+function renderInputTypeAsTS(name, type, trailingChars, indentSpaces) {
+    return indent(`${name}: ${input_types_1.inputTypeDefinions[type].tsType}${trailingChars}`, indentSpaces);
+}
+function generateComponentTypesFile(config) {
+    var _a, _b;
+    const statefulProperties = (_a = config.statefulProperties) !== null && _a !== void 0 ? _a : [];
+    const eventHandlers = (_b = config.eventHandlers) !== null && _b !== void 0 ? _b : [];
+    return `// WARNING: This file is automatically generated and managed by Superblocks CLI and should not be edited manually.
+// Use the \`superblocks components watch\` command to regenerate this file from its source in config.ts
+
+// All stateful properties of your component are defined here.
+// These are the properties which are surfaced in the Superblocks properties panel
+// and can be referenced throughout your Superblocks Application
+export interface StatefulProperties {
+${statefulProperties
+        .map((v) => renderInputTypeAsTS(v.path, v.inputType, ";", 2) + "\n")
+        .join("")}}
+
+export interface Props extends StatefulProperties {
+  /**
+   * Update one (or more) of your component's stateful properties. This will cause the component to rerender,
+   * and will also notify any other components in your Application which depend on the updated properties, so they also rerender
+   * @param props An object with the properties to update along with their new values
+   */
+  updateStatefulProperties: (props: Partial<StatefulProperties>) => void;
+
+  // Call the subsequent function(s) to trigger event(s) in Superblocks from your component.
+  // These events can be wired up to event handlers in your Superblocks App
+${eventHandlers.length === 0
+        ? "  // Note: no event handlers defined\n"
+        : eventHandlers
+            .map((v) => indent(v.path, 2) + ": () => void;" + "\n")
+            .join("")}}
+`;
+}
+exports.generateComponentTypesFile = generateComponentTypesFile;

package/dist/index.d.ts

@@ -2,3 +2,4 @@ export * from "./constants";
 export * from "./component-configs";
 export * from "./login";
 export * from "./resource-configs";
+export * from "./input-types";

package/dist/index.js

@@ -5,3 +5,4 @@ tslib_1.__exportStar(require("./constants"), exports);
 tslib_1.__exportStar(require("./component-configs"), exports);
 tslib_1.__exportStar(require("./login"), exports);
 tslib_1.__exportStar(require("./resource-configs"), exports);
+tslib_1.__exportStar(require("./input-types"), exports);

package/dist/input-types.d.ts

@@ -0,0 +1,9 @@
+export declare const supportedInputTypes: readonly ["text", "number", "boolean", "js"];
+export type InputType = (typeof supportedInputTypes)[number];
+interface TypeInfo {
+    tsType: string;
+    prompt: string;
+}
+export declare const inputTypeDefinions: Record<InputType, TypeInfo>;
+export declare function isValidInputType(input: string): input is InputType;
+export {};

package/dist/input-types.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isValidInputType = exports.inputTypeDefinions = exports.supportedInputTypes = void 0;
+exports.supportedInputTypes = ["text", "number", "boolean", "js"];
+exports.inputTypeDefinions = {
+    text: {
+        tsType: "string",
+        prompt: "text",
+    },
+    number: {
+        tsType: "number",
+        prompt: "number",
+    },
+    boolean: {
+        tsType: "boolean",
+        prompt: "boolean",
+    },
+    js: {
+        tsType: "any",
+        prompt: "any (raw js expression)",
+    },
+};
+function isValidInputType(input) {
+    return Object.prototype.hasOwnProperty.call(exports.inputTypeDefinions, input);
+}
+exports.isValidInputType = isValidInputType;

package/dist/resource-configs.d.ts

@@ -4,10 +4,11 @@ export type SuperblocksMetadata = {
     lastUpdated: string;
     created: string;
 };
+export type SuperblocksResourceType = "APPLICATION" | "BACKEND";
 export type VersionedResourceConfig = {
     location: string;
     lastUpdated: string;
-    resourceType: "APPLICATION" | "BACKEND";
+    resourceType: SuperblocksResourceType;
 };
 export type SuperblocksResourceConfig = {
     id: string;

package/dist/resource-configs.js

@@ -70,11 +70,15 @@ async function getSuperblocksResourceConfigIfExists() {
     try {
         config = await getSuperblocksApplicationConfigJson();
     }
-    catch { }
+    catch {
+        // Noop
+    }
     try {
         config = await getSuperblocksBackendConfigJson();
     }
-    catch { }
+    catch {
+        // Noop
+    }
     return config;
 }
 exports.getSuperblocksResourceConfigIfExists = getSuperblocksResourceConfigIfExists;

package/dist/validation.d.ts

@@ -0,0 +1,4 @@
+export declare function validateCustomComponents(data: any): {
+    valid: boolean;
+    message?: string;
+};

package/dist/validation.js

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.validateCustomComponents = void 0;
+const tslib_1 = require("tslib");
+const ajv_1 = tslib_1.__importDefault(require("ajv"));
+const better_ajv_errors_1 = tslib_1.__importDefault(require("better-ajv-errors"));
+const ajv = new ajv_1.default();
+const componentSchema = {
+    type: "object",
+    properties: {
+        id: { type: "string" },
+        name: { type: "string" },
+        displayName: { type: "string" },
+        componentPath: { type: "string" },
+        statefulProperties: {
+            type: "array",
+            items: {
+                $ref: "#/definitions/StatefulProperty",
+            },
+        },
+        eventHandlers: {
+            type: "array",
+            items: {
+                $ref: "#/definitions/EventHandler",
+            },
+        },
+    },
+    required: [
+        "id",
+        "name",
+        "displayName",
+        "componentPath",
+        "statefulProperties",
+        "eventHandlers",
+    ],
+    additionalProperties: false,
+    definitions: {
+        StatefulProperty: {
+            properties: {
+                label: { type: "string" },
+                path: { type: "string" },
+                inputType: { enum: ["text", "number", "boolean", "js"] },
+                placeholder: { type: "string" },
+            },
+            type: "object",
+            additionalProperties: false,
+            required: ["label", "path", "inputType"],
+        },
+        EventHandler: {
+            properties: {
+                label: { type: "string" },
+                path: { type: "string" },
+            },
+            type: "object",
+            additionalProperties: false,
+            required: ["label", "path"],
+        },
+    },
+};
+const validate = ajv.compile(componentSchema);
+function validateCustomComponents(data) {
+    const valid = validate(data);
+    if (!valid) {
+        return {
+            valid: false,
+            message: (0, better_ajv_errors_1.default)(componentSchema, data, validate.errors, {
+                indent: 2,
+            }),
+        };
+    }
+    return { valid: true };
+}
+exports.validateCustomComponents = validateCustomComponents;

package/package.json

@@ -1,17 +1,28 @@
 {
   "name": "@superblocksteam/util",
-  "version": "0.0.14",
+  "version": "0.0.16",
   "main": "dist/index.js",
   "homepage": "https://www.superblocks.com",
   "scripts": {
     "dev": "tsc --watch",
     "build": "tsc --build",
     "clean": "npm run clean:build && rm -rf node_modules",
-    "clean:build": "tsc --build --clean && rm -rf dist tsconfig.tsbuildinfo"
+    "clean:build": "tsc --build --clean && rm -rf dist tsconfig.tsbuildinfo",
+    "lint": "eslint . --ext .ts --config .eslintrc.json",
+    "lint:fix": "eslint . --ext .ts --config .eslintrc.json --fix"
   },
   "license": "Superblocks Community Software License",
   "description": "",
+  "dependencies": {
+    "ajv": "^8.12.0",
+    "better-ajv-errors": "^1.2.0"
+  },
   "devDependencies": {
-    "typescript": "^5.0.4"
+    "@typescript-eslint/eslint-plugin": "^5.60.1",
+    "@typescript-eslint/parser": "^5.60.1",
+    "eslint": "^8.45.0",
+    "eslint-plugin-unicorn": "^47.0.0",
+    "prettier": "^2.8.8",
+    "typescript": "^5.1.3"
   }
 }

package/src/component-configs.ts

@@ -1,8 +1,10 @@
-import path from "node:path";
+import { execFile } from "child_process";
 import os from "node:os";
+import path from "node:path";
 import * as fs from "fs-extra";
 import { CUSTOM_COMPONENTS_PATH } from "./constants";
-import { execFile } from "child_process";
+import { generateComponentTypesFile } from "./generate-component-types";
+import { validateCustomComponents } from "./validation";
 
 const compileTypeScript = (inputFilePath: string, outputDir: string) => {
   return new Promise((resolve, reject) => {
@@ -11,7 +13,25 @@ const compileTypeScript = (inputFilePath: string, outputDir: string) => {
       if (tscPath) {
         execFile(
           tscPath,
-          [path.resolve(inputFilePath), "--outDir", outputDir, "--jsx", "react-jsx", "--target", "es2019", "--esModuleInterop", "true", "--moduleResolution", "node", "--module", "commonjs", "--strict", "true", "--skipLibCheck", "true"],
+          [
+            path.resolve(inputFilePath),
+            "--outDir",
+            outputDir,
+            "--jsx",
+            "react-jsx",
+            "--target",
+            "es2019",
+            "--esModuleInterop",
+            "true",
+            "--moduleResolution",
+            "node",
+            "--module",
+            "commonjs",
+            "--strict",
+            "true",
+            "--skipLibCheck",
+            "true",
+          ],
           (error, stdout, stderr) => {
             if (error) {
               // Print any Typescript output to the user, such as errors
@@ -28,7 +48,11 @@ const compileTypeScript = (inputFilePath: string, outputDir: string) => {
         );
       }
     } catch (e) {
-      reject(new Error("Could not find TypeScript, please install it globally (npm install -g typescript)"));
+      reject(
+        new Error(
+          "Could not find TypeScript, please install it globally (npm install -g typescript)"
+        )
+      );
     }
   });
 };
@@ -52,13 +76,19 @@ async function getFolderPaths() {
   }
 }
 
-export async function getComponentConfigs(): Promise<Record<string, any>> {
+export async function getComponentConfigs(
+  generateTypesFiles: boolean
+): Promise<{
+  configs: Record<string, any>;
+  hasError: boolean;
+}> {
   const folderPaths = await getFolderPaths();
+  let hasError = false;
   const promiseConfigFiles = folderPaths.map(async (ccpath) => {
     try {
-      const ret = await fs.readJSON(`${ccpath}/config.json`);
+      const config = await fs.readJSON(`${ccpath}/config.json`);
       console.log(`Found component in ${ccpath}`);
-      return ret;
+      return { ccpath, config };
     } catch (e: any) {
       // Noop because there is a fallback
     }
@@ -78,20 +108,38 @@ export async function getComponentConfigs(): Promise<Record<string, any>> {
       );
       await compileTypeScript(fileName, outputDirectory);
       console.log(`Typescript compiled to ${ccpath}`);
-      const ret = (await import(outputDirectory + "/config.js")).default;
-      console.log(`Found component in ${ccpath}`);
-      return ret;
+      const config = (await import(outputDirectory + "/config.js")).default;
+
+      const isValid = validateCustomComponents(config);
+      if (!isValid.valid) {
+        // Not throwing because we don't need a stack trace here
+        console.log(`Invalid config.ts file found`);
+        console.log(isValid.message);
+        hasError = true;
+      }
+      return { ccpath, config };
     } catch (e: any) {
       console.error(e);
       console.error(e.message);
       throw e;
     }
   });
-  const configFiles = (await Promise.all(promiseConfigFiles))
-    .filter((file) => file !== null)
-    .reduce((acc, config) => {
+  const configFiles = await Promise.all(promiseConfigFiles);
+  if (generateTypesFiles) {
+    for (const { config, ccpath } of configFiles) {
+      const typesFileContents = generateComponentTypesFile(config);
+      await fs.writeFile(`${ccpath}/types.ts`, typesFileContents);
+      console.log(`Generated ${ccpath}/types.ts`);
+    }
+  }
+  const configs = configFiles
+    .filter((component) => component.config !== null)
+    .reduce((acc: Record<string, any>, { config }) => {
       acc[config.id] = config;
       return acc;
     }, {});
-  return configFiles;
+  return {
+    configs,
+    hasError,
+  };
 }

package/src/generate-component-types.ts

@@ -0,0 +1,56 @@
+import { inputTypeDefinions, type InputType } from "./input-types";
+
+const indent = (str: string, spaces: number) => {
+  const spacesString = " ".repeat(spaces);
+
+  return str
+    .split("\n")
+    .map((line) => `${spacesString}${line}`)
+    .join("\n");
+};
+
+function renderInputTypeAsTS(
+  name: string,
+  type: InputType,
+  trailingChars: string,
+  indentSpaces: number
+) {
+  return indent(
+    `${name}: ${inputTypeDefinions[type].tsType}${trailingChars}`,
+    indentSpaces
+  );
+}
+
+export function generateComponentTypesFile(config: any) {
+  const statefulProperties = config.statefulProperties ?? [];
+  const eventHandlers = config.eventHandlers ?? [];
+  return `// WARNING: This file is automatically generated and managed by Superblocks CLI and should not be edited manually.
+// Use the \`superblocks components watch\` command to regenerate this file from its source in config.ts
+
+// All stateful properties of your component are defined here.
+// These are the properties which are surfaced in the Superblocks properties panel
+// and can be referenced throughout your Superblocks Application
+export interface StatefulProperties {
+${statefulProperties
+  .map((v: any) => renderInputTypeAsTS(v.path, v.inputType, ";", 2) + "\n")
+  .join("")}}
+
+export interface Props extends StatefulProperties {
+  /**
+   * Update one (or more) of your component's stateful properties. This will cause the component to rerender,
+   * and will also notify any other components in your Application which depend on the updated properties, so they also rerender
+   * @param props An object with the properties to update along with their new values
+   */
+  updateStatefulProperties: (props: Partial<StatefulProperties>) => void;
+
+  // Call the subsequent function(s) to trigger event(s) in Superblocks from your component.
+  // These events can be wired up to event handlers in your Superblocks App
+${
+  eventHandlers.length === 0
+    ? "  // Note: no event handlers defined\n"
+    : eventHandlers
+        .map((v: any) => indent(v.path, 2) + ": () => void;" + "\n")
+        .join("")
+}}
+`;
+}

package/src/index.ts

@@ -2,3 +2,4 @@ export * from "./constants";
 export * from "./component-configs";
 export * from "./login";
 export * from "./resource-configs";
+export * from "./input-types";

package/src/input-types.ts

@@ -0,0 +1,34 @@
+export const supportedInputTypes = ["text", "number", "boolean", "js"] as const;
+
+export type InputType = (typeof supportedInputTypes)[number];
+
+interface TypeInfo {
+  tsType: string;
+  prompt: string;
+}
+
+export const inputTypeDefinions: Record<InputType, TypeInfo> = {
+  text: {
+    tsType: "string",
+    prompt: "text",
+  },
+  number: {
+    tsType: "number",
+    prompt: "number",
+  },
+  boolean: {
+    tsType: "boolean",
+    prompt: "boolean",
+  },
+  js: {
+    tsType: "any",
+    prompt: "any (raw js expression)",
+  },
+};
+
+export function isValidInputType(input: string): input is InputType {
+  return Object.prototype.hasOwnProperty.call(
+    inputTypeDefinions,
+    input as InputType
+  );
+}

package/src/resource-configs.ts

@@ -8,10 +8,12 @@ export type SuperblocksMetadata = {
   created: string;
 };
 
+export type SuperblocksResourceType = "APPLICATION" | "BACKEND";
+
 export type VersionedResourceConfig = {
   location: string;
   lastUpdated: string;
-  resourceType: "APPLICATION" | "BACKEND";
+  resourceType: SuperblocksResourceType;
 };
 
 export type SuperblocksResourceConfig = {
@@ -123,9 +125,13 @@ export async function getSuperblocksResourceConfigIfExists(): Promise<
   let config: SuperblocksResourceConfig | undefined;
   try {
     config = await getSuperblocksApplicationConfigJson();
-  } catch {}
+  } catch {
+    // Noop
+  }
   try {
     config = await getSuperblocksBackendConfigJson();
-  } catch {}
+  } catch {
+    // Noop
+  }
   return config;
 }

package/src/validation.ts

@@ -0,0 +1,75 @@
+import Ajv, { Schema } from "ajv";
+import betterAjvErrors from "better-ajv-errors";
+
+const ajv = new Ajv();
+
+const componentSchema: Schema = {
+  type: "object",
+  properties: {
+    id: { type: "string" },
+    name: { type: "string" },
+    displayName: { type: "string" },
+    componentPath: { type: "string" },
+    statefulProperties: {
+      type: "array",
+      items: {
+        $ref: "#/definitions/StatefulProperty",
+      },
+    },
+    eventHandlers: {
+      type: "array",
+      items: {
+        $ref: "#/definitions/EventHandler",
+      },
+    },
+  },
+  required: [
+    "id",
+    "name",
+    "displayName",
+    "componentPath",
+    "statefulProperties",
+    "eventHandlers",
+  ],
+  additionalProperties: false,
+  definitions: {
+    StatefulProperty: {
+      properties: {
+        label: { type: "string" },
+        path: { type: "string" },
+        inputType: { enum: ["text", "number", "boolean", "js"] },
+        placeholder: { type: "string" },
+      },
+      type: "object",
+      additionalProperties: false,
+      required: ["label", "path", "inputType"],
+    },
+    EventHandler: {
+      properties: {
+        label: { type: "string" },
+        path: { type: "string" },
+      },
+      type: "object",
+      additionalProperties: false,
+      required: ["label", "path"],
+    },
+  },
+};
+
+const validate = ajv.compile(componentSchema);
+
+export function validateCustomComponents(data: any): {
+  valid: boolean;
+  message?: string;
+} {
+  const valid = validate(data);
+  if (!valid) {
+    return {
+      valid: false,
+      message: betterAjvErrors(componentSchema, data, validate.errors as any, {
+        indent: 2,
+      }),
+    };
+  }
+  return { valid: true };
+}