ripple 0.2.53 → 0.2.54

package/src/runtime/index.js

@@ -50,11 +50,11 @@ export function track(v, b) {
   return tracked(v, b);
 }
 
-export { RippleArray } from './array.js';
+export { TrackedArray } from './array.js';
 
-export { RippleSet } from './set.js';
+export { TrackedSet } from './set.js';
 
-export { RippleMap } from './map.js';
+export { TrackedMap } from './map.js';
 
 export { keyed } from './internal/client/for.js';
 

package/src/runtime/internal/client/constants.js

@@ -20,7 +20,7 @@ export var LOGIC_BLOCK = FOR_BLOCK | IF_BLOCK | TRY_BLOCK;
 
 export var UNINITIALIZED = Symbol();
 /** @type {unique symbol} */
-export const TRACKED_OBJECT = Symbol();
+export const TRACKED_ARRAY = Symbol();
 export var COMPUTED_PROPERTY = Symbol();
 export var REF_PROP = 'ref';
 /** @type {unique symbol} */

package/src/runtime/internal/client/for.js

@@ -1,7 +1,6 @@
 import { IS_CONTROLLED } from '../../../constants';
-import { get_all_elements } from '../../array';
 import { branch, destroy_block, destroy_block_children, render } from './blocks';
-import { FOR_BLOCK, TRACKED_OBJECT } from './constants';
+import { FOR_BLOCK, TRACKED_ARRAY } from './constants';
 import { create_text } from './operations';
 import { active_block, untrack } from './runtime';
 import { array_from, is_array } from './utils';
@@ -45,9 +44,10 @@ export function for_block(node, get_collection, render_fn, flags) {
         ? []
         : array_from(collection);
 
-    if (array[TRACKED_OBJECT] !== undefined) {
-      array = get_all_elements(collection);
-      collection.$length;
+    // If we are working with a tracked array, then we need to get a copy of
+	// the elements, as the array itself is proxied, and not useful in diffing
+    if (TRACKED_ARRAY in array) {
+      array = array_from(array);
     }
 
     untrack(() => reconcile(anchor, block, array, render_fn, is_controlled));

package/src/runtime/internal/client/index.js

@@ -24,25 +24,15 @@ export {
   set,
   async_computed,
   tracked,
-  tracked_object,
-  tracked_spread_object,
+  spread_props,
   computed_property,
   call_property,
   get_property,
-  old_get_property,
-  old_set_property,
   set_property,
   update,
   update_pre,
-  old_update_property,
   update_property,
-  old_update_pre_property,
   update_pre_property,
-  object_values,
-  object_entries,
-  object_keys,
-  spread_object,
-  structured_clone,
   push_component,
   pop_component,
   untrack,

package/src/runtime/internal/client/operations.js

@@ -1,4 +1,3 @@
-import { TRACKED_OBJECT } from './constants.js';
 import { get_descriptor } from './utils.js';
 
 /** @type {() => Node | null} */
@@ -33,8 +32,6 @@ export function init_operations() {
   // @ts-expect-error
   element_prototype.__e = undefined;
   // @ts-expect-error
-  object_prototype[TRACKED_OBJECT] = undefined;
-  // @ts-expect-error
   event_target_prototype.__root = undefined;
 }
 

package/src/runtime/internal/client/portal.js

@@ -2,26 +2,25 @@ import { branch, destroy_block, render } from './blocks';
 import { UNINITIALIZED } from './constants';
 import { handle_root_events } from './events';
 import { create_text } from './operations';
-import { old_get_property } from './runtime';
 
 export function Portal(_, props) {
-  let $target = UNINITIALIZED;
+  let target = UNINITIALIZED;
   let children = UNINITIALIZED;
   var b = null;
   var anchor = null;
 
   render(() => {
-    if ($target === ($target = old_get_property(props, '$target'))) return;
-    if (children === (children = old_get_property(props, 'children'))) return;
+    if (target === (target = props.target)) return;
+    if (children === (children = props.children)) return;
 
     if (b !== null) {
       destroy_block(b);
     }
 
     anchor = create_text();
-    $target.append(anchor);
+    target.append(anchor);
 
-    const cleanup_events = handle_root_events($target);
+    const cleanup_events = handle_root_events(target);
 
     b = branch(() => children(anchor));
 

package/src/runtime/internal/client/runtime.js

@@ -21,20 +21,12 @@ import {
   PAUSED,
   ROOT_BLOCK,
   TRACKED,
-  TRACKED_OBJECT,
   TRY_BLOCK,
   UNINITIALIZED,
   REF_PROP,
-  ARRAY_SET_INDEX_AT,
 } from './constants';
 import { capture, suspend } from './try.js';
-import { define_property, get_descriptor, is_ripple_array, is_positive_integer } from './utils';
-import {
-  object_keys as original_object_keys,
-  object_values as original_object_values,
-  object_entries as original_object_entries,
-  structured_clone as original_structured_clone,
-} from './utils.js';
+import { define_property, is_ripple_array } from './utils';
 
 const FLUSH_MICROTASK = 0;
 const FLUSH_SYNC = 1;
@@ -408,50 +400,43 @@ export function async_computed(fn, block) {
 }
 
 export function deferred(fn) {
-  var parent = active_block;
-  var block = active_scope;
-  var res = [UNINITIALIZED];
-  // TODO implement DEFERRED flag on tracked
-  var t = tracked(UNINITIALIZED, block, DEFERRED);
-  var tracked_properties = [t];
-  var prev_value = UNINITIALIZED;
-
-  define_property(res, TRACKED_OBJECT, {
-    value: tracked_properties,
-    enumerable: false,
-  });
-
-  render(() => {
-    if (prev_value !== UNINITIALIZED) {
-      t.v = prev_value;
-    } else {
-      prev_value = t.v;
-    }
-    var prev_version = t.c;
-    var value = fn();
-
-    res[0] = value;
-    old_set_property(res, 0, value, block);
-
-    if (prev_value !== UNINITIALIZED) {
-      if ((t.f & DEFERRED) === 0) {
-        t.f ^= DEFERRED;
-      }
-
-      var is_awaited = flush_deferred_upodates(parent);
-      if ((t.f & DEFERRED) !== 0) {
-        t.f ^= DEFERRED;
-      }
-
-      if (is_awaited) {
-        t.c = prev_version;
-        t.v = prev_value;
-        prev_value = value;
-      }
-    }
-  });
-
-  return res;
+  // var parent = active_block;
+  // var block = active_scope;
+  // var res = [UNINITIALIZED];
+  // // TODO implement DEFERRED flag on tracked
+  // var t = tracked(UNINITIALIZED, block, DEFERRED);
+  // var tracked_properties = [t];
+  // var prev_value = UNINITIALIZED;
+  // define_property(res, TRACKED_OBJECT, {
+  //   value: tracked_properties,
+  //   enumerable: false,
+  // });
+  // render(() => {
+  //   if (prev_value !== UNINITIALIZED) {
+  //     t.v = prev_value;
+  //   } else {
+  //     prev_value = t.v;
+  //   }
+  //   var prev_version = t.c;
+  //   var value = fn();
+  //   res[0] = value;
+  //   old_set_property(res, 0, value, block);
+  //   if (prev_value !== UNINITIALIZED) {
+  //     if ((t.f & DEFERRED) === 0) {
+  //       t.f ^= DEFERRED;
+  //     }
+  //     var is_awaited = flush_deferred_upodates(parent);
+  //     if ((t.f & DEFERRED) !== 0) {
+  //       t.f ^= DEFERRED;
+  //     }
+  //     if (is_awaited) {
+  //       t.c = prev_version;
+  //       t.v = prev_value;
+  //       prev_value = value;
+  //     }
+  //   }
+  // });
+  // return res;
 }
 
 function capture_deferred(fn) {
@@ -783,68 +768,18 @@ export function flush_sync(fn) {
  * @param {Block} block
  * @returns {Object}
  */
-export function tracked_spread_object(fn, block) {
+export function spread_props(fn, block) {
   let computed = derived(fn, block);
 
-  return new Proxy({}, {
-    get(target, property) {
-      const obj = get_derived(computed);
-      return obj[property];
-    }
-  });
-}
-
-/**
- * @param {any} obj
- * @param {string[]} properties
- * @param {Block} block
- * @returns {object}
- */
-export function tracked_object(obj, properties, block) {
-  /** @type {Record<string, Tracked | Derived>} */
-  var tracked_properties = obj[TRACKED_OBJECT];
-
-  if (tracked_properties === undefined) {
-    tracked_properties = {};
-    define_property(obj, TRACKED_OBJECT, {
-      value: tracked_properties,
-      enumerable: false,
-    });
-  }
-
-  for (var i = 0; i < properties.length; i++) {
-    var property = properties[i];
-    /** @type {Tracked | Derived} */
-    var tracked_property;
-
-    // accessor passed in, to avoid an expensive get_descriptor call in the fast path
-    if (property[0] === '#') {
-      property = property.slice(1);
-      var descriptor = /** @type {PropertyDescriptor} */ (get_descriptor(obj, property));
-      var desc_get = descriptor.get;
-      tracked_property = derived(desc_get, block);
-      /** @type {any} */
-      var initial = run_derived(/** @type {Derived} */ (tracked_property));
-      // If there's a setter, we need to set the initial value
-      if (descriptor.set !== undefined) {
-        obj[property] = initial;
-      }
-    } else {
-      var initial = obj[property];
-
-      if (typeof initial === 'function' && initial[COMPUTED_PROPERTY] === true) {
-        tracked_property = derived(initial, block);
-        initial = run_derived(/** @type {Derived} */ (tracked_property));
-        obj[property] = initial;
-      } else {
-        tracked_property = tracked(initial, block);
-      }
-    }
-
-    tracked_properties[property] = tracked_property;
-  }
-
-  return obj;
+  return new Proxy(
+    {},
+    {
+      get(target, property) {
+        const obj = get_derived(computed);
+        return obj[property];
+      },
+    },
+  );
 }
 
 /**
@@ -899,72 +834,11 @@ export function get_property(obj, property, chain = false) {
   return get(tracked);
 }
 
-/**
- * @param {any} obj
- * @param {string | number | symbol} property
- * @param {boolean} [chain=false]
- * @returns {any}
- */
-export function old_get_property(obj, property, chain = false) {
-  if (chain && obj == null) {
-    return undefined;
-  }
-  var value = obj[property];
-  var tracked_properties = obj[TRACKED_OBJECT];
-  var tracked_property = tracked_properties?.[property];
-
-  if (tracked_property !== undefined) {
-    value = get(tracked_property);
-    if (obj[property] !== value) {
-      obj[property] = value;
-    }
-  } else if (is_ripple_array(obj)) {
-    obj.$length;
-  }
-
-  return value;
-}
-
 export function set_property(obj, property, value, block) {
   var tracked = obj[property];
   set(tracked, value, block);
 }
 
-/**
- * @param {any} obj
- * @param {string | number | symbol} property
- * @param {any} value
- * @param {Block} block
- * @returns {any}
- */
-export function old_set_property(obj, property, value, block) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-  var rip_arr = is_ripple_array(obj);
-  var tracked = !(rip_arr && property === 'length') ? tracked_properties?.[property] : undefined;
-
-  if (tracked === undefined) {
-    // Handle computed assignments to arrays
-    if (rip_arr) {
-      if (property === 'length') {
-        // overriding `length` in RippleArray class doesn't work
-        // placing it here instead
-        throw new Error('Cannot set length on RippleArray, use $length instead');
-      } else if (is_positive_integer(property)) {
-        // for any other type we use obj[property] = value below as per native JS
-        return with_scope(block, () => {
-          obj[ARRAY_SET_INDEX_AT](property, value);
-        });
-      }
-    }
-
-    return (obj[property] = value);
-  }
-
-  obj[property] = value;
-
-  set(tracked, value, block);
-}
-
 /**
  * @param {Tracked} tracked
  * @param {Block} block
@@ -1017,36 +891,6 @@ export function update_property(obj, property, block, d = 1) {
   return new_value;
 }
 
-/**
- * @param {any} obj
- * @param {string | number | symbol} property
- * @param {Block} block
- * @param {number} [d]
- * @returns {number}
- */
-export function old_update_property(obj, property, block, d = 1) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-  var tracked = tracked_properties?.[property];
-  var tracked_exists = tracked !== undefined;
-  var value = tracked_exists ? get(tracked) : obj[property];
-
-  if (d === 1) {
-    value++;
-    if (tracked_exists) {
-      increment(tracked, block);
-    }
-  } else {
-    value--;
-    if (tracked_exists) {
-      decrement(tracked, block);
-    }
-  }
-
-  obj[property] = value;
-
-  return value;
-}
-
 export function update_pre_property(obj, property, block, d = 1) {
   var tracked = obj[property];
   var value = get(tracked);
@@ -1055,117 +899,6 @@ export function update_pre_property(obj, property, block, d = 1) {
   return new_value;
 }
 
-/**
- * @param {any} obj
- * @param {string | number | symbol} property
- * @param {Block} block
- * @param {number} [d]
- * @returns {number}
- */
-export function old_update_pre_property(obj, property, block, d = 1) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-  var tracked = tracked_properties?.[property];
-  var tracked_exists = tracked !== undefined;
-  var value = tracked_exists ? get(tracked) : obj[property];
-
-  if (d === 1) {
-    ++value;
-    if (tracked_exists) {
-      increment(tracked, block);
-    }
-  } else {
-    --value;
-    if (tracked_exists) {
-      decrement(tracked, block);
-    }
-  }
-
-  obj[property] = value;
-
-  return value;
-}
-
-/**
- * @param {any} val
- * @param {StructuredSerializeOptions} [options]
- * @returns {any}
- */
-export function structured_clone(val, options) {
-  if (typeof val === 'object' && val !== null) {
-    var tracked_properties = val[TRACKED_OBJECT];
-    if (tracked_properties !== undefined) {
-      if (is_ripple_array(val)) {
-        val.$length;
-      }
-      return structured_clone(object_values(val), options);
-    }
-  }
-  return original_structured_clone(val, options);
-}
-
-export function object_keys(obj) {
-  if (is_ripple_array(obj)) {
-    obj.$length;
-  }
-  return original_object_keys(obj);
-}
-
-export function object_values(obj) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-
-  if (tracked_properties === undefined) {
-    return original_object_values(obj);
-  }
-  if (is_ripple_array(obj)) {
-    obj.$length;
-  }
-  var keys = original_object_keys(obj);
-  var values = [];
-
-  for (var i = 0; i < keys.length; i++) {
-    values.push(old_get_property(obj, keys[i]));
-  }
-
-  return values;
-}
-
-export function object_entries(obj) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-
-  if (tracked_properties === undefined) {
-    return original_object_entries(obj);
-  }
-  if (is_ripple_array(obj)) {
-    obj.$length;
-  }
-  var keys = original_object_keys(obj);
-  var entries = [];
-
-  for (var i = 0; i < keys.length; i++) {
-    var key = keys[i];
-    entries.push([key, old_get_property(obj, key)]);
-  }
-
-  return entries;
-}
-
-export function spread_object(obj) {
-  var tracked_properties = obj[TRACKED_OBJECT];
-
-  if (tracked_properties === undefined) {
-    return { ...obj };
-  }
-  var keys = original_object_keys(obj);
-  var values = {};
-
-  for (var i = 0; i < keys.length; i++) {
-    var key = keys[i];
-    values[key] = old_get_property(obj, key);
-  }
-
-  return values;
-}
-
 /**
  * @template T
  * @param {Block} block

package/src/runtime/internal/client/utils.js

@@ -1,5 +1,3 @@
-import { TRACKED_OBJECT } from './constants.js';
-
 export var get_descriptor = Object.getOwnPropertyDescriptor;
 export var get_descriptors = Object.getOwnPropertyDescriptors;
 export var array_from = Array.from;
@@ -18,14 +16,6 @@ export function create_anchor() {
   return t;
 }
 
-/**
- * @param {any} obj
- * @returns {boolean}
- */
-export function is_ripple_array(obj) {
-  return is_array(obj) && TRACKED_OBJECT in obj && '$length' in obj;
-}
-
 /**
  * @param {any} value
  * @returns {boolean}

package/src/runtime/map.js

@@ -1,17 +1,30 @@
+/** @import { Block, Tracked } from '#client' */
 import { get, increment, safe_scope, set, tracked } from './internal/client/runtime.js';
 
 const introspect_methods = ['entries', 'forEach', 'values', Symbol.iterator];
 
 let init = false;
 
-export class RippleMap extends Map {
+/**
+ * @template K, V
+ * @extends {Map<K, V>}
+ * @returns {TrackedMap<K, V>}
+ */
+export class TrackedMap extends Map {
+  /** @type {Tracked} */
   #tracked_size;
+  /** @type {Map<K, Tracked>} */
   #tracked_items = new Map();
+  /** @type {Block} */
+  #block;
 
+  /**
+   * @param {Iterable<readonly [K, V]>} [iterable]
+   */
   constructor(iterable) {
     super();
 
-    var block = safe_scope();
+    var block = this.#block = safe_scope();
 
     if (iterable) {
       for (var [key, value] of iterable) {
@@ -20,7 +33,7 @@ export class RippleMap extends Map {
       }
     }
 
-    this.#tracked_size = tracked(this.size, block);
+    this.#tracked_size = tracked(super.size, block);
 
     if (!init) {
       init = true;
@@ -29,12 +42,12 @@ export class RippleMap extends Map {
   }
 
   #init() {
-    var proto = RippleMap.prototype;
+    var proto = TrackedMap.prototype;
     var map_proto = Map.prototype;
 
     for (const method of introspect_methods) {
       proto[method] = function (...v) {
-        this.$size;
+        this.size;
         this.#read_all();
 
         return map_proto[method].apply(this, v);
@@ -48,7 +61,7 @@ export class RippleMap extends Map {
 
     if (t === undefined) {
       // same logic as has
-      this.$size;
+      this.size;
     } else {
       get(t);
     }
@@ -66,7 +79,7 @@ export class RippleMap extends Map {
       // It's not possible to have a disconnect, we tract each key
       // If the key doesn't exist, track the size in case it's added later
       // but don't create tracked entries willy-nilly to track all possible keys
-      this.$size;
+      this.size;
     } else {
       get(t);
     }
@@ -75,7 +88,7 @@ export class RippleMap extends Map {
   }
 
   set(key, value) {
-    var block = safe_scope();
+    var block = this.#block;
     var tracked_items = this.#tracked_items;
     var t = tracked_items.get(key);
     var prev_res = super.get(key);
@@ -84,7 +97,7 @@ export class RippleMap extends Map {
 
     if (!t) {
       tracked_items.set(key, tracked(0, block));
-      set(this.#tracked_size, this.size, block);
+      set(this.#tracked_size, super.size, block);
     } else if (prev_res !== value) {
       increment(t, block);
     }
@@ -93,7 +106,7 @@ export class RippleMap extends Map {
   }
 
   delete(key) {
-    var block = safe_scope();
+    var block = this.#block;
     var tracked_items = this.#tracked_items;
     var t = tracked_items.get(key);
     var result = super.delete(key);
@@ -101,14 +114,14 @@ export class RippleMap extends Map {
     if (t) {
       increment(t, block);
       tracked_items.delete(key);
-      set(this.#tracked_size, this.size, block);
+      set(this.#tracked_size, super.size, block);
     }
 
     return result;
   }
 
   clear() {
-    var block = safe_scope();
+    var block = this.#block;
 
     if (super.size === 0) {
       return;
@@ -124,7 +137,7 @@ export class RippleMap extends Map {
   }
 
   keys() {
-    this.$size;
+    this.size;
     return super.keys();
   }
 
@@ -134,12 +147,12 @@ export class RippleMap extends Map {
     }
   }
 
-  get $size() {
+  get size() {
     return get(this.#tracked_size);
   }
 
   toJSON() {
-    this.$size;
+    this.size;
     this.#read_all();
 
     return [...this];