@manyducks.co/dolla 2.0.0-alpha.34 → 2.0.0-alpha.36

package/dist/core/nodes/view.d.ts

@@ -1,13 +1,12 @@
-import { Emitter } from "@manyducks.co/emitter";
-import { type ElementContext, type StorableContext, type WildcardListenerMap } from "../context.js";
+import type { ComponentContext, ElementContext, StoreConsumerContext, StoreProviderContext } from "../context.js";
 import type { Logger } from "../dolla.js";
 import { type Markup, type MarkupElement } from "../markup.js";
-import { type MaybeState, type State, type StateValues, type StopFunction } from "../state.js";
+import { type EffectCallback, type Reactive, type UnsubscribeFunction } from "../signals.js";
 import { IS_MARKUP_ELEMENT } from "../symbols.js";
 /**
  * Any valid value that a View can return.
  */
-export type ViewResult = Node | State<any> | Markup | Markup[] | null;
+export type ViewResult = Node | Reactive<any> | Markup | Markup[] | null;
 export type ViewFunction<P> = (this: ViewContext, props: P, context: ViewContext) => ViewResult;
 /**
  * A view that has been constructed into DOM nodes.
@@ -18,18 +17,11 @@ export interface ViewElement extends MarkupElement {
      */
     setChildView(view: ViewFunction<{}>): ViewElement;
 }
-export interface ViewContext extends Logger, StorableContext {
+export interface ViewContext extends Omit<Logger, "setName">, ComponentContext, StoreProviderContext, StoreConsumerContext {
     /**
      * An ID unique to this view.
      */
     readonly uid: string;
-    /**
-     * Returns an object of all variables stored on this context.
-     */
-    /**
-     * Sets the name of the view's built in logger.
-     */
-    setName(name: string): ViewContext;
     /**
      * True while this view is connected to the DOM.
      */
@@ -51,36 +43,32 @@ export interface ViewContext extends Logger, StorableContext {
      */
     onUnmount(callback: () => void): void;
     /**
-     * Watch a set of states. The callback is called when any of the states receive a new value.
-     * Watchers will be automatically stopped when this view is unmounted.
+     * Passes a getter function to `callback` that will track reactive states and return their current values.
+     * Callback will be run each time a tracked state gets a new value.
      */
-    watch<T extends MaybeState<any>[]>(states: [...T], callback: (...values: StateValues<T>) => void): StopFunction;
+    effect(callback: EffectCallback): UnsubscribeFunction;
     /**
      * Returns a Markup element that displays this view's children.
      */
     outlet(): Markup;
 }
-type ViewEvents = {
-    beforeMount: [];
-    mounted: [];
-    beforeUnmount: [];
-    unmounted: [];
-};
 export declare class View<P> implements ViewElement {
     [IS_MARKUP_ELEMENT]: boolean;
     uniqueId: string;
-    _elementContext: ElementContext;
-    _logger: Logger;
-    _view: ViewFunction<P>;
-    _props: P;
-    _element?: MarkupElement;
-    _childMarkup: Markup[];
-    _$children: State<MarkupElement[]>;
-    _setChildren: import("../state.js").Setter<MarkupElement[], MarkupElement[]>;
-    _watcher: import("../state.js").StateWatcher;
-    _emitter: Emitter<ViewEvents>;
-    _wildcardListeners: WildcardListenerMap;
-    constructor(elementContext: ElementContext, view: ViewFunction<P>, props: P, children?: Markup[]);
+    elementContext: ElementContext;
+    logger: Logger;
+    props: P;
+    fn: ViewFunction<P>;
+    element?: MarkupElement;
+    childMarkup: Markup[];
+    children: import("../signals.js").Atom<MarkupElement[]>;
+    lifecycleListeners: {
+        beforeMount: (() => any)[];
+        mount: (() => any)[];
+        beforeUnmount: (() => any)[];
+        unmount: (() => any)[];
+    };
+    constructor(elementContext: ElementContext, fn: ViewFunction<P>, props: P, children?: Markup[]);
     get node(): Node;
     isMounted: boolean;
     mount(parent: Node, after?: Node): void;
@@ -88,4 +76,3 @@ export declare class View<P> implements ViewElement {
     setChildView(fn: ViewFunction<{}>): View<{}>;
     private _initialize;
 }
-export {};

package/dist/core/ref.d.ts

@@ -20,10 +20,9 @@ export interface Ref<T> {
  * @param value - An (optional) initial value to store.
  *
  * @example
- * const ref = createRef(5);
- * ref(); // 5
- * ref(500);
- * ref(); // 500
+ * const number = ref(5);
+ * number(); // 5
+ * number(500);
+ * number(); // 500
  */
-export declare function createRef<T>(value?: T): Ref<T>;
-export declare function isRef<T extends Node>(value: any): value is Ref<T>;
+export declare function ref<T>(value?: T): Ref<T>;

package/dist/core/signals.d.ts

@@ -0,0 +1,128 @@
+import { type Dependency, type Subscriber } from "alien-signals";
+export interface Effect extends Subscriber, Dependency {
+    fn(): void;
+}
+export interface Computed<T = any> extends Signal<T | undefined>, Subscriber {
+    getter: (cachedValue?: T) => T;
+    equals: EqualityFunction<T>;
+}
+export interface Signal<T = any> extends Dependency {
+    currentValue: T;
+}
+/**
+ * A readable reactive state object.
+ */
+export interface Reactive<T> {
+    /**
+     * The current value.
+     */
+    readonly value: T;
+}
+export type MaybeReactive<T> = Reactive<T> | T;
+export type UnsubscribeFunction = () => void;
+/**
+ * A function to compare the current and next values. Returning `true` means the value has changed.
+ */
+export type EqualityFunction<T> = (current: T, next: T) => boolean;
+export interface ReactiveOptions<T> {
+    /**
+     * A label for debugging purposes.
+     */
+    name?: string;
+    /**
+     * A function to compare the current and next values. Returning `true` means the value has changed.
+     */
+    equals?: EqualityFunction<T>;
+}
+export declare class Atom<T> implements Reactive<T> {
+    #private;
+    /**
+     * A label for debugging purposes.
+     */
+    name?: string;
+    constructor(signal: Signal<T>, options?: ReactiveOptions<T>);
+    get value(): T;
+    set value(next: T);
+}
+/**
+ * Determines if a value is reactive.
+ */
+export declare function isReactive<T>(value: any): value is Reactive<T>;
+/**
+ * Creates a simple reactive container that stores a value.
+ * Atom values can be read and updated with the `value` property
+ *
+ * @example
+ * const count = atom(1);
+ * count.value++;
+ * count.value; // 2
+ */
+export declare function atom<T>(): Atom<T | undefined>;
+/**
+ * Creates a simple reactive container that stores a value.
+ * Atom values can be read and updated with the `value` property.
+ *
+ * @example
+ * const count = atom(1);
+ * count.value++;
+ * count.value; // 2
+ */
+export declare function atom<T>(value: T, options?: ReactiveOptions<T>): Atom<T>;
+/**
+ * Creates a simple reactive container that stores a value.
+ * Atom values can be read and updated with the `value` property.
+ *
+ * @example
+ * const count = atom(1);
+ * count.value++;
+ * count.value; // 2
+ */
+export declare function atom<T>(value?: T, options?: ReactiveOptions<T>): Atom<T | undefined>;
+type ComposeCallback<T> = (previousValue?: T) => MaybeReactive<T>;
+/**
+ * Creates a reactive container that derives its value from other reactive values that it tracks.
+ *
+ * @example
+ * const count = atom(1);
+ * const doubled = compose(() => get(count) * 2);
+ */
+export declare function compose<T>(fn: ComposeCallback<T>, options?: ReactiveOptions<T>): Reactive<T>;
+/**
+ * Takes a new value to set, or a callback that receives the current value and returns a new value to set.
+ */
+type Setter<T> = (next: T | ((current: T) => T)) => void;
+export declare function set<T>(atom: Atom<T>): Setter<T>;
+export declare function set<T>(atom: Atom<T>, next: T | ((current: T) => T)): void;
+/**
+ * Returns the current value from a reactive _and track it_ if called in a `compose` or `effect` scope.
+ * If a non-reactive value is passed it will just be returned untracked.
+ *
+ * @example
+ * const count = atom(1);
+ * const value = get(count); // 1
+ *
+ * const value = get(5); // 5
+ */
+export declare function get<T>(value: MaybeReactive<T>): T;
+/**
+ * Returns the current value from a reactive (without tracking).
+ * If a non-reactive value is passed it will be returned.
+ *
+ * @example
+ * ctx.effect(() => {
+ *   const doubled = get(count) * 2; // `count` will be tracked
+ *
+ *   const doubled = peek(count) * 2; // `count` will NOT be tracked
+ * });
+ */
+export declare function peek<T>(value: MaybeReactive<T>): T;
+export type EffectCallback = () => void;
+/**
+ * Creates a tracked scope that re-runs whenever the values of any tracked reactives changes.
+ * Reactives are tracked by accessing their `value` within the body of the function.
+ *
+ * NOTE: You must call the unsubscribe function to stop watching for changes.
+ * If you are using an effect inside a View or Store, use `ctx.effect` instead, which cleans up automatically when the component unmounts.
+ */
+export declare function effect(fn: EffectCallback): UnsubscribeFunction;
+export {};

package/dist/core/store.d.ts

@@ -1,10 +1,9 @@
-import { Emitter } from "@manyducks.co/emitter";
-import { type ComponentContext, type ElementContext, type WildcardListenerMap } from "./context.js";
+import type { StoreConsumerContext, ComponentContext, ElementContext } from "./context.js";
 import type { Logger } from "./dolla.js";
-import { type MaybeState, type StateValues, type StopFunction } from "./state.js";
+import { EffectCallback, UnsubscribeFunction } from "./signals.js";
 export type StoreFunction<Options, Value> = (this: StoreContext, options: Options, context: StoreContext) => Value;
 export type StoreFactory<Options, Value> = Options extends undefined ? () => Store<Options, Value> : (options: Options) => Store<Options, Value>;
-export interface StoreContext extends Logger, ComponentContext {
+export interface StoreContext extends Omit<Logger, "setName">, ComponentContext, StoreConsumerContext {
     /**
      * True while this store is attached to a context that is currently mounted in the view tree.
      */
@@ -18,15 +17,11 @@ export interface StoreContext extends Logger, ComponentContext {
      */
     onUnmount(callback: () => void): void;
     /**
-     * Watch a set of states. The callback is called when any of the states receive a new value.
-     * Watchers will be automatically stopped when this store is unmounted.
+     * Passes a getter function to `callback` that will track reactive states and return their current values.
+     * Callback will be run each time a tracked state gets a new value.
      */
-    watch<T extends MaybeState<any>[]>(states: [...T], callback: (...values: StateValues<T>) => void): StopFunction;
+    effect(callback: EffectCallback): UnsubscribeFunction;
 }
-type StoreEvents = {
-    mounted: [];
-    unmounted: [];
-};
 export declare class Store<Options, Value> {
     readonly fn: StoreFunction<Options, Value>;
     private _options;
@@ -35,12 +30,14 @@ export declare class Store<Options, Value> {
      */
     value: Value;
     isMounted: boolean;
-    _elementContext: ElementContext;
-    _emitter: Emitter<StoreEvents>;
-    _wildcardListeners: WildcardListenerMap;
-    _logger: Logger;
-    _watcher: import("./state.js").StateWatcher;
-    get name(): string;
+    elementContext: ElementContext;
+    lifecycleListeners: {
+        mount: (() => any)[];
+        unmount: (() => any)[];
+    };
+    logger: Logger;
+    id: string;
+    name: string;
     constructor(fn: StoreFunction<Options, Value>, options: Options);
     /**
      * Attaches this Store to the elementContext.
@@ -53,4 +50,3 @@ export declare class Store<Options, Value> {
 export declare function isStore<Options, Value>(value: any): value is Store<Options, Value>;
 export declare class StoreError extends Error {
 }
-export {};

package/dist/core/symbols.d.ts

@@ -1,7 +1,4 @@
-export declare const IS_STATE: unique symbol;
-export declare const IS_REF: unique symbol;
 export declare const IS_MARKUP: unique symbol;
 export declare const IS_MARKUP_ELEMENT: unique symbol;
 export declare const IS_STORE: unique symbol;
-export declare const IS_STORE_FACTORY: unique symbol;
 export declare const IS_ROUTER: unique symbol;

package/dist/{views → core/views}/default-crash-view.d.ts

@@ -15,4 +15,4 @@ export type CrashViewProps = {
      */
     uid?: string;
 };
-export declare function DefaultCrashView(props: CrashViewProps): import("../core/markup.js").Markup | import("../core/markup.js").Markup[];
+export declare function DefaultCrashView(props: CrashViewProps): import("../markup.js").Markup | import("../markup.js").Markup[];

package/dist/{views → core/views}/passthrough.d.ts

@@ -1,5 +1,5 @@
-import { type ViewContext } from "../core/nodes/view.js";
+import { type ViewContext } from "../nodes/view.js";
 /**
  * A utility view that simply displays its children.
  */
-export declare function Passthrough(_: {}, ctx: ViewContext): import("../index.js").Markup;
+export declare function Passthrough(_: {}, ctx: ViewContext): import("../markup.js").Markup;

package/dist/{modules/http.d.ts → http/index.d.ts}

@@ -1,11 +1,10 @@
-import type { Dolla } from "../core/dolla.js";
 /**
  * A simple HTTP client with middleware support. Middleware applies to all requests made through this store,
  * so it's the perfect way to handle things like auth headers and permission checks for API calls.
  */
 export declare class HTTP {
     #private;
-    constructor(dolla: Dolla);
+    constructor();
     /**
      * Adds a new middleware that will apply to subsequent requests.
      * Returns a function to remove this middleware.

package/dist/index.d.ts

@@ -1,22 +1,19 @@
-export { createState, derive, isState, toState, toValue } from "./core/state.js";
-export type { MaybeState, Setter, State, StopFunction } from "./core/state.js";
-export { createRef, isRef, type Ref } from "./core/ref.js";
-export { type StoreFunction, type StoreContext } from "./core/store.js";
-export { createRouter, type Router, type RouterOptions } from "./modules/router.js";
+export { atom, compose, effect, get, set, peek } from "./core/signals.js";
+export type { Reactive, MaybeReactive, Atom } from "./core/signals.js";
 export { deepEqual, shallowEqual, strictEqual } from "./utils.js";
-export { cond, createMarkup, html, portal, repeat } from "./core/markup.js";
+export { ref, type Ref } from "./core/ref.js";
+export { type StoreFunction, type StoreContext } from "./core/store.js";
+export { createRouter, type Router, type RouterOptions } from "./router/index.js";
+export { cond, createMarkup, html, portal, list } from "./core/markup.js";
 export type { Markup, MarkupElement } from "./core/markup.js";
 import { Dolla } from "./core/dolla.js";
 declare const dolla: Dolla;
 export default dolla;
-export declare const t: (selector: string, options?: import("./modules/i18n.js").TOptions) => import("./core/state.js").State<string>;
-export declare function setDevDebug(value: boolean): void;
-export declare function getDevDebug(): boolean;
+export declare const t: (selector: string, options?: import("./translate/index.js").TOptions) => import("./core/signals.js").Reactive<string>;
 export type { Dolla, Environment, Logger, LoggerErrorContext, LoggerOptions, Loggles } from "./core/dolla.js";
 export type { ViewContext, ViewElement, ViewFunction } from "./core/nodes/view.js";
-export type { HTTPRequest, HTTPResponse } from "./modules/http.js";
 export type { InputType, Renderable } from "./types.js";
-export type { CrashViewProps } from "./views/default-crash-view.js";
+export type { CrashViewProps } from "./core/views/default-crash-view.js";
 import type { IntrinsicElements as Elements } from "./types";
 declare global {
     namespace JSX {