reblendjs/types/internal/hooks.d.ts

ReblendJs uses Reactjs pradigm to build UI components, with isolated state for each components.

import { BaseComponent } from './BaseComponent';
import * as ReblendTyping from 'reblend-typing';
declare const contextValue: unique symbol;
declare const contextInnerValue: unique symbol;
declare const contextValueInitial: unique symbol;
declare const contextSubscribers: unique symbol;
declare const contextSubscribe: unique symbol;
declare const contextSubscriberModificationTracker: unique symbol;
/**
 * Enum representing different cache storage types.
 */
export declare enum CacheType {
    MEMORY = 0,
    SESSION = 1,
    LOCAL = 2
}
/**
 * Options for configuring caching behavior for a context.
 *
 * @typedef {object} CacheOption
 * @property {CacheType} type - The type of cache storage (e.g., MEMORY, SESSION, LOCAL).
 * @property {string} key - The key used to store/retrieve the cached data.
 */
type CacheOption = {
    type: CacheType;
    key: string;
};
type ContextSubriber = {
    component: BaseComponent;
    stateKey: string;
};
/**
 * Represents a context object in Reblend, tracking state and subscribers.
 *
 * @template T - The type of the context value.
 * @typedef {object} Context<T>
 * @property {Set<ContextSubriber>} [contextSubscribers] - Array of components subscribed to this context and their state keys.
 * @property {T} [contextValue] - The current value of the context.
 * @property {T} [contextValueInitial] - The initial value of the context.
 * @property {T} [contextInnerValue] - The actual stored value, potentially synced with cache.
 * @property {number[]} [contextSubscriberModificationTracker] - Tracker for subscriber modifications.
 * @property {Function} reset - Resets the context value to the initial value.
 * @property {Function} getValue - Retrieves the current context value.
 * @property {Function} isEqual - Checks if a given value is equal to the current context value.
 * @property {Function} update - Updates the context value and notifies subscribers.
 * @property {Function} [contextSubscribe] - Subscribes a component to this context with a given state key.
 */
export type Context<T> = {
    [contextSubscribers]: Set<ContextSubriber>;
    [contextValue]: T;
    [contextValueInitial]: T;
    [contextInnerValue]: T;
    [contextSubscriberModificationTracker]: number[];
    reset: () => void;
    getValue: () => T;
    isEqual: (value: T) => boolean;
    update(updateValue: ReblendTyping.StateFunctionValue<T>, force?: boolean): Promise<boolean>;
    [contextSubscribe](subscriber: ContextSubriber): void;
};
/**
 * Hook to manage state within a Reblend component.
 *
 * @template T - The type of the state value.
 * @param {T} initial - The initial state value.
 * @returns {[T, ReblendTyping.StateFunction<T>]} - Returns the current state and a function to update it.
 * @Note The function signature is not same as Reblend.useState because this is meant to be used in functional component which will be transpiled.
 */
export declare function useState<T>(initial: T): [T, ReblendTyping.StateFunction<T>];
/**
 * Hook to perform side effects within a Reblend component.
 *
 * @param {ReblendTyping.StateEffectiveFunction} fn - The effect function to run.
 * @param {any} [dependencies] - Optional dependency or array of dependencies to control when the effect runs.
 * @Note The function signature is not same as Reblend.useEffect because this is meant to be used in functional component which will be transpiled.
 */
export declare function useEffect<T>(fn: ReblendTyping.StateEffectiveFunction<T>, dependencies?: T): void;
/**
 * Hook to perform side effects within a Reblend component after children populate or after state change.
 *
 * @param {ReblendTyping.StateEffectiveFunction} fn - The effect function to run.
 * @param {any} [dependencies] - Optional dependency or array of dependencies to control when the effect runs.
 * @Note The function signature is not same as Reblend.useEffectAfter because this is meant to be used in functional component which will be transpiled.
 */
export declare function useEffectAfter<T>(fn: ReblendTyping.StateEffectiveFunction<T>, dependencies?: T): void;
/**
 * Effect hook for performing side effects or have access to previous and current props useful within custom hooks.
 *
 * @param {ReblendTyping.StateEffectiveFunction} fn - The effect function to run.
 * @Note The function signature is not same as Reblend.useProps because this is meant to be used in functional component which will be transpiled.
 */
export declare function useProps<T>(fn: ReblendTyping.StateEffectiveFunction<T>): void;
/**
 * Hook to manage reducer-based state within a Reblend component.
 *
 * @template T - The type of the state value.
 * @template I - The type of the action passed to the reducer.
 * @param {ReblendTyping.StateReducerFunction<T, I>} reducer - The reducer function to apply actions to state.
 * @param {T} initial - The initial state value.
 * @returns {[T, ReblendTyping.StateFunction<T>]} - Returns the current state and a function to dispatch actions.
 * @Note The function signature is not same as Reblend.useReducer because this is meant to be used in functional component which will be transpiled.
 */
export declare function useReducer<T, I>(reducer: ReblendTyping.StateReducerFunction<T, I>, initial: T): [T, ReblendTyping.StateFunction<T>];
/**
 * Hook to create memoized values within a Reblend component.
 *
 * @template T - The type of the memoized value.
 * @param {ReblendTyping.StateEffectiveMemoFunction<T>} fn - The function to compute the memoized value.
 * @param {any} [dependencies] - Optional dependency or array of dependencies to control memoization.
 * @returns {T} - The memoized value.
 * @Note The function signature is not same as Reblend.useMemo because this is meant to be used in functional component which will be transpiled.
 */
export declare function useMemo<T, E>(fn: ReblendTyping.StateEffectiveMemoFunction<T, E>, dependencies?: E): T;
/**
 * Hook to create a mutable reference object within a Reblend component.
 *
 * @template T - The type of the ref value.
 * @param {T} [initial] - The initial ref value.
 * @returns {ReblendTyping.Ref<T>} - Returns a reference object with the current value.
 */
export declare function useRef<T>(initial?: T): ReblendTyping.Ref<T>;
/**
 * Bind callback function to the current component.
 *
 * @param {Function} fn - The callback function to be bound to this
 * @returns {Function} - The bounded callback function.
 * @Note This function is just here for compatibility with Reactjs it same as regular function define inside function component
 */
export declare function useCallback<T extends (...args: any[]) => any>(fn: T): T;
/**
 * Hook to subscribe to a context and get its current value.
 *
 * @template T - The type of the context value.
 * @param {Context<T>} context - The context to subscribe to.
 * @param {string} stateKey - State key.
 * @returns {[T, ReblendTyping.StateFunction<T>]} - Returns the current context value and a function to update it.
 * @throws Will throw an error if the context is invalid
 * @Note State key is optional because this function is assume to be called in a functional component which is meant to be transpile
 */
export declare function useContext<T>(context: Context<T>, stateKey?: string): [T, ReblendTyping.StateFunction<T>];
/**
 * Function to create a new context with an initial value.
 * Optionally, you can specify cache options for storing the context value in session or local storage.
 *
 * @template T - The type of the context value.
 * @param {T} initial - The initial value of the context.
 * @param {CacheOption} [cacheOption] - Optional caching options.
 * @returns {Context<T>} - The created context object.
 */
export declare function createContext<T>(initial: T, cacheOption?: CacheOption): Context<T>;
export {};