lecodes-sdk 1.2.0 → 2.0.0

package/src/ui/UIInput.ts

@@ -1,4 +1,5 @@
-import { type ElementStyle, type DrawableStyle, Element, type TextStyle, type Color, type BaseStyle, type UIElementBase, type LayerEasing } from "./UINode";
+import { type ElementStyle, type DrawableStyle, Element, type TextStyle, type Color, type BaseStyle, type UIElementBase } from "./UINode";
+import { TREE_FLAG_BLUR, TREE_FLAG_CHANGE, TREE_FLAG_FOCUS, TREE_FLAG_SUBMIT, tree } from "./tree"
 
 type InputStyle = {
   placeholder?: string,
@@ -51,15 +52,11 @@ type SubmitStyle = {
 
 /** A single-line text input. Keyboard/picker kind via the `type` style, return-key behavior via
  *  `enterKey` + `onSubmit`; keyboard policy on `keyboardShrink`/`keyboardDismiss`. */
-export interface UIInput extends UIElementBase<UIInputStyle & SubmitStyle & { onFocused?: UIInputStyle & { duration?: number, delay?: number, easing?: LayerEasing } }, DrawableStyle & BaseStyle> {
+export interface UIInput extends UIElementBase<UIInputStyle & SubmitStyle, DrawableStyle & BaseStyle> {
   readonly type: "input",
 
-  /**
-   * The field's text. Writable at any time — set it BEFORE the screen opens to pre-fill a form
-   * (settings, edit-profile); the value is stashed on the node and applied when the host builds
-   * it. Reads return the live text while the screen is open, and the last value you set while it
-   * isn't. The user's typing is not preserved across close/open (use `keepAlive()` for that).
-   */
+  /** The field's text. Writable at any time; reads return the live text (the host owns the field
+   *  while the user types — IME composition, paste, the maxLength clamp, date/time canonicalization). */
   value: string
 
   /** The text changed — fires on every user edit. */
@@ -71,17 +68,17 @@ export interface UIInput extends UIElementBase<UIInputStyle & SubmitStyle & { on
   /** The keyboard's return key was pressed. `value` is the current text. See `enterKey`. */
   onSubmit(callback: (value: string) => void): UIInput
 
-  /** Focus the input (opens the keyboard). No-op before mount. */
+  /** Focus the input (opens the keyboard). */
   focus(): void
   /** Release focus (dismisses the keyboard when this input held it). */
   blur(): void
 }
 
 /** A multi-line text field — see the {@link UITextArea} factory for the auto-grow contract. */
-export interface UITextArea extends UIElementBase<UIInputStyle & { onFocused?: UIInputStyle & { duration?: number, delay?: number, easing?: LayerEasing } }, DrawableStyle & BaseStyle> {
+export interface UITextArea extends UIElementBase<UIInputStyle, DrawableStyle & BaseStyle> {
   readonly type: "textarea",
 
-  /** The field's text — same contract as {@link UIInput.value}: settable before mount to pre-fill. */
+  /** The field's text — same contract as {@link UIInput.value}. */
   value: string
 
   /** The text changed — fires on every user edit. */
@@ -91,7 +88,7 @@ export interface UITextArea extends UIElementBase<UIInputStyle & { onFocused?: U
   /** Lost focus. */
   onBlur(callback: () => void): UITextArea
 
-  /** Focus the text area (opens the keyboard). No-op before mount. */
+  /** Focus the text area (opens the keyboard). */
   focus(): void
   /** Release focus (dismisses the keyboard when this text area held it). */
   blur(): void
@@ -104,25 +101,12 @@ class InputElement<T extends "input" | "textarea"> extends Element<T> {
   readonly bl: Function[] = []
   readonly sl: Function[] = []
 
-  /** @internal The value as last set by CODE. Hosts read it at node creation (after the initial
-   *  style, so a `date` field's canonical parse and `maxLength` are already in place), which is
-   *  what makes a value assigned before mount — a pre-filled settings form — land on the field.
-   *  Same pre-mount stash as UIImage's `_sourceRect`. Typing does NOT sync back here: while
-   *  mounted the HOST owns the text (IME composition, paste, the maxLength clamp, date/time
-   *  canonicalization) and the getter reads it over the bridge. So on a remount the field comes
-   *  back with the last code-set value, not what the user typed — screens that must keep live
-   *  editing state across close/open use `keepAlive()`, the mechanism built for it. */
-  _value = ""
-
-  get value() {
-    // Mounted: the host is authoritative. Unmounted: what code last set (0 => never mounted).
-    return this._id !== 0 ? _creatorUI.getTextValue(this._id) : this._value
+  get value(): string {
+    // The host is authoritative for the field's text (typing never round-trips through JS).
+    return this._h.id !== 0 ? tree().getTextValue(this._h.id) : ""
   }
   set value(value: string) {
-    this._value = value
-    if (this._id !== 0) {
-      _creatorUI.updateNode(this._id, "value", value)
-    }
+    if (this._h.id !== 0) tree().setString(this._h.id, "value", value)
   }
 
   // `phone` is SDK-surface only — hosts (and the web's verbatim `el.type`) keep HTML's `tel` as
@@ -133,31 +117,39 @@ class InputElement<T extends "input" | "textarea"> extends Element<T> {
 
   onChange (callback: (value: string) => void): this {
     this.cl.push(callback)
+    this._addFlags(TREE_FLAG_CHANGE)
     return this
   }
   onFocus(callback: () => void): this {
     this.fl.push(callback)
+    this._addFlags(TREE_FLAG_FOCUS)
     return this
   }
   onBlur(callback: () => void): this {
     this.bl.push(callback)
+    this._addFlags(TREE_FLAG_BLUR)
     return this
   }
   onSubmit(callback: (value: string) => void): this {
     this.sl.push(callback)
+    this._addFlags(TREE_FLAG_SUBMIT)
     return this
   }
-
-  // Focus rides the existing value channel (updateNode "focus") — no new ABI method.
+  /** @internal */
+  _emitChange(value: string): void { for (const cb of this.cl.slice()) cb(value) }
+  /** @internal */
+  _emitFocus(): void { for (const cb of this.fl.slice()) cb() }
+  /** @internal */
+  _emitBlur(): void { for (const cb of this.bl.slice()) cb() }
+  /** @internal */
+  _emitSubmit(value: string): void { for (const cb of this.sl.slice()) cb(value) }
+
+  // Focus rides the content channel ("focus" = "1" / "0") — no dedicated bridge method.
   focus(): void {
-    if (this._id !== 0) {
-      _creatorUI.updateNode(this._id, "focus", true)
-    }
+    if (this._h.id !== 0) tree().setString(this._h.id, "focus", "1")
   }
   blur(): void {
-    if (this._id !== 0) {
-      _creatorUI.updateNode(this._id, "focus", false)
-    }
+    if (this._h.id !== 0) tree().setString(this._h.id, "focus", "0")
   }
 }
 

package/src/ui/UIModal.ts

@@ -63,7 +63,7 @@ export class ModalElement extends WidgetElement {
   constructor(style: UIModalStyle, children: UINodeChild[] | ChildrenFn) {
     super("widget", { overlayColor: "rgba(0, 0, 0, 0.5)", ...style }, children)
     this.onOverlayTap(() => { if (this._dismissible) this.hide() })
-    this.onBackPressed(() => { if (this._dismissible) this.hide() })
+    this.onBack(() => { if (this._dismissible) this.hide() })
   }
 
   // The full animate argument: hidden pose + duration, plus the scrim fade — only when the
@@ -132,8 +132,6 @@ const makeModal = (style: any, children: any) => new ModalElement(style, childre
  *  `show()`/`hide()`. Same argument forms as `UIColumn`. */
 export function UIModal(...children: UIChildArg[]): UIModal;
 export function UIModal(children: UINodeChild[] | ChildrenFn): UIModal;
-/** @deprecated Style as the first argument is legacy — use chained `.style({...})`. */
-export function UIModal(style: UIModalStyle, children?: UINodeChild[] | ChildrenFn): UIModal;
 export function UIModal(...args: any[]): UIModal {
   return buildUI(args, null, makeModal)
 }