@dinoreic/fez 0.3.0 → 0.4.0

package/src/svelte-cde-adapter.coffee

@@ -0,0 +1,122 @@
+# get node attributes
+getAttributes = (node) ->
+  attrs = {}
+
+  for el in node.attributes
+    if el.name.startsWith('on') && el.value[0] == '('
+      el.value = new Function('arg1, arg2', "(#{el.value})(arg1, arg2)")
+    if el.name.startsWith(':')
+      el.value = new Function("return (#{el.value})").bind(node)()
+      el.name = el.name.replace(':', '')
+    attrs[el.name] = el.value
+
+  if attrs['data-props']
+    attrs = JSON.parse(attrs['data-props'])
+
+  # pass props as json template
+  # <script type="text/template">{...}</script>
+  # <foo-bar data-json-template="true"></foo-bar>
+  if attrs['data-json-template']
+    prev = node.previousSibling
+    if prev?.textContent
+      attrs = JSON.parse(prev.textContent)
+      prev.remove()
+
+    # data = node.previousSibling?.textContent
+    # if data
+    #   attrs = JSON.parse(data)
+
+  attrs
+
+# passes root, use `Svelte(this.root.id)` or `this.root.svelte`  to get node pointer
+# export onMount(instance, list, node) if you want to do stuff on mount
+# connect DOM node to Svelte class instance
+connect = (node, name, klass) ->
+  return unless node.isConnected
+
+  # TODO: get node name
+  # (new klass(target: document.createElement('div'))).nodeName
+  exported = Object.getOwnPropertyNames(klass.prototype)
+  newNode = document.createElement(if exported.includes('nodeNameSpan') then 'span' else 'div')
+  newNode.classList.add('svelte')
+  newNode.classList.add("svelte-#{name}")
+  newNode.id = node.id || "svelte_#{++Svelte.count}"
+
+  # get attributes
+  props = getAttributes(node)
+  props.root ||= newNode
+  props.oldRoot ||= node
+  props.html ||= node.innerHTML
+
+  # has to come after getAttributes
+  node.parentNode.replaceChild(newNode, node);
+
+  # bind node and pass all props as single props attribute
+  exported = Reflect.ownKeys klass.prototype
+  svelteProps = {}
+  svelteProps.fast = true if exported.includes('fast') || exported.includes('FAST')
+  svelteProps.props = props if exported.includes('props')
+  svelteProps.root = newNode if exported.includes('root')
+  svelteProps.self = "Svelte('#{newNode.id}')" if exported.includes('self')
+
+  instance = newNode.svelte = new klass({target: newNode, props: svelteProps})
+  instance.svelteName = name
+
+  # fill slots
+  # slot has to be named sslot (not slot)
+  if slot = newNode.querySelector('sslot')
+    while node.firstChild
+      slot.parentNode.insertBefore(node.lastChild, slot.nextSibling);
+    slot.parentNode.removeChild(slot)
+
+  # in the end, call onmount
+  if instance.onMount
+    list = Array.from node.querySelectorAll(':scope > *')
+    instance.onMount(instance, list, node)
+
+# # #
+
+# passes root, use `Svelte(this.root.id)` or `this.root.svelte`  to get node pointer
+# export onMount(instance, list, node) if you want to do stuff on mount
+# Svelte(node || node_id).toogle()
+Svelte = (name, func) ->
+  if name.nodeName
+    # Svelte(this).close() -> return first parent svelte node
+    while name = name.parentNode
+      return name.svelte if name.svelte
+  else
+    name = '#' + name if name[0] != '#' && name[0] != '.'
+    document.querySelector(name)?.svelte
+
+Svelte.count = 0
+
+# Creates custom DOM element
+Svelte.connect = (name, klass) ->
+  customElements.define name, class extends HTMLElement
+    connectedCallback: ->
+      # no not optimize requestAnimationFrame (try to avoid it)
+      # because events in nested components are sometimes not propagated at all
+      # export let fast
+      # %s-menu-vertical{ fast_connect: true }
+
+      # connect @, name, klass
+      # if @firstChild && (klass.prototype.hasOwnProperty('fast') || @getAttribute('fast_connect') || @getAttribute('data-props') || @getAttribute('data-json-template'))
+      #   connect @, name, klass
+      # else
+      #   requestAnimationFrame =>
+      #     connect @, name, klass
+
+      if document.readyState == 'loading'
+        document.addEventListener 'DOMContentLoaded',
+          => connect(@, name, klass)
+        , once: true
+      else
+        connect(@, name, klass)
+
+# Creates HTML tag
+Svelte.tag = (tag, opts = {}, html = '') ->
+  json = JSON.stringify(opts).replaceAll("'", '&apos;')
+  "<#{tag} data-props='#{json}'>#{html}</#{tag}>"
+
+Svelte.bind = Svelte.connect
+window.Svelte = Svelte

package/dist/log.js

@@ -1,5 +0,0 @@
-(()=>{var u=o=>{let a=o.split(/(<\/?[^>]+>)/g).map(i=>i.trim()).filter(i=>i),n=0,t=[];for(let i=0;i<a.length;i++){let e=a[i],s=a[i+1],p=a[i+2];if(e.startsWith("<"))if(!e.startsWith("</")&&!e.endsWith("/>")&&s&&!s.startsWith("<")&&p&&p.startsWith("</")){let r=Math.max(0,n);t.push("  ".repeat(r)+e+s+p),i+=2}else if(e.startsWith("</")){n--;let r=Math.max(0,n);t.push("  ".repeat(r)+e)}else if(e.endsWith("/>")||e.includes(" />")){let r=Math.max(0,n);t.push("  ".repeat(r)+e)}else{let r=Math.max(0,n);t.push("  ".repeat(r)+e),n++}else if(e){let r=Math.max(0,n);t.push("  ".repeat(r)+e)}}return t.join(`
-`)},c=(()=>{let o=[],a=[],n=0;return t=>{if(!document.body){window.requestAnimationFrame(()=>c(t));return}t instanceof Node&&(t=u(t.outerHTML));let i=typeof t;t===void 0&&(t="undefined"),t===null&&(t="null"),Array.isArray(t)?i="array":typeof t=="object"&&t!==null&&(i="object"),typeof t!="string"&&(t=JSON.stringify(t,(r,l)=>typeof l=="function"?String(l):l,2).replaceAll("<","&lt;")),t=t.trim(),o.push(t+`
-
-type: ${i}`),a.push(i);let e=document.getElementById("dump-dialog");e||(e=document.body.appendChild(document.createElement("div")),e.id="dump-dialog",e.style.cssText="position:fixed;top:30px;left:30px;right:50px;bottom:50px;background:#fff;border:1px solid#333;box-shadow:0 0 10px rgba(0,0,0,0.5);padding:20px;overflow:auto;z-index:9999;font:13px/1.4 monospace;white-space:pre");let s=parseInt(localStorage.getItem("_LOG_INDEX"));!isNaN(s)&&s>=0&&s<o.length?n=s:n=o.length-1;let p=()=>{let r=o.map((l,d)=>{let f="#f0f0f0";return d!==n&&(a[d]==="object"?f="#d6e3ef":a[d]==="array"&&(f="#d8d5ef")),`<button style="padding:4px 8px;margin:0;cursor:pointer;background:${d===n?"#333":f};color:${d===n?"#fff":"#000"}" data-index="${d}">${d+1}</button>`}).join("");e.innerHTML='<div style="display:flex;flex-direction:column;height:100%"><div style="display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px"><div style="display:flex;flex-wrap:wrap;gap:4px;flex:1;margin-right:10px">'+r+'</div><button style="padding:4px 8px;cursor:pointer;flex-shrink:0">&times;</button></div><xmp style="flex:1;overflow:auto;margin:0;padding:0;color:#000;background:#fff;font-size:14px;line-height:22px">'+o[n]+"</xmp></div>",e.querySelector('button[style*="flex-shrink:0"]').onclick=()=>e.remove(),e.querySelectorAll("button[data-index]").forEach(l=>{l.onclick=()=>{n=parseInt(l.dataset.index),localStorage.setItem("_LOG_INDEX",n),p()}})};p()}})();typeof window<"u"&&(window.LOG=c,window.LOG_PP=u);var x=c;})();
-//# sourceMappingURL=log.js.map

package/dist/log.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../src/log.js"],
-  "sourcesContent": ["// pretty print HTML\nconst LOG_PP = (html) => {\n  const parts = html\n    .split(/(<\\/?[^>]+>)/g)\n    .map(p => p.trim())\n    .filter(p => p);\n\n  let indent = 0;\n  const lines = [];\n\n  for (let i = 0; i < parts.length; i++) {\n    const part = parts[i];\n    const nextPart = parts[i + 1];\n    const nextNextPart = parts[i + 2];\n\n    // Check if it's a tag\n    if (part.startsWith('<')) {\n      // Check if this is an opening tag followed by text and then its closing tag\n      if (!part.startsWith('</') && !part.endsWith('/>') && nextPart && !nextPart.startsWith('<') && nextNextPart && nextNextPart.startsWith('</')) {\n        // Combine them on one line\n        const actualIndent = Math.max(0, indent);\n        lines.push('  '.repeat(actualIndent) + part + nextPart + nextNextPart);\n        i += 2; // Skip the next two parts\n      }\n      // Closing tag\n      else if (part.startsWith('</')) {\n        indent--;\n        const actualIndent = Math.max(0, indent);\n        lines.push('  '.repeat(actualIndent) + part);\n      }\n      // Self-closing tag\n      else if (part.endsWith('/>') || part.includes(' />')) {\n        const actualIndent = Math.max(0, indent);\n        lines.push('  '.repeat(actualIndent) + part);\n      }\n      // Opening tag\n      else {\n        const actualIndent = Math.max(0, indent);\n        lines.push('  '.repeat(actualIndent) + part);\n        indent++;\n      }\n    }\n    // Text node\n    else if (part) {\n      const actualIndent = Math.max(0, indent);\n      lines.push('  '.repeat(actualIndent) + part);\n    }\n  }\n\n  return lines.join('\\n');\n}\n\nconst LOG = (() => {\n  const logs = [];\n  const logTypes = []; // Track the original type of each log\n  let currentIndex = 0;\n\n  return o => {\n    if (!document.body) {\n      window.requestAnimationFrame( () => LOG(o) )\n      return\n    }\n\n    if (o instanceof Node) {\n      o = LOG_PP(o.outerHTML)\n    }\n\n    // Store the original type\n    let originalType = typeof o;\n\n    if (o === undefined) { o = 'undefined' }\n    if (o === null) { o = 'null' }\n\n    if (Array.isArray(o)) {\n      originalType = 'array';\n    } else if (typeof o === 'object' && o !== null) {\n      originalType = 'object';\n    }\n\n    if (typeof o != 'string') {\n      o = JSON.stringify(o, (key, value) => {\n        if (typeof value === 'function') {\n          return String(value);\n        }\n        return value;\n      }, 2).replaceAll('<', '&lt;')\n    }\n\n    o = o.trim()\n\n    logs.push(o + `\\n\\ntype: ${originalType}`);\n    logTypes.push(originalType);\n\n    let d = document.getElementById('dump-dialog');\n    if (!d) {\n      d = document.body.appendChild(document.createElement('div'));\n      d.id = 'dump-dialog';\n      d.style.cssText =\n        'position:fixed;top:30px;left:30px;right:50px;bottom:50px;' +\n        'background:#fff;border:1px solid#333;box-shadow:0 0 10px rgba(0,0,0,0.5);' +\n        'padding:20px;overflow:auto;z-index:9999;font:13px/1.4 monospace;white-space:pre';\n    }\n\n    // Check if we have a saved index and it's still valid\n    const savedIndex = parseInt(localStorage.getItem('_LOG_INDEX'));\n    if (!isNaN(savedIndex) && savedIndex >= 0 && savedIndex < logs.length) {\n      currentIndex = savedIndex;\n    } else {\n      currentIndex = logs.length - 1;\n    }\n\n    const renderContent = () => {\n      const buttons = logs.map((_, i) => {\n        let bgColor = '#f0f0f0'; // default\n        if (i !== currentIndex) {\n          if (logTypes[i] === 'object') {\n            bgColor = '#d6e3ef'; // super light blue\n          } else if (logTypes[i] === 'array') {\n            bgColor = '#d8d5ef'; // super light indigo\n          }\n        }\n        return `<button style=\"padding:4px 8px;margin:0;cursor:pointer;background:${i === currentIndex ? '#333' : bgColor};color:${i === currentIndex ? '#fff' : '#000'}\" data-index=\"${i}\">${i + 1}</button>`\n      }).join('');\n\n      d.innerHTML =\n        '<div style=\"display:flex;flex-direction:column;height:100%\">' +\n        '<div style=\"display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px\">' +\n        '<div style=\"display:flex;flex-wrap:wrap;gap:4px;flex:1;margin-right:10px\">' + buttons + '</div>' +\n        '<button style=\"padding:4px 8px;cursor:pointer;flex-shrink:0\">&times;</button>' +\n        '</div>' +\n        '<xmp style=\"flex:1;overflow:auto;margin:0;padding:0;color:#000;background:#fff;font-size:14px;line-height:22px\">' + logs[currentIndex] + '</xmp>' +\n        '</div>';\n\n      d.querySelector('button[style*=\"flex-shrink:0\"]').onclick = () => d.remove();\n\n      d.querySelectorAll('button[data-index]').forEach(btn => {\n        btn.onclick = () => {\n          currentIndex = parseInt(btn.dataset.index);\n          localStorage.setItem('_LOG_INDEX', currentIndex);\n          renderContent();\n        };\n      });\n    };\n\n    renderContent();\n  };\n})();\n\nif (typeof window !== 'undefined') {\n  window.LOG = LOG\n  window.LOG_PP = LOG_PP\n}\n\nexport default LOG\n"],
-  "mappings": "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",
-  "names": ["LOG_PP", "html", "parts", "p", "indent", "lines", "part", "nextPart", "nextNextPart", "actualIndent", "LOG", "logs", "logTypes", "currentIndex", "o", "originalType", "key", "value", "d", "savedIndex", "renderContent", "buttons", "_", "i", "bgColor", "btn", "log_default"]
-}

package/src/log.js

@@ -1,154 +0,0 @@
-// pretty print HTML
-const LOG_PP = (html) => {
-  const parts = html
-    .split(/(<\/?[^>]+>)/g)
-    .map(p => p.trim())
-    .filter(p => p);
-
-  let indent = 0;
-  const lines = [];
-
-  for (let i = 0; i < parts.length; i++) {
-    const part = parts[i];
-    const nextPart = parts[i + 1];
-    const nextNextPart = parts[i + 2];
-
-    // Check if it's a tag
-    if (part.startsWith('<')) {
-      // Check if this is an opening tag followed by text and then its closing tag
-      if (!part.startsWith('</') && !part.endsWith('/>') && nextPart && !nextPart.startsWith('<') && nextNextPart && nextNextPart.startsWith('</')) {
-        // Combine them on one line
-        const actualIndent = Math.max(0, indent);
-        lines.push('  '.repeat(actualIndent) + part + nextPart + nextNextPart);
-        i += 2; // Skip the next two parts
-      }
-      // Closing tag
-      else if (part.startsWith('</')) {
-        indent--;
-        const actualIndent = Math.max(0, indent);
-        lines.push('  '.repeat(actualIndent) + part);
-      }
-      // Self-closing tag
-      else if (part.endsWith('/>') || part.includes(' />')) {
-        const actualIndent = Math.max(0, indent);
-        lines.push('  '.repeat(actualIndent) + part);
-      }
-      // Opening tag
-      else {
-        const actualIndent = Math.max(0, indent);
-        lines.push('  '.repeat(actualIndent) + part);
-        indent++;
-      }
-    }
-    // Text node
-    else if (part) {
-      const actualIndent = Math.max(0, indent);
-      lines.push('  '.repeat(actualIndent) + part);
-    }
-  }
-
-  return lines.join('\n');
-}
-
-const LOG = (() => {
-  const logs = [];
-  const logTypes = []; // Track the original type of each log
-  let currentIndex = 0;
-
-  return o => {
-    if (!document.body) {
-      window.requestAnimationFrame( () => LOG(o) )
-      return
-    }
-
-    if (o instanceof Node) {
-      o = LOG_PP(o.outerHTML)
-    }
-
-    // Store the original type
-    let originalType = typeof o;
-
-    if (o === undefined) { o = 'undefined' }
-    if (o === null) { o = 'null' }
-
-    if (Array.isArray(o)) {
-      originalType = 'array';
-    } else if (typeof o === 'object' && o !== null) {
-      originalType = 'object';
-    }
-
-    if (typeof o != 'string') {
-      o = JSON.stringify(o, (key, value) => {
-        if (typeof value === 'function') {
-          return String(value);
-        }
-        return value;
-      }, 2).replaceAll('<', '&lt;')
-    }
-
-    o = o.trim()
-
-    logs.push(o + `\n\ntype: ${originalType}`);
-    logTypes.push(originalType);
-
-    let d = document.getElementById('dump-dialog');
-    if (!d) {
-      d = document.body.appendChild(document.createElement('div'));
-      d.id = 'dump-dialog';
-      d.style.cssText =
-        'position:fixed;top:30px;left:30px;right:50px;bottom:50px;' +
-        'background:#fff;border:1px solid#333;box-shadow:0 0 10px rgba(0,0,0,0.5);' +
-        'padding:20px;overflow:auto;z-index:9999;font:13px/1.4 monospace;white-space:pre';
-    }
-
-    // Check if we have a saved index and it's still valid
-    const savedIndex = parseInt(localStorage.getItem('_LOG_INDEX'));
-    if (!isNaN(savedIndex) && savedIndex >= 0 && savedIndex < logs.length) {
-      currentIndex = savedIndex;
-    } else {
-      currentIndex = logs.length - 1;
-    }
-
-    const renderContent = () => {
-      const buttons = logs.map((_, i) => {
-        let bgColor = '#f0f0f0'; // default
-        if (i !== currentIndex) {
-          if (logTypes[i] === 'object') {
-            bgColor = '#d6e3ef'; // super light blue
-          } else if (logTypes[i] === 'array') {
-            bgColor = '#d8d5ef'; // super light indigo
-          }
-        }
-        return `<button style="padding:4px 8px;margin:0;cursor:pointer;background:${i === currentIndex ? '#333' : bgColor};color:${i === currentIndex ? '#fff' : '#000'}" data-index="${i}">${i + 1}</button>`
-      }).join('');
-
-      d.innerHTML =
-        '<div style="display:flex;flex-direction:column;height:100%">' +
-        '<div style="display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px">' +
-        '<div style="display:flex;flex-wrap:wrap;gap:4px;flex:1;margin-right:10px">' + buttons + '</div>' +
-        '<button style="padding:4px 8px;cursor:pointer;flex-shrink:0">&times;</button>' +
-        '</div>' +
-        '<xmp style="flex:1;overflow:auto;margin:0;padding:0;color:#000;background:#fff;font-size:14px;line-height:22px">' + logs[currentIndex] + '</xmp>' +
-        '</div>';
-
-      d.querySelector('button[style*="flex-shrink:0"]').onclick = () => d.remove();
-
-      d.querySelectorAll('button[data-index]').forEach(btn => {
-        btn.onclick = () => {
-          currentIndex = parseInt(btn.dataset.index);
-          localStorage.setItem('_LOG_INDEX', currentIndex);
-          renderContent();
-        };
-      });
-    };
-
-    renderContent();
-  };
-})();
-
-if (typeof window !== 'undefined') {
-  window.LOG = LOG
-  window.LOG_PP = LOG_PP
-}
-
-export default LOG