bb-relay 0.0.40 → 0.0.42

package/dist/editor.d.mts

@@ -71,6 +71,6 @@ interface TutorialHeader {
     body: string;
 }
 
-type WatchFSEvent = "updated" | "deleted" | "updated" | "add";
+type WatchFSEvent = "updated" | "deleted" | "add";
 
 export type { CopyArg, GitFileStatus, IconArg, MenuContent, Nav, Route, Settings, Shortcut, TutorialHeader, WatchFSEvent };

package/dist/editor.d.ts

@@ -71,6 +71,6 @@ interface TutorialHeader {
     body: string;
 }
 
-type WatchFSEvent = "updated" | "deleted" | "updated" | "add";
+type WatchFSEvent = "updated" | "deleted" | "add";
 
 export type { CopyArg, GitFileStatus, IconArg, MenuContent, Nav, Route, Settings, Shortcut, TutorialHeader, WatchFSEvent };

package/dist/index.d.mts

@@ -11,7 +11,7 @@ import './Wrapper-DWhYVa7F.mjs';
  */
 declare function injectStyles(css: string): () => void;
 
-type Permission = "file-system" | "storage" | "project" | "url" | "selection" | "git" | "token";
+type Permission = "file-system" | "project" | "git" | "dialog";
 type Manifest = {
     id: string;
     name: string;

package/dist/index.d.ts

@@ -11,7 +11,7 @@ import './Wrapper-DWhYVa7F.js';
  */
 declare function injectStyles(css: string): () => void;
 
-type Permission = "file-system" | "storage" | "project" | "url" | "selection" | "git" | "token";
+type Permission = "file-system" | "project" | "git" | "dialog";
 type Manifest = {
     id: string;
     name: string;

package/dist/plugin.d.mts

@@ -1,4 +1,4 @@
-import { CSSProperties } from 'react';
+import { CSSProperties, InputHTMLAttributes } from 'react';
 import { IconName } from 'lucide-react/dynamic';
 import { F as FolderContent, b as FolderStat, a as FileStat } from './FolderStat-Bhmwwc0t.mjs';
 import { F as FileContent } from './FileContent-CXlulSZq.mjs';
@@ -163,6 +163,41 @@ type RenderStatusType = {
     onClick?: () => void;
 };
 
+type Primitive = string | number;
+type InputOverlay = {
+    type: "input";
+    inputType?: InputHTMLAttributes<HTMLInputElement>["type"];
+    name: string;
+};
+type CheckboxOverlay = {
+    type: "checkbox";
+    name: string;
+    options: Primitive[];
+};
+type RadioOverlay = {
+    type: "radio";
+    name: string;
+    options: Primitive[];
+};
+type TextAreaOverlay = {
+    type: "textarea";
+    name: string;
+};
+type SubmitOverlay = {
+    type: "submit";
+    text: string;
+};
+type TextOverlay = {
+    type: "text";
+    content: string;
+};
+type ContainerOverlay = {
+    type: "container";
+    children: OverlayType[];
+    style?: CSSProperties;
+};
+type OverlayType = InputOverlay | RadioOverlay | CheckboxOverlay | SubmitOverlay | TextAreaOverlay | TextOverlay | ContainerOverlay;
+
 type Store<T extends Record<string, unknown>> = {
     get(): T;
     set(next: SetState<T>): void;
@@ -185,7 +220,61 @@ type EditorAPI = {
         copyFile: (filePath: string, destination: string) => Promise<Result<string>>;
         listFiles: (glob?: string) => Promise<Result<string[]>>;
     };
+    git?: {
+        commit: (arg: {
+            files: string[];
+            message: string;
+            email?: string;
+        }) => Promise<Result>;
+    };
+    dialog?: {
+        selectFile: () => Promise<Result<string[]>>;
+        selectFolder: () => Promise<Result<string[]>>;
+    };
+    project?: {
+        /**
+         * To create a new project
+         * @param dir This should be derived from `dialog.selectFolder`
+         * @param project The project config that you want to create
+         */
+        createProject: (dir: string, project: Project["insert"]) => Promise<Result>;
+        /**
+         * Use this to update current project information
+         * @param project
+         * @returns
+         */
+        updateProject: (project: Project["update"]) => Promise<Result>;
+    };
+};
+type EventMap = {
+    project: {
+        /**
+         * changed: indicates a different project is selected (change in working directory)
+         * created: a new project
+         */
+        type: "changed" | "created";
+        project: Project["insert"] & {
+            id?: string;
+        };
+    };
+    file: {
+        /**
+         * Indicates a file is created, updated, selected or deleted
+         * It will only return "null" for selected, if selected is not a file
+         * Git refers to file being selected in git mode
+         */
+        type: "created" | "updated" | "selected" | "deleted" | "git";
+        filePath: string | null;
+    };
+    ping: {
+        /**
+         * Indicates the source of the ping
+         */
+        type: "main" | "overlay";
+        payload: unknown;
+    };
 };
+type EventSubs = keyof EventMap;
 type SetState<T extends Record<string, unknown>> = Partial<T> | ((arg: T) => T);
 declare abstract class Plugin<T extends Record<string, unknown>> {
     /** CONSTANTS */
@@ -260,7 +349,7 @@ declare abstract class Plugin<T extends Record<string, unknown>> {
      * So all you need to do is use form inputs for the part that you want to get
      * back as response
      */
-    protected renderOverlay(overlay: ElementInstruction): void;
+    protected renderOverlay(overlay: OverlayType): void;
     protected onOverlayResponse(callback: (arg: unknown) => void): void;
     destroy(): void;
     private getPluginChannel;
@@ -268,19 +357,7 @@ declare abstract class Plugin<T extends Record<string, unknown>> {
     private unregisterHandler;
     private registerSubscription;
     protected off(event: string): void;
-    protected on(event: "project-selected", callback: (arg: Project["insert"] & {
-        workingDir: string;
-        id?: string;
-    }) => void): void;
-    protected on(event: "new-project", callback: (arg: Project["insert"] & {
-        workingDir: string;
-        id?: string;
-    }) => void): void;
-    protected on(event: "file-selected", callback: (filePath: string | null) => void): void;
-    protected on(event: "file-created", callback: (filePath: string) => void): void;
-    protected on(event: "file-changed", callback: (filePath: string) => void): void;
-    protected on(event: "file-deleted", callback: (filePath: string) => void): void;
-    protected on(event: "ping", callback: (arg: unknown) => void): void;
+    protected on<K extends EventSubs>(event: K, callback: (res: EventMap[K] | null) => void): void;
     renderStatusBar?(): RenderStatusType | null;
     private registerStatus;
     protected setState(param: SetState<T>): void;
@@ -297,4 +374,4 @@ type Message = {
 
 declare const getPluginChannel: (event: string, pluginId: string) => string;
 
-export { type EditorAPI, type ElementInstruction, type InputInstruction, type Message, type PluginElement, type RenderStatusType, type SetState, type Store, type TextVariant, type TextareaInstruction, Plugin as default, getPluginChannel };
+export { type EditorAPI, type ElementInstruction, type EventMap, type InputInstruction, type Message, type OverlayType, type PluginElement, type RenderStatusType, type SetState, type Store, type TextVariant, type TextareaInstruction, Plugin as default, getPluginChannel };

package/dist/plugin.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties } from 'react';
+import { CSSProperties, InputHTMLAttributes } from 'react';
 import { IconName } from 'lucide-react/dynamic';
 import { F as FolderContent, b as FolderStat, a as FileStat } from './FolderStat-Bhmwwc0t.js';
 import { F as FileContent } from './FileContent-CXlulSZq.js';
@@ -163,6 +163,41 @@ type RenderStatusType = {
     onClick?: () => void;
 };
 
+type Primitive = string | number;
+type InputOverlay = {
+    type: "input";
+    inputType?: InputHTMLAttributes<HTMLInputElement>["type"];
+    name: string;
+};
+type CheckboxOverlay = {
+    type: "checkbox";
+    name: string;
+    options: Primitive[];
+};
+type RadioOverlay = {
+    type: "radio";
+    name: string;
+    options: Primitive[];
+};
+type TextAreaOverlay = {
+    type: "textarea";
+    name: string;
+};
+type SubmitOverlay = {
+    type: "submit";
+    text: string;
+};
+type TextOverlay = {
+    type: "text";
+    content: string;
+};
+type ContainerOverlay = {
+    type: "container";
+    children: OverlayType[];
+    style?: CSSProperties;
+};
+type OverlayType = InputOverlay | RadioOverlay | CheckboxOverlay | SubmitOverlay | TextAreaOverlay | TextOverlay | ContainerOverlay;
+
 type Store<T extends Record<string, unknown>> = {
     get(): T;
     set(next: SetState<T>): void;
@@ -185,7 +220,61 @@ type EditorAPI = {
         copyFile: (filePath: string, destination: string) => Promise<Result<string>>;
         listFiles: (glob?: string) => Promise<Result<string[]>>;
     };
+    git?: {
+        commit: (arg: {
+            files: string[];
+            message: string;
+            email?: string;
+        }) => Promise<Result>;
+    };
+    dialog?: {
+        selectFile: () => Promise<Result<string[]>>;
+        selectFolder: () => Promise<Result<string[]>>;
+    };
+    project?: {
+        /**
+         * To create a new project
+         * @param dir This should be derived from `dialog.selectFolder`
+         * @param project The project config that you want to create
+         */
+        createProject: (dir: string, project: Project["insert"]) => Promise<Result>;
+        /**
+         * Use this to update current project information
+         * @param project
+         * @returns
+         */
+        updateProject: (project: Project["update"]) => Promise<Result>;
+    };
+};
+type EventMap = {
+    project: {
+        /**
+         * changed: indicates a different project is selected (change in working directory)
+         * created: a new project
+         */
+        type: "changed" | "created";
+        project: Project["insert"] & {
+            id?: string;
+        };
+    };
+    file: {
+        /**
+         * Indicates a file is created, updated, selected or deleted
+         * It will only return "null" for selected, if selected is not a file
+         * Git refers to file being selected in git mode
+         */
+        type: "created" | "updated" | "selected" | "deleted" | "git";
+        filePath: string | null;
+    };
+    ping: {
+        /**
+         * Indicates the source of the ping
+         */
+        type: "main" | "overlay";
+        payload: unknown;
+    };
 };
+type EventSubs = keyof EventMap;
 type SetState<T extends Record<string, unknown>> = Partial<T> | ((arg: T) => T);
 declare abstract class Plugin<T extends Record<string, unknown>> {
     /** CONSTANTS */
@@ -260,7 +349,7 @@ declare abstract class Plugin<T extends Record<string, unknown>> {
      * So all you need to do is use form inputs for the part that you want to get
      * back as response
      */
-    protected renderOverlay(overlay: ElementInstruction): void;
+    protected renderOverlay(overlay: OverlayType): void;
     protected onOverlayResponse(callback: (arg: unknown) => void): void;
     destroy(): void;
     private getPluginChannel;
@@ -268,19 +357,7 @@ declare abstract class Plugin<T extends Record<string, unknown>> {
     private unregisterHandler;
     private registerSubscription;
     protected off(event: string): void;
-    protected on(event: "project-selected", callback: (arg: Project["insert"] & {
-        workingDir: string;
-        id?: string;
-    }) => void): void;
-    protected on(event: "new-project", callback: (arg: Project["insert"] & {
-        workingDir: string;
-        id?: string;
-    }) => void): void;
-    protected on(event: "file-selected", callback: (filePath: string | null) => void): void;
-    protected on(event: "file-created", callback: (filePath: string) => void): void;
-    protected on(event: "file-changed", callback: (filePath: string) => void): void;
-    protected on(event: "file-deleted", callback: (filePath: string) => void): void;
-    protected on(event: "ping", callback: (arg: unknown) => void): void;
+    protected on<K extends EventSubs>(event: K, callback: (res: EventMap[K] | null) => void): void;
     renderStatusBar?(): RenderStatusType | null;
     private registerStatus;
     protected setState(param: SetState<T>): void;
@@ -297,4 +374,4 @@ type Message = {
 
 declare const getPluginChannel: (event: string, pluginId: string) => string;
 
-export { type EditorAPI, type ElementInstruction, type InputInstruction, type Message, type PluginElement, type RenderStatusType, type SetState, type Store, type TextVariant, type TextareaInstruction, Plugin as default, getPluginChannel };
+export { type EditorAPI, type ElementInstruction, type EventMap, type InputInstruction, type Message, type OverlayType, type PluginElement, type RenderStatusType, type SetState, type Store, type TextVariant, type TextareaInstruction, Plugin as default, getPluginChannel };

package/dist/plugin.js

@@ -169,7 +169,9 @@ var Plugin = class {
     this.subscriptions.delete(channel);
   }
   on(event, callback) {
-    this.registerSubscription(event, callback);
+    this.registerSubscription(event, (payload) => {
+      callback(payload);
+    });
   }
   registerStatus() {
     const arg = _optionalChain([this, 'access', _5 => _5.renderStatusBar, 'optionalCall', _6 => _6()]);

package/dist/plugin.mjs

@@ -169,7 +169,9 @@ var Plugin = class {
     this.subscriptions.delete(channel);
   }
   on(event, callback) {
-    this.registerSubscription(event, callback);
+    this.registerSubscription(event, (payload) => {
+      callback(payload);
+    });
   }
   registerStatus() {
     const arg = this.renderStatusBar?.();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bb-relay",
-  "version": "0.0.40",
+  "version": "0.0.42",
   "description": "For managing bb-editor extension",
   "license": "ISC",
   "author": "Ade Adeola",

package/src/lib/plugin/OverlayType.ts

@@ -0,0 +1,53 @@
+import type { CSSProperties, InputHTMLAttributes } from "react";
+
+type Primitive = string | number;
+
+type InputOverlay = {
+  type: "input";
+  inputType?: InputHTMLAttributes<HTMLInputElement>["type"];
+  name: string;
+};
+
+type CheckboxOverlay = {
+  type: "checkbox";
+  name: string;
+  options: Primitive[];
+};
+
+type RadioOverlay = {
+  type: "radio";
+  name: string;
+  options: Primitive[];
+};
+
+type TextAreaOverlay = {
+  type: "textarea";
+  name: string;
+};
+
+type SubmitOverlay = {
+  type: "submit";
+  text: string;
+};
+
+type TextOverlay = {
+  type: "text";
+  content: string;
+};
+
+type ContainerOverlay = {
+  type: "container";
+  children: OverlayType[];
+  style?: CSSProperties;
+};
+
+type OverlayType =
+  | InputOverlay
+  | RadioOverlay
+  | CheckboxOverlay
+  | SubmitOverlay
+  | TextAreaOverlay
+  | TextOverlay
+  | ContainerOverlay;
+
+export default OverlayType;

package/src/lib/plugin/index.ts

@@ -12,6 +12,7 @@ import {
 import { Project } from "@/database";
 import equal from "fast-deep-equal";
 import { RenderStatusType } from "./RenderStatusType";
+import OverlayType from "./OverlayType";
 
 export type Store<T extends Record<string, unknown>> = {
   get(): T;
@@ -42,20 +43,62 @@ export type EditorAPI = {
     ) => Promise<Result<string>>;
     listFiles: (glob?: string) => Promise<Result<string[]>>;
   };
-  // project: getProjectInfo, workingDirectory
-  // dialog: selectFolder, selectFile
-  // net (should be able to use "fetch api"): download, stream
-  // git
+  git?: {
+    commit: (arg: {
+      files: string[];
+      message: string;
+      email?: string;
+    }) => Promise<Result>;
+  };
+  dialog?: {
+    selectFile: () => Promise<Result<string[]>>;
+    selectFolder: () => Promise<Result<string[]>>;
+  };
+  project?: {
+    /**
+     * To create a new project
+     * @param dir This should be derived from `dialog.selectFolder`
+     * @param project The project config that you want to create
+     */
+    createProject: (dir: string, project: Project["insert"]) => Promise<Result>;
+    /**
+     * Use this to update current project information
+     * @param project
+     * @returns
+     */
+    updateProject: (project: Project["update"]) => Promise<Result>;
+  };
+};
+
+export type EventMap = {
+  project: {
+    /**
+     * changed: indicates a different project is selected (change in working directory)
+     * created: a new project
+     */
+    type: "changed" | "created";
+    project: Project["insert"] & { id?: string };
+  };
+
+  file: {
+    /**
+     * Indicates a file is created, updated, selected or deleted
+     * It will only return "null" for selected, if selected is not a file
+     * Git refers to file being selected in git mode
+     */
+    type: "created" | "updated" | "selected" | "deleted" | "git";
+    filePath: string | null;
+  };
+  ping: {
+    /**
+     * Indicates the source of the ping
+     */
+    type: "main" | "overlay";
+    payload: unknown;
+  };
 };
 
-type EventSubs =
-  | "project-selected"
-  | "new-project"
-  | "file-selected"
-  | "file-created"
-  | "file-changed"
-  | "file-deleted"
-  | "ping";
+type EventSubs = keyof EventMap;
 
 export type SetState<T extends Record<string, unknown>> =
   | Partial<T>
@@ -251,7 +294,7 @@ export abstract class Plugin<T extends Record<string, unknown>> {
    * back as response
    */
 
-  protected renderOverlay(overlay: ElementInstruction) {
+  protected renderOverlay(overlay: OverlayType) {
     this.sendMessage({ type: "overlay", arg: overlay });
   }
 
@@ -318,39 +361,13 @@ export abstract class Plugin<T extends Record<string, unknown>> {
     this.subscriptions.delete(channel);
   }
 
-  protected on(
-    event: "project-selected",
-    callback: (
-      arg: Project["insert"] & { workingDir: string; id?: string },
-    ) => void,
-  ): void;
-  protected on(
-    event: "new-project",
-    callback: (
-      arg: Project["insert"] & { workingDir: string; id?: string },
-    ) => void,
-  ): void;
-  protected on(
-    event: "file-selected",
-    callback: (filePath: string | null) => void,
-  ): void;
-  protected on(
-    event: "file-created",
-    callback: (filePath: string) => void,
-  ): void;
-  protected on(
-    event: "file-changed",
-    callback: (filePath: string) => void,
-  ): void;
-  protected on(
-    event: "file-deleted",
-    callback: (filePath: string) => void,
-  ): void;
-
-  protected on(event: "ping", callback: (arg: unknown) => void): void;
-
-  protected on(event: EventSubs, callback: (arg: any) => void): void {
-    this.registerSubscription(event, callback);
+  protected on<K extends EventSubs>(
+    event: K,
+    callback: (res: EventMap[K] | null) => void,
+  ): void {
+    this.registerSubscription(event, (payload: any) => {
+      callback(payload);
+    });
   }
 
   // -----------------------------

package/src/plugin.ts

@@ -1,4 +1,4 @@
-import { EditorAPI, Plugin, SetState, Store } from "./lib/plugin";
+import { EditorAPI, EventMap, Plugin, SetState, Store } from "./lib/plugin";
 import { Message } from "./lib/plugin/Message";
 import { ElementInstruction } from "./lib/plugin/ElementInstruction";
 import { InputInstruction } from "./lib/plugin/ElementInstruction/InputInstruction";
@@ -7,6 +7,7 @@ import { TextVariant } from "./lib/plugin/ElementInstruction/TextInstruction";
 import { getPluginChannel } from "./lib/plugin/getPluginChannel";
 import { PluginElement } from "./lib/plugin/PluginElement";
 import { RenderStatusType } from "./lib/plugin/RenderStatusType";
+import OverlayType from "./lib/plugin/OverlayType";
 
 export type {
   RenderStatusType,
@@ -19,6 +20,8 @@ export type {
   InputInstruction,
   TextareaInstruction,
   Message,
+  EventMap,
+  OverlayType,
 };
 
 export { getPluginChannel };

package/src/types/editor/Manifest.ts

@@ -1,13 +1,6 @@
 import { FileContent } from "@/editor";
 
-type Permission =
-  | "file-system"
-  | "storage"
-  | "project"
-  | "url"
-  | "selection"
-  | "git"
-  | "token";
+type Permission = "file-system" | "project" | "git" | "dialog";
 
 export type Manifest = {
   id: string;

package/src/types/editor/WatchFSEvent.ts

@@ -1 +1 @@
-export type WatchFSEvent = "updated" | "deleted" | "updated" | "add";
+export type WatchFSEvent = "updated" | "deleted" | "add";