shelving/util/jsx.js

Toolkit for using data in JavaScript.

import { isArray } from "./array.js";
/** Is an unknown value a JSX element? */
export function isJSXElement(value) {
    return typeof value === "object" && value !== null && "type" in value;
}
/** Is an unknown value a JSX node? */
export function isJSXNode(value) {
    return value === null || typeof value === "string" || isJSXElement(value) || isArray(value);
}
/**
 * Take a Markup JSX node and strip all tags from it to produce a plain text string.
 *
 * @param node A JsxNode, e.g. either a JSX element, a plain string, or null/undefined (or an array of those things).
 * @returns The combined string made from the JSX node.
 *
 * @example `- Item with *strong*\n- Item with _em_` becomes `Item with strong Item with em`
 */
export function getJSXNodeText(node) {
    if (typeof node === "string")
        return node;
    if (isArray(node))
        return node.map(getJSXNodeText).filter(Boolean).join(" ");
    if (isJSXElement(node))
        return getJSXNodeText(node.props.children);
    return "";
}
/**
 * Iterate through all elements in a node.
 * - This is useful if you, e.g. want to apply a `className` to all `<h1>` elements, or make a list of all URLs found in a Node.
 */
export function* getJSXNodeElements(node) {
    if (isArray(node)) {
        for (const n of node)
            yield* getJSXNodeElements(n);
    }
    else if (isJSXElement(node)) {
        yield node;
        if (node.props.children)
            yield* getJSXNodeElements(node.props.children);
    }
}