what-react 0.6.2 → 0.6.5

package/README.md

@@ -1,13 +1,13 @@
 # what-react
 
-React compatibility layer for [What Framework](https://whatfw.com). Use React ecosystem libraries with What's signal-based engine under the hood -- zero code changes required.
+React compatibility layer for [What Framework](https://whatfw.com). Use many public-API React ecosystem libraries with What's signal-based engine under the hood; internals-heavy libraries still need verification.
 
-**90+ React libraries confirmed working**, including zustand, @tanstack/react-query, react-hook-form, framer-motion, @radix-ui, react-select, react-router, and many more.
+**88 React libraries confirmed working**, with 1 partial and 5 expected entries in the current matrix, including zustand, @tanstack/react-query, react-hook-form, framer-motion, @radix-ui, react-select, react-router, and many more.
 
 ## Install
 
 ```bash
-npm install what-react what-core
+npm install what-react@backport what-core@backport
 ```
 
 ## Setup
@@ -32,7 +32,7 @@ The plugin handles everything automatically:
 
 ## Usage
 
-Install any React library and use it normally. No code changes needed.
+Install a verified public-API React library and use it normally. Many work without app-code changes; libraries that depend on React internals should be tested against the matrix first.
 
 ```jsx
 // zustand -- just works

package/dom.d.ts

@@ -0,0 +1,30 @@
+import type { ReactNode } from './index.js';
+
+export interface Root {
+  render(element: ReactNode): void;
+  unmount(): void;
+}
+
+export function createRoot(container: Element | DocumentFragment): Root;
+export function hydrateRoot(container: Element | DocumentFragment, initialChildren: ReactNode): Root;
+export function render(element: ReactNode, container: Element | DocumentFragment, callback?: () => void): Root;
+export function unmountComponentAtNode(container: Element | DocumentFragment): boolean;
+export function createPortal(children: ReactNode, container: Element | DocumentFragment, key?: string | number | null): any;
+export function flushSync<T = void>(fn?: () => T): T | void;
+export function findDOMNode(component: any): Element | Text | null;
+export function unstable_batchedUpdates<T = void>(fn: () => T): T | void;
+export const version: string;
+
+declare const ReactDOM: {
+  createRoot: typeof createRoot;
+  hydrateRoot: typeof hydrateRoot;
+  render: typeof render;
+  unmountComponentAtNode: typeof unmountComponentAtNode;
+  createPortal: typeof createPortal;
+  flushSync: typeof flushSync;
+  findDOMNode: typeof findDOMNode;
+  unstable_batchedUpdates: typeof unstable_batchedUpdates;
+  version: typeof version;
+};
+
+export default ReactDOM;

package/index.d.ts

@@ -0,0 +1,127 @@
+import type { Component as WhatComponent, Context as WhatContext, VNode, VNodeChild } from 'what-core';
+
+export type ReactNode = any;
+export interface ReactElement<P = any, T = any> { type?: T; tag?: any; props: P; children?: ReactNode[]; key?: string | number | null; _vnode?: true; }
+export type FC<P = {}> = FunctionComponent<P>;
+export type FunctionComponent<P = {}> = (props: P & { children?: ReactNode }) => ReactNode;
+export type ComponentType<P = {}> = FunctionComponent<P> | ComponentClass<P>;
+export type ElementType<P = any> = string | ComponentType<P>;
+export type RefObject<T> = { current: T | null };
+export type MutableRefObject<T> = { current: T };
+export type RefCallback<T> = (instance: T | null) => void;
+export type Ref<T> = RefCallback<T> | RefObject<T> | null;
+export type ForwardedRef<T> = Ref<T>;
+export type DependencyList = readonly unknown[];
+export type Dispatch<A> = (value: A) => void;
+export type SetStateAction<S> = S | ((prevState: S) => S);
+export type Reducer<S, A> = (prevState: S, action: A) => S;
+export type ReducerState<R extends Reducer<any, any>> = R extends Reducer<infer S, any> ? S : never;
+export type ReducerAction<R extends Reducer<any, any>> = R extends Reducer<any, infer A> ? A : never;
+export type Context<T> = WhatContext<T>;
+
+export const Fragment: typeof import('what-core').Fragment;
+export const Suspense: typeof import('what-core').Suspense;
+export const memo: typeof import('what-core').memo;
+export const lazy: typeof import('what-core').lazy;
+
+export function createElement<P = any>(type: ElementType<P>, props?: (P & { children?: ReactNode; key?: string | number; ref?: any }) | null, ...children: ReactNode[]): ReactElement<P>;
+export function cloneElement<P = any>(element: ReactElement<P>, props?: Partial<P> | null, ...children: ReactNode[]): ReactElement<P>;
+export function createFactory<P = any>(type: ElementType<P>): ((props?: P | null, ...children: ReactNode[]) => ReactElement<P>) & { type: ElementType<P> };
+export function isValidElement(object: unknown): object is ReactElement;
+export function createRef<T = any>(): RefObject<T>;
+export function forwardRef<T, P = {}>(render: (props: P, ref: ForwardedRef<T>) => ReactNode): FunctionComponent<P & { ref?: Ref<T> }> & { displayName?: string };
+
+export const Children: {
+  map<T = ReactNode, R = any>(children: ReactNode, fn: (child: T, index: number) => R): R[];
+  forEach<T = ReactNode>(children: ReactNode, fn: (child: T, index: number) => void): void;
+  count(children: ReactNode): number;
+  toArray(children: ReactNode): ReactNode[];
+  only<T = ReactNode>(children: T): T;
+};
+
+export function useState<S>(initialState: S | (() => S)): [S, Dispatch<SetStateAction<S>>];
+export function useEffect(effect: () => void | (() => void), deps?: DependencyList): void;
+export function useMemo<T>(factory: () => T, deps?: DependencyList): T;
+export function useCallback<T extends (...args: any[]) => any>(callback: T, deps?: DependencyList): T;
+export function useRef<T>(initialValue: T): MutableRefObject<T>;
+export function useRef<T = undefined>(): MutableRefObject<T | undefined>;
+export function useContext<T>(context: Context<T>): T;
+export function useReducer<R extends Reducer<any, any>>(reducer: R, initialState: ReducerState<R>, init?: (initial: ReducerState<R>) => ReducerState<R>): [ReducerState<R>, Dispatch<ReducerAction<R>>];
+export function createContext<T>(defaultValue: T): Context<T>;
+export function useLayoutEffect(effect: () => void | (() => void), deps?: DependencyList): void;
+export function useInsertionEffect(effect: () => void | (() => void), deps?: DependencyList): void;
+export function useImperativeHandle<T, R extends T>(ref: Ref<T> | undefined, createHandle: () => R, deps?: DependencyList): void;
+export function useId(): string;
+export function useDebugValue<T>(value?: T, format?: (value: T) => any): void;
+export function useSyncExternalStore<T>(subscribe: (onStoreChange: () => void) => () => void, getSnapshot: () => T, getServerSnapshot?: () => T): T;
+export function useTransition(): [boolean, (callback: () => void) => void];
+export function useDeferredValue<T>(value: T): T;
+export function startTransition(callback: () => void): void;
+
+export function StrictMode(props: { children?: ReactNode }): ReactNode;
+
+export interface ComponentClass<P = {}, S = any> {
+  new (props: P): Component<P, S>;
+  displayName?: string;
+  defaultProps?: Partial<P>;
+  contextType?: Context<any>;
+  getDerivedStateFromProps?: (props: P, state: S) => Partial<S> | null;
+}
+
+export class Component<P = {}, S = {}> {
+  constructor(props: P);
+  props: P;
+  state: S;
+  context?: any;
+  setState(update: Partial<S> | ((state: S, props: P) => Partial<S>), callback?: () => void): void;
+  forceUpdate(callback?: () => void): void;
+  render(): ReactNode;
+  componentDidMount?(): void;
+  componentWillUnmount?(): void;
+  componentDidUpdate?(prevProps: P, prevState: S, snapshot?: any): void;
+  getSnapshotBeforeUpdate?(prevProps: P, prevState: S): any;
+  static displayName?: string;
+  static defaultProps?: Record<string, any>;
+  static contextType?: Context<any>;
+  static getDerivedStateFromProps?: (props: any, state: any) => any;
+}
+
+export class PureComponent<P = {}, S = {}> extends Component<P, S> {}
+
+export const __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: Record<string, any>;
+
+declare const React: {
+  createElement: typeof createElement;
+  cloneElement: typeof cloneElement;
+  createFactory: typeof createFactory;
+  isValidElement: typeof isValidElement;
+  createRef: typeof createRef;
+  forwardRef: typeof forwardRef;
+  Children: typeof Children;
+  Fragment: typeof Fragment;
+  Suspense: typeof Suspense;
+  StrictMode: typeof StrictMode;
+  Component: typeof Component;
+  PureComponent: typeof PureComponent;
+  memo: typeof memo;
+  lazy: typeof lazy;
+  useState: typeof useState;
+  useEffect: typeof useEffect;
+  useMemo: typeof useMemo;
+  useCallback: typeof useCallback;
+  useRef: typeof useRef;
+  useContext: typeof useContext;
+  useReducer: typeof useReducer;
+  createContext: typeof createContext;
+  useLayoutEffect: typeof useLayoutEffect;
+  useInsertionEffect: typeof useInsertionEffect;
+  useImperativeHandle: typeof useImperativeHandle;
+  useId: typeof useId;
+  useDebugValue: typeof useDebugValue;
+  useSyncExternalStore: typeof useSyncExternalStore;
+  useTransition: typeof useTransition;
+  useDeferredValue: typeof useDeferredValue;
+  startTransition: typeof startTransition;
+};
+
+export default React;

package/jsx-dev-runtime.d.ts

@@ -0,0 +1,2 @@
+export { jsx, jsxs, jsxDEV, Fragment } from './jsx-runtime.js';
+export type { JSX } from './jsx-runtime.js';

package/jsx-runtime.d.ts

@@ -0,0 +1,13 @@
+import type { ReactElement, ReactNode } from './index.js';
+export { Fragment } from './index.js';
+
+export function jsx(type: any, props: any, key?: string | number): ReactElement;
+export function jsxs(type: any, props: any, key?: string | number): ReactElement;
+export function jsxDEV(type: any, props: any, key?: string | number, isStaticChildren?: boolean, source?: any, self?: any): ReactElement;
+
+export namespace JSX {
+  type Element = ReactElement;
+  interface ElementChildrenAttribute { children: {}; }
+  interface IntrinsicElements { [elemName: string]: any; }
+  interface IntrinsicAttributes { key?: string | number; children?: ReactNode; ref?: any; }
+}

package/package.json

@@ -1,18 +1,43 @@
 {
   "name": "what-react",
-  "version": "0.6.2",
-  "description": "React compatibility layer for What Framework — use React packages with signals under the hood",
+  "version": "0.6.5",
+  "description": "React compatibility layer for What Framework \u2014 use React packages with signals under the hood",
   "type": "module",
   "main": "src/index.js",
   "exports": {
-    ".": "./src/index.js",
-    "./dom": "./src/dom.js",
-    "./jsx-runtime": "./src/jsx-runtime.js",
-    "./jsx-dev-runtime": "./src/jsx-dev-runtime.js",
-    "./vite": "./src/vite-plugin.js"
+    ".": {
+      "types": "./index.d.ts",
+      "import": "./src/index.js"
+    },
+    "./dom": {
+      "types": "./dom.d.ts",
+      "import": "./src/dom.js"
+    },
+    "./jsx-runtime": {
+      "types": "./jsx-runtime.d.ts",
+      "import": "./src/jsx-runtime.js"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./jsx-dev-runtime.d.ts",
+      "import": "./src/jsx-dev-runtime.js"
+    },
+    "./vite": {
+      "types": "./vite.d.ts",
+      "import": "./src/vite-plugin.js"
+    },
+    "./use-sync-external-store-with-selector": {
+      "types": "./use-sync-external-store-with-selector.d.ts",
+      "import": "./src/use-sync-external-store-with-selector.js"
+    }
   },
   "files": [
-    "src"
+    "src",
+    "index.d.ts",
+    "dom.d.ts",
+    "jsx-runtime.d.ts",
+    "jsx-dev-runtime.d.ts",
+    "vite.d.ts",
+    "use-sync-external-store-with-selector.d.ts"
   ],
   "keywords": [
     "react",
@@ -23,7 +48,7 @@
     "compatibility"
   ],
   "peerDependencies": {
-    "what-core": "^0.6.2"
+    "what-core": "^0.6.5"
   },
   "author": "ZVN DEV (https://zvndev.com)",
   "license": "MIT",
@@ -34,5 +59,6 @@
   "bugs": {
     "url": "https://github.com/CelsianJs/what-framework/issues"
   },
-  "homepage": "https://react.whatfw.com"
+  "homepage": "https://react.whatfw.com",
+  "types": "index.d.ts"
 }

package/use-sync-external-store-with-selector.d.ts

@@ -0,0 +1,7 @@
+export function useSyncExternalStoreWithSelector<Snapshot, Selection>(
+  subscribe: (onStoreChange: () => void) => () => void,
+  getSnapshot: () => Snapshot,
+  getServerSnapshot: (() => Snapshot) | undefined,
+  selector: (snapshot: Snapshot) => Selection,
+  isEqual?: (a: Selection, b: Selection) => boolean,
+): Selection;

package/vite.d.ts

@@ -0,0 +1,8 @@
+export type Plugin = any;
+
+export interface ReactCompatOptions {
+  exclude?: string[];
+  autoDetect?: boolean;
+}
+
+export function reactCompat(options?: ReactCompatOptions): Plugin;