ripple 0.3.65 → 0.3.66

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # ripple
 
+## 0.3.66
+
+### Patch Changes
+
+- [#1166](https://github.com/Ripple-TS/ripple/pull/1166)
+  [`1dc0331`](https://github.com/Ripple-TS/ripple/commit/1dc0331f7b7296545ee459dc31a92057871cbb0d)
+  Thanks [@leonidaz](https://github.com/leonidaz)! - Replace all [0] and [1]
+  compiled output with `.value` and direct `lazy` Throw runtime errors for direct
+  `[0]` and `[1]` access on tracked and derived values. Fix type removal for
+  non-tsx paths Remove the public `get` and `set` exports in favor of `.value`
+  access. Ignore lazy writes past the tracked tuple length instead of creating
+  numeric properties.
+
+- [#1169](https://github.com/Ripple-TS/ripple/pull/1169)
+  [`bf1cb96`](https://github.com/Ripple-TS/ripple/commit/bf1cb96f2ea9b325e30f5a051c451f92659d20f9)
+  Thanks [@leonidaz](https://github.com/leonidaz)! - Type host `ref={...}`
+  attributes, named ref props, and generated ref keys so inline callbacks
+  `{ref ...}` receive element-specific JSX types.
+
+  Exclude `returnType` from the compiler types that use typeAnnotation instead due
+  to the way `@sveltejs/acorn-typescript` parses them.
+
+- [#1168](https://github.com/Ripple-TS/ripple/pull/1168)
+  [`146cbf5`](https://github.com/Ripple-TS/ripple/commit/146cbf58120aad05161d503118a47bdc566ba869)
+  Thanks [@leonidaz](https://github.com/leonidaz)! - Add global root pending/catch
+  boundary support and allow Ripple config routes to reference named entry
+  exports.
+
+  Refactor vite-plugin to keep code generation in one place, produce cache as
+  necessary and generate actual files for inspection.
+
+- Updated dependencies
+  [[`1dc0331`](https://github.com/Ripple-TS/ripple/commit/1dc0331f7b7296545ee459dc31a92057871cbb0d),
+  [`bf1cb96`](https://github.com/Ripple-TS/ripple/commit/bf1cb96f2ea9b325e30f5a051c451f92659d20f9)]:
+  - @tsrx/ripple@0.1.14
+  - @tsrx/core@0.1.14
+
 ## 0.3.65
 
 ### Patch Changes

package/package.json

@@ -3,7 +3,7 @@
   "description": "Ripple is an elegant TypeScript UI framework",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.3.65",
+  "version": "0.3.66",
   "type": "module",
   "module": "src/runtime/index-client.js",
   "main": "src/runtime/index-client.js",
@@ -74,8 +74,8 @@
     "clsx": "^2.1.1",
     "devalue": "^5.8.1",
     "esm-env": "^1.2.2",
-    "@tsrx/core": "0.1.13",
-    "@tsrx/ripple": "0.1.13"
+    "@tsrx/core": "0.1.14",
+    "@tsrx/ripple": "0.1.14"
   },
   "devDependencies": {
     "@types/estree": "^1.0.8",

package/src/jsx-runtime.d.ts

@@ -1,4 +1,4 @@
-import type { AddEventObject, TSRXElement } from '#public';
+import type { AddEventObject, RefKey, TSRXElement } from '#public';
 import type { Nullable } from '#helpers';
 
 /**
@@ -67,6 +67,17 @@ type EventHandlerValue<Target extends globalThis.EventTarget, EventType extends
 	| EventHandler<Target, EventType>
 	| EventHandlerObject<Target, EventType>;
 
+type RefValue<Target extends globalThis.Element> =
+	| ((node: Target) => void | (() => void))
+	| { value: Target | null }
+	| Target
+	| null
+	| undefined;
+
+type RefAttribute<Target extends globalThis.Element> = {
+	[Key in RefKey]?: RefValue<Target>;
+};
+
 type ElementEventHandler<
 	Target extends globalThis.EventTarget,
 	Type extends keyof GlobalEventHandlersEventMap,
@@ -459,7 +470,10 @@ type SlotHTMLAttributes<Target extends HTMLSlotElement = HTMLSlotElement> =
 	};
 
 // Base HTML attributes
-interface HTMLAttributes<Target extends globalThis.Element = globalThis.HTMLElement> {
+interface HTMLAttributes<
+	Target extends globalThis.Element = globalThis.HTMLElement,
+> extends RefAttribute<Target> {
+	ref?: RefValue<Target>;
 	class?: ClassValue | undefined | null;
 	className?: Nullable<string>;
 	id?: Nullable<string>;
@@ -1255,7 +1269,7 @@ declare global {
 			template: HTMLAttributes<HTMLTemplateElement>;
 
 			// Catch-all for any other elements
-			[elemName: string]: HTMLAttributes<never>;
+			[elemName: string]: HTMLAttributes<any>;
 		}
 
 		interface ElementChildrenAttribute {

package/src/runtime/index-client.js

@@ -1,4 +1,4 @@
-/** @import { Block, CompatOptions } from '#client' */
+/** @import { Block, CompatOptions, RootBoundaryOptions } from '#client' */
 
 import { destroy_block, root } from './internal/client/blocks.js';
 import { handle_root_events } from './internal/client/events.js';
@@ -9,10 +9,10 @@ import {
 } from './internal/client/operations.js';
 import { active_block } from './internal/client/runtime.js';
 import { create_anchor } from './internal/client/utils.js';
+import { try_block } from './internal/client/try.js';
 import { remove_ssr_css } from './internal/client/css.js';
 import {
 	clear_track_hash_reference,
-	hydrate_next,
 	hydrate_node,
 	hydrating,
 	set_hydrate_node,
@@ -37,9 +37,37 @@ function get_default_compat() {
 		.__RIPPLE_COMPAT__;
 }
 
+/**
+ * @param {Node} anchor
+ * @param {(anchor: Node) => void} render_component
+ * @param {RootBoundaryOptions | undefined} boundary
+ * @returns {void}
+ */
+function render_root_boundary(anchor, render_component, boundary) {
+	const Pending = boundary?.pending;
+	const Catch = boundary?.catch;
+
+	try_block(
+		anchor,
+		(component_anchor) => {
+			render_component(component_anchor);
+		},
+		Catch
+			? (catch_anchor, error, reset) => {
+					Catch(catch_anchor, { error, reset: reset ?? (() => {}) }, active_block);
+				}
+			: null,
+		(pending_anchor) => {
+			if (Pending) {
+				Pending(pending_anchor, {}, active_block);
+			}
+		},
+	);
+}
+
 /**
  * @param {(anchor: Node, props: Record<string, any>, active_block: Block | null) => void} component
- * @param {{ props?: Record<string, any>, target: HTMLElement }} options
+ * @param {{ props?: Record<string, any>, target: HTMLElement, rootBoundary?: RootBoundaryOptions }} options
  * @returns {() => void}
  */
 export function mount(component, options) {
@@ -61,7 +89,13 @@ export function mount(component, options) {
 	const cleanup_events = handle_root_events(target);
 
 	const _root = root(() => {
-		component(anchor, props, active_block);
+		render_root_boundary(
+			anchor,
+			(component_anchor) => {
+				component(component_anchor, props, active_block);
+			},
+			options.rootBoundary,
+		);
 	}, compat);
 
 	return () => {
@@ -72,7 +106,7 @@ export function mount(component, options) {
 
 /**
  * @param {(anchor: Node, props: Record<string, any>, active_block: Block | null) => void} component
- * @param {{ props?: Record<string, any>, target: HTMLElement }} options
+ * @param {{ props?: Record<string, any>, target: HTMLElement, rootBoundary?: RootBoundaryOptions }} options
  * @returns {() => void}
  */
 export function hydrate(component, options) {
@@ -99,10 +133,15 @@ export function hydrate(component, options) {
 
 		set_hydrating(true);
 		set_hydrate_node(/** @type {Comment} */ (anchor));
-		hydrate_next();
 
 		_root = root(() => {
-			component(/** @type {Comment} */ (anchor), props, active_block);
+			render_root_boundary(
+				/** @type {Comment} */ (anchor),
+				(component_anchor) => {
+					component(component_anchor, props, active_block);
+				},
+				options.rootBoundary,
+			);
 		}, compat);
 	} catch (e) {
 		throw e;
@@ -154,7 +193,7 @@ export { user_effect as effect } from './internal/client/blocks.js';
 
 export { Portal } from './internal/client/portal.js';
 
-export { ref_prop as createRefKey, get, public_set as set } from './internal/client/runtime.js';
+export { ref_prop as createRefKey } from './internal/client/runtime.js';
 
 export { isRefProp } from '@tsrx/core/runtime/ref';
 

package/src/runtime/index-server.js

@@ -2,8 +2,6 @@ import { output_push, noop } from './internal/server/index.js';
 
 export { Context } from './internal/server/context.js';
 export {
-	get,
-	set,
 	untrack,
 	track,
 	track_async as trackAsync,

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

@@ -46,6 +46,11 @@ export {
 	get,
 	get_tracked,
 	get_derived,
+	lazy_array_get,
+	lazy_array_rest,
+	lazy_array_set,
+	lazy_array_update,
+	lazy_array_update_pre,
 	set,
 	tracked,
 	spread_props,

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

@@ -47,6 +47,7 @@ import {
 import { is_ripple_object } from './utils.js';
 
 import {
+	iterable_array_from,
 	define_property,
 	get_descriptor,
 	get_own_property_symbols,
@@ -54,6 +55,10 @@ import {
 	object_keys,
 } from '@tsrx/core/runtime/language-helpers';
 import { get_async_track_result } from '../../../utils/async.js';
+import {
+	throw_tracked_index_reference_error,
+	throw_tracked_index_value_error,
+} from '../../../utils/errors.js';
 import { get_track_async_script_id } from '../../../utils/track-async-serialization.js';
 import * as devalue from 'devalue';
 import { hydrating, track_hash_reference } from './hydration.js';
@@ -415,15 +420,15 @@ class TrackedValue {
 	}
 	/** @returns {any} */
 	get [0]() {
-		return get_tracked(this);
+		return throw_tracked_index_value_error();
 	}
 	/** @param {any} v */
 	set [0](v) {
-		set(this, v);
+		throw_tracked_index_value_error();
 	}
 	/** @returns {Tracked} */
 	get [1]() {
-		return /** @type {Tracked} */ (this);
+		return throw_tracked_index_reference_error();
 	}
 	/** @returns {any} */
 	get value() {
@@ -475,15 +480,15 @@ class DerivedValue {
 	}
 	/** @returns {any} */
 	get [0]() {
-		return get_derived(this);
+		return throw_tracked_index_value_error();
 	}
 	/** @param {any} v */
 	set [0](v) {
-		set(this, v);
+		throw_tracked_index_value_error();
 	}
 	/** @returns {Derived} */
 	get [1]() {
-		return /** @type {Derived} */ (this);
+		return throw_tracked_index_reference_error();
 	}
 	/** @returns {any} */
 	get value() {
@@ -1190,6 +1195,60 @@ export function get(tracked) {
 		: get_tracked(/** @type {Tracked} */ (tracked));
 }
 
+/**
+ * @param {any} lazy
+ * @param {number} [index]
+ * @returns {any}
+ */
+export function lazy_array_get(lazy, index = 0) {
+	if (is_array(lazy)) {
+		return lazy[index];
+	}
+	var flags = lazy.f;
+	if (flags === TRACKED) {
+		return index === 0
+			? get_tracked(/** @type {Tracked} */ (lazy))
+			: index === 1
+				? lazy
+				: undefined;
+	}
+	if (flags === DERIVED) {
+		return index === 0
+			? get_derived(/** @type {Derived} */ (lazy))
+			: index === 1
+				? lazy
+				: undefined;
+	}
+	return iterable_array_from(lazy, index)[0];
+}
+
+/**
+ * @param {any} lazy
+ * @param {number} [index]
+ * @returns {any[]}
+ */
+export function lazy_array_rest(lazy, index = 0) {
+	if (is_array(lazy)) {
+		return lazy.slice(index);
+	}
+	var flags = lazy.f;
+	if (flags === TRACKED) {
+		return index === 0
+			? [get_tracked(/** @type {Tracked} */ (lazy)), lazy]
+			: index === 1
+				? [lazy]
+				: [];
+	}
+	if (flags === DERIVED) {
+		return index === 0
+			? [get_derived(/** @type {Derived} */ (lazy)), lazy]
+			: index === 1
+				? [lazy]
+				: [];
+	}
+	return iterable_array_from(lazy, index);
+}
+
 /**
  * @param {Tracked} tracked
  */
@@ -1214,13 +1273,54 @@ export function get_tracked(tracked) {
 }
 
 /**
- * Exposed version of `set` to avoid internal bugs
- * since block is required on the internal `set`
- * @param {Derived | Tracked} tracked
+ * @param {any} lazy
  * @param {any} value
+ * @param {number} [index]
+ * @returns {void}
  */
-export function public_set(tracked, value) {
-	set(tracked, value);
+export function lazy_array_set(lazy, value, index = 0) {
+	if (is_array(lazy)) {
+		lazy[index] = value;
+		return;
+	}
+	var flags = lazy.f;
+	if (flags === TRACKED || flags === DERIVED) {
+		if (index === 0) {
+			set(/** @type {Derived | Tracked} */ (lazy), value);
+			return;
+		}
+		if (index === 1) {
+			throw_tracked_index_reference_error();
+		}
+		return;
+	}
+	lazy[index] = value;
+}
+
+/**
+ * @param {any} lazy
+ * @param {number} [index]
+ * @param {number} [d]
+ * @returns {number}
+ */
+export function lazy_array_update(lazy, index = 0, d = 1) {
+	var value = lazy_array_get(lazy, index);
+	var result = d === 1 ? value++ : value--;
+	lazy_array_set(lazy, value, index);
+	return result;
+}
+
+/**
+ * @param {any} lazy
+ * @param {number} [index]
+ * @param {number} [d]
+ * @returns {number}
+ */
+export function lazy_array_update_pre(lazy, index = 0, d = 1) {
+	var value = lazy_array_get(lazy, index);
+	var new_value = d === 1 ? ++value : --value;
+	lazy_array_set(lazy, new_value, index);
+	return new_value;
 }
 
 /**

package/src/runtime/internal/client/types.d.ts

@@ -69,6 +69,11 @@ export type CompatOptions = {
 	[key: string]: CompatApi;
 };
 
+export type RootBoundaryOptions = {
+	pending?: (anchor: Node, props: Record<string, never>, block: Block | null) => void;
+	catch?: (anchor: Node, props: { error: unknown; reset: () => void }, block: Block | null) => void;
+};
+
 declare global {
 	interface Element {
 		__attributes?: {

package/src/runtime/internal/server/blocks.js

@@ -88,6 +88,7 @@ export function try_block(try_fn, catch_fn = null, pending_fn = null) {
 	try {
 		try_fn();
 	} catch (error) {
+		set_active_block(created_block);
 		if (error === ASYNC_DERIVED_READ_THROWN && created_block.f & TRY_PENDING_BLOCK) {
 			// we should only end up here in the streaming mode during the sync phase
 			created_block.o.clear();