uhtml/cjs/keyed.js

A micro HTML/SVG render

'use strict';
/*! (c) Andrea Giammarchi - MIT */
const { Hole } = require('./rabbit.js');
const { attr } = require('./handler.js');
const { cache } = require('./literals.js');
const { set } = require('./utils.js');
const { html, svg } = require('./index.js');

const render = (require('./render/keyed.js'));

/** @typedef {import("./literals.js").Cache} Cache */
/** @typedef {import("./literals.js").Target} Target */
/** @typedef {import("./literals.js").Value} Value */

/** @typedef {(ref:Object, key:string | number) => Tag} Bound */

/**
 * @callback Tag
 * @param {TemplateStringsArray} template
 * @param  {...Value} values
 * @returns {Target}
 */

const keyed = new WeakMap;
const createRef = svg => /** @type {Bound} */ (ref, key) => {
  /** @type {Tag} */
  function tag(template, ...values) {
    return new Hole(svg, template, values).toDOM(this);
  }

  const memo = keyed.get(ref) || set(keyed, ref, new Map);
  return memo.get(key) || set(memo, key, tag.bind(cache()));
};

/** @type {Bound} Returns a bound tag to render HTML content. */
const htmlFor = createRef(false);
exports.htmlFor = htmlFor;

/** @type {Bound} Returns a bound tag to render SVG content. */
const svgFor = createRef(true);
exports.svgFor = svgFor;

exports.Hole = Hole;
exports.render = render;
exports.html = html;
exports.svg = svg;
exports.attr = attr;