typed-dom
Version:
A value-level and type-level DOM builder.
256 lines (245 loc) • 10.3 kB
JavaScript
/*! typed-dom v0.0.352 https://github.com/falsandtru/typed-dom | (c) 2016, falsandtru | (Apache-2.0 AND MPL-2.0) License */
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory();
else if(typeof define === 'function' && define.amd)
define([], factory);
else if(typeof exports === 'object')
exports["typed-dom"] = factory();
else
root["typed-dom"] = factory();
})(this, () => {
return /******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ 413
(__unused_webpack_module, exports) {
Object.defineProperty(exports, "__esModule", ({
value: true
}));
exports.ObjectSetPrototypeOf = exports.ObjectGetPrototypeOf = exports.ObjectCreate = exports.ObjectAssign = exports.toString = exports.isEnumerable = exports.isPrototypeOf = exports.hasOwnProperty = exports.isArray = exports.sqrt = exports.log10 = exports.log2 = exports.log = exports.tan = exports.cos = exports.sign = exports.round = exports.random = exports.min = exports.max = exports.floor = exports.ceil = exports.abs = exports.PI = exports.parseInt = exports.parseFloat = exports.isSafeInteger = exports.isNaN = exports.isInteger = exports.isFinite = exports.EPSILON = exports.MIN_VALUE = exports.MIN_SAFE_INTEGER = exports.MAX_VALUE = exports.MAX_SAFE_INTEGER = void 0;
exports.MAX_SAFE_INTEGER = Number.MAX_SAFE_INTEGER, exports.MAX_VALUE = Number.MAX_VALUE, exports.MIN_SAFE_INTEGER = Number.MIN_SAFE_INTEGER, exports.MIN_VALUE = Number.MIN_VALUE, exports.EPSILON = Number.EPSILON, exports.isFinite = Number.isFinite, exports.isInteger = Number.isInteger, exports.isNaN = Number.isNaN, exports.isSafeInteger = Number.isSafeInteger, exports.parseFloat = Number.parseFloat, exports.parseInt = Number.parseInt;
exports.PI = Math.PI, exports.abs = Math.abs, exports.ceil = Math.ceil, exports.floor = Math.floor, exports.max = Math.max, exports.min = Math.min, exports.random = Math.random, exports.round = Math.round, exports.sign = Math.sign, exports.cos = Math.cos, exports.tan = Math.tan, exports.log = Math.log, exports.log2 = Math.log2, exports.log10 = Math.log10, exports.sqrt = Math.sqrt;
exports.isArray = Array.isArray;
exports.hasOwnProperty = Object.prototype.hasOwnProperty.call.bind(Object.prototype.hasOwnProperty);
exports.isPrototypeOf = Object.prototype.isPrototypeOf.call.bind(Object.prototype.isPrototypeOf);
exports.isEnumerable = Object.prototype.propertyIsEnumerable.call.bind(Object.prototype.propertyIsEnumerable);
exports.toString = Object.prototype.toString.call.bind(Object.prototype.toString);
exports.ObjectAssign = Object.assign;
exports.ObjectCreate = Object.create;
exports.ObjectGetPrototypeOf = Object.getPrototypeOf;
exports.ObjectSetPrototypeOf = Object.setPrototypeOf;
/***/ },
/***/ 761
(__unused_webpack_module, exports, __webpack_require__) {
Object.defineProperty(exports, "__esModule", ({
value: true
}));
exports.defrag = exports.prepend = exports.append = exports.isChildren = exports.define = exports.element = exports.text = exports.math = exports.svg = exports.html = exports.frag = exports.shadow = void 0;
const alias_1 = __webpack_require__(413);
function shadow(el, opts, children, factory = exports.html) {
if (typeof el === 'string') return shadow(factory(el), opts, children, factory);
if (typeof opts === 'function') return shadow(el, undefined, children, opts);
if (typeof children === 'function') return shadow(el, opts, undefined, children);
if (isChildren(opts)) return shadow(el, undefined, opts, factory);
return defineChildren(opts ? el.attachShadow(opts) : el.shadowRoot ?? el.attachShadow({
mode: 'open'
}), children);
}
exports.shadow = shadow;
function frag(children) {
return defineChildren(document.createDocumentFragment(), children);
}
exports.frag = frag;
exports.html = element(document, "HTML" /* NS.HTML */);
exports.svg = element(document, "SVG" /* NS.SVG */);
exports.math = element(document, "MathML" /* NS.Math */);
function text(source) {
return document.createTextNode(source);
}
exports.text = text;
function element(context, ns) {
if (context instanceof ShadowRoot) {
const root = context;
context = document.implementation.createHTMLDocument();
// @ts-ignore
root.customElementRegistry.initialize(context);
}
return (tag, attrs, children) => {
return !attrs || isChildren(attrs) ? defineChildren(elem(context, ns, tag, {}), attrs ?? children) : defineChildren(defineAttrs(elem(context, ns, tag, attrs), attrs), children);
};
}
exports.element = element;
function elem(context, ns, tag, attrs) {
const opts = {
is: attrs['is'],
customElementRegistry: attrs['customElementRegistry']
};
switch (ns) {
case "HTML" /* NS.HTML */:
return context.createElement(tag, opts);
case "SVG" /* NS.SVG */:
return context.createElementNS('http://www.w3.org/2000/svg', tag, opts);
case "MathML" /* NS.Math */:
return context.createElementNS('http://www.w3.org/1998/Math/MathML', tag, opts);
}
}
function define(node, attrs, children) {
// Bug: TypeScript
// Need the next type assertions to suppress an impossible type error on dependent projects.
// Probably caused by typed-query-selector.
//
// typed-dom/dom.ts(113,3): Error TS2322: Type 'ParentNode & Node' is not assignable to type 'E'.
// 'E' could be instantiated with an arbitrary type which could be unrelated to 'ParentNode & Node'.
//
return !attrs || isChildren(attrs) ? defineChildren(node, attrs ?? children) : defineChildren(defineAttrs(node, attrs), children);
}
exports.define = define;
function defineAttrs(el, attrs) {
for (const name of Object.keys(attrs)) {
switch (name) {
case 'is':
case 'customElementRegistry':
continue;
}
const value = attrs[name];
switch (typeof value) {
case 'string':
el.setAttribute(name, value);
if (name.startsWith('on')) {
const type = name.slice(2).toLowerCase();
switch (type) {
case 'mutate':
case 'connect':
case 'disconnect':
const prop = `on${type}`;
el[prop] ?? Object.defineProperty(el, prop, {
configurable: true,
enumerable: false,
writable: true,
value: prop in el && !(0, alias_1.hasOwnProperty)(el, prop) ? ev => ev.returnValue : ''
});
}
}
continue;
case 'function':
if (name.length < 3) throw new Error(`Typed-DOM: Attribute names for event listeners must have an event name but got "${name}"`);
const names = name.split(/\s+/);
for (const name of names) {
if (!name.startsWith('on')) throw new Error(`Typed-DOM: Attribute names for event listeners must start with "on" but got "${name}"`);
const type = name.slice(2).toLowerCase();
el.addEventListener(type, value, {
passive: ['wheel', 'mousewheel', 'touchstart', 'touchmove', 'touchend', 'touchcancel'].includes(type)
});
switch (type) {
case 'mutate':
case 'connect':
case 'disconnect':
const prop = `on${type}`;
el[prop] ?? Object.defineProperty(el, prop, {
configurable: true,
enumerable: false,
writable: true,
value: prop in el && !(0, alias_1.hasOwnProperty)(el, prop) ? ev => ev.returnValue : ''
});
}
}
continue;
case 'object':
el.removeAttribute(name);
continue;
default:
continue;
}
}
return el;
}
function defineChildren(node, children) {
if (children === undefined) return node;
if (typeof children === 'string') {
node.textContent = children;
} else {
node.replaceChildren(...children);
}
return node;
}
function isChildren(value) {
return value?.[Symbol.iterator] !== undefined;
}
exports.isChildren = isChildren;
function append(node, children) {
if (children === undefined) return node;
if (typeof children === 'string') {
node.append(children);
} else {
for (const child of children) {
typeof child === 'object' ? node.appendChild(child) : node.append(child);
}
}
return node;
}
exports.append = append;
function prepend(node, children) {
if (children === undefined) return node;
if (typeof children === 'string') {
node.prepend(children);
} else {
for (const child of children) {
typeof child === 'object' ? node.insertBefore(child, null) : node.prepend(child);
}
}
return node;
}
exports.prepend = prepend;
function* defrag(nodes) {
let acc = '';
for (const node of nodes) {
if (typeof node === 'string') {
acc += node;
} else {
if (acc) yield acc;
acc = '';
yield node;
}
}
if (acc) yield acc;
}
exports.defrag = defrag;
/***/ }
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module is referenced by other modules so it can't be inlined
/******/ var __webpack_exports__ = __webpack_require__(761);
/******/
/******/ return __webpack_exports__;
/******/ })()
;
});