@oscarpalmer/abydon 0.15.0 → 0.16.0

package/src/parse.ts

@@ -1,11 +1,8 @@
 import {isNullableOrWhitespace} from '@oscarpalmer/atoms/is';
+import {EXPRESSION_ABYDON_ATTRIBUTE_FULL} from './constants';
 import type {FragmentData} from './models';
 
-function handleExpression(
-	data: FragmentData,
-	prefix: string,
-	expression: unknown,
-): string {
+function handleExpression(data: FragmentData, prefix: string, expression: unknown): string {
 	if (Array.isArray(expression)) {
 		const {length} = expression;
 
@@ -18,13 +15,8 @@ function handleExpression(
 		return `${prefix}${expressions}`;
 	}
 
-	if (
-		typeof expression === 'function' ||
-		(typeof expression === 'object' && expression != null)
-	) {
-		const index = data.values.push(expression) - 1;
-
-		return `${prefix}<!--abydon.${index}-->`;
+	if (typeof expression === 'function' || (typeof expression === 'object' && expression != null)) {
+		return transformExpression(prefix, data.values.push(expression) - 1);
 	}
 
 	return isNullableOrWhitespace(expression) ? prefix : `${prefix}${expression}`;
@@ -40,15 +32,21 @@ export function parse(data: FragmentData): string {
 	data.template = '';
 
 	for (let index = 0; index < length; index += 1) {
-		data.template += handleExpression(
-			data,
-			data.strings[index],
-			data.expressions[index],
-		);
+		data.template += handleExpression(data, data.strings[index], data.expressions[index]);
 	}
 
+	data.template = data.template.replaceAll(EXPRESSION_ABYDON_ATTRIBUTE_FULL, transformAttribute);
+
 	data.expressions = [];
 	data.strings = [] as never;
 
 	return data.template;
 }
+
+function transformAttribute(_: string, name: string, index: string): string {
+	return `_${name}="@abydon.${index}@"`;
+}
+
+function transformExpression(prefix: string, index: number): string {
+	return `${prefix}<!--abydon.${index}-->`;
+}

package/types/constants.d.ts

@@ -1,9 +1,17 @@
-export declare const ABORT_CONTROLLERS: WeakMap<HTMLOrSVGElement, AbortController>;
 export declare const ATTRIBUTE_CLASS_PREFIX_LENGTH = 6;
+export declare const EVENT_DEFAULTS: Record<string, string>;
+export declare const EXPRESSION_ABYDON_ATTRIBUTE_FULL: RegExp;
+export declare const EXPRESSION_ABYDON_ATTRIBUTE_PREFIX: RegExp;
+export declare const EXPRESSION_ABYDON_CONTENT: RegExp;
 export declare const EXPRESSION_ATTRIBUTE_CLASS: RegExp;
 export declare const EXPRESSION_ATTRIBUTE_STYLE_FULL: RegExp;
 export declare const EXPRESSION_ATTRIBUTE_STYLE_PREFIX: RegExp;
-export declare const EXPRESSION_COMMENT_FULL: RegExp;
-export declare const EXPRESSION_COMMENT_CONTENT: RegExp;
+export declare const EXPRESSION_EVENT_CHANGE_TYPES: RegExp;
 export declare const EXPRESSION_EVENT_NAME: RegExp;
-export declare const REASON_EVENT_REMOVED = "Event removed as element was removed from document by Abydon";
+export declare const EXPRESSION_EVENT_OPTIONS_ACTIVE: RegExp;
+export declare const EXPRESSION_EVENT_OPTIONS_CAPTURE: RegExp;
+export declare const EXPRESSION_EVENT_OPTIONS_ONCE: RegExp;
+export declare const EXPRESSION_EVENT_PREFIX: RegExp;
+export declare const EXPRESSION_PERIOD: RegExp;
+export declare const NAME_FRAGMENT = "$fragment";
+export declare const NAME_FRAGMENTS = "$fragments";

package/types/index.d.ts

@@ -2,8 +2,19 @@ import '@oscarpalmer/mora';
 import type { ReactiveArray } from '@oscarpalmer/mora';
 import { Fragment } from './fragment';
 import { Fragments } from './fragments';
+/**
+ * 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
+ */
 export declare function fragments<Item>(array: ReactiveArray<Item>, identify: (item: Item) => unknown, fragment: (item: Item) => Fragment): Fragments;
-export declare function html(strings: TemplateStringsArray, ...values: unknown[]): unknown;
+/**
+ * Create Fragment from a template
+ * @returns Fragment
+ */
+export declare function html(template: TemplateStringsArray, ...values: unknown[]): Fragment;
 export * from '@oscarpalmer/mora';
 export type { Fragment } from './fragment';
 export type { Fragments } from './fragments';

package/types/models.d.ts

@@ -1,8 +1,17 @@
 import type { Reactive, ReactiveArray, Unsubscribe } from '@oscarpalmer/mora';
 import type { Fragment } from './fragment';
 export 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;
-    ignoreCache?: boolean;
 };
 export type FragmentData = {
     expressions: unknown[];

package/types/node/attribute/index.d.ts

@@ -1,3 +1,2 @@
-import type { HTMLOrSVGElement } from '@oscarpalmer/toretto/models';
 import type { FragmentData } from '../../models';
-export declare function mapAttributes(data: FragmentData, element: HTMLOrSVGElement): void;
+export declare function mapAttributes(data: FragmentData, element: HTMLElement | SVGElement): void;

package/types/node/attribute/value.d.ts

@@ -1,3 +1,2 @@
-import type { HTMLOrSVGElement } from '@oscarpalmer/toretto/models';
 import type { FragmentData } from '../../models';
-export declare function setAttribute(data: FragmentData, element: HTMLOrSVGElement, name: string, value: unknown): void;
+export declare function setAttribute(data: FragmentData, element: HTMLElement | SVGElement, name: string, value: unknown): void;

package/types/node/event.d.ts

@@ -1,3 +1 @@
-import type { HTMLOrSVGElement } from '@oscarpalmer/toretto/models';
-export declare function mapEvent(element: HTMLOrSVGElement, name: string, value: unknown): void;
-export declare function removeEvents(element: HTMLOrSVGElement): void;
+export declare function mapEvent(element: HTMLElement | SVGElement, name: string, value: unknown): void;