@arcanejs/toolkit 0.2.1 → 0.3.0

package/dist/chunk-NZUYU32Z.js

@@ -0,0 +1,164 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; } var _class; var _class2; var _class3;// src/backend/components/base.ts
+var Base = (_class = class {
+  /** @hidden */
+  __init() {this.parent = null}
+  /** @hidden */
+  
+  /** @hidden */
+  
+  constructor(defaultProps, props) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);
+    this.defaultProps = defaultProps;
+    this._props = Object.freeze({
+      ...defaultProps,
+      ...props
+    });
+  }
+  __init2() {this.log = () => {
+    return _optionalChain([this, 'access', _4 => _4.parent, 'optionalAccess', _5 => _5.log, 'call', _6 => _6()]) || null;
+  }}
+  get props() {
+    return this._props;
+  }
+  set props(props) {
+    this.setProps(props);
+  }
+  __init3() {this.setProps = (props) => {
+    this._props = Object.freeze({
+      ...this.defaultProps,
+      ...props
+    });
+    this.updateTree();
+  }}
+  __init4() {this.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) {
+  }
+  routeMessage(_idMap, _message) {
+  }
+}, _class);
+var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(...args2); _class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this); }
+  /** @hidden */
+  __init5() {this.children = []}
+  __init6() {this.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;
+  }}
+  __init7() {this.appendChild = (child) => {
+    this.appendChildren(child);
+    return child;
+  }}
+  __init8() {this.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);
+      _optionalChain([removingChild, 'optionalAccess', _9 => _9.setParent, 'call', _10 => _10(null)]);
+      this.updateTree();
+    }
+  }}
+  __init9() {this.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
+   */
+  __init10() {this.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);
+    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();
+  }
+}, _class2);
+var EventEmitter = (_class3 = class {constructor() { _class3.prototype.__init11.call(this);_class3.prototype.__init12.call(this);_class3.prototype.__init13.call(this);_class3.prototype.__init14.call(this); }
+  __init11() {this.listeners = /* @__PURE__ */ new Map()}
+  __init12() {this.addListener = (type, listener) => {
+    let set = this.listeners.get(type);
+    if (!set) {
+      set = /* @__PURE__ */ new Set();
+      this.listeners.set(type, set);
+    }
+    set.add(listener);
+  }}
+  __init13() {this.removeListener = (type, listener) => {
+    _optionalChain([this, 'access', _16 => _16.listeners, 'access', _17 => _17.get, 'call', _18 => _18(type), 'optionalAccess', _19 => _19.delete, 'call', _20 => _20(listener)]);
+  }}
+  __init14() {this.emit = (type, ...args) => {
+    return Promise.all(
+      [...this.listeners.get(type) || []].map(
+        (l) => new Promise((resolve, reject) => {
+          try {
+            resolve(l(...args));
+          } catch (e) {
+            reject(e);
+          }
+        })
+      )
+    );
+  }}
+}, _class3);
+
+
+
+
+
+exports.Base = Base; exports.BaseParent = BaseParent; exports.EventEmitter = EventEmitter;

package/dist/{chunk-SOC4TF3J.mjs → chunk-POUQGJN4.mjs}

@@ -1,6 +1,6 @@
 import {
   Base
-} from "./chunk-ZCHM3JJJ.mjs";
+} from "./chunk-EDTJ75FT.mjs";
 
 // src/backend/components/timeline.ts
 var DEFAULT_PROPS = {

package/dist/chunk-QUA3NBLD.js

@@ -0,0 +1,104 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } var _class; var _class2;
+
+
+var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+
+// src/backend/components/group.ts
+var GROUP_DEFAULT_STYLE = {
+  direction: "horizontal"
+};
+var DEFAULT_PROPS = {
+  ...GROUP_DEFAULT_STYLE,
+  title: null,
+  labels: null
+};
+var GroupHeader = (_class = class extends _chunkNZUYU32Zjs.BaseParent {constructor(...args) { super(...args); _class.prototype.__init.call(this);_class.prototype.__init2.call(this); }
+  __init() {this.validateChildren = () => {
+  }}
+  /** @hidden */
+  __init2() {this.getProtoInfo = (idMap) => ({
+    component: "group-header",
+    key: idMap.getId(this),
+    children: this.getChildren().map((c) => c.getProtoInfo(idMap))
+  })}
+}, _class);
+var Group = (_class2 = class extends _chunkNZUYU32Zjs.BaseParent {
+  /** @hidden */
+  __init3() {this.events = new (0, _chunkNZUYU32Zjs.EventEmitter)()}
+  constructor(props) {
+    super(DEFAULT_PROPS, props);_class2.prototype.__init3.call(this);_class2.prototype.__init4.call(this);_class2.prototype.__init5.call(this);_class2.prototype.__init6.call(this);_class2.prototype.__init7.call(this);_class2.prototype.__init8.call(this);_class2.prototype.__init9.call(this);_class2.prototype.__init10.call(this);_class2.prototype.__init11.call(this);_class2.prototype.__init12.call(this);_class2.prototype.__init13.call(this);_class2.prototype.__init14.call(this);_class2.prototype.__init15.call(this);;
+  }
+  __init4() {this.addListener = this.events.addListener}
+  __init5() {this.removeListener = this.events.removeListener}
+  __init6() {this.validateChildren = () => {
+  }}
+  __init7() {this.setOptions = (options) => {
+    this.updateProps(options);
+  }}
+  __init8() {this.setTitle = (title) => {
+    this.updateProps({ title });
+  }}
+  __init9() {this.addLabel = (label) => {
+    this.updateProps({ labels: [...this.props.labels || [], label] });
+  }}
+  __init10() {this.setLabels = (labels) => {
+    this.updateProps({ labels });
+  }}
+  __init11() {this.addHeaderChild = (child) => {
+    const header = new GroupHeader({});
+    header.appendChild(child);
+    this.appendChild(header);
+    return child;
+  }}
+  __init12() {this.removeHeaderChild = (child) => {
+    for (const c of this.getChildren()) {
+      if (c instanceof GroupHeader) {
+        c.removeChild(child);
+      }
+    }
+  }}
+  __init13() {this.removeAllHeaderChildren = () => {
+    for (const child of this.getChildren()) {
+      if (child instanceof GroupHeader) {
+        child.removeAllChildren();
+      }
+    }
+  }}
+  /** @hidden */
+  __init14() {this.getProtoInfo = (idMap) => {
+    const children = [];
+    const headers = [];
+    for (const c of this.getChildren()) {
+      const childProto = c.getProtoInfo(idMap);
+      if (childProto.component === "group-header") {
+        headers.push(childProto);
+      } else {
+        children.push(childProto);
+      }
+    }
+    return {
+      component: "group",
+      key: idMap.getId(this),
+      title: _nullishCoalesce(this.props.title, () => ( void 0)),
+      direction: this.props.direction,
+      border: this.props.border,
+      wrap: this.props.wrap,
+      children,
+      headers: headers.length > 0 ? headers : void 0,
+      labels: _nullishCoalesce(this.props.labels, () => ( void 0)),
+      editableTitle: this.props.editableTitle || false,
+      defaultCollapsibleState: this.props.defaultCollapsibleState
+    };
+  }}
+  /** @hidden */
+  __init15() {this.handleMessage = (message) => {
+    if (message.component === "group") {
+      this.events.emit("title-changed", message.title);
+    }
+  }}
+}, _class2);
+
+
+
+
+exports.GroupHeader = GroupHeader; exports.Group = Group;

package/dist/{chunk-ZU5H6SVA.mjs → chunk-SMTUN6HG.mjs}

@@ -1,6 +1,6 @@
 import {
   Base
-} from "./chunk-ZCHM3JJJ.mjs";
+} from "./chunk-EDTJ75FT.mjs";
 
 // src/backend/components/rect.ts
 var DEFAULT_PROPS = {

package/dist/chunk-TSC5C5XR.js

@@ -0,0 +1,29 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } }
+
+var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+
+// src/backend/components/label.ts
+var Label = class extends _chunkNZUYU32Zjs.Base {
+  constructor(props) {
+    super({ text: null }, props);
+  }
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "label",
+      key: idMap.getId(this),
+      bold: this.props.bold,
+      text: _nullishCoalesce(this.props.text, () => ( ""))
+    };
+  }
+  setText(text) {
+    this.updateProps({
+      text
+    });
+    return this;
+  }
+};
+
+
+
+exports.Label = Label;

package/dist/chunk-WIPEQNWR.js

@@ -0,0 +1,29 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+
+// src/backend/components/rect.ts
+var DEFAULT_PROPS = {
+  color: "rgba(0, 0, 0, 0)"
+};
+var Rect = class extends _chunkNZUYU32Zjs.Base {
+  constructor(props) {
+    super(DEFAULT_PROPS, props);
+  }
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "rect",
+      key: idMap.getId(this),
+      color: this.props.color
+    };
+  }
+  setColor(color) {
+    this.updateProps({ color });
+    return this;
+  }
+};
+
+
+
+exports.Rect = Rect;

package/dist/chunk-WXSKMMCV.js

@@ -0,0 +1,55 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _class; var _class2;
+
+var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+
+// src/backend/components/tabs.ts
+var Tab = (_class = class extends _chunkNZUYU32Zjs.BaseParent {constructor(...args) { super(...args); _class.prototype.__init.call(this);_class.prototype.__init2.call(this); }
+  __init() {this.validateChildren = (children) => {
+    if (children.length > 1) {
+      throw new Error("Tab can only have one child");
+    }
+  }}
+  /** @hidden */
+  __init2() {this.getProtoInfo = (idMap) => ({
+    component: "tab",
+    key: idMap.getId(this),
+    name: this.props.name,
+    child: this.getChildren().slice(0, 1).map((c) => c.getProtoInfo(idMap))[0]
+  })}
+}, _class);
+var Tabs = (_class2 = class extends _chunkNZUYU32Zjs.BaseParent {
+  __init3() {this.validateChildren = (children) => {
+    for (const child of children) {
+      if (!(child instanceof Tab)) {
+        throw new Error("Tabs can only have Tab children");
+      }
+    }
+  }}
+  constructor(props) {
+    super({}, { ...props });_class2.prototype.__init3.call(this);;
+  }
+  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))
+    };
+  }
+}, _class2);
+
+
+
+
+exports.Tab = Tab; exports.Tabs = Tabs;

package/dist/{chunk-TQ27Y7F4.mjs → chunk-YIXRQHTA.mjs}

@@ -1,6 +1,6 @@
 import {
   BaseParent
-} from "./chunk-ZCHM3JJJ.mjs";
+} from "./chunk-EDTJ75FT.mjs";
 
 // src/backend/components/tabs.ts
 var Tab = class extends BaseParent {

package/dist/chunk-YN3FZMXY.js

@@ -0,0 +1,59 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _class;
+
+
+var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+
+// src/backend/components/slider-button.ts
+var DEFAULT_PROPS = {
+  value: null,
+  min: 0,
+  max: 255,
+  step: 5,
+  mode: "writeBack"
+};
+var SliderButton = (_class = class extends _chunkNZUYU32Zjs.Base {
+  /** @hidden */
+  __init() {this.events = new (0, _chunkNZUYU32Zjs.EventEmitter)()}
+  constructor(props) {
+    super(DEFAULT_PROPS, props);_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);;
+  }
+  __init2() {this.addListener = this.events.addListener}
+  __init3() {this.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;
+  }
+}, _class);
+
+
+
+exports.SliderButton = SliderButton;

package/dist/{chunk-APCR3ITH.mjs → chunk-YYM7PBRN.mjs}

@@ -1,7 +1,7 @@
 import {
   Base,
   EventEmitter
-} from "./chunk-ZCHM3JJJ.mjs";
+} from "./chunk-EDTJ75FT.mjs";
 
 // src/backend/components/switch.ts
 var DEFAULT_PROPS = {

package/dist/frontend.js

@@ -26757,7 +26757,6 @@ body {
     const onClick = (0, import_react8.useMemo)(
       () => () => {
         if (!sendMessage) return;
-        console.log("sending message");
         sendMessage({
           type: "component-message",
           componentKey: info.key,
@@ -27143,7 +27142,6 @@ body {
         `ws://${window.location.hostname}:${window.location.port}${window.location.pathname}`
       );
       ws.onmessage = (event) => {
-        console.log("message", event.data);
         handleMessage(JSON.parse(event.data));
       };
       ws.onclose = () => {
@@ -27165,7 +27163,6 @@ body {
       (await (socket.current || initializeWebsocket())).send(JSON.stringify(msg));
     };
     const handleMessage = (msg) => {
-      console.log("handleMessage", msg);
       switch (msg.type) {
         case "tree-full":
           setRoot(msg.root);