From 9a03624d321b65571bb8909daa3a589a7dcc456a Mon Sep 17 00:00:00 2001 From: Robbie Averill Date: Wed, 13 Nov 2019 12:41:15 -0800 Subject: [PATCH 01/15] Add section to the readme explaining how to enable non-JavaScript language highlighting --- README.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/README.md b/README.md index 3402472..46f5bc1 100644 --- a/README.md +++ b/README.md @@ -66,3 +66,15 @@ To give the highlighter a window look in a directive mode, also don't forget to In order to visually higlight your code, you need to select a theme from `./node_modules/vue-code-highlight/themes/` and import it somewhere into your component/application. These are just regular prism themes, so feel free to improvise. ![themes](/public/themes.png) + +## Other languages + +Any of the [supported languages](https://prismjs.com/index.html#supported-languages) in Prism may be used. To enable support +for them, you must import them explicitly as well as Prism's markup templating. + +For example, to include PHP highlighting in your application: + +```jsx +import 'prism-es6/components/prism-markup-templating'; +import 'prism-es6/components/prism-php'; +``` From acc8b2abd9c4abd7798deb8f80fe79be7331d302 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20B=C3=ADlek?= Date: Thu, 14 Nov 2019 10:08:13 +0100 Subject: [PATCH 02/15] 0.7.3 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4509f0a..2117bb2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "vue-code-highlight", - "version": "0.7.2", + "version": "0.7.3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 04549d5..58dc276 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-code-highlight", - "version": "0.7.2", + "version": "0.7.3", "author": "Jan Bílek", "email": "honza@elision.design", "url": "https://elision.design/", From ab6ae1c1d8272fc8d24526a22a4a23a84b36ec07 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20B=C3=ADlek?= Date: Thu, 14 Nov 2019 10:09:03 +0100 Subject: [PATCH 03/15] 0.7.4 --- package-lock.json | 2 +- package.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package-lock.json b/package-lock.json index 2117bb2..3f940cb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "vue-code-highlight", - "version": "0.7.3", + "version": "0.7.4", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 58dc276..c518309 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-code-highlight", - "version": "0.7.3", + "version": "0.7.4", "author": "Jan Bílek", "email": "honza@elision.design", "url": "https://elision.design/", From 18b6356e373aa629697f0cf053bfb2654519d6d0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20B=C3=ADlek?= Date: Tue, 28 Jan 2020 20:22:46 +0100 Subject: [PATCH 04/15] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index 46f5bc1..c6167ec 100644 --- a/README.md +++ b/README.md @@ -3,6 +3,7 @@ > Beautiful code syntax highlighting as Vue.js component. ## Examples +https://codesandbox.io/s/vue-code-highlight-example-63h5m ![screenshot](/public/screenshot2.png) ## Usage From 9fa1896a0d7a273a43efa530d3eed6447ce026ba Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20B=C3=ADlek?= Date: Wed, 10 Jun 2020 18:34:17 +0200 Subject: [PATCH 05/15] Update README.md --- README.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index c6167ec..32b318e 100644 --- a/README.md +++ b/README.md @@ -29,10 +29,14 @@ components:{ ```html +
  //Paste your code here
+ 
``` -Your content will be highlighted dynamically when it updates. +Your content will be highlighted dynamically when it updates. + +The `
` tag is required to preserve newline characters (They're stripped by default in Vue).
 
 Window styles are already present in a component mode, but you will need to select and include a theme to properly highlight your code. (See the themes section.)
 

From be2497f1db2673af37e6aacd6dc00c3dbd3726b2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20B=C3=ADlek?= 
Date: Wed, 1 Jul 2020 07:47:00 +0200
Subject: [PATCH 06/15] Update README.md

---
 README.md | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 32b318e..cbacca0 100644
--- a/README.md
+++ b/README.md
@@ -28,12 +28,17 @@ components:{
 ```
 
 ```html
-
+
   
  //Paste your code here
  
``` +**Props** +|Prop |Description +|:--------------|:------------------------------------------| +| **language** | Pass language name you want to highlight. Options: https://prismjs.com/#supported-languages | + Your content will be highlighted dynamically when it updates. The `
` tag is required to preserve newline characters (They're stripped by default in Vue).

From 0660d9871fc8b9ba33807f46c53a1234ffd320ec Mon Sep 17 00:00:00 2001
From: yyuri 
Date: Mon, 24 Aug 2020 19:03:37 +0200
Subject: [PATCH 07/15] Fix: TypeCheck for $slots

Typecheck on to the default slot array to avoid common TypeErrors when the default slot is not a string
---
 src/CodeHighlight.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/CodeHighlight.vue b/src/CodeHighlight.vue
index b7738aa..4f15087 100644
--- a/src/CodeHighlight.vue
+++ b/src/CodeHighlight.vue
@@ -25,9 +25,11 @@ export default {
   },
 
   beforeUpdate() {
-    const newText = this.$slots.default[0].text.replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
-    this.$el.querySelector('code').textContent = newText;
-    Prism.highlightAllUnder(this.$refs.codeBlock);
+    if ( typeof this.$slots.default[0] === 'string' ) {
+      const newText = this.$slots.default[0].replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
+      this.$el.querySelector('code').textContent = newText;
+      Prism.highlightAllUnder(this.$refs.codeBlock);
+    }
   },
 };
 

From 5ccb110f30949750221555b23aaf17f93b6847ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20B=C3=ADlek?= 
Date: Tue, 25 Aug 2020 09:20:12 +0200
Subject: [PATCH 08/15] 0.7.5

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 3f940cb..7a29a60 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.4",
+  "version": "0.7.5",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index c518309..d450c1c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.4",
+  "version": "0.7.5",
   "author": "Jan Bílek",
   "email": "honza@elision.design",
   "url": "https://elision.design/",

From ba60fc0ca3d454334f5692eb1611ba12170e53db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20B=C3=ADlek?= 
Date: Thu, 17 Sep 2020 09:23:44 +0200
Subject: [PATCH 09/15] Fix license

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index d450c1c..2360b5c 100644
--- a/package.json
+++ b/package.json
@@ -5,7 +5,7 @@
   "email": "honza@elision.design",
   "url": "https://elision.design/",
   "private": false,
-  "license": "ISC",
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/elisiondesign/vue-code-highlight"

From 8c2c17dbe5c192af3ef8e33d8ddc738fdfc1ad09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20B=C3=ADlek?= 
Date: Thu, 17 Sep 2020 09:23:55 +0200
Subject: [PATCH 10/15] 0.7.6

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 7a29a60..76e9984 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.5",
+  "version": "0.7.6",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index 2360b5c..8ec84b0 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.5",
+  "version": "0.7.6",
   "author": "Jan Bílek",
   "email": "honza@elision.design",
   "url": "https://elision.design/",

From 88d0941c584ef950fa4039f086d8cc3fcd826f01 Mon Sep 17 00:00:00 2001
From: Art Mary 
Date: Fri, 5 Feb 2021 15:02:55 +0330
Subject: [PATCH 11/15] Responsive in mobile

https://github.com/elisiondesign/vue-code-highlight/issues/21
---
 themes/window.css | 1 +
 1 file changed, 1 insertion(+)

diff --git a/themes/window.css b/themes/window.css
index d38962a..ce962c8 100644
--- a/themes/window.css
+++ b/themes/window.css
@@ -1,5 +1,6 @@
 div pre[class*="language-"] {
   display: inline-block;
+  width: 100%;
   padding-right: 10em;
   padding-top: 3rem;
   border-radius: 6px;

From d162fde552423732bdf9ea90ada5397953195ebd Mon Sep 17 00:00:00 2001
From: Marcos Bazzo 
Date: Sat, 15 May 2021 06:04:30 -0300
Subject: [PATCH 12/15] beforeUpdate Error when using dynamic content (#25)

---
 dist/vue-code-highlight.min.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/dist/vue-code-highlight.min.js b/dist/vue-code-highlight.min.js
index e05b8ad..47bec10 100644
--- a/dist/vue-code-highlight.min.js
+++ b/dist/vue-code-highlight.min.js
@@ -788,9 +788,11 @@ var vueCodeHighlight = (function (exports) {
 	  },
 
 	  beforeUpdate: function beforeUpdate() {
-	    var newText = this.$slots.default[0].text.replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
-	    this.$el.querySelector('code').textContent = newText;
-	    Prism.highlightAllUnder(this.$refs.codeBlock);
+      if(this.$slots.default[0].text){
+	      var newText = this.$slots.default[0].text.replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
+	      this.$el.querySelector('code').textContent = newText;
+	      Prism.highlightAllUnder(this.$refs.codeBlock);
+      }
 	  },
 	};
 

From 5b95c11414ff40d4b654c0f1e78e9d967e4776b3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20Bi=CC=81lek?= 
Date: Sat, 15 May 2021 11:06:02 +0200
Subject: [PATCH 13/15] 0.7.7

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 76e9984..eb39cf3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.6",
+  "version": "0.7.7",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index 8ec84b0..d4b8028 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.6",
+  "version": "0.7.7",
   "author": "Jan Bílek",
   "email": "honza@elision.design",
   "url": "https://elision.design/",

From bd547ef0663727e0ea5256f7baa62735c01f920e Mon Sep 17 00:00:00 2001
From: Marcos Bazzo 
Date: Mon, 17 May 2021 11:03:00 -0300
Subject: [PATCH 14/15] Update vue-code-highlight.esm.js (#26)

---
 dist/vue-code-highlight.esm.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/dist/vue-code-highlight.esm.js b/dist/vue-code-highlight.esm.js
index f7f3e44..a9361a7 100644
--- a/dist/vue-code-highlight.esm.js
+++ b/dist/vue-code-highlight.esm.js
@@ -785,9 +785,11 @@ var CodeHighlight = {render: function(){var _vm=this;var _h=_vm.$createElement;v
   },
 
   beforeUpdate: function beforeUpdate() {
-    var newText = this.$slots.default[0].text.replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
-    this.$el.querySelector('code').textContent = newText;
-    Prism.highlightAllUnder(this.$refs.codeBlock);
+    if(this.$slots.default[0].text){
+	    var newText = this.$slots.default[0].text.replace(/^[\r\n\s]*|[\r\n\s]*$/g, '');
+	    this.$el.querySelector('code').textContent = newText;
+	    Prism.highlightAllUnder(this.$refs.codeBlock);
+    }
   },
 };
 

From 53c3d3476cb7493a05941fa982717e1c9f17122c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jan=20B=C3=ADlek?= 
Date: Mon, 17 May 2021 16:04:30 +0200
Subject: [PATCH 15/15] 0.7.8

---
 package-lock.json | 2 +-
 package.json      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index eb39cf3..eeb59ef 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.7",
+  "version": "0.7.8",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
diff --git a/package.json b/package.json
index d4b8028..7d0f44e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-code-highlight",
-  "version": "0.7.7",
+  "version": "0.7.8",
   "author": "Jan Bílek",
   "email": "honza@elision.design",
   "url": "https://elision.design/",