import { BindableValue } from './binding';
import { MultiHolder } from './dispose';
import { DomArg, DomMethod } from './domImpl';
export type DomComputed = [Node, Node, DomMethod];
export type DomContents = Node | string | DomComputed | void | null | undefined | IDomContentsArray;
export interface IDomContentsArray extends Array<DomContents> {
}
/**
 * Replaces the content between nodeBefore and nodeAfter, which should be two siblings within the
 * same parent node. New content may be anything allowed as an argument to dom(), including null
 * to insert nothing. Runs disposers, if any, on all removed content.
 */
export declare function replaceContent(nodeBefore: Node, nodeAfter: Node, content: DomContents): void;
/**
 * Appends dynamic DOM content to an element. The value may be an observable or function (from
 * which a computed is created), whose value will be passed to `contentFunc` which should return
 * DOM content. If the contentFunc is omitted, it defaults to identity, i.e. it's OK for the
 * observable or function to return DOM directly.
 *
 * The DOM content returned may be an element, string, array, or null. Whenever the observable
 * changes, previous content is disposed and removed, and new content added in its place.
 *
 * The following are roughly equivalent:
 * ```ts
 * // (A)
 * domComputed(nlinesObs, nlines => nlines > 1 ? dom('textarea') : dom('input'))
 * // (B)
 * domComputed(use => use(nlinesObs) > 1 ? dom('textarea') : dom('input'))
 * // (C)
 * domComputed(use => use(nlinesObs) > 1, isTall => isTall ? dom('textarea') : dom('input'))
 * ```
 *
 * Here, (C) is best. Both (A) and (B) would rebuild DOM for any change in nlinesObs, but (C)
 * encapsulates meaningful changes in the observable, and only recreates DOM when necessary.
 *
 * Syntax (B), without the second argument, may be useful in cases of DOM depending on several
 * observables, e.g.
 * ```ts
 * domComputed(use => use(readonlyObs) ? dom('div') :
 *     (use(nlinesObs) > 1 ? dom('textarea') : dom('input')))
 * ```
 *
 * If the argument is not an observable, `domComputed()` may but should not be used. The following
 * are equivalent:
 * ```ts
 * dom(..., domComputed(listValue, list => `Have ${list.length} items`), ...);
 * dom(..., `Have ${listValue.length} items`, ...);
 * ```
 *
 * In this case, the latter is preferred as the clearly simpler one.
 *
 * @param valueObs - Observable or function for a computed.
 * @param contentFunc - Function called with the result of valueObs as the input, and
 *    returning DOM as output. If omitted, defaults to the identity function.
 */
export declare function domComputed(valueObs: BindableValue<Exclude<DomArg, DomMethod>>): DomComputed;
export declare function domComputed<T>(valueObs: BindableValue<T>, contentFunc: (val: T) => DomContents): DomComputed;
/**
 * Like domComputed(), but the callback gets an additional first argument, owner, which may be
 * used to take ownership of objects created by the callback. These will be disposed before each
 * new call to the callback, and when the containing DOM is disposed.
 *
 * `domComputedOwned(valueObs, (owner, value) => Editor.create(owner, value).renderSomething())`
 */
export declare function domComputedOwned<T>(valueObs: BindableValue<T>, contentFunc: (owner: MultiHolder, val: T) => DomContents): DomComputed;
/**
 * Conditionally appends DOM to an element. The value may be an observable or function (from which
 * a computed is created), whose value -- if truthy -- will be passed to `contentFunc` which
 * should return DOM content. If the value is falsy, DOM content is removed.
 *
 * Note that if the observable changes between different truthy values, contentFunc gets called
 * for each value, and previous content gets destroyed. To consider all truthy values the same,
 * use an observable that returns a proper boolean, e.g.
 * ```ts
 *    dom.maybe(use => Boolean(use(fooObs)), () => dom(...));
 * ```
 *
 * As with domComputed(), dom.maybe() may but should not be used when the argument is not an
 * observable or function. The following are equivalent:
 * ```ts
 *    dom(..., dom.maybe(myValue, () => dom(...)));
 *    dom(..., myValue ? dom(...) : null);
 * ```
 *
 * The latter is preferred for being simpler.
 *
 * @param boolValueObs - Observable or function for a computed.
 * @param contentFunc - Called with the result of boolValueObs when it is truthy. Should return DOM.
 */
export declare function maybe<T>(boolValueObs: BindableValue<T>, contentFunc: (val: NonNullable<T>) => DomContents): DomComputed;
/**
 * Like maybe(), but the callback gets an additional first argument, owner, which may be used to
 * take ownership of objects created by the callback. These will be disposed before each new call
 * to the callback, and when the condition becomes false or the containing DOM gets disposed.
 * ```ts
 *    maybeOwned(showEditor, (owner) => Editor.create(owner).renderSomething())
 * ```
 */
export declare function maybeOwned<T>(boolValueObs: BindableValue<T>, contentFunc: (owner: MultiHolder, val: NonNullable<T>) => DomContents): DomComputed;