├── .gitignore ├── index.d.ts ├── rollup.config.js ├── README.md ├── package.json ├── index.js └── LICENSE /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | .tern-* 3 | /dist 4 | -------------------------------------------------------------------------------- /index.d.ts: -------------------------------------------------------------------------------- 1 | type Child = string | Node | null | undefined | readonly Child[] 2 | 3 | export default function crelt(elt: string | HTMLElement, attrs: {[attr: string]: any}, ...children: Child[]): HTMLElement 4 | export default function crelt(elt: string | HTMLElement, ...children: Child[]): HTMLElement 5 | -------------------------------------------------------------------------------- /rollup.config.js: -------------------------------------------------------------------------------- 1 | import copy from "rollup-plugin-copy" 2 | 3 | export default { 4 | input: "index.js", 5 | output: { 6 | file: "dist/index.cjs", 7 | format: "cjs", 8 | exports: "default" 9 | }, 10 | plugins: [ 11 | copy({targets: [{src: "index.d.ts", dest: "dist", rename: () => "index.d.cts"}]}) 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # CRELT 2 | 3 | Tiny DOM-element creation utility. Exports a single (default) value, 4 | which is a function that you call with: 5 | 6 | - A tag name string or DOM element. 7 | 8 | - Optionally an attribute object mapping names to values. When the 9 | values are strings, they are added to the element with 10 | `setAttribute`. When they have another type, they are assigned as 11 | regular properties (mostly useful for event handlers via `onclick` 12 | and such). When an attribute's value is null or undefined, it is 13 | not assigned. 14 | 15 | - Any number of children, which may be null (ignored), strings (added 16 | as text nodes), DOM nodes (added), or arrays (each element is added 17 | separately). 18 | 19 | The function returns a DOM element. 20 | 21 | ## License 22 | 23 | This software is licensed under an MIT license. 24 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "crelt", 3 | "version": "1.0.6", 4 | "description": "Tiny DOM-element-creation utility", 5 | "main": "dist/index.cjs", 6 | "type": "module", 7 | "exports": { 8 | "import": "./index.js", 9 | "require": "./dist/index.cjs" 10 | }, 11 | "module": "index.js", 12 | "types": "index.d.ts", 13 | "scripts": { 14 | "prepare": "rollup -c" 15 | }, 16 | "repository": { 17 | "type": "git", 18 | "url": "git+https://github.com/marijnh/crelt.git" 19 | }, 20 | "keywords": [ 21 | "dom", 22 | "creation", 23 | "crel" 24 | ], 25 | "author": "Marijn Haverbeke ", 26 | "license": "MIT", 27 | "bugs": { 28 | "url": "https://github.com/marijnh/crelt/issues" 29 | }, 30 | "homepage": "https://github.com/marijnh/crelt#readme", 31 | "devDependencies": { 32 | "rollup": "^2.0.5", 33 | "rollup-plugin-copy": "^3.4.0" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | export default function crelt() { 2 | var elt = arguments[0] 3 | if (typeof elt == "string") elt = document.createElement(elt) 4 | var i = 1, next = arguments[1] 5 | if (next && typeof next == "object" && next.nodeType == null && !Array.isArray(next)) { 6 | for (var name in next) if (Object.prototype.hasOwnProperty.call(next, name)) { 7 | var value = next[name] 8 | if (typeof value == "string") elt.setAttribute(name, value) 9 | else if (value != null) elt[name] = value 10 | } 11 | i++ 12 | } 13 | for (; i < arguments.length; i++) add(elt, arguments[i]) 14 | return elt 15 | } 16 | 17 | function add(elt, child) { 18 | if (typeof child == "string") { 19 | elt.appendChild(document.createTextNode(child)) 20 | } else if (child == null) { 21 | } else if (child.nodeType != null) { 22 | elt.appendChild(child) 23 | } else if (Array.isArray(child)) { 24 | for (var i = 0; i < child.length; i++) add(elt, child[i]) 25 | } else { 26 | throw new RangeError("Unsupported child node: " + child) 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Copyright (C) 2020 by Marijn Haverbeke 2 | 3 | Permission is hereby granted, free of charge, to any person obtaining a copy 4 | of this software and associated documentation files (the "Software"), to deal 5 | in the Software without restriction, including without limitation the rights 6 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 7 | copies of the Software, and to permit persons to whom the Software is 8 | furnished to do so, subject to the following conditions: 9 | 10 | The above copyright notice and this permission notice shall be included in 11 | all copies or substantial portions of the Software. 12 | 13 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 14 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 15 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 16 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 17 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 18 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 19 | THE SOFTWARE. 20 | --------------------------------------------------------------------------------