@mistweaverco/mdsvex-shiki 1.0.16 → 1.0.17

package/README.md

@@ -1,13 +1,35 @@
 # mdsvex-shiki
 
-Supports most [common transformers][shiki-transformers] out of the box.
+A highlighter for mdsvex using Shiki with
+support for most [common transformers][shiki-transformers] out of the box.
+
+Why? Because mdsvex's built-in Prism highlighter is
+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" />
 
 ## Installation
 
-Using bun:
+Using your package manager of choice, run:
 
 ```bash
-bun add @mistweaverco/mdsvex-shiki#v1.0.15
+# npm
+npm install @mistweaverco/mdsvex-shiki@v1.0.16
+
+# yarn
+yarn add @mistweaverco/mdsvex-shiki@v1.0.
+
+# bun
+bun add @mistweaverco/mdsvex-shiki@v1.0.16
+
+# pnpm
+pnpm add @mistweaverco/mdsvex-shiki@v1.0.16
+
+# deno
+deno add npm:@mistweaverco/mdsvex-shiki@v1.0.16
 ```
 
 ## Configuration

package/index.cjs

@@ -4837,20 +4837,20 @@ var mdsvexWrapItUpTransformer = (lang, codeText, disableCopyButton) => {
               tabindex: "0"
             },
             children: [
-              ...children.map((child) => {
+              ...children.flatMap((child) => {
                 if (child.type === "element" && child.tagName === "pre") {
-                  return {
-                    ...child,
-                    children: [
-                      {
-                        type: "element",
-                        tagName: "div",
-                        properties: { class: "header" },
-                        children: headerChildren
-                      },
-                      ...child.children
-                    ]
-                  };
+                  return [
+                    {
+                      type: "element",
+                      tagName: "div",
+                      properties: { class: "header" },
+                      children: headerChildren
+                    },
+                    {
+                      ...child,
+                      children: child.children
+                    }
+                  ];
                 }
                 return child;
               })
@@ -4878,7 +4878,7 @@ var mdsvexWrapItUpTransformer = (lang, codeText, disableCopyButton) => {
   };
 };
 
-// node_modules/shiki/node_modules/@shikijs/types/dist/index.mjs
+// node_modules/@shikijs/types/dist/index.mjs
 class ShikiError extends Error {
   constructor(message) {
     super(message);
@@ -9629,7 +9629,7 @@ function all(parent) {
   }
   return results.join("");
 }
-// node_modules/shiki/node_modules/@shikijs/core/dist/index.mjs
+// node_modules/@shikijs/core/dist/index.mjs
 function resolveColorReplacements(theme, options) {
   const replacements = typeof theme === "string" ? {} : { ...theme.colorReplacements };
   const themeName = typeof theme === "string" ? theme : theme.name;

package/index.js

@@ -4810,20 +4810,20 @@ var mdsvexWrapItUpTransformer = (lang, codeText, disableCopyButton) => {
               tabindex: "0"
             },
             children: [
-              ...children.map((child) => {
+              ...children.flatMap((child) => {
                 if (child.type === "element" && child.tagName === "pre") {
-                  return {
-                    ...child,
-                    children: [
-                      {
-                        type: "element",
-                        tagName: "div",
-                        properties: { class: "header" },
-                        children: headerChildren
-                      },
-                      ...child.children
-                    ]
-                  };
+                  return [
+                    {
+                      type: "element",
+                      tagName: "div",
+                      properties: { class: "header" },
+                      children: headerChildren
+                    },
+                    {
+                      ...child,
+                      children: child.children
+                    }
+                  ];
                 }
                 return child;
               })
@@ -4851,7 +4851,7 @@ var mdsvexWrapItUpTransformer = (lang, codeText, disableCopyButton) => {
   };
 };
 
-// node_modules/shiki/node_modules/@shikijs/types/dist/index.mjs
+// node_modules/@shikijs/types/dist/index.mjs
 class ShikiError extends Error {
   constructor(message) {
     super(message);
@@ -9602,7 +9602,7 @@ function all(parent) {
   }
   return results.join("");
 }
-// node_modules/shiki/node_modules/@shikijs/core/dist/index.mjs
+// node_modules/@shikijs/core/dist/index.mjs
 function resolveColorReplacements(theme, options) {
   const replacements = typeof theme === "string" ? {} : { ...theme.colorReplacements };
   const themeName = typeof theme === "string" ? theme : theme.name;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mistweaverco/mdsvex-shiki",
-  "version": "1.0.16",
+  "version": "1.0.17",
   "type": "module",
   "main": "./index.cjs",
   "module": "./index.js",
@@ -24,7 +24,7 @@
     "prepublishOnly": "bun run build",
     "clear": "rm -f *.js *.cjs *.d.ts",
     "build": "bun build.ts",
-    "publish:npm": "npm publish",
+    "publish:npm": "npm publish --access public",
     "publish:github": "npm publish --registry https://npm.pkg.github.com --access public"
   },
   "keywords": [

package/styles.css

@@ -25,7 +25,7 @@
 }
 
 .mdsvex-shiki {
-  padding: 5px 15px;
+  padding: 12px 20px;
   background-color: var(--shiki-dark-bg);
   position: relative;
   border: 1px solid var(--shiki-dark-border);
@@ -56,6 +56,8 @@
 }
 
 .mdsvex-shiki .header .language {
+  right: 12px;
+  top: 8px;
   color: var(--shiki-dark);
   font-size: 0.875em;
   opacity: 0.7;
@@ -79,7 +81,8 @@
   color: var(--shiki-dark);
   background-color: transparent;
   border: none;
-  padding: 0.25em 0.5em;
+  right: 6px;
+  top: 8px;
   cursor: pointer;
   opacity: 0;
   display: flex;