@tempots/dom 16.0.0 → 18.0.0

package/package.json

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

package/renderable/attribute.d.ts

@@ -1,12 +1,12 @@
-import { Renderable } from '../types/domain';
-import { Value, NValue } from '../std/signal';
+import { NValue, Renderable, Value } from '../types/domain';
 
 /**
  * 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
  * from the attribute name.
  *
- * Example
+ * @remarks
+ * @example
  * ```ts
  * const button = html.button(
  *   attr.type('button'),
@@ -136,7 +136,8 @@ export declare const dataAttr: {
 /**
  * An object that provides a convenient way to create mountable attributes for ARIA properties.
  *
- * Example
+ * @remarks
+ * @example
  * ```ts
  * const button = html.button(
  *   aria.label('Click me!'),
@@ -453,7 +454,8 @@ export declare const svgAttr: {
 /**
  * An object that provides attribute functions for MathML tags.
  *
- * Example
+ * @remarks
+ * @example
  * ```ts
  * const math = html.math(
  *  mathAttr.mathvariant('bold'),

package/renderable/domnode.d.ts

@@ -0,0 +1,3 @@
+import { DOMContext } from '../dom/dom-context';
+
+export declare const DOMNode: (node: Node) => (ctx: DOMContext) => (removeTree: boolean) => void;

package/renderable/handler.d.ts

@@ -1,6 +1,9 @@
 import { Renderable } from '../types/domain';
 
 export declare const OnChecked: (fn: (event: boolean) => void) => Renderable;
+/**
+ * Represents a collection of HTML event handlers that can be attached to an element.
+ */
 export declare const on: {
     abort: (handler: (event: Event) => void) => Renderable;
     animationcancel: (handler: (event: AnimationEvent) => void) => Renderable;

package/renderable/style.d.ts

@@ -1,5 +1,4 @@
-import { Renderable } from '../types/domain';
-import { NValue } from '../std/signal';
+import { NValue, Renderable } from '../types/domain';
 
 export declare const style: {
     all: (value: NValue<string>) => Renderable;

package/renderable/text.d.ts

@@ -1,5 +1,5 @@
-import { Renderable } from '../types/domain';
-import { Signal, Value } from '../std/signal';
+import { Renderable, Value } from '../types/domain';
+import { Signal } from '../std/signal';
 
 export declare const staticText: (text: string) => Renderable;
 export declare const signalText: (signal: Signal<string>) => Renderable;

package/std/signal-utils.d.ts

@@ -0,0 +1,50 @@
+import { RemoveSignals, Value } from '../types/domain';
+import { AnySignal, Computed, Prop, Signal } from './signal';
+
+export declare class MemoryStore {
+    private readonly _store;
+    getItem: (key: string) => string | null;
+    setItem: (key: string, value: string) => void;
+}
+export declare function storedProp<T>({ key, defaultValue, store, serialize, deserialize, equals, onLoad, }: {
+    key: string;
+    defaultValue: T | (() => T);
+    store: {
+        getItem: (key: string) => string | null;
+        setItem: (key: string, value: string) => void;
+    };
+    serialize?: (v: T) => string;
+    deserialize?: (v: string) => T;
+    equals?: (a: T, b: T) => boolean;
+    onLoad?: (value: T) => T;
+}): Prop<T>;
+export declare function localStorageProp<T>(options: {
+    key: string;
+    defaultValue: T | (() => T);
+    serialize?: (v: T) => string;
+    deserialize?: (v: string) => T;
+    equals?: (a: T, b: T) => boolean;
+    onLoad?: (value: T) => T;
+}): Prop<T>;
+export declare function sessionStorageProp<T>(options: {
+    key: string;
+    defaultValue: T | (() => T);
+    serialize?: (v: T) => string;
+    deserialize?: (v: string) => T;
+    equals?: (a: T, b: T) => boolean;
+    onLoad?: (value: T) => T;
+}): Prop<T>;
+export declare function animateSignals<T>(initialValue: T, fn: () => T, dependencies: Array<AnySignal>, options?: {
+    interpolate?: (start: T, end: T, delta: number) => T;
+    duration?: Value<number>;
+    easing?: (t: number) => number;
+    equals?: (a: T, b: T) => boolean;
+}): Prop<T>;
+export declare function animateSignal<T>(signal: Signal<T>, options?: {
+    initialValue?: T;
+    interpolate?: (start: T, end: T, delta: number) => T;
+    duration?: number;
+    easing?: (t: number) => number;
+    equals?: (a: T, b: T) => boolean;
+}): Prop<T>;
+export declare function computedRecord<T extends Record<string, Value<unknown>>, U>(record: T, fn: (value: RemoveSignals<T>) => U): Computed<U>;

package/std/signal.d.ts

@@ -1,10 +1,9 @@
+import { Value } from '../types/domain';
+
 declare const $isSignal = "$__signal__";
 declare const $isProp = "$__prop__";
 declare const $isComputed = "$__computed__";
 export type AnySignal<T = any> = Signal<T> | Prop<T> | Computed<T>;
-/**
- * @category Signal Implementation
- */
 export declare class Signal<T> {
     readonly equals: (a: T, b: T) => boolean;
     static ofPromise<T>(promise: Promise<T>, init: T, recover?: (error: unknown) => T, equals?: (a: T, b: T) => boolean): Signal<T>;
@@ -42,9 +41,6 @@ export declare class Signal<T> {
     readonly count: () => Computed<number>;
     readonly setDerivative: <U>(computed: Computed<U>) => void;
 }
-/**
- * @category Signal Implementation
- */
 export declare class Computed<T> extends Signal<T> {
     private readonly _fn;
     static is<T = unknown>(value: unknown): value is Computed<T>;
@@ -54,7 +50,9 @@ export declare class Computed<T> extends Signal<T> {
     readonly setDirty: () => void;
     protected _scheduleCount: number;
     protected readonly scheduleNotify: () => void;
+    /** {@inheritDoc Signal.get} */
     readonly get: () => T;
+    /** {@inheritDoc Signal.value} */
     get value(): T;
 }
 export type ReducerEffect<S, A> = (data: {
@@ -63,9 +61,6 @@ export type ReducerEffect<S, A> = (data: {
     action: A;
     dispatch: (action: A) => void;
 }) => void;
-/**
- * @category Signal Implementation
- */
 export declare class Prop<T> extends Signal<T> {
     static is<T = unknown>(value: unknown): value is Prop<T>;
     protected readonly [$isProp] = true;
@@ -74,64 +69,12 @@ export declare class Prop<T> extends Signal<T> {
     readonly reducer: <A>(fn: (acc: T, value: A) => T, ...effects: ReducerEffect<T, A>[]) => (action: A) => void;
     readonly iso: <U>(to: (value: T) => U, from: (value: U) => T, equals?: (a: U, b: U) => boolean) => Prop<U>;
     readonly atProp: <K extends keyof T>(key: K) => Prop<T[K]>;
+    /** {@inheritDoc Signal.get} */
     get value(): T;
     set value(value: T);
 }
-export declare function computed<T>(fn: () => T, signals: Array<AnySignal>, equals?: (a: T, b: T) => boolean): Computed<T>;
-export declare function effect(fn: () => void, signals: Array<AnySignal>): () => void;
-export declare function prop<T>(value: T, equals?: (a: T, b: T) => boolean): Prop<T>;
-export declare function signal<T>(value: T, equals?: (a: T, b: T) => boolean): Signal<T>;
-export declare class MemoryStore {
-    private readonly _store;
-    getItem: (key: string) => string | null;
-    setItem: (key: string, value: string) => void;
-}
-export declare function propOfStorage<T>({ key, defaultValue, store, serialize, deserialize, equals, onLoad, }: {
-    key: string;
-    defaultValue: T | (() => T);
-    store: {
-        getItem: (key: string) => string | null;
-        setItem: (key: string, value: string) => void;
-    };
-    serialize?: (v: T) => string;
-    deserialize?: (v: string) => T;
-    equals?: (a: T, b: T) => boolean;
-    onLoad?: (value: T) => T;
-}): Prop<T>;
-export declare function propOfLocalStorage<T>(options: {
-    key: string;
-    defaultValue: T | (() => T);
-    serialize?: (v: T) => string;
-    deserialize?: (v: string) => T;
-    equals?: (a: T, b: T) => boolean;
-    onLoad?: (value: T) => T;
-}): Prop<T>;
-export declare function propOfSessionStorage<T>(options: {
-    key: string;
-    defaultValue: T | (() => T);
-    serialize?: (v: T) => string;
-    deserialize?: (v: string) => T;
-    equals?: (a: T, b: T) => boolean;
-    onLoad?: (value: T) => T;
-}): Prop<T>;
-export declare function animate<T>(initialValue: T, fn: () => T, signals: Array<AnySignal>, options?: {
-    interpolate?: (start: T, end: T, delta: number) => T;
-    duration?: Value<number>;
-    easing?: (t: number) => number;
-    equals?: (a: T, b: T) => boolean;
-}): Prop<T>;
-export declare function animateOne<T>(signal: Signal<T>, options?: {
-    initialValue?: T;
-    interpolate?: (start: T, end: T, delta: number) => T;
-    duration?: number;
-    easing?: (t: number) => number;
-    equals?: (a: T, b: T) => boolean;
-}): Prop<T>;
-export type Value<T> = Signal<T> | T;
-export type NValue<T> = Value<T> | Value<T | null> | Value<T | undefined> | Value<T | null | undefined> | null | undefined;
-export type GetValueType<T> = T extends Signal<infer V> ? V : T;
-export type RemoveSignals<T extends Record<string | number | symbol, Value<unknown>>, K extends (string | number | symbol) & keyof T = keyof T> = {
-    [k in K]: GetValueType<T[k]>;
-};
-export declare function computedRecord<T extends Record<string, Value<unknown>>, U>(record: T, fn: (value: RemoveSignals<T>) => U): Computed<U>;
+export declare function useComputed<T>(fn: () => T, dependencies: Array<AnySignal>, equals?: (a: T, b: T) => boolean): Computed<T>;
+export declare function useEffect(fn: () => void, signals: Array<AnySignal>): () => void;
+export declare function useProp<T>(value: T, equals?: (a: T, b: T) => boolean): Prop<T>;
+export declare function useSignal<T>(value: T, equals?: (a: T, b: T) => boolean): Signal<T>;
 export {};

package/types/domain.d.ts

@@ -1,5 +1,5 @@
 import { DOMContext } from '../dom/dom-context';
-import { Value } from '../std/signal';
+import { Signal } from '../std/signal';
 
 export type Renderable = (ctx: DOMContext) => Clear;
 export type TNode = Renderable | Value<string> | undefined | null | Renderable[];
@@ -12,3 +12,9 @@ export interface Size {
     readonly width: number;
     readonly height: number;
 }
+export type Value<T> = Signal<T> | T;
+export type NValue<T> = Value<T> | Value<T | null> | Value<T | undefined> | Value<T | null | undefined> | null | undefined;
+export type GetValueType<T> = T extends Signal<infer V> ? V : T;
+export type RemoveSignals<T extends Record<string | number | symbol, Value<unknown>>, K extends (string | number | symbol) & keyof T = keyof T> = {
+    [k in K]: GetValueType<T[k]>;
+};

package/renderable/domel.d.ts

@@ -1,3 +0,0 @@
-import { DOMContext } from '../dom/dom-context';
-
-export declare const DOMEl: (element: Element) => (ctx: DOMContext) => (removeTree: boolean) => void;