@arcanejs/toolkit 0.3.0 → 0.4.0

package/dist/{chunk-NZUYU32Z.js → chunk-CFO5PSSK.js}

@@ -1,4 +1,4 @@
-"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
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } 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}
@@ -6,15 +6,18 @@ var Base = (_class = class {
   
   /** @hidden */
   
-  constructor(defaultProps, props) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);
+  /** @hidden */
+  __init2() {this._onPropsUpdated = null}
+  constructor(defaultProps, props, options) {;_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);
     this.defaultProps = defaultProps;
     this._props = Object.freeze({
       ...defaultProps,
       ...props
     });
+    this._onPropsUpdated = _nullishCoalesce(_optionalChain([options, 'optionalAccess', _8 => _8.onPropsUpdated]), () => ( null));
   }
-  __init2() {this.log = () => {
-    return _optionalChain([this, 'access', _4 => _4.parent, 'optionalAccess', _5 => _5.log, 'call', _6 => _6()]) || null;
+  __init3() {this.log = () => {
+    return _optionalChain([this, 'access', _9 => _9.parent, 'optionalAccess', _10 => _10.log, 'call', _11 => _11()]) || null;
   }}
   get props() {
     return this._props;
@@ -22,18 +25,20 @@ var Base = (_class = class {
   set props(props) {
     this.setProps(props);
   }
-  __init3() {this.setProps = (props) => {
+  __init4() {this.setProps = (props) => {
     this._props = Object.freeze({
       ...this.defaultProps,
       ...props
     });
+    _optionalChain([this, 'access', _12 => _12._onPropsUpdated, 'optionalCall', _13 => _13()]);
     this.updateTree();
   }}
-  __init4() {this.updateProps = (updates) => {
+  __init5() {this.updateProps = (updates) => {
     this._props = Object.freeze({
       ...this._props,
       ...updates
     });
+    _optionalChain([this, 'access', _14 => _14._onPropsUpdated, 'optionalCall', _15 => _15()]);
     this.updateTree();
   }}
   /** @hidden */
@@ -53,10 +58,10 @@ var Base = (_class = class {
   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); }
+var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(...args2); _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); }
   /** @hidden */
-  __init5() {this.children = []}
-  __init6() {this.appendChildren = (...children) => {
+  __init6() {this.children = []}
+  __init7() {this.appendChildren = (...children) => {
     for (const c of children) {
       const newChildren = [...this.children.filter((ch) => ch !== c), c];
       this.validateChildren(newChildren);
@@ -66,11 +71,11 @@ var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(..
     this.updateTree();
     return children;
   }}
-  __init7() {this.appendChild = (child) => {
+  __init8() {this.appendChild = (child) => {
     this.appendChildren(child);
     return child;
   }}
-  __init8() {this.removeChild = (component) => {
+  __init9() {this.removeChild = (component) => {
     const match = this.children.findIndex((c) => c === component);
     if (match >= 0) {
       const removingChild = this.children[match];
@@ -80,11 +85,11 @@ var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(..
       ];
       this.validateChildren(newChildren);
       this.children = Object.freeze(newChildren);
-      _optionalChain([removingChild, 'optionalAccess', _9 => _9.setParent, 'call', _10 => _10(null)]);
+      _optionalChain([removingChild, 'optionalAccess', _18 => _18.setParent, 'call', _19 => _19(null)]);
       this.updateTree();
     }
   }}
-  __init9() {this.removeAllChildren = () => {
+  __init10() {this.removeAllChildren = () => {
     this.children.map((c) => c.setParent(null));
     this.children = Object.freeze([]);
     this.updateTree();
@@ -92,7 +97,7 @@ var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(..
   /**
    * Return all children components that messages need to be routed to
    */
-  __init10() {this.getChildren = () => this.children}
+  __init11() {this.getChildren = () => this.children}
   /**
    * TODO: we can do this better, right now it broadcasts the message to all
    * components of the tree
@@ -129,9 +134,9 @@ var BaseParent = (_class2 = class extends Base {constructor(...args2) { super(..
     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) => {
+var EventEmitter = (_class3 = class {constructor() { _class3.prototype.__init12.call(this);_class3.prototype.__init13.call(this);_class3.prototype.__init14.call(this);_class3.prototype.__init15.call(this); }
+  __init12() {this.listeners = /* @__PURE__ */ new Map()}
+  __init13() {this.addListener = (type, listener) => {
     let set = this.listeners.get(type);
     if (!set) {
       set = /* @__PURE__ */ new Set();
@@ -139,10 +144,10 @@ var EventEmitter = (_class3 = class {constructor() { _class3.prototype.__init11.
     }
     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.removeListener = (type, listener) => {
+    _optionalChain([this, 'access', _25 => _25.listeners, 'access', _26 => _26.get, 'call', _27 => _27(type), 'optionalAccess', _28 => _28.delete, 'call', _29 => _29(listener)]);
   }}
-  __init14() {this.emit = (type, ...args) => {
+  __init15() {this.emit = (type, ...args) => {
     return Promise.all(
       [...this.listeners.get(type) || []].map(
         (l) => new Promise((resolve, reject) => {

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

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

package/dist/{chunk-IW3JCC73.js → chunk-DONU33U4.js}

@@ -1,15 +1,15 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } var _class;
 
 
-var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
 
 // src/backend/components/text-input.ts
 var DEFAULT_PROPS = {
   value: null
 };
-var TextInput = (_class = class extends _chunkNZUYU32Zjs.Base {
+var TextInput = (_class = class extends _chunkCFO5PSSKjs.Base {
   /** @hidden */
-  __init() {this.events = new (0, _chunkNZUYU32Zjs.EventEmitter)()}
+  __init() {this.events = new (0, _chunkCFO5PSSKjs.EventEmitter)()}
   constructor(props) {
     super(DEFAULT_PROPS, props);_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);_class.prototype.__init6.call(this);_class.prototype.__init7.call(this);_class.prototype.__init8.call(this);;
   }

package/dist/{chunk-TSC5C5XR.js → chunk-FLRGYURV.js}

@@ -1,9 +1,9 @@
 "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');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
 
 // src/backend/components/label.ts
-var Label = class extends _chunkNZUYU32Zjs.Base {
+var Label = class extends _chunkCFO5PSSKjs.Base {
   constructor(props) {
     super({ text: null }, props);
   }

package/dist/{chunk-DV5WTSFW.js → chunk-FUINWM5H.js}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } var _class;
 
-var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
 
 // src/backend/components/timeline.ts
 var DEFAULT_PROPS = {
@@ -13,7 +13,7 @@ var DEFAULT_PROPS = {
   subtitles: null,
   source: null
 };
-var Timeline = (_class = class extends _chunkNZUYU32Zjs.Base {
+var Timeline = (_class = class extends _chunkCFO5PSSKjs.Base {
   constructor(props) {
     super(DEFAULT_PROPS, props);_class.prototype.__init.call(this);;
   }

package/dist/{chunk-EH73E5FP.mjs → chunk-G5QXW2L3.mjs}

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

package/dist/chunk-G7GFSIHY.js

@@ -0,0 +1,76 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _class;
+
+
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
+
+// src/backend/components/slider-button.ts
+var DEFAULT_PROPS = {
+  min: 0,
+  max: 255,
+  step: 5
+};
+var SliderButton = (_class = class extends _chunkCFO5PSSKjs.Base {
+  /** @hidden */
+  __init() {this.events = new (0, _chunkCFO5PSSKjs.EventEmitter)()}
+  /**
+   * Manually manage the state of the slider,
+   * to support both controlled and uncontrolled inputs.
+   */
+  __init2() {this._value = null}
+  constructor(props) {
+    super(DEFAULT_PROPS, props, {
+      onPropsUpdated: () => this.onPropsUpdated()
+    });_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);;
+    this.onPropsUpdated();
+  }
+  __init3() {this.addListener = this.events.addListener}
+  __init4() {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._value
+    };
+  }
+  /** @hidden */
+  handleMessage(message) {
+    if (message.component !== "slider_button") return;
+    const newValue = this.sanitizeNumber(message.value);
+    if (this._value === newValue) return;
+    if (this.props.value === void 0) {
+      this._value = newValue;
+      this.updateTree();
+    }
+    this.events.emit("change", newValue);
+  }
+  setValue(value) {
+    if (this.props.value) {
+      throw new Error("Cannot set value on controlled input");
+    }
+    const newValue = this.sanitizeNumber(value);
+    if (this._value === newValue) return;
+    this._value = newValue;
+    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;
+  }
+  __init5() {this.onPropsUpdated = () => {
+    if (this.props.value !== void 0) {
+      this._value = this.props.value;
+    } else if (this._value === null && this.props.defaultValue) {
+      this._value = this.props.defaultValue;
+    }
+  }}
+}, _class);
+
+
+
+exports.SliderButton = SliderButton;

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

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

package/dist/{chunk-7ITSSJE2.mjs → chunk-JOW3XRQI.mjs}

@@ -1,6 +1,6 @@
 import {
   Base
-} from "./chunk-EDTJ75FT.mjs";
+} from "./chunk-PW7QVLLF.mjs";
 
 // src/backend/components/label.ts
 var Label = class extends Base {

package/dist/{chunk-WIPEQNWR.js → chunk-K572ZPUS.js}

@@ -1,12 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
 
 // src/backend/components/rect.ts
 var DEFAULT_PROPS = {
   color: "rgba(0, 0, 0, 0)"
 };
-var Rect = class extends _chunkNZUYU32Zjs.Base {
+var Rect = class extends _chunkCFO5PSSKjs.Base {
   constructor(props) {
     super(DEFAULT_PROPS, props);
   }

package/dist/{chunk-3Y3HRYLC.mjs → chunk-KBPQZJKE.mjs}

@@ -1,7 +1,7 @@
 import {
   BaseParent,
   EventEmitter
-} from "./chunk-EDTJ75FT.mjs";
+} from "./chunk-PW7QVLLF.mjs";
 
 // src/backend/components/group.ts
 var GROUP_DEFAULT_STYLE = {

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

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

package/dist/{chunk-NKNDCRUR.mjs → chunk-KR6LSBBX.mjs}

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

package/dist/{chunk-EDTJ75FT.mjs → chunk-PW7QVLLF.mjs}

@@ -6,12 +6,15 @@ var Base = class {
   defaultProps;
   /** @hidden */
   _props;
-  constructor(defaultProps, props) {
+  /** @hidden */
+  _onPropsUpdated = null;
+  constructor(defaultProps, props, options) {
     this.defaultProps = defaultProps;
     this._props = Object.freeze({
       ...defaultProps,
       ...props
     });
+    this._onPropsUpdated = options?.onPropsUpdated ?? null;
   }
   log = () => {
     return this.parent?.log() || null;
@@ -27,6 +30,7 @@ var Base = class {
       ...this.defaultProps,
       ...props
     });
+    this._onPropsUpdated?.();
     this.updateTree();
   };
   updateProps = (updates) => {
@@ -34,6 +38,7 @@ var Base = class {
       ...this._props,
       ...updates
     });
+    this._onPropsUpdated?.();
     this.updateTree();
   };
   /** @hidden */

package/dist/chunk-Q3NG5UUN.mjs

@@ -0,0 +1,61 @@
+import {
+  Base,
+  EventEmitter
+} from "./chunk-PW7QVLLF.mjs";
+
+// src/backend/components/switch.ts
+var DEFAULT_PROPS = {};
+var Switch = class extends Base {
+  /** @hidden */
+  events = new EventEmitter();
+  /**
+   * Manually manage the state of the switch,
+   * to support both controlled and uncontrolled inputs.
+   */
+  _value = null;
+  constructor(props) {
+    super(DEFAULT_PROPS, props, {
+      onPropsUpdated: () => this.onPropsUpdated()
+    });
+    this.onPropsUpdated();
+  }
+  addListener = this.events.addListener;
+  removeListener = this.events.removeListener;
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "switch",
+      key: idMap.getId(this),
+      state: this._value ?? "off"
+    };
+  }
+  /** @hidden */
+  handleMessage(message) {
+    if (message.component === "switch") {
+      const state = this._value === "on" ? "off" : "on";
+      if (this.props.value === void 0) {
+        this._value = state;
+        this.updateTree();
+      }
+      this.events.emit("change", state);
+    }
+  }
+  setValue(state) {
+    if (this.props.value) {
+      throw new Error("Cannot set value on controlled input");
+    }
+    this._value = state;
+    this.updateTree();
+  }
+  onPropsUpdated = () => {
+    if (this.props.value !== void 0) {
+      this._value = this.props.value;
+    } else if (this._value === null && this.props.defaultValue) {
+      this._value = this.props.defaultValue;
+    }
+  };
+};
+
+export {
+  Switch
+};

package/dist/chunk-Q5TEM6MM.js

@@ -0,0 +1,61 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } var _class;
+
+
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
+
+// src/backend/components/switch.ts
+var DEFAULT_PROPS = {};
+var Switch = (_class = class extends _chunkCFO5PSSKjs.Base {
+  /** @hidden */
+  __init() {this.events = new (0, _chunkCFO5PSSKjs.EventEmitter)()}
+  /**
+   * Manually manage the state of the switch,
+   * to support both controlled and uncontrolled inputs.
+   */
+  __init2() {this._value = null}
+  constructor(props) {
+    super(DEFAULT_PROPS, props, {
+      onPropsUpdated: () => this.onPropsUpdated()
+    });_class.prototype.__init.call(this);_class.prototype.__init2.call(this);_class.prototype.__init3.call(this);_class.prototype.__init4.call(this);_class.prototype.__init5.call(this);;
+    this.onPropsUpdated();
+  }
+  __init3() {this.addListener = this.events.addListener}
+  __init4() {this.removeListener = this.events.removeListener}
+  /** @hidden */
+  getProtoInfo(idMap) {
+    return {
+      component: "switch",
+      key: idMap.getId(this),
+      state: _nullishCoalesce(this._value, () => ( "off"))
+    };
+  }
+  /** @hidden */
+  handleMessage(message) {
+    if (message.component === "switch") {
+      const state = this._value === "on" ? "off" : "on";
+      if (this.props.value === void 0) {
+        this._value = state;
+        this.updateTree();
+      }
+      this.events.emit("change", state);
+    }
+  }
+  setValue(state) {
+    if (this.props.value) {
+      throw new Error("Cannot set value on controlled input");
+    }
+    this._value = state;
+    this.updateTree();
+  }
+  __init5() {this.onPropsUpdated = () => {
+    if (this.props.value !== void 0) {
+      this._value = this.props.value;
+    } else if (this._value === null && this.props.defaultValue) {
+      this._value = this.props.defaultValue;
+    }
+  }}
+}, _class);
+
+
+
+exports.Switch = Switch;