npm - @tomjs/vite-plugin-vscode - Versions diffs - 2.5.4 → 2.5.5 - Mend

@tomjs/vite-plugin-vscode 2.5.4 → 2.5.5

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 (12) hide show

package/dist/webview.mjs ADDED Viewed

@@ -0,0 +1,207 @@
+// src/webview/template.html
+var template_default = `<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <style>
+      html,
+      body {
+        width: 100%;
+        height: 100%;
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+      }
+      #webview-patch-iframe {
+        width: 100%;
+        height: 100%;
+        border: none;
+      }
+      .outer {
+        width: 100%;
+        height: 100%;
+        overflow: hidden;
+      }
+    </style>
+    <script type="module" id="webview-patch">
+      const TAG = '[@tomjs:vscode:extension] ';
+      function onDomReady(callback, doc) {
+        const _doc = doc || document;
+        if (_doc.readyState === 'interactive' || _doc.readyState === 'complete') {
+          callback();
+        } else {
+          _doc.addEventListener('DOMContentLoaded', callback);
+        }
+      }
+      let vsCodeApi;
+      function getApi() {
+        if (vsCodeApi) return vsCodeApi;
+        return (vsCodeApi = acquireVsCodeApi());
+      }
+      function sendInitData(iframe) {
+        console.log(TAG + 'init data');
+        const dataset = {};
+        Object.keys(document.body.dataset).forEach(key => {
+          dataset[key] = document.body.dataset[key];
+        });
+        iframe.contentWindow.postMessage(
+          {
+            type: '[vscode:extension]:init',
+            data: {
+              state: getApi().getState(),
+              style: document.getElementById('_defaultStyles').innerHTML,
+              root: {
+                cssText: document.documentElement.style.cssText,
+              },
+              body: {
+                dataset: dataset,
+                className: document.body.className,
+                role: document.body.getAttribute('role'),
+              },
+            },
+          },
+          '*',
+        );
+      }
+      function observeAttributeChanges(element, attributeName, callback) {
+        const observer = new MutationObserver(function (mutationsList) {
+          for (let mutation of mutationsList) {
+            if (mutation.type === 'attributes' && mutation.attributeName === attributeName) {
+              callback(mutation.target.getAttribute(attributeName));
+            }
+          }
+        });
+        observer.observe(element, { attributes: true });
+        return observer;
+      }
+      // message handler
+      let iframeLoaded = false;
+      const cacheMessages = [];
+      function handleMessage(e) {
+        const iframe = document.getElementById('webview-patch-iframe');
+        if (!iframeLoaded || !iframe) {
+          return;
+        }
+        if (e.origin.startsWith('vscode-webview://')) {
+          iframe.contentWindow.postMessage(e.data, '*');
+        } else if ('{{serverUrl}}'.startsWith(e.origin)) {
+          const { type, data } = e.data;
+          console.log(TAG + ' received:', e.data);
+          if (type === '[vscode:client]:postMessage') {
+            getApi().postMessage(data);
+          } else if (type === '[vscode:client]:getState') {
+            iframe.contentWindow.postMessage(
+              {
+                type: '[vscode:client]:getState',
+                data: getApi().getState(),
+              },
+              '*',
+            );
+          } else if (type === '[vscode:client]:setState') {
+            getApi().setState(data);
+          }
+        }
+      }
+      window.addEventListener('message', function (event) {
+        if (event.origin.startsWith('vscode-webview://')) {
+          cacheMessages.push(event);
+          return;
+        }
+        handleMessage(event);
+      });
+      let isCacheWorking = false;
+      setInterval(() => {
+        if (isCacheWorking) {
+          return;
+        }
+        isCacheWorking = true;
+        if (iframeLoaded) {
+          let event = cacheMessages.shift();
+          while (event) {
+            handleMessage(event);
+            event = cacheMessages.shift();
+          }
+        }
+        isCacheWorking = false;
+      }, 50);
+      onDomReady(function () {
+        /**  @type {HTMLIFrameElement} */
+        const iframe = document.getElementById('webview-patch-iframe');
+        observeAttributeChanges(document.body, 'class', function (className) {
+          sendInitData(iframe);
+        });
+        onDomReady(function () {
+          iframeLoaded = true;
+          sendInitData(iframe);
+        }, iframe.contentDocument);
+        iframe.addEventListener('load', function (e) {
+          iframeLoaded = true;
+          let interval = setInterval(() => {
+            try {
+              if (document.getElementById('_defaultStyles')) {
+                sendInitData(iframe);
+                // addListeners(iframe);
+                clearInterval(interval);
+                return;
+              }
+            } catch (e) {
+              clearInterval(interval);
+              console.error(e);
+            }
+          }, 10);
+        });
+      });
+    </script>
+  </head>
+  <body>
+    <div class="outer">
+      <iframe
+        id="webview-patch-iframe"
+        frameborder="0"
+        sandbox="allow-scripts allow-same-origin allow-forms allow-pointer-lock allow-downloads"
+        allow="cross-origin-isolated; autoplay; clipboard-read; clipboard-write"
+        src="{{serverUrl}}"
+      ></iframe>
+    </div>
+  </body>
+</html>
+`;
+// src/webview/webview.ts
+function getHtml(options) {
+  const opts = {
+    serverUrl: ""
+  };
+  if (typeof options === "string") {
+    opts.serverUrl = options;
+  } else {
+    Object.assign(opts, options);
+  }
+  return template_default.replace(new RegExp("{{serverUrl}}", "g"), opts.serverUrl);
+}
+var webview_default = getHtml;
+export {
+  webview_default as default,
+  getHtml
+};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@tomjs/vite-plugin-vscode",
-  "version": "2.5.4",
+  "version": "2.5.5",
   "description": "Use vue/react to develop 'vscode extension webview', supporting esm/cjs",
   "keywords": [
     "vite",