@praxisjs/decorators 0.1.0

package/src/functions/retry.ts

@@ -0,0 +1,43 @@
+export interface RetryOptions {
+  delay?: number;
+  backoff?: number;
+  onRetry?: (error: Error, attempt: number) => void;
+}
+
+export function Retry(maxAttempts: number, options: RetryOptions = {}) {
+  const { delay = 0, backoff = 1, onRetry } = options;
+
+  return function (
+    _target: object,
+    _methodKey: string,
+    descriptor: PropertyDescriptor,
+  ): PropertyDescriptor {
+    const originalMethod = descriptor.value as (
+      ...args: unknown[]
+    ) => Promise<unknown>;
+
+    descriptor.value = async function (this: object, ...args: unknown[]) {
+      let lastError: Error = new Error("Unknown error");
+      let currentDelay = delay;
+
+      for (let attempt = 1; attempt <= maxAttempts; attempt++) {
+        try {
+          return await originalMethod.apply(this, args);
+        } catch (e: unknown) {
+          lastError = e instanceof Error ? e : new Error(String(e));
+          if (attempt === maxAttempts) break;
+          onRetry?.(lastError, attempt);
+
+          if (currentDelay > 0) {
+            await new Promise((res) => setTimeout(res, currentDelay));
+            currentDelay = Math.round(currentDelay * backoff);
+          }
+        }
+      }
+
+      throw lastError;
+    };
+
+    return descriptor;
+  };
+}

package/src/functions/throttle.ts

@@ -0,0 +1,32 @@
+export function Throttle(ms: number) {
+  const lastRun = new WeakMap<object, number>();
+
+  return function (
+    _target: object,
+    methodKey: string,
+    descriptor: PropertyDescriptor,
+  ): PropertyDescriptor {
+    const originalMethod = descriptor.value as (...args: unknown[]) => unknown;
+    return {
+      enumerable: false,
+      configurable: true,
+      get(this: object) {
+        const bound = (...args: unknown[]) => {
+          const now = Date.now();
+          const last = lastRun.get(this) ?? 0;
+
+          if (now - last < ms) return;
+
+          lastRun.set(this, now);
+          return originalMethod.apply(this, args);
+        };
+        Object.defineProperty(this, methodKey, {
+          value: bound,
+          configurable: true,
+          writable: true,
+        });
+        return bound;
+      },
+    };
+  };
+}

package/src/functions/watch.ts

@@ -0,0 +1,99 @@
+import { type BaseComponent, effect } from "@praxisjs/core";
+import { type Computed, isComputed } from "@praxisjs/shared";
+
+type BaseComponentKeys = keyof BaseComponent;
+
+type WatchableKeys<T> = {
+  [K in Exclude<keyof T, BaseComponentKeys>]: T[K] extends (
+    ...args: infer A
+  ) => unknown
+    ? A extends []
+      ? T[K] extends Computed<unknown>
+        ? K
+        : never
+      : never
+    : K;
+}[Exclude<keyof T, BaseComponentKeys>] &
+  string;
+
+type NoDuplicates<
+  Keys extends readonly string[],
+  Seen extends string = never,
+> = Keys extends readonly [
+  infer Head extends string,
+  ...infer Rest extends string[],
+]
+  ? Head extends Seen
+    ? [`Error: prop '${Head}' is duplicated`, ...Rest]
+    : [Head, ...NoDuplicates<Rest, Seen | Head>]
+  : Keys;
+
+type ValidateKeys<
+  T extends BaseComponent,
+  Keys extends ReadonlyArray<WatchableKeys<T>>,
+> = NoDuplicates<[...Keys]> extends Keys ? Keys : NoDuplicates<[...Keys]>;
+
+type Unwrap<T> =
+  T extends Computed<infer U> ? U : T extends () => infer U ? U : T;
+
+export type WatchVal<T extends BaseComponent, K extends keyof T> = Unwrap<T[K]>;
+export type WatchVals<T extends BaseComponent, K extends keyof T> = {
+  [P in K]: Unwrap<T[P]>;
+};
+
+function readValue(instance: Record<string, unknown>, key: string): unknown {
+  const raw = instance[key];
+  return isComputed(raw) ? (raw as Computed<unknown>)() : raw;
+}
+
+function injectOnMount(
+  target: object,
+  fn: (this: Record<string, unknown>) => void,
+): void {
+  const t = target as { onMount?: () => void };
+  const originalMethod = t.onMount;
+  t.onMount = function (this: Record<string, unknown>) {
+    originalMethod?.call(this);
+    fn.call(this);
+  };
+}
+
+export function Watch<
+  T extends BaseComponent,
+  const Keys extends ReadonlyArray<WatchableKeys<T>>,
+>(...propNames: ValidateKeys<T, Keys>) {
+  return function (
+    target: T,
+    _key: string,
+    descriptor: PropertyDescriptor,
+  ): PropertyDescriptor {
+    const props = propNames as unknown as string[];
+    const method = descriptor.value as (this: Record<string, unknown>, ...args: unknown[]) => void;
+
+    injectOnMount(target, function (this) {
+      if (props.length === 1) {
+        let oldVal = readValue(this, props[0]);
+        effect(() => {
+          const newVal = readValue(this, props[0]);
+          if (!Object.is(newVal, oldVal)) {
+            method.call(this, newVal, oldVal);
+            oldVal = newVal;
+          }
+        });
+      } else {
+        const read = () =>
+          Object.fromEntries(props.map((p) => [p, readValue(this, p)]));
+        let oldVals = read();
+        effect(() => {
+          const newVals = read();
+          if (props.some((p) => !Object.is(newVals[p], oldVals[p]))) {
+            method.call(this, newVals, oldVals);
+            oldVals = newVals;
+          }
+        });
+      }
+    });
+
+    return descriptor;
+  };
+}

package/src/functions/when.ts

@@ -0,0 +1,44 @@
+import { type BaseComponent, when } from "@praxisjs/core";
+import { isComputed } from "@praxisjs/shared";
+
+export function When(propName: string) {
+  return function (
+    target: object,
+    _methodKey: string,
+    descriptor: PropertyDescriptor,
+  ): PropertyDescriptor {
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    const originalOnMount = (target as { onMount?(): void }).onMount;
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    const originalOnUnmount = (target as { onUnmount?(): void }).onUnmount;
+
+    const method = descriptor.value as (value: unknown) => void;
+    const cancels = new WeakMap<object, () => void>();
+
+    (target as { onMount?(): void }).onMount = function (this: BaseComponent) {
+      originalOnMount?.call(this);
+
+      const instance = this as unknown as Record<string, unknown>;
+      const source = () => {
+        const raw = instance[propName];
+        return isComputed(raw) ? (raw as unknown as () => unknown)() : raw;
+      };
+
+      const cancel = when(source, (value) => {
+        method.call(this, value);
+      });
+
+      cancels.set(this, cancel);
+    };
+
+    (target as { onUnmount?(): void }).onUnmount = function (
+      this: BaseComponent,
+    ) {
+      originalOnUnmount?.call(this);
+      cancels.get(this)?.();
+      cancels.delete(this);
+    };
+
+    return descriptor;
+  };
+}

package/src/index.ts

@@ -0,0 +1,16 @@
+export { Component, Memoize, Lazy, Virtual } from "./component";
+export {
+  Memo,
+  Bind,
+  Log,
+  Once,
+  Retry,
+  Debounce,
+  Throttle,
+  When,
+  Watch,
+  type WatchVal,
+  type WatchVals,
+} from "./functions";
+export { Prop, State, Persisted, Slot, initSlots, History } from "./properties";
+export { type Command, createCommand, Emit, OnCommand } from "./events";

package/src/properties/history.ts

@@ -0,0 +1,62 @@
+import { type HistoryElement, history } from "@praxisjs/core";
+
+export function History(limit = 50) {
+  return function (target: object, propertyKey: string): void {
+    const historyKey = `${propertyKey}History`;
+    const histories = new WeakMap<object, HistoryElement<unknown>>();
+
+    const originalDescriptor = Object.getOwnPropertyDescriptor(
+      target,
+      propertyKey,
+    );
+
+    Object.defineProperty(target, historyKey, {
+      get(this: object): HistoryElement<unknown> {
+        if (!histories.has(this)) {
+          const source = () => {
+            const desc =
+              Object.getOwnPropertyDescriptor(this, propertyKey) ??
+              Object.getOwnPropertyDescriptor(
+                Object.getPrototypeOf(this),
+                propertyKey,
+              );
+            return desc?.get?.call(this) as unknown;
+          };
+
+          const h = history(source as () => unknown, limit);
+
+          const originalUndo = () => { h.undo(); };
+          const originalRedo = () => { h.redo(); };
+
+          h.undo = () => {
+            const prev = h.values()[h.values().length - 2];
+            if (prev === undefined) return;
+            originalUndo();
+            (
+              Object.getOwnPropertyDescriptor(
+                Object.getPrototypeOf(this),
+                propertyKey,
+              ) ?? originalDescriptor
+            )?.set?.call(this, prev);
+          };
+
+          h.redo = () => {
+            originalRedo();
+            const next = h.current();
+            (
+              Object.getOwnPropertyDescriptor(
+                Object.getPrototypeOf(this),
+                propertyKey,
+              ) ?? originalDescriptor
+            )?.set?.call(this, next);
+          };
+
+          histories.set(this, h);
+        }
+        return histories.get(this) as HistoryElement<unknown>;
+      },
+      enumerable: false,
+      configurable: true,
+    });
+  };
+}

package/src/properties/index.ts

@@ -0,0 +1,5 @@
+export { Prop } from "./prop";
+export { State } from "./state";
+export { Persisted } from "./persisted";
+export { Slot, initSlots } from "./slot";
+export { History } from "./history";

package/src/properties/persisted.ts

@@ -0,0 +1,75 @@
+import { persistedSignal, type PersistedSignalOptions } from "@praxisjs/core";
+import type { Signal } from "@praxisjs/shared";
+
+const signalMap = new WeakMap<object, Map<string, Signal<unknown>>>();
+const initMap = new WeakMap<object, Set<string>>();
+
+function isInitialized(instance: object, propKey: string): boolean {
+  return initMap.get(instance)?.has(propKey) ?? false;
+}
+
+function markInitialized(instance: object, propKey: string): void {
+  if (!initMap.has(instance)) {
+    initMap.set(instance, new Set());
+  }
+  (initMap.get(instance) as Set<string>).add(propKey);
+}
+
+function getOrCreateSignal<T>(
+  instance: object,
+  storageKey: string,
+  initialValue: T,
+  options: PersistedSignalOptions<T>,
+): Signal<T> {
+  if (!signalMap.has(instance)) {
+    signalMap.set(instance, new Map());
+  }
+  const map = signalMap.get(instance) as Map<string, Signal<unknown>>;
+
+  if (!map.has(storageKey)) {
+    map.set(
+      storageKey,
+      persistedSignal(storageKey, initialValue, options) as Signal<unknown>,
+    );
+  }
+
+  return map.get(storageKey) as Signal<T>;
+}
+
+export function Persisted<T>(
+  key?: string,
+  options: PersistedSignalOptions<T> = {},
+) {
+  return function (target: object, propertyKey: string): void {
+    const storageKey = key ?? propertyKey;
+
+    Object.defineProperty(target, propertyKey, {
+      get(this: object): T {
+        if (!isInitialized(this, propertyKey)) {
+          return undefined as T;
+        }
+
+        return getOrCreateSignal<T>(
+          this,
+          storageKey,
+          undefined as T,
+          options,
+        )();
+      },
+
+      set(this: object, value: T): void {
+        if (!isInitialized(this, propertyKey)) {
+          markInitialized(this, propertyKey);
+          getOrCreateSignal(this, storageKey, value, options);
+          return;
+        }
+        getOrCreateSignal<T>(this, storageKey, undefined as T, options).set(
+          value,
+        );
+      },
+
+      enumerable: true,
+      configurable: true,
+    });
+  };
+}

package/src/properties/prop.ts

@@ -0,0 +1,18 @@
+import type { BaseComponent } from "@praxisjs/core";
+
+export function Prop() {
+  return function (target: object, propertyKey: string) {
+    Object.defineProperty(target, propertyKey, {
+      get(this: BaseComponent) {
+        const fromParent = this._rawProps[propertyKey];
+        if (fromParent !== undefined) return fromParent;
+        return this._defaults[propertyKey];
+      },
+      set(this: BaseComponent, value: unknown) {
+        this._defaults[propertyKey] = value;
+      },
+      enumerable: true,
+      configurable: true,
+    });
+  };
+}

package/src/properties/slot.ts

@@ -0,0 +1,75 @@
+import type { BaseComponent } from "@praxisjs/core";
+import {
+  type Children,
+  type ChildrenInternal,
+  flattenChildren,
+  type VNode,
+} from "@praxisjs/shared";
+
+const slotsMap = new WeakMap<object, Map<string, ChildrenInternal[]>>();
+
+export interface SlottedVNode extends VNode {
+  slot?: string;
+}
+
+export function resolveSlots(
+  children: ChildrenInternal | ChildrenInternal[] | undefined,
+): Map<string, ChildrenInternal[]> {
+  const slots = new Map<string, ChildrenInternal[]>();
+  const defaultSlot: ChildrenInternal[] = [];
+  slots.set("default", defaultSlot);
+
+  if (!children) return slots;
+
+  const arr: ChildrenInternal[] = flattenChildren(children);
+
+  for (const child of arr as SlottedVNode[]) {
+    const slotName = (child.props.slot as string | undefined) ?? child.slot;
+
+    if (slotName) {
+      if (!slots.has(slotName)) slots.set(slotName, []);
+      (slots.get(slotName) as ChildrenInternal[]).push(
+        child as ChildrenInternal,
+      );
+    } else {
+      defaultSlot.push(child as ChildrenInternal);
+    }
+  }
+
+  return slots;
+}
+
+export function initSlots(
+  instance: object,
+  children: Children | undefined,
+): void {
+  slotsMap.set(instance, resolveSlots(children));
+}
+
+export function getSlot(instance: object, name: string): ChildrenInternal[] {
+  return slotsMap.get(instance)?.get(name) ?? [];
+}
+
+export function Slot(name?: string) {
+  return function (target: object, propertyKey: string): void {
+    const slotName =
+      name ?? (propertyKey === "default" ? "default" : propertyKey);
+
+    Object.defineProperty(target, propertyKey, {
+      get(this: BaseComponent): ChildrenInternal[] {
+        return getSlot(this, slotName);
+      },
+
+      set(_value: unknown): void {
+        if (process.env.NODE_ENV !== "production") {
+          console.warn(
+            `[Slot] "${propertyKey}" is a slot and cannot be assigned directly. Slots are filled by the parent component.`,
+          );
+        }
+      },
+
+      enumerable: true,
+      configurable: true,
+    });
+  };
+}

package/src/properties/state.ts

@@ -0,0 +1,24 @@
+import { signal } from "@praxisjs/core";
+import type { ComponentInstance, Signal } from "@praxisjs/shared";
+
+export function State() {
+  return function (target: object, propertyKey: string) {
+    const signalMap = new WeakMap<object, Signal<unknown>>();
+
+    Object.defineProperty(target, propertyKey, {
+      get(this: object) {
+        if (!signalMap.has(this)) signalMap.set(this, signal(undefined));
+        return (signalMap.get(this) as Signal<unknown>)();
+      },
+      set(this: object, value: unknown) {
+        if (!signalMap.has(this)) signalMap.set(this, signal(value));
+        else {
+          (this as ComponentInstance)._stateDirty = true;
+          (signalMap.get(this) as Signal<unknown>).set(value);
+        }
+      },
+      enumerable: true,
+      configurable: true,
+    });
+  };
+}

package/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["src"]
+}