jaxs 0.2.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/cypress/e2e/svg-renders.cy.js +10 -0
  2. package/cypress/jaxs-apps/dist/add-remove-root-children.3bb9b3f5.js +71 -50
  3. package/cypress/jaxs-apps/dist/add-remove-root-children.3bb9b3f5.js.map +1 -1
  4. package/cypress/jaxs-apps/dist/svg.04290504.js +644 -0
  5. package/cypress/jaxs-apps/dist/svg.04290504.js.map +1 -0
  6. package/cypress/jaxs-apps/dist/svg.html +11 -0
  7. package/cypress/jaxs-apps/svg.html +11 -0
  8. package/cypress/jaxs-apps/svg.jsx +15 -0
  9. package/dist/jaxs.js +67 -34
  10. package/package.json +3 -2
  11. package/src/debugging.js +3 -3
  12. package/src/rendering/change/instructions/attributes.ts +5 -2
  13. package/src/rendering/change/instructions/children.ts +22 -23
  14. package/src/rendering/change/instructions/element.ts +8 -1
  15. package/src/rendering/change/instructions/events.ts +1 -1
  16. package/src/rendering/change/instructions/generate.ts +2 -2
  17. package/src/rendering/change/instructions/node.ts +19 -2
  18. package/src/rendering/change/instructions/text.ts +1 -1
  19. package/src/rendering/change.ts +17 -9
  20. package/src/rendering/dom/attributesAndEvents.ts +1 -1
  21. package/src/rendering/dom/create.ts +1 -1
  22. package/src/rendering/dom/svg.ts +18 -0
  23. package/src/rendering/templates/children.ts +10 -2
  24. package/src/rendering/templates/tag.ts +23 -1
  25. package/src/types.ts +4 -1
  26. package/.parcel-cache/6f14daf302269614-BundleGraph-0 +0 -0
  27. package/.parcel-cache/7d3d872b02d671a6-AssetGraph-0 +0 -0
  28. package/.parcel-cache/8e029bb14f8992df-RequestGraph-0 +0 -0
  29. package/.parcel-cache/a5394978e4ece10b-AssetGraph-0 +0 -0
  30. package/.parcel-cache/b5686051ae060930.txt +0 -2
  31. package/.parcel-cache/data.mdb +0 -0
  32. package/.parcel-cache/lock.mdb +0 -0
@@ -0,0 +1 @@
1
+ {"mappings":"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","sources":["node_modules/@parcel/runtime-browser-hmr/lib/runtime-2b5e820a519cf32d.js","cypress/jaxs-apps/svg.jsx"],"sourcesContent":["var HMR_HOST = null;var HMR_PORT = null;var HMR_SECURE = false;var HMR_ENV_HASH = \"d6ea1d42532a7575\";module.bundle.HMR_BUNDLE_ID = \"318855cf04290504\";\"use strict\";\n\n/* global HMR_HOST, HMR_PORT, HMR_ENV_HASH, HMR_SECURE, chrome, browser, __parcel__import__, __parcel__importScripts__, ServiceWorkerGlobalScope */\n/*::\nimport type {\n HMRAsset,\n HMRMessage,\n} from '@parcel/reporter-dev-server/src/HMRServer.js';\ninterface ParcelRequire {\n (string): mixed;\n cache: {|[string]: ParcelModule|};\n hotData: {|[string]: mixed|};\n Module: any;\n parent: ?ParcelRequire;\n isParcelRequire: true;\n modules: {|[string]: [Function, {|[string]: string|}]|};\n HMR_BUNDLE_ID: string;\n root: ParcelRequire;\n}\ninterface ParcelModule {\n hot: {|\n data: mixed,\n accept(cb: (Function) => void): void,\n dispose(cb: (mixed) => void): void,\n // accept(deps: Array<string> | string, cb: (Function) => void): void,\n // decline(): void,\n _acceptCallbacks: Array<(Function) => void>,\n _disposeCallbacks: Array<(mixed) => void>,\n |};\n}\ninterface ExtensionContext {\n runtime: {|\n reload(): void,\n getURL(url: string): string;\n getManifest(): {manifest_version: number, ...};\n |};\n}\ndeclare var module: {bundle: ParcelRequire, ...};\ndeclare var HMR_HOST: string;\ndeclare var HMR_PORT: string;\ndeclare var HMR_ENV_HASH: string;\ndeclare var HMR_SECURE: boolean;\ndeclare var chrome: ExtensionContext;\ndeclare var browser: ExtensionContext;\ndeclare var __parcel__import__: (string) => Promise<void>;\ndeclare var __parcel__importScripts__: (string) => Promise<void>;\ndeclare var globalThis: typeof self;\ndeclare var ServiceWorkerGlobalScope: Object;\n*/\nvar OVERLAY_ID = '__parcel__error__overlay__';\nvar OldModule = module.bundle.Module;\nfunction Module(moduleName) {\n OldModule.call(this, moduleName);\n this.hot = {\n data: module.bundle.hotData[moduleName],\n _acceptCallbacks: [],\n _disposeCallbacks: [],\n accept: function (fn) {\n this._acceptCallbacks.push(fn || function () {});\n },\n dispose: function (fn) {\n this._disposeCallbacks.push(fn);\n }\n };\n module.bundle.hotData[moduleName] = undefined;\n}\nmodule.bundle.Module = Module;\nmodule.bundle.hotData = {};\nvar checkedAssets /*: {|[string]: boolean|} */, assetsToDispose /*: Array<[ParcelRequire, string]> */, assetsToAccept /*: Array<[ParcelRequire, string]> */;\n\nfunction getHostname() {\n return HMR_HOST || (location.protocol.indexOf('http') === 0 ? location.hostname : 'localhost');\n}\nfunction getPort() {\n return HMR_PORT || location.port;\n}\n\n// eslint-disable-next-line no-redeclare\nvar parent = module.bundle.parent;\nif ((!parent || !parent.isParcelRequire) && typeof WebSocket !== 'undefined') {\n var hostname = getHostname();\n var port = getPort();\n var protocol = HMR_SECURE || location.protocol == 'https:' && !['localhost', '127.0.0.1', '0.0.0.0'].includes(hostname) ? 'wss' : 'ws';\n var ws;\n try {\n ws = new WebSocket(protocol + '://' + hostname + (port ? ':' + port : '') + '/');\n } catch (err) {\n if (err.message) {\n console.error(err.message);\n }\n ws = {};\n }\n\n // Web extension context\n var extCtx = typeof browser === 'undefined' ? typeof chrome === 'undefined' ? null : chrome : browser;\n\n // Safari doesn't support sourceURL in error stacks.\n // eval may also be disabled via CSP, so do a quick check.\n var supportsSourceURL = false;\n try {\n (0, eval)('throw new Error(\"test\"); //# sourceURL=test.js');\n } catch (err) {\n supportsSourceURL = err.stack.includes('test.js');\n }\n\n // $FlowFixMe\n ws.onmessage = async function (event /*: {data: string, ...} */) {\n checkedAssets = {} /*: {|[string]: boolean|} */;\n assetsToAccept = [];\n assetsToDispose = [];\n var data /*: HMRMessage */ = JSON.parse(event.data);\n if (data.type === 'update') {\n // Remove error overlay if there is one\n if (typeof document !== 'undefined') {\n removeErrorOverlay();\n }\n let assets = data.assets.filter(asset => asset.envHash === HMR_ENV_HASH);\n\n // Handle HMR Update\n let handled = assets.every(asset => {\n return asset.type === 'css' || asset.type === 'js' && hmrAcceptCheck(module.bundle.root, asset.id, asset.depsByBundle);\n });\n if (handled) {\n console.clear();\n\n // Dispatch custom event so other runtimes (e.g React Refresh) are aware.\n if (typeof window !== 'undefined' && typeof CustomEvent !== 'undefined') {\n window.dispatchEvent(new CustomEvent('parcelhmraccept'));\n }\n await hmrApplyUpdates(assets);\n\n // Dispose all old assets.\n let processedAssets = {} /*: {|[string]: boolean|} */;\n for (let i = 0; i < assetsToDispose.length; i++) {\n let id = assetsToDispose[i][1];\n if (!processedAssets[id]) {\n hmrDispose(assetsToDispose[i][0], id);\n processedAssets[id] = true;\n }\n }\n\n // Run accept callbacks. This will also re-execute other disposed assets in topological order.\n processedAssets = {};\n for (let i = 0; i < assetsToAccept.length; i++) {\n let id = assetsToAccept[i][1];\n if (!processedAssets[id]) {\n hmrAccept(assetsToAccept[i][0], id);\n processedAssets[id] = true;\n }\n }\n } else fullReload();\n }\n if (data.type === 'error') {\n // Log parcel errors to console\n for (let ansiDiagnostic of data.diagnostics.ansi) {\n let stack = ansiDiagnostic.codeframe ? ansiDiagnostic.codeframe : ansiDiagnostic.stack;\n console.error('🚨 [parcel]: ' + ansiDiagnostic.message + '\\n' + stack + '\\n\\n' + ansiDiagnostic.hints.join('\\n'));\n }\n if (typeof document !== 'undefined') {\n // Render the fancy html overlay\n removeErrorOverlay();\n var overlay = createErrorOverlay(data.diagnostics.html);\n // $FlowFixMe\n document.body.appendChild(overlay);\n }\n }\n };\n ws.onerror = function (e) {\n if (e.message) {\n console.error(e.message);\n }\n };\n ws.onclose = function () {\n console.warn('[parcel] 🚨 Connection to the HMR server was lost');\n };\n}\nfunction removeErrorOverlay() {\n var overlay = document.getElementById(OVERLAY_ID);\n if (overlay) {\n overlay.remove();\n console.log('[parcel] ✨ Error resolved');\n }\n}\nfunction createErrorOverlay(diagnostics) {\n var overlay = document.createElement('div');\n overlay.id = OVERLAY_ID;\n let errorHTML = '<div style=\"background: black; opacity: 0.85; font-size: 16px; color: white; position: fixed; height: 100%; width: 100%; top: 0px; left: 0px; padding: 30px; font-family: Menlo, Consolas, monospace; z-index: 9999;\">';\n for (let diagnostic of diagnostics) {\n let stack = diagnostic.frames.length ? diagnostic.frames.reduce((p, frame) => {\n return `${p}\n<a href=\"/__parcel_launch_editor?file=${encodeURIComponent(frame.location)}\" style=\"text-decoration: underline; color: #888\" onclick=\"fetch(this.href); return false\">${frame.location}</a>\n${frame.code}`;\n }, '') : diagnostic.stack;\n errorHTML += `\n <div>\n <div style=\"font-size: 18px; font-weight: bold; margin-top: 20px;\">\n 🚨 ${diagnostic.message}\n </div>\n <pre>${stack}</pre>\n <div>\n ${diagnostic.hints.map(hint => '<div>💡 ' + hint + '</div>').join('')}\n </div>\n ${diagnostic.documentation ? `<div>📝 <a style=\"color: violet\" href=\"${diagnostic.documentation}\" target=\"_blank\">Learn more</a></div>` : ''}\n </div>\n `;\n }\n errorHTML += '</div>';\n overlay.innerHTML = errorHTML;\n return overlay;\n}\nfunction fullReload() {\n if ('reload' in location) {\n location.reload();\n } else if (extCtx && extCtx.runtime && extCtx.runtime.reload) {\n extCtx.runtime.reload();\n }\n}\nfunction getParents(bundle, id) /*: Array<[ParcelRequire, string]> */{\n var modules = bundle.modules;\n if (!modules) {\n return [];\n }\n var parents = [];\n var k, d, dep;\n for (k in modules) {\n for (d in modules[k][1]) {\n dep = modules[k][1][d];\n if (dep === id || Array.isArray(dep) && dep[dep.length - 1] === id) {\n parents.push([bundle, k]);\n }\n }\n }\n if (bundle.parent) {\n parents = parents.concat(getParents(bundle.parent, id));\n }\n return parents;\n}\nfunction updateLink(link) {\n var href = link.getAttribute('href');\n if (!href) {\n return;\n }\n var newLink = link.cloneNode();\n newLink.onload = function () {\n if (link.parentNode !== null) {\n // $FlowFixMe\n link.parentNode.removeChild(link);\n }\n };\n newLink.setAttribute('href',\n // $FlowFixMe\n href.split('?')[0] + '?' + Date.now());\n // $FlowFixMe\n link.parentNode.insertBefore(newLink, link.nextSibling);\n}\nvar cssTimeout = null;\nfunction reloadCSS() {\n if (cssTimeout) {\n return;\n }\n cssTimeout = setTimeout(function () {\n var links = document.querySelectorAll('link[rel=\"stylesheet\"]');\n for (var i = 0; i < links.length; i++) {\n // $FlowFixMe[incompatible-type]\n var href /*: string */ = links[i].getAttribute('href');\n var hostname = getHostname();\n var servedFromHMRServer = hostname === 'localhost' ? new RegExp('^(https?:\\\\/\\\\/(0.0.0.0|127.0.0.1)|localhost):' + getPort()).test(href) : href.indexOf(hostname + ':' + getPort());\n var absolute = /^https?:\\/\\//i.test(href) && href.indexOf(location.origin) !== 0 && !servedFromHMRServer;\n if (!absolute) {\n updateLink(links[i]);\n }\n }\n cssTimeout = null;\n }, 50);\n}\nfunction hmrDownload(asset) {\n if (asset.type === 'js') {\n if (typeof document !== 'undefined') {\n let script = document.createElement('script');\n script.src = asset.url + '?t=' + Date.now();\n if (asset.outputFormat === 'esmodule') {\n script.type = 'module';\n }\n return new Promise((resolve, reject) => {\n var _document$head;\n script.onload = () => resolve(script);\n script.onerror = reject;\n (_document$head = document.head) === null || _document$head === void 0 || _document$head.appendChild(script);\n });\n } else if (typeof importScripts === 'function') {\n // Worker scripts\n if (asset.outputFormat === 'esmodule') {\n return __parcel__import__(asset.url + '?t=' + Date.now());\n } else {\n return new Promise((resolve, reject) => {\n try {\n __parcel__importScripts__(asset.url + '?t=' + Date.now());\n resolve();\n } catch (err) {\n reject(err);\n }\n });\n }\n }\n }\n}\nasync function hmrApplyUpdates(assets) {\n global.parcelHotUpdate = Object.create(null);\n let scriptsToRemove;\n try {\n // If sourceURL comments aren't supported in eval, we need to load\n // the update from the dev server over HTTP so that stack traces\n // are correct in errors/logs. This is much slower than eval, so\n // we only do it if needed (currently just Safari).\n // https://bugs.webkit.org/show_bug.cgi?id=137297\n // This path is also taken if a CSP disallows eval.\n if (!supportsSourceURL) {\n let promises = assets.map(asset => {\n var _hmrDownload;\n return (_hmrDownload = hmrDownload(asset)) === null || _hmrDownload === void 0 ? void 0 : _hmrDownload.catch(err => {\n // Web extension fix\n if (extCtx && extCtx.runtime && extCtx.runtime.getManifest().manifest_version == 3 && typeof ServiceWorkerGlobalScope != 'undefined' && global instanceof ServiceWorkerGlobalScope) {\n extCtx.runtime.reload();\n return;\n }\n throw err;\n });\n });\n scriptsToRemove = await Promise.all(promises);\n }\n assets.forEach(function (asset) {\n hmrApply(module.bundle.root, asset);\n });\n } finally {\n delete global.parcelHotUpdate;\n if (scriptsToRemove) {\n scriptsToRemove.forEach(script => {\n if (script) {\n var _document$head2;\n (_document$head2 = document.head) === null || _document$head2 === void 0 || _document$head2.removeChild(script);\n }\n });\n }\n }\n}\nfunction hmrApply(bundle /*: ParcelRequire */, asset /*: HMRAsset */) {\n var modules = bundle.modules;\n if (!modules) {\n return;\n }\n if (asset.type === 'css') {\n reloadCSS();\n } else if (asset.type === 'js') {\n let deps = asset.depsByBundle[bundle.HMR_BUNDLE_ID];\n if (deps) {\n if (modules[asset.id]) {\n // Remove dependencies that are removed and will become orphaned.\n // This is necessary so that if the asset is added back again, the cache is gone, and we prevent a full page reload.\n let oldDeps = modules[asset.id][1];\n for (let dep in oldDeps) {\n if (!deps[dep] || deps[dep] !== oldDeps[dep]) {\n let id = oldDeps[dep];\n let parents = getParents(module.bundle.root, id);\n if (parents.length === 1) {\n hmrDelete(module.bundle.root, id);\n }\n }\n }\n }\n if (supportsSourceURL) {\n // Global eval. We would use `new Function` here but browser\n // support for source maps is better with eval.\n (0, eval)(asset.output);\n }\n\n // $FlowFixMe\n let fn = global.parcelHotUpdate[asset.id];\n modules[asset.id] = [fn, deps];\n } else if (bundle.parent) {\n hmrApply(bundle.parent, asset);\n }\n }\n}\nfunction hmrDelete(bundle, id) {\n let modules = bundle.modules;\n if (!modules) {\n return;\n }\n if (modules[id]) {\n // Collect dependencies that will become orphaned when this module is deleted.\n let deps = modules[id][1];\n let orphans = [];\n for (let dep in deps) {\n let parents = getParents(module.bundle.root, deps[dep]);\n if (parents.length === 1) {\n orphans.push(deps[dep]);\n }\n }\n\n // Delete the module. This must be done before deleting dependencies in case of circular dependencies.\n delete modules[id];\n delete bundle.cache[id];\n\n // Now delete the orphans.\n orphans.forEach(id => {\n hmrDelete(module.bundle.root, id);\n });\n } else if (bundle.parent) {\n hmrDelete(bundle.parent, id);\n }\n}\nfunction hmrAcceptCheck(bundle /*: ParcelRequire */, id /*: string */, depsByBundle /*: ?{ [string]: { [string]: string } }*/) {\n if (hmrAcceptCheckOne(bundle, id, depsByBundle)) {\n return true;\n }\n\n // Traverse parents breadth first. All possible ancestries must accept the HMR update, or we'll reload.\n let parents = getParents(module.bundle.root, id);\n let accepted = false;\n while (parents.length > 0) {\n let v = parents.shift();\n let a = hmrAcceptCheckOne(v[0], v[1], null);\n if (a) {\n // If this parent accepts, stop traversing upward, but still consider siblings.\n accepted = true;\n } else {\n // Otherwise, queue the parents in the next level upward.\n let p = getParents(module.bundle.root, v[1]);\n if (p.length === 0) {\n // If there are no parents, then we've reached an entry without accepting. Reload.\n accepted = false;\n break;\n }\n parents.push(...p);\n }\n }\n return accepted;\n}\nfunction hmrAcceptCheckOne(bundle /*: ParcelRequire */, id /*: string */, depsByBundle /*: ?{ [string]: { [string]: string } }*/) {\n var modules = bundle.modules;\n if (!modules) {\n return;\n }\n if (depsByBundle && !depsByBundle[bundle.HMR_BUNDLE_ID]) {\n // If we reached the root bundle without finding where the asset should go,\n // there's nothing to do. Mark as \"accepted\" so we don't reload the page.\n if (!bundle.parent) {\n return true;\n }\n return hmrAcceptCheck(bundle.parent, id, depsByBundle);\n }\n if (checkedAssets[id]) {\n return true;\n }\n checkedAssets[id] = true;\n var cached = bundle.cache[id];\n assetsToDispose.push([bundle, id]);\n if (!cached || cached.hot && cached.hot._acceptCallbacks.length) {\n assetsToAccept.push([bundle, id]);\n return true;\n }\n}\nfunction hmrDispose(bundle /*: ParcelRequire */, id /*: string */) {\n var cached = bundle.cache[id];\n bundle.hotData[id] = {};\n if (cached && cached.hot) {\n cached.hot.data = bundle.hotData[id];\n }\n if (cached && cached.hot && cached.hot._disposeCallbacks.length) {\n cached.hot._disposeCallbacks.forEach(function (cb) {\n cb(bundle.hotData[id]);\n });\n }\n delete bundle.cache[id];\n}\nfunction hmrAccept(bundle /*: ParcelRequire */, id /*: string */) {\n // Execute the module.\n bundle(id);\n\n // Run the accept callbacks in the new version of the module.\n var cached = bundle.cache[id];\n if (cached && cached.hot && cached.hot._acceptCallbacks.length) {\n cached.hot._acceptCallbacks.forEach(function (cb) {\n var assetsToAlsoAccept = cb(function () {\n return getParents(module.bundle.root, id);\n });\n if (assetsToAlsoAccept && assetsToAccept.length) {\n assetsToAlsoAccept.forEach(function (a) {\n hmrDispose(a[0], a[1]);\n });\n\n // $FlowFixMe[method-unbinding]\n assetsToAccept.push.apply(assetsToAccept, assetsToAlsoAccept);\n }\n });\n }\n}","import { createApp, jsx } from '../../dist/jaxs.js'\n\nconst app = createApp()\n\nexport const EyeIcon = () => {\n return (\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"icon icon-tabler icon-tabler-eye\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" stroke-width=\"2\" stroke=\"currentColor\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n <path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"/>\n <path d=\"M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0\" />\n <path d=\"M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6\" />\n </svg>\n )\n}\n\napp.render(<EyeIcon />, '#app')"],"names":[],"version":3,"file":"svg.04290504.js.map","sourceRoot":"/__parcel_source_root/"}
@@ -0,0 +1,11 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8">
5
+ <title>Jaxs integration test</title>
6
+ <script src="/add-remove-root-children.3bb9b3f5.js"></script><script src="/svg.04290504.js" defer=""></script>
7
+ </head>
8
+ <body>
9
+ <main id="app"></main>
10
+ </body>
11
+ </html>
@@ -0,0 +1,11 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8"/>
5
+ <title>Jaxs integration test</title>
6
+ <script type="module" src="./svg.jsx"></script>
7
+ </head>
8
+ <body>
9
+ <main id="app"></main>
10
+ </body>
11
+ </html>
@@ -0,0 +1,15 @@
1
+ import { createApp, jsx } from '../../dist/jaxs.js'
2
+
3
+ const app = createApp()
4
+
5
+ export const EyeIcon = () => {
6
+ return (
7
+ <svg xmlns='http://www.w3.org/2000/svg' class='icon icon-tabler icon-tabler-eye' width='24' height='24' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' fill='none' stroke-linecap='round' stroke-linejoin='round'>
8
+ <path stroke='none' d='M0 0h24v24H0z' fill='none' />
9
+ <path d='M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0' />
10
+ <path d='M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6' />
11
+ </svg>
12
+ )
13
+ }
14
+
15
+ app.render(<EyeIcon />, '#app')
package/dist/jaxs.js CHANGED
@@ -74,6 +74,21 @@ var normalizeValueForKey = (object, key, defaultValue = "") => {
74
74
  return object[key];
75
75
  };
76
76
 
77
+ // src/rendering/dom/svg.ts
78
+ var namespace = "http://www.w3.org/2000/svg";
79
+ var isSvgTag = (tagType) => tagType === "svg";
80
+ var isSvg = (element) => element.namespaceURI === namespace;
81
+ var createSvgNode = (type, attributes, renderKit) => {
82
+ const document = renderKit && renderKit.document || window.document;
83
+ const node = document.createElementNS(namespace, type);
84
+ for (const key in attributes) {
85
+ if (key === "__self" || key === "xmlns")
86
+ continue;
87
+ node.setAttributeNS(null, key, attributes[key]);
88
+ }
89
+ return node;
90
+ };
91
+
77
92
  // src/rendering/templates/text.ts
78
93
  class TextTemplate {
79
94
  value;
@@ -122,14 +137,21 @@ var isTextNode = (child) => {
122
137
  var textNode = (content) => {
123
138
  return new TextTemplate(content);
124
139
  };
140
+ var withSvgFlag = (isSvg2) => (template) => {
141
+ template && (template.isSvg = template.isSvg || isSvg2);
142
+ return template;
143
+ };
125
144
 
126
145
  class Children {
127
146
  collection;
128
147
  parentElement;
129
- constructor(jsxChildren) {
148
+ isSvg;
149
+ constructor(jsxChildren, isSvg2 = false) {
130
150
  this.collection = ensureArray(jsxChildren);
131
151
  this.collection = this.collection.map(replaceTextNodes);
132
152
  this.collection = this.collection.flat();
153
+ this.collection = this.collection.map(withSvgFlag(isSvg2));
154
+ this.isSvg = isSvg2;
133
155
  }
134
156
  render(renderKit, parentElement) {
135
157
  this.parentElement = parentElement;
@@ -154,12 +176,14 @@ class Tag {
154
176
  events;
155
177
  attributes;
156
178
  children;
157
- constructor(tagType, combinedAttributes, children2) {
179
+ isSvg;
180
+ constructor(tagType, combinedAttributes, children2, isSvg2 = false) {
158
181
  this.type = tagType;
159
182
  const { events, attributes } = separateAttrsAndEvents(combinedAttributes);
160
183
  this.events = events;
161
184
  this.attributes = attributes;
162
- this.children = new Children(children2);
185
+ this.isSvg = isSvg2 || isSvgTag(this.type);
186
+ this.children = new Children(children2, this.isSvg);
163
187
  }
164
188
  render(renderKit) {
165
189
  const dom = this.generateDom(renderKit);
@@ -169,10 +193,22 @@ class Tag {
169
193
  return [dom];
170
194
  }
171
195
  generateDom(renderKit) {
196
+ if (this.isSvg) {
197
+ return this.generateSvnDom(renderKit);
198
+ } else {
199
+ return this.generateHtmlDom(renderKit);
200
+ }
201
+ }
202
+ generateHtmlDom(renderKit) {
172
203
  const node = createDecoratedNode(this.type, this.attributes, this.events, renderKit);
173
204
  node.__jsx = this.key();
174
205
  return node;
175
206
  }
207
+ generateSvnDom(renderKit) {
208
+ const node = createSvgNode(this.type, this.attributes, renderKit);
209
+ node.__jsx = this.key();
210
+ return node;
211
+ }
176
212
  key() {
177
213
  return this.attributes.key || this.source() || this.createKey();
178
214
  }
@@ -553,7 +589,7 @@ var createIdMap = (list) => {
553
589
  };
554
590
 
555
591
  // src/rendering/change/instructions/attributes.ts
556
- var compileForAttributes = (source, target) => {
592
+ var compileForAttributes = (source, target, isSvg2 = false) => {
557
593
  const instructions = [];
558
594
  const sourceAttributes = source.attributes;
559
595
  const sourceLength = sourceAttributes.length;
@@ -577,11 +613,12 @@ var compileForAttributes = (source, target) => {
577
613
  }
578
614
  }
579
615
  if (!matchingAttribute) {
580
- instructions.push(removeAttribute(source, target, { name: sourceAttribute.name }));
616
+ instructions.push(removeAttribute(source, target, { name: sourceAttribute.name, isSvg: isSvg2 }));
581
617
  } else if (sourceAttribute.value !== matchingAttribute.value) {
582
618
  instructions.push(updateAttribute(source, target, {
583
619
  name: sourceAttribute.name,
584
- value: matchingAttribute.value
620
+ value: matchingAttribute.value,
621
+ isSvg: isSvg2
585
622
  }));
586
623
  }
587
624
  }
@@ -602,7 +639,8 @@ var compileForAttributes = (source, target) => {
602
639
  if (!matchingAttribute) {
603
640
  instructions.push(addAttribute(source, target, {
604
641
  name: targetAttribute.name,
605
- value: targetAttribute.value
642
+ value: targetAttribute.value,
643
+ isSvg: isSvg2
606
644
  }));
607
645
  }
608
646
  }
@@ -652,6 +690,9 @@ var compileForElement = (source, target) => {
652
690
  const valueInstructions = compileForInputValue(source, target);
653
691
  return attributeInstructions.concat(eventInstructions).concat(valueInstructions);
654
692
  };
693
+ var compileForSvg = (source, target) => {
694
+ return compileForAttributes(source, target, true);
695
+ };
655
696
  var compileForInputValue = (sourceElement, targetElement) => {
656
697
  const instructions = [];
657
698
  if (sourceElement.tagName !== "INPUT") {
@@ -681,7 +722,13 @@ var NodeTypes;
681
722
  })(NodeTypes || (NodeTypes = {}));
682
723
  var compileForNodeGenerator = (compileForCollection) => (source, target) => {
683
724
  let instructions = [];
684
- if (source.nodeType === NodeTypes.ElementNode) {
725
+ if (source.nodeType === NodeTypes.ElementNode && isSvg(source)) {
726
+ const sourceElement = source;
727
+ const targetElement = target;
728
+ const baseInstructions = compileForSvg(sourceElement, targetElement);
729
+ const childrenInstructions = compileForCollection(sourceElement.childNodes, targetElement.childNodes, sourceElement);
730
+ instructions = baseInstructions.concat(childrenInstructions);
731
+ } else if (source.nodeType === NodeTypes.ElementNode) {
685
732
  const sourceElement = source;
686
733
  const targetElement = target;
687
734
  const baseInstructions = compileForElement(sourceElement, targetElement);
@@ -693,13 +740,6 @@ var compileForNodeGenerator = (compileForCollection) => (source, target) => {
693
740
  return instructions;
694
741
  };
695
742
 
696
- // src/debugging.js
697
- var debug = (...message) => {
698
- if (process.env.DEBUG === "true") {
699
- console.log(...message);
700
- }
701
- };
702
-
703
743
  // src/rendering/change/instructions/children.ts
704
744
  var compileChildren = (sourceList, targetList, parent) => {
705
745
  const baseInstructions = [];
@@ -711,46 +751,35 @@ var compileChildren = (sourceList, targetList, parent) => {
711
751
  for (;index < length; index++) {
712
752
  const source = sourceList[index];
713
753
  const target = targetList[index];
714
- debug("\n", "loop index", index, source && source.__jsx, target && target.__jsx);
715
754
  if (target && targetMap.check(target)) {
716
- debug("target", target.__jsx, "index", index);
717
755
  const matchingSource = sourceMap.pullMatch(target);
718
756
  targetMap.clear(target);
719
757
  if (matchingSource.element) {
720
- debug("matching source found for target");
721
758
  if (matchingSource.index !== index) {
722
- debug("moving source", matchingSource.element.__jsx, index);
723
759
  baseInstructions.push(insertNode(matchingSource.element, { parent, index }));
724
760
  }
725
- debug("updating to match target", matchingSource.element.__jsx, matchingSource.element.classList, target.__jsx, target.classList);
726
761
  nodesPairsToDiff.push({
727
762
  source: matchingSource.element,
728
763
  target
729
764
  });
730
765
  } else if (source) {
731
- debug("NO matching source for target but source in slot", source.__jsx);
732
766
  if (targetMap.check(source)) {
733
- debug("adding", target.__jsx, "at", index);
734
767
  baseInstructions.push(insertNode(target, { parent, index }));
735
768
  } else {
736
- debug("replacing", source.__jsx, target.__jsx, "at", index);
737
769
  sourceMap.clear(source);
738
770
  baseInstructions.push(replaceNode(source, target));
739
771
  }
740
772
  } else {
741
- debug("adding target to end", target.__jsx);
742
773
  baseInstructions.push(insertNode(target, { parent, index }));
743
774
  }
744
775
  } else if (source) {
745
776
  const matchingSource = sourceMap.pullMatch(source);
746
777
  if (matchingSource.element) {
747
- debug("removing", source.__jsx);
748
778
  baseInstructions.push(removeNode(source));
749
779
  }
750
780
  }
751
781
  }
752
782
  sourceMap.remaining().forEach(({ element: element2 }) => {
753
- debug("removing", element2.__jsx);
754
783
  baseInstructions.push(removeNode(element2));
755
784
  });
756
785
  const nodeInstructions = nodesPairsToDiff.reduce((collection, { source, target }) => {
@@ -774,7 +803,6 @@ var compileForNode = compileForNodeGenerator(compileChildren);
774
803
  // src/rendering/change.ts
775
804
  var change = (source, target, parent) => {
776
805
  const instructions = compileChildren(source, target, parent);
777
- debug("instructions", instructions.map((instruction) => instruction.type));
778
806
  instructions.forEach((instruction) => {
779
807
  performInstruction(instruction);
780
808
  });
@@ -792,7 +820,6 @@ var changeText2 = (instruction) => {
792
820
  var removeNode2 = (instruction) => {
793
821
  const { source } = instruction;
794
822
  source.remove();
795
- debug("removeNode called on", source.nodeName);
796
823
  };
797
824
  var insertNode2 = (instruction) => {
798
825
  const { target, data } = instruction;
@@ -807,18 +834,24 @@ var insertNode2 = (instruction) => {
807
834
  var replaceNode2 = (instruction) => {
808
835
  const { source, target } = instruction;
809
836
  source.replaceWith(target);
810
- debug("replaceNode called on", source.nodeName, "with", target.nodeName);
811
- debug("parent", source.parentElement);
812
837
  };
813
838
  var removeAttribute2 = (instruction) => {
814
839
  const { source, data } = instruction;
815
- const { name } = data;
816
- source.removeAttribute(name);
840
+ const { name, isSvg: isSvg2 } = data;
841
+ if (isSvg2) {
842
+ source.removeAttributeNS(null, name);
843
+ } else {
844
+ source.removeAttribute(name);
845
+ }
817
846
  };
818
847
  var addAttribute2 = (instruction) => {
819
848
  const { source, data } = instruction;
820
- const { name, value } = data;
821
- source.setAttribute(name, value);
849
+ const { name, value, isSvg: isSvg2 } = data;
850
+ if (isSvg2) {
851
+ source.setAttributeNS(null, name, value);
852
+ } else {
853
+ source.setAttribute(name, value);
854
+ }
822
855
  };
823
856
  var updateAttribute2 = (instruction) => {
824
857
  addAttribute2(instruction);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "jaxs",
3
- "version": "0.2.0",
3
+ "version": "0.3.0",
4
4
  "description": "Modular J/TSX application framework",
5
5
  "module": "src/jaxs.ts",
6
6
  "type": "module",
@@ -28,7 +28,8 @@
28
28
  "html": {
29
29
  "source": [
30
30
  "./cypress/jaxs-apps/add-remove-root-children.html",
31
- "./cypress/jaxs-apps/add-remove-nested-children.html"
31
+ "./cypress/jaxs-apps/add-remove-nested-children.html",
32
+ "./cypress/jaxs-apps/svg.html"
32
33
  ]
33
34
  }
34
35
  },
package/src/debugging.js CHANGED
@@ -1,5 +1,5 @@
1
1
  export const debug = (...message) => {
2
- if (process.env.DEBUG === 'true') {
3
- console.log(...message)
4
- }
2
+ // if (Bun.env.DEBUG === 'true') {
3
+ console.log(...message)
4
+ // }
5
5
  }
@@ -1,9 +1,10 @@
1
- import { ExpandedElement, Instructions } from '../../../types';
1
+ import type { ExpandedElement, Instructions } from '../../../types';
2
2
  import { addAttribute, removeAttribute, updateAttribute } from './generate';
3
3
 
4
4
  export const compileForAttributes = (
5
5
  source: ExpandedElement,
6
6
  target: ExpandedElement,
7
+ isSvg = false,
7
8
  ) => {
8
9
  const instructions = [] as Instructions;
9
10
  const sourceAttributes = source.attributes;
@@ -37,13 +38,14 @@ export const compileForAttributes = (
37
38
 
38
39
  if (!matchingAttribute) {
39
40
  instructions.push(
40
- removeAttribute(source, target, { name: sourceAttribute.name }),
41
+ removeAttribute(source, target, { name: sourceAttribute.name, isSvg, }),
41
42
  );
42
43
  } else if (sourceAttribute.value !== matchingAttribute.value) {
43
44
  instructions.push(
44
45
  updateAttribute(source, target, {
45
46
  name: sourceAttribute.name,
46
47
  value: matchingAttribute.value,
48
+ isSvg,
47
49
  }),
48
50
  );
49
51
  }
@@ -69,6 +71,7 @@ export const compileForAttributes = (
69
71
  addAttribute(source, target, {
70
72
  name: targetAttribute.name,
71
73
  value: targetAttribute.value,
74
+ isSvg,
72
75
  }),
73
76
  );
74
77
  }
@@ -8,7 +8,6 @@ import type {
8
8
  import { insertNode, removeNode, replaceNode } from './generate';
9
9
  import { createIdMap } from './idMap';
10
10
  import { compileForNodeGenerator } from './node';
11
- import { debug } from '../../../debugging';
12
11
 
13
12
  type DiffPair = {
14
13
  source: Dom;
@@ -30,13 +29,13 @@ export const compileChildren = (
30
29
  for (; index < length; index++) {
31
30
  const source = sourceList[index] as ExpandedElement;
32
31
  const target = targetList[index] as ExpandedElement;
33
- debug(
34
- '\n',
35
- 'loop index',
36
- index,
37
- source && source.__jsx,
38
- target && target.__jsx,
39
- );
32
+ // debug(
33
+ // '\n',
34
+ // 'loop index',
35
+ // index,
36
+ // source && source.__jsx,
37
+ // target && target.__jsx,
38
+ // );
40
39
 
41
40
  // This algorithm uses the target as the source of truth, iterating
42
41
  // through it first figuring out what to do. The length could be larger than
@@ -44,47 +43,47 @@ export const compileChildren = (
44
43
  // Part of the goal of this flow is to ensure that insertions happen in
45
44
  // accending order.
46
45
  if (target && targetMap.check(target)) {
47
- debug('target', target.__jsx, 'index', index);
46
+ // debug('target', target.__jsx, 'index', index);
48
47
  const matchingSource = sourceMap.pullMatch(target);
49
48
  targetMap.clear(target); // mark target as resolved
50
49
 
51
50
  if (matchingSource.element) {
52
- debug('matching source found for target');
51
+ // debug('matching source found for target');
53
52
  if (matchingSource.index !== index) {
54
53
  // move source to index
55
- debug('moving source', matchingSource.element.__jsx, index);
54
+ // debug('moving source', matchingSource.element.__jsx, index);
56
55
  baseInstructions.push(
57
56
  insertNode(matchingSource.element, { parent, index }),
58
57
  );
59
58
  }
60
59
  // update element for attribute, event and child changes
61
- debug('updating to match target',
62
- matchingSource.element.__jsx,
63
- matchingSource.element.classList,
64
- target.__jsx,
65
- target.classList
66
- );
60
+ // debug('updating to match target',
61
+ // matchingSource.element.__jsx,
62
+ // matchingSource.element.classList,
63
+ // target.__jsx,
64
+ // target.classList
65
+ // );
67
66
  nodesPairsToDiff.push({
68
67
  source: matchingSource.element,
69
68
  target,
70
69
  });
71
70
  } else if (source) {
72
- debug('NO matching source for target but source in slot', source.__jsx);
71
+ // debug('NO matching source for target but source in slot', source.__jsx);
73
72
 
74
73
  if (targetMap.check(source)) {
75
74
  // the source is somewhere else in the target, so just add this
76
75
  // target element and assume the source will get resolved later.
77
- debug('adding', target.__jsx, 'at', index);
76
+ // debug('adding', target.__jsx, 'at', index);
78
77
  baseInstructions.push(insertNode(target, { parent, index }));
79
78
  } else {
80
79
  // no matching target, but something is in the index/slot ... so swap
81
- debug('replacing', source.__jsx, target.__jsx, 'at', index);
80
+ // debug('replacing', source.__jsx, target.__jsx, 'at', index);
82
81
  sourceMap.clear(source); // resolve source
83
82
  baseInstructions.push(replaceNode(source as Dom, target as Dom));
84
83
  }
85
84
  } else {
86
85
  // extra targets, add these to the end of the parent in order received
87
- debug('adding target to end', target.__jsx);
86
+ // debug('adding target to end', target.__jsx);
88
87
  baseInstructions.push(insertNode(target, { parent, index }));
89
88
  }
90
89
  } else if (source) {
@@ -93,7 +92,7 @@ export const compileChildren = (
93
92
  // if not remove from dom
94
93
  const matchingSource = sourceMap.pullMatch(source);
95
94
  if (matchingSource.element) {
96
- debug('removing', source.__jsx);
95
+ // debug('removing', source.__jsx);
97
96
  baseInstructions.push(removeNode(source));
98
97
  }
99
98
  }
@@ -101,7 +100,7 @@ export const compileChildren = (
101
100
 
102
101
  // deal with unresolved sources
103
102
  sourceMap.remaining().forEach(({ element }) => {
104
- debug('removing', element.__jsx);
103
+ // debug('removing', element.__jsx);
105
104
  baseInstructions.push(removeNode(element));
106
105
  });
107
106
 
@@ -1,4 +1,4 @@
1
- import { ExpandedElement, InputElement, Instructions } from '../../../types';
1
+ import type { ExpandedElement, InputElement, Instructions } from '../../../types';
2
2
  import { changeValue } from './generate';
3
3
  import { compileForAttributes } from './attributes';
4
4
  import { compileForEvents } from './events';
@@ -16,6 +16,13 @@ export const compileForElement = (
16
16
  .concat(valueInstructions);
17
17
  };
18
18
 
19
+ export const compileForSvg = (
20
+ source: ExpandedElement,
21
+ target: ExpandedElement,
22
+ ) => {
23
+ return compileForAttributes(source, target, true);
24
+ }
25
+
19
26
  const compileForInputValue = (
20
27
  sourceElement: ExpandedElement,
21
28
  targetElement: ExpandedElement,
@@ -1,4 +1,4 @@
1
- import { ExpandedElement, Instructions } from '../../../types';
1
+ import type { ExpandedElement, Instructions } from '../../../types';
2
2
  import { addEvent, removeEvent, updateEvent } from './generate';
3
3
 
4
4
  export const compileForEvents = (
@@ -1,6 +1,5 @@
1
- import {
1
+ import type {
2
2
  AttributeInstructionData,
3
- ChangeInstructions,
4
3
  Dom,
5
4
  EventInstructionData,
6
5
  ExpandedElement,
@@ -10,6 +9,7 @@ import {
10
9
  RemoveInstructionData,
11
10
  UpdateEventInstructionData,
12
11
  } from '../../../types';
12
+ import { ChangeInstructions } from '../../../types'
13
13
 
14
14
  export const changeText = (source: Text, target: Text): Instruction => ({
15
15
  source,
@@ -1,6 +1,7 @@
1
1
  import type { Dom, ExpandedElement, Instructions } from '../../../types';
2
- import { compileForElement } from './element';
2
+ import { compileForElement, compileForSvg } from './element';
3
3
  import { compileForText } from './text';
4
+ import { isSvg } from '../../dom/svg'
4
5
 
5
6
  enum NodeTypes {
6
7
  ElementNode = 1,
@@ -11,7 +12,23 @@ export const compileForNodeGenerator =
11
12
  (compileForCollection: any) => (source: Dom, target: Dom) => {
12
13
  let instructions = [] as Instructions;
13
14
 
14
- if (source.nodeType === NodeTypes.ElementNode) {
15
+ if (source.nodeType === NodeTypes.ElementNode &&
16
+ isSvg(source as SVGElement)) {
17
+ const sourceElement = source as ExpandedElement;
18
+ const targetElement = target as ExpandedElement;
19
+ const baseInstructions = compileForSvg(
20
+ sourceElement,
21
+ targetElement
22
+ )
23
+
24
+ const childrenInstructions = compileForCollection(
25
+ sourceElement.childNodes,
26
+ targetElement.childNodes,
27
+ sourceElement,
28
+ );
29
+
30
+ instructions = baseInstructions.concat(childrenInstructions);
31
+ } else if (source.nodeType === NodeTypes.ElementNode) {
15
32
  const sourceElement = source as ExpandedElement;
16
33
  const targetElement = target as ExpandedElement;
17
34
 
@@ -1,4 +1,4 @@
1
- import { Instructions } from '../../../types';
1
+ import type { Instructions } from '../../../types';
2
2
  import { changeText } from './generate';
3
3
 
4
4
  export const compileForText = (source: Text, target: Text) => {