steel-frame 7.0.2 → 7.0.3

package/src/export/index.ts

@@ -1,483 +0,0 @@
-import { AppNode, ArrayModel, MapModel, SetModel, ScreenProps } from "vasille";
-import type { VasilleSlot } from "vasille-web/jsx-runtime";
-import { WebRouter, WebTagOptions, CssStyleInjector, StyleSheetProps } from "vasille-web/types";
-
-export { safe } from "vasille";
-/** Set a handler for component errors */
-export declare function setErrorHandler(handler: (e: unknown) => void): void;
-
-declare interface Params {
-    slot(...args: unknown[]): unknown;
-}
-
-export declare type Composed<In extends object, Out> = (
-    props: (Required<In> extends Params ? In & { "vasille:slot"?: VasilleSlot } : In) & {
-        callback?(data: Out): void;
-    },
-) => void;
-declare type ComposedNoCallback<In extends object, Out> = (
-    props: Required<In> extends Params ? In & { "vasille:slot"?: VasilleSlot } : In,
-) => void;
-
-/**
- * Composes a component (v3), which can receive external reactive values via props
- * @deprecated use `component` instead
- * */
-export declare function compose<In extends object, Out extends NonNullable<unknown>>(
-    renderer: (input: In) => Out,
-): Composed<In, Out>;
-/**
- * Composes a component (v3), which can receive external reactive values via props
- * @deprecated use `component` instead
- * */
-export declare function compose<In extends object>(renderer: (input: In) => void): ComposedNoCallback<In, void>;
-
-/** Composes a component (v4), which can receive external reactive values via props */
-export declare function component<In extends object, Out extends NonNullable<unknown>>(
-    renderer: (input: In) => Out,
-): Composed<In, Out>;
-/** Composes a component (v4), which can receive external reactive values via props */
-export declare function component<In extends object>(renderer: (input: In) => void): ComposedNoCallback<In, void>;
-
-/** Composes a view, which can receive external reactive values via props */
-export declare function view<Out extends NonNullable<unknown>>(
-    renderer: () => Out,
-): Composed<NonNullable<unknown>, Out>;
-/** Composes a view, which can receive external reactive values via props */
-export declare function view<In extends object, Out extends NonNullable<unknown>>(
-    renderer: (input: In) => Out,
-): Composed<In, Out>;
-/** Composes a view, which can receive external reactive values via props */
-export declare function view(renderer: () => void): ComposedNoCallback<NonNullable<unknown>, void>;
-/** Composes a view, which can receive external reactive values via props */
-export declare function view<In extends object>(renderer: (input: In) => void): ComposedNoCallback<In, void>;
-
-/** A Vasille.JS App screen */
-type Screen<Route extends string> = (input: ScreenProps<Route>) => Promise<void>;
-
-/**
- * Composes a screen, the router navigates between screens
- * @deprecated use `page` instead
- * */
-export declare function screen<Route extends string>(renderer: Screen<Route>): Screen<Route>;
-
-/** Composes a page, the file-based router navigates between pages (used for tests only) */
-export declare function page<Route extends string>(renderer: Screen<Route>): Screen<Route>;
-
-/**
- * Returns the raw value of the expression
- * @deprecated use `unwrap` instead
- * */
-export declare function raw<T>(v: T): T;
-
-/** Unwrap the expression */
-export declare function unwrap<T>(v: T): T;
-
-/**
- * Pack value into a reactive reference
- * @deprecated use `state` instead
- * */
-export declare function ref<T>(v: T): T;
-/**
- * Pack value into a reactive reference
- * @deprecated use `state` instead
- * */
-export declare function ref<T>(): T | undefined;
-
-/** Reactive value constructor */
-export declare function state<T>(v: T): T;
-/** Reactive value constructor */
-export declare function state<T>(): T | undefined;
-
-/** Pack value into a reactive reference, returns undefined when initialization fails */
-export declare function safeState<T>(v: T): T | undefined;
-
-/** Debounce updates signals of a reactive reference/expression */
-export declare function debounced<T>(v: T, delay: number): T;
-
-/** Returns a reactive reference to the object field */
-export declare function field<T>(v: T): T;
-
-/**
- * Returns a reactive-computed form of expression value
- * @deprecated use `live` instead
- * */
-export declare function bind<T>(v: T): T;
-
-/** Returns a reactive-computed form of expression value */
-export declare function live<T>(v: T): T;
-
-/** Returns a reactive-computed form of expression value, returns undefined when initialization fails */
-export declare function safeLive<T>(v: T): T | undefined;
-
-/**
- * Returns a reactive-computed form of returned value
- * @deprecated use `live` instead
- * */
-export declare function calculate<T>(fn: () => T): T;
-
-/**
- * Runs the function each time when a dependency is changed
- * @deprecated use `effect` instead
- * */
-export declare function watch(f: () => void): void;
-
-/** Runs the function each time when a dependency is changed */
-export declare function effect(f: () => void): void;
-
-/**
- * Bypass write restriction, update a reactive state in effects
- * @deprecated report cases when you need it, we will fix
- * */
-export declare function bypassWriteRestriction<T>(reactive: T, value: T): T;
-
-/** Returns an array model of the array */
-export declare function arrayModel<T>(v?: T[]): ArrayModel<T>;
-
-/** Returns a set model of array values */
-export declare function setModel<T>(v?: T[]): SetModel<T>;
-
-/** Returns a map model of map data */
-export declare function mapModel<K, T>(v?: [K, T][]): MapModel<K, T>;
-
-/** Awaits async data in a sync component */
-export declare function awaited<T>(target: (signal?: AbortSignal) => Promise<T>): [unknown, T | undefined];
-
-/** Returns an abort signal to cancel requests/timers when context is destroyed */
-export declare function abortSignal(): AbortSignal | undefined;
-
-/** Initialize a value, return undefined when fails */
-export declare function safeInit<T>(value: T): T | undefined;
-
-/** Mounts a slot parameter of the component */
-export declare function Slot(options: { model?: () => void; slot?: () => void }): void;
-/** Mounts a slot parameter of the component */
-export declare function Slot<Props extends object>(
-    options: {
-        model?: (props: Props) => void;
-        slot?: () => void;
-        "vasille:slot"?: VasilleSlot;
-    } & Props,
-): void;
-
-/** Renders content conditionally */
-export declare function If<T>(props: {
-    r_condition: T;
-    slot?: (value: Exclude<T, false | 0 | "" | null | undefined>) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-/** Renders content conditionally */
-export declare function If(props: { r_condition: unknown; "vasille:slot"?: VasilleSlot }): void;
-
-/** @deprecated use `If` with `r_condition` instead */
-export declare function If<T>(props: {
-    $condition: T;
-    slot?: (value: Exclude<T, false | 0 | "" | null | undefined>) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-/** @deprecated use `If` with `r_condition` instead */
-export declare function If(props: { $condition: unknown; "vasille:slot"?: VasilleSlot }): void;
-
-/** Renders content conditionally, use strict after `<If/>` */
-export declare function ElseIf<T>(props: {
-    r_condition: T;
-    slot?: (value: Exclude<T, false | 0 | "" | null | undefined>) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-/** Renders content conditionally, use strict after `<If/>` */
-export declare function ElseIf(props: { r_condition: unknown; "vasille:slot"?: VasilleSlot }): void;
-
-/** @deprecated use `ElseIf` with `r_condition` instead */
-export declare function ElseIf<T>(props: {
-    $condition: T;
-    slot?: (value: Exclude<T, false | 0 | "" | null | undefined>) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-/** @deprecated use `ElseIf` with `r_condition` instead */
-export declare function ElseIf(props: { $condition: unknown; "vasille:slot"?: VasilleSlot }): void;
-
-/** Renders content conditionally, use strict after `<If/>` or `<ElseIf/>` */
-export declare function Else(props: { slot?: () => void; "vasille:slot"?: VasilleSlot }): void;
-
-/** Renders content several times using a model (array, map or set) */
-export declare function For<T>(props: {
-    of: ReadonlyArray<T>;
-    slot?: (value: T) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-export declare function For<T>(props: {
-    of: ReadonlySet<T>;
-    slot?: (value: T) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-export declare function For<K, T>(props: {
-    of: ReadonlyMap<K, T>;
-    slot?: (value: T, index: K) => void;
-    "vasille:slot"?: VasilleSlot;
-}): void;
-
-/** Renders content of an `array`, updates are tracked via a diff algorithm */
-export declare function ArrayView<T>(props: {
-    r_of: ReadonlyArray<T>;
-    key: (v: T) => string | number;
-    slot: (r_value: T, r_index: number) => void;
-}): void;
-
-/** @deprecated use `ArrayView` instead */
-export declare function ArrayView<T>(props: {
-    $of: ReadonlyArray<T>;
-    key: (v: T) => string | number;
-    slot: (r_value: T, r_index: number) => void;
-}): void;
-
-/** Renders content of an `array model`, which can be updated via `push`, `pull`, ... */
-export declare function ArrayModelView<T>(props: {
-    of: ReadonlyArray<T>;
-    slot: (value: T, r_index: number) => void;
-}): void;
-
-/** Renders content of a `map model`, which can be updated via `set`, `delete`, ... */
-export declare function MapModelView<K, T>(props: { of: ReadonlyMap<K, T>; slot: (r_value: T, key: K) => void }): void;
-
-/** Renders content of a `set model`, which can be updated via `add`, `delete`, ... */
-export declare function SetModelView<T>(props: { of: ReadonlySet<T>; slot: (value: T) => void }): void;
-
-/** Will be translated to for (let value of value) { slot(item) } */
-export declare function Iterate<
-    T extends { [Symbol.iterator](): IteratorObject<unknown, unknown, unknown> },
-    K = T extends { [Symbol.iterator](): IteratorObject<infer R, unknown, unknown> } ? R : never,
->(props: { value: T; slot: (item: K) => void }): void;
-
-/** Will be translated to value.forEach(slot) */
-export declare function ForEach<T>(props: {
-    value: ReadonlyArray<T>;
-    slot: (item: T, index: number, value: T[]) => void;
-}): void;
-export declare function ForEach<T>(props: {
-    value: ReadonlySet<T>;
-    slot: (item: T, key: T, set: ReadonlySet<T>) => void;
-}): void;
-export declare function ForEach<K, T>(props: {
-    value: ReadonlyMap<K, T>;
-    slot: (item: T, key: K, map: ReadonlyMap<K, T>) => void;
-}): void;
-
-/** Renders content in a non-blocking way via queue */
-export declare function QueuedRender(props: {
-    priority?: "high" | "low";
-    callback?(): void;
-    "vasille:slot": VasilleSlot;
-}): void;
-
-/** Refresh the content each time, when the reactive model is updated */
-export declare function Watch<T>(props: { r_model: T; slot?: (value: T) => void; "vasille:slot"?: VasilleSlot }): void;
-/** @deprecated use `Watch` with `r_model` instead */
-export declare function Watch<T>(props: { $model: T; slot?: (value: T) => void; "vasille:slot"?: VasilleSlot }): void;
-
-/** Render content after a while */
-export declare function Delay(props: { time?: number; slot?: () => void; "vasille:slot"?: VasilleSlot }): void;
-
-/** Keep DOM alive for `r_time` ms after destruction, use `trigger` to run some code when timer starts */
-export declare function Zombie(props: { trigger?: () => void; r_time: number; "vasille:slot"?: VasilleSlot }): void;
-
-type ReadonlyState<T> =
-    T extends Map<infer K, infer V>
-        ? ReadonlyMap<K, V>
-        : T extends Set<infer V>
-          ? ReadonlySet<V>
-          : T extends Array<infer V>
-            ? ReadonlyArray<V>
-            : T extends object
-              ? { readonly [K in keyof T]: T[K] }
-              : T;
-
-/** Stores a singleton state to memory */
-export declare function store<Return extends object>(fn: () => Return): ReadonlyState<Return>;
-
-/** Represent an data model constructor */
-export declare class Model<In, Out> {}
-
-/** Creates a model (state) constructor */
-export declare function model<Input extends object, Return extends object>(
-    fn: (input: Input) => Return,
-): Model<Input, Return>;
-
-/** Creates a model (state) instance */
-export declare function createModel<Input extends object, Return extends object>(
-    model: Model<Input, Return>,
-    data: Input,
-): Return;
-
-/** Applies the value to the theme `name` */
-export declare function theme<T>(name: string, value: T): T;
-/** Applies the value to the dark theme */
-export declare function dark<T>(value: T): T;
-/** Applies the value to the light theme */
-export declare function light<T>(value: T): T;
-/** Applies the value to mobile devices */
-export declare function mobile<T>(value: T): T;
-/** Applies the value to tablet devices */
-export declare function tablet<T>(value: T): T;
-/** Applies the value to laptop devices */
-export declare function laptop<T>(value: T): T;
-/** Applies the value when the user prefers the dark theme */
-export declare function prefersDark<T>(value: T): T;
-/** Applies the value when the user prefers the light theme */
-export declare function prefersLight<T>(value: T): T;
-/** `dark` + `prefersDark` */
-export declare function allDark<T>(value: T): T;
-/** `light` + `prefersLight` */
-export declare function allLight<T>(value: T): T;
-
-export { setMobileMaxWidth, setTabletMaxWidth, setLaptopMaxWidth } from "vasille-web";
-
-/** Creates a local style sheet */
-export declare const styleSheet: <
-    T extends {
-        [className: string]: {
-            [media: `@${string}`]: {
-                [state: `:${string}`]: StyleSheetProps;
-            } & StyleSheetProps;
-            [state: `:${string}`]: StyleSheetProps;
-        } & StyleSheetProps;
-    },
->(
-    input: T,
-) => { [K in keyof T]: CssStyleInjector };
-
-/** Mounts a Vasille.JS component to a page */
-export declare function mount<T>(
-    element: Element,
-    component: (props: T) => void,
-    props: T,
-): AppNode<Node, Element, WebTagOptions>;
-
-interface RouterInitialization<Routes extends string> {
-    routes: {
-        [K in Routes]: {
-            screen: Screen<K>;
-            minAccessLevel?: number;
-        };
-    };
-    getAccessLevel?(): Promise<number>;
-    fallbackScreen?(arg: { cause: "not-found" | "no-access" }): void;
-    errorScreen?(data: { error: unknown }): void;
-    loadingScreen?(props: object): void;
-    loadingOverlay?(props: object): void;
-}
-
-/**
- * Starts a route app
- * @deprecated user `src/pages` folder instead
- * */
-export declare function routerApp<Routes extends string>(
-    init: RouterInitialization<Routes>,
-    element?: Element,
-): AppNode<Node, Element, WebTagOptions>;
-
-/** Run a function before the component mount */
-export declare function beforeMount(fn: () => void): void;
-export declare function beforeMount(fn: () => Promise<void>): void;
-
-/** Run a function after the component mount */
-export declare function afterMount(fn: () => void): void;
-export declare function afterMount(fn: () => Promise<void>): void;
-
-/** Run a function before the component destruction */
-export declare function beforeDestroy(fn: () => void): void;
-
-/** Returns the current used router */
-export declare function router(): WebRouter<string> | undefined;
-
-/** Composes a modal window (v4+) */
-export declare function modal<T extends object>(modal: (input: T) => void): (input: T) => void;
-
-/** Describes properties of a prompt window */
-export interface PromptProps<T> {
-    resolve(data: T): void;
-    reject(err: unknown): void;
-}
-
-/** Represent an prompt constructor */
-export declare class Prompt<T, Input> {}
-
-/** Creates a prompt constructor */
-export declare function prompt<T, Input extends PromptProps<T> = PromptProps<T>>(
-    modal: (input: Input) => void,
-): Prompt<T, Input>;
-
-/** Shows a prompt on screen */
-export declare function showPrompt<T, Input extends PromptProps<T>>(
-    prompt: Prompt<T, Input>,
-    data: Omit<Input, keyof PromptProps<unknown>>,
-): Promise<T>;
-
-/** Describes an injectable context value */
-export declare class SteelContext<Args extends unknown[], Value> {
-    private fn: (...args: Args) => Value;
-}
-
-/** Create an injectable context */
-export declare function context<Value, Args extends unknown[] = never[]>(
-    fn: (...args: Args) => Value,
-): SteelContext<Args, Value>;
-
-/** Share a context to children components */
-export declare function share<Args extends unknown[], Value>(ctx: SteelContext<Args, Value>, ...args: Args): Value;
-
-/** Share a dependency */
-export declare function share<Class>(className: abstract new (...args: unknown[]) => Class, value: Class): Class;
-
-/** Share a setting */
-export declare function share(key: string, value: string): string;
-
-/** Receive a shared context */
-export declare function receive<Args extends unknown[], Value>(ctx: SteelContext<Args, Value>): Value;
-
-/** Receive a dependency */
-export declare function receive<Class>(className: abstract new (...args: unknown[]) => Class): Class;
-
-/** Receive a setting */
-export declare function receive(key: string): string;
-
-/** Receive an optional shared context */
-export declare function receiveOptional<Args extends unknown[], Value>(
-    ctx: SteelContext<Args, Value>,
-): Value | undefined;
-
-/** Receive an optional dependency */
-export declare function receiveOptional<Class>(
-    className: abstract new (...args: unknown[]) => Class,
-): Class | undefined;
-
-/** Receive an optional setting */
-export declare function receiveOptional(key: string): string | undefined;
-
-/** Create and share a context when it is missing */
-export declare function impute<Args extends unknown[], Value>(ctx: SteelContext<Args, Value>, ...args: Args): Value;
-
-/** Ensure a dependency presence in context */
-export declare function impute<Class>(className: abstract new (...args: unknown[]) => Class, value: () => Class): Class;
-
-/** Share a setting value when it is missing */
-export declare function impute(key: string, value: string): string;
-
-export type {
-    WebComponent,
-    WebComponentAdapter,
-    WebComponentAttributes,
-    WebComponentEventHandler,
-    WebComponentProps,
-    WebComponentEvents,
-    WebTagOptions,
-    AttrType,
-    StyleType,
-    WebRouter,
-    ElementStyleProps,
-    IdeSide,
-    AppSide,
-    SsgRouterMode,
-    NavigationMode,
-    ClassItem,
-    WebRouterInitialization,
-} from "vasille-web/types";

package/src/export/jsx-runtime.ts

@@ -1 +0,0 @@
-export { type JSX } from "vasille-web/jsx-runtime";

package/test/bridge/array-item-set.js

@@ -1,3 +0,0 @@
-const arr = [1, 2, 3];
-const index = 1;
-arr[index] = 3;

package/test/bridge/array-item-set.ts

@@ -1,4 +0,0 @@
-const arr = [1, 2, 3];
-const index = 1;
-
-arr[index] = 3;

package/test/bridge/bind.js

@@ -1,8 +0,0 @@
-import { compose, ref, bind } from "vasille-web";
-const C = compose(Vasille => {
-  const $a = ref(1, Vasille);
-  const $b = ref(2, Vasille);
-  const $c = bind(Vasille, (Vasille_0, Vasille_1) => Vasille_0 + Vasille_1, [$a, $b]);
-  const $d = $c;
-  const $e = ref(3, Vasille);
-});

package/test/bridge/bind.ts

@@ -1,9 +0,0 @@
-import { compose, ref, bind } from "steel-frame";
-
-const C = compose(() => {
-  let $a = ref(1);
-  let $b = ref(2);
-  const $c = bind($a + $b);
-  const $d = bind($c);
-  const $e = bind(3);
-});

package/test/bridge/bridge.test.ts

@@ -1,74 +0,0 @@
-import { runTest, throwTest } from "../run-test.js";
-import { fileURLToPath } from "url";
-import { dirname } from "path";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-
-it("router test", function () {
-    runTest(__dirname, "router");
-});
-
-it("bridge/router global import", function () {
-    runTest(__dirname, "global-import");
-});
-
-it("bind test", function () {
-    runTest(__dirname, "bind");
-});
-
-it("module level reactivity test", function () {
-    runTest(__dirname, "module-level-reactivity");
-});
-
-it("object property key-value match test", function () {
-    runTest(__dirname, "object-property-match");
-});
-
-it("array item set test", function () {
-    runTest(__dirname, "array-item-set");
-});
-
-it("router outside of compose error", function () {
-    throwTest(__dirname, "router", 'Usage of hint "router" is restricted here');
-});
-
-it("router in store error 1", function () {
-    throwTest(__dirname, "router-in-store-1", "The router is not available in stores");
-});
-
-it("router in store error 2", function () {
-    throwTest(__dirname, "router-in-store-2", "The router is not available in stores");
-});
-
-it("router in store error 3", function () {
-    throwTest(__dirname, "router-in-store-3", "The router is not available in stores");
-});
-
-it("bind in object error", function () {
-    throwTest(__dirname, "bind-in-object", 'Usage of hint "bind" is restricted here');
-});
-
-it("field renaming error", function () {
-    throwTest(__dirname, "field-renaming", 'Property "$a" can not be renamed to "a": rename it to "$a"');
-});
-
-it("field renaming error 2", function () {
-    throwTest(__dirname, "field-renaming-2", 'Property "a" can not be renamed to "$a": rename it to "a"');
-});
-
-it("property is not reactive error", function () {
-    throwTest(__dirname, "prop-not-reactive", "Reactivity mismatch between field name and value");
-});
-
-it("raw without args error", function () {
-    throwTest(__dirname, "raw-no-args", "Failed to unwrap value");
-});
-
-it("beforeMount arg error", function () {
-    throwTest(__dirname, "before-mount-arg", "Incorrect hint argument");
-});
-
-it("non reactive module var name check error", function () {
-    throwTest(__dirname, "non-reactive-module-var", "Unexpected reactivity mark in variable name");
-});

package/test/bridge/err-before-mount-arg.ts

@@ -1,6 +0,0 @@
-import { beforeMount, compose } from "steel-frame";
-
-const C = compose(() => {
-  // @ts-expect-error
-  beforeMount();
-});

package/test/bridge/err-bind-in-object.ts

@@ -1,10 +0,0 @@
-import { bind, compose } from "steel-frame";
-
-const C = compose(() => {
-  let $a = 1,
-    $b = 2;
-
-  const o = {
-    $sum: bind($a + $b),
-  };
-});

package/test/bridge/err-field-renaming-2.ts

@@ -1,5 +0,0 @@
-const o6 = {
-  a: 1,
-};
-
-const { a: $a } = o6;

package/test/bridge/err-field-renaming.ts

@@ -1,7 +0,0 @@
-import { ref } from "steel-frame";
-
-const o = {
-  $a: ref(1),
-};
-
-const { $a: a } = o;

package/test/bridge/err-non-reactive-module-var.ts

@@ -1 +0,0 @@
-let $state = "test";

package/test/bridge/err-prop-not-reactive.ts

@@ -1,3 +0,0 @@
-const o7 = {
-  $a: 1,
-};

package/test/bridge/err-raw-no-args.ts

@@ -1,4 +0,0 @@
-import { raw } from "steel-frame";
-
-// @ts-expect-error
-const a = raw();

package/test/bridge/err-router-in-store-1.ts

@@ -1,7 +0,0 @@
-import { beforeMount, router, store } from "steel-frame";
-
-const sStore = store(() => {
-  beforeMount(() => router());
-
-  return {};
-});

package/test/bridge/err-router-in-store-2.ts

@@ -1,9 +0,0 @@
-import { router, store } from "steel-frame";
-
-const sStore = store(() => {
-  function goNext() {
-    router()?.goTo("/x");
-  }
-
-  return {};
-});

package/test/bridge/err-router-in-store-3.ts

@@ -1,12 +0,0 @@
-import { calculate, router, store } from "steel-frame";
-
-const sStore = store(() => {
-  let $a = 2;
-  const b = calculate(() => {
-    router()?.goTo("/1");
-
-    return $a + 1;
-  });
-
-  return {};
-});

package/test/bridge/err-router.ts

@@ -1,5 +0,0 @@
-import { router } from "steel-frame";
-
-function x() {
-  router()?.goTo("/x");
-}