diff --git a/README.md b/README.md
index 650acb97..d91bd147 100644
--- a/README.md
+++ b/README.md
@@ -25,10 +25,10 @@ Tool uses Editor.js pasted patterns handling and inserts iframe with embedded co
- [CodePen](https://codepen.io) — `codepen` service
- [Pinterest](https://www.pinterest.com) - `pinterest` service
- [GitHub Gist](https://gist.github.com) - `github` service
+- [Figma](https://www.figma.com/) - `figma` service
+- [Whimsical](https://whimsical.com/) - whimsical service
- 👇 Any other [customized service](#add-more-services)
-
-
## Installation
Get the package
@@ -151,6 +151,7 @@ var editor = EditorJS({
```
#### Inline Toolbar
+
Editor.js provides useful inline toolbar. You can allow it\`s usage in the Embed Tool caption by providing `inlineToolbar: true`.
```javascript
@@ -180,7 +181,6 @@ var editor = EditorJS({
| height | `number` | embedded content height
| caption | `string` | content caption
-
```json
{
"type" : "embed",
diff --git a/package.json b/package.json
index c1087c17..bb63bbc7 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "@editorjs/embed",
- "version": "2.7.6",
+ "version": "2.7.7",
"keywords": [
"codex editor",
"embed",
diff --git a/src/services.ts b/src/services.ts
index 27e8e9c2..f536aaef 100644
--- a/src/services.ts
+++ b/src/services.ts
@@ -40,7 +40,7 @@ const SERVICES: ServicesConfigType = {
return null;
}
- if (!(paramsMap[name])) {
+ if (!paramsMap[name]) {
return null;
}
@@ -131,7 +131,6 @@ const SERVICES: ServicesConfigType = {
id: (ids) => ids.join('/embed/'),
},
instagram: {
- //it support both reel and post
regex: /^https:\/\/(?:www\.)?instagram\.com\/(?:reel|p)\/(.*)/,
embedUrl: 'https://www.instagram.com/p/<%= remote_id %>/embed',
html: '',
@@ -183,6 +182,21 @@ const SERVICES: ServicesConfigType = {
width: 600,
id: (groups) => `${groups.join('/')}.js`,
},
+ whimsical: {
+ regex: /(https:\/\/)?whimsical.com\/(?:[a-zA-Z0-9\-]+\-)?([a-km-zA-HJ-NP-Z1-9]{16,22})(@[a-km-zA-HJ-NP-Z1-9]+)?/,
+ embedUrl: 'https://whimsical.com/embed/<%= remote_id %>',
+ html: "",
+ height: 300,
+ width: 600,
+ id: (ids) => ids[1]
+ },
+ figma:{
+ regex: /(https:\/\/www\.figma\.com\/.*)?/,
+ embedUrl: 'https://www.figma.com/embed?embed_host=share&url=<%= remote_id %>',
+ html: "",
+ height: 300,
+ width: 600
+ },
};
export default SERVICES;
diff --git a/test/services.ts b/test/services.ts
index 1685d840..d67d712a 100644
--- a/test/services.ts
+++ b/test/services.ts
@@ -463,3 +463,30 @@ describe('Miro service', () => {
})
});
+describe('whimsical', () => {
+ it('should correctly parse URL got from a browser', () => {
+ const regularBoardUrl = 'https://whimsical.com/test-86ajy7vWEzYATvwFFvbwfA';
+ const event = composePasteEventMock('pattern', 'whimsical', regularBoardUrl);
+
+ embed.onPaste(event);
+
+ expect(patterns.whimsical.test(regularBoardUrl)).to.be.true;
+ expect(embed.data.service).to.be.equal('whimsical');
+ expect(embed.data.embed).to.be.equal('https://whimsical.com/embed/86ajy7vWEzYATvwFFvbwfA');
+ expect(embed.data.source).to.be.equal(regularBoardUrl);
+ });
+});
+
+describe('figma', () => {
+ it('should correctly parse URL got from a browser', () => {
+ const regularBoardUrl = 'https://www.figma.com/file/3BYrViWFPvfhbrpm1aO3ha/Untitled?type=design&node-id=0%3A1&mode=design&t=WutMRT9L8VJNEL5z-1';
+ const event = composePasteEventMock('pattern', 'figma', regularBoardUrl);
+
+ embed.onPaste(event);
+
+ expect(patterns.figma.test(regularBoardUrl)).to.be.true;
+ expect(embed.data.service).to.be.equal('figma');
+ expect(embed.data.embed).to.be.equal('https://www.figma.com/embed?embed_host=share&url=https://www.figma.com/file/3BYrViWFPvfhbrpm1aO3ha/Untitled?type=design&node-id=0%3A1&mode=design&t=WutMRT9L8VJNEL5z-1');
+ expect(embed.data.source).to.be.equal(regularBoardUrl);
+ });
+});