clapton 0.0.13 → 0.0.14

data/lib/clapton/javascripts/node_modules/diff-dom/rollup.config.mjs

@@ -0,0 +1,67 @@
+import typescript from "@rollup/plugin-typescript"
+import dts from "rollup-plugin-dts"
+import buble from "@rollup/plugin-buble"
+import terser from "@rollup/plugin-terser"
+
+export default [
+    {
+        input: "src/index.ts",
+        output: [
+            {
+                file: "dist/index.js",
+                format: "cjs",
+                sourcemap: true,
+            },
+            {
+                file: "dist/module.js",
+                format: "es",
+                sourcemap: true,
+            },
+        ],
+        plugins: [
+            typescript(),
+            buble(),
+        ],
+    },
+    {
+        input: "src/index.ts",
+        output: [
+            {
+                file: "dist/index.min.js",
+                format: "cjs",
+                sourcemap: true,
+            },
+        ],
+        plugins: [
+            typescript(),
+            buble(),
+            terser(),
+        ],
+    },
+    {
+        input: './dist/dts/index.d.ts',
+        output: [{ file: 'dist/index.d.ts', format: 'es' }],
+        plugins: [dts()],
+    },
+    {
+        input: "src/index.ts",
+        output: [
+            {
+                file: "browser/diffDOM.js",
+                format: "iife",
+                name: "diffDOM",
+                sourcemap: true,
+            },
+        ],
+        plugins: [
+            typescript({
+                compilerOptions: {
+                    declaration: false,
+                    declarationDir: undefined
+                }
+            }),
+            buble(),
+            terser()
+        ],
+    },
+]

data/lib/clapton/javascripts/node_modules/diff-dom/src/TraceLogger.ts

@@ -0,0 +1,143 @@
+import { checkElementType } from "./diffDOM/helpers"
+
+/**
+ * Use TraceLogger to figure out function calls inside
+ * JS objects by wrapping an object with a TraceLogger
+ * instance.
+ *
+ * Pretty-prints the call trace (using unicode box code)
+ * when tracelogger.toString() is called.
+ */
+
+/**
+ * Wrap an object by calling new TraceLogger(obj)
+ *
+ * If you're familiar with Python decorators, this
+ * does roughly the same thing, adding pre/post
+ * call hook logging calls so that you can see
+ * what's going on.
+ */
+export class TraceLogger {
+    messages: string[]
+    pad: string
+    padding: string
+    tick: number
+    constructor(obj = {}) {
+        this.pad = "│   "
+        this.padding = ""
+        this.tick = 1
+        this.messages = []
+        const wrapkey = (obj: object, key: string) => {
+            // trace this function
+            const oldfn = obj[key]
+            obj[key] = (
+                ...args: ((
+                    ...args: (
+                        | string
+                        | HTMLElement
+                        | number
+                        | boolean
+                        | false
+                        | (string | HTMLElement | number | boolean | false)[]
+                    )[]
+                ) => void)[]
+            ) => {
+                this.fin(key, Array.prototype.slice.call(args))
+                const result = oldfn.apply(obj, args)
+                this.fout(key, result)
+                return result
+            }
+        }
+        // can't use Object.keys for prototype walking
+        for (let key in obj) {
+            if (typeof obj[key] === "function") {
+                wrapkey(obj, key)
+            }
+        }
+        this.log("┌ TRACELOG START")
+    }
+    // called when entering a function
+    fin(
+        fn: string,
+        args:
+            | string
+            | HTMLElement
+            | number
+            | boolean
+            | false
+            | (string | HTMLElement | number | boolean | false)[],
+    ) {
+        this.padding += this.pad
+        this.log(`├─> entering ${fn}`, args)
+    }
+    // called when exiting a function
+    fout(
+        fn: string,
+        result:
+            | string
+            | HTMLElement
+            | number
+            | boolean
+            | false
+            | (string | HTMLElement | number | boolean | false)[],
+    ) {
+        this.log("│<──┘ generated return value", result)
+        this.padding = this.padding.substring(
+            0,
+            this.padding.length - this.pad.length,
+        )
+    }
+    // log message formatting
+    format(s: string, tick: number) {
+        let nf = function (t: number) {
+            let tStr = `${t}`
+            while (tStr.length < 4) {
+                tStr = `0${t}`
+            }
+            return tStr
+        }
+        return `${nf(tick)}> ${this.padding}${s}`
+    }
+    // log a trace message
+    log(...args) {
+        const stringCollapse = function (
+            v:
+                | string
+                | HTMLElement
+                | number
+                | boolean
+                | false
+                | (string | HTMLElement | number | boolean | false)[],
+        ) {
+            if (!v) {
+                return "<falsey>"
+            }
+            if (typeof v === "string") {
+                return v
+            }
+            if (checkElementType(v, "HTMLElement")) {
+                return (v as HTMLElement).outerHTML || "<empty>"
+            }
+            if (v instanceof Array) {
+                return `[${v.map(stringCollapse).join(",")}]`
+            }
+            return v.toString() || v.valueOf() || "<unknown>"
+        }
+        const s = args.map(stringCollapse).join(", ")
+        this.messages.push(this.format(s, this.tick++))
+    }
+    // turn the log into a structured string with
+    // unicode box codes to make it a sensible trace.
+    toString() {
+        let cap = "×   "
+        let terminator = "└───"
+        while (terminator.length <= this.padding.length + this.pad.length) {
+            terminator += cap
+        }
+        let _ = this.padding
+        this.padding = ""
+        terminator = this.format(terminator, this.tick)
+        this.padding = _
+        return `${this.messages.join("\n")}\n${terminator}`
+    }
+}

data/lib/clapton/javascripts/node_modules/diff-dom/src/diffDOM/dom/apply.ts

@@ -0,0 +1,227 @@
+import { DiffDOMOptions, diffType, nodeType } from "../types"
+import { Diff, checkElementType } from "../helpers"
+
+import { objToNode } from "./fromVirtual"
+
+// ===== Apply a diff =====
+
+const getFromRoute = (
+    node: Element,
+    route: number[],
+): Element | Text | false => {
+    route = route.slice()
+    while (route.length > 0) {
+        const c = route.splice(0, 1)[0]
+        node = node.childNodes[c] as Element
+    }
+    return node
+}
+
+export function applyDiff(
+    tree: Element,
+    diff: diffType,
+    options: DiffDOMOptions, // {preDiffApply, postDiffApply, textDiff, valueDiffing, _const}
+) {
+    const action = diff[options._const.action] as string | number
+    const route = diff[options._const.route] as number[]
+    let node
+
+    if (
+        ![options._const.addElement, options._const.addTextElement].includes(
+            action,
+        )
+    ) {
+        // For adding nodes, we calculate the route later on. It's different because it includes the position of the newly added item.
+        node = getFromRoute(tree, route)
+    }
+
+    let newNode
+    let reference: Element
+    let nodeArray
+
+    // pre-diff hook
+    const info = {
+        diff,
+        node,
+    }
+
+    if (options.preDiffApply(info)) {
+        return true
+    }
+
+    switch (action) {
+        case options._const.addAttribute:
+            if (!node || !checkElementType(node, "Element")) {
+                return false
+            }
+            node.setAttribute(
+                diff[options._const.name] as string,
+                diff[options._const.value] as string,
+            )
+            break
+        case options._const.modifyAttribute:
+            if (!node || !checkElementType(node, "Element")) {
+                return false
+            }
+            node.setAttribute(
+                diff[options._const.name] as string,
+                diff[options._const.newValue] as string,
+            )
+            if (
+                checkElementType(node, "HTMLInputElement") &&
+                diff[options._const.name] === "value"
+            ) {
+                node.value = diff[options._const.newValue] as string
+            }
+            break
+        case options._const.removeAttribute:
+            if (!node || !checkElementType(node, "Element")) {
+                return false
+            }
+            node.removeAttribute(diff[options._const.name] as string)
+            break
+        case options._const.modifyTextElement:
+            if (!node || !checkElementType(node, "Text")) {
+                return false
+            }
+            options.textDiff(
+                node,
+                node.data,
+                diff[options._const.oldValue] as string,
+                diff[options._const.newValue] as string,
+            )
+            if (checkElementType(node.parentNode, "HTMLTextAreaElement")) {
+                node.parentNode.value = diff[options._const.newValue] as string
+            }
+            break
+        case options._const.modifyValue:
+            if (!node || typeof node.value === "undefined") {
+                return false
+            }
+            node.value = diff[options._const.newValue]
+            break
+        case options._const.modifyComment:
+            if (!node || !checkElementType(node, "Comment")) {
+                return false
+            }
+            options.textDiff(
+                node,
+                node.data,
+                diff[options._const.oldValue] as string,
+                diff[options._const.newValue] as string,
+            )
+            break
+        case options._const.modifyChecked:
+            if (!node || typeof node.checked === "undefined") {
+                return false
+            }
+            node.checked = diff[options._const.newValue]
+            break
+        case options._const.modifySelected:
+            if (!node || typeof node.selected === "undefined") {
+                return false
+            }
+            node.selected = diff[options._const.newValue]
+            break
+        case options._const.replaceElement: {
+            const insideSvg =
+                (
+                    diff[options._const.newValue] as nodeType
+                ).nodeName.toLowerCase() === "svg" ||
+                node.parentNode.namespaceURI === "http://www.w3.org/2000/svg"
+            node.parentNode.replaceChild(
+                objToNode(
+                    diff[options._const.newValue] as nodeType,
+                    insideSvg,
+                    options,
+                ),
+                node,
+            )
+            break
+        }
+        case options._const.relocateGroup:
+            nodeArray = [...new Array(diff[options._const.groupLength])].map(
+                () =>
+                    node.removeChild(
+                        node.childNodes[diff[options._const.from] as number],
+                    ),
+            )
+            nodeArray.forEach((childNode, index) => {
+                if (index === 0) {
+                    reference =
+                        node.childNodes[diff[options._const.to] as number]
+                }
+                node.insertBefore(childNode, reference || null)
+            })
+            break
+        case options._const.removeElement:
+            node.parentNode.removeChild(node)
+            break
+        case options._const.addElement: {
+            const parentRoute = route.slice()
+            const c: number = parentRoute.splice(parentRoute.length - 1, 1)[0]
+            node = getFromRoute(tree, parentRoute)
+            if (!checkElementType(node, "Element")) {
+                return false
+            }
+            node.insertBefore(
+                objToNode(
+                    diff[options._const.element] as nodeType,
+                    node.namespaceURI === "http://www.w3.org/2000/svg",
+                    options,
+                ),
+                node.childNodes[c] || null,
+            )
+            break
+        }
+        case options._const.removeTextElement: {
+            if (!node || node.nodeType !== 3) {
+                return false
+            }
+            const parentNode = node.parentNode
+            parentNode.removeChild(node)
+            if (checkElementType(parentNode, "HTMLTextAreaElement")) {
+                parentNode.value = ""
+            }
+            break
+        }
+        case options._const.addTextElement: {
+            const parentRoute = route.slice()
+            const c: number = parentRoute.splice(parentRoute.length - 1, 1)[0]
+            newNode = options.document.createTextNode(
+                diff[options._const.value] as string,
+            )
+            node = getFromRoute(tree, parentRoute)
+            if (!node.childNodes) {
+                return false
+            }
+            node.insertBefore(newNode, node.childNodes[c] || null)
+            if (checkElementType(node.parentNode, "HTMLTextAreaElement")) {
+                node.parentNode.value = diff[options._const.value] as string
+            }
+            break
+        }
+        default:
+            console.log("unknown action")
+    }
+
+    // if a new node was created, we might be interested in its
+    // post diff hook
+    options.postDiffApply({
+        diff: info.diff,
+        node: info.node,
+        newNode,
+    })
+
+    return true
+}
+
+export function applyDOM(
+    tree: Element,
+    diffs: (Diff | diffType)[],
+    options: DiffDOMOptions,
+) {
+    return diffs.every((diff: Diff | diffType) =>
+        applyDiff(tree, diff as diffType, options),
+    )
+}

data/lib/clapton/javascripts/node_modules/diff-dom/src/diffDOM/dom/fromVirtual.ts

@@ -0,0 +1,83 @@
+import { DiffDOMOptions, elementNodeType, textNodeType } from "../types"
+import { checkElementType } from "../helpers"
+
+export function objToNode(
+    objNode: elementNodeType,
+    insideSvg: boolean,
+    options: DiffDOMOptions,
+) {
+    let node: Element | Text | Comment
+    if (objNode.nodeName === "#text") {
+        node = options.document.createTextNode((objNode as textNodeType).data)
+    } else if (objNode.nodeName === "#comment") {
+        node = options.document.createComment((objNode as textNodeType).data)
+    } else {
+        if (insideSvg) {
+            node = options.document.createElementNS(
+                "http://www.w3.org/2000/svg",
+                objNode.nodeName,
+            )
+            if (objNode.nodeName === "foreignObject") {
+                insideSvg = false
+            }
+        } else if (objNode.nodeName.toLowerCase() === "svg") {
+            node = options.document.createElementNS(
+                "http://www.w3.org/2000/svg",
+                "svg",
+            )
+            insideSvg = true
+        } else {
+            node = options.document.createElement(objNode.nodeName)
+        }
+        if (objNode.attributes) {
+            Object.entries(objNode.attributes).forEach(([key, value]) =>
+                (node as Element).setAttribute(key, value),
+            )
+        }
+        if (objNode.childNodes) {
+            node = node as Element
+            objNode.childNodes.forEach(
+                (childNode: elementNodeType | textNodeType) =>
+                    node.appendChild(objToNode(childNode, insideSvg, options)),
+            )
+        }
+        if (options.valueDiffing) {
+            if (
+                objNode.value &&
+                checkElementType(
+                    node,
+                    "HTMLButtonElement",
+                    "HTMLDataElement",
+                    "HTMLInputElement",
+                    "HTMLLIElement",
+                    "HTMLMeterElement",
+                    "HTMLOptionElement",
+                    "HTMLProgressElement",
+                    "HTMLParamElement",
+                )
+            ) {
+                ;(
+                    node as
+                        | HTMLButtonElement
+                        | HTMLDataElement
+                        | HTMLInputElement
+                        | HTMLLIElement
+                        | HTMLMeterElement
+                        | HTMLOptionElement
+                        | HTMLProgressElement
+                        | HTMLParamElement
+                ).value = objNode.value
+            }
+            if (objNode.checked && checkElementType(node, "HTMLInputElement")) {
+                ;(node as HTMLInputElement).checked = objNode.checked
+            }
+            if (
+                objNode.selected &&
+                checkElementType(node, "HTMLOptionElement")
+            ) {
+                ;(node as HTMLOptionElement).selected = objNode.selected
+            }
+        }
+    }
+    return node
+}

data/lib/clapton/javascripts/node_modules/diff-dom/src/diffDOM/dom/index.ts

@@ -0,0 +1,2 @@
+export { applyDOM } from "./apply"
+export { undoDOM } from "./undo"

data/lib/clapton/javascripts/node_modules/diff-dom/src/diffDOM/dom/undo.ts

@@ -0,0 +1,90 @@
+import { DiffDOMOptions, diffType } from "../types"
+import { Diff } from "../helpers"
+import { applyDiff } from "./apply"
+
+// ===== Undo a diff =====
+
+function swap(obj: object, p1: string | number, p2: string | number) {
+    const tmp = obj[p1]
+    obj[p1] = obj[p2]
+    obj[p2] = tmp
+}
+
+function undoDiff(
+    tree: Element,
+    diff: diffType,
+    options: DiffDOMOptions, // {preDiffApply, postDiffApply, textDiff, valueDiffing, _const}
+) {
+    switch (diff[options._const.action]) {
+        case options._const.addAttribute:
+            diff[options._const.action] = options._const.removeAttribute
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifyAttribute:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.removeAttribute:
+            diff[options._const.action] = options._const.addAttribute
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifyTextElement:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifyValue:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifyComment:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifyChecked:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.modifySelected:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.replaceElement:
+            swap(diff, options._const.oldValue, options._const.newValue)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.relocateGroup:
+            swap(diff, options._const.from, options._const.to)
+            applyDiff(tree, diff, options)
+            break
+        case options._const.removeElement:
+            diff[options._const.action] = options._const.addElement
+            applyDiff(tree, diff, options)
+            break
+        case options._const.addElement:
+            diff[options._const.action] = options._const.removeElement
+            applyDiff(tree, diff, options)
+            break
+        case options._const.removeTextElement:
+            diff[options._const.action] = options._const.addTextElement
+            applyDiff(tree, diff, options)
+            break
+        case options._const.addTextElement:
+            diff[options._const.action] = options._const.removeTextElement
+            applyDiff(tree, diff, options)
+            break
+        default:
+            console.log("unknown action")
+    }
+}
+
+export function undoDOM(
+    tree: Element,
+    diffs: (diffType | Diff)[],
+    options: DiffDOMOptions,
+) {
+    diffs = diffs.slice()
+    diffs.reverse()
+    diffs.forEach((diff: diffType | Diff) => {
+        undoDiff(tree, diff as diffType, options)
+    })
+}

data/lib/clapton/javascripts/node_modules/diff-dom/src/diffDOM/helpers.ts

@@ -0,0 +1,40 @@
+import { elementNodeType } from "./types"
+
+export class Diff {
+    constructor(options = {}) {
+        Object.entries(options).forEach(([key, value]) => (this[key] = value))
+    }
+
+    toString() {
+        return JSON.stringify(this)
+    }
+
+    setValue(
+        aKey: string | number,
+        aValue:
+            | string
+            | number
+            | boolean
+            | number[]
+            | { [key: string]: string | { [key: string]: string } }
+            | elementNodeType,
+    ) {
+        this[aKey] = aValue
+        return this
+    }
+}
+
+export function checkElementType(element, ...elementTypeNames: string[]) {
+    if (typeof element === "undefined" || element === null) {
+        return false
+    }
+    return elementTypeNames.some(
+        (elementTypeName) =>
+            // We need to check if the specified type is defined
+            // because otherwise instanceof throws an exception.
+            typeof element?.ownerDocument?.defaultView?.[elementTypeName] ===
+                "function" &&
+            element instanceof
+                element.ownerDocument.defaultView[elementTypeName],
+    )
+}