svelte-highlight-switcher - npm Package Compare versions

Comparing version 0.0.1 to 1.0.0

package.json

 {
   "name": "svelte-highlight-switcher",
-  "description": "",
-  "version": "0.0.1",
+  "description": "📍 Safe svelte-highlight dynamic style switching",
+  "version": "1.0.0",
   "main": "dist/index.js",
@@ -30,3 +30,9 @@ "type": "module",
   },
-  "keywords": [],
+  "keywords": [
+    "css",
+    "highlight",
+    "html",
+    "style",
+    "svelte"
+  ],
   "prettier": "@jill64/prettier-config",
@@ -49,16 +55,16 @@ "scripts": {
   "devDependencies": {
-    "@jill64/eslint-config-svelte": "0.0.7",
-    "@jill64/playwright-config": "0.0.1",
-    "@jill64/prettier-config": "0.0.2",
+    "@jill64/eslint-config-svelte": "1.0.0",
+    "@jill64/playwright-config": "1.0.0",
+    "@jill64/prettier-config": "1.0.0",
     "@jill64/sentry-sveltekit-cloudflare": "1.5.0",
-    "@jill64/svelte-dark-theme": "^2.2.4",
+    "@jill64/svelte-dark-theme": "2.2.11",
     "@playwright/test": "1.40.1",
-    "@sveltejs/adapter-cloudflare": "2.3.3",
-    "@sveltejs/kit": "1.27.6",
+    "@sveltejs/adapter-cloudflare": "2.3.4",
+    "@sveltejs/kit": "1.27.7",
     "svelte": "4.2.8",
     "svelte-highlight": "7.4.2",
-    "typescript": "5.3.2",
-    "vite": "5.0.4",
-    "vitest": "0.34.6"
+    "typescript": "5.3.3",
+    "vite": "5.0.6",
+    "vitest": "1.0.2"
   }
 }

README.md

@@ -5,6 +5,44 @@ <!----- BEGIN GHOST DOCS HEADER ----->
 
-[![npm-version](https://img.shields.io/npm/v/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-license](https://img.shields.io/npm/l/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-download-month](https://img.shields.io/npm/dm/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-min-size](https://img.shields.io/bundlephobia/min/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![ci.yml](https://github.com/jill64/svelte-highlight-switcher/actions/workflows/ci.yml/badge.svg)](https://github.com/jill64/svelte-highlight-switcher/actions/workflows/ci.yml)
+[![npm-version](https://img.shields.io/npm/v/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-license](https://img.shields.io/npm/l/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-download-month](https://img.shields.io/npm/dm/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![npm-min-size](https://img.shields.io/bundlephobia/min/svelte-highlight-switcher)](https://npmjs.com/package/svelte-highlight-switcher) [![ci.yml](https://github.com/jill64/svelte-highlight-switcher/actions/workflows/ci.yml/badge.svg)](https://github.com/jill64/svelte-highlight-switcher/actions/workflows/ci.yml) [![website](https://img.shields.io/website?up_message=working&down_message=down&url=https%3A%2F%2Fsvelte-highlight-switcher.jill64.dev)](https://svelte-highlight-switcher.jill64.dev)
 
 📍 Safe svelte-highlight dynamic style switching
 
+## [Demo](https://svelte-highlight-switcher.jill64.dev)
+
 <!----- END GHOST DOCS HEADER ----->
+
+Hides the use of `@html` and reduces the risk of XSS.
+
+## Installation
+
+```sh
+npm i svelte-highlight-switcher
+```
+
+## Example
+
+```svelte
+<script>
+  import { HighlightSwitcher } from 'svelte-highlight-switcher'
+
+  let isDarkMode = false
+</script>
+
+<HighlightSwitcher name={isDarkMode ? 'githubDark' : 'github'} />
+```
+
+↓ This is equivalent to the following code
+
+```svelte
+<script>
+  import * as styles from 'svelte-highlight/styles'
+
+  let isDarkMode = false
+</script>
+
+<svelte:head>
+  {@html isDarkMode ? styles['githubDark'] : styles['github']}
+</svelte:head>
+```
+
+As long as the contents of [`svelte-highlight/styles`](https://github.com/metonym/svelte-highlight#svelte-highlight) are secure, there is no risk of XSS.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5888

increased by22.51%

Number of low quality alerts

0

decreased by-100%

Number of lines in readme file

48

increased by380%

No dependency changes