@mistweaverco/mdsvex-shiki 1.1.0 → 1.2.0

package/README.md

@@ -9,7 +9,8 @@ limited in features and customization options.
 We needed a better solution for our SvelteKit projects,
 so we created this package to fill the gap.
 
-<img width="945" height="874" alt="Screenshot" src="https://github.com/user-attachments/assets/c717f559-ae96-4372-a1ac-3eba3d4db340" />
+<img width="794" height="558" alt="Screenshot" src="https://github.com/user-attachments/assets/38250632-432a-4f2a-8722-0ef1e4108f38" />
+
 
 ## Installation
 
@@ -17,19 +18,19 @@ Using your package manager of choice, run:
 
 ```bash
 # npm
-npm install @mistweaverco/mdsvex-shiki@v1.1.0
+npm install @mistweaverco/mdsvex-shiki@v1.1.1
 
 # yarn
-yarn add @mistweaverco/mdsvex-shiki@v1.1.0
+yarn add @mistweaverco/mdsvex-shiki@v1.1.1
 
 # bun
-bun add @mistweaverco/mdsvex-shiki@v1.1.0
+bun add @mistweaverco/mdsvex-shiki@v1.1.1
 
 # pnpm
-pnpm add @mistweaverco/mdsvex-shiki@v1.1.0
+pnpm add @mistweaverco/mdsvex-shiki@v1.1.1
 
 # deno
-deno add npm:@mistweaverco/mdsvex-shiki@v1.1.0
+deno add npm:@mistweaverco/mdsvex-shiki@v1.1.1
 ```
 
 ## Configuration

package/dist/copy-action.cjs

@@ -0,0 +1,71 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __moduleCache = /* @__PURE__ */ new WeakMap;
+var __toCommonJS = (from) => {
+  var entry = __moduleCache.get(from), desc;
+  if (entry)
+    return entry;
+  entry = __defProp({}, "__esModule", { value: true });
+  if (from && typeof from === "object" || typeof from === "function")
+    __getOwnPropNames(from).map((key) => !__hasOwnProp.call(entry, key) && __defProp(entry, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    }));
+  __moduleCache.set(from, entry);
+  return entry;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, {
+      get: all[name],
+      enumerable: true,
+      configurable: true,
+      set: (newValue) => all[name] = () => newValue
+    });
+};
+
+// src/copy-action.ts
+var exports_copy_action = {};
+__export(exports_copy_action, {
+  copyAction: () => copyAction
+});
+module.exports = __toCommonJS(exports_copy_action);
+var copyAction = (node) => {
+  const handleClick = (event) => {
+    const target = event.target;
+    const button = target.closest("button.copy");
+    if (button) {
+      const codeText = button.getAttribute("data-code");
+      if (codeText) {
+        navigator.clipboard.writeText(codeText).then(() => {
+          button.classList.add("copied");
+          setTimeout(() => {
+            button.classList.remove("copied");
+          }, 2000);
+        }).catch((err) => {
+          console.error("Failed to copy code:", err);
+        });
+      } else {
+        const codeBlock = button.closest(".mdsvex-shiki")?.querySelector("code");
+        if (codeBlock) {
+          navigator.clipboard.writeText(codeBlock.textContent || "").then(() => {
+            button.classList.add("copied");
+            setTimeout(() => {
+              button.classList.remove("copied");
+            }, 2000);
+          }).catch((err) => {
+            console.error("Failed to copy code:", err);
+          });
+        }
+      }
+    }
+  };
+  node.addEventListener("click", handleClick);
+  return {
+    destroy() {
+      node.removeEventListener("click", handleClick);
+    }
+  };
+};

package/dist/copy-action.d.ts

@@ -0,0 +1,18 @@
+// Generated by dts-bundle-generator v9.5.1
+
+import { Action } from 'svelte/action';
+
+/**
+ * Svelte action to enable copy button functionality for mdsvex-shiki code blocks.
+ * Apply this action to a container element that contains the code blocks.
+ *
+ * @example
+ * ```svelte
+ * <div use:copyAction>
+ *   {@html content}
+ * </div>
+ * ```
+ */
+export declare const copyAction: Action<HTMLElement>;
+
+export {};

package/dist/copy-action.js

@@ -0,0 +1,41 @@
+// src/copy-action.ts
+var copyAction = (node) => {
+  const handleClick = (event) => {
+    const target = event.target;
+    const button = target.closest("button.copy");
+    if (button) {
+      const codeText = button.getAttribute("data-code");
+      if (codeText) {
+        navigator.clipboard.writeText(codeText).then(() => {
+          button.classList.add("copied");
+          setTimeout(() => {
+            button.classList.remove("copied");
+          }, 2000);
+        }).catch((err) => {
+          console.error("Failed to copy code:", err);
+        });
+      } else {
+        const codeBlock = button.closest(".mdsvex-shiki")?.querySelector("code");
+        if (codeBlock) {
+          navigator.clipboard.writeText(codeBlock.textContent || "").then(() => {
+            button.classList.add("copied");
+            setTimeout(() => {
+              button.classList.remove("copied");
+            }, 2000);
+          }).catch((err) => {
+            console.error("Failed to copy code:", err);
+          });
+        }
+      }
+    }
+  };
+  node.addEventListener("click", handleClick);
+  return {
+    destroy() {
+      node.removeEventListener("click", handleClick);
+    }
+  };
+};
+export {
+  copyAction
+};

package/dist/index.cjs

@@ -4209,8 +4209,7 @@ var exports_src = {};
 __export(exports_src, {
   mdsvexShiki: () => mdsvexShiki,
   defaultShikiOptions: () => defaultShikiOptions,
-  default: () => src_default,
-  copyAction: () => copyAction
+  default: () => src_default
 });
 module.exports = __toCommonJS(exports_src);
 
@@ -4661,45 +4660,6 @@ function transformerNotationWordHighlight(options = {}) {
     return true;
   }, options.matchAlgorithm);
 }
-
-// src/copy-action.ts
-var copyAction = (node) => {
-  const handleClick = (event) => {
-    const target = event.target;
-    const button = target.closest("button.copy");
-    if (button) {
-      const codeText = button.getAttribute("data-code");
-      if (codeText) {
-        navigator.clipboard.writeText(codeText).then(() => {
-          button.classList.add("copied");
-          setTimeout(() => {
-            button.classList.remove("copied");
-          }, 2000);
-        }).catch((err) => {
-          console.error("Failed to copy code:", err);
-        });
-      } else {
-        const codeBlock = button.closest(".mdsvex-shiki")?.querySelector("code");
-        if (codeBlock) {
-          navigator.clipboard.writeText(codeBlock.textContent || "").then(() => {
-            button.classList.add("copied");
-            setTimeout(() => {
-              button.classList.remove("copied");
-            }, 2000);
-          }).catch((err) => {
-            console.error("Failed to copy code:", err);
-          });
-        }
-      }
-    }
-  };
-  node.addEventListener("click", handleClick);
-  return {
-    destroy() {
-      node.removeEventListener("click", handleClick);
-    }
-  };
-};
 // src/utils.ts
 var escapeHTML = (html) => {
   return html.replace(/{/g, "{").replace(/}/g, "}").replace(/`/g, "`");

package/dist/index.d.ts

@@ -1,20 +1,7 @@
 // Generated by dts-bundle-generator v9.5.1
 
 import { BundledLanguage, BundledTheme, CodeToHastOptions } from 'shiki';
-import { Action } from 'svelte/action';
 
-/**
- * Svelte action to enable copy button functionality for mdsvex-shiki code blocks.
- * Apply this action to a container element that contains the code blocks.
- *
- * @example
- * ```svelte
- * <div use:copyAction>
- *   {@html content}
- * </div>
- * ```
- */
-export declare const copyAction: Action<HTMLElement>;
 export type HighlighterOptions = {
 	displayPath?: boolean;
 	displayLanguage?: boolean;

package/dist/index.js

@@ -4634,45 +4634,6 @@ function transformerNotationWordHighlight(options = {}) {
     return true;
   }, options.matchAlgorithm);
 }
-
-// src/copy-action.ts
-var copyAction = (node) => {
-  const handleClick = (event) => {
-    const target = event.target;
-    const button = target.closest("button.copy");
-    if (button) {
-      const codeText = button.getAttribute("data-code");
-      if (codeText) {
-        navigator.clipboard.writeText(codeText).then(() => {
-          button.classList.add("copied");
-          setTimeout(() => {
-            button.classList.remove("copied");
-          }, 2000);
-        }).catch((err) => {
-          console.error("Failed to copy code:", err);
-        });
-      } else {
-        const codeBlock = button.closest(".mdsvex-shiki")?.querySelector("code");
-        if (codeBlock) {
-          navigator.clipboard.writeText(codeBlock.textContent || "").then(() => {
-            button.classList.add("copied");
-            setTimeout(() => {
-              button.classList.remove("copied");
-            }, 2000);
-          }).catch((err) => {
-            console.error("Failed to copy code:", err);
-          });
-        }
-      }
-    }
-  };
-  node.addEventListener("click", handleClick);
-  return {
-    destroy() {
-      node.removeEventListener("click", handleClick);
-    }
-  };
-};
 // src/utils.ts
 var escapeHTML = (html) => {
   return html.replace(/{/g, "{").replace(/}/g, "}").replace(/`/g, "`");
@@ -13929,6 +13890,5 @@ var src_default = mdsvexShiki;
 export {
   mdsvexShiki,
   defaultShikiOptions,
-  src_default as default,
-  copyAction
+  src_default as default
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mistweaverco/mdsvex-shiki",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",
@@ -11,6 +11,11 @@
       "import": "./dist/index.js",
       "require": "./dist/index.cjs"
     },
+    "./copy-action": {
+      "types": "./dist/copy-action.d.ts",
+      "import": "./dist/copy-action.js",
+      "require": "./dist/copy-action.cjs"
+    },
     "./styles.css": "./styles.css"
   },
   "files": [

package/styles.css

@@ -112,7 +112,8 @@
   align-items: center;
   gap: 0.25em;
   max-width: calc(100% - 100px);
-  overflow: hidden;
+  overflow-y: hidden;
+  overflow-x: auto;
   white-space: nowrap;
 }