@rectify-dev/core 2.1.0 → 2.4.0

package/dist/index.d.cts

@@ -1,5 +1,6 @@
-import { RectifyNode, FC, Fiber } from '@rectify-dev/shared';
-export { AnchorHTMLAttributes, AriaAttributes, AudioHTMLAttributes, ButtonHTMLAttributes, CSSProperties, FC, FormHTMLAttributes, HTMLAttributes, IframeHTMLAttributes, ImgHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, MetaHTMLAttributes, OptGroupHTMLAttributes, OptionHTMLAttributes, RectifyEventHandlers, RectifyIntrinsicElements, RectifyNode, ScriptHTMLAttributes, SelectHTMLAttributes, SyntheticAnimationEvent, SyntheticChangeEvent, SyntheticClipboardEvent, SyntheticDragEvent, SyntheticEvent as SyntheticEventType, SyntheticFocusEvent, SyntheticInputEvent, SyntheticKeyboardEvent, SyntheticMouseEvent, SyntheticPointerEvent, SyntheticSubmitEvent, SyntheticTouchEvent, SyntheticTransitionEvent, SyntheticWheelEvent, TextareaHTMLAttributes, VideoHTMLAttributes } from '@rectify-dev/shared';
+import * as _rectify_dev_shared from '@rectify-dev/shared';
+import { RectifyNode, RectifyKey, RectifyPortal, FC, LazyComponent, SuspenseProps, Fiber } from '@rectify-dev/shared';
+export { AnchorHTMLAttributes, AriaAttributes, AudioHTMLAttributes, ButtonHTMLAttributes, CSSProperties, FC, FormHTMLAttributes, HTMLAttributes, IframeHTMLAttributes, ImgHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, MetaHTMLAttributes, OptGroupHTMLAttributes, OptionHTMLAttributes, RectifyEventHandlers, RectifyIntrinsicElements, RectifyNode, RectifyPortal, ScriptHTMLAttributes, SelectHTMLAttributes, SuspenseProps, SyntheticAnimationEvent, SyntheticChangeEvent, SyntheticClipboardEvent, SyntheticDragEvent, SyntheticEvent as SyntheticEventType, SyntheticFocusEvent, SyntheticInputEvent, SyntheticKeyboardEvent, SyntheticMouseEvent, SyntheticPointerEvent, SyntheticSubmitEvent, SyntheticTouchEvent, SyntheticTransitionEvent, SyntheticWheelEvent, TextareaHTMLAttributes, VideoHTMLAttributes } from '@rectify-dev/shared';
 export { Fragment, jsx } from './runtime.cjs';
 
 type RectifyDomRoot = {
@@ -8,6 +9,8 @@ type RectifyDomRoot = {
 };
 declare const createRoot: (container: Element) => RectifyDomRoot;
 
+declare const createPortal: (children: RectifyNode, container: Element, key?: RectifyKey) => RectifyPortal;
+
 type AnyNativeEvent = Event | KeyboardEvent | MouseEvent | TouchEvent;
 
 declare class SyntheticEvent {
@@ -44,6 +47,109 @@ type MemoComponent<P = any> = FC<P> & {
  */
 declare function memo<P = any>(Component: FC<P>, compare?: (prevProps: P, nextProps: P) => boolean): MemoComponent<P>;
 
+/**
+ * Lazily loads a component via a dynamic import factory.
+ *
+ * The returned object is used as a JSX element type and behaves like a normal
+ * function component once loaded. While loading it suspends the nearest
+ * `<Suspense>` boundary, which renders its `fallback` instead.
+ *
+ * @example
+ * const HeavyChart = lazy(() => import("./HeavyChart"));
+ *
+ * function App() {
+ *   return (
+ *     <Suspense fallback={<Spinner />}>
+ *       <HeavyChart />
+ *     </Suspense>
+ *   );
+ * }
+ */
+declare const lazy: <T>(factory: () => Promise<{
+    default: T;
+} | T>) => LazyComponent<T>;
+
+/**
+ * Catches thrown promises from any child (including lazy components) and
+ * renders `fallback` until they resolve.
+ *
+ * Marked as a sentinel with `_isSuspense` so the reconciler can identify it
+ * without a dedicated $$typeof symbol — consistent with how MemoComponent
+ * and ContextProvider are detected.
+ *
+ * @example
+ * <Suspense fallback={<Spinner />}>
+ *   <LazyPage />
+ * </Suspense>
+ */
+declare const Suspense: (_props: SuspenseProps) => null;
+
+/**
+ * Base class for Rectify class components.
+ *
+ * @example
+ * class Counter extends Component<{}, { count: number }> {
+ *   state = { count: 0 };
+ *
+ *   render() {
+ *     return (
+ *       <button onClick={() => this.setState({ count: this.state.count + 1 })}>
+ *         {this.state.count}
+ *       </button>
+ *     );
+ *   }
+ * }
+ */
+declare class Component<P = {}, S = {}> {
+    /** Marks this as a class component for the reconciler. */
+    static readonly _isClassComponent = true;
+    props: P;
+    state: S;
+    /**
+     * @internal Set by the reconciler when the instance is created so
+     * `setState` can enqueue a re-render on the correct fiber.
+     */
+    _fiber: _rectify_dev_shared.Fiber | null;
+    /**
+     * @internal Snapshots taken by the reconciler in beginWork before each
+     * update render so that `componentDidUpdate` receives the correct prev values.
+     * Cleared after `componentDidUpdate` is called.
+     */
+    _prevProps: P | undefined;
+    _prevState: S | undefined;
+    /**
+     * @internal Queue of pending setState updates, flushed by the reconciler
+     * during beginWork so that prevState snapshots can be taken first.
+     */
+    _pendingStateQueue: Array<Partial<S> | ((prevState: S, prevProps: P) => Partial<S>)>;
+    constructor(props: P);
+    /** Called once, immediately after the component is inserted into the DOM. */
+    componentDidMount?(): void;
+    /**
+     * Called after every re-render.
+     * @param prevProps — props before the update
+     * @param prevState — state before the update
+     */
+    componentDidUpdate?(prevProps: P, prevState: S): void;
+    /** Called immediately before the component is removed from the DOM. */
+    componentWillUnmount?(): void;
+    /**
+     * Return false to skip re-rendering when props or state haven't changed.
+     * Defaults to always re-render.
+     */
+    shouldComponentUpdate?(nextProps: P, nextState: S): boolean;
+    /**
+     * Merges `partialState` into the current state and schedules a re-render.
+     * Accepts either a plain partial state object or an updater function.
+     */
+    setState(partialState: Partial<S> | ((prevState: S, prevProps: P) => Partial<S>)): void;
+    /**
+     * Must be implemented by every class component.
+     * Returns the subtree to render.
+     */
+    render(): RectifyNode;
+}
+
 type StateUpdater<S> = S | ((prevState: S) => S);
 type StateDispatcher<S> = (updater: StateUpdater<S>) => void;
 
@@ -162,4 +268,22 @@ declare function createContext<T>(defaultValue: T): RectifyContext<T>;
  */
 declare function useContext<T>(context: RectifyContext<T>): T;
 
-export { type Dispatch, type MemoComponent, type RectifyContext, type Reducer, type RefObject, SyntheticEvent, createContext, createRoot, memo, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState };
+/**
+ * Returns a stable, globally unique ID string that is consistent across
+ * server and client renders within the same component instance.
+ *
+ * The ID is generated once on mount and returned unchanged on every
+ * subsequent render — it never changes for the lifetime of the component.
+ *
+ * @example
+ * const inputId = useId();
+ * return (
+ *   <>
+ *     <label htmlFor={inputId}>Name</label>
+ *     <input id={inputId} />
+ *   </>
+ * );
+ */
+declare const useId: () => string;
+
+export { Component, type Dispatch, type MemoComponent, type RectifyContext, type Reducer, type RefObject, Suspense, SyntheticEvent, createContext, createPortal, createRoot, lazy, memo, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useReducer, useRef, useState };

package/dist/index.d.ts

@@ -1,5 +1,6 @@
-import { RectifyNode, FC, Fiber } from '@rectify-dev/shared';
-export { AnchorHTMLAttributes, AriaAttributes, AudioHTMLAttributes, ButtonHTMLAttributes, CSSProperties, FC, FormHTMLAttributes, HTMLAttributes, IframeHTMLAttributes, ImgHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, MetaHTMLAttributes, OptGroupHTMLAttributes, OptionHTMLAttributes, RectifyEventHandlers, RectifyIntrinsicElements, RectifyNode, ScriptHTMLAttributes, SelectHTMLAttributes, SyntheticAnimationEvent, SyntheticChangeEvent, SyntheticClipboardEvent, SyntheticDragEvent, SyntheticEvent as SyntheticEventType, SyntheticFocusEvent, SyntheticInputEvent, SyntheticKeyboardEvent, SyntheticMouseEvent, SyntheticPointerEvent, SyntheticSubmitEvent, SyntheticTouchEvent, SyntheticTransitionEvent, SyntheticWheelEvent, TextareaHTMLAttributes, VideoHTMLAttributes } from '@rectify-dev/shared';
+import * as _rectify_dev_shared from '@rectify-dev/shared';
+import { RectifyNode, RectifyKey, RectifyPortal, FC, LazyComponent, SuspenseProps, Fiber } from '@rectify-dev/shared';
+export { AnchorHTMLAttributes, AriaAttributes, AudioHTMLAttributes, ButtonHTMLAttributes, CSSProperties, FC, FormHTMLAttributes, HTMLAttributes, IframeHTMLAttributes, ImgHTMLAttributes, InputHTMLAttributes, LabelHTMLAttributes, MetaHTMLAttributes, OptGroupHTMLAttributes, OptionHTMLAttributes, RectifyEventHandlers, RectifyIntrinsicElements, RectifyNode, RectifyPortal, ScriptHTMLAttributes, SelectHTMLAttributes, SuspenseProps, SyntheticAnimationEvent, SyntheticChangeEvent, SyntheticClipboardEvent, SyntheticDragEvent, SyntheticEvent as SyntheticEventType, SyntheticFocusEvent, SyntheticInputEvent, SyntheticKeyboardEvent, SyntheticMouseEvent, SyntheticPointerEvent, SyntheticSubmitEvent, SyntheticTouchEvent, SyntheticTransitionEvent, SyntheticWheelEvent, TextareaHTMLAttributes, VideoHTMLAttributes } from '@rectify-dev/shared';
 export { Fragment, jsx } from './runtime.js';
 
 type RectifyDomRoot = {
@@ -8,6 +9,8 @@ type RectifyDomRoot = {
 };
 declare const createRoot: (container: Element) => RectifyDomRoot;
 
+declare const createPortal: (children: RectifyNode, container: Element, key?: RectifyKey) => RectifyPortal;
+
 type AnyNativeEvent = Event | KeyboardEvent | MouseEvent | TouchEvent;
 
 declare class SyntheticEvent {
@@ -44,6 +47,109 @@ type MemoComponent<P = any> = FC<P> & {
  */
 declare function memo<P = any>(Component: FC<P>, compare?: (prevProps: P, nextProps: P) => boolean): MemoComponent<P>;
 
+/**
+ * Lazily loads a component via a dynamic import factory.
+ *
+ * The returned object is used as a JSX element type and behaves like a normal
+ * function component once loaded. While loading it suspends the nearest
+ * `<Suspense>` boundary, which renders its `fallback` instead.
+ *
+ * @example
+ * const HeavyChart = lazy(() => import("./HeavyChart"));
+ *
+ * function App() {
+ *   return (
+ *     <Suspense fallback={<Spinner />}>
+ *       <HeavyChart />
+ *     </Suspense>
+ *   );
+ * }
+ */
+declare const lazy: <T>(factory: () => Promise<{
+    default: T;
+} | T>) => LazyComponent<T>;
+
+/**
+ * Catches thrown promises from any child (including lazy components) and
+ * renders `fallback` until they resolve.
+ *
+ * Marked as a sentinel with `_isSuspense` so the reconciler can identify it
+ * without a dedicated $$typeof symbol — consistent with how MemoComponent
+ * and ContextProvider are detected.
+ *
+ * @example
+ * <Suspense fallback={<Spinner />}>
+ *   <LazyPage />
+ * </Suspense>
+ */
+declare const Suspense: (_props: SuspenseProps) => null;
+
+/**
+ * Base class for Rectify class components.
+ *
+ * @example
+ * class Counter extends Component<{}, { count: number }> {
+ *   state = { count: 0 };
+ *
+ *   render() {
+ *     return (
+ *       <button onClick={() => this.setState({ count: this.state.count + 1 })}>
+ *         {this.state.count}
+ *       </button>
+ *     );
+ *   }
+ * }
+ */
+declare class Component<P = {}, S = {}> {
+    /** Marks this as a class component for the reconciler. */
+    static readonly _isClassComponent = true;
+    props: P;
+    state: S;
+    /**
+     * @internal Set by the reconciler when the instance is created so
+     * `setState` can enqueue a re-render on the correct fiber.
+     */
+    _fiber: _rectify_dev_shared.Fiber | null;
+    /**
+     * @internal Snapshots taken by the reconciler in beginWork before each
+     * update render so that `componentDidUpdate` receives the correct prev values.
+     * Cleared after `componentDidUpdate` is called.
+     */
+    _prevProps: P | undefined;
+    _prevState: S | undefined;
+    /**
+     * @internal Queue of pending setState updates, flushed by the reconciler
+     * during beginWork so that prevState snapshots can be taken first.
+     */
+    _pendingStateQueue: Array<Partial<S> | ((prevState: S, prevProps: P) => Partial<S>)>;
+    constructor(props: P);
+    /** Called once, immediately after the component is inserted into the DOM. */
+    componentDidMount?(): void;
+    /**
+     * Called after every re-render.
+     * @param prevProps — props before the update
+     * @param prevState — state before the update
+     */
+    componentDidUpdate?(prevProps: P, prevState: S): void;
+    /** Called immediately before the component is removed from the DOM. */
+    componentWillUnmount?(): void;
+    /**
+     * Return false to skip re-rendering when props or state haven't changed.
+     * Defaults to always re-render.
+     */
+    shouldComponentUpdate?(nextProps: P, nextState: S): boolean;
+    /**
+     * Merges `partialState` into the current state and schedules a re-render.
+     * Accepts either a plain partial state object or an updater function.
+     */
+    setState(partialState: Partial<S> | ((prevState: S, prevProps: P) => Partial<S>)): void;
+    /**
+     * Must be implemented by every class component.
+     * Returns the subtree to render.
+     */
+    render(): RectifyNode;
+}
+
 type StateUpdater<S> = S | ((prevState: S) => S);
 type StateDispatcher<S> = (updater: StateUpdater<S>) => void;
 
@@ -162,4 +268,22 @@ declare function createContext<T>(defaultValue: T): RectifyContext<T>;
  */
 declare function useContext<T>(context: RectifyContext<T>): T;
 
-export { type Dispatch, type MemoComponent, type RectifyContext, type Reducer, type RefObject, SyntheticEvent, createContext, createRoot, memo, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState };
+/**
+ * Returns a stable, globally unique ID string that is consistent across
+ * server and client renders within the same component instance.
+ *
+ * The ID is generated once on mount and returned unchanged on every
+ * subsequent render — it never changes for the lifetime of the component.
+ *
+ * @example
+ * const inputId = useId();
+ * return (
+ *   <>
+ *     <label htmlFor={inputId}>Name</label>
+ *     <input id={inputId} />
+ *   </>
+ * );
+ */
+declare const useId: () => string;
+
+export { Component, type Dispatch, type MemoComponent, type RectifyContext, type Reducer, type RefObject, Suspense, SyntheticEvent, createContext, createPortal, createRoot, lazy, memo, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useReducer, useRef, useState };