react-ko/dist/index.d.mts

React + Knockout integration library

import * as React$1 from 'react';
import React__default from 'react';
import * as react_jsx_runtime from 'react/jsx-runtime';
import ko$1 from 'knockout';

/**
 * Context to store the global AppViewModel.
 * Intended to be overridden by consumer's ViewModel type.
 */
declare const AppViewModelContext: React$1.Context<unknown>;
/**
 * Hook to access the current AppViewModel.
 * Must be used within a RootKnockoutProvider.
 */
declare function useAppViewModel<T>(): T;

type Props$4<T> = {
    viewModel: T;
    children: React__default.ReactNode;
};
/**
 * Applies Knockout bindings once on initial render,
 * and provides the ViewModel via context.
 */
declare const RootKnockoutProvider: React__default.MemoExoticComponent<(<T>({ viewModel, children }: Props$4<T>) => react_jsx_runtime.JSX.Element)>;

type Props$3<T> = {
    viewModel: T;
    children: React__default.ReactNode;
};
/**
 * Wraps a child component with a Knockout `with:` binding scope
 * to isolate a sub-ViewModel within the global ViewModel.
 */
declare const KnockoutScope: React__default.MemoExoticComponent<(<T>({ viewModel, children }: Props$3<T>) => react_jsx_runtime.JSX.Element)>;

type Props$2 = {
    items: ko$1.Observable<unknown[]> | ko$1.Computed<unknown[]> | unknown[];
    children: React__default.ReactNode;
};
/**
 * Renders children for each item in the given array.
 * Uses Knockout's `foreach:` binding internally.
 */
declare const KoForeach: React__default.NamedExoticComponent<Props$2>;

type Props$1 = {
    condition: ko$1.Observable<boolean> | ko$1.Computed<boolean> | boolean;
    children: React__default.ReactNode;
};
/**
 * Wraps children with a Knockout `if:` binding using a `div` container.
 * Safer and more efficient than comment-based bindings in React.
 * Recommended for standard usage when template compatibility is not required.
 */
declare const KoIf: React__default.NamedExoticComponent<Props$1>;

type Props = {
    condition: ko.Observable<boolean> | ko.Computed<boolean> | boolean;
    children: React__default.ReactNode;
};
/**
 * Renders children only when the given condition is false.
 * Uses Knockout's `ifnot:` binding internally.
 */
declare const KoIfNot: React__default.NamedExoticComponent<Props>;

/**
 * @deprecated Use `KoForeach` instead. This component will be removed in a future version.
 */
declare const KoForeachComment: React$1.NamedExoticComponent<{
    items: ko.Observable<unknown[]> | ko.Computed<unknown[]> | unknown[];
    children: React.ReactNode;
}>;

/**
 * @deprecated Use `KoIf` instead. This component will be removed in a future version.
 */
declare const KoIfComment: React$1.NamedExoticComponent<{
    condition: ko.Observable<boolean> | ko.Computed<boolean> | boolean;
    children: React.ReactNode;
}>;

/**
 * @deprecated Use `KoIfNot` instead. This component will be removed in a future version.
 */
declare const KoIfNotComment: React$1.NamedExoticComponent<{
    condition: ko.Observable<boolean> | ko.Computed<boolean> | boolean;
    children: React.ReactNode;
}>;

export { AppViewModelContext, KnockoutScope, KoForeach, KoForeachComment, KoIf, KoIfComment, KoIfNot, KoIfNotComment, KnockoutScope as KoScope, RootKnockoutProvider, useAppViewModel };