@oscarpalmer/abydon 0.15.0 → 0.17.0

package/dist/constants.d.mts

@@ -0,0 +1,20 @@
+//#region src/constants.d.ts
+declare const ATTRIBUTE_CLASS_PREFIX_LENGTH = 6;
+declare const EVENT_DEFAULTS: Record<string, string>;
+declare const EXPRESSION_ABYDON_ATTRIBUTE_FULL: RegExp;
+declare const EXPRESSION_ABYDON_ATTRIBUTE_PREFIX: RegExp;
+declare const EXPRESSION_ABYDON_CONTENT: RegExp;
+declare const EXPRESSION_ATTRIBUTE_CLASS: RegExp;
+declare const EXPRESSION_ATTRIBUTE_STYLE_FULL: RegExp;
+declare const EXPRESSION_ATTRIBUTE_STYLE_PREFIX: RegExp;
+declare const EXPRESSION_EVENT_CHANGE_TYPES: RegExp;
+declare const EXPRESSION_EVENT_NAME: RegExp;
+declare const EXPRESSION_EVENT_OPTIONS_ACTIVE: RegExp;
+declare const EXPRESSION_EVENT_OPTIONS_CAPTURE: RegExp;
+declare const EXPRESSION_EVENT_OPTIONS_ONCE: RegExp;
+declare const EXPRESSION_EVENT_PREFIX: RegExp;
+declare const EXPRESSION_PERIOD: RegExp;
+declare const NAME_FRAGMENT = "$fragment";
+declare const NAME_FRAGMENTS = "$fragments";
+//#endregion
+export { ATTRIBUTE_CLASS_PREFIX_LENGTH, EVENT_DEFAULTS, EXPRESSION_ABYDON_ATTRIBUTE_FULL, EXPRESSION_ABYDON_ATTRIBUTE_PREFIX, EXPRESSION_ABYDON_CONTENT, EXPRESSION_ATTRIBUTE_CLASS, EXPRESSION_ATTRIBUTE_STYLE_FULL, EXPRESSION_ATTRIBUTE_STYLE_PREFIX, EXPRESSION_EVENT_CHANGE_TYPES, EXPRESSION_EVENT_NAME, EXPRESSION_EVENT_OPTIONS_ACTIVE, EXPRESSION_EVENT_OPTIONS_CAPTURE, EXPRESSION_EVENT_OPTIONS_ONCE, EXPRESSION_EVENT_PREFIX, EXPRESSION_PERIOD, NAME_FRAGMENT, NAME_FRAGMENTS };

package/dist/constants.mjs

@@ -0,0 +1,27 @@
+//#region src/constants.ts
+const ATTRIBUTE_CLASS_PREFIX_LENGTH = 6;
+const EVENT_DEFAULTS = {
+	A: "click",
+	BUTTON: "click",
+	DETAILS: "toggle",
+	FORM: "submit",
+	SELECT: "change",
+	TEXTAREA: "input"
+};
+const EXPRESSION_ABYDON_ATTRIBUTE_FULL = /(@?\w+)="<!--abydon.(\d+)-->"/g;
+const EXPRESSION_ABYDON_ATTRIBUTE_PREFIX = /^_/;
+const EXPRESSION_ABYDON_CONTENT = /^@?abydon\.(\d+)@?$/;
+const EXPRESSION_ATTRIBUTE_CLASS = /^class\./;
+const EXPRESSION_ATTRIBUTE_STYLE_FULL = /^style\.([\w-]+)(?:\.([\w-]+))?$/;
+const EXPRESSION_ATTRIBUTE_STYLE_PREFIX = /^style\./;
+const EXPRESSION_EVENT_CHANGE_TYPES = /^(checkbox|radio)$/;
+const EXPRESSION_EVENT_NAME = /^@([\w-]+)(?::([a-z:]+))?$/i;
+const EXPRESSION_EVENT_OPTIONS_ACTIVE = /^a(ctive)$/i;
+const EXPRESSION_EVENT_OPTIONS_CAPTURE = /^c(apture)$/i;
+const EXPRESSION_EVENT_OPTIONS_ONCE = /^o(nce)$/i;
+const EXPRESSION_EVENT_PREFIX = /^@/;
+const EXPRESSION_PERIOD = /\./;
+const NAME_FRAGMENT = "$fragment";
+const NAME_FRAGMENTS = "$fragments";
+//#endregion
+export { ATTRIBUTE_CLASS_PREFIX_LENGTH, EVENT_DEFAULTS, EXPRESSION_ABYDON_ATTRIBUTE_FULL, EXPRESSION_ABYDON_ATTRIBUTE_PREFIX, EXPRESSION_ABYDON_CONTENT, EXPRESSION_ATTRIBUTE_CLASS, EXPRESSION_ATTRIBUTE_STYLE_FULL, EXPRESSION_ATTRIBUTE_STYLE_PREFIX, EXPRESSION_EVENT_CHANGE_TYPES, EXPRESSION_EVENT_NAME, EXPRESSION_EVENT_OPTIONS_ACTIVE, EXPRESSION_EVENT_OPTIONS_CAPTURE, EXPRESSION_EVENT_OPTIONS_ONCE, EXPRESSION_EVENT_PREFIX, EXPRESSION_PERIOD, NAME_FRAGMENT, NAME_FRAGMENTS };

package/dist/fragment-9qTBAvtR.d.mts

@@ -0,0 +1,82 @@
+import { Reactive, ReactiveArray, Unsubscribe } from "@oscarpalmer/mora";
+
+//#region src/models.d.ts
+type FragmentConfiguration = {
+  /**
+   * Should the template be cached? _(defaults to `true`)_
+   */
+  cache?: boolean;
+  /**
+   * Identifier for the fragment
+   *
+   * _(An identifier can be used to uniquely identify a fragment,
+   * which helps prevent re-rendering in certain scenarios)_
+   */
+  identifier?: unknown;
+};
+type FragmentData = {
+  expressions: unknown[];
+  items: FragmentItem[];
+  mora: MoraData;
+  strings: TemplateStringsArray;
+  template?: string;
+  values: unknown[];
+};
+type FragmentItem = {
+  fragments?: Fragment[];
+  nodes?: ChildNode[];
+  text?: Text;
+};
+type FragmentsState = {
+  array: ReactiveArray<unknown>;
+  fragment: (item: unknown) => Fragment;
+  identify: (item: unknown) => unknown;
+  instances: Record<string, Fragment>;
+  mapped: ReactiveArray<Fragment>;
+  subscriber: Unsubscribe | undefined;
+};
+type MoraData = {
+  subscribers: Set<() => void>;
+  values: Set<Reactive<unknown>>;
+};
+//#endregion
+//#region src/fragment.d.ts
+declare class Fragment {
+  #private;
+  /**
+   * Fragment identifier
+   */
+  get identifier(): unknown;
+  constructor(strings: TemplateStringsArray, expressions: unknown[]);
+  /**
+   * Append the fragment to the given element
+   * @param element Element to append to
+   */
+  appendTo(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[];
+  /**
+   * Set an identifier for the fragment
+   *
+   * _An identifier can be used to uniquely identify a fragment,
+   * which helps prevent re-rendering in certain scenarios._
+   * @param identifier Identifier
+   * @returns Fragment
+   */
+  identify(identifier: unknown): Fragment;
+  /**
+   * Remove the fragment from the DOM
+   */
+  remove(): void;
+}
+//#endregion
+export { FragmentsState as a, FragmentItem as i, FragmentConfiguration as n, FragmentData as r, Fragment as t };

package/dist/fragment.d.mts

@@ -0,0 +1,2 @@
+import { t as Fragment } from "./fragment-9qTBAvtR.mjs";
+export { Fragment };

package/dist/{fragment.js → fragment.mjs}

@@ -1,21 +1,26 @@
-import { parse } from "./parse.js";
-import { isFragments } from "./helpers/index.js";
-import { handleFragments } from "./fragments.js";
-import { removeNodes } from "./helpers/dom.js";
-import { mapNodes } from "./node/index.js";
+import { NAME_FRAGMENT } from "./constants.mjs";
+import { isFragments } from "./helpers/index.mjs";
+import { handleFragments } from "./fragments.mjs";
+import { removeNodes } from "./helpers/dom.mjs";
+import { mapNodes } from "./node/index.mjs";
+import { parse } from "./parse.mjs";
 import { isPlainObject } from "@oscarpalmer/atoms/is";
 import { html } from "@oscarpalmer/toretto/html";
+//#region src/fragment.ts
 var Fragment = class {
 	#data;
 	#configuration = {
 		identifier: void 0,
-		ignoreCache: false
+		cache: true
 	};
+	/**
+	* Fragment identifier
+	*/
 	get identifier() {
 		return this.#configuration.identifier;
 	}
 	constructor(strings, expressions) {
-		Object.defineProperty(this, "$fragment", { value: true });
+		Object.defineProperty(this, NAME_FRAGMENT, { value: true });
 		this.#data = {
 			expressions,
 			strings,
@@ -27,31 +32,52 @@ var Fragment = class {
 			values: []
 		};
 	}
+	/**
+	* Append the fragment to the given element
+	* @param element Element to append to
+	*/
 	appendTo(element) {
 		element.append(...this.get());
 	}
+	/**
+	* Configure the fragment
+	* @param configuration Configuration options
+	* @returns Fragment
+	*/
 	configure(configuration) {
 		const actual = isPlainObject(configuration) ? configuration : {};
-		if (actual.identifier !== void 0) this.#configuration.identifier = actual.identifier;
-		if (typeof actual.ignoreCache === "boolean") this.#configuration.ignoreCache = actual.ignoreCache;
+		if ("identifier" in actual) this.#configuration.identifier = actual.identifier;
+		if (typeof actual.cache === "boolean") this.#configuration.cache = actual.cache;
 		return this;
 	}
+	/**
+	* Get a list of the fragment's nodes
+	* @returns List of nodes
+	*/
 	get() {
 		const data = this.#data;
 		if (data.items.length === 0) {
-			const templated = html(parse(data), {
-				ignoreCache: this.#configuration.ignoreCache,
-				sanitizeBooleanAttributes: false
-			});
+			const templated = html(parse(data), { cache: this.#configuration.cache });
 			data.items.splice(0, data.items.length, ...templated.map((node) => ({ nodes: [node] })));
 			mapNodes(data, data.items.flatMap((item) => item.fragments?.flatMap((fragment) => fragment.get()) ?? item.nodes ?? []));
 		}
-		return [...data.items.flatMap((item) => item.fragments?.flatMap((fragment) => fragment.get()) ?? item.nodes ?? [])];
+		return data.items.flatMap((item) => item.fragments?.flatMap((fragment) => fragment.get()) ?? item.nodes ?? []);
 	}
+	/**
+	* Set an identifier for the fragment
+	*
+	* _An identifier can be used to uniquely identify a fragment,
+	* which helps prevent re-rendering in certain scenarios._
+	* @param identifier Identifier
+	* @returns Fragment
+	*/
 	identify(identifier) {
 		this.#configuration.identifier = identifier;
 		return this;
 	}
+	/**
+	* Remove the fragment from the DOM
+	*/
 	remove() {
 		removeFragment(this.#data);
 	}
@@ -78,4 +104,5 @@ function removeMora(data) {
 	data.mora.values.clear();
 	for (const unsubscribe of unsubscribers) unsubscribe();
 }
+//#endregion
 export { Fragment };

package/dist/fragments.d.mts

@@ -0,0 +1,16 @@
+import { a as FragmentsState, t as Fragment } from "./fragment-9qTBAvtR.mjs";
+import { ReactiveArray } from "@oscarpalmer/mora";
+
+//#region src/fragments.d.ts
+declare class Fragments {
+  #private;
+  /**
+   * Fragment items
+   */
+  get items(): ReactiveArray<Fragment>;
+  constructor(items: ReactiveArray<unknown>, identify: (item: unknown) => unknown, fragment: (item: unknown) => Fragment);
+}
+declare function handleFragments(item: Fragments | FragmentsState, remove: boolean): void;
+declare function initializeFragments(state: FragmentsState): void;
+//#endregion
+export { Fragments, handleFragments, initializeFragments };

package/dist/{fragments.js → fragments.mjs}

@@ -1,13 +1,18 @@
-import { isFragment, isFragments } from "./helpers/index.js";
-import { array } from "@oscarpalmer/mora";
+import { NAME_FRAGMENTS } from "./constants.mjs";
+import { isFragment, isFragments } from "./helpers/index.mjs";
 import { getString } from "@oscarpalmer/atoms/string";
+import { array } from "@oscarpalmer/mora";
+//#region src/fragments.ts
 var Fragments = class {
 	#state;
+	/**
+	* Fragment items
+	*/
 	get items() {
 		return this.#state.mapped;
 	}
 	constructor(items, identify, fragment) {
-		Object.defineProperty(this, "$fragments", { value: true });
+		Object.defineProperty(this, NAME_FRAGMENTS, { value: true });
 		this.#state = {
 			fragment,
 			identify,
@@ -70,5 +75,6 @@ function updateFragments(state, active) {
 	state.instances = next;
 	active?.clear();
 }
-var states = /* @__PURE__ */ new WeakMap();
+const states = /* @__PURE__ */ new WeakMap();
+//#endregion
 export { Fragments, handleFragments, initializeFragments };

package/dist/helpers/dom.d.mts

@@ -0,0 +1,6 @@
+//#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[]): void;
+//#endregion
+export { createNodes, removeNodes, replaceNodes };

package/dist/helpers/{dom.js → dom.mjs}

@@ -1,14 +1,13 @@
-import { isFragment } from "./index.js";
-import { removeEvents } from "../node/event.js";
+import { isFragment } from "./index.mjs";
 import { getString } from "@oscarpalmer/atoms/string";
-import { isChildNode, isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
+import { isChildNode } from "@oscarpalmer/toretto/is";
+//#region src/helpers/dom.ts
 function createNodes(value) {
 	if (isFragment(value)) return value.get();
 	if (isChildNode(value)) return [value];
 	return [new Text(getString(value))];
 }
 function removeNodes(nodes) {
-	sanitizeNodes(nodes);
 	const { length } = nodes;
 	for (let index = 0; index < length; index += 1) nodes[index].remove();
 }
@@ -17,12 +16,5 @@ function replaceNodes(from, to) {
 	const { length } = from;
 	for (let index = 1; index < length; index += 1) from[index].remove();
 }
-function sanitizeNodes(nodes) {
-	const { length } = nodes;
-	for (let index = 0; index < length; index += 1) {
-		const node = nodes[index];
-		if (isHTMLOrSVGElement(node)) removeEvents(node);
-		if (node.hasChildNodes()) sanitizeNodes([...node.childNodes]);
-	}
-}
+//#endregion
 export { createNodes, removeNodes, replaceNodes };

package/dist/helpers/index.d.mts

@@ -0,0 +1,9 @@
+import { t as Fragment } from "../fragment-9qTBAvtR.mjs";
+import { Fragments } from "../fragments.mjs";
+
+//#region src/helpers/index.d.ts
+declare function compareArrays(first: unknown[], second: unknown[]): 'added' | 'dissimilar' | 'removed';
+declare function isFragment(value: unknown): value is Fragment;
+declare function isFragments(value: unknown): value is Fragments;
+//#endregion
+export { compareArrays, isFragment, isFragments };

package/dist/helpers/index.mjs

@@ -0,0 +1,23 @@
+import { NAME_FRAGMENT, NAME_FRAGMENTS } from "../constants.mjs";
+//#region src/helpers/index.ts
+function compareArrays(first, second) {
+	const firstIsLarger = first.length > second.length;
+	const from = firstIsLarger ? first : second;
+	const to = firstIsLarger ? second : first;
+	if (!from.filter((key) => to.includes(key)).every((key, index) => to[index] === key)) return COMPARISON_DISSIMILAR;
+	return firstIsLarger ? COMPARISON_REMOVED : COMPARISON_ADDED;
+}
+function isFragment(value) {
+	return isNamed(value, NAME_FRAGMENT);
+}
+function isFragments(value) {
+	return isNamed(value, NAME_FRAGMENTS);
+}
+function isNamed(value, name) {
+	return typeof value === "object" && value != null && name in value && value[name] === true;
+}
+const COMPARISON_ADDED = "added";
+const COMPARISON_DISSIMILAR = "dissimilar";
+const COMPARISON_REMOVED = "removed";
+//#endregion
+export { compareArrays, isFragment, isFragments };

package/dist/index.d.mts

@@ -0,0 +1,21 @@
+import { t as Fragment } from "./fragment-9qTBAvtR.mjs";
+import { Fragments } from "./fragments.mjs";
+import { ReactiveArray } from "@oscarpalmer/mora";
+export * from "@oscarpalmer/mora";
+
+//#region src/index.d.ts
+/**
+ * Create Fragments from a reactive array
+ * @param array Reactive array
+ * @param identify Function to identify item
+ * @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 Fragment from a template
+ * @returns Fragment
+ */
+declare function html(template: TemplateStringsArray, ...values: unknown[]): Fragment;
+//#endregion
+export { type Fragment, type Fragments, fragments, html };

package/dist/index.mjs

@@ -0,0 +1,24 @@
+import { Fragments } from "./fragments.mjs";
+import { Fragment } from "./fragment.mjs";
+import "@oscarpalmer/mora";
+export * from "@oscarpalmer/mora";
+//#region src/index.ts
+/**
+* Create Fragments from a reactive array
+* @param array Reactive array
+* @param identify Function to identify item
+* @param fragment Function to create fragment from item
+* @returns Fragments
+*/
+function fragments(array, identify, fragment) {
+	return new Fragments(array, identify, fragment);
+}
+/**
+* Create Fragment from a template
+* @returns Fragment
+*/
+function html(template, ...values) {
+	return new Fragment(template, values);
+}
+//#endregion
+export { fragments, html };

package/dist/models.d.mts

@@ -0,0 +1,2 @@
+import { a as FragmentsState, i as FragmentItem, n as FragmentConfiguration, r as FragmentData } from "./fragment-9qTBAvtR.mjs";
+export { FragmentConfiguration, FragmentData, FragmentItem, FragmentsState };

package/dist/models.mjs

@@ -0,0 +1 @@
+export {};

package/dist/node/attribute/index.d.mts

@@ -0,0 +1,6 @@
+import { r as FragmentData } from "../../fragment-9qTBAvtR.mjs";
+
+//#region src/node/attribute/index.d.ts
+declare function mapAttributes(data: FragmentData, element: HTMLElement | SVGElement): void;
+//#endregion
+export { mapAttributes };

package/dist/node/attribute/index.mjs

@@ -0,0 +1,41 @@
+import { EXPRESSION_ABYDON_ATTRIBUTE_PREFIX, EXPRESSION_ABYDON_CONTENT, EXPRESSION_EVENT_PREFIX, EXPRESSION_PERIOD } from "../../constants.mjs";
+import { mapEvent } from "../event.mjs";
+import { setAttribute } from "./value.mjs";
+import { computed, isReactive } from "@oscarpalmer/mora";
+//#region src/node/attribute/index.ts
+function getValue(data, original) {
+	const matches = EXPRESSION_ABYDON_CONTENT.exec(original ?? "");
+	return matches == null ? original : data.values[+matches[1]];
+}
+function mapAttributes(data, element) {
+	const attributes = [...element.attributes];
+	const { length } = attributes;
+	for (let index = 0; index < length; index += 1) {
+		const { name, value } = attributes[index];
+		const actualName = name.replace(EXPRESSION_ABYDON_ATTRIBUTE_PREFIX, "");
+		const actualValue = getValue(data, value);
+		if (actualName !== name) element.removeAttribute(name);
+		switch (true) {
+			case EXPRESSION_EVENT_PREFIX.test(actualName):
+				mapEvent(element, actualName, actualValue);
+				break;
+			case EXPRESSION_PERIOD.test(actualName):
+			case typeof actualValue === "function":
+			case isReactive(actualValue):
+				mapValue(data, element, actualName, actualValue);
+				break;
+			default: break;
+		}
+	}
+}
+function mapValue(data, element, name, value) {
+	if (typeof value === "function") setComputedAttribute(data, element, name, value);
+	else setAttribute(data, element, name, value);
+}
+function setComputedAttribute(data, element, name, callback) {
+	const value = computed(callback);
+	data.mora.values.add(value);
+	setAttribute(data, element, name, value);
+}
+//#endregion
+export { mapAttributes };

package/dist/node/attribute/value.d.mts

@@ -0,0 +1,6 @@
+import { r as FragmentData } from "../../fragment-9qTBAvtR.mjs";
+
+//#region src/node/attribute/value.d.ts
+declare function setAttribute(data: FragmentData, element: HTMLElement | SVGElement, name: string, value: unknown): void;
+//#endregion
+export { setAttribute };

package/dist/node/attribute/value.mjs

@@ -0,0 +1,65 @@
+import { EXPRESSION_ATTRIBUTE_CLASS, EXPRESSION_ATTRIBUTE_STYLE_FULL, EXPRESSION_ATTRIBUTE_STYLE_PREFIX } from "../../constants.mjs";
+import { isReactive } from "@oscarpalmer/mora";
+import { isBooleanAttribute, setAttribute as setAttribute$1 } from "@oscarpalmer/toretto/attribute";
+//#region src/node/attribute/value.ts
+function getCallback(element, name) {
+	if (isBooleanAttribute(name) && name in element) return name === "checked" ? updateChecked : updateProperty;
+	return name === "value" ? updateValue : setAttribute$1;
+}
+function setAttribute(data, element, name, value) {
+	switch (true) {
+		case EXPRESSION_ATTRIBUTE_CLASS.test(name):
+			setClasses(data, element, name, value);
+			return;
+		case EXPRESSION_ATTRIBUTE_STYLE_PREFIX.test(name):
+			setStyle(data, element, name, value);
+			return;
+		default:
+			setValue(data, element, name, value);
+			break;
+	}
+}
+function setClasses(data, element, name, value) {
+	function update(value) {
+		if (value === true) element.classList.add(...classes);
+		else element.classList.remove(...classes);
+	}
+	const classes = name.slice(6).split(".");
+	if (isReactive(value)) data.mora.subscribers.add(value.subscribe(update));
+	else update(value);
+}
+function setStyle(data, element, name, value) {
+	const [, property, unit] = EXPRESSION_ATTRIBUTE_STYLE_FULL.exec(name) ?? [];
+	if (property == null) return;
+	function update(value) {
+		if (value == null || value === false || value === true && unit == null) element.style.removeProperty(property);
+		else element.style.setProperty(property, value === true ? unit : String(value));
+	}
+	if (isReactive(value)) data.mora.subscribers.add(value.subscribe(update));
+	else update(value);
+}
+function setValue(data, element, name, value) {
+	const callback = getCallback(element, name);
+	if (isReactive(value)) data.mora.subscribers.add(value.subscribe((next) => {
+		callback(element, name, next);
+	}));
+	else callback(element, name, value);
+}
+function updateChecked(element, name, value) {
+	updateElement("change", "checked", element, name, value, value === true);
+}
+function updateElement(event, property, element, name, value, next) {
+	if (!(property in element) || element[property] === next) return;
+	setAttribute$1(element, name, value);
+	if (element[property] === next) return;
+	element[property] = next;
+	element.dispatchEvent(new Event(event, { bubbles: true }));
+}
+function updateProperty(element, name, value) {
+	setAttribute$1(element, name, value === true);
+}
+function updateValue(element, name, value) {
+	updateElement(element instanceof HTMLSelectElement ? "change" : "input", "value", element, name, value, String(value));
+}
+//#endregion
+export { setAttribute };

package/dist/node/event.d.mts

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

package/dist/node/event.mjs

@@ -0,0 +1,25 @@
+import { EVENT_DEFAULTS, EXPRESSION_EVENT_CHANGE_TYPES, EXPRESSION_EVENT_NAME, EXPRESSION_EVENT_OPTIONS_ACTIVE, EXPRESSION_EVENT_OPTIONS_CAPTURE, EXPRESSION_EVENT_OPTIONS_ONCE } from "../constants.mjs";
+import { on } from "@oscarpalmer/toretto/event";
+//#region src/node/event.ts
+function getOptions(options) {
+	const parts = options.split(":");
+	return {
+		capture: parts.some((part) => EXPRESSION_EVENT_OPTIONS_CAPTURE.test(part)),
+		once: parts.some((part) => EXPRESSION_EVENT_OPTIONS_ONCE.test(part)),
+		passive: !parts.some((part) => EXPRESSION_EVENT_OPTIONS_ACTIVE.test(part))
+	};
+}
+function getType(element, type) {
+	if (type !== "on") return type;
+	if (element instanceof HTMLInputElement) {
+		if (EXPRESSION_EVENT_CHANGE_TYPES.test(element.type)) return "change";
+		return element.type === "submit" ? "submit" : "input";
+	}
+	return EVENT_DEFAULTS[element.tagName] ?? type;
+}
+function mapEvent(element, name, value) {
+	const [, type, options] = EXPRESSION_EVENT_NAME.exec(name) ?? [];
+	if (type != null && typeof value === "function") on(element, getType(element, type), value, getOptions(options ?? ""));
+}
+//#endregion
+export { mapEvent };

package/dist/node/index.d.mts

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

package/dist/node/{index.js → index.mjs}

@@ -1,13 +1,14 @@
-import { isFragment, isFragments } from "../helpers/index.js";
-import { handleFragments } from "../fragments.js";
-import { EXPRESSION_COMMENT_CONTENT } from "../constants.js";
-import { createNodes } from "../helpers/dom.js";
-import { mapAttributes } from "./attribute/index.js";
-import { setReactiveValue } from "./value.js";
+import { EXPRESSION_ABYDON_CONTENT } from "../constants.mjs";
+import { isFragment, isFragments } from "../helpers/index.mjs";
+import { handleFragments } from "../fragments.mjs";
+import { createNodes } from "../helpers/dom.mjs";
+import { mapAttributes } from "./attribute/index.mjs";
+import { setReactiveValue } from "./value.mjs";
 import { computed, isReactive } from "@oscarpalmer/mora";
 import { isHTMLOrSVGElement } from "@oscarpalmer/toretto/is";
+//#region src/node/index.ts
 function mapNode(data, comment) {
-	const matches = EXPRESSION_COMMENT_CONTENT.exec(comment.textContent ?? "");
+	const matches = EXPRESSION_ABYDON_CONTENT.exec(comment.textContent ?? "");
 	const value = matches == null ? null : data.values[+matches[1]];
 	if (value != null) mapValue(data, comment, value);
 }
@@ -41,7 +42,7 @@ function mapValue(data, comment, value) {
 	}
 }
 function replaceComment(data, comment, value) {
-	const item = data.items.find((item$1) => item$1.nodes?.includes(comment));
+	const item = data.items.find((item) => item.nodes?.includes(comment));
 	const nodes = createNodes(value);
 	if (item != null) {
 		item.fragments = isFragment(value) ? [value] : void 0;
@@ -54,4 +55,5 @@ function setComputedValue(data, comment, callback) {
 	data.mora.values.add(value);
 	setReactiveValue(data, comment, value);
 }
+//#endregion
 export { mapNodes };

package/dist/node/value.d.mts

@@ -0,0 +1,7 @@
+import { r as FragmentData } from "../fragment-9qTBAvtR.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 };