@oscarpalmer/abydon 0.23.1 → 0.24.0

package/dist/fragments.mjs

@@ -1,27 +1,52 @@
-import { ERROR_FRAGMENT, ERROR_IDENTIFIER_DUPLICATE, ERROR_IDENTIFIER_TYPE, NAME_FRAGMENTS } from "./constants.mjs";
-import { isFragment, isFragments } from "./helpers/index.mjs";
+import { MESSAGE_FRAGMENTS_FRAGMENT_RESULT, MESSAGE_FRAGMENTS_FRAGMENT_TYPE, MESSAGE_FRAGMENTS_IDENTIFIER_RESULT_DUPLICATE, MESSAGE_FRAGMENTS_IDENTIFIER_RESULT_TYPE, MESSAGE_FRAGMENTS_IDENTIFIER_TYPE, MESSAGE_FRAGMENTS_VALUE, NAME_FRAGMENTS, SYMBOL } from "./constants.mjs";
+import { isFragment } from "./helpers/index.mjs";
 import { getString } from "@oscarpalmer/atoms/string";
-import { array } from "@oscarpalmer/mora";
+import { array, isReactiveArray } from "@oscarpalmer/mora";
 //#region src/fragments.ts
-var Fragments = class {
-	#state;
-	constructor(items, identify, fragment) {
-		Object.defineProperty(this, NAME_FRAGMENTS, { value: true });
-		this.#state = {
-			fragment,
-			identify,
-			array: items,
-			instances: {},
-			mapped: array([]),
-			subscriber: void 0
-		};
-		fragmentsStates.set(this, this.#state);
-		initializeFragments(this.#state);
-	}
-};
-function handleFragments(item, remove) {
-	const state = isFragments(item) ? fragmentsStates.get(item) : item;
-	(remove ? removeFragments : initializeFragments)(state);
+function Fragments(items, identify, fragment) {
+	this[SYMBOL] = {
+		fragment,
+		identify,
+		array: items,
+		instances: {},
+		mapped: array([]),
+		name: NAME_FRAGMENTS,
+		subscription: void 0
+	};
+	initializeFragments.call(this);
+}
+Fragments.prototype.remove = removeFragments;
+/**
+* Create a _Fragments_ instance from a reactive array
+*
+* _A Fragments instance can be used to efficiently render a list of items that may change over time, using unique identifiers to track each item, only adding, removing, or updating each related Fragment._
+*
+* @example
+* ```ts
+* const fruits = array(['Apple', 'Banana', 'Cherry']);
+* const items = fragments(
+*   fruits,
+*   fruit => fruit,                           // Identifies a unique item
+*   fruit => html`<p>${fruit}</p>`,           // Creates a Fragment from an item
+* );
+* html`${items}`.appendTo(document.body)      // Renders '<p>Apple</p><p>Banana</p><p>Cherry</p>'
+* fruits.push(['Date', 'Elderberry', 'Fig']); // Appends '<p>Date</p><p>Elderberry</p><p>Fig</p>'
+*                                             // without re-rendering the existing Fragments
+* ```
+*
+* @param array Reactive array
+* @param identify Function to identify item uniquely _(non-nullable)_
+* @param fragment Function to create _Fragment_ from item
+* @returns _Fragments_
+*/
+function fragments(array, identify, fragment) {
+	if (!isReactiveArray(array)) throw new TypeError(MESSAGE_FRAGMENTS_VALUE);
+	if (typeof identify !== "function") throw new TypeError(MESSAGE_FRAGMENTS_IDENTIFIER_TYPE);
+	if (typeof fragment !== "function") throw new TypeError(MESSAGE_FRAGMENTS_FRAGMENT_TYPE);
+	return new Fragments(array, identify, fragment);
+}
+function handleFragments(instance, remove) {
+	(remove ? removeFragments : initializeFragments).call(instance);
 }
 function handleItems(state, items) {
 	const keys = /* @__PURE__ */ new Set();
@@ -30,13 +55,13 @@ function handleItems(state, items) {
 	for (let index = 0; index < length; index += 1) {
 		const item = items[index];
 		const identifier = state.identify(item);
-		if (identifier == null) throw new TypeError(ERROR_IDENTIFIER_TYPE);
+		if (identifier == null) throw new TypeError(MESSAGE_FRAGMENTS_IDENTIFIER_RESULT_TYPE);
 		const key = getString(identifier);
-		if (keys.has(key)) throw new Error(ERROR_IDENTIFIER_DUPLICATE.replace("<>", key));
+		if (keys.has(key)) throw new Error(MESSAGE_FRAGMENTS_IDENTIFIER_RESULT_DUPLICATE.replace("<>", key));
 		let instance = state.instances[key];
 		if (instance == null) {
 			instance = state.fragment(item);
-			if (!isFragment(instance)) throw new Error(ERROR_FRAGMENT);
+			if (!isFragment(instance)) throw new Error(MESSAGE_FRAGMENTS_FRAGMENT_RESULT);
 		}
 		instance.configure({ identifier: key });
 		state.instances[key] = instance;
@@ -46,15 +71,18 @@ function handleItems(state, items) {
 	state.mapped.set(mapped);
 	updateFragments(state, keys);
 }
-function initializeFragments(state) {
-	state.subscriber ??= state.array.subscribe((items) => {
+function initializeFragments() {
+	const state = this[SYMBOL];
+	state.subscription ??= state.array.subscribe((items) => {
 		handleItems(state, items);
 	});
 }
-function removeFragments(state) {
-	state.subscriber?.();
+function removeFragments() {
+	const state = this[SYMBOL];
+	state.subscription?.unsubscribe();
+	state.mapped.set([]);
 	updateFragments(state);
-	state.subscriber = void 0;
+	state.subscription = void 0;
 }
 function updateFragments(state, active) {
 	const next = {};
@@ -64,11 +92,10 @@ function updateFragments(state, active) {
 	for (let index = 0; index < length; index += 1) {
 		const key = keys[index];
 		if (active?.has(key)) next[key] = previous[key];
-		else previous[key].remove();
+		else if (active == null) previous[key].remove();
 	}
 	state.instances = next;
 	active?.clear();
 }
-const fragmentsStates = /* @__PURE__ */ new WeakMap();
 //#endregion
-export { Fragments, fragmentsStates, handleFragments };
+export { fragments, handleFragments };

package/dist/helpers/dom.d.mts

@@ -1,6 +1,5 @@
 //#region src/helpers/dom.d.ts
-declare function createNodes(value: unknown): ChildNode[];
-declare function removeNodes(nodes: ChildNode[]): void;
-declare function replaceNodes(from: ChildNode[], to: ChildNode[]): ChildNode[];
-//#endregion
-export { createNodes, removeNodes, replaceNodes };
+export declare function createNodes(value: unknown): ChildNode[];
+export declare function removeNodes(nodes: ChildNode[]): void;
+export declare function replaceNodes(from: ChildNode[], to: ChildNode[]): ChildNode[];
+//#endregion

package/dist/helpers/index.d.mts

@@ -1,24 +1,22 @@
-import { Fragment } from "../fragment.mjs";
-import { FragmentData } from "../models.mjs";
 import { ARRAY_COMPARISON_ADDED, ARRAY_COMPARISON_DISSIMILAR, ARRAY_COMPARISON_REMOVED } from "../constants.mjs";
-import { Fragments } from "../fragments.mjs";
+import { Fragment, FragmentState, Fragments } from "../models.mjs";
 import { Computed } from "@oscarpalmer/mora";
 import { GenericCallback } from "@oscarpalmer/atoms/models";
-
 //#region src/helpers/index.d.ts
-declare function compareArrays(first: unknown[], second: unknown[]): typeof ARRAY_COMPARISON_ADDED | typeof ARRAY_COMPARISON_DISSIMILAR | typeof ARRAY_COMPARISON_REMOVED;
+export declare function compareArrays(first: unknown[], second: unknown[]): typeof ARRAY_COMPARISON_ADDED | typeof ARRAY_COMPARISON_DISSIMILAR | typeof ARRAY_COMPARISON_REMOVED;
 /**
  * Is the value a _Fragment_?
+ *
  * @param value Value to check
  * @returns `true` if the value is a _Fragment_, otherwise `false`
  */
-declare function isFragment(value: unknown): value is Fragment;
+export declare function isFragment(value: unknown): value is Fragment;
 /**
  * Is the value a _Fragments_ instance?
+ *
  * @param value Value to check
  * @returns `true` if the value is a _Fragments_ instance, otherwise `false`
  */
-declare function isFragments(value: unknown): value is Fragments;
-declare function setComputedValue(data: FragmentData, callback: GenericCallback, after: (computation: Computed<unknown>) => void): void;
-//#endregion
-export { compareArrays, isFragment, isFragments, setComputedValue };
+export declare function isFragments(value: unknown): value is Fragments;
+export declare function setComputedValue(data: FragmentState, callback: GenericCallback, after: (computation: Computed<unknown>) => void): void;
+//#endregion

package/dist/helpers/index.mjs

@@ -1,4 +1,4 @@
-import { ARRAY_COMPARISON_ADDED, ARRAY_COMPARISON_DISSIMILAR, ARRAY_COMPARISON_REMOVED, NAME_FRAGMENT, NAME_FRAGMENTS } from "../constants.mjs";
+import { ARRAY_COMPARISON_ADDED, ARRAY_COMPARISON_DISSIMILAR, ARRAY_COMPARISON_REMOVED, NAME_FRAGMENT, NAME_FRAGMENTS, SYMBOL } from "../constants.mjs";
 import { computed } from "@oscarpalmer/mora";
 //#region src/helpers/index.ts
 function compareArrays(first, second) {
@@ -10,6 +10,7 @@ function compareArrays(first, second) {
 }
 /**
 * Is the value a _Fragment_?
+*
 * @param value Value to check
 * @returns `true` if the value is a _Fragment_, otherwise `false`
 */
@@ -18,6 +19,7 @@ function isFragment(value) {
 }
 /**
 * Is the value a _Fragments_ instance?
+*
 * @param value Value to check
 * @returns `true` if the value is a _Fragments_ instance, otherwise `false`
 */
@@ -25,7 +27,7 @@ function isFragments(value) {
 	return isNamed(value, NAME_FRAGMENTS);
 }
 function isNamed(value, name) {
-	return typeof value === "object" && value != null && name in value && value[name] === true;
+	return typeof value === "object" && value !== null && SYMBOL in value && value[SYMBOL].name === name;
 }
 function setComputedValue(data, callback, after) {
 	const computation = computed(callback);

package/dist/index.d.mts

@@ -1,49 +1,7 @@
-import { Fragment } from "./fragment.mjs";
-import { Fragments } from "./fragments.mjs";
+import { Fragment, Fragments } from "./models.mjs";
+import { fragment } from "./fragment.mjs";
+import { fragments } from "./fragments.mjs";
 import { isFragment, isFragments } from "./helpers/index.mjs";
-import { ReactiveArray } from "@oscarpalmer/mora";
+import "@oscarpalmer/mora";
 export * from "@oscarpalmer/mora";
-
-//#region src/index.d.ts
-/**
- * Create a _Fragments_ instance from a reactive array
- *
- * _A Fragments instance can be used to efficiently render a list of items that may change over time, using unique identifiers to track each item, only adding, removing, or updating each related Fragment._
- *
- * @example
- * ```ts
- * const fruits = array(['Apple', 'Banana', 'Cherry']);
- * const items = fragments(
- *   fruits,
- *   fruit => fruit,                           // Identifies a unique item
- *   fruit => html`<p>${fruit}</p>`,           // Creates a Fragment from an item
- * );
- * html`${items}`.appendTo(document.body)      // Renders '<p>Apple</p><p>Banana</p><p>Cherry</p>'
- * fruits.push(['Date', 'Elderberry', 'Fig']); // Appends '<p>Date</p><p>Elderberry</p><p>Fig</p>'
- *                                             // without re-rendering the existing Fragments
- * ```
- *
- * @param array Reactive array
- * @param identify Function to identify item uniquely _(non-nullable)_
- * @param fragment Function to create _Fragment_ from item
- * @returns _Fragments_
- */
-declare function fragments<Item>(array: ReactiveArray<Item>, identify: (item: Item) => unknown, fragment: (item: Item) => Fragment): Fragments;
-/**
- * Create a _Fragment_ from a template
- *
- * _A Fragment can be used to efficiently render a template that may change over time, only updating the necessary parts of the DOM._
- *
- * @example
- * ```ts
- * const name = signal('World');
- * const fragment = html`<p>Hello, ${name}!</p>`;
- * fragment.appendTo(document.body);              // Renders '<p>Hello, World!</p>'
- * name.set('Alice');                             // Replaces 'World' with 'Alice'
- * ```
- *
- * @returns _Fragment_
- */
-declare function html(template: TemplateStringsArray, ...values: unknown[]): Fragment;
-//#endregion
-export { type Fragment, type Fragments, fragments, html, isFragment, isFragments };
+export { type Fragment, type Fragments, fragment, fragments, fragment as html, isFragment, isFragments };

package/dist/index.mjs

@@ -1,55 +1,6 @@
 import { isFragment, isFragments } from "./helpers/index.mjs";
-import { Fragments } from "./fragments.mjs";
-import { Fragment } from "./fragment.mjs";
-import { isArray } from "@oscarpalmer/mora";
+import { fragments } from "./fragments.mjs";
+import { fragment } from "./fragment.mjs";
+import "@oscarpalmer/mora";
 export * from "@oscarpalmer/mora";
-//#region src/index.ts
-/**
-* Create a _Fragments_ instance from a reactive array
-*
-* _A Fragments instance can be used to efficiently render a list of items that may change over time, using unique identifiers to track each item, only adding, removing, or updating each related Fragment._
-*
-* @example
-* ```ts
-* const fruits = array(['Apple', 'Banana', 'Cherry']);
-* const items = fragments(
-*   fruits,
-*   fruit => fruit,                           // Identifies a unique item
-*   fruit => html`<p>${fruit}</p>`,           // Creates a Fragment from an item
-* );
-* html`${items}`.appendTo(document.body)      // Renders '<p>Apple</p><p>Banana</p><p>Cherry</p>'
-* fruits.push(['Date', 'Elderberry', 'Fig']); // Appends '<p>Date</p><p>Elderberry</p><p>Fig</p>'
-*                                             // without re-rendering the existing Fragments
-* ```
-*
-* @param array Reactive array
-* @param identify Function to identify item uniquely _(non-nullable)_
-* @param fragment Function to create _Fragment_ from item
-* @returns _Fragments_
-*/
-function fragments(array, identify, fragment) {
-	if (!isArray(array)) throw new TypeError("Fragments array must be a reactive array");
-	if (typeof identify !== "function") throw new TypeError("Fragments identify must be a function");
-	if (typeof fragment !== "function") throw new TypeError("Fragments fragment must be a function");
-	return new Fragments(array, identify, fragment);
-}
-/**
-* Create a _Fragment_ from a template
-*
-* _A Fragment can be used to efficiently render a template that may change over time, only updating the necessary parts of the DOM._
-*
-* @example
-* ```ts
-* const name = signal('World');
-* const fragment = html`<p>Hello, ${name}!</p>`;
-* fragment.appendTo(document.body);              // Renders '<p>Hello, World!</p>'
-* name.set('Alice');                             // Replaces 'World' with 'Alice'
-* ```
-*
-* @returns _Fragment_
-*/
-function html(template, ...values) {
-	return new Fragment(template, values);
-}
-//#endregion
-export { fragments, html, isFragment, isFragments };
+export { fragment, fragments, fragment as html, isFragment, isFragments };

package/dist/models.d.mts

@@ -1,11 +1,72 @@
-import { Fragment } from "./fragment.mjs";
-import { Reactive, ReactiveArray, Unsubscribe } from "@oscarpalmer/mora";
-
+import { SYMBOL } from "./constants.mjs";
+import { Reactive, ReactiveArray, Subscription } from "@oscarpalmer/mora";
 //#region src/models.d.ts
+export type InternalFragment = {
+  [SYMBOL]: FragmentState;
+} & Fragment;
+export type InternalFragments = {
+  [SYMBOL]: FragmentsState;
+} & Fragments;
+export type Fragment = {
+  /**
+   * Is template caching enabled?
+   */
+  get cache(): boolean;
+  /**
+   * Identifier for the _Fragment_
+   *
+   * _An identifier can be used to uniquely identify a Fragment, which helps prevent re-rendering in reactive arrays and Fragments_
+   */
+  get identifier(): unknown;
+  /**
+   * Insert the _Fragment_ after the given element
+   *
+   * @param element Element to insert after
+   */
+  after(element: Element): void;
+  /**
+   * Append the _Fragment_ to the given element
+   *
+   * @param element Element to append to
+   */
+  appendTo(element: Element): void;
+  /**
+   * Insert the _Fragment_ before the given element
+   *
+   * @param element Element to insert before
+   */
+  before(element: Element): void;
+  /**
+   * Configure the _Fragment_
+   *
+   * @param configuration Configuration options
+   * @returns _Fragment_
+   */
+  configure(configuration: FragmentConfiguration): Fragment;
+  /**
+   * Get a list of the _Fragment_'s nodes
+   *
+   * @returns List of nodes
+   */
+  get(): ChildNode[];
+  /**
+   * Prepend the _Fragment_ to the given element
+   *
+   * @param element Element to prepend to
+   */
+  prependTo(element: Element): void;
+  /**
+   * Remove the _Fragment_ _(and all its descendants)_ from the _DOM_
+   *
+   * - _Any events, reactive values, and Fragments will also be cleaned up and removed_
+   * - _After being removed, the Fragment can be re-inserted into the DOM_
+   */
+  remove(): void;
+};
 /**
  * Configuration for a _Fragment_
  */
-type FragmentConfiguration = {
+export type FragmentConfiguration = {
   /**
    * Should the template be cached? _(defaults to `true`)_
    */
@@ -17,30 +78,39 @@ type FragmentConfiguration = {
    */
   identifier?: unknown;
 };
-type FragmentData = {
+export type FragmentItem = {
+  fragments?: Fragment[];
+  nodes?: ChildNode[];
+  text?: Text;
+};
+export type FragmentState = {
+  cache: boolean;
   expressions: unknown[];
+  identifier: unknown;
   items: FragmentItem[];
   mora: MoraData;
+  name: string;
   strings: TemplateStringsArray | string[];
   template?: string;
   values: unknown[];
 };
-type FragmentItem = {
-  fragments?: Fragment[];
-  nodes?: ChildNode[];
-  text?: Text;
+export type Fragments = {
+  /**
+   * Remove the _Fragments_ _(and all its descendants)_ from the _DOM_, including any events, reactive values, and Fragments
+   */
+  remove(): void;
 };
-type FragmentsState = {
+export type FragmentsState = {
   array: ReactiveArray<unknown>;
   fragment: (item: unknown) => Fragment;
   identify: (item: unknown) => unknown;
   instances: Record<string, Fragment>;
   mapped: ReactiveArray<Fragment>;
-  subscriber: Unsubscribe | undefined;
+  name: string;
+  subscription: Subscription | undefined;
 };
 type MoraData = {
-  subscribers: Set<() => void>;
+  subscriptions: Set<Subscription>;
   values: Set<Reactive<unknown>>;
 };
-//#endregion
-export { FragmentConfiguration, FragmentData, FragmentItem, FragmentsState };
+//#endregion

package/dist/node/event.d.mts

@@ -1,4 +1,3 @@
 //#region src/node/event.d.ts
-declare function mapEvent(element: HTMLElement | SVGElement, name: string, value: unknown): void;
-//#endregion
-export { mapEvent };
+export declare function mapEvent(element: HTMLElement | SVGElement, name: string, value: unknown): void;
+//#endregion

package/dist/node/index.d.mts

@@ -1,6 +1,4 @@
-import { FragmentData } from "../models.mjs";
-
+import { FragmentState } from "../models.mjs";
 //#region src/node/index.d.ts
-declare function mapNodes(data: FragmentData, nodes: ChildNode[]): void;
-//#endregion
-export { mapNodes };
+export declare function mapNodes(data: FragmentState, nodes: ChildNode[]): void;
+//#endregion

package/dist/node/index.mjs

@@ -1,6 +1,6 @@
-import { EXPRESSION_ABYDON_CONTENT, EXPRESSION_TEXTAREA_VALUE } from "../constants.mjs";
+import { EXPRESSION_ABYDON_CONTENT, EXPRESSION_TEXTAREA_VALUE, SYMBOL } from "../constants.mjs";
 import { isFragment, isFragments, setComputedValue } from "../helpers/index.mjs";
-import { fragmentsStates, handleFragments } from "../fragments.mjs";
+import { handleFragments } from "../fragments.mjs";
 import { createNodes } from "../helpers/dom.mjs";
 import { mapAttributeValue, mapAttributes } from "../attribute/index.mjs";
 import { setReactiveValue } from "./value.mjs";
@@ -47,9 +47,7 @@ function mapValue(data, comment, value) {
 		case isReactive(value):
 			setReactiveValue(data, comment, value);
 			break;
-		default:
-			replaceComment(data, comment, value);
-			break;
+		default: replaceComment(data, comment, value);
 	}
 }
 function replaceComment(data, comment, value) {
@@ -67,9 +65,8 @@ function setComputedNode(data, comment, callback) {
 	});
 }
 function setFragmentsNode(data, comment, fragments) {
-	const state = fragmentsStates.get(fragments);
-	handleFragments(state, false);
-	setReactiveValue(data, comment, state.mapped);
+	handleFragments(fragments, false);
+	setReactiveValue(data, comment, fragments[SYMBOL].mapped);
 }
 //#endregion
 export { mapNodes };

package/dist/node/value.d.mts

@@ -1,7 +1,5 @@
-import { FragmentData } from "../models.mjs";
+import { FragmentState } from "../models.mjs";
 import { Reactive } from "@oscarpalmer/mora";
-
 //#region src/node/value.d.ts
-declare function setReactiveValue(data: FragmentData, comment: Comment, reactive: Reactive<unknown>): void;
-//#endregion
-export { setReactiveValue };
+export declare function setReactiveValue(data: FragmentState, comment: Comment, reactive: Reactive<unknown>): void;
+//#endregion

package/dist/node/value.mjs

@@ -15,8 +15,10 @@ function addToArray(identifiers, items, nodes, added) {
 	const { length } = next;
 	for (let index = 0; index < length; index += 1) {
 		const node = next[index];
-		if (!(added && identifiers.previous.set.has(node.identifier))) if (index === 0 && before) position.before(node.value);
-		else position.after(node.value);
+		if (!(added && identifiers.previous.set.has(node.identifier))) {
+			if (index === 0 && before) position.before(node.value);
+			else position.after(node.value);
+		}
 		position = node.value;
 	}
 }
@@ -77,7 +79,7 @@ function removeFragmentsItems(fragments) {
 function setArray(item, comment, value) {
 	if (value.length === 0) return removeArray(item, comment);
 	const { next, previous, template } = getArrayData(item, value);
-	if (template.empty || item.nodes == null || previous.array.some((identifier) => identifier == null)) {
+	if (template.empty || item.nodes == null || item.fragments == null || previous.array.some((identifier) => identifier == null)) {
 		const fragments = (item.fragments ?? []).slice();
 		const result = {
 			fragments: template.empty ? void 0 : template.items,
@@ -90,7 +92,7 @@ function setArray(item, comment, value) {
 		next,
 		previous
 	}, {
-		fragments: item.fragments ?? [],
+		fragments: item.fragments,
 		templates: template.items
 	}, item.nodes);
 }
@@ -100,7 +102,7 @@ function setNodes(item, comment, next) {
 function setReactiveValue(data, comment, reactive) {
 	let item = data.items.find((item) => item.nodes?.includes(comment));
 	item ??= {};
-	data.mora.subscribers.add(reactive.subscribe((value) => {
+	data.mora.subscriptions.add(reactive.subscribe((value) => {
 		if (Array.isArray(value)) setReactiveValueForArray(item, comment, value);
 		else setReactiveValueForSingle(item, comment, value);
 	}));
@@ -123,8 +125,7 @@ function setText(item, comment, value) {
 	item.text ??= new Text();
 	item.text.textContent = valueIsNullable ? "" : getString(value);
 	const result = valueIsNullable ? [comment] : [item.text];
-	replaceNodes(item.nodes ?? [comment], result);
-	return result;
+	return replaceNodes(item.nodes ?? [comment], result);
 }
 //#endregion
 export { setReactiveValue };

package/dist/parse.d.mts

@@ -1,6 +1,4 @@
-import { FragmentData } from "./models.mjs";
-
+import { FragmentState } from "./models.mjs";
 //#region src/parse.d.ts
-declare function parse(data: FragmentData): string;
-//#endregion
-export { parse };
+export declare function parse(data: FragmentState): string;
+//#endregion

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@oscarpalmer/abydon",
-	"version": "0.23.1",
+	"version": "0.24.0",
 	"keywords": [
 		"components",
 		"dom",
@@ -35,25 +35,25 @@
 		}
 	},
 	"scripts": {
-		"build": "npm run tsdown:build && npx vp pack",
-		"tsdown:build": "npx tsdown -c ./tsdown.config.ts",
-		"tsdown:watch": "npx tsdown -c ./tsdown.config.ts --watch",
+		"build": "npm run tsdown && npx vp pack",
 		"test": "npx vp test run --coverage",
-		"test:leak": "npx vp test run --detect-async-leaks --coverage"
+		"test:leak": "npx vp test run --detect-async-leaks --coverage",
+		"tsdown": "npx tsdown -c ./tsdown.config.ts",
+		"watch": "npx tsdown -c ./tsdown.config.ts --watch"
 	},
 	"dependencies": {
-		"@oscarpalmer/atoms": "^0.185",
-		"@oscarpalmer/mora": "^0.29",
-		"@oscarpalmer/toretto": "^0.45"
+		"@oscarpalmer/atoms": "^0.204",
+		"@oscarpalmer/mora": "^0.37",
+		"@oscarpalmer/toretto": "^0.54"
 	},
 	"devDependencies": {
-		"@oscarpalmer/oui": "^0.20",
-		"@oxlint/plugins": "^1.62",
-		"@types/node": "^25.6",
+		"@oscarpalmer/oui": "^0.38",
+		"@oxlint/plugins": "^1.83",
+		"@types/node": "^26.5",
 		"@vitest/coverage-istanbul": "^4.1",
-		"jsdom": "^29.1",
-		"tsdown": "^0.21",
-		"typescript": "^5.9",
+		"jsdom": "^30.1",
+		"tsdown": "^0.23",
+		"typescript": "^6",
 		"vite": "npm:@voidzero-dev/vite-plus-core@latest",
 		"vite-plus": "latest",
 		"vitest": "npm:@voidzero-dev/vite-plus-test@latest"