@superblocksteam/cli 1.9.3 → 1.12.0

package/dist/commands/{commits.js → commits.mjs}

@@ -1,20 +1,47 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const node_path_1 = tslib_1.__importDefault(require("node:path"));
-const core_1 = require("@oclif/core");
-const util_1 = require("@superblocksteam/util");
-const listr2_1 = require("listr2");
-const authenticated_command_1 = require("../common/authenticated-command");
-const version_control_1 = require("../common/version-control");
-class Commits extends authenticated_command_1.AuthenticatedCommand {
+import path from "node:path";
+import { Args, Flags } from "@oclif/core";
+import { getSuperblocksMonorepoConfigJson, getSuperblocksResourceConfigIfExists, ComponentEvent, COMPONENT_EVENT_HEADER, NotFoundError, } from "@superblocksteam/util";
+import { Listr } from "listr2";
+import { AuthenticatedCommand } from "../common/authenticated-command.mjs";
+import { DEFAULT_BRANCH, SELECT_PROMPT_HELP, atLeastOneSelection, deleteResourcesAndUpdateRootConfig, getCurrentGitBranchIfGit, } from "../common/version-control.mjs";
+export default class Commits extends AuthenticatedCommand {
+    static description = "List Superblocks commits for a resource";
+    static examples = [
+        "<%= config.bin %> <%= command.id %>",
+        "<%= config.bin %> <%= command.id %>  apps/my-app",
+        "<%= config.bin %> <%= command.id %>  apps/my-app -b feature-branch",
+        "<%= config.bin %> <%= command.id %>  --limit 20",
+        "<%= config.bin %> <%= command.id %>  --offset 10",
+    ];
+    static flags = {
+        branch: Flags.string({
+            char: "b",
+            description: "Superblocks branch to show commits for, the current git branch will be used by default",
+        }),
+        limit: Flags.integer({
+            char: "l",
+            default: 10,
+            description: "Number of commits to be displayed, default is 10",
+        }),
+        offset: Flags.integer({
+            char: "o",
+            default: 0,
+            description: "Number of commits to be skipped before displaying by creation time, default is 0",
+        }),
+    };
+    static args = {
+        resource_path: Args.string({
+            description: "Superblocks resource location to show commits for (i.e. apps/my-app)",
+            required: false,
+        }),
+    };
     async run() {
         const { flags, args } = await this.parse(Commits);
         const tasks = this.createTasks(args.resource_path, flags.branch, flags.limit, flags.offset);
         await tasks.run();
     }
     createTasks(resourcePath, branch, limit, offset) {
-        const tasks = new listr2_1.Listr([
+        const tasks = new Listr([
             {
                 title: "Checking for existing Superblocks project...",
                 task: async (ctx) => {
@@ -24,10 +51,10 @@ class Commits extends authenticated_command_1.AuthenticatedCommand {
                         [
                             ctx.existingSuperblocksRootConfig,
                             ctx.superblocksRootConfigPath,
-                        ] = await (0, util_1.getSuperblocksMonorepoConfigJson)(true);
+                        ] = await getSuperblocksMonorepoConfigJson(true);
                         ctx.existingSuperblocksResourceConfig =
-                            await (0, util_1.getSuperblocksResourceConfigIfExists)();
-                        ctx.superblocksRootPath = node_path_1.default.resolve(node_path_1.default.dirname(ctx.superblocksRootConfigPath), "..");
+                            await getSuperblocksResourceConfigIfExists();
+                        ctx.superblocksRootPath = path.resolve(path.dirname(ctx.superblocksRootConfigPath), "..");
                     }
                     catch {
                         // no existing superblocks config
@@ -41,7 +68,7 @@ class Commits extends authenticated_command_1.AuthenticatedCommand {
                     ctx.branchToShowCommitsFor = new Map();
                     try {
                         ctx.localBranchName =
-                            branch || (await (0, version_control_1.getCurrentGitBranchIfGit)()) || version_control_1.DEFAULT_BRANCH;
+                            branch || (await getCurrentGitBranchIfGit()) || DEFAULT_BRANCH;
                     }
                     catch (e) {
                         this.error(`Failed to check for existing git repository: ${e.message}. Please make sure to clone or initialize a git repository.`);
@@ -51,10 +78,9 @@ class Commits extends authenticated_command_1.AuthenticatedCommand {
             {
                 title: "Checking for deleted Superblocks resources...",
                 task: async (ctx, task) => {
-                    var _a, _b;
                     try {
-                        for (const [resourceId, resource] of Object.entries((_b = (_a = ctx.existingSuperblocksRootConfig) === null || _a === void 0 ? void 0 : _a.resources) !== null && _b !== void 0 ? _b : {})) {
-                            switch (resource === null || resource === void 0 ? void 0 : resource.resourceType) {
+                        for (const [resourceId, resource] of Object.entries(ctx.existingSuperblocksRootConfig?.resources ?? {})) {
+                            switch (resource?.resourceType) {
                                 case "APPLICATION": {
                                     try {
                                         await this.getSdk().fetchApplication({
@@ -64,7 +90,7 @@ class Commits extends authenticated_command_1.AuthenticatedCommand {
                                         });
                                     }
                                     catch (error) {
-                                        if (error instanceof util_1.NotFoundError) {
+                                        if (error instanceof NotFoundError) {
                                             ctx.removedResourceIds.push(resourceId);
                                         }
                                         else {
@@ -82,7 +108,7 @@ class Commits extends authenticated_command_1.AuthenticatedCommand {
                                         });
                                     }
                                     catch (error) {
-                                        if (error instanceof util_1.NotFoundError) {
+                                        if (error instanceof NotFoundError) {
                                             ctx.removedResourceIds.push(resourceId);
                                         }
                                         else {
@@ -115,7 +141,7 @@ Would you like to also delete these resources from your filesystem?`,
                             },
                         ]);
                         if (removeResourcesFromDisk) {
-                            await (0, version_control_1.deleteResourcesAndUpdateRootConfig)(ctx.removedResourceIds, ctx.existingSuperblocksRootConfig, ctx.superblocksRootPath, ctx.superblocksRootConfigPath);
+                            await deleteResourcesAndUpdateRootConfig(ctx.removedResourceIds, ctx.existingSuperblocksRootConfig, ctx.superblocksRootPath, ctx.superblocksRootConfigPath);
                         }
                     }
                     catch (e) {
@@ -131,19 +157,18 @@ Would you like to also delete these resources from your filesystem?`,
             },
             {
                 task: async (ctx, task) => {
-                    var _a, _b;
                     task.title = `Get commits for the resource from branch ${ctx.localBranchName}...`;
                     const subtasks = [];
                     const resourceId = ctx.resourceIdToShowCommits;
-                    const resource = (_a = ctx.existingSuperblocksRootConfig) === null || _a === void 0 ? void 0 : _a.resources[resourceId];
-                    const branchName = (_b = ctx.branchToShowCommitsFor.get(resourceId)) !== null && _b !== void 0 ? _b : ctx.localBranchName;
-                    switch (resource === null || resource === void 0 ? void 0 : resource.resourceType) {
+                    const resource = ctx.existingSuperblocksRootConfig?.resources[resourceId];
+                    const branchName = ctx.branchToShowCommitsFor.get(resourceId) ?? ctx.localBranchName;
+                    switch (resource?.resourceType) {
                         case "APPLICATION": {
                             subtasks.push({
                                 title: `Fetching commits for application ${resource.location} from branch ${branchName}...`,
                                 task: async (_ctx, task) => {
                                     const headers = {
-                                        [util_1.COMPONENT_EVENT_HEADER]: util_1.ComponentEvent.COMMITS,
+                                        [COMPONENT_EVENT_HEADER]: ComponentEvent.COMMITS,
                                     };
                                     try {
                                         task.title += `: fetched`;
@@ -158,7 +183,7 @@ Would you like to also delete these resources from your filesystem?`,
                                         task.title += `: done`;
                                     }
                                     catch (e) {
-                                        if (e instanceof util_1.NotFoundError) {
+                                        if (e instanceof NotFoundError) {
                                             task.title += `: not found in this branch. skipped`;
                                         }
                                         else {
@@ -202,23 +227,22 @@ Would you like to also delete these resources from your filesystem?`,
         return tasks;
     }
     async getResourceIdToShowCommits(ctx, task, resourcePath) {
-        var _a, _b, _c, _d, _e;
         if (resourcePath) {
-            for (const [resourceId, resource] of Object.entries((_b = (_a = ctx.existingSuperblocksRootConfig) === null || _a === void 0 ? void 0 : _a.resources) !== null && _b !== void 0 ? _b : {})) {
+            for (const [resourceId, resource] of Object.entries(ctx.existingSuperblocksRootConfig?.resources ?? {})) {
                 if (resource.location === resourcePath) {
                     return resourceId;
                 }
             }
             throw new Error(`No resource found with the given location: ${resourcePath}`);
         }
-        const resourceConfig = await (0, util_1.getSuperblocksResourceConfigIfExists)();
+        const resourceConfig = await getSuperblocksResourceConfigIfExists();
         if (resourceConfig) {
             return resourceConfig.id;
         }
         const choices = [];
         const initialSelections = [];
         let counter = 0;
-        for (const [resourceId, resource] of Object.entries((_d = (_c = ctx.existingSuperblocksRootConfig) === null || _c === void 0 ? void 0 : _c.resources) !== null && _d !== void 0 ? _d : {})) {
+        for (const [resourceId, resource] of Object.entries(ctx.existingSuperblocksRootConfig?.resources ?? {})) {
             if (ctx.removedResourceIds.includes(resourceId)) {
                 continue;
             }
@@ -226,7 +250,7 @@ Would you like to also delete these resources from your filesystem?`,
                 name: resourceId,
                 message: resource.location,
             });
-            if (((_e = ctx.existingSuperblocksResourceConfig) === null || _e === void 0 ? void 0 : _e.id) === resourceId) {
+            if (ctx.existingSuperblocksResourceConfig?.id === resourceId) {
                 initialSelections.push(counter);
             }
             counter++;
@@ -240,10 +264,10 @@ Would you like to also delete these resources from your filesystem?`,
                 {
                     type: "Select",
                     name: "resourceIdToShowCommits",
-                    message: `Select a resource to see commits (${version_control_1.SELECT_PROMPT_HELP})`,
+                    message: `Select a resource to see commits (${SELECT_PROMPT_HELP})`,
                     choices: choices,
                     initial: initialSelections,
-                    validate: version_control_1.atLeastOneSelection,
+                    validate: atLeastOneSelection,
                     prefix: "▸",
                     indicator: "◉",
                 },
@@ -251,48 +275,16 @@ Would you like to also delete these resources from your filesystem?`,
         return resourceIdToShowCommitFor;
     }
     printCommits(commits, branch) {
-        var _a;
         if (commits.commits.length === 0) {
             console.log("No commits have been created.");
             return;
         }
         for (const commit of commits.commits) {
             console.log(`commit ${commit.commitId}`, branch ? `(${branch})` : "");
-            console.log(`Author: ${(_a = commit.committer.name) !== null && _a !== void 0 ? _a : ""} <${commit.committer.email}>`);
+            console.log(`Author: ${commit.committer.name ?? ""} <${commit.committer.email}>`);
             console.log(`Date: ${new Date(commit.commitDate).toLocaleString()}`);
             console.log(`Message: ${commit.commitMessage}`);
             console.log("---");
         }
     }
 }
-Commits.description = "List Superblocks commits for a resource";
-Commits.examples = [
-    "<%= config.bin %> <%= command.id %>",
-    "<%= config.bin %> <%= command.id %>  apps/my-app",
-    "<%= config.bin %> <%= command.id %>  apps/my-app -b feature-branch",
-    "<%= config.bin %> <%= command.id %>  --limit 20",
-    "<%= config.bin %> <%= command.id %>  --offset 10",
-];
-Commits.flags = {
-    branch: core_1.Flags.string({
-        char: "b",
-        description: "Superblocks branch to show commits for, the current git branch will be used by default",
-    }),
-    limit: core_1.Flags.integer({
-        char: "l",
-        default: 10,
-        description: "Number of commits to be displayed, default is 10",
-    }),
-    offset: core_1.Flags.integer({
-        char: "o",
-        default: 0,
-        description: "Number of commits to be skipped before displaying by creation time, default is 0",
-    }),
-};
-Commits.args = {
-    resource_path: core_1.Args.string({
-        description: "Superblocks resource location to show commits for (i.e. apps/my-app)",
-        required: false,
-    }),
-};
-exports.default = Commits;

package/dist/commands/components/{create.d.ts → create.d.mts}

@@ -1,9 +1,9 @@
-import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
+import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
 export default class CreateComponent extends AuthenticatedApplicationCommand {
     static description: string;
     private dataTypeToDefaultControlType;
     static flags: {
-        example: import("@oclif/core/lib/interfaces").BooleanFlag<boolean>;
+        example: import("@oclif/core/interfaces").BooleanFlag<boolean>;
     };
     private initializeComponentByWizard;
     private initializeComponentByExample;

package/dist/commands/components/{create.js → create.mjs}

@@ -1,23 +1,19 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-/* eslint-disable no-await-in-loop */
-const node_child_process_1 = require("node:child_process");
-const node_crypto_1 = require("node:crypto");
-const node_path_1 = tslib_1.__importDefault(require("node:path"));
-const node_util_1 = tslib_1.__importDefault(require("node:util"));
-const core_1 = require("@oclif/core");
-const util_1 = require("@superblocksteam/util");
-const colorette_1 = require("colorette");
-const enquirer_1 = require("enquirer");
-const fs = tslib_1.__importStar(require("fs-extra"));
-const lodash_1 = require("lodash");
-const authenticated_command_1 = require("../../common/authenticated-command");
-const create_component_defaults_1 = require("../../common/defaults/create-component-defaults");
-// eslint-disable-next-line unicorn/prefer-module
-const rootDirectory = node_path_1.default.resolve(__dirname, "../../../");
-const DEFAULT_PACKAGE_JSON_TEMPLATE_PATH = node_path_1.default.resolve(rootDirectory, "assets/custom-components/setup");
-const DEFAULT_EXAMPLE_COMPONENT_TEMPLATE_PATH = node_path_1.default.resolve(rootDirectory, "assets/custom-components/example");
+import { exec } from "node:child_process";
+import { randomUUID } from "node:crypto";
+import path from "node:path";
+import util from "node:util";
+import { Flags, ux } from "@oclif/core";
+import { dataTypeDefinions, ComponentEvent, COMPONENT_EVENT_HEADER, isValidIdentifier, isReservedPropertyName, suggestIdentifier, } from "@superblocksteam/util";
+import { bold, cyanBright, green, magenta, red } from "colorette";
+import enquirer from "enquirer";
+import fs from "fs-extra";
+import { isEmpty } from "lodash-es";
+import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
+import { getDefaultComponentTsx, getDefaultConfigTs, } from "../../common/defaults/create-component-defaults.mjs";
+const { prompt } = enquirer;
+const rootDirectory = path.resolve(new URL(import.meta.url).pathname, "../../../../");
+const DEFAULT_PACKAGE_JSON_TEMPLATE_PATH = path.resolve(rootDirectory, "assets/custom-components/setup");
+const DEFAULT_EXAMPLE_COMPONENT_TEMPLATE_PATH = path.resolve(rootDirectory, "assets/custom-components/example");
 const tsStringify = (obj) => {
     const entries = Object.entries(obj);
     const stringifiedEntries = entries.map(([key, value]) => {
@@ -25,74 +21,77 @@ const tsStringify = (obj) => {
     });
     return `{\n${stringifiedEntries.join(",\n")}\n},\n`;
 };
-class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCommand {
-    constructor() {
-        super(...arguments);
-        this.dataTypeToDefaultControlType = (propertyType) => {
-            switch (propertyType) {
-                case "any":
-                    return "js-expr";
-                case "boolean":
-                    return "switch";
-                default:
-                    return "text";
-            }
-        };
-    }
+export default class CreateComponent extends AuthenticatedApplicationCommand {
+    static description = "Creates a new Superblocks component in the current application folder";
+    dataTypeToDefaultControlType = (propertyType) => {
+        switch (propertyType) {
+            case "any":
+                return "js-expr";
+            case "boolean":
+                return "switch";
+            default:
+                return "text";
+        }
+    };
+    static flags = {
+        example: Flags.boolean({
+            description: "Create example component",
+        }),
+    };
     async initializeComponentByWizard(isFirstTimeCreate) {
-        this.log(`${(0, colorette_1.cyanBright)("ℹ")}  Follow this wizard to configure your Custom Component. You can always edit the generated config.ts file directly to modify your properties or events.`);
+        this.log(`${cyanBright("ℹ")}  Follow this wizard to configure your Custom Component. You can always edit the generated config.ts file directly to modify your properties or events.`);
         this.log();
-        const displayName = (await (0, enquirer_1.prompt)({
+        const displayName = (await prompt({
             type: "input",
             name: "displayName",
             message: "What is the display name of the component you want to create? (e.g. To-Do List)",
-            validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+            validate: (response) => !isEmpty(response.trim()),
         })).displayName;
-        const name = (await (0, enquirer_1.prompt)({
+        const name = (await prompt({
             type: "input",
             name: "name",
             message: "What is the machine readable name of the component you want to create?",
-            validate: (response) => (0, util_1.isValidIdentifier)(response) || "Invalid identifier",
-            initial: (0, util_1.suggestIdentifier)(displayName, true) || "ToDoList",
+            validate: (response) => isValidIdentifier(response) || "Invalid identifier",
+            initial: suggestIdentifier(displayName, true) || "ToDoList",
         })).name;
         this.log();
-        this.log(`${(0, colorette_1.cyanBright)("ℹ")}  Properties represent the state of the component. You will define how each property is made available to the rest of your App and whether each property is displayed in the Properties Panel. Read more about properties here: ${(0, colorette_1.magenta)("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
+        this.log(`${cyanBright("ℹ")}  Properties represent the state of the component. You will define how each property is made available to the rest of your App and whether each property is displayed in the Properties Panel. Read more about properties here: ${magenta("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
         this.log();
-        const hasProperties = (await (0, enquirer_1.prompt)({
+        const hasProperties = (await prompt({
             type: "confirm",
             name: "hasProperties",
-            message: `Does this component have ${(0, colorette_1.bold)("properties")}?`,
+            message: `Does this component have ${bold("properties")}?`,
             initial: false,
         })).hasProperties;
         const properties = [];
         if (hasProperties) {
             for (;;) {
-                const propertyPath = (await (0, enquirer_1.prompt)({
+                const propertyPath = (await prompt({
                     type: "input",
                     name: "path",
                     message: "What is the path of the property? This will be used to access the property in your code (e.g. currentTasks)",
                     validate: (response) => {
-                        if (!(0, util_1.isValidIdentifier)(response))
+                        if (!isValidIdentifier(response))
                             return "Invalid identifier";
-                        if ((0, util_1.isReservedPropertyName)(response))
+                        if (isReservedPropertyName(response))
                             return "Reserved property path (see https://docs.superblocks.com/applications/custom-components/faq#what-is-a-reserved-property)";
                         if (properties.some((v) => v.path === response))
                             return "Duplicate property path";
                         return true;
                     },
                 })).path;
-                const propertyType = (await (0, enquirer_1.prompt)({
+                const propertyType = (await prompt({
                     type: "select",
                     name: "type",
                     message: `What is the type of ${propertyPath}?`,
-                    choices: Object.entries(util_1.dataTypeDefinions).map(([k, v]) => ({
+                    choices: Object.entries(dataTypeDefinions).map(([k, v]) => ({
                         name: k,
                         message: v.prompt,
                         value: k,
                     })),
                     initial: 0,
                 })).type;
-                const showInPropsPanel = (await (0, enquirer_1.prompt)({
+                const showInPropsPanel = (await prompt({
                     name: "value",
                     type: "confirm",
                     message: "Should this property be shown in the properties panel?",
@@ -101,12 +100,12 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                 let propertiesPanelDisplay = undefined;
                 if (showInPropsPanel) {
                     this.log();
-                    this.log((0, colorette_1.bold)("Properties Panel Display Configuration"));
-                    const propertyLabel = (await (0, enquirer_1.prompt)({
+                    this.log(bold("Properties Panel Display Configuration"));
+                    const propertyLabel = (await prompt({
                         type: "input",
                         name: "label",
                         message: "What is the label of the property? (e.g. Tasks)",
-                        validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+                        validate: (response) => !isEmpty(response.trim()),
                     })).label.trim();
                     propertiesPanelDisplay = {
                         label: propertyLabel,
@@ -123,7 +122,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                     isExternallySettable: true,
                 });
                 this.log();
-                const addAnotherProperty = (await (0, enquirer_1.prompt)({
+                const addAnotherProperty = (await prompt({
                     type: "confirm",
                     name: "value",
                     message: "Do you want to add another property?",
@@ -135,32 +134,32 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
             }
         }
         this.log();
-        this.log(`${(0, colorette_1.cyanBright)("ℹ")} ${(0, colorette_1.bold)("Events")} represent the types of events that the component can trigger in Superblocks. Learn more about events: ${(0, colorette_1.magenta)("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
+        this.log(`${cyanBright("ℹ")} ${bold("Events")} represent the types of events that the component can trigger in Superblocks. Learn more about events: ${magenta("https://docs.superblocks.com/applications/custom-components/#properties--events")}`);
         this.log();
-        const hasEventHandlers = (await (0, enquirer_1.prompt)({
+        const hasEventHandlers = (await prompt({
             type: "confirm",
             name: "value",
-            message: `Does this component have ${(0, colorette_1.bold)("events")}? (e.g. a date picker component that triggers an On Change event)`,
+            message: `Does this component have ${bold("events")}? (e.g. a date picker component that triggers an On Change event)`,
             initial: false,
         })).value;
         const events = [];
         if (hasEventHandlers) {
             for (;;) {
-                const eventHandlerName = (await (0, enquirer_1.prompt)({
+                const eventHandlerName = (await prompt({
                     name: "value",
                     type: "input",
                     message: "What is the label of the event? (e.g. On Change)",
-                    validate: (response) => !(0, lodash_1.isEmpty)(response.trim()),
+                    validate: (response) => !isEmpty(response.trim()),
                 })).value.trim();
-                const eventHandlerPath = (await (0, enquirer_1.prompt)({
+                const eventHandlerPath = (await prompt({
                     name: "value",
                     message: "What is the path of the event? This will be used to trigger the event in your code (e.g. onChange)",
                     type: "input",
-                    initial: (0, util_1.suggestIdentifier)(eventHandlerName) || "onChange",
+                    initial: suggestIdentifier(eventHandlerName) || "onChange",
                     validate: (response) => {
-                        if (!(0, util_1.isValidIdentifier)(response))
+                        if (!isValidIdentifier(response))
                             return "Invalid identifier";
-                        if ((0, util_1.isReservedPropertyName)(response))
+                        if (isReservedPropertyName(response))
                             return "Reserved property path (see https://docs.superblocks.com/applications/custom-components/faq#what-is-a-reserved-property)";
                         if (events.some((v) => v.path === response))
                             return "Duplicate property path";
@@ -171,7 +170,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                     label: eventHandlerName,
                     path: eventHandlerPath,
                 });
-                const addAnotherEventHandler = (await (0, enquirer_1.prompt)({
+                const addAnotherEventHandler = (await prompt({
                     name: "value",
                     type: "confirm",
                     message: "Do you want to add another event?",
@@ -182,8 +181,8 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                 }
             }
         }
-        const configTs = (0, create_component_defaults_1.getDefaultConfigTs)({
-            id: (0, node_crypto_1.randomUUID)(),
+        const configTs = getDefaultConfigTs({
+            id: randomUUID(),
             name,
             displayName,
             propertiesRendered: properties
@@ -193,7 +192,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                 .map((eventHandler) => tsStringify(eventHandler))
                 .join(""),
         });
-        const componentTsx = (0, create_component_defaults_1.getDefaultComponentTsx)(properties, events.map((prop) => prop.path));
+        const componentTsx = getDefaultComponentTsx(properties, events.map((prop) => prop.path));
         if (isFirstTimeCreate) {
             await fs.copy(DEFAULT_PACKAGE_JSON_TEMPLATE_PATH, ".");
             // There is a very old npm bug where it won't publish .gitignore files
@@ -241,8 +240,8 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
                 },
             ],
         };
-        const configTs = (0, create_component_defaults_1.getDefaultConfigTs)({
-            id: (0, node_crypto_1.randomUUID)(),
+        const configTs = getDefaultConfigTs({
+            id: randomUUID(),
             name: response.name,
             displayName: response.displayName,
             propertiesRendered: response.properties
@@ -268,7 +267,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
         const { flags: parsedFlags } = await this.parse(CreateComponent);
         const isFirstTimeCreate = !(await fs.exists("package.json"));
         if (isFirstTimeCreate) {
-            this.log(`${(0, colorette_1.cyanBright)("ℹ")} Welcome to Custom Components! In order to help you get started, we’ve built an example To-Do List Component. You can use this component as a template as you build your own Custom Component. To work with this component, we recommend following along with our quickstart guide: ${(0, colorette_1.magenta)("https://docs.superblocks.com/applications/custom-components/quickstart")}`);
+            this.log(`${cyanBright("ℹ")} Welcome to Custom Components! In order to help you get started, we've built an example To-Do List Component. You can use this component as a template as you build your own Custom Component. To work with this component, we recommend following along with our quickstart guide: ${magenta("https://docs.superblocks.com/applications/custom-components/quickstart")}`);
             this.log();
         }
         let initExampleComponent = parsedFlags.example;
@@ -276,7 +275,7 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
             // if the example component flag is not set and this is the first time the user is creating a component, prompt the user
             this.log(`If you choose to generate the example component, you will not have to provide any additional inputs. You can re-run superblocks components create once you are ready to create your own component from scratch. `);
             this.log();
-            initExampleComponent = (await (0, enquirer_1.prompt)({
+            initExampleComponent = (await prompt({
                 name: "value",
                 type: "confirm",
                 message: "Would you like to generate an example custom component?",
@@ -286,42 +285,34 @@ class CreateComponent extends authenticated_command_1.AuthenticatedApplicationCo
         const response = initExampleComponent
             ? await this.initializeComponentByExample()
             : await this.initializeComponentByWizard(isFirstTimeCreate);
-        this.log((0, colorette_1.green)("Successfully created component! Added the following files:"));
+        this.log(green("Successfully created component! Added the following files:"));
         this.log();
-        const tree = core_1.ux.tree();
-        tree.insert("components");
-        tree.nodes.components.insert(response.name);
-        tree.nodes.components.nodes[response.name].insert("config.ts # update this file to manage your component's properties and events");
-        tree.nodes.components.nodes[response.name].insert("types.ts # this file contains your react component type definitions and is automatically updated while you run 'superblocks components watch'");
-        tree.nodes.components.nodes[response.name].insert("component.tsx # your component's react code");
-        tree.display();
+        const tree = `├─ components
+│ └─ ${response.name}
+│    ├─ config.ts # update this file to manage your component's properties and events
+│    ├─ types.ts # this file contains your react component type definitions and is automatically updated while you run 'superblocks components watch'
+│    └─ component.tsx # your component's react code`;
+        this.log(tree);
         this.log();
-        this.log(`${(0, colorette_1.green)("Remember to run $ ")}${(0, colorette_1.magenta)("superblocks components watch")}${(0, colorette_1.green)(" to watch for changes to your component files")}`);
+        this.log(`${green("Remember to run $ ")}${magenta("superblocks components watch")}${green(" to watch for changes to your component files")}`);
         this.log();
         this.log(`Edit your component's react code here:
-      ${(0, colorette_1.green)(`components/${response.name}/component.tsx`)}`);
+      ${green(`components/${response.name}/component.tsx`)}`);
         this.log();
         if (isFirstTimeCreate) {
-            core_1.ux.action.start("Installing dependencies...");
+            ux.action.start("Installing dependencies...");
             try {
-                await node_util_1.default.promisify(node_child_process_1.exec)("npm i");
+                await util.promisify(exec)("npm i");
             }
             catch {
-                core_1.ux.action.stop();
-                this.error((0, colorette_1.red)("Failed to install dependencies. Please run 'npm install' manually."));
+                ux.action.stop();
+                this.error(red("Failed to install dependencies. Please run 'npm install' manually."));
             }
-            core_1.ux.action.stop();
+            ux.action.stop();
         }
         const headers = {
-            [util_1.COMPONENT_EVENT_HEADER]: util_1.ComponentEvent.CREATE,
+            [COMPONENT_EVENT_HEADER]: ComponentEvent.CREATE,
         };
         this.registerComponents(headers);
     }
 }
-CreateComponent.description = "Creates a new Superblocks component in the current application folder";
-CreateComponent.flags = {
-    example: core_1.Flags.boolean({
-        description: "Create example component",
-    }),
-};
-exports.default = CreateComponent;

package/dist/commands/components/{register.d.ts → register.d.mts}

@@ -1,4 +1,4 @@
-import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
+import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
 export default class Register extends AuthenticatedApplicationCommand {
     static description: string;
     static examples: string[];

package/dist/commands/components/register.mjs

@@ -0,0 +1,12 @@
+import { COMPONENT_EVENT_HEADER, ComponentEvent } from "@superblocksteam/util";
+import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
+export default class Register extends AuthenticatedApplicationCommand {
+    static description = "Registers all local component config files";
+    static examples = ["superblocks components register"];
+    async run() {
+        const headers = {
+            [COMPONENT_EVENT_HEADER]: ComponentEvent.REGISTER,
+        };
+        await this.registerComponents(headers);
+    }
+}

package/dist/commands/components/{upload.d.ts → upload.d.mts}

@@ -1,9 +1,9 @@
-import { AuthenticatedApplicationCommand } from "../../common/authenticated-command";
+import { AuthenticatedApplicationCommand } from "../../common/authenticated-command.mjs";
 export default class Upload extends AuthenticatedApplicationCommand {
     static description: string;
     static examples: string[];
     static flags: {
-        branch: import("@oclif/core/lib/interfaces").OptionFlag<string | undefined, import("@oclif/core/lib/interfaces/parser").CustomOptions>;
+        branch: import("@oclif/core/interfaces").OptionFlag<string | undefined, import("@oclif/core/interfaces").CustomOptions>;
     };
     run(): Promise<void>;
 }