diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3ac1d28c0..1bc7bcc58 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -28,11 +28,12 @@
### Web Components: New
-- markdown: v1.1.0 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/markdown/CHANGELOG.md))
+- markdown: v2.0.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/markdown/CHANGELOG.md))
### Web Components
- core: v8.1.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/core/CHANGELOG.md))
+- highlight-code: v2.2.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/highlight-code/CHANGELOG.md))
- lazy-img: v3.0.0 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/webcomponents/lazy-img/CHANGELOG.md))
### Others: New
@@ -43,8 +44,9 @@
- deck-utils: v3.2.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/utils/deck/CHANGELOG.md))
- slide-utils: v2.6.1 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/utils/slide/CHANGELOG.md))
-- starter kit: v7.1.1 ([CHANGELOG](https://github.com/deckgo/starter-kit/blob/master/CHANGELOG.md))
-- studio kit: v7.1.1 ([CHANGELOG](https://github.com/deckgo/studio-kit/blob/master/CHANGELOG.md))
+- starter kit: v7.1.2 ([CHANGELOG](https://github.com/deckgo/starter-kit/blob/master/CHANGELOG.md))
+- studio kit: v7.1.2 ([CHANGELOG](https://github.com/deckgo/studio-kit/blob/master/CHANGELOG.md))
+- utils: v1.7.0 ([CHANGELOG](https://github.com/deckgo/deckdeckgo/blob/master/utils/utils/CHANGELOG.md))
diff --git a/README.md b/README.md
index e399b10a6..eb8307b58 100644
--- a/README.md
+++ b/README.md
@@ -112,8 +112,8 @@ Are you interested to contribute to our open source project? That would be aweso
| **Cloud** | |  | [`README`](cloud/README.md) | [`CHANGELOG`](cloud/CHANGELOG.md) |
| **Gatsby plugin highlight code** | | [](https://www.npmjs.com/package/gatsby-remark-highlight-code) | [`Repo`](https://github.com/deckgo/gatsby-remark-highlight-code/) | [`CHANGELOG`](https://github.com/deckgo/gatsby-remark-highlight-code/blob/master/CHANGELOG.md) |
| **Infrastructure** | | | [`README`](infra/README.md) | |
-| **Starter kit** | |  | [`Repo`](http://github.com/deckgo/starter-kit/) | [`CHANGELOG`](https://github.com/deckgo/starter-kit/blob/master/CHANGELOG.md) |
-| **Studio kit** | |  | [`Repo`](http://github.com/deckgo/studio-kit/) | [`CHANGELOG`](https://github.com/deckgo/studio-kit/blob/master/CHANGELOG.md) |
+| **Starter kit** | |  | [`Repo`](http://github.com/deckgo/starter-kit/) | [`CHANGELOG`](https://github.com/deckgo/starter-kit/blob/master/CHANGELOG.md) |
+| **Studio kit** | |  | [`Repo`](http://github.com/deckgo/studio-kit/) | [`CHANGELOG`](https://github.com/deckgo/studio-kit/blob/master/CHANGELOG.md) |
| **WAI Lambda** | | | [`Repo`](https://github.com/deckgo/wai-lambda) | |
| **Webpack plugins** | [`deckdeckgo-webpack-plugins`](https://www.npmjs.com/package/deckdeckgo-webpack-plugins) | [](https://www.npmjs.com/package/deckdeckgo-webpack-plugins) | [`README`](webpack/README.md) | [`CHANGELOG`](webpack/CHANGELOG.md) |
diff --git a/docs/docs/components/app-components-highlight-code/app-components-highlight-code.md b/docs/docs/components/app-components-highlight-code/app-components-highlight-code.md
index cfd3057f2..2932cd90a 100644
--- a/docs/docs/components/app-components-highlight-code/app-components-highlight-code.md
+++ b/docs/docs/components/app-components-highlight-code/app-components-highlight-code.md
@@ -228,20 +228,20 @@ If the code is displayed as an "ubuntu" terminal card (`terminal` property equal
| --deckgo-highlight-code-ubuntu-header-button-height | 12px | The height of a button of the card header. |
| --deckgo-highlight-code-ubuntu-header-button-border-radius | 50% | The border-radius of a button of the card header. |
| --deckgo-highlight-code-ubuntu-header-button-margin | 0 6px 0 0 | The margin of a button of the card header. |
-| --deckgo-highlight-code-carbon-header-button-font-size | 7px | The font-size of a button of the card header. |
-| --deckgo-highlight-code-carbon-header-button-color | black | The color of a button of the card header. |
-| --deckgo-highlight-code-carbon-header-button-text-shadow | 0px 1px 0px rgba(255, 255, 255, 0.2) | The text-shadow of a button of the card header. |
-| --deckgo-highlight-code-carbon-header-button-box-shadow | 0px 0px 1px 0px #41403a, 0px 1px 1px 0px #474642 | The box-shadow of a button of the card header. |
-| --deckgo-highlight-code-carbon-header-button-close-background | linear-gradient(#f37458 0%, #de4c12 100%) | The close button background of the card header. |
-| --deckgo-highlight-code-carbon-header-button-close-border | | The close button border of the card header. |
-| --deckgo-highlight-code-carbon-header-button-minimize-background | linear-gradient(#7d7871 0%, #595953 100%) | The minimize button background of the card header. |
-| --deckgo-highlight-code-carbon-header-button-minimize-border | | The minimize button border of the card header. |
-| --deckgo-highlight-code-carbon-header-button-maximize-background | linear-gradient(#7d7871 0%, #595953 100%) | The maximize button background of the card header. |
-| --deckgo-highlight-code-carbon-header-button-maximize-border | | The maximize button border of the card header. |
-| --deckgo-highlight-code-carbon-header-user-color | #d5d0ce | The user's color of the card header. |
-| --deckgo-highlight-code-carbon-header-user-font-size | 12px | The user's font-size of the card header. |
-| --deckgo-highlight-code-carbon-header-user-line-height | 14px | The user's line-height of the card header. |
-| --deckgo-highlight-code-carbon-header-user-margin | 0 0 1px 4px | The user's margin of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-font-size | 7px | The font-size of a button of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-color | black | The color of a button of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-text-shadow | 0px 1px 0px rgba(255, 255, 255, 0.2) | The text-shadow of a button of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-box-shadow | 0px 0px 1px 0px #41403a, 0px 1px 1px 0px #474642 | The box-shadow of a button of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-close-background | linear-gradient(#f37458 0%, #de4c12 100%) | The close button background of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-close-border | | The close button border of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-minimize-background | linear-gradient(#7d7871 0%, #595953 100%) | The minimize button background of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-minimize-border | | The minimize button border of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-maximize-background | linear-gradient(#7d7871 0%, #595953 100%) | The maximize button background of the card header. |
+| --deckgo-highlight-code-ubuntu-header-button-maximize-border | | The maximize button border of the card header. |
+| --deckgo-highlight-code-ubuntu-header-user-color | #d5d0ce | The user's color of the card header. |
+| --deckgo-highlight-code-ubuntu-header-user-font-size | 12px | The user's font-size of the card header. |
+| --deckgo-highlight-code-ubuntu-header-user-line-height | 14px | The user's line-height of the card header. |
+| --deckgo-highlight-code-ubuntu-header-user-margin | 0 0 1px 4px | The user's margin of the card header. |
### Methods
diff --git a/docs/package-lock.json b/docs/package-lock.json
index 9094adcbd..5e56e4eaf 100644
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -1096,12 +1096,19 @@
}
},
"@deckdeckgo/highlight-code": {
- "version": "2.1.1",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.1.1.tgz",
- "integrity": "sha512-nNYogbsM/uiNKLPNpiwBsmdi1wmIoidrH8jX6H0I6R1rva3DqtN7VJBrwFiiSBYPE5220LOchQAputmoGkQczQ==",
+ "version": "2.2.1",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.2.1.tgz",
+ "integrity": "sha512-58pTwLeq7WiqBePOCWmjD7QkC0hkJph1xzcaOBqIBntS/YuPrP4JXgwdiNwzd4rwmS+U4nUJJrLZ1eZD0/iUQQ==",
"requires": {
"@deckdeckgo/utils": "1.3.0",
"prismjs": "^1.21.0"
+ },
+ "dependencies": {
+ "@deckdeckgo/utils": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
+ "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ }
}
},
"@deckdeckgo/inline-editor": {
@@ -1129,9 +1136,9 @@
"integrity": "sha512-Uuwye8ln17PgZYE4TOFfRTQD+3lUu6UFxoLVbutzqf/N7DAkkgvlvb2Asg0yul0lQfM27ocANAKK1LeLvMIcZw=="
},
"@deckdeckgo/markdown": {
- "version": "1.1.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-1.1.0.tgz",
- "integrity": "sha512-uWlC6yETjdUlxDEC1kvOyLQ16LME0J1vXiaADb7HZCyJLBvyS09fyj2lceoo1542koNnZ6vMKPbTwaLkVe19Xw==",
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-2.0.0.tgz",
+ "integrity": "sha512-baynudYCgY82gZ4nd3LHJKpxIsOy40C7tR6+Ea8t77pjvVrSvQzqnzmXrogLWxwV4X+gAOg4mosoaXWwg+1BlA==",
"requires": {
"marked": "^1.2.3"
}
@@ -1307,9 +1314,9 @@
"dev": true
},
"@deckdeckgo/utils": {
- "version": "1.3.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
- "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ "version": "1.7.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.7.0.tgz",
+ "integrity": "sha512-aSc7v4lJeHrJTNKVZQUW8Q+qVNU0JNys5y4aerJ/3cEGyKsvzUqgA4QMI25dgn/Flz8f2gGFjfdqSzIR//zKQQ=="
},
"@deckdeckgo/word-cloud": {
"version": "1.0.5",
diff --git a/docs/package.json b/docs/package.json
index 93c24b12a..a89aba9d8 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -20,10 +20,10 @@
"@deckdeckgo/deck-utils": "^3.2.1",
"@deckdeckgo/demo": "^2.0.1",
"@deckdeckgo/drag-resize-rotate": "^2.0.1",
- "@deckdeckgo/highlight-code": "^2.1.1",
+ "@deckdeckgo/highlight-code": "^2.2.1",
"@deckdeckgo/inline-editor": "^3.0.2",
"@deckdeckgo/lazy-img": "^3.0.0",
- "@deckdeckgo/markdown": "^1.1.0",
+ "@deckdeckgo/markdown": "^2.0.0",
"@deckdeckgo/math": "^2.0.3",
"@deckdeckgo/qrcode": "^2.0.1",
"@deckdeckgo/reveal": "^1.0.0",
@@ -44,6 +44,7 @@
"@deckdeckgo/slide-video": "^2.2.2",
"@deckdeckgo/slide-youtube": "^2.2.2",
"@deckdeckgo/social": "^4.0.0",
+ "@deckdeckgo/utils": "^1.7.0",
"@deckdeckgo/word-cloud": "^1.0.5",
"@deckdeckgo/youtube": "^2.0.1",
"@ionic/core": "^5.4.4",
diff --git a/docs/src/app/pages/docs/components/app-components-highlight-code/app-components-highlight-code.tsx b/docs/src/app/pages/docs/components/app-components-highlight-code/app-components-highlight-code.tsx
index d3ad9eea8..3ba643775 100644
--- a/docs/src/app/pages/docs/components/app-components-highlight-code/app-components-highlight-code.tsx
+++ b/docs/src/app/pages/docs/components/app-components-highlight-code/app-components-highlight-code.tsx
@@ -780,72 +780,72 @@ export class AppComponentsHighlightCode {
The margin of a button of the card header. |
- | --deckgo-highlight-code-carbon-header-button-font-size |
+ --deckgo-highlight-code-ubuntu-header-button-font-size |
7px |
The font-size of a button of the card header. |
- | --deckgo-highlight-code-carbon-header-button-color |
+ --deckgo-highlight-code-ubuntu-header-button-color |
black |
The color of a button of the card header. |
- | --deckgo-highlight-code-carbon-header-button-text-shadow |
+ --deckgo-highlight-code-ubuntu-header-button-text-shadow |
0px 1px 0px rgba(255, 255, 255, 0.2) |
The text-shadow of a button of the card header. |
- | --deckgo-highlight-code-carbon-header-button-box-shadow |
+ --deckgo-highlight-code-ubuntu-header-button-box-shadow |
0px 0px 1px 0px #41403a, 0px 1px 1px 0px #474642 |
The box-shadow of a button of the card header. |
- | --deckgo-highlight-code-carbon-header-button-close-background |
+ --deckgo-highlight-code-ubuntu-header-button-close-background |
linear-gradient(#f37458 0%, #de4c12 100%) |
The close button background of the card header. |
- | --deckgo-highlight-code-carbon-header-button-close-border |
+ --deckgo-highlight-code-ubuntu-header-button-close-border |
|
The close button border of the card header. |
- | --deckgo-highlight-code-carbon-header-button-minimize-background |
+ --deckgo-highlight-code-ubuntu-header-button-minimize-background |
linear-gradient(#7d7871 0%, #595953 100%) |
The minimize button background of the card header. |
- | --deckgo-highlight-code-carbon-header-button-minimize-border |
+ --deckgo-highlight-code-ubuntu-header-button-minimize-border |
|
The minimize button border of the card header. |
- | --deckgo-highlight-code-carbon-header-button-maximize-background |
+ --deckgo-highlight-code-ubuntu-header-button-maximize-background |
linear-gradient(#7d7871 0%, #595953 100%) |
The maximize button background of the card header. |
- | --deckgo-highlight-code-carbon-header-button-maximize-border |
+ --deckgo-highlight-code-ubuntu-header-button-maximize-border |
|
The maximize button border of the card header. |
- | --deckgo-highlight-code-carbon-header-user-color |
+ --deckgo-highlight-code-ubuntu-header-user-color |
#d5d0ce |
The user's color of the card header. |
- | --deckgo-highlight-code-carbon-header-user-font-size |
+ --deckgo-highlight-code-ubuntu-header-user-font-size |
12px |
The user's font-size of the card header. |
- | --deckgo-highlight-code-carbon-header-user-line-height |
+ --deckgo-highlight-code-ubuntu-header-user-line-height |
14px |
The user's line-height of the card header. |
- | --deckgo-highlight-code-carbon-header-user-margin |
+ --deckgo-highlight-code-ubuntu-header-user-margin |
0 0 1px 4px |
The user's margin of the card header. |
diff --git a/remote/package-lock.json b/remote/package-lock.json
index 5626d16ff..923f9dd7c 100644
--- a/remote/package-lock.json
+++ b/remote/package-lock.json
@@ -1118,12 +1118,19 @@
}
},
"@deckdeckgo/highlight-code": {
- "version": "2.1.1",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.1.1.tgz",
- "integrity": "sha512-nNYogbsM/uiNKLPNpiwBsmdi1wmIoidrH8jX6H0I6R1rva3DqtN7VJBrwFiiSBYPE5220LOchQAputmoGkQczQ==",
+ "version": "2.2.1",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.2.1.tgz",
+ "integrity": "sha512-58pTwLeq7WiqBePOCWmjD7QkC0hkJph1xzcaOBqIBntS/YuPrP4JXgwdiNwzd4rwmS+U4nUJJrLZ1eZD0/iUQQ==",
"requires": {
"@deckdeckgo/utils": "1.3.0",
"prismjs": "^1.21.0"
+ },
+ "dependencies": {
+ "@deckdeckgo/utils": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
+ "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ }
}
},
"@deckdeckgo/lazy-img": {
@@ -1132,9 +1139,9 @@
"integrity": "sha512-Uuwye8ln17PgZYE4TOFfRTQD+3lUu6UFxoLVbutzqf/N7DAkkgvlvb2Asg0yul0lQfM27ocANAKK1LeLvMIcZw=="
},
"@deckdeckgo/markdown": {
- "version": "1.1.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-1.1.0.tgz",
- "integrity": "sha512-uWlC6yETjdUlxDEC1kvOyLQ16LME0J1vXiaADb7HZCyJLBvyS09fyj2lceoo1542koNnZ6vMKPbTwaLkVe19Xw==",
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-2.0.0.tgz",
+ "integrity": "sha512-baynudYCgY82gZ4nd3LHJKpxIsOy40C7tR6+Ea8t77pjvVrSvQzqnzmXrogLWxwV4X+gAOg4mosoaXWwg+1BlA==",
"requires": {
"marked": "^1.2.3"
}
@@ -1315,9 +1322,9 @@
"dev": true
},
"@deckdeckgo/utils": {
- "version": "1.3.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
- "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ "version": "1.7.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.7.0.tgz",
+ "integrity": "sha512-aSc7v4lJeHrJTNKVZQUW8Q+qVNU0JNys5y4aerJ/3cEGyKsvzUqgA4QMI25dgn/Flz8f2gGFjfdqSzIR//zKQQ=="
},
"@deckdeckgo/word-cloud": {
"version": "1.0.5",
@@ -3369,9 +3376,9 @@
}
},
"marked": {
- "version": "1.2.4",
- "resolved": "https://registry.npmjs.org/marked/-/marked-1.2.4.tgz",
- "integrity": "sha512-6x5TFGCTKSQBLTZtOburGxCxFEBJEGYVLwCMTBCxzvyuisGcC20UNzDSJhCr/cJ/Kmh6ulfJm10g6WWEAJ3kvg=="
+ "version": "1.2.5",
+ "resolved": "https://registry.npmjs.org/marked/-/marked-1.2.5.tgz",
+ "integrity": "sha512-2AlqgYnVPOc9WDyWu7S5DJaEZsfk6dNh/neatQ3IHUW4QLutM/VPSH9lG7bif+XjFWc9K9XR3QvR+fXuECmfdA=="
},
"md5.js": {
"version": "1.3.5",
diff --git a/remote/package.json b/remote/package.json
index 5b7b4f605..57fb259ca 100644
--- a/remote/package.json
+++ b/remote/package.json
@@ -20,9 +20,9 @@
"@deckdeckgo/deck-utils": "^3.2.1",
"@deckdeckgo/demo": "^2.0.1",
"@deckdeckgo/drag-resize-rotate": "^2.0.1",
- "@deckdeckgo/highlight-code": "^2.1.1",
+ "@deckdeckgo/highlight-code": "^2.2.1",
"@deckdeckgo/lazy-img": "^3.0.0",
- "@deckdeckgo/markdown": "^1.1.0",
+ "@deckdeckgo/markdown": "^2.0.0",
"@deckdeckgo/math": "^2.0.3",
"@deckdeckgo/qrcode": "^2.0.1",
"@deckdeckgo/remote-utils": "^1.0.0",
@@ -44,7 +44,7 @@
"@deckdeckgo/slide-video": "^2.2.2",
"@deckdeckgo/slide-youtube": "^2.2.2",
"@deckdeckgo/social": "^4.0.0",
- "@deckdeckgo/utils": "^1.3.0",
+ "@deckdeckgo/utils": "^1.7.0",
"@deckdeckgo/word-cloud": "^1.0.5",
"@deckdeckgo/youtube": "^2.0.1",
"@ionic/core": "^5.4.4",
diff --git a/studio/package-lock.json b/studio/package-lock.json
index 236733344..a350dfbdf 100644
--- a/studio/package-lock.json
+++ b/studio/package-lock.json
@@ -1158,12 +1158,19 @@
}
},
"@deckdeckgo/highlight-code": {
- "version": "2.1.1",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.1.1.tgz",
- "integrity": "sha512-nNYogbsM/uiNKLPNpiwBsmdi1wmIoidrH8jX6H0I6R1rva3DqtN7VJBrwFiiSBYPE5220LOchQAputmoGkQczQ==",
+ "version": "2.2.1",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/highlight-code/-/highlight-code-2.2.1.tgz",
+ "integrity": "sha512-58pTwLeq7WiqBePOCWmjD7QkC0hkJph1xzcaOBqIBntS/YuPrP4JXgwdiNwzd4rwmS+U4nUJJrLZ1eZD0/iUQQ==",
"requires": {
"@deckdeckgo/utils": "1.3.0",
"prismjs": "^1.21.0"
+ },
+ "dependencies": {
+ "@deckdeckgo/utils": {
+ "version": "1.3.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
+ "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ }
}
},
"@deckdeckgo/inline-editor": {
@@ -1191,9 +1198,9 @@
"integrity": "sha512-Uuwye8ln17PgZYE4TOFfRTQD+3lUu6UFxoLVbutzqf/N7DAkkgvlvb2Asg0yul0lQfM27ocANAKK1LeLvMIcZw=="
},
"@deckdeckgo/markdown": {
- "version": "1.1.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-1.1.0.tgz",
- "integrity": "sha512-uWlC6yETjdUlxDEC1kvOyLQ16LME0J1vXiaADb7HZCyJLBvyS09fyj2lceoo1542koNnZ6vMKPbTwaLkVe19Xw==",
+ "version": "2.0.1",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/markdown/-/markdown-2.0.1.tgz",
+ "integrity": "sha512-FZYe59evR8N9Xe+T/Z0km3aA/FeW33tMOaKeje21hbM9iAqdIj00gHx1Ner0wZGdfedNTLtYzJffZYeRbV7ylA==",
"requires": {
"marked": "^1.2.3"
}
@@ -1351,9 +1358,9 @@
"dev": true
},
"@deckdeckgo/utils": {
- "version": "1.3.0",
- "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.3.0.tgz",
- "integrity": "sha512-QrV3jyqIlL+u1NUqSyMsnIsfORLqBuzEhK2+rGYCT89TLVhnPpOP0b11aP/XvHyJMzG9mZvjadLN/MQ9ls9UGw=="
+ "version": "1.7.0",
+ "resolved": "https://registry.npmjs.org/@deckdeckgo/utils/-/utils-1.7.0.tgz",
+ "integrity": "sha512-aSc7v4lJeHrJTNKVZQUW8Q+qVNU0JNys5y4aerJ/3cEGyKsvzUqgA4QMI25dgn/Flz8f2gGFjfdqSzIR//zKQQ=="
},
"@deckdeckgo/word-cloud": {
"version": "1.0.5",
@@ -3213,9 +3220,9 @@
}
},
"marked": {
- "version": "1.2.4",
- "resolved": "https://registry.npmjs.org/marked/-/marked-1.2.4.tgz",
- "integrity": "sha512-6x5TFGCTKSQBLTZtOburGxCxFEBJEGYVLwCMTBCxzvyuisGcC20UNzDSJhCr/cJ/Kmh6ulfJm10g6WWEAJ3kvg=="
+ "version": "1.2.5",
+ "resolved": "https://registry.npmjs.org/marked/-/marked-1.2.5.tgz",
+ "integrity": "sha512-2AlqgYnVPOc9WDyWu7S5DJaEZsfk6dNh/neatQ3IHUW4QLutM/VPSH9lG7bif+XjFWc9K9XR3QvR+fXuECmfdA=="
},
"merge-stream": {
"version": "2.0.0",
diff --git a/studio/package.json b/studio/package.json
index 70377220c..3d1186ffc 100644
--- a/studio/package.json
+++ b/studio/package.json
@@ -24,10 +24,10 @@
"@deckdeckgo/deck-utils": "^3.2.1",
"@deckdeckgo/demo": "^2.0.1",
"@deckdeckgo/drag-resize-rotate": "^2.0.1",
- "@deckdeckgo/highlight-code": "^2.1.1",
+ "@deckdeckgo/highlight-code": "^2.2.1",
"@deckdeckgo/inline-editor": "^3.0.2",
"@deckdeckgo/lazy-img": "^3.0.0",
- "@deckdeckgo/markdown": "^1.1.0",
+ "@deckdeckgo/markdown": "^2.0.1",
"@deckdeckgo/math": "^2.0.3",
"@deckdeckgo/qrcode": "^2.0.1",
"@deckdeckgo/remote": "^2.0.1",
@@ -45,7 +45,7 @@
"@deckdeckgo/slide-utils": "^2.6.1",
"@deckdeckgo/slide-youtube": "^2.2.2",
"@deckdeckgo/social": "^4.0.0",
- "@deckdeckgo/utils": "^1.3.0",
+ "@deckdeckgo/utils": "^1.7.0",
"@deckdeckgo/word-cloud": "^1.0.5",
"@deckdeckgo/youtube": "^2.0.1",
"@ionic/core": "^5.4.4",
diff --git a/studio/src/app/components/editor/actions/element/app-actions-element/app-actions-element.tsx b/studio/src/app/components/editor/actions/element/app-actions-element/app-actions-element.tsx
index 6210cd82c..62127a8f0 100644
--- a/studio/src/app/components/editor/actions/element/app-actions-element/app-actions-element.tsx
+++ b/studio/src/app/components/editor/actions/element/app-actions-element/app-actions-element.tsx
@@ -162,14 +162,8 @@ export class AppActionsElement {
}
@Method()
- blurSelectedElement(): Promise {
- return new Promise(async (resolve) => {
- if (this.selectedElement) {
- this.selectedElement.blur();
- }
-
- resolve();
- });
+ async blurSelectedElement() {
+ this.selectedElement?.blur();
}
private select(element: HTMLElement, autoOpen: boolean): Promise {
@@ -200,17 +194,15 @@ export class AppActionsElement {
}
@Method()
- unSelect(): Promise {
- return new Promise(async (resolve) => {
- if (this.selectedElement) {
- this.selectedElement.removeEventListener('paste', this.cleanOnPaste, true);
- await this.detachMoveToolbarOnElement();
+ async unSelect() {
+ if (!this.selectedElement) {
+ return;
+ }
- await this.reset();
- }
+ this.selectedElement.removeEventListener('paste', this.cleanOnPaste, true);
+ await this.detachMoveToolbarOnElement();
- resolve();
- });
+ await this.reset();
}
private findSelectedElement(element: HTMLElement): Promise {
diff --git a/studio/src/app/components/editor/publish/app-publish-edit/app-publish-edit.tsx b/studio/src/app/components/editor/publish/app-publish-edit/app-publish-edit.tsx
index 57fc1eee3..8bda84fa4 100644
--- a/studio/src/app/components/editor/publish/app-publish-edit/app-publish-edit.tsx
+++ b/studio/src/app/components/editor/publish/app-publish-edit/app-publish-edit.tsx
@@ -115,7 +115,7 @@ export class AppPublishEdit {
return;
}
- const slide: HTMLElement = document.querySelector('deckgo-deck > *:first-child');
+ const slide: HTMLElement = document.querySelector('app-editor main deckgo-deck > *:first-child');
if (slide?.tagName?.toLowerCase().indexOf('deckgo-slide') > -1) {
const contentElement: HTMLElement = slide.querySelector('[slot="content"]');
diff --git a/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.scss b/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.scss
new file mode 100644
index 000000000..c3ec49e52
--- /dev/null
+++ b/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.scss
@@ -0,0 +1,73 @@
+@use "../../../../../global/theme/editor/editor-mixin";
+
+app-slide-preview {
+ position: absolute;
+ top: var(--ios-top, 8px);
+ right: 8px;
+
+ transition: opacity 0.5s;
+
+ visibility: initial;
+ opacity: 1;
+
+ &:not(.preview) {
+ visibility: hidden;
+ opacity: 0;
+ }
+
+ article {
+ position: relative;
+
+ --preview-width: 200px;
+
+ width: var(--preview-width);
+ height: calc(var(--preview-width) * 9 / 16);
+
+ @media screen and (max-width: 768px) {
+ --preview-width: 128px;
+ }
+
+ overflow: hidden;
+
+ @include editor-mixin.panel;
+
+ deckgo-deck {
+ --slide-padding-start: 4px;
+ --slide-padding-top: 8px;
+ --slide-padding-end: 4px;
+ --slide-padding-bottom: 8px;
+
+ --slide-split-padding-start: 4px;
+ --slide-split-padding-top: 8px;
+ --slide-split-padding-end: 4px;
+ --slide-split-padding-bottom: 8px;
+
+ --deckgo-highlight-code-carbon-header-padding: 2px 8px;
+ --deckgo-highlight-code-carbon-header-button-width: 2px;
+ --deckgo-highlight-code-carbon-header-button-height: 2px;
+ --deckgo-highlight-code-margin: 0 0 4px;
+ --deckgo-highlight-code-padding: 0 8px;
+
+ --deckgo-highlight-code-carbon-margin: 8px 0;
+ --deckgo-highlight-code-ubuntu-margin: 8px 0;
+
+ --deckgo-highlight-code-carbon-box-shadow: rgba(0, 0, 0, 0.55) 0 2px 4px;
+ --deckgo-highlight-code-ubuntu-box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.5);
+
+ --deckgo-highlight-code-ubuntu-header-height: 8px;
+ --deckgo-highlight-code-ubuntu-header-button-width: 4px;
+ --deckgo-highlight-code-ubuntu-header-button-height: 4px;
+ --deckgo-highlight-code-ubuntu-header-button-span-display: none;
+
+ --deckgo-markdown-container-padding: 4px 8px;
+
+ .deckgo-slide-container {
+ > * {
+ margin: 0;
+ padding: 0;
+ border-color: transparent;
+ }
+ }
+ }
+ }
+}
diff --git a/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.tsx b/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.tsx
new file mode 100644
index 000000000..b9dc3745c
--- /dev/null
+++ b/studio/src/app/components/editor/slide/app-slide-preview/app-slide-preview.tsx
@@ -0,0 +1,154 @@
+import {Component, h, Host, Listen, State, Event, EventEmitter, Element, Prop} from '@stencil/core';
+
+import {cleanContent} from '@deckdeckgo/deck-utils';
+import {debounce, isIOS, isLandscape} from '@deckdeckgo/utils';
+
+import {SlotUtils} from '../../../../utils/editor/slot.utils';
+
+@Component({
+ tag: 'app-slide-preview',
+ styleUrl: 'app-slide-preview.scss',
+})
+export class AppSlidePreview {
+ @Element() el: HTMLElement;
+
+ @Prop()
+ deckRef!: HTMLDeckgoDeckElement;
+
+ @State()
+ private preview: boolean = false;
+
+ @State()
+ private iosPositionTop: string | undefined = undefined;
+
+ private deckPreviewRef!: HTMLDeckgoDeckElement;
+
+ @Event({bubbles: false}) private previewAttached: EventEmitter;
+
+ private readonly debounceUpdatePreview: () => void;
+
+ constructor() {
+ this.debounceUpdatePreview = debounce(async () => {
+ await this.updatePreview();
+ }, 500);
+ }
+
+ @Listen('ionKeyboardDidShow', {target: 'window'})
+ onKeyboardDidShow(_$event: CustomEvent<{keyboardHeight: number}>) {}
+
+ componentDidUpdate() {
+ if (this.preview) {
+ this.previewAttached.emit();
+ }
+ }
+
+ @Listen('slideDidUpdate', {target: 'document'})
+ async onSlideDidUpdate() {
+ if (this.preview) {
+ this.debounceUpdatePreview();
+ }
+ }
+
+ @Listen('resetted', {target: 'document'})
+ async onResetElement() {
+ this.preview = false;
+ }
+
+ @Listen('elementFocus', {target: 'document'})
+ async onElementFocus($event: CustomEvent) {
+ if (!$event || !$event.detail) {
+ return;
+ }
+
+ const selectedElement: HTMLElement = $event.detail;
+
+ await this.stickyIOS(selectedElement);
+
+ this.preview =
+ selectedElement?.parentElement?.nodeName?.toLowerCase().indexOf('deckgo-slide') >= 0 &&
+ SlotUtils.isNodeEditable(selectedElement) &&
+ !SlotUtils.isNodeWordCloud(selectedElement);
+
+ if (this.preview) {
+ await this.initDeckPreview();
+
+ this.el.addEventListener('previewAttached', async () => await this.updateSlide(selectedElement.parentElement), {once: true});
+
+ this.deckRef.addEventListener('keypress', () => this.debounceUpdatePreview(), {passive: true});
+ this.deckRef.addEventListener('paste', () => this.debounceUpdatePreview(), {passive: true});
+ } else {
+ this.deckRef.removeEventListener('keypress', () => this.debounceUpdatePreview(), true);
+ this.deckRef.removeEventListener('paste', () => this.debounceUpdatePreview(), true);
+ }
+ }
+
+ private async stickyIOS(selectedElement: HTMLElement) {
+ if (isIOS()) {
+ this.iosPositionTop = isLandscape() ? `calc(${selectedElement.offsetTop}px - (128px * 9 / 16) - 32px)` : undefined;
+ }
+ }
+
+ async initDeckPreview() {
+ if (!this.deckRef) {
+ return;
+ }
+
+ this.deckPreviewRef?.setAttribute('style', this.deckRef.style.cssText);
+
+ await this.deckPreviewRef?.initSlideSize();
+ }
+
+ async updateSlide(slide: HTMLElement | undefined) {
+ if (!slide) {
+ return;
+ }
+
+ const content: string = await cleanContent(slide.outerHTML);
+
+ this.deckPreviewRef.innerHTML = content;
+ }
+
+ private async blockSlide() {
+ await this.deckPreviewRef?.blockSlide(true);
+ }
+
+ private async updatePreview() {
+ const index = await this.deckRef?.getActiveIndex();
+
+ if (index < 0) {
+ return;
+ }
+
+ const slideElement: HTMLElement | undefined = this.deckRef?.querySelector('.deckgo-slide-container:nth-child(' + (index + 1) + ')');
+
+ await this.updateSlide(slideElement);
+ }
+
+ render() {
+ const style = {...(this.iosPositionTop && {'--ios-top': this.iosPositionTop})};
+
+ return (
+
+ {this.renderPreview()}
+
+ );
+ }
+
+ private renderPreview() {
+ if (!this.preview) {
+ return undefined;
+ }
+
+ return (
+ (this.deckPreviewRef = el as HTMLDeckgoDeckElement)}
+ onSlidesDidLoad={() => this.blockSlide()}>
+ );
+ }
+}
diff --git a/studio/src/app/components/editor/app-slide-warning/app-slide-warning.scss b/studio/src/app/components/editor/slide/app-slide-warning/app-slide-warning.scss
similarity index 100%
rename from studio/src/app/components/editor/app-slide-warning/app-slide-warning.scss
rename to studio/src/app/components/editor/slide/app-slide-warning/app-slide-warning.scss
diff --git a/studio/src/app/components/editor/app-slide-warning/app-slide-warning.tsx b/studio/src/app/components/editor/slide/app-slide-warning/app-slide-warning.tsx
similarity index 97%
rename from studio/src/app/components/editor/app-slide-warning/app-slide-warning.tsx
rename to studio/src/app/components/editor/slide/app-slide-warning/app-slide-warning.tsx
index e72b3ffbe..1e525ef78 100644
--- a/studio/src/app/components/editor/app-slide-warning/app-slide-warning.tsx
+++ b/studio/src/app/components/editor/slide/app-slide-warning/app-slide-warning.tsx
@@ -4,9 +4,9 @@ import {popoverController} from '@ionic/core';
import {debounce} from '@deckdeckgo/utils';
-import {ContrastUtils} from '../../../utils/editor/contrast.utils';
-import {NodeUtils} from '../../../utils/editor/node.utils';
-import {SlotUtils} from '../../../utils/editor/slot.utils';
+import {ContrastUtils} from '../../../../utils/editor/contrast.utils';
+import {NodeUtils} from '../../../../utils/editor/node.utils';
+import {SlotUtils} from '../../../../utils/editor/slot.utils';
@Component({
tag: 'app-slide-warning',
diff --git a/studio/src/app/handlers/editor/events/deck/deck-events.handler.tsx b/studio/src/app/handlers/editor/events/deck/deck-events.handler.tsx
index 4c416784f..c9691b84c 100644
--- a/studio/src/app/handlers/editor/events/deck/deck-events.handler.tsx
+++ b/studio/src/app/handlers/editor/events/deck/deck-events.handler.tsx
@@ -26,7 +26,7 @@ import {SlideService} from '../../../../services/data/slide/slide.service';
import {DeckAction} from '../../../../utils/editor/deck-action';
export class DeckEventsHandler {
- private el: HTMLElement;
+ private mainRef: HTMLElement;
private deckService: DeckService;
private slideService: SlideService;
@@ -49,54 +49,54 @@ export class DeckEventsHandler {
}, 500);
}
- init(el: HTMLElement): Promise {
- return new Promise(async (resolve) => {
- this.el = el;
-
- this.el.addEventListener('input', this.onInputChange, false);
- this.el.addEventListener('slideDidChange', this.onSlideChange, false);
- this.el.addEventListener('slideDidLoad', this.onSlideDidLoad, false);
- this.el.addEventListener('slidesDidLoad', this.onSlidesDidLoad, false);
- this.el.addEventListener('slideDelete', this.onSlideDelete, false);
- this.el.addEventListener('codeDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('mathDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('markdownDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('wordCloudDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('imgDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('linkCreated', this.onCustomEventChange, false);
- this.el.addEventListener('styleDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('drrDidChange', this.onCustomEventChange, false);
- this.el.addEventListener('notesDidChange', this.onSlideChange, false);
-
- if (document) {
- document.addEventListener('deckDidChange', this.onDeckChange, false);
- document.addEventListener('deckNeedChange', this.onDeckNeedChange, false);
- }
+ async init(el: HTMLElement) {
+ this.mainRef = el;
+
+ this.mainRef.addEventListener('input', this.onInputChange, false);
+ this.mainRef.addEventListener('slideDidLoad', this.onSlideDidLoad, false);
+ this.mainRef.addEventListener('slidesDidLoad', this.onSlidesDidLoad, false);
+ this.mainRef.addEventListener('codeDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('mathDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('markdownDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('wordCloudDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('imgDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('linkCreated', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('drrDidChange', this.onCustomEventChange, false);
+ this.mainRef.addEventListener('notesDidChange', this.onSlideChange, false);
+
+ if (!document) {
+ return;
+ }
- resolve();
- });
+ document.addEventListener('styleDidChange', this.onCustomEventChange, false);
+ document.addEventListener('slideDidChange', this.onSlideChange, false);
+ document.addEventListener('slideDelete', this.onSlideDelete, false);
+ document.addEventListener('deckDidChange', this.onDeckChange, false);
+ document.addEventListener('deckNeedChange', this.onDeckNeedChange, false);
}
destroy() {
- this.el.removeEventListener('input', this.onInputChange, true);
- this.el.removeEventListener('slideDidChange', this.onSlideChange, true);
- this.el.removeEventListener('slideDidLoad', this.onSlideDidLoad, true);
- this.el.removeEventListener('slidesDidLoad', this.onSlidesDidLoad, true);
- this.el.removeEventListener('slideDelete', this.onSlideDelete, true);
- this.el.removeEventListener('codeDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('mathDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('markdownDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('wordCloudDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('imgDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('linkCreated', this.onCustomEventChange, true);
- this.el.removeEventListener('styleDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('drrDidChange', this.onCustomEventChange, true);
- this.el.removeEventListener('notesDidChange', this.onSlideChange, true);
-
- if (document) {
- document.removeEventListener('deckDidChange', this.onDeckChange, true);
- document.removeEventListener('deckNeedChange', this.onDeckNeedChange, true);
+ this.mainRef.removeEventListener('input', this.onInputChange, true);
+ this.mainRef.removeEventListener('slideDidLoad', this.onSlideDidLoad, true);
+ this.mainRef.removeEventListener('slidesDidLoad', this.onSlidesDidLoad, true);
+ this.mainRef.removeEventListener('codeDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('mathDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('markdownDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('wordCloudDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('imgDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('linkCreated', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('drrDidChange', this.onCustomEventChange, true);
+ this.mainRef.removeEventListener('notesDidChange', this.onSlideChange, true);
+
+ if (!document) {
+ return;
}
+
+ document.removeEventListener('styleDidChange', this.onCustomEventChange, true);
+ document.removeEventListener('slideDidChange', this.onSlideChange, true);
+ document.removeEventListener('slideDelete', this.onSlideDelete, true);
+ document.removeEventListener('deckDidChange', this.onDeckChange, true);
+ document.removeEventListener('deckNeedChange', this.onDeckNeedChange, true);
}
private onSlideDidLoad = async ($event: CustomEvent) => {
@@ -272,7 +272,7 @@ export class DeckEventsHandler {
};
// Retrieve text and background color style randomly generated in the editor
- const deckElement: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deckElement: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (deckElement) {
const attributes: DeckAttributes = await this.getDeckAttributes(deckElement, false);
deck.attributes = attributes;
@@ -559,7 +559,7 @@ export class DeckEventsHandler {
private deleteSlideElement(): Promise {
return new Promise(async (resolve) => {
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (!deck) {
resolve();
@@ -899,7 +899,7 @@ export class DeckEventsHandler {
private slideToLastSlide(): Promise {
return new Promise(async (resolve) => {
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (!deck || !deck.children || deck.children.length <= 0) {
resolve();
@@ -930,7 +930,7 @@ export class DeckEventsHandler {
initSlideSize(): Promise {
return new Promise(async (resolve) => {
- const deck: HTMLDeckgoDeckElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLDeckgoDeckElement = this.mainRef.querySelector('deckgo-deck');
if (!deck) {
return;
@@ -978,14 +978,14 @@ export class DeckEventsHandler {
detail: element,
});
- this.el.dispatchEvent(slideDidUpdate);
+ this.mainRef.dispatchEvent(slideDidUpdate);
resolve();
});
}
async toggleSlideEditable(editable: boolean) {
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (!deck) {
return;
diff --git a/studio/src/app/handlers/editor/events/editor/editor-events.handler.tsx b/studio/src/app/handlers/editor/events/editor/editor-events.handler.tsx
index f05cc8df6..499d47234 100644
--- a/studio/src/app/handlers/editor/events/editor/editor-events.handler.tsx
+++ b/studio/src/app/handlers/editor/events/editor/editor-events.handler.tsx
@@ -1,11 +1,11 @@
export class EditorEventsHandler {
- private el: HTMLElement;
+ private mainRef: HTMLElement;
init(el: HTMLElement): Promise {
return new Promise(async (resolve) => {
- this.el = el;
+ this.mainRef = el;
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (deck) {
deck.addEventListener('keyup', this.onKeyUp, false);
@@ -21,7 +21,7 @@ export class EditorEventsHandler {
}
destroy() {
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (deck) {
deck.removeEventListener('keyup', this.onKeyUp, true);
@@ -47,7 +47,7 @@ export class EditorEventsHandler {
private touchToolbar(element: HTMLElement): Promise {
return new Promise(async (resolve) => {
- const actions: HTMLAppActionsEditorElement = this.el.querySelector('app-actions-editor');
+ const actions: HTMLAppActionsEditorElement = this.mainRef.querySelector('app-actions-editor');
if (!actions) {
resolve();
@@ -62,7 +62,7 @@ export class EditorEventsHandler {
selectDeck(): Promise {
return new Promise(async (resolve) => {
- const actions: HTMLAppActionsEditorElement = this.el.querySelector('app-actions-editor');
+ const actions: HTMLAppActionsEditorElement = this.mainRef.querySelector('app-actions-editor');
if (actions) {
await actions.selectDeck();
@@ -78,7 +78,7 @@ export class EditorEventsHandler {
blockSlide(blockState: boolean): Promise {
return new Promise(async (resolve) => {
- const deck: HTMLElement = this.el.querySelector('deckgo-deck');
+ const deck: HTMLElement = this.mainRef.querySelector('deckgo-deck');
if (!deck) {
resolve();
diff --git a/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx b/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx
index 1d53154c9..a03bac1f3 100644
--- a/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx
+++ b/studio/src/app/pages/core/app-dashboard/app-dashboard.tsx
@@ -252,7 +252,7 @@ export class AppDashboard {
private blockSlide($event: CustomEvent): Promise {
return new Promise(async (resolve) => {
if ($event && $event.target) {
- await ($event.target as any).blockSlide(true);
+ await ($event.target as HTMLDeckgoDeckElement).blockSlide(true);
}
resolve();
diff --git a/studio/src/app/pages/editor/app-editor/app-editor.scss b/studio/src/app/pages/editor/app-editor/app-editor.scss
index 2df7d54d9..6fddff364 100644
--- a/studio/src/app/pages/editor/app-editor/app-editor.scss
+++ b/studio/src/app/pages/editor/app-editor/app-editor.scss
@@ -21,14 +21,15 @@ ion-nav app-editor ion-content {
}
app-editor {
- @import "../../../../global/theme/editor/editor-deck";
- @import "../../../../global/theme/editor/editor-deck-placeholder";
- @import "../../../../global/theme/editor/editor-deck-social";
@import "../../../../global/theme/editor/editor-deck-header-footer";
-
+ @import "../../../../global/theme/editor/editor-deck-social";
+ @import "../../../../global/theme/editor/editor-deck-transition";
@import "../../../../global/theme/editor/editor-loading";
- @import "../../../../global/theme/editor/editor-deck-transition";
+ main {
+ @import "../../../../global/theme/editor/editor-deck";
+ @import "../../../../global/theme/editor/editor-deck-placeholder";
+ }
@import "node_modules/@deckdeckgo/deck-utils/css/deck";
diff --git a/studio/src/app/pages/editor/app-editor/app-editor.tsx b/studio/src/app/pages/editor/app-editor/app-editor.tsx
index e37d6e6da..e0b304f21 100644
--- a/studio/src/app/pages/editor/app-editor/app-editor.tsx
+++ b/studio/src/app/pages/editor/app-editor/app-editor.tsx
@@ -141,8 +141,8 @@ export class AppEditor {
}
async init() {
- await this.deckEventsHandler.init(this.el);
- await this.editorEventsHandler.init(this.el);
+ await this.deckEventsHandler.init(this.mainRef);
+ await this.editorEventsHandler.init(this.mainRef);
await this.initOffline();
@@ -731,6 +731,7 @@ export class AppEditor {
+
,
(this.actionsEditorRef = el as HTMLAppActionsEditorElement)}
diff --git a/studio/src/app/popovers/editor/app-slide-warning-info/app-slide-warning-info.tsx b/studio/src/app/popovers/editor/app-slide-warning-info/app-slide-warning-info.tsx
index 68c6044cb..50e42406f 100644
--- a/studio/src/app/popovers/editor/app-slide-warning-info/app-slide-warning-info.tsx
+++ b/studio/src/app/popovers/editor/app-slide-warning-info/app-slide-warning-info.tsx
@@ -40,7 +40,7 @@ export class AppSlideWarningInfo {
return (
Overflow
- Part of your content seems to be placed outside the slide's safe area (16/9).
+ Part of your content may be placed outside the slide's safe area (16/9).
It may not be visible on all display sizes.
);
diff --git a/studio/src/app/popovers/editor/style/app-deck-style/app-deck-style.tsx b/studio/src/app/popovers/editor/style/app-deck-style/app-deck-style.tsx
index 1dcf28860..b287cbff0 100644
--- a/studio/src/app/popovers/editor/style/app-deck-style/app-deck-style.tsx
+++ b/studio/src/app/popovers/editor/style/app-deck-style/app-deck-style.tsx
@@ -29,7 +29,7 @@ export class AppDeck {
private imageHelper: ImageHelper;
async componentWillLoad() {
- this.deckElement = document ? document.querySelector('deckgo-deck') : undefined;
+ this.deckElement = document?.querySelector('app-editor main deckgo-deck');
this.imageHelper = new ImageHelper(this.deckDidChange, this.blockSlide, this.signIn);
}
diff --git a/studio/src/app/utils/editor/parse-elements.utils.tsx b/studio/src/app/utils/editor/parse-elements.utils.tsx
index 19fe95213..524c7ceb8 100644
--- a/studio/src/app/utils/editor/parse-elements.utils.tsx
+++ b/studio/src/app/utils/editor/parse-elements.utils.tsx
@@ -14,7 +14,7 @@ export class ParseElementsUtils {
}
if (element.nodeType === 3) {
- resolve(element.textContent + '\n');
+ resolve(element.textContent);
return;
}
diff --git a/studio/src/app/utils/editor/slot.utils.tsx b/studio/src/app/utils/editor/slot.utils.tsx
index 2246c9118..141a6097d 100644
--- a/studio/src/app/utils/editor/slot.utils.tsx
+++ b/studio/src/app/utils/editor/slot.utils.tsx
@@ -47,12 +47,12 @@ export class SlotUtils {
return selectedElement?.nodeName?.toLowerCase() === SlotType.DRAG_RESIZE_ROTATE;
}
- static isNodeEditable(element: HTMLElement): boolean {
+ static isNodeEditable(element?: HTMLElement): boolean {
return (
- element.nodeName.toLowerCase() === SlotType.CODE ||
- element.nodeName.toLowerCase() === SlotType.MATH ||
- element.nodeName.toLowerCase() === SlotType.WORD_CLOUD ||
- element.nodeName.toLowerCase() === SlotType.MARKDOWN
+ element?.nodeName?.toLowerCase() === SlotType.CODE ||
+ element?.nodeName?.toLowerCase() === SlotType.MATH ||
+ element?.nodeName?.toLowerCase() === SlotType.WORD_CLOUD ||
+ element?.nodeName?.toLowerCase() === SlotType.MARKDOWN
);
}
}
diff --git a/studio/src/components.d.ts b/studio/src/components.d.ts
index 6c3c2d922..c86015b4e 100644
--- a/studio/src/components.d.ts
+++ b/studio/src/components.d.ts
@@ -389,6 +389,9 @@ export namespace Components {
}
interface AppSlideNavigate {
}
+ interface AppSlidePreview {
+ "deckRef": HTMLDeckgoDeckElement;
+ }
interface AppSlideWarning {
}
interface AppSlideWarningInfo {
@@ -1077,6 +1080,12 @@ declare global {
prototype: HTMLAppSlideNavigateElement;
new (): HTMLAppSlideNavigateElement;
};
+ interface HTMLAppSlidePreviewElement extends Components.AppSlidePreview, HTMLStencilElement {
+ }
+ var HTMLAppSlidePreviewElement: {
+ prototype: HTMLAppSlidePreviewElement;
+ new (): HTMLAppSlidePreviewElement;
+ };
interface HTMLAppSlideWarningElement extends Components.AppSlideWarning, HTMLStencilElement {
}
var HTMLAppSlideWarningElement: {
@@ -1259,6 +1268,7 @@ declare global {
"app-share-options": HTMLAppShareOptionsElement;
"app-signin": HTMLAppSigninElement;
"app-slide-navigate": HTMLAppSlideNavigateElement;
+ "app-slide-preview": HTMLAppSlidePreviewElement;
"app-slide-warning": HTMLAppSlideWarningElement;
"app-slide-warning-info": HTMLAppSlideWarningInfoElement;
"app-slot-type": HTMLAppSlotTypeElement;
@@ -1703,6 +1713,10 @@ declare namespace LocalJSX {
interface AppSlideNavigate {
"onReorder"?: (event: CustomEvent) => void;
}
+ interface AppSlidePreview {
+ "deckRef": HTMLDeckgoDeckElement;
+ "onPreviewAttached"?: (event: CustomEvent) => void;
+ }
interface AppSlideWarning {
}
interface AppSlideWarningInfo {
@@ -1846,6 +1860,7 @@ declare namespace LocalJSX {
"app-share-options": AppShareOptions;
"app-signin": AppSignin;
"app-slide-navigate": AppSlideNavigate;
+ "app-slide-preview": AppSlidePreview;
"app-slide-warning": AppSlideWarning;
"app-slide-warning-info": AppSlideWarningInfo;
"app-slot-type": AppSlotType;
@@ -1973,6 +1988,7 @@ declare module "@stencil/core" {
"app-share-options": LocalJSX.AppShareOptions & JSXBase.HTMLAttributes;
"app-signin": LocalJSX.AppSignin & JSXBase.HTMLAttributes;
"app-slide-navigate": LocalJSX.AppSlideNavigate & JSXBase.HTMLAttributes;
+ "app-slide-preview": LocalJSX.AppSlidePreview & JSXBase.HTMLAttributes;
"app-slide-warning": LocalJSX.AppSlideWarning & JSXBase.HTMLAttributes;
"app-slide-warning-info": LocalJSX.AppSlideWarningInfo & JSXBase.HTMLAttributes;
"app-slot-type": LocalJSX.AppSlotType & JSXBase.HTMLAttributes;
diff --git a/utils/utils/CHANGELOG.md b/utils/utils/CHANGELOG.md
index 9d9bf6438..58d1a7176 100644
--- a/utils/utils/CHANGELOG.md
+++ b/utils/utils/CHANGELOG.md
@@ -1,3 +1,36 @@
+
+
+# 1.7.0 (2020-11-21)
+
+### Features
+
+- isLandscape and isPortrait
+
+
+
+# 1.6.0 (2020-11-20)
+
+### Fix
+
+- is mobile based on matchMedia
+- isIos including new iPads
+
+
+
+# 1.5.0 (2020-11-20)
+
+### Fix
+
+- update is mobile
+
+
+
+# 1.4.0 (2020-11-20)
+
+### Fix
+
+- detection iPad for iOS >= 13
+
# 1.3.0 (2020-08-15)
diff --git a/utils/utils/package-lock.json b/utils/utils/package-lock.json
index c2e6f5f07..8f7b00e92 100644
--- a/utils/utils/package-lock.json
+++ b/utils/utils/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/utils",
- "version": "1.3.0",
+ "version": "1.7.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/utils/utils/package.json b/utils/utils/package.json
index 72e158016..ea7485605 100644
--- a/utils/utils/package.json
+++ b/utils/utils/package.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/utils",
- "version": "1.3.0",
+ "version": "1.7.0",
"author": "David Dal Busco",
"description": "A collection of utils methods and functions developed for DeckDeckGo",
"license": "MIT",
diff --git a/utils/utils/src/utils/utils.ts b/utils/utils/src/utils/utils.ts
index 486a3c1f8..529a85a19 100644
--- a/utils/utils/src/utils/utils.ts
+++ b/utils/utils/src/utils/utils.ts
@@ -16,22 +16,12 @@ export function debounce(func: Function, timeout?: number) {
};
}
-// Source: http://detectmobilebrowsers.com
export function isMobile(): boolean {
- if (!window || !navigator) {
+ if (!window) {
return false;
}
- const a: string = navigator.userAgent || navigator.vendor || (window as any).opera;
-
- return (
- /(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od|ad)|iris|kindle|lge |maemo|midp|mmp|mobile.+firefox|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows ce|xda|xiino/i.test(
- a
- ) ||
- /1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(
- a.substr(0, 4)
- )
- );
+ return window.matchMedia('(any-pointer:coarse)').matches;
}
export function isIOS(): boolean {
@@ -41,7 +31,7 @@ export function isIOS(): boolean {
const a: string = navigator.userAgent || navigator.vendor || (window as any).opera;
- return /iPad|iPhone|iPod/i.test(a);
+ return /iPhone|iPod/i.test(a) || isIPad();
}
export function isIPad(): boolean {
@@ -51,7 +41,13 @@ export function isIPad(): boolean {
const a: string = navigator.userAgent || navigator.vendor || (window as any).opera;
- return /iPad/i.test(a);
+ // iOS 12 and below
+ if (/iPad/i.test(a)) {
+ return true;
+ }
+
+ // iOS 13+
+ return /Macintosh/i.test(a) && isMobile();
}
export function isFullscreen(): boolean {
@@ -80,3 +76,17 @@ export function isRTL(): boolean {
const htmlDir: string | null = document.documentElement.getAttribute('dir');
return htmlDir !== null && htmlDir === 'rtl';
}
+
+// Source: Ionic ionic-framework/angular/src/providers/platform.ts
+
+export function isLandscape(): boolean {
+ return !isPortrait();
+}
+
+export function isPortrait(): boolean {
+ if (!window) {
+ return false;
+ }
+
+ return window.matchMedia && window.matchMedia('(orientation: portrait)').matches;
+}
diff --git a/webcomponents/highlight-code/CHANGELOG.md b/webcomponents/highlight-code/CHANGELOG.md
index 7997889df..2ebe62d8b 100644
--- a/webcomponents/highlight-code/CHANGELOG.md
+++ b/webcomponents/highlight-code/CHANGELOG.md
@@ -1,3 +1,16 @@
+# 2.2.1 (2020-11-19)
+
+### Style
+
+- cursor text if set as editable
+
+# 2.2.0 (2020-11-19)
+
+### Style
+
+- new style to hide characters in ubuntu bar buttons
+- ubuntu styling options variables renamed
+
# 2.1.1 (2020-10-23)
### Fix
diff --git a/webcomponents/highlight-code/package-lock.json b/webcomponents/highlight-code/package-lock.json
index f4d714d5d..9d9c862d7 100644
--- a/webcomponents/highlight-code/package-lock.json
+++ b/webcomponents/highlight-code/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/highlight-code",
- "version": "2.1.1",
+ "version": "2.2.1",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/webcomponents/highlight-code/package.json b/webcomponents/highlight-code/package.json
index 20199d408..5c9e1143f 100644
--- a/webcomponents/highlight-code/package.json
+++ b/webcomponents/highlight-code/package.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/highlight-code",
- "version": "2.1.1",
+ "version": "2.2.1",
"description": "A Web Component to highlight your code",
"main": "dist/index.cjs.js",
"module": "dist/index.js",
diff --git a/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.scss b/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.scss
index 2c3f8294a..7a9e8bb59 100644
--- a/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.scss
+++ b/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.scss
@@ -18,6 +18,10 @@
}
:host([editable]) {
+ div.deckgo-highlight-code-container {
+ cursor: text;
+ }
+
code:empty:not(:focus):after {
content: var(--deckgo-highlight-code-empty-text, "Click to add your code");
}
@@ -259,38 +263,46 @@ div.ubuntu {
align-items: center;
justify-content: center;
- width: var(--deckgo-highlight-code-carbon-header-button-width, 12px);
- height: var(--deckgo-highlight-code-carbon-header-button-height, 12px);
- border-radius: var(--deckgo-highlight-code-carbon-header-button-border-radius, 50%);
- margin: var(--deckgo-highlight-code-carbon-header-button-margin, 0 4px 0 0);
+ width: var(--deckgo-highlight-code-ubuntu-header-button-width, 12px);
+ height: var(--deckgo-highlight-code-ubuntu-header-button-height, 12px);
+ border-radius: var(--deckgo-highlight-code-ubuntu-header-button-border-radius, 50%);
+ margin: var(--deckgo-highlight-code-ubuntu-header-button-margin, 0 4px 0 0);
- font-size: var(--deckgo-highlight-code-carbon-header-button-font-size, 7px);
+ font-size: var(--deckgo-highlight-code-ubuntu-header-button-font-size, 7px);
- color: var(--deckgo-highlight-code-carbon-header-button-color, black);
+ color: var(--deckgo-highlight-code-ubuntu-header-button-color, black);
- text-shadow: var(--deckgo-highlight-code-carbon-header-button-text-shadow, 0px 1px 0px rgba(255, 255, 255, 0.2));
- box-shadow: var(--deckgo-highlight-code-carbon-header-button-box-shadow, 0px 0px 1px 0px #41403a, 0px 1px 1px 0px #474642);
+ text-shadow: var(--deckgo-highlight-code-ubuntu-header-button-text-shadow, 0px 1px 0px rgba(255, 255, 255, 0.2));
+ box-shadow: var(--deckgo-highlight-code-ubuntu-header-button-box-shadow, 0px 0px 1px 0px #41403a, 0px 1px 1px 0px #474642);
&.close {
- background: var(--deckgo-highlight-code-carbon-header-button-close-background, linear-gradient(#f37458 0%, #de4c12 100%));
- border: var(--deckgo-highlight-code-carbon-header-button-close-border);
+ background: var(--deckgo-highlight-code-ubuntu-header-button-close-background, linear-gradient(#f37458 0%, #de4c12 100%));
+ border: var(--deckgo-highlight-code-ubuntu-header-button-close-border);
}
&.minimize {
- background: var(--deckgo-highlight-code-carbon-header-button-minimize-background, linear-gradient(#7d7871 0%, #595953 100%));
- border: var(--deckgo-highlight-code-carbon-header-button-minimize-border);
+ background: var(--deckgo-highlight-code-ubuntu-header-button-minimize-background, linear-gradient(#7d7871 0%, #595953 100%));
+ border: var(--deckgo-highlight-code-ubuntu-header-button-minimize-border);
}
&.maximize {
- background: var(--deckgo-highlight-code-carbon-header-button-maximize-background, linear-gradient(#7d7871 0%, #595953 100%));
- border: var(--deckgo-highlight-code-carbon-header-button-maximize-border);
+ background: var(--deckgo-highlight-code-ubuntu-header-button-maximize-background, linear-gradient(#7d7871 0%, #595953 100%));
+ border: var(--deckgo-highlight-code-ubuntu-header-button-maximize-border);
+ }
+
+ &.close,
+ &.minimize,
+ &.maximize {
+ span {
+ display: var(--deckgo-highlight-code-ubuntu-header-button-span-display, inherit);
+ }
}
}
> p {
- color: var(--deckgo-highlight-code-carbon-header-user-color, #d5d0ce);
- font-size: var(--deckgo-highlight-code-carbon-header-user-font-size, 12px);
- line-height: var(--deckgo-highlight-code-carbon-header-user-line-height, 14px);
- margin: var(--deckgo-highlight-code-carbon-header-user-margin, 0 0 1px 4px);
+ color: var(--deckgo-highlight-code-ubuntu-header-user-color, #d5d0ce);
+ font-size: var(--deckgo-highlight-code-ubuntu-header-user-font-size, 12px);
+ line-height: var(--deckgo-highlight-code-ubuntu-header-user-line-height, 14px);
+ margin: var(--deckgo-highlight-code-ubuntu-header-user-margin, 0 0 1px 4px);
}
}
diff --git a/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.tsx b/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.tsx
index 73a882509..1c96f396f 100644
--- a/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.tsx
+++ b/webcomponents/highlight-code/src/components/highlight-code/deckdeckgo-highlight-code.tsx
@@ -675,6 +675,10 @@ export class DeckdeckgoHighlightCode {
private renderUbuntuCircle(mode: 'close' | 'minimize' | 'maximize') {
const symbol: string = mode === 'close' ? '✕' : mode === 'minimize' ? '─' : '◻';
- return ;
+ return (
+
+
+
+ );
}
}
diff --git a/webcomponents/highlight-code/src/declarations/deckdeckgo-highlight-code-languages.tsx b/webcomponents/highlight-code/src/declarations/deckdeckgo-highlight-code-languages.tsx
index 659bf0090..d5c86d3e5 100644
--- a/webcomponents/highlight-code/src/declarations/deckdeckgo-highlight-code-languages.tsx
+++ b/webcomponents/highlight-code/src/declarations/deckdeckgo-highlight-code-languages.tsx
@@ -171,6 +171,7 @@ export const deckdeckgoHighlightCodeLanguages: DeckdeckgoHighlightCodeLanguages
powershell: {title: 'PowerShell'},
processing: {title: 'Processing'},
prolog: {title: 'Prolog'},
+ promql: {title: 'PromQL'},
properties: {title: '.properties'},
protobuf: {title: 'Protocol Buffers'},
pug: {title: 'Pug', require: ['markup']},
diff --git a/webcomponents/markdown/CHANGELOG.md b/webcomponents/markdown/CHANGELOG.md
index 6fd9647c0..f0dbb5767 100644
--- a/webcomponents/markdown/CHANGELOG.md
+++ b/webcomponents/markdown/CHANGELOG.md
@@ -1,3 +1,22 @@
+# 2.0.1 (2020-11-21)
+
+### Style
+
+- editable after placeholder
+
+# 2.0.0 (2020-11-20)
+
+### Features
+
+- image width and height can be provided as "width:100px,height:20px"
+
+# 1.1.1 (2020-11-19)
+
+### Style
+
+- cursor text if set as editable
+- editable zone clickable on the all width
+
# 1.1.0 (2020-11-16)
### Features
diff --git a/webcomponents/markdown/package-lock.json b/webcomponents/markdown/package-lock.json
index bcb1aeb9b..ad7d12cc4 100644
--- a/webcomponents/markdown/package-lock.json
+++ b/webcomponents/markdown/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/markdown",
- "version": "1.1.0",
+ "version": "2.0.1",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/webcomponents/markdown/package.json b/webcomponents/markdown/package.json
index 53e4f6e47..9c6919388 100644
--- a/webcomponents/markdown/package.json
+++ b/webcomponents/markdown/package.json
@@ -1,6 +1,6 @@
{
"name": "@deckdeckgo/markdown",
- "version": "1.1.0",
+ "version": "2.0.1",
"description": "A Web Component to render markdown to HTML",
"main": "dist/index.cjs.js",
"module": "dist/index.js",
diff --git a/webcomponents/markdown/src/components/markdown/deckdeckgo-markdown.scss b/webcomponents/markdown/src/components/markdown/deckdeckgo-markdown.scss
index e3afdd24b..a55c8474e 100644
--- a/webcomponents/markdown/src/components/markdown/deckdeckgo-markdown.scss
+++ b/webcomponents/markdown/src/components/markdown/deckdeckgo-markdown.scss
@@ -10,13 +10,18 @@
}
:host([editable]) {
+ div.deckgo-markdown-container {
+ cursor: text;
+ }
+
div.markdown:empty:not(:focus):after {
- content: var(--deckgo-markdown-empty-text, "Click to add content using Markdown");
+ content: var(--deckgo-markdown-empty-text, "Click to add markdown content");
font-size: var(--deckgo-markdown-empty-font-size, 1.4em);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
+ width: 100%;
}
}
@@ -24,6 +29,7 @@
::slotted([slot="markdown"]) {
display: inline-block;
white-space: pre-wrap;
+ width: 100%;
}
div.markdown {