@oscarpalmer/abydon 0.14.0 → 0.15.0

package/src/node/value.ts

@@ -105,6 +105,22 @@ function removeFragments(fragments: Fragment[] | undefined): void {
 	}
 }
 
+function replaceText(
+	item: FragmentItem,
+	comment: Comment,
+	isNullable: boolean,
+): void {
+	let to: ChildNode[];
+
+	if (isNullable) {
+		to = [comment];
+	} else {
+		to = item.text == null ? [] : [item.text];
+	}
+
+	replaceNodes(item.nodes ?? [], to);
+}
+
 function setArray(
 	item: FragmentItem,
 	comment: Comment,
@@ -213,7 +229,11 @@ function setReactiveValueForArray(
 	item.fragments = typeof result === 'boolean' ? undefined : result?.fragments;
 
 	if (typeof result === 'boolean') {
-		item.nodes = result ? item.text == null ? [] : [item.text] : undefined;
+		if (result) {
+			item.nodes = item.text == null ? [] : [item.text];
+		} else {
+			item.nodes = undefined;
+		}
 	} else {
 		item.nodes = result?.nodes;
 	}
@@ -249,7 +269,7 @@ function setText(
 	let result = false;
 
 	if (item.nodes != null) {
-		replaceNodes(item.nodes, isNullable ? [comment] : item.text == null ? [] : [item.text]);
+		replaceText(item, comment, isNullable);
 
 		result = !isNullable;
 	} else if (isNullable && comment.parentNode == null) {
@@ -264,5 +284,7 @@ function setText(
 
 	removeFragments(item.fragments);
 
-	return result ? item.text == null ? [] : [item.text] : undefined;
+	if (result) {
+		return item.text == null ? [] : [item.text];
+	}
 }

package/types/fragment.d.ts

@@ -1,18 +1,38 @@
+import type { FragmentConfiguration } from './models';
 export declare class Fragment {
     #private;
+    /**
+     * Fragment identifier
+     */
     get identifier(): unknown;
     constructor(strings: TemplateStringsArray, expressions: unknown[]);
     /**
-     * Appends the fragment to the given element
+     * Append the fragment to the given element
+     * @param element Element to append to
      */
     appendTo(element: Element): void;
     /**
-     * Gets a list of the fragment's nodes
+     * 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;
     /**
-     * Removes the fragment from the DOM
+     * Remove the fragment from the DOM
      */
     remove(): void;
 }

package/types/fragments.d.ts

@@ -0,0 +1,13 @@
+import { type ReactiveArray } from '@oscarpalmer/mora';
+import type { Fragment } from './fragment';
+import type { FragmentsState } from './models';
+export declare class Fragments {
+    #private;
+    /**
+     * Fragment items
+     */
+    get items(): ReactiveArray<Fragment>;
+    constructor(items: ReactiveArray<unknown>, identify: (item: unknown) => unknown, fragment: (item: unknown) => Fragment);
+}
+export declare function handleFragments(item: Fragments | FragmentsState, remove: boolean): void;
+export declare function initializeFragments(state: FragmentsState): void;

package/types/helpers/index.d.ts

@@ -1,3 +1,5 @@
 import type { Fragment } from '../fragment';
+import type { Fragments } from '../fragments';
 export declare function compareArrays(first: unknown[], second: unknown[]): 'added' | 'dissimilar' | 'removed';
 export declare function isFragment(value: unknown): value is Fragment;
+export declare function isFragments(value: unknown): value is Fragments;

package/types/index.d.ts

@@ -1,5 +1,9 @@
 import '@oscarpalmer/mora';
+import type { ReactiveArray } from '@oscarpalmer/mora';
 import { Fragment } from './fragment';
-export declare function html(strings: TemplateStringsArray, ...values: unknown[]): Fragment;
+import { Fragments } from './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;
 export * from '@oscarpalmer/mora';
 export type { Fragment } from './fragment';
+export type { Fragments } from './fragments';

package/types/models.d.ts

@@ -1,16 +1,29 @@
-import type { Reactive } from '@oscarpalmer/mora';
+import type { Reactive, ReactiveArray, Unsubscribe } from '@oscarpalmer/mora';
 import type { Fragment } from './fragment';
+export type FragmentConfiguration = {
+    identifier?: unknown;
+    ignoreCache?: boolean;
+};
 export type FragmentData = {
     expressions: unknown[];
-    identifier?: unknown;
     items: FragmentItem[];
     mora: MoraData;
     strings: TemplateStringsArray;
+    template?: string;
     values: unknown[];
 };
 export type FragmentItem = {
     fragments?: Fragment[];
-    nodes: ChildNode[];
+    nodes?: ChildNode[];
+    text?: Text;
+};
+export 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>;