@arcanejs/toolkit 0.3.0 → 0.4.0

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

@@ -15,7 +15,11 @@ declare abstract class Base<Props> implements Component {
     private readonly defaultProps;
     /** @hidden */
     private _props;
-    constructor(defaultProps: Props, props?: Partial<Props>);
+    /** @hidden */
+    private _onPropsUpdated;
+    constructor(defaultProps: Props, props?: Partial<Props>, options?: {
+        onPropsUpdated?: () => void;
+    });
     log: () => Logger | null;
     get props(): Props;
     set props(props: Partial<Props>);

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

@@ -15,7 +15,11 @@ declare abstract class Base<Props> implements Component {
     private readonly defaultProps;
     /** @hidden */
     private _props;
-    constructor(defaultProps: Props, props?: Partial<Props>);
+    /** @hidden */
+    private _onPropsUpdated;
+    constructor(defaultProps: Props, props?: Partial<Props>, options?: {
+        onPropsUpdated?: () => void;
+    });
     log: () => Logger | null;
     get props(): Props;
     set props(props: Partial<Props>);

package/dist/backend/components/base.js

@@ -2,10 +2,10 @@
 
 
 
-var _chunkNZUYU32Zjs = require('../../chunk-NZUYU32Z.js');
+var _chunkCFO5PSSKjs = require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
 
 
-exports.Base = _chunkNZUYU32Zjs.Base; exports.BaseParent = _chunkNZUYU32Zjs.BaseParent; exports.EventEmitter = _chunkNZUYU32Zjs.EventEmitter;
+exports.Base = _chunkCFO5PSSKjs.Base; exports.BaseParent = _chunkCFO5PSSKjs.BaseParent; exports.EventEmitter = _chunkCFO5PSSKjs.EventEmitter;

package/dist/backend/components/base.mjs

@@ -2,7 +2,7 @@ import {
   Base,
   BaseParent,
   EventEmitter
-} from "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Base,

package/dist/backend/components/button.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkJ46AJUGEjs = require('../../chunk-J46AJUGE.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunk4X3QY5EPjs = require('../../chunk-4X3QY5EP.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.Button = _chunkJ46AJUGEjs.Button;
+exports.Button = _chunk4X3QY5EPjs.Button;

package/dist/backend/components/button.mjs

@@ -1,7 +1,7 @@
 import {
   Button
-} from "../../chunk-EH73E5FP.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-G5QXW2L3.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Button

package/dist/backend/components/group.js

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkQUA3NBLDjs = require('../../chunk-QUA3NBLD.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunk4HHKW7VAjs = require('../../chunk-4HHKW7VA.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
 
-exports.Group = _chunkQUA3NBLDjs.Group; exports.GroupHeader = _chunkQUA3NBLDjs.GroupHeader;
+exports.Group = _chunk4HHKW7VAjs.Group; exports.GroupHeader = _chunk4HHKW7VAjs.GroupHeader;

package/dist/backend/components/group.mjs

@@ -1,8 +1,8 @@
 import {
   Group,
   GroupHeader
-} from "../../chunk-3Y3HRYLC.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-KBPQZJKE.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Group,

package/dist/backend/components/label.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkTSC5C5XRjs = require('../../chunk-TSC5C5XR.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkFLRGYURVjs = require('../../chunk-FLRGYURV.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.Label = _chunkTSC5C5XRjs.Label;
+exports.Label = _chunkFLRGYURVjs.Label;

package/dist/backend/components/label.mjs

@@ -1,7 +1,7 @@
 import {
   Label
-} from "../../chunk-7ITSSJE2.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-JOW3XRQI.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Label

package/dist/backend/components/rect.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkWIPEQNWRjs = require('../../chunk-WIPEQNWR.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkK572ZPUSjs = require('../../chunk-K572ZPUS.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.Rect = _chunkWIPEQNWRjs.Rect;
+exports.Rect = _chunkK572ZPUSjs.Rect;

package/dist/backend/components/rect.mjs

@@ -1,7 +1,7 @@
 import {
   Rect
-} from "../../chunk-SMTUN6HG.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-KOKUFP6V.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Rect

package/dist/backend/components/slider-button.d.mts

@@ -6,19 +6,23 @@ import '@arcanejs/protocol/logging';
 type Events = {
     change: (value: number) => void | Promise<void>;
 };
-type SliderMode = 'writeThrough' | 'writeBack';
 type InternalProps = {
     min: number;
     max: number;
     step: number;
-    value: number | null;
-    mode: SliderMode;
+    value?: number;
+    defaultValue?: number;
 };
 type RequiredProps = 'value';
 type Props = Pick<InternalProps, RequiredProps> & Partial<Omit<InternalProps, RequiredProps>>;
 declare class SliderButton extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     private readonly events;
+    /**
+     * Manually manage the state of the slider,
+     * to support both controlled and uncontrolled inputs.
+     */
+    private _value;
     constructor(props?: Props);
     addListener: <T extends "change">(type: T, listener: Events[T]) => void;
     removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
@@ -28,6 +32,7 @@ declare class SliderButton extends Base<InternalProps> implements Listenable<Eve
     handleMessage(message: proto.ClientComponentMessage): void;
     setValue(value: number): void;
     private sanitizeNumber;
+    private onPropsUpdated;
 }
 
-export { type Events, type Props, SliderButton, type SliderMode };
+export { type Events, type Props, SliderButton };

package/dist/backend/components/slider-button.d.ts

@@ -6,19 +6,23 @@ import '@arcanejs/protocol/logging';
 type Events = {
     change: (value: number) => void | Promise<void>;
 };
-type SliderMode = 'writeThrough' | 'writeBack';
 type InternalProps = {
     min: number;
     max: number;
     step: number;
-    value: number | null;
-    mode: SliderMode;
+    value?: number;
+    defaultValue?: number;
 };
 type RequiredProps = 'value';
 type Props = Pick<InternalProps, RequiredProps> & Partial<Omit<InternalProps, RequiredProps>>;
 declare class SliderButton extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     private readonly events;
+    /**
+     * Manually manage the state of the slider,
+     * to support both controlled and uncontrolled inputs.
+     */
+    private _value;
     constructor(props?: Props);
     addListener: <T extends "change">(type: T, listener: Events[T]) => void;
     removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
@@ -28,6 +32,7 @@ declare class SliderButton extends Base<InternalProps> implements Listenable<Eve
     handleMessage(message: proto.ClientComponentMessage): void;
     setValue(value: number): void;
     private sanitizeNumber;
+    private onPropsUpdated;
 }
 
-export { type Events, type Props, SliderButton, type SliderMode };
+export { type Events, type Props, SliderButton };

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

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkYN3FZMXYjs = require('../../chunk-YN3FZMXY.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkG7GFSIHYjs = require('../../chunk-G7GFSIHY.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.SliderButton = _chunkYN3FZMXYjs.SliderButton;
+exports.SliderButton = _chunkG7GFSIHYjs.SliderButton;

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

@@ -1,7 +1,7 @@
 import {
   SliderButton
-} from "../../chunk-H2UQDFTS.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-A2STBGBE.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   SliderButton

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

@@ -7,12 +7,18 @@ type Events = {
     change: (state: 'on' | 'off') => void | Promise<void>;
 };
 type InternalProps = {
-    state: 'on' | 'off';
+    value?: 'on' | 'off';
+    defaultValue?: 'on' | 'off';
 };
 type Props = Partial<InternalProps>;
 declare class Switch extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     private readonly events;
+    /**
+     * Manually manage the state of the switch,
+     * to support both controlled and uncontrolled inputs.
+     */
+    private _value;
     constructor(props?: Props);
     addListener: <T extends "change">(type: T, listener: Events[T]) => void;
     removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
@@ -21,6 +27,7 @@ declare class Switch extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     handleMessage(message: proto.ClientComponentMessage): void;
     setValue(state: 'on' | 'off'): void;
+    private onPropsUpdated;
 }
 
 export { type Events, type Props, Switch };

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

@@ -7,12 +7,18 @@ type Events = {
     change: (state: 'on' | 'off') => void | Promise<void>;
 };
 type InternalProps = {
-    state: 'on' | 'off';
+    value?: 'on' | 'off';
+    defaultValue?: 'on' | 'off';
 };
 type Props = Partial<InternalProps>;
 declare class Switch extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     private readonly events;
+    /**
+     * Manually manage the state of the switch,
+     * to support both controlled and uncontrolled inputs.
+     */
+    private _value;
     constructor(props?: Props);
     addListener: <T extends "change">(type: T, listener: Events[T]) => void;
     removeListener: <T extends "change">(type: T, listener: Events[T]) => void;
@@ -21,6 +27,7 @@ declare class Switch extends Base<InternalProps> implements Listenable<Events> {
     /** @hidden */
     handleMessage(message: proto.ClientComponentMessage): void;
     setValue(state: 'on' | 'off'): void;
+    private onPropsUpdated;
 }
 
 export { type Events, type Props, Switch };

package/dist/backend/components/switch.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkDNCHAOYHjs = require('../../chunk-DNCHAOYH.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkQ5TEM6MMjs = require('../../chunk-Q5TEM6MM.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.Switch = _chunkDNCHAOYHjs.Switch;
+exports.Switch = _chunkQ5TEM6MMjs.Switch;

package/dist/backend/components/switch.mjs

@@ -1,7 +1,7 @@
 import {
   Switch
-} from "../../chunk-YYM7PBRN.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-Q3NG5UUN.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Switch

package/dist/backend/components/tabs.js

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
 
-var _chunkWXSKMMCVjs = require('../../chunk-WXSKMMCV.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkC2TVGO43js = require('../../chunk-C2TVGO43.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
 
-exports.Tab = _chunkWXSKMMCVjs.Tab; exports.Tabs = _chunkWXSKMMCVjs.Tabs;
+exports.Tab = _chunkC2TVGO43js.Tab; exports.Tabs = _chunkC2TVGO43js.Tabs;

package/dist/backend/components/tabs.mjs

@@ -1,8 +1,8 @@
 import {
   Tab,
   Tabs
-} from "../../chunk-YIXRQHTA.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-H734NV65.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Tab,

package/dist/backend/components/text-input.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkIW3JCC73js = require('../../chunk-IW3JCC73.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkDONU33U4js = require('../../chunk-DONU33U4.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.TextInput = _chunkIW3JCC73js.TextInput;
+exports.TextInput = _chunkDONU33U4js.TextInput;

package/dist/backend/components/text-input.mjs

@@ -1,7 +1,7 @@
 import {
   TextInput
-} from "../../chunk-NKNDCRUR.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-KR6LSBBX.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   TextInput

package/dist/backend/components/timeline.js

@@ -1,8 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkDV5WTSFWjs = require('../../chunk-DV5WTSFW.js');
-require('../../chunk-NZUYU32Z.js');
+var _chunkFUINWM5Hjs = require('../../chunk-FUINWM5H.js');
+require('../../chunk-CFO5PSSK.js');
 require('../../chunk-3RG5ZIWI.js');
 
 
-exports.Timeline = _chunkDV5WTSFWjs.Timeline;
+exports.Timeline = _chunkFUINWM5Hjs.Timeline;

package/dist/backend/components/timeline.mjs

@@ -1,7 +1,7 @@
 import {
   Timeline
-} from "../../chunk-POUQGJN4.mjs";
-import "../../chunk-EDTJ75FT.mjs";
+} from "../../chunk-DBSYI5Z4.mjs";
+import "../../chunk-PW7QVLLF.mjs";
 import "../../chunk-Y6FXYEAI.mjs";
 export {
   Timeline

package/dist/{chunk-QUA3NBLD.js → chunk-4HHKW7VA.js}

@@ -1,7 +1,7 @@
 "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');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.js');
 
 // src/backend/components/group.ts
 var GROUP_DEFAULT_STYLE = {
@@ -12,7 +12,7 @@ var DEFAULT_PROPS = {
   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); }
+var GroupHeader = (_class = class extends _chunkCFO5PSSKjs.BaseParent {constructor(...args) { super(...args); _class.prototype.__init.call(this);_class.prototype.__init2.call(this); }
   __init() {this.validateChildren = () => {
   }}
   /** @hidden */
@@ -22,9 +22,9 @@ var GroupHeader = (_class = class extends _chunkNZUYU32Zjs.BaseParent {construct
     children: this.getChildren().map((c) => c.getProtoInfo(idMap))
   })}
 }, _class);
-var Group = (_class2 = class extends _chunkNZUYU32Zjs.BaseParent {
+var Group = (_class2 = class extends _chunkCFO5PSSKjs.BaseParent {
   /** @hidden */
-  __init3() {this.events = new (0, _chunkNZUYU32Zjs.EventEmitter)()}
+  __init3() {this.events = new (0, _chunkCFO5PSSKjs.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);;
   }

package/dist/{chunk-J46AJUGE.js → chunk-4X3QY5EP.js}

@@ -1,7 +1,7 @@
 "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/button.ts
 var DEFAULT_PROPS = {
@@ -10,9 +10,9 @@ var DEFAULT_PROPS = {
   mode: "normal",
   error: null
 };
-var Button = (_class = class extends _chunkNZUYU32Zjs.Base {
+var Button = (_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-H2UQDFTS.mjs → chunk-A2STBGBE.mjs}

@@ -1,21 +1,27 @@
 import {
   Base,
   EventEmitter
-} from "./chunk-EDTJ75FT.mjs";
+} from "./chunk-PW7QVLLF.mjs";
 
 // src/backend/components/slider-button.ts
 var DEFAULT_PROPS = {
-  value: null,
   min: 0,
   max: 255,
-  step: 5,
-  mode: "writeBack"
+  step: 5
 };
 var SliderButton = class extends Base {
   /** @hidden */
   events = new EventEmitter();
+  /**
+   * Manually manage the state of the slider,
+   * to support both controlled and uncontrolled inputs.
+   */
+  _value = null;
   constructor(props) {
-    super(DEFAULT_PROPS, props);
+    super(DEFAULT_PROPS, props, {
+      onPropsUpdated: () => this.onPropsUpdated()
+    });
+    this.onPropsUpdated();
   }
   addListener = this.events.addListener;
   removeListener = this.events.removeListener;
@@ -27,23 +33,27 @@ var SliderButton = class extends Base {
       min: this.props.min,
       max: this.props.max,
       step: this.props.step,
-      value: this.props.value
+      value: this._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 });
+    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 (newValue === this.props.value) return;
-    this.updateProps({ value });
+    if (this._value === newValue) return;
+    this._value = newValue;
     this.updateTree();
   }
   sanitizeNumber(value) {
@@ -52,6 +62,13 @@ var SliderButton = class extends Base {
     const clampedValue = Math.max(this.props.min, Math.min(this.props.max, v));
     return clampedValue;
   }
+  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 {

package/dist/{chunk-WXSKMMCV.js → chunk-C2TVGO43.js}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); var _class; var _class2;
 
-var _chunkNZUYU32Zjs = require('./chunk-NZUYU32Z.js');
+var _chunkCFO5PSSKjs = require('./chunk-CFO5PSSK.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); }
+var Tab = (_class = class extends _chunkCFO5PSSKjs.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");
@@ -17,7 +17,7 @@ var Tab = (_class = class extends _chunkNZUYU32Zjs.BaseParent {constructor(...ar
     child: this.getChildren().slice(0, 1).map((c) => c.getProtoInfo(idMap))[0]
   })}
 }, _class);
-var Tabs = (_class2 = class extends _chunkNZUYU32Zjs.BaseParent {
+var Tabs = (_class2 = class extends _chunkCFO5PSSKjs.BaseParent {
   __init3() {this.validateChildren = (children) => {
     for (const child of children) {
       if (!(child instanceof Tab)) {