@tempots/dom 20.1.0 → 22.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tempots/dom",
-  "version": "20.1.0",
+  "version": "22.0.0",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",

package/renderable/attribute.d.ts

@@ -1,4 +1,5 @@
-import { NValue, Renderable, Value } from '../types/domain';
+import { NValue, Renderable } from '../types/domain';
+import { Value } from '../std/value';
 /**
  * The `attr` object allows to create any HTML attribute. Either a literal value
  * or `Signal<?>` can be passed as a value. The type of the value is inferred

package/renderable/conjunction.d.ts

@@ -1,6 +1,6 @@
 import { Signal } from '../std/signal';
 import { Renderable, TNode } from '../types/domain';
-import { ElementPosition } from '../std/position';
+import { ElementPosition } from '../std/element-position';
 /**
  * Options for configuring a conjunction.
  * @public

package/renderable/ensure.d.ts

@@ -1,5 +1,6 @@
-import { TNode, Renderable, Value } from '../types/domain';
+import { TNode, Renderable } from '../types/domain';
 import { Signal } from '../std/signal';
+import { Value } from '../std/value';
 /**
  * Represents a function that ensures a signal has a value before rendering a TNode.
  *

package/renderable/foreach.d.ts

@@ -1,6 +1,7 @@
-import { TNode, Renderable, Value } from '../types/domain';
+import { TNode, Renderable } from '../types/domain';
 import { Signal } from '../std/signal';
-import { ElementPosition } from '../std/position';
+import { ElementPosition } from '../std/element-position';
+import { Value } from '../std/value';
 /**
  * Renders a list of items based on a signal of arrays.
  *
@@ -11,4 +12,4 @@ import { ElementPosition } from '../std/position';
  * @returns - The renderable function that renders the list of items.
  * @public
  */
-export declare const ForEach: <T>(value: Value<T[]>, item: (value: Signal<T>, position: Signal<ElementPosition>) => TNode, separator?: (pos: Signal<ElementPosition>) => TNode) => Renderable;
+export declare const ForEach: <T>(value: Value<T[]>, item: (value: Signal<T>, position: ElementPosition) => TNode, separator?: (pos: ElementPosition) => TNode) => Renderable;

package/renderable/map-signal.d.ts

@@ -1,4 +1,5 @@
-import { Renderable, Value } from '../types/domain';
+import { Renderable } from '../types/domain';
+import { Value } from '../std/value';
 /**
  * Maps the values emitted by a signal to a renderable function and returns a new renderable function.
  *

package/renderable/not-empty.d.ts

@@ -1,4 +1,5 @@
-import { Renderable, Value } from '../types/domain';
+import { Value } from '../std/value';
+import { Renderable } from '../types/domain';
 /**
  * Returns a renderable component that displays the given `display` component
  * when the `signal` contains a non-empty array, and the `whenEmpty` component

package/renderable/oneof.d.ts

@@ -1,5 +1,6 @@
 import { Signal } from '../std/signal';
-import { Renderable, TNode, Value } from '../types/domain';
+import { Value } from '../std/value';
+import { Renderable, TNode } from '../types/domain';
 /**
  * Represents a set of options for a one-of type.
  * @typeParam T - The type of the options.

package/renderable/repeat.d.ts

@@ -1,6 +1,6 @@
-import { ElementPosition } from '../std/position';
-import { Signal } from '../std/signal';
-import { TNode, Renderable, Value } from '../types/domain';
+import { ElementPosition } from '../std/element-position';
+import { Value } from '../std/value';
+import { TNode, Renderable } from '../types/domain';
 /**
  * Creates a renderable function that repeats a given element a specified number of times.
  *
@@ -10,4 +10,4 @@ import { TNode, Renderable, Value } from '../types/domain';
  * @returns A renderable function that renders the repeated elements.
  * @public
  */
-export declare const Repeat: (times: Value<number>, element: (index: Signal<ElementPosition>) => TNode, separator?: (pos: Signal<ElementPosition>) => TNode) => Renderable;
+export declare const Repeat: (times: Value<number>, element: (index: ElementPosition) => TNode, separator?: (pos: ElementPosition) => TNode) => Renderable;

package/renderable/text.d.ts

@@ -1,5 +1,6 @@
-import { Renderable, Value } from '../types/domain';
+import { Renderable } from '../types/domain';
 import { Signal } from '../std/signal';
+import { Value } from '../std/value';
 /**
  * @internal
  */

package/renderable/when.d.ts

@@ -1,4 +1,5 @@
-import { Renderable, TNode, Value } from '../types/domain';
+import { Renderable, TNode } from '../types/domain';
+import { Value } from '../std/value';
 /**
  * Renders the `then` node if the `condition` is true, otherwise renders the `otherwise` node.
  *

package/std/{position.d.ts → element-position.d.ts}

@@ -1,9 +1,11 @@
+import { Signal } from './signal';
 /**
  * Represents the position of an element in a collection.
  *
  * @public
  */
 export declare class ElementPosition {
+    #private;
     /**
      * The index of the element.
      */
@@ -11,7 +13,26 @@ export declare class ElementPosition {
     /**
      * The total number of elements in the collection.
      */
-    readonly total: number;
+    readonly total: Signal<number>;
+    /**
+     * The counter of the element starting from 1.
+     */
+    readonly counter: number;
+    /**
+     * Checks if the element is the first element in the collection.
+     * @returns `true` if the element is the first element, `false` otherwise.
+     */
+    readonly isFirst: boolean;
+    /**
+     * Checks if the counter of the element is even.
+     * @returns `true` if the counter is even, `false` otherwise.
+     */
+    readonly isEven: boolean;
+    /**
+     * Checks if the counter of the element is odd.
+     * @returns `true` if the counter is odd, `false` otherwise.
+     */
+    readonly isOdd: boolean;
     /**
      * Creates a new instance of `ElementPosition`.
      * @param index - The index of the element.
@@ -25,29 +46,11 @@ export declare class ElementPosition {
     /**
      * The total number of elements in the collection.
      */
-    total: number);
-    /**
-     * Gets the counter of the element.
-     */
-    get counter(): number;
-    /**
-     * Checks if the element is the first element in the collection.
-     * @returns `true` if the element is the first element, `false` otherwise.
-     */
-    get isFirst(): boolean;
+    total: Signal<number>);
     /**
      * Checks if the element is the last element in the collection.
      * @returns `true` if the element is the last element, `false` otherwise.
      */
-    get isLast(): boolean;
-    /**
-     * Checks if the counter of the element is even.
-     * @returns `true` if the counter is even, `false` otherwise.
-     */
-    get isEven(): boolean;
-    /**
-     * Checks if the counter of the element is odd.
-     * @returns `true` if the counter is odd, `false` otherwise.
-     */
-    get isOdd(): boolean;
+    get isLast(): Signal<boolean>;
+    readonly dispose: () => void;
 }

package/std/signal-utils.d.ts

@@ -1,5 +1,6 @@
-import { RemoveSignals, Value } from '../types/domain';
+import { RemoveSignals } from '../types/domain';
 import { AnySignal, Computed, Prop, Signal } from './signal';
+import { Value } from './value';
 /**
  * Represents a memory store that stores key-value pairs.
  *

package/std/signal.d.ts

@@ -1,4 +1,3 @@
-import { GetValueTypes, Value } from '../types/domain';
 /**
  * Represents any type of signal.
  * It can be a Signal, Prop, or Computed.
@@ -40,45 +39,6 @@ export declare class Signal<T> {
      * @returns `true` if the value is a Signal, `false` otherwise.
      */
     static readonly is: <O>(value: O | Signal<O>) => value is Signal<O>;
-    /**
-     * Wraps a value or a Signal instance into a Signal.
-     * If the value is already a Signal, it returns the value itself.
-     * If the value is not a Signal, it creates a new Signal instance with the given value.
-     *
-     * @typeParam O - The type of the value.
-     * @param value - The value or Signal instance to wrap.
-     * @param equals - A function that determines if two values are equal. Defaults to strict equality (===).
-     * @returns A Signal instance.
-     */
-    static readonly wrap: <O>(value: O | Signal<O>, equals?: (a: O, b: O) => boolean) => Signal<O>;
-    /**
-     * Wraps a value in a `Signal` if it is not already a `Signal`.
-     * If the value is `null` or `undefined`, it returns `null` or `undefined` respectively.
-     * @param value - The value to wrap or check.
-     * @returns The wrapped value if it is not `null` or `undefined`, otherwise `null` or `undefined`.
-     */
-    static readonly maybeWrap: <O>(value: O | Signal<O> | null | undefined) => Signal<O> | undefined | null;
-    /**
-     * Unwraps a value from a `Signal` if it is a `Signal`, otherwise returns the value as is.
-     *
-     * @param value - The value to unwrap.
-     * @returns The unwrapped value.
-     */
-    static readonly unwrap: <O>(value: Signal<O> | O) => O;
-    /**
-     * Maps the value of a `Signal` or a regular value using the provided mapping function.
-     * If the input value is a `Signal`, the mapping function is applied to its value.
-     * If the input value is not a `Signal`, the mapping function is directly applied to the value.
-     *
-     * @param value - The input value to be mapped.
-     * @param fn - The mapping function to be applied to the value.
-     * @returns A new `Signal` with the mapped value if the input value is a `Signal`,
-     * otherwise, the result of applying the mapping function to the value.
-     *
-     * @typeParam N - The type of the input value.
-     * @typeParam O - The type of the mapped value.
-     */
-    static readonly map: <N, O>(value: Value<N>, fn: (value: N) => O) => Value<O>;
     /**
      * @internal
      */
@@ -422,16 +382,6 @@ export declare class Prop<T> extends Signal<T> {
  * @public
  */
 export declare const makeComputed: <T>(fn: () => T, dependencies: Array<AnySignal>, equals?: (a: T, b: T) => boolean) => Computed<T>;
-/**
- * Creates a computed signal that depends on other signals or literal values and updates when any of the dependencies change.
- *
- * @typeParam T - The type of the argument values.
- * @param fn - The function that computes the value.
- * @param equals - The equality function used to compare the previous and current computed values.
- * @returns - The computed signal.
- * @public
- */
-export declare const makeComputedOf: <T extends Value<unknown>[]>(...args: T) => <O>(fn: (...args: GetValueTypes<T>) => O, equals?: (a: O, b: O) => boolean) => Computed<O>;
 /**
  * Executes the provided function `fn` whenever any of the signals in the `signals` array change.
  * Returns a disposable object that can be used to stop the effect.
@@ -442,14 +392,6 @@ export declare const makeComputedOf: <T extends Value<unknown>[]>(...args: T) =>
  * @public
  */
 export declare const makeEffect: (fn: () => void, signals: Array<AnySignal>) => () => void;
-/**
- * Creates an effect that depends on other signals or literal values and updates when any of the dependencies change.
- *
- * @param args - The array of signals or literal values that the effect depends on.
- * @returns A disposable object that can be used to stop the effect.
- * @public
- */
-export declare const makeEffectOf: <T extends Value<unknown>[]>(...args: T) => (fn: (...args: GetValueTypes<T>) => void) => void;
 /**
  * Creates a new Prop object with the specified value and equality function.
  *

package/std/value.d.ts

@@ -0,0 +1,78 @@
+import { GetValueTypes } from '../types/domain';
+import { Signal } from './signal';
+/**
+ * Represents a value that can either be a `Signal<T>` or a generic type `T`.
+ *
+ * @public
+ */
+export type Value<T> = Signal<T> | T;
+export declare const Value: {
+    /**
+     * Maps a value or a Signal to a new value.
+     * If the value is a Signal, it returns a new Signal with the mapped value.
+     * If the value is not a Signal, it returns the mapped value.
+     *
+     * @typeParam T - The type of the value.
+     * @typeParam U - The type of the new value.
+     * @param value - The value or Signal to map.
+     * @param fn - The function to map the value.
+     * @returns The mapped value.
+     */
+    map: <T, U>(value: Value<T>, fn: (value: T) => U) => Value<U>;
+    /**
+     * Wraps a value or a Signal instance into a Signal.
+     * If the value is already a Signal, it returns the value itself.
+     * If the value is not a Signal, it creates a new Signal instance with the given value.
+     *
+     * @typeParam O - The type of the value.
+     * @param value - The value or Signal instance to wrap.
+     * @param equals - A function that determines if two values are equal. Defaults to strict equality (===).
+     * @returns A Signal instance.
+     */
+    toSignal: <T>(value: Value<T>, equals?: (a: T, b: T) => boolean) => Signal<T>;
+    /**
+     * Wraps a value in a `Signal` if it is not already a `Signal`.
+     * If the value is `null` or `undefined`, it returns `null` or `undefined` respectively.
+     * @param value - The value to wrap or check.
+     * @returns The wrapped value if it is not `null` or `undefined`, otherwise `null` or `undefined`.
+     */
+    maybeToSignal: <T>(value: Value<T> | undefined | null, equals?: (a: T, b: T) => boolean) => Signal<T> | undefined;
+    /**
+     * Gets the value from a `Signal` or the value itself if it is not a `Signal`.
+     * @param value - The value or Signal instance to get the value from.
+     * @returns The value.
+     */
+    get: <T>(value: Value<T>) => T;
+    /**
+     * Adds a listener to a `Signal` or calls the listener immediately if it is not a `Signal`.
+     * @param value - The value or Signal instance to add the listener to.
+     * @param listener - The listener to call when the value changes.
+     * @returns A function to remove the listener.
+     */
+    on: <T>(value: Value<T>, listener: (value: T) => void) => (() => void);
+    /**
+     * Disposes of a value or a Signal.
+     * If the value is a Signal, it disposes of the Signal.
+     * If the value is not a Signal, it does nothing.
+     * @param value - The value or Signal instance to dispose of.
+     */
+    dispose: <T>(value: Value<T>) => void;
+};
+/**
+ * Creates a computed signal that depends on other signals or literal values and updates when any of the dependencies change.
+ *
+ * @typeParam T - The type of the argument values.
+ * @param fn - The function that computes the value.
+ * @param equals - The equality function used to compare the previous and current computed values.
+ * @returns - The computed signal.
+ * @public
+ */
+export declare const makeComputedOf: <T extends Value<unknown>[]>(...args: T) => <O>(fn: (...args: GetValueTypes<T>) => O, equals?: (a: O, b: O) => boolean) => import('./signal').Computed<O>;
+/**
+ * Creates an effect that depends on other signals or literal values and updates when any of the dependencies change.
+ *
+ * @param args - The array of signals or literal values that the effect depends on.
+ * @returns A disposable object that can be used to stop the effect.
+ * @public
+ */
+export declare const makeEffectOf: <T extends Value<unknown>[]>(...args: T) => (fn: (...args: GetValueTypes<T>) => void) => void;

package/types/domain.d.ts

@@ -1,5 +1,6 @@
 import { DOMContext } from '../dom/dom-context';
 import { Signal } from '../std/signal';
+import { Value } from '../std/value';
 /**
  * Represents a function that can be rendered in the DOM.
  * @param ctx - The DOM context for rendering.
@@ -47,12 +48,6 @@ export type Size = {
      */
     readonly height: number;
 };
-/**
- * Represents a value that can either be a `Signal<T>` or a generic type `T`.
- *
- * @public
- */
-export type Value<T> = Signal<T> | T;
 /**
  * Represents a nullable value or a signal of a nullable value.
  * @typeParam T - The type of the value.