@arcanejs/toolkit 0.0.2 → 0.1.0

package/dist/backend/components/slider-button.js

@@ -0,0 +1,161 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/backend/components/slider-button.ts
+var slider_button_exports = {};
+__export(slider_button_exports, {
+  SliderButton: () => SliderButton
+});
+module.exports = __toCommonJS(slider_button_exports);
+
+// src/backend/components/base.ts
+var Base = class {
+  /** @hidden */
+  parent = null;
+  /** @hidden */
+  defaultProps;
+  /** @hidden */
+  _props;
+  constructor(defaultProps, props) {
+    this.defaultProps = defaultProps;
+    this._props = Object.freeze({
+      ...defaultProps,
+      ...props
+    });
+  }
+  get props() {
+    return this._props;
+  }
+  set props(props) {
+    this.setProps(props);
+  }
+  setProps = (props) => {
+    this._props = Object.freeze({
+      ...this.defaultProps,
+      ...props
+    });
+    this.updateTree();
+  };
+  updateProps = (updates) => {
+    this._props = Object.freeze({
+      ...this._props,
+      ...updates
+    });
+    this.updateTree();
+  };
+  /** @hidden */
+  setParent(parent) {
+    if (this.parent && this.parent !== parent) {
+      this.parent.removeChild(this);
+    }
+    this.parent = parent;
+  }
+  /** @hidden */
+  updateTree() {
+    if (this.parent) this.parent.updateTree();
+  }
+  /** @hidden */
+  handleMessage(message) {
+    console.log("Component Received Message:", message);
+  }
+  routeMessage(_idMap, _message) {
+  }
+};
+var EventEmitter = class {
+  listeners = /* @__PURE__ */ new Map();
+  addListener = (type, listener) => {
+    let set = this.listeners.get(type);
+    if (!set) {
+      set = /* @__PURE__ */ new Set();
+      this.listeners.set(type, set);
+    }
+    set.add(listener);
+  };
+  removeListener = (type, listener) => {
+    this.listeners.get(type)?.delete(listener);
+  };
+  emit = (type, ...args) => {
+    return Promise.all(
+      [...this.listeners.get(type) || []].map(
+        (l) => new Promise((resolve, reject) => {
+          try {
+            resolve(l(...args));
+          } catch (e) {
+            reject(e);
+          }
+        })
+      )
+    );
+  };
+};
+
+// src/backend/components/slider-button.ts
+var DEFAULT_PROPS = {
+  value: null,
+  min: 0,
+  max: 255,
+  step: 5,
+  mode: "writeBack"
+};
+var SliderButton = class extends Base {
+  /** @hidden */
+  events = new EventEmitter();
+  constructor(props) {
+    super(DEFAULT_PROPS, props);
+  }
+  addListener = this.events.addListener;
+  removeListener = this.events.removeListener;
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "slider_button",
+      key: idMap.getId(this),
+      min: this.props.min,
+      max: this.props.max,
+      step: this.props.step,
+      value: this.props.value
+    };
+  }
+  /** @hidden */
+  handleMessage(message) {
+    if (message.component !== "slider_button") return;
+    const newValue = this.sanitizeNumber(message.value);
+    if (this.props.value === newValue) return;
+    if (this.props.mode === "writeBack") {
+      this.updateProps({ value: newValue });
+    }
+    this.events.emit("change", newValue);
+  }
+  setValue(value) {
+    const newValue = this.sanitizeNumber(value);
+    if (newValue === this.props.value) return;
+    this.updateProps({ value });
+    this.updateTree();
+  }
+  sanitizeNumber(value) {
+    const i = Math.round((value - this.props.min) / this.props.step);
+    const v = i * this.props.step + this.props.min;
+    const clampedValue = Math.max(this.props.min, Math.min(this.props.max, v));
+    return clampedValue;
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SliderButton
+});

package/dist/backend/components/slider-button.mjs

@@ -0,0 +1,7 @@
+import {
+  SliderButton
+} from "../../chunk-HVFTRNLQ.mjs";
+import "../../chunk-HF77PS7J.mjs";
+export {
+  SliderButton
+};

package/dist/backend/components/switch.d.mts

@@ -0,0 +1,24 @@
+import { e as Base, L as Listenable, I as IDMap, g as Component, d as ClientComponentMessage } from '../../base-BJAPu0O1.mjs';
+import '@arcanejs/diff';
+
+type Events = {
+    change: (state: 'on' | 'off') => void | Promise<void>;
+};
+type InternalProps = {
+    state: 'on' | 'off';
+};
+type Props = Partial<InternalProps>;
+declare class Switch extends Base<InternalProps> implements Listenable<Events> {
+    /** @hidden */
+    private readonly events;
+    constructor(props?: Props);
+    addListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    /** @hidden */
+    getProtoInfo(idMap: IDMap): Component;
+    /** @hidden */
+    handleMessage(message: ClientComponentMessage): void;
+    setValue(state: 'on' | 'off'): void;
+}
+
+export { type Events, type Props, Switch };

package/dist/backend/components/switch.d.ts

@@ -0,0 +1,24 @@
+import { e as Base, L as Listenable, I as IDMap, g as Component, d as ClientComponentMessage } from '../../base-BJAPu0O1.js';
+import '@arcanejs/diff';
+
+type Events = {
+    change: (state: 'on' | 'off') => void | Promise<void>;
+};
+type InternalProps = {
+    state: 'on' | 'off';
+};
+type Props = Partial<InternalProps>;
+declare class Switch extends Base<InternalProps> implements Listenable<Events> {
+    /** @hidden */
+    private readonly events;
+    constructor(props?: Props);
+    addListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    /** @hidden */
+    getProtoInfo(idMap: IDMap): Component;
+    /** @hidden */
+    handleMessage(message: ClientComponentMessage): void;
+    setValue(state: 'on' | 'off'): void;
+}
+
+export { type Events, type Props, Switch };

package/dist/backend/components/switch.js

@@ -0,0 +1,144 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/backend/components/switch.ts
+var switch_exports = {};
+__export(switch_exports, {
+  Switch: () => Switch
+});
+module.exports = __toCommonJS(switch_exports);
+
+// src/backend/components/base.ts
+var Base = class {
+  /** @hidden */
+  parent = null;
+  /** @hidden */
+  defaultProps;
+  /** @hidden */
+  _props;
+  constructor(defaultProps, props) {
+    this.defaultProps = defaultProps;
+    this._props = Object.freeze({
+      ...defaultProps,
+      ...props
+    });
+  }
+  get props() {
+    return this._props;
+  }
+  set props(props) {
+    this.setProps(props);
+  }
+  setProps = (props) => {
+    this._props = Object.freeze({
+      ...this.defaultProps,
+      ...props
+    });
+    this.updateTree();
+  };
+  updateProps = (updates) => {
+    this._props = Object.freeze({
+      ...this._props,
+      ...updates
+    });
+    this.updateTree();
+  };
+  /** @hidden */
+  setParent(parent) {
+    if (this.parent && this.parent !== parent) {
+      this.parent.removeChild(this);
+    }
+    this.parent = parent;
+  }
+  /** @hidden */
+  updateTree() {
+    if (this.parent) this.parent.updateTree();
+  }
+  /** @hidden */
+  handleMessage(message) {
+    console.log("Component Received Message:", message);
+  }
+  routeMessage(_idMap, _message) {
+  }
+};
+var EventEmitter = class {
+  listeners = /* @__PURE__ */ new Map();
+  addListener = (type, listener) => {
+    let set = this.listeners.get(type);
+    if (!set) {
+      set = /* @__PURE__ */ new Set();
+      this.listeners.set(type, set);
+    }
+    set.add(listener);
+  };
+  removeListener = (type, listener) => {
+    this.listeners.get(type)?.delete(listener);
+  };
+  emit = (type, ...args) => {
+    return Promise.all(
+      [...this.listeners.get(type) || []].map(
+        (l) => new Promise((resolve, reject) => {
+          try {
+            resolve(l(...args));
+          } catch (e) {
+            reject(e);
+          }
+        })
+      )
+    );
+  };
+};
+
+// src/backend/components/switch.ts
+var DEFAULT_PROPS = {
+  state: "off"
+};
+var Switch = class extends Base {
+  /** @hidden */
+  events = new EventEmitter();
+  constructor(props) {
+    super(DEFAULT_PROPS, props);
+  }
+  addListener = this.events.addListener;
+  removeListener = this.events.removeListener;
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "switch",
+      key: idMap.getId(this),
+      state: this.props.state
+    };
+  }
+  /** @hidden */
+  handleMessage(message) {
+    if (message.component === "switch") {
+      const state = this.props.state === "on" ? "off" : "on";
+      this.updateProps({ state });
+      this.events.emit("change", state);
+    }
+  }
+  setValue(state) {
+    if (state === this.props.state) return;
+    this.updateProps({ state });
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Switch
+});

package/dist/backend/components/switch.mjs

@@ -0,0 +1,7 @@
+import {
+  Switch
+} from "../../chunk-37VNFO5S.mjs";
+import "../../chunk-HF77PS7J.mjs";
+export {
+  Switch
+};

package/dist/backend/components/tabs.d.mts

@@ -0,0 +1,28 @@
+import { B as BaseParent, a as Component, I as IDMap, T as TabComponent, i as TabsComponent } from '../../base-BJAPu0O1.mjs';
+import '@arcanejs/diff';
+
+type TabDefinition = {
+    name: string;
+    component: Component;
+};
+type InternalTabProps = {
+    name: string;
+};
+type TabProps = InternalTabProps;
+declare class Tab extends BaseParent<InternalTabProps> {
+    validateChildren: (children: Component[]) => void;
+    /** @hidden */
+    getProtoInfo: (idMap: IDMap) => TabComponent;
+}
+type InternalTabsProps = Record<never, never>;
+type TabsProps = InternalTabsProps;
+declare class Tabs extends BaseParent<InternalTabsProps> {
+    validateChildren: (children: Component[]) => void;
+    constructor(props?: TabsProps);
+    addTabs(...tabs: TabDefinition[]): void;
+    addTab<C extends Component>(name: string, component: C): C;
+    /** @hidden */
+    getProtoInfo(idMap: IDMap): TabsComponent;
+}
+
+export { Tab, type TabProps, Tabs, type TabsProps };

package/dist/backend/components/tabs.d.ts

@@ -0,0 +1,28 @@
+import { B as BaseParent, a as Component, I as IDMap, T as TabComponent, i as TabsComponent } from '../../base-BJAPu0O1.js';
+import '@arcanejs/diff';
+
+type TabDefinition = {
+    name: string;
+    component: Component;
+};
+type InternalTabProps = {
+    name: string;
+};
+type TabProps = InternalTabProps;
+declare class Tab extends BaseParent<InternalTabProps> {
+    validateChildren: (children: Component[]) => void;
+    /** @hidden */
+    getProtoInfo: (idMap: IDMap) => TabComponent;
+}
+type InternalTabsProps = Record<never, never>;
+type TabsProps = InternalTabsProps;
+declare class Tabs extends BaseParent<InternalTabsProps> {
+    validateChildren: (children: Component[]) => void;
+    constructor(props?: TabsProps);
+    addTabs(...tabs: TabDefinition[]): void;
+    addTab<C extends Component>(name: string, component: C): C;
+    /** @hidden */
+    getProtoInfo(idMap: IDMap): TabsComponent;
+}
+
+export { Tab, type TabProps, Tabs, type TabsProps };

package/dist/backend/components/tabs.js

@@ -0,0 +1,209 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/backend/components/tabs.ts
+var tabs_exports = {};
+__export(tabs_exports, {
+  Tab: () => Tab,
+  Tabs: () => Tabs
+});
+module.exports = __toCommonJS(tabs_exports);
+
+// src/backend/components/base.ts
+var Base = class {
+  /** @hidden */
+  parent = null;
+  /** @hidden */
+  defaultProps;
+  /** @hidden */
+  _props;
+  constructor(defaultProps, props) {
+    this.defaultProps = defaultProps;
+    this._props = Object.freeze({
+      ...defaultProps,
+      ...props
+    });
+  }
+  get props() {
+    return this._props;
+  }
+  set props(props) {
+    this.setProps(props);
+  }
+  setProps = (props) => {
+    this._props = Object.freeze({
+      ...this.defaultProps,
+      ...props
+    });
+    this.updateTree();
+  };
+  updateProps = (updates) => {
+    this._props = Object.freeze({
+      ...this._props,
+      ...updates
+    });
+    this.updateTree();
+  };
+  /** @hidden */
+  setParent(parent) {
+    if (this.parent && this.parent !== parent) {
+      this.parent.removeChild(this);
+    }
+    this.parent = parent;
+  }
+  /** @hidden */
+  updateTree() {
+    if (this.parent) this.parent.updateTree();
+  }
+  /** @hidden */
+  handleMessage(message) {
+    console.log("Component Received Message:", message);
+  }
+  routeMessage(_idMap, _message) {
+  }
+};
+var BaseParent = class extends Base {
+  /** @hidden */
+  children = [];
+  appendChildren = (...children) => {
+    for (const c of children) {
+      const newChildren = [...this.children.filter((ch) => ch !== c), c];
+      this.validateChildren(newChildren);
+      this.children = Object.freeze(newChildren);
+      c.setParent(this);
+    }
+    this.updateTree();
+    return children;
+  };
+  appendChild = (child) => {
+    this.appendChildren(child);
+    return child;
+  };
+  removeChild = (component) => {
+    const match = this.children.findIndex((c) => c === component);
+    if (match >= 0) {
+      const removingChild = this.children[match];
+      const newChildren = [
+        ...this.children.slice(0, match),
+        ...this.children.slice(match + 1)
+      ];
+      this.validateChildren(newChildren);
+      this.children = Object.freeze(newChildren);
+      removingChild?.setParent(null);
+      this.updateTree();
+    }
+  };
+  removeAllChildren = () => {
+    this.children.map((c) => c.setParent(null));
+    this.children = Object.freeze([]);
+    this.updateTree();
+  };
+  /**
+   * Return all children components that messages need to be routed to
+   */
+  getChildren = () => this.children;
+  /**
+   * TODO: we can do this better, right now it broadcasts the message to all
+   * components of the tree
+   *
+   * @hidden
+   */
+  routeMessage(idMap, message) {
+    if (idMap.getId(this) === message.componentKey) {
+      this.handleMessage(message);
+    } else {
+      for (const c of this.children) {
+        if (idMap.getId(c) === message.componentKey) {
+          c.handleMessage(message);
+        } else {
+          c.routeMessage(idMap, message);
+        }
+      }
+    }
+  }
+  insertBefore(child, beforeChild) {
+    const filteredChildren = this.children.filter((c) => c !== child);
+    let match = filteredChildren.findIndex((c) => c === beforeChild);
+    console.log("match", match);
+    if (match === -1) {
+      match = filteredChildren.length;
+    }
+    const newChildren = [
+      ...filteredChildren.slice(0, match),
+      child,
+      ...filteredChildren.slice(match)
+    ];
+    this.validateChildren(newChildren);
+    this.children = Object.freeze(newChildren);
+    child.setParent(this);
+    this.updateTree();
+  }
+};
+
+// src/backend/components/tabs.ts
+var Tab = class extends BaseParent {
+  validateChildren = (children) => {
+    if (children.length > 1) {
+      throw new Error("Tab can only have one child");
+    }
+  };
+  /** @hidden */
+  getProtoInfo = (idMap) => ({
+    component: "tab",
+    key: idMap.getId(this),
+    name: this.props.name,
+    child: this.getChildren().slice(0, 1).map((c) => c.getProtoInfo(idMap))[0]
+  });
+};
+var Tabs = class extends BaseParent {
+  validateChildren = (children) => {
+    for (const child of children) {
+      if (!(child instanceof Tab)) {
+        throw new Error("Tabs can only have Tab children");
+      }
+    }
+  };
+  constructor(props) {
+    super({}, { ...props });
+  }
+  addTabs(...tabs) {
+    for (const t of tabs) {
+      const tab = new Tab({ name: t.name });
+      tab.appendChildren(t.component);
+      this.appendChild(tab);
+    }
+  }
+  addTab(name, component) {
+    this.addTabs({ name, component });
+    return component;
+  }
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "tabs",
+      key: idMap.getId(this),
+      tabs: this.getChildren().map((c) => c.getProtoInfo(idMap))
+    };
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Tab,
+  Tabs
+});

package/dist/backend/components/tabs.mjs

@@ -0,0 +1,9 @@
+import {
+  Tab,
+  Tabs
+} from "../../chunk-3ZBM7Q4A.mjs";
+import "../../chunk-HF77PS7J.mjs";
+export {
+  Tab,
+  Tabs
+};

package/dist/backend/components/text-input.d.mts

@@ -0,0 +1,26 @@
+import { e as Base, L as Listenable, I as IDMap, g as Component, d as ClientComponentMessage } from '../../base-BJAPu0O1.mjs';
+import '@arcanejs/diff';
+
+type Events = {
+    change: (value: string) => void | Promise<void>;
+};
+type InternalProps = {
+    value: string | null;
+};
+type Props = Partial<InternalProps>;
+declare class TextInput extends Base<InternalProps> implements Listenable<Events> {
+    /** @hidden */
+    private readonly events;
+    constructor(props?: Props);
+    addListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    /** @hidden */
+    getProtoInfo: (idMap: IDMap) => Component;
+    /** @hidden */
+    handleMessage: (message: ClientComponentMessage) => void;
+    getValue: () => string | null;
+    getValidatedValue: <T>(validator: (text: string) => T) => null | T;
+    setValue: (value: string) => void;
+}
+
+export { type Events, type Props, TextInput };

package/dist/backend/components/text-input.d.ts

@@ -0,0 +1,26 @@
+import { e as Base, L as Listenable, I as IDMap, g as Component, d as ClientComponentMessage } from '../../base-BJAPu0O1.js';
+import '@arcanejs/diff';
+
+type Events = {
+    change: (value: string) => void | Promise<void>;
+};
+type InternalProps = {
+    value: string | null;
+};
+type Props = Partial<InternalProps>;
+declare class TextInput extends Base<InternalProps> implements Listenable<Events> {
+    /** @hidden */
+    private readonly events;
+    constructor(props?: Props);
+    addListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
+    /** @hidden */
+    getProtoInfo: (idMap: IDMap) => Component;
+    /** @hidden */
+    handleMessage: (message: ClientComponentMessage) => void;
+    getValue: () => string | null;
+    getValidatedValue: <T>(validator: (text: string) => T) => null | T;
+    setValue: (value: string) => void;
+}
+
+export { type Events, type Props, TextInput };