release: v8.3.0

.prettierignore

@@ -1,2 +1,3 @@
 .firebase
 dist
+src/index.html

CHANGELOG.md

@@ -1,3 +1,20 @@
+<a name="8.3.0"></a>
+
+# [8.3.0](https://github.com/deckgo/demo/compare/v8.2.0...v8.3.0) (2021-05-21)
+
+### Features
+
+- replace deprecated template code with code highlight
+
+### Fix
+
+- local webpack `development` cmd
+- no minification to support code blocks
+
+### Build
+
+- update dependencies
+
 <a name="8.2.0"></a>
 
 # [8.2.0](https://github.com/deckgo/demo/compare/v8.1.0...v8.2.0) (2021-05-16)

package.json

@@ -4,7 +4,7 @@
   "description": "The Progressive Web App alternative for simple presentations",
   "homepage": "https://deckdeckgo.com",
   "scripts": {
-    "start": "webpack serve",
+    "start": "webpack serve --mode development",
     "build": "webpack --mode production"
   },
   "author": {
@@ -18,8 +18,8 @@
   },
   "devDependencies": {
     "clean-webpack-plugin": "^3.0.0",
-    "copy-webpack-plugin": "^8.1.1",
-    "css-loader": "^5.2.4",
+    "copy-webpack-plugin": "^9.0.0",
+    "css-loader": "^5.2.5",
     "deckdeckgo-webpack-plugins": "^2.0.0",
     "file-loader": "^6.2.0",
     "html-webpack-plugin": "^5.3.1",
@@ -28,7 +28,7 @@
     "prettier-quick": "0.0.5",
     "progress-bar-webpack-plugin": "^2.1.0",
     "style-loader": "^2.0.0",
-    "webpack": "^5.37.0",
+    "webpack": "^5.37.1",
     "webpack-cli": "^4.7.0",
     "webpack-dev-server": "^3.11.2",
     "workbox-webpack-plugin": "^6.1.5"
@@ -39,24 +39,23 @@
     "@deckdeckgo/core": "^8.1.6",
     "@deckdeckgo/deck-utils": "^4.0.1",
     "@deckdeckgo/demo": "^2.0.1",
-    "@deckdeckgo/highlight-code": "^2.6.0",
+    "@deckdeckgo/highlight-code": "^3.0.2",
     "@deckdeckgo/kit": "^4.0.0",
     "@deckdeckgo/laser-pointer": "^1.0.1",
     "@deckdeckgo/lazy-img": "^3.0.0",
     "@deckdeckgo/qrcode": "^2.0.1",
     "@deckdeckgo/remote": "^2.0.1",
-    "@deckdeckgo/reveal": "^1.0.0",
-    "@deckdeckgo/slide-author": "^2.2.2",
-    "@deckdeckgo/slide-chart": "^2.2.2",
-    "@deckdeckgo/slide-code": "^3.1.2",
-    "@deckdeckgo/slide-content": "^2.3.0",
-    "@deckdeckgo/slide-gif": "^3.2.2",
-    "@deckdeckgo/slide-playground": "^2.2.2",
-    "@deckdeckgo/slide-poll": "^2.2.3",
-    "@deckdeckgo/slide-qrcode": "^2.2.2",
-    "@deckdeckgo/slide-split": "^2.2.2",
-    "@deckdeckgo/slide-title": "^2.2.4",
-    "@deckdeckgo/slide-youtube": "^2.2.2",
+    "@deckdeckgo/reveal": "^2.0.0",
+    "@deckdeckgo/slide-author": "^2.3.0",
+    "@deckdeckgo/slide-chart": "^2.3.0",
+    "@deckdeckgo/slide-content": "^2.4.0",
+    "@deckdeckgo/slide-gif": "^3.3.0",
+    "@deckdeckgo/slide-playground": "^2.3.0",
+    "@deckdeckgo/slide-poll": "^2.3.0",
+    "@deckdeckgo/slide-qrcode": "^2.3.0",
+    "@deckdeckgo/slide-split": "^2.3.0",
+    "@deckdeckgo/slide-title": "^2.3.0",
+    "@deckdeckgo/slide-youtube": "^2.3.0",
     "@deckdeckgo/social": "^4.0.0",
     "@deckdeckgo/utils": "^2.0.0",
     "@deckdeckgo/youtube": "^2.0.1",

src/index.html

@@ -320,17 +320,30 @@ <h2 slot="question" style="overflow: visible">Interact with your audience with a
                 <h3 slot="title">Or the template for charts</h3>
               </deckgo-slide-chart>
 
-              <deckgo-slide-code
-                src="https://demo.deckdeckgo.com/assets/code/deckdeckgo-slide-code-example.txt"
-                style="
+              <deckgo-slide-title
+                      style="
                   --code-margin-bottom: 6rem;
                   --background: var(--ion-color-dark);
                   --color: var(--ion-color-light);
                   --code-color: var(--ion-color-light);
                 "
               >
-                <h2 slot="title">Showcase your code</h2>
-              </deckgo-slide-code>
+                <h2 slot="title" style="margin-top: 0">Showcase your code</h2>
+                <deckgo-highlight-code highlight-lines="2-5 9" line-numbers="true" slot="content" style="--deckgo-highlight-code-carbon-toolbar-display: none;">
+                  <code slot="code">export class MyComponent {
+
+  private handleClick = () => {
+    alert('Received the button click!');
+  }
+
+  render() {
+    return (
+      <button onclick="{this.handleClick}">Click Me!</button>
+    );
+  }
+}</code>
+                </deckgo-highlight-code>
+              </deckgo-slide-title>
 
               <deckgo-slide-playground src="https://codepen.io/peterpeterparker/pen/dyGbOZm">
                 <h2 slot="title">Or your best playgrounds</h2>

src/index.js

@@ -38,7 +38,6 @@ import {defineCustomElements as deckDeckGoSlideAuthorElements} from '@deckdeckgo
 import {defineCustomElements as deckDeckGoSlideChartElements} from '@deckdeckgo/slide-chart/dist/loader';
 import {defineCustomElements as deckDeckGoSlideYoutubeElements} from '@deckdeckgo/slide-youtube/dist/loader';
 import {defineCustomElements as deckDeckGoSlideSplitElements} from '@deckdeckgo/slide-split/dist/loader';
-import {defineCustomElements as deckDeckGoSlideCodeElements} from '@deckdeckgo/slide-code/dist/loader';
 import {defineCustomElements as deckDeckGoSlideGifElements} from '@deckdeckgo/slide-gif/dist/loader';
 import {defineCustomElements as deckDeckGoSlideQRCodeElements} from '@deckdeckgo/slide-qrcode/dist/loader';
 import {defineCustomElements as deckDeckGoSlidePollElements} from '@deckdeckgo/slide-poll/dist/loader';
@@ -76,7 +75,6 @@ deckDeckGoElements().then(async () => {
   promises.push(deckDeckGoSlideChartElements());
   promises.push(deckDeckGoSlideYoutubeElements());
   promises.push(deckDeckGoSlideSplitElements());
-  promises.push(deckDeckGoSlideCodeElements());
   promises.push(deckDeckGoSlideGifElements());
   promises.push(deckDeckGoSlideQRCodeElements());
   promises.push(deckDeckGoSlidePollElements());

webpack.config.js

@@ -40,7 +40,8 @@ const plugins = [
     inject: true,
     template: './src/index.html',
     path: path.join(__dirname, '../dist/'),
-    filename: 'index.html'
+    filename: 'index.html',
+    minify: false
   }),
   new CopyWebpackPlugin({
     patterns: [