web-social-share - npm Package Compare versions

Comparing version 6.4.1 to 7.0.0

CHANGELOG.md

@@ -0,2 +1,21 @@
+<a name="7.0.0"></a>
+
+# [7.0.0](https://github.com/peterpeterparker/web-social-share/compare/v6.4.1...v7.0.0) (2021-01-24)
+
+### Breaking changes
+
+- drop support of IE11, Edge 16-18 and Safari 10
+
+### Features
+
+- update dependencies (Stencil v2)
+- code refactored to hopefully make it easier to read
+- `isMobile` detection improved
+
+### Chore
+
+- use prettier to format code
+
 <a name="6.4.1"></a>
+
 # [6.4.1](https://github.com/peterpeterparker/web-social-share/compare/v6.4.0...v6.4.1) (2020-08-15)
@@ -9,2 +28,3 @@
 <a name="6.4.0"></a>
+
 # [6.4.0](https://github.com/peterpeterparker/web-social-share/compare/v6.3.0...v6.4.0) (2020-03-20)
@@ -14,5 +34,6 @@
 
-* update dependencies
+- update dependencies
 
 <a name="6.3.0"></a>
+
 # [6.3.0](https://github.com/peterpeterparker/web-social-share/compare/v6.2.0...v6.3.0) (2020-02-07)
@@ -22,10 +43,11 @@
 
-* add "Hacker News"
-* exposes interfaces in bundle
-* improve UI (max. width 540px instead of 500px, box-shadow and border-radius for the container)
-* refactor duplicate actions functions code
-* GitHub action to deploy demo website to Firebase
-* transfer GitHub repo to my self ([peterpeterparker](https://github.com/peterpeterparker/web-social-share)) 
+- add "Hacker News"
+- exposes interfaces in bundle
+- improve UI (max. width 540px instead of 500px, box-shadow and border-radius for the container)
+- refactor duplicate actions functions code
+- GitHub action to deploy demo website to Firebase
+- transfer GitHub repo to my self ([peterpeterparker](https://github.com/peterpeterparker/web-social-share))
 
 <a name="6.2.0"></a>
+
 # [6.2.0](https://github.com/peterpeterparker/web-social-share/compare/v6.1.0...v6.2.0) (2019-07-30)
@@ -35,3 +57,3 @@
 
-* refactor component to avoid the need to move slots in order to be compatible with Font Awesome (CSS import) ([#18](https://github.com/peterpeterparker/web-social-share/issues/18))
+- refactor component to avoid the need to move slots in order to be compatible with Font Awesome (CSS import) ([#18](https://github.com/peterpeterparker/web-social-share/issues/18))
 
@@ -57,2 +79,3 @@ ### Special note
 <a name="6.1.0"></a>
+
 # [6.1.0](https://github.com/peterpeterparker/web-social-share/compare/v6.0.0...v6.1.0) (2019-07-12)
@@ -62,5 +85,6 @@
 
-* CSS variable to set the base zIndex of the component
+- CSS variable to set the base zIndex of the component
 
 <a name="6.0.0"></a>
+
 # [6.0.0](https://github.com/peterpeterparker/web-social-share/compare/v5.1.0...v6.0.0) (2019-06-11)
@@ -70,5 +94,6 @@
 
-* add "Copy (to clipboard)" support ([#17](https://github.com/peterpeterparker/web-social-share/issues/17))
+- add "Copy (to clipboard)" support ([#17](https://github.com/peterpeterparker/web-social-share/issues/17))
 
 <a name="5.1.0"></a>
+
 # [5.1.0](https://github.com/peterpeterparker/web-social-share/compare/v5.0.0...v5.1.0) (2019-06-05)
@@ -78,5 +103,6 @@
 
-* Stencil One
+- Stencil One
 
 <a name="5.0.0"></a>
+
 # [5.0.0](https://github.com/peterpeterparker/web-social-share/compare/v4.0.2...v5.0.0) (2019-02-17)
@@ -86,3 +112,3 @@
 
-* transform component to a shadowed Web Component ([#14](https://github.com/peterpeterparker/web-social-share/issues/14))
+- transform component to a shadowed Web Component ([#14](https://github.com/peterpeterparker/web-social-share/issues/14))
 
@@ -93,5 +119,6 @@ Notes:
 
-If you would miss variables to style the component, ping me, I would be happy to add more options. 
+If you would miss variables to style the component, ping me, I would be happy to add more options.
 
 <a name="4.0.2"></a>
+
 # [4.0.2](https://github.com/peterpeterparker/web-social-share/compare/v4.0.1...v4.0.2) (2019-02-02)
@@ -101,5 +128,6 @@
 
-* incorrect URL when WhatsApp socialShareText is empty ([#13](https://github.com/peterpeterparker/web-social-share/pull/13), thx @fmendoza for the PR 👍)
+- incorrect URL when WhatsApp socialShareText is empty ([#13](https://github.com/peterpeterparker/web-social-share/pull/13), thx @fmendoza for the PR 👍)
 
 <a name="4.0.1"></a>
+
 # [4.0.1](https://github.com/peterpeterparker/web-social-share/compare/v4.0.0...v4.0.1) (2019-01-29)
@@ -109,5 +137,6 @@
 
-* freaking iphone might cut action text ([a6bd031](https://github.com/peterpeterparker/web-social-share/commit/a6bd031aeb4e7b7a9f32870613eb68002d40db82) and [1856787](https://github.com/peterpeterparker/web-social-share/commit/18567873b8244e625e874ee6941043edc1acafc5))
+- freaking iphone might cut action text ([a6bd031](https://github.com/peterpeterparker/web-social-share/commit/a6bd031aeb4e7b7a9f32870613eb68002d40db82) and [1856787](https://github.com/peterpeterparker/web-social-share/commit/18567873b8244e625e874ee6941043edc1acafc5))
 
 <a name="4.0.0"></a>
+
 # [4.0.0](https://github.com/peterpeterparker/web-social-share/compare/v3.0.1...v4.0.0) (2019-01-29)
@@ -117,6 +146,7 @@
 
-* add WhatsApp support ([#11](https://github.com/peterpeterparker/web-social-share/issues/11))
-* add a CSS4 variable to customize the height of the action sheet on small devices ([#12](https://github.com/peterpeterparker/web-social-share/issues/12))
+- add WhatsApp support ([#11](https://github.com/peterpeterparker/web-social-share/issues/11))
+- add a CSS4 variable to customize the height of the action sheet on small devices ([#12](https://github.com/peterpeterparker/web-social-share/issues/12))
 
 <a name="3.0.1"></a>
+
 # [3.0.1](https://github.com/peterpeterparker/web-social-share/compare/v3.0.0...v3.0.1) (2019-01-26)
@@ -126,5 +156,6 @@
 
-* the move slot method might be executed before the sub-component is loaded ([#9](https://github.com/peterpeterparker/web-social-share/issues/9))
+- the move slot method might be executed before the sub-component is loaded ([#9](https://github.com/peterpeterparker/web-social-share/issues/9))
 
 <a name="3.0.0"></a>
+
 # [3.0.0](https://github.com/peterpeterparker/web-social-share/compare/v2.1.4...v3.0.0) (2019-01-26)
@@ -134,14 +165,15 @@
 
-* add pseudo slots to the social share actions ([#8](https://github.com/peterpeterparker/web-social-share/issues/8))
-* ability to customize / override rendered names ([#7](https://github.com/peterpeterparker/web-social-share/issues/7))
+- add pseudo slots to the social share actions ([#8](https://github.com/peterpeterparker/web-social-share/issues/8))
+- ability to customize / override rendered names ([#7](https://github.com/peterpeterparker/web-social-share/issues/7))
 
 ### Website
 
-* a bit of styling and text editing on the `index.html` file for the website
+- a bit of styling and text editing on the `index.html` file for the website
 
 ### Libs
 
-* update libs
+- update libs
 
 <a name="2.1.4"></a>
+
 # [2.1.4](https://github.com/peterpeterparker/web-social-share/compare/v2.1.3...v2.1.4) (2018-08-24)
@@ -151,5 +183,6 @@
 
-* fix Safari z-index ([92dc154](https://github.com/peterpeterparker/web-social-share/commit/92dc154d8246bd822fd324051b68ca935645c5c9)
+- fix Safari z-index ([92dc154](https://github.com/peterpeterparker/web-social-share/commit/92dc154d8246bd822fd324051b68ca935645c5c9)
 
 <a name="2.1.3"></a>
+
 # [2.1.3](https://github.com/peterpeterparker/web-social-share/compare/v2.1.2...v2.1.3) (2018-08-23)
@@ -159,5 +192,6 @@
 
-* fix action sheet not closed on middle click ([#5](https://github.com/peterpeterparker/web-social-share/issues/5))
+- fix action sheet not closed on middle click ([#5](https://github.com/peterpeterparker/web-social-share/issues/5))
 
 <a name="2.1.2"></a>
+
 # [2.1.2](https://github.com/peterpeterparker/web-social-share/compare/v2.1.1...v2.1.2) (2018-08-23)
@@ -167,5 +201,6 @@
 
-* use full page height ([#4](https://github.com/peterpeterparker/web-social-share/issues/4))
+- use full page height ([#4](https://github.com/peterpeterparker/web-social-share/issues/4))
 
 <a name="2.1.1"></a>
+
 # [2.1.1](https://github.com/peterpeterparker/web-social-share/compare/v2.1.0...v2.1.1) (2018-08-23)
@@ -175,5 +210,6 @@
 
-* resolve build warning ([99a118428c3915379e5bf38b3301e3594174fb9f](https://github.com/peterpeterparker/web-social-share/commit/99a118428c3915379e5bf38b3301e3594174fb9f))
+- resolve build warning ([99a118428c3915379e5bf38b3301e3594174fb9f](https://github.com/peterpeterparker/web-social-share/commit/99a118428c3915379e5bf38b3301e3594174fb9f))
 
 <a name="2.1.0"></a>
+
 # [2.1.0](https://github.com/peterpeterparker/web-social-share/compare/v2.0.0...v2.1.0) (2018-08-19)
@@ -183,6 +219,7 @@
 
-* update Stencil ([#2](https://github.com/peterpeterparker/web-social-share/issues/2))
-* target ES2017 ([#3](https://github.com/peterpeterparker/web-social-share/issues/3))
+- update Stencil ([#2](https://github.com/peterpeterparker/web-social-share/issues/2))
+- target ES2017 ([#3](https://github.com/peterpeterparker/web-social-share/issues/3))
 
 <a name="2.0.0"></a>
+
 # [2.0.0](https://github.com/peterpeterparker/web-social-share/compare/v1.1.0...v2.0.0) (2018-08-12)
@@ -192,3 +229,3 @@
 
-* **breaking changes**: Update the component in order to be compatible with **Ionic v4** and **Angular v6**
+- **breaking changes**: Update the component in order to be compatible with **Ionic v4** and **Angular v6**
 
@@ -198,2 +235,1 @@ ### Important note
 I did not gave a try but this version might no be suitable anymore for Ionic v3 and Angular v5. If you are using the web-social-share component in such apps, you might better not upgrade and stick to the component version v1.1.0
- 

dist/cjs/loader.cjs.js

@@ -5,8 +5,14 @@ 'use strict';
 
-const index = require('./index-4ee16ff7.js');
-const patch = require('./patch-f28cc54b.js');
+const index = require('./index-c24f442c.js');
 
+/*
+ Stencil Client Patch Esm v2.3.0 | MIT Licensed | https://stenciljs.com
+ */
+const patchEsm = () => {
+    return index.promiseResolve();
+};
+
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
-  return patch.patchEsm().then(() => {
+  return patchEsm().then(() => {
   return index.bootstrapLazy([["web-social-share.cjs",[[1,"web-social-share",{"show":[1028],"share":[16]}]]]], options);
@@ -13,0 +19,0 @@ });

dist/cjs/web-social-share.cjs.entry.js

@@ -5,3 +5,3 @@ 'use strict';
 
-const index = require('./index-4ee16ff7.js');
+const index = require('./index-c24f442c.js');
 
@@ -11,364 +11,367 @@ /**
  */
-class WebSocialShareFacebook {
-    static async share(attrs) {
-        let urlString;
-        if (attrs.socialShareType && attrs.socialShareType === 'feed') {
-            // if user specifies that they want to use the Facebook feed dialog
-            //(https://developers.facebook.com/docs/sharing/reference/feed-dialog/v2.4)
-            urlString = 'https://www.facebook.com/dialog/feed?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareTo) {
-                urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            if (attrs.socialShareRef) {
-                urlString += '&ref=' + encodeURIComponent(attrs.socialShareRef);
-            }
-            if (attrs.socialShareFrom) {
-                urlString += '&from=' + encodeURIComponent(attrs.socialShareFrom);
-            }
-            if (attrs.socialShareSource) {
-                urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else if (attrs.socialShareType && attrs.socialShareType === 'share') {
-            // if user specifies that they want to use the Facebook share dialog
-            //(https://developers.facebook.com/docs/sharing/reference/share-dialog)
-            urlString = 'https://www.facebook.com/dialog/share?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&href=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareQuote) {
-                urlString += '&quote=' + encodeURIComponent(attrs.socialShareQuote);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            if (attrs.socialShareMobileiframe) {
-                urlString += '&mobile_iframe=' + encodeURIComponent(attrs.socialShareMobileiframe);
-            }
-            if (attrs.socialShareHashtags) {
-                urlString += '&hashtag=' + encodeURIComponent(attrs.socialShareHashtags);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else if (attrs.socialShareType && attrs.socialShareType === 'send') {
-            // if user specifies that they want to use the Facebook send dialog
-            //(https://developers.facebook.com/docs/sharing/reference/send-dialog)
-            urlString = 'https://www.facebook.com/dialog/send?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareTo) {
-                urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else {
-            //otherwise default to using sharer.php
-            window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(attrs.socialShareUrl || window.location.href), 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+const shareFacebook = async (attrs) => {
+  let urlString;
+  if (attrs.socialShareType && attrs.socialShareType === 'feed') {
+    // if user specifies that they want to use the Facebook feed dialog
+    //(https://developers.facebook.com/docs/sharing/reference/feed-dialog/v2.4)
+    urlString = 'https://www.facebook.com/dialog/feed?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
     }
-}
-
-class WebSocialShareUtils {
-    // Source: http://detectmobilebrowsers.com
-    // Same implementation as in class DeckdeckgoUtils
-    static isMobile() {
-        if (!window) {
-            return false;
-        }
-        const a = navigator.userAgent || navigator.vendor || window.opera;
-        return (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|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)));
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
     }
-    static staticOpenNewWindow(urlString) {
-        if (window.self !== window.top) {
-            window.open(urlString, '_blank');
-        }
-        else {
-            window.open(urlString, '_self');
-        }
+    if (attrs.socialShareUrl) {
+      urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
     }
-}
-
-class WebSocialShareTwitter {
-    static async share(attrs) {
-        let urlString = 'https://www.twitter.com/intent/tweet?';
-        if (attrs.socialShareText) {
-            urlString += 'text=' + encodeURIComponent(attrs.socialShareText);
-        }
-        if (attrs.socialShareVia) {
-            urlString += '&via=' + encodeURIComponent(attrs.socialShareVia);
-        }
-        if (attrs.socialShareHashtags) {
-            urlString += '&hashtags=' + encodeURIComponent(attrs.socialShareHashtags);
-        }
-        //default to the current page if a URL isn't specified
-        urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (WebSocialShareUtils.isMobile()) {
-            WebSocialShareUtils.staticOpenNewWindow(urlString);
-        }
-        else {
-            window.open(urlString, 'Twitter', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+    if (attrs.socialShareTo) {
+      urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
     }
-}
-
-class WebSocialShareEmail {
-    static async share(attrs) {
-        let urlString = 'mailto:';
-        if (attrs.socialShareTo) {
-            urlString += encodeURIComponent(attrs.socialShareTo);
-        }
-        urlString += '?';
-        if (attrs.socialShareBody) {
-            urlString += 'body=' + encodeURIComponent(attrs.socialShareBody);
-        }
-        if (attrs.socialShareSubject) {
-            urlString += '&subject=' + encodeURIComponent(attrs.socialShareSubject);
-        }
-        if (attrs.socialShareCc) {
-            urlString += '&cc=' + encodeURIComponent(attrs.socialShareCc);
-        }
-        if (attrs.socialShareBcc) {
-            urlString += '&bcc=' + encodeURIComponent(attrs.socialShareBcc);
-        }
-        WebSocialShareUtils.staticOpenNewWindow(urlString);
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
     }
-}
-
-class WebSocialShareLinkedin {
-    static async share(attrs) {
-        let urlString = 'https://www.linkedin.com/shareArticle?mini=true';
-        urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (attrs.socialShareText) {
-            urlString += '&title=' + encodeURIComponent(attrs.socialShareText);
-        }
-        if (attrs.socialShareDescription) {
-            urlString += '&summary=' + encodeURIComponent(attrs.socialShareDescription);
-        }
-        if (attrs.socialShareSource) {
-            urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
-        }
-        window.open(urlString, 'Linkedin', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareRef) {
+      urlString += '&ref=' + encodeURIComponent(attrs.socialShareRef);
     }
-}
-
-class WebSocialSharePinterest {
-    static async share(attrs) {
-        window.open('https://www.pinterest.com/pin/create/button/?url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&media=' + encodeURIComponent(attrs.socialShareMedia) + '&description=' + encodeURIComponent(attrs.socialShareText), 'Pinterest', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareFrom) {
+      urlString += '&from=' + encodeURIComponent(attrs.socialShareFrom);
     }
-}
-
-class WebSocialShareReddit {
-    static async share(attrs) {
-        let urlString = 'https://www.reddit.com/';
-        if (attrs.socialShareSubreddit) {
-            urlString += 'r/' + attrs.socialShareSubreddit + '/submit?url=';
-        }
-        else {
-            urlString += 'submit?url=';
-        }
-        /*-
-        * Reddit isn't responsive and at default width for our popups (500 x 500), everything is messed up.
-        * So, overriding the width if it is less than 900 (played around to settle on this) and height if
-        * it is less than 650px.
-        */
-        if (attrs.socialSharePopupWidth < 900) {
-            attrs.socialSharePopupWidth = 900;
-        }
-        if (attrs.socialSharePopupHeight < 650) {
-            attrs.socialSharePopupHeight = 650;
-        }
-        window.open(urlString + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&title=' + encodeURIComponent(attrs.socialShareText), 'Reddit', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareSource) {
+      urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
     }
-}
-
-class WebSocialShareWhatsapp {
-    static async share(attrs) {
-        const isMobile = WebSocialShareUtils.isMobile();
-        let urlString = isMobile ? 'https://api.whatsapp.com/send?text=' : 'https://web.whatsapp.com/send?text=';
-        if (attrs.socialShareText) {
-            urlString += encodeURIComponent(attrs.socialShareText) + '%0A';
-        }
-        //default to the current page if a URL isn't specified
-        urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (isMobile) {
-            WebSocialShareUtils.staticOpenNewWindow(urlString);
-        }
-        else {
-            window.open(urlString, 'WhatsApp', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else if (attrs.socialShareType && attrs.socialShareType === 'share') {
+    // if user specifies that they want to use the Facebook share dialog
+    //(https://developers.facebook.com/docs/sharing/reference/share-dialog)
+    urlString = 'https://www.facebook.com/dialog/share?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
     }
-}
-
-class WebSocialShareCopy {
-    static async share(attrs) {
-        try {
-            await navigator.clipboard.writeText(attrs.socialShareUrl || window.location.href);
-        }
-        catch (err) {
-            // Well it seems that copy isn't supported by this browser
-        }
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
     }
-}
-
-class WebSocialShareHackerNews {
-    static async share(attrs) {
-        let urlString = 'https://news.ycombinator.com/submitlink?u=';
-        //default to the current page if a URL isn't specified
-        urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (attrs.socialShareText) {
-            urlString += '&t=' + encodeURIComponent(attrs.socialShareText);
-        }
-        WebSocialShareUtils.staticOpenNewWindow(urlString);
+    if (attrs.socialShareUrl) {
+      urlString += '&href=' + encodeURIComponent(attrs.socialShareUrl);
     }
-}
+    if (attrs.socialShareQuote) {
+      urlString += '&quote=' + encodeURIComponent(attrs.socialShareQuote);
+    }
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
+    }
+    if (attrs.socialShareMobileiframe) {
+      urlString += '&mobile_iframe=' + encodeURIComponent(attrs.socialShareMobileiframe);
+    }
+    if (attrs.socialShareHashtags) {
+      urlString += '&hashtag=' + encodeURIComponent(attrs.socialShareHashtags);
+    }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else if (attrs.socialShareType && attrs.socialShareType === 'send') {
+    // if user specifies that they want to use the Facebook send dialog
+    //(https://developers.facebook.com/docs/sharing/reference/send-dialog)
+    urlString = 'https://www.facebook.com/dialog/send?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
+    }
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
+    }
+    if (attrs.socialShareUrl) {
+      urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
+    }
+    if (attrs.socialShareTo) {
+      urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
+    }
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
+    }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else {
+    //otherwise default to using sharer.php
+    window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(attrs.socialShareUrl || window.location.href), 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
 
-const webSocialShareCss = "div.web-social-share{visibility:hidden;opacity:0;cursor:pointer;-ms-touch-action:manipulation;touch-action:manipulation}div.web-social-share.web-social-share-open{visibility:visible;opacity:1}div.web-social-share.web-social-share-open div.web-social-share-backdrop{opacity:var(--web-social-share-backdrop-opacity, 0.25)}div.web-social-share.web-social-share-open div.web-social-share-action-sheet{opacity:1}div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height, 80px)}@media (max-width: 540px){div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height-small-device, 140px)}}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-backdrop{opacity:0}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:0}div.web-social-share div.web-social-share-backdrop{opacity:0;-webkit-transition:opacity 0.1s linear;transition:opacity 0.1s linear;background-color:var(--web-social-share-backdrop-background, black);z-index:var(--web-social-share-zindex, 1000);-webkit-transform:translate3d(0, 0, 2px);transform:translate3d(0, 0, 2px);left:0;top:0;position:fixed;height:100%;width:100%}div.web-social-share div.web-social-share-action-sheet{left:0;right:0;top:0;bottom:0;margin:auto;position:fixed;z-index:calc(var(--web-social-share-zindex, 1000) + 1);-webkit-transform:translate3d(0, 0, 3px);transform:translate3d(0, 0, 3px);width:100%;max-width:540px}@media (min-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{border-radius:var(--web-social-share-action-sheet-group-border-radius, 8px 8px 0 0)}}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:100%}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{-webkit-box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));z-index:calc(var(--web-social-share-zindex, 1000) + 10);-webkit-transform:translate3d(0, 0, 10px);transform:translate3d(0, 0, 10px);background:var(--web-social-share-action-sheet-group-background, #fafafa);display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;height:0;-webkit-transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);-webkit-transition:height 0.2s ease-in;transition:height 0.2s ease-in}@media (max-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{-ms-flex-pack:start;justify-content:flex-start}}div.web-social-share div.web-social-share-target{margin:auto;width:var(--web-social-share-target-width, 4rem);height:var(--web-social-share-target-height, 3rem);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}div.web-social-share div.web-social-share-target button{position:relative;cursor:pointer;border:0;background:transparent;width:var(--web-social-share-button-width, 100%);height:var(--web-social-share-button-height, 100%);font-size:var(--web-social-share-button-font-size)}div.web-social-share div.web-social-share-target p{margin:var(--web-social-share-brand-margin, 2px 0);color:var(--web-social-share-brand-color, inherit);font-size:var(--web-social-share-brand-font-size, 0.6rem)}div.web-social-share div.web-social-share-target div.web-social-share-button-icon{margin:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}::slotted([slot=facebook]),::slotted([slot=twitter]),::slotted([slot=email]),::slotted([slot=linkedin]),::slotted([slot=pinterest]),::slotted([slot=reddit]),::slotted([slot=whatsapp]),::slotted([slot=copy]),::slotted([slot=hackernews]){display:none}";
+// Same implementation as in class @deckdeckgo/utils
+const isMobile = () => {
+  return window === null || window === void 0 ? void 0 : window.matchMedia('(any-pointer:coarse)').matches;
+};
+const staticOpenNewWindow = (urlString) => {
+  if (window.self !== window.top) {
+    window.open(urlString, '_blank');
+  }
+  else {
+    window.open(urlString, '_self');
+  }
+};
 
+const shareTwitter = async (attrs) => {
+  let urlString = 'https://www.twitter.com/intent/tweet?';
+  if (attrs.socialShareText) {
+    urlString += 'text=' + encodeURIComponent(attrs.socialShareText);
+  }
+  if (attrs.socialShareVia) {
+    urlString += '&via=' + encodeURIComponent(attrs.socialShareVia);
+  }
+  if (attrs.socialShareHashtags) {
+    urlString += '&hashtags=' + encodeURIComponent(attrs.socialShareHashtags);
+  }
+  //default to the current page if a URL isn't specified
+  urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (isMobile()) {
+    staticOpenNewWindow(urlString);
+  }
+  else {
+    window.open(urlString, 'Twitter', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
+
+const email = async (attrs) => {
+  let urlString = 'mailto:';
+  if (attrs.socialShareTo) {
+    urlString += encodeURIComponent(attrs.socialShareTo);
+  }
+  urlString += '?';
+  if (attrs.socialShareBody) {
+    urlString += 'body=' + encodeURIComponent(attrs.socialShareBody);
+  }
+  if (attrs.socialShareSubject) {
+    urlString += '&subject=' + encodeURIComponent(attrs.socialShareSubject);
+  }
+  if (attrs.socialShareCc) {
+    urlString += '&cc=' + encodeURIComponent(attrs.socialShareCc);
+  }
+  if (attrs.socialShareBcc) {
+    urlString += '&bcc=' + encodeURIComponent(attrs.socialShareBcc);
+  }
+  staticOpenNewWindow(urlString);
+};
+
+const linkedin = async (attrs) => {
+  let urlString = 'https://www.linkedin.com/shareArticle?mini=true';
+  urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (attrs.socialShareText) {
+    urlString += '&title=' + encodeURIComponent(attrs.socialShareText);
+  }
+  if (attrs.socialShareDescription) {
+    urlString += '&summary=' + encodeURIComponent(attrs.socialShareDescription);
+  }
+  if (attrs.socialShareSource) {
+    urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
+  }
+  window.open(urlString, 'Linkedin', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const pinterest = async (attrs) => {
+  window.open('https://www.pinterest.com/pin/create/button/?url=' +
+    encodeURIComponent(attrs.socialShareUrl || window.location.href) +
+    '&media=' +
+    encodeURIComponent(attrs.socialShareMedia) +
+    '&description=' +
+    encodeURIComponent(attrs.socialShareText), 'Pinterest', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const reddit = async (attrs) => {
+  let urlString = 'https://www.reddit.com/';
+  if (attrs.socialShareSubreddit) {
+    urlString += 'r/' + attrs.socialShareSubreddit + '/submit?url=';
+  }
+  else {
+    urlString += 'submit?url=';
+  }
+  /*-
+   * Reddit isn't responsive and at default width for our popups (500 x 500), everything is messed up.
+   * So, overriding the width if it is less than 900 (played around to settle on this) and height if
+   * it is less than 650px.
+   */
+  if (attrs.socialSharePopupWidth < 900) {
+    attrs.socialSharePopupWidth = 900;
+  }
+  if (attrs.socialSharePopupHeight < 650) {
+    attrs.socialSharePopupHeight = 650;
+  }
+  window.open(urlString + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&title=' + encodeURIComponent(attrs.socialShareText), 'Reddit', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const whatsapp = async (attrs) => {
+  const mobile = isMobile();
+  let urlString = mobile ? 'https://api.whatsapp.com/send?text=' : 'https://web.whatsapp.com/send?text=';
+  if (attrs.socialShareText) {
+    urlString += encodeURIComponent(attrs.socialShareText) + '%0A';
+  }
+  //default to the current page if a URL isn't specified
+  urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (mobile) {
+    staticOpenNewWindow(urlString);
+  }
+  else {
+    window.open(urlString, 'WhatsApp', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
+
+const copy = async (attrs) => {
+  try {
+    await navigator.clipboard.writeText(attrs.socialShareUrl || window.location.href);
+  }
+  catch (err) {
+    console.error('Well it seems that copy is not supported by this browser');
+  }
+};
+
+const hackernews = async (attrs) => {
+  let urlString = 'https://news.ycombinator.com/submitlink?u=';
+  //default to the current page if a URL isn't specified
+  urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (attrs.socialShareText) {
+    urlString += '&t=' + encodeURIComponent(attrs.socialShareText);
+  }
+  staticOpenNewWindow(urlString);
+};
+
+const webSocialShareCss = "div.web-social-share{visibility:hidden;opacity:0;cursor:pointer;touch-action:manipulation}div.web-social-share.web-social-share-open{visibility:visible;opacity:1}div.web-social-share.web-social-share-open div.web-social-share-backdrop{opacity:var(--web-social-share-backdrop-opacity, 0.25)}div.web-social-share.web-social-share-open div.web-social-share-action-sheet{opacity:1}div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height, 80px)}@media (max-width: 540px){div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height-small-device, 140px)}}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-backdrop{opacity:0}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:0}div.web-social-share div.web-social-share-backdrop{opacity:0;transition:opacity 0.1s linear;background-color:var(--web-social-share-backdrop-background, black);z-index:var(--web-social-share-zindex, 1000);transform:translate3d(0, 0, 2px);left:0;top:0;position:fixed;height:100%;width:100%}div.web-social-share div.web-social-share-action-sheet{left:0;right:0;top:0;bottom:0;margin:auto;position:fixed;z-index:calc(var(--web-social-share-zindex, 1000) + 1);transform:translate3d(0, 0, 3px);width:100%;max-width:540px}@media (min-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{border-radius:var(--web-social-share-action-sheet-group-border-radius, 8px 8px 0 0)}}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container{display:flex;flex-flow:column;justify-content:flex-end;height:100%;max-height:100%}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));z-index:calc(var(--web-social-share-zindex, 1000) + 10);transform:translate3d(0, 0, 10px);background:var(--web-social-share-action-sheet-group-background, #fafafa);display:flex;justify-content:center;flex-wrap:wrap;height:0;transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);transition:height 0.2s ease-in}@media (max-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{justify-content:flex-start}}div.web-social-share div.web-social-share-target{margin:auto;width:var(--web-social-share-target-width, 4rem);height:var(--web-social-share-target-height, 3rem);display:flex;flex-direction:column;align-items:center;justify-content:center}div.web-social-share div.web-social-share-target button{position:relative;cursor:pointer;border:0;background:transparent;width:var(--web-social-share-button-width, 100%);height:var(--web-social-share-button-height, 100%);font-size:var(--web-social-share-button-font-size)}div.web-social-share div.web-social-share-target p{margin:var(--web-social-share-brand-margin, 2px 0);color:var(--web-social-share-brand-color, inherit);font-size:var(--web-social-share-brand-font-size, 0.6rem)}div.web-social-share div.web-social-share-target div.web-social-share-button-icon{margin:0;display:flex;flex-direction:column;justify-content:center;align-items:center}::slotted([slot=facebook]),::slotted([slot=twitter]),::slotted([slot=email]),::slotted([slot=linkedin]),::slotted([slot=pinterest]),::slotted([slot=reddit]),::slotted([slot=whatsapp]),::slotted([slot=copy]),::slotted([slot=hackernews]){display:none}";
+
 const WebSocialShare = class {
-    constructor(hostRef) {
-        index.registerInstance(this, hostRef);
-        this.closed = index.createEvent(this, "closed", 7);
-        this.handleFacebookShare = async (attributes) => {
-            await WebSocialShareFacebook.share(attributes);
-        };
-        this.handleTwitterShare = async (attributes) => {
-            await WebSocialShareTwitter.share(attributes);
-        };
-        this.handleEmailShare = async (attributes) => {
-            await WebSocialShareEmail.share(attributes);
-        };
-        this.handleLinkedinShare = async (attributes) => {
-            await WebSocialShareLinkedin.share(attributes);
-        };
-        this.handlePinterestShare = async (attributes) => {
-            await WebSocialSharePinterest.share(attributes);
-        };
-        this.handleRedditShare = async (attributes) => {
-            await WebSocialShareReddit.share(attributes);
-        };
-        this.handleWhatsappShare = async (attributes) => {
-            await WebSocialShareWhatsapp.share(attributes);
-        };
-        this.handleCopyShare = async (attributes) => {
-            await WebSocialShareCopy.share(attributes);
-        };
-        this.handleHackerNewsShare = async (attributes) => {
-            await WebSocialShareHackerNews.share(attributes);
-        };
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.closed = index.createEvent(this, "closed", 7);
+  }
+  hide() {
+    if (this.refContainer) {
+      this.refContainer.classList.add('web-social-share-transition-close');
+      setTimeout(() => {
+        // Reflect css animation speed 400ms, see css
+        this.show = false;
+        this.refContainer.classList.remove('web-social-share-transition-close');
+        this.closed.emit();
+      }, 200);
     }
-    hide() {
-        let element = this.el.shadowRoot.querySelector('div.web-social-share');
-        if (element) {
-            element.classList.add('web-social-share-transition-close');
-            setTimeout(() => {
-                // Reflect css animation speed 400ms, see css
-                this.show = false;
-                element.classList.remove('web-social-share-transition-close');
-                this.closed.emit(true);
-            }, 200);
-        }
-        else {
-            // Well we don't find the action sheet, we could mark it as not displayed
-            this.show = false;
-            this.closed.emit(true);
-        }
+    else {
+      // Well we don't find the action sheet, we could mark it as not displayed
+      this.show = false;
+      this.closed.emit();
     }
-    render() {
-        return (index.h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close' }, index.h("div", { class: 'web-social-share-backdrop', onClick: () => this.hide() }), index.h("div", { class: 'web-social-share-action-sheet', onClick: () => this.hide() }, index.h("div", { class: 'web-social-share-action-sheet-container' }, index.h("div", { class: 'web-social-share-action-sheet-group' }, this.renderTargets())))));
+  }
+  async handleShare($event, attributes, action) {
+    $event.stopPropagation();
+    await action(attributes);
+    this.hide();
+  }
+  render() {
+    return (index.h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close', ref: (el) => (this.refContainer = el) }, index.h("div", { class: "web-social-share-backdrop", onClick: () => this.hide() }), index.h("div", { class: "web-social-share-action-sheet", onClick: () => this.hide() }, index.h("div", { class: "web-social-share-action-sheet-container" }, index.h("div", { class: "web-social-share-action-sheet-group" }, this.renderTargets())))));
+  }
+  renderTargets() {
+    var _a;
+    if (!((_a = this.share) === null || _a === void 0 ? void 0 : _a.config)) {
+      return undefined;
     }
-    renderTargets() {
-        if (!this.share || !this.share.config) {
-            return (index.h("span", null));
-        }
-        else {
-            return (this.share.config.map((config) => index.h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
-        }
+    return this.share.config.map((config) => (index.h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
+  }
+  renderButtons(share) {
+    if (share.facebook) {
+      return this.renderButton(share.facebook, 'facebook', shareFacebook, 'Facebook');
     }
-    renderButtons(share) {
-        if (share.facebook) {
-            return this.renderButton(share.facebook, 'facebook', this.handleFacebookShare, 'Facebook');
-        }
-        else if (share.twitter) {
-            return this.renderButton(share.twitter, 'twitter', this.handleTwitterShare, 'Twitter');
-        }
-        else if (share.email) {
-            return this.renderButton(share.email, 'email', this.handleEmailShare, 'Email');
-        }
-        else if (share.linkedin) {
-            return this.renderButton(share.linkedin, 'linkedin', this.handleLinkedinShare, 'Linkedin');
-        }
-        else if (share.pinterest) {
-            return this.renderButton(share.pinterest, 'pinterest', this.handlePinterestShare, 'Pinterest');
-        }
-        else if (share.reddit) {
-            return this.renderButton(share.reddit, 'reddit', this.handleRedditShare, 'Reddit');
-        }
-        else if (share.whatsapp) {
-            return this.renderButton(share.whatsapp, 'whatsapp', this.handleWhatsappShare, 'WhatsApp');
-        }
-        else if (share.copy) {
-            return this.renderButton(share.copy, 'copy', this.handleCopyShare, 'Copy');
-        }
-        else if (share.hackernews) {
-            return this.renderButton(share.hackernews, 'hackernews', this.handleHackerNewsShare, 'Hacker News');
-        }
-        else {
-            return undefined;
-        }
+    else if (share.twitter) {
+      return this.renderButton(share.twitter, 'twitter', shareTwitter, 'Twitter');
     }
-    renderButton(attributes, slotName, action, defaultBrandName) {
-        return (index.h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: 'web-social-share-button' }, index.h("div", { class: "web-social-share-button-icon" }, index.h("slot", { name: slotName })), this.renderName(attributes, defaultBrandName)));
+    else if (share.email) {
+      return this.renderButton(share.email, 'email', email, 'Email');
     }
-    async handleShare($event, attributes, action) {
-        $event.stopPropagation();
-        await action(attributes);
-        this.hide();
+    else if (share.linkedin) {
+      return this.renderButton(share.linkedin, 'linkedin', linkedin, 'Linkedin');
     }
-    renderName(displayAttributes, defaultBrandName) {
-        if (this.share.displayNames) {
-            return (index.h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== '' ? displayAttributes.brandName : defaultBrandName));
-        }
-        else {
-            return (index.h("span", null));
-        }
+    else if (share.pinterest) {
+      return this.renderButton(share.pinterest, 'pinterest', pinterest, 'Pinterest');
     }
-    get el() { return index.getElement(this); }
+    else if (share.reddit) {
+      return this.renderButton(share.reddit, 'reddit', reddit, 'Reddit');
+    }
+    else if (share.whatsapp) {
+      return this.renderButton(share.whatsapp, 'whatsapp', whatsapp, 'WhatsApp');
+    }
+    else if (share.copy) {
+      return this.renderButton(share.copy, 'copy', copy, 'Copy');
+    }
+    else if (share.hackernews) {
+      return this.renderButton(share.hackernews, 'hackernews', hackernews, 'Hacker News');
+    }
+    return undefined;
+  }
+  renderButton(attributes, slotName, action, defaultBrandName) {
+    return (index.h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: "web-social-share-button" }, index.h("div", { class: "web-social-share-button-icon" }, index.h("slot", { name: slotName })), this.renderName(attributes, defaultBrandName)));
+  }
+  renderName(displayAttributes, defaultBrandName) {
+    if (this.share.displayNames) {
+      return (index.h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== ''
+        ? displayAttributes.brandName
+        : defaultBrandName));
+    }
+    return undefined;
+  }
+  get el() { return index.getElement(this); }
 };
@@ -375,0 +378,0 @@ WebSocialShare.style = webSocialShareCss;

dist/cjs/websocialshare.cjs.js

 'use strict';
 
-const index = require('./index-4ee16ff7.js');
-const patch = require('./patch-f28cc54b.js');
+const index = require('./index-c24f442c.js');
 
-patch.patchBrowser().then(options => {
+/*
+ Stencil Client Patch Browser v2.3.0 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('websocialshare.cjs.js', document.baseURI).href));
+    const opts =  {};
+    if ( importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return index.promiseResolve(opts);
+};
+
+patchBrowser().then(options => {
   return index.bootstrapLazy([["web-social-share.cjs",[[1,"web-social-share",{"show":[1028],"share":[16]}]]]], options);
 });

dist/collection/collection-manifest.json

@@ -7,4 +7,4 @@ {
     "name": "@stencil/core",
-    "version": "1.17.3",
-    "typescriptVersion": "3.9.7"
+    "version": "2.3.0",
+    "typescriptVersion": "4.0.5"
   },
@@ -11,0 +11,0 @@ "collections": [],

dist/collection/components/web-social-share/web-social-share.js

 import { Component, Element, Event, Prop, h } from '@stencil/core';
-import { WebSocialShareFacebook } from '../../utils/web-social-share/web-social-share-facebook';
-import { WebSocialShareTwitter } from '../../utils/web-social-share/web-social-share-twitter';
-import { WebSocialShareEmail } from '../../utils/web-social-share/web-social-share-email';
-import { WebSocialShareLinkedin } from '../../utils/web-social-share/web-social-share-linkedin';
-import { WebSocialSharePinterest } from '../../utils/web-social-share/web-social-share-pinterest';
-import { WebSocialShareReddit } from '../../utils/web-social-share/web-social-share-reddit';
-import { WebSocialShareWhatsapp } from '../../utils/web-social-share/web-social-share-whatsapp';
-import { WebSocialShareCopy } from '../../utils/web-social-share/web-social-share-copy';
-import { WebSocialShareHackerNews } from '../../utils/web-social-share/web-social-share-hackernews';
+import { shareFacebook } from '../../utils/facebook';
+import { shareTwitter } from '../../utils/twitter';
+import { email } from '../../utils/email';
+import { linkedin } from '../../utils/linkedin';
+import { pinterest } from '../../utils/pinterest';
+import { reddit } from '../../utils/reddit';
+import { whatsapp } from '../../utils/whatsapp';
+import { copy } from '../../utils/copy';
+import { hackernews } from '../../utils/hackernews';
+/**
+ * @slot facebook - A slot to display an icon or text in the related social share button
+ * @slot twitter - A slot to display an icon or text in the related social share button
+ * @slot email - A slot to display an icon or text in the related social share button
+ * @slot linkedin - A slot to display an icon or text in the related social share button
+ * @slot pinterest - A slot to display an icon or text in the related social share button
+ * @slot whatsapp - A slot to display an icon or text in the related social share button
+ * @slot copy - A slot to display an icon or text in the related social share button
+ * @slot hackernews - A slot to display an icon or text in the related social share button
+ */
 export class WebSocialShare {
-    constructor() {
-        this.handleFacebookShare = async (attributes) => {
-            await WebSocialShareFacebook.share(attributes);
-        };
-        this.handleTwitterShare = async (attributes) => {
-            await WebSocialShareTwitter.share(attributes);
-        };
-        this.handleEmailShare = async (attributes) => {
-            await WebSocialShareEmail.share(attributes);
-        };
-        this.handleLinkedinShare = async (attributes) => {
-            await WebSocialShareLinkedin.share(attributes);
-        };
-        this.handlePinterestShare = async (attributes) => {
-            await WebSocialSharePinterest.share(attributes);
-        };
-        this.handleRedditShare = async (attributes) => {
-            await WebSocialShareReddit.share(attributes);
-        };
-        this.handleWhatsappShare = async (attributes) => {
-            await WebSocialShareWhatsapp.share(attributes);
-        };
-        this.handleCopyShare = async (attributes) => {
-            await WebSocialShareCopy.share(attributes);
-        };
-        this.handleHackerNewsShare = async (attributes) => {
-            await WebSocialShareHackerNews.share(attributes);
-        };
+  hide() {
+    if (this.refContainer) {
+      this.refContainer.classList.add('web-social-share-transition-close');
+      setTimeout(() => {
+        // Reflect css animation speed 400ms, see css
+        this.show = false;
+        this.refContainer.classList.remove('web-social-share-transition-close');
+        this.closed.emit();
+      }, 200);
     }
-    hide() {
-        let element = this.el.shadowRoot.querySelector('div.web-social-share');
-        if (element) {
-            element.classList.add('web-social-share-transition-close');
-            setTimeout(() => {
-                // Reflect css animation speed 400ms, see css
-                this.show = false;
-                element.classList.remove('web-social-share-transition-close');
-                this.closed.emit(true);
-            }, 200);
-        }
-        else {
-            // Well we don't find the action sheet, we could mark it as not displayed
-            this.show = false;
-            this.closed.emit(true);
-        }
+    else {
+      // Well we don't find the action sheet, we could mark it as not displayed
+      this.show = false;
+      this.closed.emit();
     }
-    render() {
-        return (h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close' },
-            h("div", { class: 'web-social-share-backdrop', onClick: () => this.hide() }),
-            h("div", { class: 'web-social-share-action-sheet', onClick: () => this.hide() },
-                h("div", { class: 'web-social-share-action-sheet-container' },
-                    h("div", { class: 'web-social-share-action-sheet-group' }, this.renderTargets())))));
+  }
+  async handleShare($event, attributes, action) {
+    $event.stopPropagation();
+    await action(attributes);
+    this.hide();
+  }
+  render() {
+    return (h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close', ref: (el) => (this.refContainer = el) },
+      h("div", { class: "web-social-share-backdrop", onClick: () => this.hide() }),
+      h("div", { class: "web-social-share-action-sheet", onClick: () => this.hide() },
+        h("div", { class: "web-social-share-action-sheet-container" },
+          h("div", { class: "web-social-share-action-sheet-group" }, this.renderTargets())))));
+  }
+  renderTargets() {
+    var _a;
+    if (!((_a = this.share) === null || _a === void 0 ? void 0 : _a.config)) {
+      return undefined;
     }
-    renderTargets() {
-        if (!this.share || !this.share.config) {
-            return (h("span", null));
-        }
-        else {
-            return (this.share.config.map((config) => h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
-        }
+    return this.share.config.map((config) => (h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
+  }
+  renderButtons(share) {
+    if (share.facebook) {
+      return this.renderButton(share.facebook, 'facebook', shareFacebook, 'Facebook');
     }
-    renderButtons(share) {
-        if (share.facebook) {
-            return this.renderButton(share.facebook, 'facebook', this.handleFacebookShare, 'Facebook');
-        }
-        else if (share.twitter) {
-            return this.renderButton(share.twitter, 'twitter', this.handleTwitterShare, 'Twitter');
-        }
-        else if (share.email) {
-            return this.renderButton(share.email, 'email', this.handleEmailShare, 'Email');
-        }
-        else if (share.linkedin) {
-            return this.renderButton(share.linkedin, 'linkedin', this.handleLinkedinShare, 'Linkedin');
-        }
-        else if (share.pinterest) {
-            return this.renderButton(share.pinterest, 'pinterest', this.handlePinterestShare, 'Pinterest');
-        }
-        else if (share.reddit) {
-            return this.renderButton(share.reddit, 'reddit', this.handleRedditShare, 'Reddit');
-        }
-        else if (share.whatsapp) {
-            return this.renderButton(share.whatsapp, 'whatsapp', this.handleWhatsappShare, 'WhatsApp');
-        }
-        else if (share.copy) {
-            return this.renderButton(share.copy, 'copy', this.handleCopyShare, 'Copy');
-        }
-        else if (share.hackernews) {
-            return this.renderButton(share.hackernews, 'hackernews', this.handleHackerNewsShare, 'Hacker News');
-        }
-        else {
-            return undefined;
-        }
+    else if (share.twitter) {
+      return this.renderButton(share.twitter, 'twitter', shareTwitter, 'Twitter');
     }
-    renderButton(attributes, slotName, action, defaultBrandName) {
-        return (h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: 'web-social-share-button' },
-            h("div", { class: "web-social-share-button-icon" },
-                h("slot", { name: slotName })),
-            this.renderName(attributes, defaultBrandName)));
+    else if (share.email) {
+      return this.renderButton(share.email, 'email', email, 'Email');
     }
-    async handleShare($event, attributes, action) {
-        $event.stopPropagation();
-        await action(attributes);
-        this.hide();
+    else if (share.linkedin) {
+      return this.renderButton(share.linkedin, 'linkedin', linkedin, 'Linkedin');
     }
-    renderName(displayAttributes, defaultBrandName) {
-        if (this.share.displayNames) {
-            return (h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== '' ? displayAttributes.brandName : defaultBrandName));
+    else if (share.pinterest) {
+      return this.renderButton(share.pinterest, 'pinterest', pinterest, 'Pinterest');
+    }
+    else if (share.reddit) {
+      return this.renderButton(share.reddit, 'reddit', reddit, 'Reddit');
+    }
+    else if (share.whatsapp) {
+      return this.renderButton(share.whatsapp, 'whatsapp', whatsapp, 'WhatsApp');
+    }
+    else if (share.copy) {
+      return this.renderButton(share.copy, 'copy', copy, 'Copy');
+    }
+    else if (share.hackernews) {
+      return this.renderButton(share.hackernews, 'hackernews', hackernews, 'Hacker News');
+    }
+    return undefined;
+  }
+  renderButton(attributes, slotName, action, defaultBrandName) {
+    return (h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: "web-social-share-button" },
+      h("div", { class: "web-social-share-button-icon" },
+        h("slot", { name: slotName })),
+      this.renderName(attributes, defaultBrandName)));
+  }
+  renderName(displayAttributes, defaultBrandName) {
+    if (this.share.displayNames) {
+      return (h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== ''
+        ? displayAttributes.brandName
+        : defaultBrandName));
+    }
+    return undefined;
+  }
+  static get is() { return "web-social-share"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["web-social-share.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["web-social-share.css"]
+  }; }
+  static get properties() { return {
+    "show": {
+      "type": "boolean",
+      "mutable": true,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Trigger the display, or close, of the action sheet which contains the social-share options"
+      },
+      "attribute": "show",
+      "reflect": false
+    },
+    "share": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "WebSocialShareInput",
+        "resolved": "WebSocialShareInput",
+        "references": {
+          "WebSocialShareInput": {
+            "location": "import",
+            "path": "../../types/web-social-share-input"
+          }
         }
-        else {
-            return (h("span", null));
-        }
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "The share options"
+      }
     }
-    static get is() { return "web-social-share"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() { return {
-        "$": ["web-social-share.scss"]
-    }; }
-    static get styleUrls() { return {
-        "$": ["web-social-share.css"]
-    }; }
-    static get properties() { return {
-        "show": {
-            "type": "boolean",
-            "mutable": true,
-            "complexType": {
-                "original": "boolean",
-                "resolved": "boolean",
-                "references": {}
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": ""
-            },
-            "attribute": "show",
-            "reflect": false
-        },
-        "share": {
-            "type": "unknown",
-            "mutable": false,
-            "complexType": {
-                "original": "WebSocialShareInput",
-                "resolved": "WebSocialShareInput",
-                "references": {
-                    "WebSocialShareInput": {
-                        "location": "import",
-                        "path": "../../types/web-social-share/web-social-share-input"
-                    }
-                }
-            },
-            "required": false,
-            "optional": false,
-            "docs": {
-                "tags": [],
-                "text": ""
-            }
-        }
-    }; }
-    static get events() { return [{
-            "method": "closed",
-            "name": "closed",
-            "bubbles": true,
-            "cancelable": true,
-            "composed": true,
-            "docs": {
-                "tags": [],
-                "text": ""
-            },
-            "complexType": {
-                "original": "any",
-                "resolved": "any",
-                "references": {}
-            }
-        }]; }
-    static get elementRef() { return "el"; }
+  }; }
+  static get events() { return [{
+      "method": "closed",
+      "name": "closed",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": "An event triggered when the modal is `closed`"
+      },
+      "complexType": {
+        "original": "void",
+        "resolved": "void",
+        "references": {}
+      }
+    }]; }
+  static get elementRef() { return "el"; }
 }

dist/collection/index.js

@@ -1,2 +0,2 @@
-export * from './types/web-social-share/web-social-share-attributes';
-export * from './types/web-social-share/web-social-share-input';
+export * from './types/web-social-share-attributes';
+export * from './types/web-social-share-input';

dist/esm/polyfills/css-shim.js

@@ -1,1 +0,1 @@
-var StyleNode=function(){this.start=0,this.end=0,this.previous=null,this.parent=null,this.rules=null,this.parsedCssText="",this.cssText="",this.atRule=!1,this.type=0,this.keyframesName="",this.selector="",this.parsedSelector=""};function parse(e){return parseCss(lex(e=clean(e)),e)}function clean(e){return e.replace(RX.comments,"").replace(RX.port,"")}function lex(e){var t=new StyleNode;t.start=0,t.end=e.length;for(var r=t,n=0,s=e.length;n<s;n++)if(e[n]===OPEN_BRACE){r.rules||(r.rules=[]);var o=r,a=o.rules[o.rules.length-1]||null;(r=new StyleNode).start=n+1,r.parent=o,r.previous=a,o.rules.push(r)}else e[n]===CLOSE_BRACE&&(r.end=n+1,r=r.parent||t);return t}function parseCss(e,t){var r=t.substring(e.start,e.end-1);if(e.parsedCssText=e.cssText=r.trim(),e.parent){var n=e.previous?e.previous.end:e.parent.start;r=(r=(r=_expandUnicodeEscapes(r=t.substring(n,e.start-1))).replace(RX.multipleSpaces," ")).substring(r.lastIndexOf(";")+1);var s=e.parsedSelector=e.selector=r.trim();e.atRule=0===s.indexOf(AT_START),e.atRule?0===s.indexOf(MEDIA_START)?e.type=types.MEDIA_RULE:s.match(RX.keyframesRule)&&(e.type=types.KEYFRAMES_RULE,e.keyframesName=e.selector.split(RX.multipleSpaces).pop()):0===s.indexOf(VAR_START)?e.type=types.MIXIN_RULE:e.type=types.STYLE_RULE}var o=e.rules;if(o)for(var a=0,i=o.length,l=void 0;a<i&&(l=o[a]);a++)parseCss(l,t);return e}function _expandUnicodeEscapes(e){return e.replace(/\\([0-9a-f]{1,6})\s/gi,(function(){for(var e=arguments[1],t=6-e.length;t--;)e="0"+e;return"\\"+e}))}var types={STYLE_RULE:1,KEYFRAMES_RULE:7,MEDIA_RULE:4,MIXIN_RULE:1e3},OPEN_BRACE="{",CLOSE_BRACE="}",RX={comments:/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,port:/@import[^;]*;/gim,customProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim,mixinProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim,mixinApply:/@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim,varApply:/[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim,keyframesRule:/^@[^\s]*keyframes/,multipleSpaces:/\s+/g},VAR_START="--",MEDIA_START="@media",AT_START="@";function findRegex(e,t,r){e.lastIndex=0;var n=t.substring(r).match(e);if(n){var s=r+n.index;return{start:s,end:s+n[0].length}}return null}var VAR_USAGE_START=/\bvar\(/,VAR_ASSIGN_START=/\B--[\w-]+\s*:/,COMMENTS=/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,TRAILING_LINES=/^[\t ]+\n/gm;function resolveVar(e,t,r){return e[t]?e[t]:r?executeTemplate(r,e):""}function findVarEndIndex(e,t){for(var r=0,n=t;n<e.length;n++){var s=e[n];if("("===s)r++;else if(")"===s&&--r<=0)return n+1}return n}function parseVar(e,t){var r=findRegex(VAR_USAGE_START,e,t);if(!r)return null;var n=findVarEndIndex(e,r.start),s=e.substring(r.end,n-1).split(","),o=s[0],a=s.slice(1);return{start:r.start,end:n,propName:o.trim(),fallback:a.length>0?a.join(",").trim():void 0}}function compileVar(e,t,r){var n=parseVar(e,r);if(!n)return t.push(e.substring(r,e.length)),e.length;var s=n.propName,o=null!=n.fallback?compileTemplate(n.fallback):void 0;return t.push(e.substring(r,n.start),(function(e){return resolveVar(e,s,o)})),n.end}function executeTemplate(e,t){for(var r="",n=0;n<e.length;n++){var s=e[n];r+="string"==typeof s?s:s(t)}return r}function findEndValue(e,t){for(var r=!1,n=!1,s=t;s<e.length;s++){var o=e[s];if(r)n&&'"'===o&&(r=!1),n||"'"!==o||(r=!1);else if('"'===o)r=!0,n=!0;else if("'"===o)r=!0,n=!1;else{if(";"===o)return s+1;if("}"===o)return s}}return s}function removeCustomAssigns(e){for(var t="",r=0;;){var n=findRegex(VAR_ASSIGN_START,e,r),s=n?n.start:e.length;if(t+=e.substring(r,s),!n)break;r=findEndValue(e,s)}return t}function compileTemplate(e){var t=0;e=removeCustomAssigns(e=e.replace(COMMENTS,"")).replace(TRAILING_LINES,"");for(var r=[];t<e.length;)t=compileVar(e,r,t);return r}function resolveValues(e){var t={};e.forEach((function(e){e.declarations.forEach((function(e){t[e.prop]=e.value}))}));for(var r={},n=Object.entries(t),s=function(e){var t=!1;if(n.forEach((function(e){var n=e[0],s=executeTemplate(e[1],r);s!==r[n]&&(r[n]=s,t=!0)})),!t)return"break"},o=0;o<10;o++){if("break"===s())break}return r}function getSelectors(e,t){if(void 0===t&&(t=0),!e.rules)return[];var r=[];return e.rules.filter((function(e){return e.type===types.STYLE_RULE})).forEach((function(e){var n=getDeclarations(e.cssText);n.length>0&&e.parsedSelector.split(",").forEach((function(e){e=e.trim(),r.push({selector:e,declarations:n,specificity:computeSpecificity(),nu:t})})),t++})),r}function computeSpecificity(e){return 1}var IMPORTANT="!important",FIND_DECLARATIONS=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function getDeclarations(e){for(var t,r=[];t=FIND_DECLARATIONS.exec(e.trim());){var n=normalizeValue(t[2]),s=n.value,o=n.important;r.push({prop:t[1].trim(),value:compileTemplate(s),important:o})}return r}function normalizeValue(e){var t=(e=e.replace(/\s+/gim," ").trim()).endsWith(IMPORTANT);return t&&(e=e.substr(0,e.length-IMPORTANT.length).trim()),{value:e,important:t}}function getActiveSelectors(e,t,r){var n=[],s=getScopesForElement(t,e);return r.forEach((function(e){return n.push(e)})),s.forEach((function(e){return n.push(e)})),sortSelectors(getSelectorsForScopes(n).filter((function(t){return matches(e,t.selector)})))}function getScopesForElement(e,t){for(var r=[];t;){var n=e.get(t);n&&r.push(n),t=t.parentElement}return r}function getSelectorsForScopes(e){var t=[];return e.forEach((function(e){t.push.apply(t,e.selectors)})),t}function sortSelectors(e){return e.sort((function(e,t){return e.specificity===t.specificity?e.nu-t.nu:e.specificity-t.specificity})),e}function matches(e,t){return":root"===t||"html"===t||e.matches(t)}function parseCSS(e){var t=parse(e),r=compileTemplate(e);return{original:e,template:r,selectors:getSelectors(t),usesCssVars:r.length>1}}function addGlobalStyle(e,t){if(e.some((function(e){return e.styleEl===t})))return!1;var r=parseCSS(t.textContent);return r.styleEl=t,e.push(r),!0}function updateGlobalScopes(e){var t=resolveValues(getSelectorsForScopes(e));e.forEach((function(e){e.usesCssVars&&(e.styleEl.textContent=executeTemplate(e.template,t))}))}function reScope(e,t){var r=e.template.map((function(r){return"string"==typeof r?replaceScope(r,e.scopeId,t):r})),n=e.selectors.map((function(r){return Object.assign(Object.assign({},r),{selector:replaceScope(r.selector,e.scopeId,t)})}));return Object.assign(Object.assign({},e),{template:r,selectors:n,scopeId:t})}function replaceScope(e,t,r){return e=replaceAll(e,"\\."+t,"."+r)}function replaceAll(e,t,r){return e.replace(new RegExp(t,"g"),r)}function loadDocument(e,t){return loadDocumentStyles(e,t),loadDocumentLinks(e,t).then((function(){updateGlobalScopes(t)}))}function startWatcher(e,t){"undefined"!=typeof MutationObserver&&new MutationObserver((function(){loadDocumentStyles(e,t)&&updateGlobalScopes(t)})).observe(document.head,{childList:!0})}function loadDocumentLinks(e,t){for(var r=[],n=e.querySelectorAll('link[rel="stylesheet"][href]:not([data-no-shim])'),s=0;s<n.length;s++)r.push(addGlobalLink(e,t,n[s]));return Promise.all(r)}function loadDocumentStyles(e,t){return Array.from(e.querySelectorAll("style:not([data-styles]):not([data-no-shim])")).map((function(e){return addGlobalStyle(t,e)})).some(Boolean)}function addGlobalLink(e,t,r){var n=r.href;return fetch(n).then((function(e){return e.text()})).then((function(s){if(hasCssVariables(s)&&r.parentNode){hasRelativeUrls(s)&&(s=fixRelativeUrls(s,n));var o=e.createElement("style");o.setAttribute("data-styles",""),o.textContent=s,addGlobalStyle(t,o),r.parentNode.insertBefore(o,r),r.remove()}})).catch((function(e){console.error(e)}))}var CSS_VARIABLE_REGEXP=/[\s;{]--[-a-zA-Z0-9]+\s*:/m;function hasCssVariables(e){return e.indexOf("var(")>-1||CSS_VARIABLE_REGEXP.test(e)}var CSS_URL_REGEXP=/url[\s]*\([\s]*['"]?(?!(?:https?|data)\:|\/)([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim;function hasRelativeUrls(e){return CSS_URL_REGEXP.lastIndex=0,CSS_URL_REGEXP.test(e)}function fixRelativeUrls(e,t){var r=t.replace(/[^/]*$/,"");return e.replace(CSS_URL_REGEXP,(function(e,t){var n=r+t;return e.replace(t,n)}))}var CustomStyle=function(){function e(e,t){this.win=e,this.doc=t,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map,this.didInit=!1}return e.prototype.i=function(){var e=this;return this.didInit||!this.win.requestAnimationFrame?Promise.resolve():(this.didInit=!0,new Promise((function(t){e.win.requestAnimationFrame((function(){startWatcher(e.doc,e.globalScopes),loadDocument(e.doc,e.globalScopes).then((function(){return t()}))}))})))},e.prototype.addLink=function(e){var t=this;return addGlobalLink(this.doc,this.globalScopes,e).then((function(){t.updateGlobal()}))},e.prototype.addGlobalStyle=function(e){addGlobalStyle(this.globalScopes,e)&&this.updateGlobal()},e.prototype.createHostStyle=function(e,t,r,n){if(this.hostScopeMap.has(e))throw new Error("host style already created");var s=this.registerHostTemplate(r,t,n),o=this.doc.createElement("style");return o.setAttribute("data-no-shim",""),s.usesCssVars?n?(o["s-sc"]=t=s.scopeId+"-"+this.count,o.textContent="/*needs update*/",this.hostStyleMap.set(e,o),this.hostScopeMap.set(e,reScope(s,t)),this.count++):(s.styleEl=o,s.usesCssVars||(o.textContent=executeTemplate(s.template,{})),this.globalScopes.push(s),this.updateGlobal(),this.hostScopeMap.set(e,s)):o.textContent=r,o},e.prototype.removeHost=function(e){var t=this.hostStyleMap.get(e);t&&t.remove(),this.hostStyleMap.delete(e),this.hostScopeMap.delete(e)},e.prototype.updateHost=function(e){var t=this.hostScopeMap.get(e);if(t&&t.usesCssVars&&t.isScoped){var r=this.hostStyleMap.get(e);if(r){var n=resolveValues(getActiveSelectors(e,this.hostScopeMap,this.globalScopes));r.textContent=executeTemplate(t.template,n)}}},e.prototype.updateGlobal=function(){updateGlobalScopes(this.globalScopes)},e.prototype.registerHostTemplate=function(e,t,r){var n=this.scopesMap.get(t);return n||((n=parseCSS(e)).scopeId=t,n.isScoped=r,this.scopesMap.set(t,n)),n},e}();!function(e){!e||e.__cssshim||e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")||(e.__cssshim=new CustomStyle(e,e.document))}("undefined"!=typeof window&&window);
+var __assign=this&&this.__assign||function(){return(__assign=Object.assign||function(e){for(var t,r=1,n=arguments.length;r<n;r++)for(var s in t=arguments[r])Object.prototype.hasOwnProperty.call(t,s)&&(e[s]=t[s]);return e}).apply(this,arguments)},StyleNode=function(){this.start=0,this.end=0,this.previous=null,this.parent=null,this.rules=null,this.parsedCssText="",this.cssText="",this.atRule=!1,this.type=0,this.keyframesName="",this.selector="",this.parsedSelector=""};function parse(e){return parseCss(lex(e=clean(e)),e)}function clean(e){return e.replace(RX.comments,"").replace(RX.port,"")}function lex(e){var t=new StyleNode;t.start=0,t.end=e.length;for(var r=t,n=0,s=e.length;n<s;n++)if(e[n]===OPEN_BRACE){r.rules||(r.rules=[]);var o=r,a=o.rules[o.rules.length-1]||null;(r=new StyleNode).start=n+1,r.parent=o,r.previous=a,o.rules.push(r)}else e[n]===CLOSE_BRACE&&(r.end=n+1,r=r.parent||t);return t}function parseCss(e,t){var r=t.substring(e.start,e.end-1);if(e.parsedCssText=e.cssText=r.trim(),e.parent){var n=e.previous?e.previous.end:e.parent.start;r=(r=(r=_expandUnicodeEscapes(r=t.substring(n,e.start-1))).replace(RX.multipleSpaces," ")).substring(r.lastIndexOf(";")+1);var s=e.parsedSelector=e.selector=r.trim();e.atRule=0===s.indexOf(AT_START),e.atRule?0===s.indexOf(MEDIA_START)?e.type=types.MEDIA_RULE:s.match(RX.keyframesRule)&&(e.type=types.KEYFRAMES_RULE,e.keyframesName=e.selector.split(RX.multipleSpaces).pop()):0===s.indexOf(VAR_START)?e.type=types.MIXIN_RULE:e.type=types.STYLE_RULE}var o=e.rules;if(o)for(var a=0,i=o.length,l=void 0;a<i&&(l=o[a]);a++)parseCss(l,t);return e}function _expandUnicodeEscapes(e){return e.replace(/\\([0-9a-f]{1,6})\s/gi,(function(){for(var e=arguments[1],t=6-e.length;t--;)e="0"+e;return"\\"+e}))}var types={STYLE_RULE:1,KEYFRAMES_RULE:7,MEDIA_RULE:4,MIXIN_RULE:1e3},OPEN_BRACE="{",CLOSE_BRACE="}",RX={comments:/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,port:/@import[^;]*;/gim,customProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?(?:[;\n]|$)/gim,mixinProp:/(?:^[^;\-\s}]+)?--[^;{}]*?:[^{};]*?{[^}]*?}(?:[;\n]|$)?/gim,mixinApply:/@apply\s*\(?[^);]*\)?\s*(?:[;\n]|$)?/gim,varApply:/[^;:]*?:[^;]*?var\([^;]*\)(?:[;\n]|$)?/gim,keyframesRule:/^@[^\s]*keyframes/,multipleSpaces:/\s+/g},VAR_START="--",MEDIA_START="@media",AT_START="@";function findRegex(e,t,r){e.lastIndex=0;var n=t.substring(r).match(e);if(n){var s=r+n.index;return{start:s,end:s+n[0].length}}return null}var VAR_USAGE_START=/\bvar\(/,VAR_ASSIGN_START=/\B--[\w-]+\s*:/,COMMENTS=/\/\*[^*]*\*+([^/*][^*]*\*+)*\//gim,TRAILING_LINES=/^[\t ]+\n/gm;function resolveVar(e,t,r){return e[t]?e[t]:r?executeTemplate(r,e):""}function findVarEndIndex(e,t){for(var r=0,n=t;n<e.length;n++){var s=e[n];if("("===s)r++;else if(")"===s&&--r<=0)return n+1}return n}function parseVar(e,t){var r=findRegex(VAR_USAGE_START,e,t);if(!r)return null;var n=findVarEndIndex(e,r.start),s=e.substring(r.end,n-1).split(","),o=s[0],a=s.slice(1);return{start:r.start,end:n,propName:o.trim(),fallback:a.length>0?a.join(",").trim():void 0}}function compileVar(e,t,r){var n=parseVar(e,r);if(!n)return t.push(e.substring(r,e.length)),e.length;var s=n.propName,o=null!=n.fallback?compileTemplate(n.fallback):void 0;return t.push(e.substring(r,n.start),(function(e){return resolveVar(e,s,o)})),n.end}function executeTemplate(e,t){for(var r="",n=0;n<e.length;n++){var s=e[n];r+="string"==typeof s?s:s(t)}return r}function findEndValue(e,t){for(var r=!1,n=!1,s=t;s<e.length;s++){var o=e[s];if(r)n&&'"'===o&&(r=!1),n||"'"!==o||(r=!1);else if('"'===o)r=!0,n=!0;else if("'"===o)r=!0,n=!1;else{if(";"===o)return s+1;if("}"===o)return s}}return s}function removeCustomAssigns(e){for(var t="",r=0;;){var n=findRegex(VAR_ASSIGN_START,e,r),s=n?n.start:e.length;if(t+=e.substring(r,s),!n)break;r=findEndValue(e,s)}return t}function compileTemplate(e){var t=0;e=removeCustomAssigns(e=e.replace(COMMENTS,"")).replace(TRAILING_LINES,"");for(var r=[];t<e.length;)t=compileVar(e,r,t);return r}function resolveValues(e){var t={};e.forEach((function(e){e.declarations.forEach((function(e){t[e.prop]=e.value}))}));for(var r={},n=Object.entries(t),s=function(e){var t=!1;if(n.forEach((function(e){var n=e[0],s=executeTemplate(e[1],r);s!==r[n]&&(r[n]=s,t=!0)})),!t)return"break"},o=0;o<10;o++){if("break"===s())break}return r}function getSelectors(e,t){if(void 0===t&&(t=0),!e.rules)return[];var r=[];return e.rules.filter((function(e){return e.type===types.STYLE_RULE})).forEach((function(e){var n=getDeclarations(e.cssText);n.length>0&&e.parsedSelector.split(",").forEach((function(e){e=e.trim(),r.push({selector:e,declarations:n,specificity:computeSpecificity(),nu:t})})),t++})),r}function computeSpecificity(e){return 1}var IMPORTANT="!important",FIND_DECLARATIONS=/(?:^|[;\s{]\s*)(--[\w-]*?)\s*:\s*(?:((?:'(?:\\'|.)*?'|"(?:\\"|.)*?"|\([^)]*?\)|[^};{])+)|\{([^}]*)\}(?:(?=[;\s}])|$))/gm;function getDeclarations(e){for(var t,r=[];t=FIND_DECLARATIONS.exec(e.trim());){var n=normalizeValue(t[2]),s=n.value,o=n.important;r.push({prop:t[1].trim(),value:compileTemplate(s),important:o})}return r}function normalizeValue(e){var t=(e=e.replace(/\s+/gim," ").trim()).endsWith(IMPORTANT);return t&&(e=e.substr(0,e.length-IMPORTANT.length).trim()),{value:e,important:t}}function getActiveSelectors(e,t,r){var n=[],s=getScopesForElement(t,e);return r.forEach((function(e){return n.push(e)})),s.forEach((function(e){return n.push(e)})),sortSelectors(getSelectorsForScopes(n).filter((function(t){return matches(e,t.selector)})))}function getScopesForElement(e,t){for(var r=[];t;){var n=e.get(t);n&&r.push(n),t=t.parentElement}return r}function getSelectorsForScopes(e){var t=[];return e.forEach((function(e){t.push.apply(t,e.selectors)})),t}function sortSelectors(e){return e.sort((function(e,t){return e.specificity===t.specificity?e.nu-t.nu:e.specificity-t.specificity})),e}function matches(e,t){return":root"===t||"html"===t||e.matches(t)}function parseCSS(e){var t=parse(e),r=compileTemplate(e);return{original:e,template:r,selectors:getSelectors(t),usesCssVars:r.length>1}}function addGlobalStyle(e,t){if(e.some((function(e){return e.styleEl===t})))return!1;var r=parseCSS(t.textContent);return r.styleEl=t,e.push(r),!0}function updateGlobalScopes(e){var t=resolveValues(getSelectorsForScopes(e));e.forEach((function(e){e.usesCssVars&&(e.styleEl.textContent=executeTemplate(e.template,t))}))}function reScope(e,t){var r=e.template.map((function(r){return"string"==typeof r?replaceScope(r,e.scopeId,t):r})),n=e.selectors.map((function(r){return __assign(__assign({},r),{selector:replaceScope(r.selector,e.scopeId,t)})}));return __assign(__assign({},e),{template:r,selectors:n,scopeId:t})}function replaceScope(e,t,r){return e=replaceAll(e,"\\."+t,"."+r)}function replaceAll(e,t,r){return e.replace(new RegExp(t,"g"),r)}function loadDocument(e,t){return loadDocumentStyles(e,t),loadDocumentLinks(e,t).then((function(){updateGlobalScopes(t)}))}function startWatcher(e,t){"undefined"!=typeof MutationObserver&&new MutationObserver((function(){loadDocumentStyles(e,t)&&updateGlobalScopes(t)})).observe(document.head,{childList:!0})}function loadDocumentLinks(e,t){for(var r=[],n=e.querySelectorAll('link[rel="stylesheet"][href]:not([data-no-shim])'),s=0;s<n.length;s++)r.push(addGlobalLink(e,t,n[s]));return Promise.all(r)}function loadDocumentStyles(e,t){return Array.from(e.querySelectorAll("style:not([data-styles]):not([data-no-shim])")).map((function(e){return addGlobalStyle(t,e)})).some(Boolean)}function addGlobalLink(e,t,r){var n=r.href;return fetch(n).then((function(e){return e.text()})).then((function(s){if(hasCssVariables(s)&&r.parentNode){hasRelativeUrls(s)&&(s=fixRelativeUrls(s,n));var o=e.createElement("style");o.setAttribute("data-styles",""),o.textContent=s,addGlobalStyle(t,o),r.parentNode.insertBefore(o,r),r.remove()}})).catch((function(e){console.error(e)}))}var CSS_VARIABLE_REGEXP=/[\s;{]--[-a-zA-Z0-9]+\s*:/m;function hasCssVariables(e){return e.indexOf("var(")>-1||CSS_VARIABLE_REGEXP.test(e)}var CSS_URL_REGEXP=/url[\s]*\([\s]*['"]?(?!(?:https?|data)\:|\/)([^\'\"\)]*)[\s]*['"]?\)[\s]*/gim;function hasRelativeUrls(e){return CSS_URL_REGEXP.lastIndex=0,CSS_URL_REGEXP.test(e)}function fixRelativeUrls(e,t){var r=t.replace(/[^/]*$/,"");return e.replace(CSS_URL_REGEXP,(function(e,t){var n=r+t;return e.replace(t,n)}))}var CustomStyle=function(){function e(e,t){this.win=e,this.doc=t,this.count=0,this.hostStyleMap=new WeakMap,this.hostScopeMap=new WeakMap,this.globalScopes=[],this.scopesMap=new Map,this.didInit=!1}return e.prototype.i=function(){var e=this;return this.didInit||!this.win.requestAnimationFrame?Promise.resolve():(this.didInit=!0,new Promise((function(t){e.win.requestAnimationFrame((function(){startWatcher(e.doc,e.globalScopes),loadDocument(e.doc,e.globalScopes).then((function(){return t()}))}))})))},e.prototype.addLink=function(e){var t=this;return addGlobalLink(this.doc,this.globalScopes,e).then((function(){t.updateGlobal()}))},e.prototype.addGlobalStyle=function(e){addGlobalStyle(this.globalScopes,e)&&this.updateGlobal()},e.prototype.createHostStyle=function(e,t,r,n){if(this.hostScopeMap.has(e))throw new Error("host style already created");var s=this.registerHostTemplate(r,t,n),o=this.doc.createElement("style");return o.setAttribute("data-no-shim",""),s.usesCssVars?n?(o["s-sc"]=t=s.scopeId+"-"+this.count,o.textContent="/*needs update*/",this.hostStyleMap.set(e,o),this.hostScopeMap.set(e,reScope(s,t)),this.count++):(s.styleEl=o,s.usesCssVars||(o.textContent=executeTemplate(s.template,{})),this.globalScopes.push(s),this.updateGlobal(),this.hostScopeMap.set(e,s)):o.textContent=r,o},e.prototype.removeHost=function(e){var t=this.hostStyleMap.get(e);t&&t.remove(),this.hostStyleMap.delete(e),this.hostScopeMap.delete(e)},e.prototype.updateHost=function(e){var t=this.hostScopeMap.get(e);if(t&&t.usesCssVars&&t.isScoped){var r=this.hostStyleMap.get(e);if(r){var n=resolveValues(getActiveSelectors(e,this.hostScopeMap,this.globalScopes));r.textContent=executeTemplate(t.template,n)}}},e.prototype.updateGlobal=function(){updateGlobalScopes(this.globalScopes)},e.prototype.registerHostTemplate=function(e,t,r){var n=this.scopesMap.get(t);return n||((n=parseCSS(e)).scopeId=t,n.isScoped=r,this.scopesMap.set(t,n)),n},e}();!function(e){!e||e.__cssshim||e.CSS&&e.CSS.supports&&e.CSS.supports("color","var(--c)")||(e.__cssshim=new CustomStyle(e,e.document))}("undefined"!=typeof window&&window);

dist/esm/web-social-share.entry.js

@@ -1,2 +0,2 @@
-import { r as registerInstance, c as createEvent, h, g as getElement } from './index-bef2383e.js';
+import { r as registerInstance, c as createEvent, h, g as getElement } from './index-1b598b47.js';
 
@@ -6,364 +6,367 @@ /**
  */
-class WebSocialShareFacebook {
-    static async share(attrs) {
-        let urlString;
-        if (attrs.socialShareType && attrs.socialShareType === 'feed') {
-            // if user specifies that they want to use the Facebook feed dialog
-            //(https://developers.facebook.com/docs/sharing/reference/feed-dialog/v2.4)
-            urlString = 'https://www.facebook.com/dialog/feed?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareTo) {
-                urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            if (attrs.socialShareRef) {
-                urlString += '&ref=' + encodeURIComponent(attrs.socialShareRef);
-            }
-            if (attrs.socialShareFrom) {
-                urlString += '&from=' + encodeURIComponent(attrs.socialShareFrom);
-            }
-            if (attrs.socialShareSource) {
-                urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else if (attrs.socialShareType && attrs.socialShareType === 'share') {
-            // if user specifies that they want to use the Facebook share dialog
-            //(https://developers.facebook.com/docs/sharing/reference/share-dialog)
-            urlString = 'https://www.facebook.com/dialog/share?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&href=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareQuote) {
-                urlString += '&quote=' + encodeURIComponent(attrs.socialShareQuote);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            if (attrs.socialShareMobileiframe) {
-                urlString += '&mobile_iframe=' + encodeURIComponent(attrs.socialShareMobileiframe);
-            }
-            if (attrs.socialShareHashtags) {
-                urlString += '&hashtag=' + encodeURIComponent(attrs.socialShareHashtags);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else if (attrs.socialShareType && attrs.socialShareType === 'send') {
-            // if user specifies that they want to use the Facebook send dialog
-            //(https://developers.facebook.com/docs/sharing/reference/send-dialog)
-            urlString = 'https://www.facebook.com/dialog/send?';
-            if (attrs.socialShareVia) {
-                urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
-            }
-            if (attrs.socialShareRedirectUri) {
-                urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
-            }
-            if (attrs.socialShareUrl) {
-                urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
-            }
-            if (attrs.socialShareTo) {
-                urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
-            }
-            if (attrs.socialShareDisplay) {
-                urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
-            }
-            window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
-        else {
-            //otherwise default to using sharer.php
-            window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(attrs.socialShareUrl || window.location.href), 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+const shareFacebook = async (attrs) => {
+  let urlString;
+  if (attrs.socialShareType && attrs.socialShareType === 'feed') {
+    // if user specifies that they want to use the Facebook feed dialog
+    //(https://developers.facebook.com/docs/sharing/reference/feed-dialog/v2.4)
+    urlString = 'https://www.facebook.com/dialog/feed?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
     }
-}
-
-class WebSocialShareUtils {
-    // Source: http://detectmobilebrowsers.com
-    // Same implementation as in class DeckdeckgoUtils
-    static isMobile() {
-        if (!window) {
-            return false;
-        }
-        const a = navigator.userAgent || navigator.vendor || window.opera;
-        return (/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|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)));
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
     }
-    static staticOpenNewWindow(urlString) {
-        if (window.self !== window.top) {
-            window.open(urlString, '_blank');
-        }
-        else {
-            window.open(urlString, '_self');
-        }
+    if (attrs.socialShareUrl) {
+      urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
     }
-}
-
-class WebSocialShareTwitter {
-    static async share(attrs) {
-        let urlString = 'https://www.twitter.com/intent/tweet?';
-        if (attrs.socialShareText) {
-            urlString += 'text=' + encodeURIComponent(attrs.socialShareText);
-        }
-        if (attrs.socialShareVia) {
-            urlString += '&via=' + encodeURIComponent(attrs.socialShareVia);
-        }
-        if (attrs.socialShareHashtags) {
-            urlString += '&hashtags=' + encodeURIComponent(attrs.socialShareHashtags);
-        }
-        //default to the current page if a URL isn't specified
-        urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (WebSocialShareUtils.isMobile()) {
-            WebSocialShareUtils.staticOpenNewWindow(urlString);
-        }
-        else {
-            window.open(urlString, 'Twitter', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+    if (attrs.socialShareTo) {
+      urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
     }
-}
-
-class WebSocialShareEmail {
-    static async share(attrs) {
-        let urlString = 'mailto:';
-        if (attrs.socialShareTo) {
-            urlString += encodeURIComponent(attrs.socialShareTo);
-        }
-        urlString += '?';
-        if (attrs.socialShareBody) {
-            urlString += 'body=' + encodeURIComponent(attrs.socialShareBody);
-        }
-        if (attrs.socialShareSubject) {
-            urlString += '&subject=' + encodeURIComponent(attrs.socialShareSubject);
-        }
-        if (attrs.socialShareCc) {
-            urlString += '&cc=' + encodeURIComponent(attrs.socialShareCc);
-        }
-        if (attrs.socialShareBcc) {
-            urlString += '&bcc=' + encodeURIComponent(attrs.socialShareBcc);
-        }
-        WebSocialShareUtils.staticOpenNewWindow(urlString);
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
     }
-}
-
-class WebSocialShareLinkedin {
-    static async share(attrs) {
-        let urlString = 'https://www.linkedin.com/shareArticle?mini=true';
-        urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (attrs.socialShareText) {
-            urlString += '&title=' + encodeURIComponent(attrs.socialShareText);
-        }
-        if (attrs.socialShareDescription) {
-            urlString += '&summary=' + encodeURIComponent(attrs.socialShareDescription);
-        }
-        if (attrs.socialShareSource) {
-            urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
-        }
-        window.open(urlString, 'Linkedin', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareRef) {
+      urlString += '&ref=' + encodeURIComponent(attrs.socialShareRef);
     }
-}
-
-class WebSocialSharePinterest {
-    static async share(attrs) {
-        window.open('https://www.pinterest.com/pin/create/button/?url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&media=' + encodeURIComponent(attrs.socialShareMedia) + '&description=' + encodeURIComponent(attrs.socialShareText), 'Pinterest', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareFrom) {
+      urlString += '&from=' + encodeURIComponent(attrs.socialShareFrom);
     }
-}
-
-class WebSocialShareReddit {
-    static async share(attrs) {
-        let urlString = 'https://www.reddit.com/';
-        if (attrs.socialShareSubreddit) {
-            urlString += 'r/' + attrs.socialShareSubreddit + '/submit?url=';
-        }
-        else {
-            urlString += 'submit?url=';
-        }
-        /*-
-        * Reddit isn't responsive and at default width for our popups (500 x 500), everything is messed up.
-        * So, overriding the width if it is less than 900 (played around to settle on this) and height if
-        * it is less than 650px.
-        */
-        if (attrs.socialSharePopupWidth < 900) {
-            attrs.socialSharePopupWidth = 900;
-        }
-        if (attrs.socialSharePopupHeight < 650) {
-            attrs.socialSharePopupHeight = 650;
-        }
-        window.open(urlString + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&title=' + encodeURIComponent(attrs.socialShareText), 'Reddit', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-            + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+    if (attrs.socialShareSource) {
+      urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
     }
-}
-
-class WebSocialShareWhatsapp {
-    static async share(attrs) {
-        const isMobile = WebSocialShareUtils.isMobile();
-        let urlString = isMobile ? 'https://api.whatsapp.com/send?text=' : 'https://web.whatsapp.com/send?text=';
-        if (attrs.socialShareText) {
-            urlString += encodeURIComponent(attrs.socialShareText) + '%0A';
-        }
-        //default to the current page if a URL isn't specified
-        urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (isMobile) {
-            WebSocialShareUtils.staticOpenNewWindow(urlString);
-        }
-        else {
-            window.open(urlString, 'WhatsApp', 'toolbar=0,status=0,resizable=yes,width=' + attrs.socialSharePopupWidth + ',height=' + attrs.socialSharePopupHeight
-                + ',top=' + (window.innerHeight - attrs.socialSharePopupHeight) / 2 + ',left=' + (window.innerWidth - attrs.socialSharePopupWidth) / 2);
-        }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else if (attrs.socialShareType && attrs.socialShareType === 'share') {
+    // if user specifies that they want to use the Facebook share dialog
+    //(https://developers.facebook.com/docs/sharing/reference/share-dialog)
+    urlString = 'https://www.facebook.com/dialog/share?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
     }
-}
-
-class WebSocialShareCopy {
-    static async share(attrs) {
-        try {
-            await navigator.clipboard.writeText(attrs.socialShareUrl || window.location.href);
-        }
-        catch (err) {
-            // Well it seems that copy isn't supported by this browser
-        }
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
     }
-}
-
-class WebSocialShareHackerNews {
-    static async share(attrs) {
-        let urlString = 'https://news.ycombinator.com/submitlink?u=';
-        //default to the current page if a URL isn't specified
-        urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
-        if (attrs.socialShareText) {
-            urlString += '&t=' + encodeURIComponent(attrs.socialShareText);
-        }
-        WebSocialShareUtils.staticOpenNewWindow(urlString);
+    if (attrs.socialShareUrl) {
+      urlString += '&href=' + encodeURIComponent(attrs.socialShareUrl);
     }
-}
+    if (attrs.socialShareQuote) {
+      urlString += '&quote=' + encodeURIComponent(attrs.socialShareQuote);
+    }
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
+    }
+    if (attrs.socialShareMobileiframe) {
+      urlString += '&mobile_iframe=' + encodeURIComponent(attrs.socialShareMobileiframe);
+    }
+    if (attrs.socialShareHashtags) {
+      urlString += '&hashtag=' + encodeURIComponent(attrs.socialShareHashtags);
+    }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else if (attrs.socialShareType && attrs.socialShareType === 'send') {
+    // if user specifies that they want to use the Facebook send dialog
+    //(https://developers.facebook.com/docs/sharing/reference/send-dialog)
+    urlString = 'https://www.facebook.com/dialog/send?';
+    if (attrs.socialShareVia) {
+      urlString += '&app_id=' + encodeURIComponent(attrs.socialShareVia);
+    }
+    if (attrs.socialShareRedirectUri) {
+      urlString += '&redirect_uri=' + encodeURIComponent(attrs.socialShareRedirectUri);
+    }
+    if (attrs.socialShareUrl) {
+      urlString += '&link=' + encodeURIComponent(attrs.socialShareUrl);
+    }
+    if (attrs.socialShareTo) {
+      urlString += '&to=' + encodeURIComponent(attrs.socialShareTo);
+    }
+    if (attrs.socialShareDisplay) {
+      urlString += '&display=' + encodeURIComponent(attrs.socialShareDisplay);
+    }
+    window.open(urlString, 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+  else {
+    //otherwise default to using sharer.php
+    window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(attrs.socialShareUrl || window.location.href), 'Facebook', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
 
-const webSocialShareCss = "div.web-social-share{visibility:hidden;opacity:0;cursor:pointer;-ms-touch-action:manipulation;touch-action:manipulation}div.web-social-share.web-social-share-open{visibility:visible;opacity:1}div.web-social-share.web-social-share-open div.web-social-share-backdrop{opacity:var(--web-social-share-backdrop-opacity, 0.25)}div.web-social-share.web-social-share-open div.web-social-share-action-sheet{opacity:1}div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height, 80px)}@media (max-width: 540px){div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height-small-device, 140px)}}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-backdrop{opacity:0}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:0}div.web-social-share div.web-social-share-backdrop{opacity:0;-webkit-transition:opacity 0.1s linear;transition:opacity 0.1s linear;background-color:var(--web-social-share-backdrop-background, black);z-index:var(--web-social-share-zindex, 1000);-webkit-transform:translate3d(0, 0, 2px);transform:translate3d(0, 0, 2px);left:0;top:0;position:fixed;height:100%;width:100%}div.web-social-share div.web-social-share-action-sheet{left:0;right:0;top:0;bottom:0;margin:auto;position:fixed;z-index:calc(var(--web-social-share-zindex, 1000) + 1);-webkit-transform:translate3d(0, 0, 3px);transform:translate3d(0, 0, 3px);width:100%;max-width:540px}@media (min-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{border-radius:var(--web-social-share-action-sheet-group-border-radius, 8px 8px 0 0)}}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;-ms-flex-pack:end;justify-content:flex-end;height:100%;max-height:100%}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{-webkit-box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));z-index:calc(var(--web-social-share-zindex, 1000) + 10);-webkit-transform:translate3d(0, 0, 10px);transform:translate3d(0, 0, 10px);background:var(--web-social-share-action-sheet-group-background, #fafafa);display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-wrap:wrap;flex-wrap:wrap;height:0;-webkit-transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);-webkit-transition:height 0.2s ease-in;transition:height 0.2s ease-in}@media (max-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{-ms-flex-pack:start;justify-content:flex-start}}div.web-social-share div.web-social-share-target{margin:auto;width:var(--web-social-share-target-width, 4rem);height:var(--web-social-share-target-height, 3rem);display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}div.web-social-share div.web-social-share-target button{position:relative;cursor:pointer;border:0;background:transparent;width:var(--web-social-share-button-width, 100%);height:var(--web-social-share-button-height, 100%);font-size:var(--web-social-share-button-font-size)}div.web-social-share div.web-social-share-target p{margin:var(--web-social-share-brand-margin, 2px 0);color:var(--web-social-share-brand-color, inherit);font-size:var(--web-social-share-brand-font-size, 0.6rem)}div.web-social-share div.web-social-share-target div.web-social-share-button-icon{margin:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center}::slotted([slot=facebook]),::slotted([slot=twitter]),::slotted([slot=email]),::slotted([slot=linkedin]),::slotted([slot=pinterest]),::slotted([slot=reddit]),::slotted([slot=whatsapp]),::slotted([slot=copy]),::slotted([slot=hackernews]){display:none}";
+// Same implementation as in class @deckdeckgo/utils
+const isMobile = () => {
+  return window === null || window === void 0 ? void 0 : window.matchMedia('(any-pointer:coarse)').matches;
+};
+const staticOpenNewWindow = (urlString) => {
+  if (window.self !== window.top) {
+    window.open(urlString, '_blank');
+  }
+  else {
+    window.open(urlString, '_self');
+  }
+};
 
+const shareTwitter = async (attrs) => {
+  let urlString = 'https://www.twitter.com/intent/tweet?';
+  if (attrs.socialShareText) {
+    urlString += 'text=' + encodeURIComponent(attrs.socialShareText);
+  }
+  if (attrs.socialShareVia) {
+    urlString += '&via=' + encodeURIComponent(attrs.socialShareVia);
+  }
+  if (attrs.socialShareHashtags) {
+    urlString += '&hashtags=' + encodeURIComponent(attrs.socialShareHashtags);
+  }
+  //default to the current page if a URL isn't specified
+  urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (isMobile()) {
+    staticOpenNewWindow(urlString);
+  }
+  else {
+    window.open(urlString, 'Twitter', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
+
+const email = async (attrs) => {
+  let urlString = 'mailto:';
+  if (attrs.socialShareTo) {
+    urlString += encodeURIComponent(attrs.socialShareTo);
+  }
+  urlString += '?';
+  if (attrs.socialShareBody) {
+    urlString += 'body=' + encodeURIComponent(attrs.socialShareBody);
+  }
+  if (attrs.socialShareSubject) {
+    urlString += '&subject=' + encodeURIComponent(attrs.socialShareSubject);
+  }
+  if (attrs.socialShareCc) {
+    urlString += '&cc=' + encodeURIComponent(attrs.socialShareCc);
+  }
+  if (attrs.socialShareBcc) {
+    urlString += '&bcc=' + encodeURIComponent(attrs.socialShareBcc);
+  }
+  staticOpenNewWindow(urlString);
+};
+
+const linkedin = async (attrs) => {
+  let urlString = 'https://www.linkedin.com/shareArticle?mini=true';
+  urlString += '&url=' + encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (attrs.socialShareText) {
+    urlString += '&title=' + encodeURIComponent(attrs.socialShareText);
+  }
+  if (attrs.socialShareDescription) {
+    urlString += '&summary=' + encodeURIComponent(attrs.socialShareDescription);
+  }
+  if (attrs.socialShareSource) {
+    urlString += '&source=' + encodeURIComponent(attrs.socialShareSource);
+  }
+  window.open(urlString, 'Linkedin', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const pinterest = async (attrs) => {
+  window.open('https://www.pinterest.com/pin/create/button/?url=' +
+    encodeURIComponent(attrs.socialShareUrl || window.location.href) +
+    '&media=' +
+    encodeURIComponent(attrs.socialShareMedia) +
+    '&description=' +
+    encodeURIComponent(attrs.socialShareText), 'Pinterest', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const reddit = async (attrs) => {
+  let urlString = 'https://www.reddit.com/';
+  if (attrs.socialShareSubreddit) {
+    urlString += 'r/' + attrs.socialShareSubreddit + '/submit?url=';
+  }
+  else {
+    urlString += 'submit?url=';
+  }
+  /*-
+   * Reddit isn't responsive and at default width for our popups (500 x 500), everything is messed up.
+   * So, overriding the width if it is less than 900 (played around to settle on this) and height if
+   * it is less than 650px.
+   */
+  if (attrs.socialSharePopupWidth < 900) {
+    attrs.socialSharePopupWidth = 900;
+  }
+  if (attrs.socialSharePopupHeight < 650) {
+    attrs.socialSharePopupHeight = 650;
+  }
+  window.open(urlString + encodeURIComponent(attrs.socialShareUrl || window.location.href) + '&title=' + encodeURIComponent(attrs.socialShareText), 'Reddit', 'toolbar=0,status=0,resizable=yes,width=' +
+    attrs.socialSharePopupWidth +
+    ',height=' +
+    attrs.socialSharePopupHeight +
+    ',top=' +
+    (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+    ',left=' +
+    (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+};
+
+const whatsapp = async (attrs) => {
+  const mobile = isMobile();
+  let urlString = mobile ? 'https://api.whatsapp.com/send?text=' : 'https://web.whatsapp.com/send?text=';
+  if (attrs.socialShareText) {
+    urlString += encodeURIComponent(attrs.socialShareText) + '%0A';
+  }
+  //default to the current page if a URL isn't specified
+  urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (mobile) {
+    staticOpenNewWindow(urlString);
+  }
+  else {
+    window.open(urlString, 'WhatsApp', 'toolbar=0,status=0,resizable=yes,width=' +
+      attrs.socialSharePopupWidth +
+      ',height=' +
+      attrs.socialSharePopupHeight +
+      ',top=' +
+      (window.innerHeight - attrs.socialSharePopupHeight) / 2 +
+      ',left=' +
+      (window.innerWidth - attrs.socialSharePopupWidth) / 2);
+  }
+};
+
+const copy = async (attrs) => {
+  try {
+    await navigator.clipboard.writeText(attrs.socialShareUrl || window.location.href);
+  }
+  catch (err) {
+    console.error('Well it seems that copy is not supported by this browser');
+  }
+};
+
+const hackernews = async (attrs) => {
+  let urlString = 'https://news.ycombinator.com/submitlink?u=';
+  //default to the current page if a URL isn't specified
+  urlString += encodeURIComponent(attrs.socialShareUrl || window.location.href);
+  if (attrs.socialShareText) {
+    urlString += '&t=' + encodeURIComponent(attrs.socialShareText);
+  }
+  staticOpenNewWindow(urlString);
+};
+
+const webSocialShareCss = "div.web-social-share{visibility:hidden;opacity:0;cursor:pointer;touch-action:manipulation}div.web-social-share.web-social-share-open{visibility:visible;opacity:1}div.web-social-share.web-social-share-open div.web-social-share-backdrop{opacity:var(--web-social-share-backdrop-opacity, 0.25)}div.web-social-share.web-social-share-open div.web-social-share-action-sheet{opacity:1}div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height, 80px)}@media (max-width: 540px){div.web-social-share.web-social-share-open div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:var(--web-social-share-height-small-device, 140px)}}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-backdrop{opacity:0}div.web-social-share.web-social-share-open.web-social-share-transition-close div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{height:0}div.web-social-share div.web-social-share-backdrop{opacity:0;transition:opacity 0.1s linear;background-color:var(--web-social-share-backdrop-background, black);z-index:var(--web-social-share-zindex, 1000);transform:translate3d(0, 0, 2px);left:0;top:0;position:fixed;height:100%;width:100%}div.web-social-share div.web-social-share-action-sheet{left:0;right:0;top:0;bottom:0;margin:auto;position:fixed;z-index:calc(var(--web-social-share-zindex, 1000) + 1);transform:translate3d(0, 0, 3px);width:100%;max-width:540px}@media (min-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{border-radius:var(--web-social-share-action-sheet-group-border-radius, 8px 8px 0 0)}}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container{display:flex;flex-flow:column;justify-content:flex-end;height:100%;max-height:100%}div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{box-shadow:var(--web-social-share-action-sheet-group-box-shadow, 0 0 8px 4px rgba(0, 0, 0, 0.1));z-index:calc(var(--web-social-share-zindex, 1000) + 10);transform:translate3d(0, 0, 10px);background:var(--web-social-share-action-sheet-group-background, #fafafa);display:flex;justify-content:center;flex-wrap:wrap;height:0;transition-timing-function:cubic-bezier(0.36, 0.66, 0.04, 1);transition:height 0.2s ease-in}@media (max-width: 540px){div.web-social-share div.web-social-share-action-sheet div.web-social-share-action-sheet-container div.web-social-share-action-sheet-group{justify-content:flex-start}}div.web-social-share div.web-social-share-target{margin:auto;width:var(--web-social-share-target-width, 4rem);height:var(--web-social-share-target-height, 3rem);display:flex;flex-direction:column;align-items:center;justify-content:center}div.web-social-share div.web-social-share-target button{position:relative;cursor:pointer;border:0;background:transparent;width:var(--web-social-share-button-width, 100%);height:var(--web-social-share-button-height, 100%);font-size:var(--web-social-share-button-font-size)}div.web-social-share div.web-social-share-target p{margin:var(--web-social-share-brand-margin, 2px 0);color:var(--web-social-share-brand-color, inherit);font-size:var(--web-social-share-brand-font-size, 0.6rem)}div.web-social-share div.web-social-share-target div.web-social-share-button-icon{margin:0;display:flex;flex-direction:column;justify-content:center;align-items:center}::slotted([slot=facebook]),::slotted([slot=twitter]),::slotted([slot=email]),::slotted([slot=linkedin]),::slotted([slot=pinterest]),::slotted([slot=reddit]),::slotted([slot=whatsapp]),::slotted([slot=copy]),::slotted([slot=hackernews]){display:none}";
+
 const WebSocialShare = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.closed = createEvent(this, "closed", 7);
-        this.handleFacebookShare = async (attributes) => {
-            await WebSocialShareFacebook.share(attributes);
-        };
-        this.handleTwitterShare = async (attributes) => {
-            await WebSocialShareTwitter.share(attributes);
-        };
-        this.handleEmailShare = async (attributes) => {
-            await WebSocialShareEmail.share(attributes);
-        };
-        this.handleLinkedinShare = async (attributes) => {
-            await WebSocialShareLinkedin.share(attributes);
-        };
-        this.handlePinterestShare = async (attributes) => {
-            await WebSocialSharePinterest.share(attributes);
-        };
-        this.handleRedditShare = async (attributes) => {
-            await WebSocialShareReddit.share(attributes);
-        };
-        this.handleWhatsappShare = async (attributes) => {
-            await WebSocialShareWhatsapp.share(attributes);
-        };
-        this.handleCopyShare = async (attributes) => {
-            await WebSocialShareCopy.share(attributes);
-        };
-        this.handleHackerNewsShare = async (attributes) => {
-            await WebSocialShareHackerNews.share(attributes);
-        };
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.closed = createEvent(this, "closed", 7);
+  }
+  hide() {
+    if (this.refContainer) {
+      this.refContainer.classList.add('web-social-share-transition-close');
+      setTimeout(() => {
+        // Reflect css animation speed 400ms, see css
+        this.show = false;
+        this.refContainer.classList.remove('web-social-share-transition-close');
+        this.closed.emit();
+      }, 200);
     }
-    hide() {
-        let element = this.el.shadowRoot.querySelector('div.web-social-share');
-        if (element) {
-            element.classList.add('web-social-share-transition-close');
-            setTimeout(() => {
-                // Reflect css animation speed 400ms, see css
-                this.show = false;
-                element.classList.remove('web-social-share-transition-close');
-                this.closed.emit(true);
-            }, 200);
-        }
-        else {
-            // Well we don't find the action sheet, we could mark it as not displayed
-            this.show = false;
-            this.closed.emit(true);
-        }
+    else {
+      // Well we don't find the action sheet, we could mark it as not displayed
+      this.show = false;
+      this.closed.emit();
     }
-    render() {
-        return (h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close' }, h("div", { class: 'web-social-share-backdrop', onClick: () => this.hide() }), h("div", { class: 'web-social-share-action-sheet', onClick: () => this.hide() }, h("div", { class: 'web-social-share-action-sheet-container' }, h("div", { class: 'web-social-share-action-sheet-group' }, this.renderTargets())))));
+  }
+  async handleShare($event, attributes, action) {
+    $event.stopPropagation();
+    await action(attributes);
+    this.hide();
+  }
+  render() {
+    return (h("div", { class: this.show ? 'web-social-share web-social-share-open' : 'web-social-share web-social-share-close', ref: (el) => (this.refContainer = el) }, h("div", { class: "web-social-share-backdrop", onClick: () => this.hide() }), h("div", { class: "web-social-share-action-sheet", onClick: () => this.hide() }, h("div", { class: "web-social-share-action-sheet-container" }, h("div", { class: "web-social-share-action-sheet-group" }, this.renderTargets())))));
+  }
+  renderTargets() {
+    var _a;
+    if (!((_a = this.share) === null || _a === void 0 ? void 0 : _a.config)) {
+      return undefined;
     }
-    renderTargets() {
-        if (!this.share || !this.share.config) {
-            return (h("span", null));
-        }
-        else {
-            return (this.share.config.map((config) => h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
-        }
+    return this.share.config.map((config) => (h("div", { class: "web-social-share-target" }, this.renderButtons(config))));
+  }
+  renderButtons(share) {
+    if (share.facebook) {
+      return this.renderButton(share.facebook, 'facebook', shareFacebook, 'Facebook');
     }
-    renderButtons(share) {
-        if (share.facebook) {
-            return this.renderButton(share.facebook, 'facebook', this.handleFacebookShare, 'Facebook');
-        }
-        else if (share.twitter) {
-            return this.renderButton(share.twitter, 'twitter', this.handleTwitterShare, 'Twitter');
-        }
-        else if (share.email) {
-            return this.renderButton(share.email, 'email', this.handleEmailShare, 'Email');
-        }
-        else if (share.linkedin) {
-            return this.renderButton(share.linkedin, 'linkedin', this.handleLinkedinShare, 'Linkedin');
-        }
-        else if (share.pinterest) {
-            return this.renderButton(share.pinterest, 'pinterest', this.handlePinterestShare, 'Pinterest');
-        }
-        else if (share.reddit) {
-            return this.renderButton(share.reddit, 'reddit', this.handleRedditShare, 'Reddit');
-        }
-        else if (share.whatsapp) {
-            return this.renderButton(share.whatsapp, 'whatsapp', this.handleWhatsappShare, 'WhatsApp');
-        }
-        else if (share.copy) {
-            return this.renderButton(share.copy, 'copy', this.handleCopyShare, 'Copy');
-        }
-        else if (share.hackernews) {
-            return this.renderButton(share.hackernews, 'hackernews', this.handleHackerNewsShare, 'Hacker News');
-        }
-        else {
-            return undefined;
-        }
+    else if (share.twitter) {
+      return this.renderButton(share.twitter, 'twitter', shareTwitter, 'Twitter');
     }
-    renderButton(attributes, slotName, action, defaultBrandName) {
-        return (h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: 'web-social-share-button' }, h("div", { class: "web-social-share-button-icon" }, h("slot", { name: slotName })), this.renderName(attributes, defaultBrandName)));
+    else if (share.email) {
+      return this.renderButton(share.email, 'email', email, 'Email');
     }
-    async handleShare($event, attributes, action) {
-        $event.stopPropagation();
-        await action(attributes);
-        this.hide();
+    else if (share.linkedin) {
+      return this.renderButton(share.linkedin, 'linkedin', linkedin, 'Linkedin');
     }
-    renderName(displayAttributes, defaultBrandName) {
-        if (this.share.displayNames) {
-            return (h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== '' ? displayAttributes.brandName : defaultBrandName));
-        }
-        else {
-            return (h("span", null));
-        }
+    else if (share.pinterest) {
+      return this.renderButton(share.pinterest, 'pinterest', pinterest, 'Pinterest');
     }
-    get el() { return getElement(this); }
+    else if (share.reddit) {
+      return this.renderButton(share.reddit, 'reddit', reddit, 'Reddit');
+    }
+    else if (share.whatsapp) {
+      return this.renderButton(share.whatsapp, 'whatsapp', whatsapp, 'WhatsApp');
+    }
+    else if (share.copy) {
+      return this.renderButton(share.copy, 'copy', copy, 'Copy');
+    }
+    else if (share.hackernews) {
+      return this.renderButton(share.hackernews, 'hackernews', hackernews, 'Hacker News');
+    }
+    return undefined;
+  }
+  renderButton(attributes, slotName, action, defaultBrandName) {
+    return (h("button", { onClick: ($event) => this.handleShare($event, attributes, action), class: "web-social-share-button" }, h("div", { class: "web-social-share-button-icon" }, h("slot", { name: slotName })), this.renderName(attributes, defaultBrandName)));
+  }
+  renderName(displayAttributes, defaultBrandName) {
+    if (this.share.displayNames) {
+      return (h("p", null, displayAttributes && displayAttributes.brandName && displayAttributes.brandName !== ''
+        ? displayAttributes.brandName
+        : defaultBrandName));
+    }
+    return undefined;
+  }
+  get el() { return getElement(this); }
 };
@@ -370,0 +373,0 @@ WebSocialShare.style = webSocialShareCss;

dist/index.js

@@ -1,1 +0,1 @@
-module.exports = require('./cjs/index.cjs.js');
+export * from './esm/index.js';

dist/loader/package.json

 {
   "name": "websocialshare-loader",
   "typings": "./index.d.ts",
-  "module": "./index.mjs",
+  "module": "./index.js",
   "main": "./index.cjs.js",
-  "node:main": "./node-main.js",
-  "jsnext:main": "./index.es2017.mjs",
-  "es2015": "./index.es2017.mjs",
-  "es2017": "./index.es2017.mjs",
+  "jsnext:main": "./index.es2017.js",
+  "es2015": "./index.es2017.js",
+  "es2017": "./index.es2017.js",
   "unpkg": "./cdn.js"
 }

dist/types/components.d.ts

@@ -8,6 +8,12 @@ /* eslint-disable */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { WebSocialShareInput } from "./types/web-social-share/web-social-share-input";
+import { WebSocialShareInput } from "./types/web-social-share-input";
 export namespace Components {
     interface WebSocialShare {
+        /**
+          * The share options
+         */
         "share": WebSocialShareInput;
+        /**
+          * Trigger the display, or close, of the action sheet which contains the social-share options
+         */
         "show": boolean;
@@ -29,4 +35,13 @@ }
     interface WebSocialShare {
-        "onClosed"?: (event: CustomEvent<any>) => void;
+        /**
+          * An event triggered when the modal is `closed`
+         */
+        "onClosed"?: (event: CustomEvent<void>) => void;
+        /**
+          * The share options
+         */
         "share"?: WebSocialShareInput;
+        /**
+          * Trigger the display, or close, of the action sheet which contains the social-share options
+         */
         "show"?: boolean;
@@ -33,0 +48,0 @@ }

dist/types/components/web-social-share/web-social-share.d.ts

 import { EventEmitter } from '../../stencil-public-runtime';
-import { WebSocialShareInput } from '../../types/web-social-share/web-social-share-input';
+import { WebSocialShareInput } from '../../types/web-social-share-input';
+/**
+ * @slot facebook - A slot to display an icon or text in the related social share button
+ * @slot twitter - A slot to display an icon or text in the related social share button
+ * @slot email - A slot to display an icon or text in the related social share button
+ * @slot linkedin - A slot to display an icon or text in the related social share button
+ * @slot pinterest - A slot to display an icon or text in the related social share button
+ * @slot whatsapp - A slot to display an icon or text in the related social share button
+ * @slot copy - A slot to display an icon or text in the related social share button
+ * @slot hackernews - A slot to display an icon or text in the related social share button
+ */
 export declare class WebSocialShare {
-    el: HTMLElement;
-    closed: EventEmitter;
-    show: boolean;
-    share: WebSocialShareInput;
-    hide(): void;
-    render(): any;
-    private renderTargets;
-    private renderButtons;
-    private renderButton;
-    private handleShare;
-    private handleFacebookShare;
-    private handleTwitterShare;
-    private handleEmailShare;
-    private handleLinkedinShare;
-    private handlePinterestShare;
-    private handleRedditShare;
-    private handleWhatsappShare;
-    private handleCopyShare;
-    private handleHackerNewsShare;
-    private renderName;
+  el: HTMLElement;
+  /**
+   * An event triggered when the modal is `closed`
+   */
+  closed: EventEmitter<void>;
+  /**
+   * Trigger the display, or close, of the action sheet which contains the social-share options
+   */
+  show: boolean;
+  /**
+   * The share options
+   */
+  share: WebSocialShareInput;
+  private refContainer;
+  private hide;
+  private handleShare;
+  render(): any;
+  private renderTargets;
+  private renderButtons;
+  private renderButton;
+  private renderName;
 }

dist/types/index.d.ts

 export type { Components, JSX } from './components';
-export * from './types/web-social-share/web-social-share-attributes';
-export * from './types/web-social-share/web-social-share-input';
+export * from './types/web-social-share-attributes';
+export * from './types/web-social-share-input';

dist/types/interface.d.ts

 export type {Components, JSX} from './components';
 
-export * from './types/web-social-share/web-social-share-attributes';
-export * from './types/web-social-share/web-social-share-input';
+export * from './types/web-social-share-attributes';
+export * from './types/web-social-share-input';

dist/types/stencil-public-runtime.d.ts

@@ -46,6 +46,2 @@ declare type CustomMethodDecorator<T> = (target: Object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
     assetsDirs?: string[];
-    /**
-     * @deprecated Use `assetsDirs` instead
-     */
-    assetsDir?: string;
 }
@@ -85,10 +81,2 @@ export interface ShadowRootOptions {
     reflect?: boolean;
-    /** @deprecated: "attr" has been deprecated, please use "attribute" instead. */
-    attr?: string;
-    /** @deprecated "context" has been deprecated. */
-    context?: string;
-    /** @deprecated "connect" has been deprecated, please use ES modules and/or dynamic imports instead. */
-    connect?: string;
-    /** @deprecated "reflectToAttr" has been deprecated, please use "reflect" instead. */
-    reflectToAttr?: boolean;
 }
@@ -150,3 +138,3 @@ export interface MethodDecorator {
 }
-export declare type ListenTargetOptions = 'parent' | 'body' | 'document' | 'window';
+export declare type ListenTargetOptions = 'body' | 'document' | 'window';
 export interface StateDecorator {
@@ -170,2 +158,8 @@ (): PropertyDecorator;
 /**
+ * The `Env` object provides access to the "env" object declared in the project's `stencil.config.ts`.
+ */
+export declare const Env: {
+    [prop: string]: string | undefined;
+};
+/**
  * The `@Component()` decorator is used to provide metadata about the component class.
@@ -228,2 +222,3 @@ * https://stenciljs.com/docs/component
 export declare type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
+export declare type ErrorHandler = (err: any, element?: HTMLElement) => void;
 /**
@@ -272,4 +267,2 @@ * `setMode()` is used for libraries which provide multiple "modes" for styles.
     componentOnReady(): Promise<this>;
-    /** @deprecated */
-    forceUpdate(): void;
 }
@@ -291,2 +284,7 @@ /**
 /**
+ * `setErrorHandler()` can be used to inject a custom global error handler.
+ * Unhandled exception raised while rendering, during event handling, or lifecycles will trigger the custom event handler.
+ */
+export declare const setErrorHandler: (handler: ErrorHandler) => void;
+/**
  * This file gets copied to all distributions of stencil component collections.
@@ -341,9 +339,2 @@ * - no imports
 }
-export interface ComponentDidUnload {
-    /**
-     * The component did unload and the element
-     * will be destroyed.
-     */
-    componentDidUnload(): void;
-}
 export interface ComponentInterface {
@@ -453,2 +444,6 @@ connectedCallback?(): void;
 /**
+ * Fragment
+ */
+export declare const Fragment: FunctionalComponent<{}>;
+/**
  * The "h" namespace is used to import JSX types for elements and attributes.
@@ -459,9 +454,9 @@ * It is imported in order to avoid conflicting global JSX issues.
     function h(sel: any): VNode;
-    function h(sel: Node, data: VNodeData): VNode;
-    function h(sel: any, data: VNodeData): VNode;
+    function h(sel: Node, data: VNodeData | null): VNode;
+    function h(sel: any, data: VNodeData | null): VNode;
     function h(sel: any, text: string): VNode;
     function h(sel: any, children: Array<VNode | undefined | null>): VNode;
-    function h(sel: any, data: VNodeData, text: string): VNode;
-    function h(sel: any, data: VNodeData, children: Array<VNode | undefined | null>): VNode;
-    function h(sel: any, data: VNodeData, children: VNode): VNode;
+    function h(sel: any, data: VNodeData | null, text: string): VNode;
+    function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
+    function h(sel: any, data: VNodeData | null, children: VNode): VNode;
     namespace JSX {
@@ -473,2 +468,10 @@ interface IntrinsicElements extends LocalJSX.IntrinsicElements, JSXBase.IntrinsicElements {
 }
+export declare function h(sel: any): VNode;
+export declare function h(sel: Node, data: VNodeData | null): VNode;
+export declare function h(sel: any, data: VNodeData | null): VNode;
+export declare function h(sel: any, text: string): VNode;
+export declare function h(sel: any, children: Array<VNode | undefined | null>): VNode;
+export declare function h(sel: any, data: VNodeData | null, text: string): VNode;
+export declare function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
+export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
 export interface VNode {
@@ -475,0 +478,0 @@ $flags$: number;

dist/websocialshare/websocialshare.esm.js

@@ -1,1 +0,1 @@
-import{b as s}from"./p-27576e89.js";import{p as e}from"./p-ee533008.js";e().then(e=>s([["p-15746702",[[1,"web-social-share",{show:[1028],share:[16]}]]]],e));
+import{p as s,b as r}from"./p-042b2f6f.js";(()=>{const r=import.meta.url,a={};return""!==r&&(a.resourcesUrl=new URL(".",r).href),s(a)})().then((s=>r([["p-1a6cbd5d",[[1,"web-social-share",{show:[1028],share:[16]}]]]],s)));

package.json

 {
   "name": "web-social-share",
-  "version": "6.4.1",
-  "description": "A Web Component to share urls and content on social networks",
-  "keywords": [
-    "social",
-    "share",
-    "facebook",
-    "instagram",
-    "twitter",
-    "whatsapp",
-    "reddit",
-    "pinterest",
-    "pwa",
-    "progressive-web-app",
-    "progressive-web-apps",
-    "stenciljs",
-    "stencil",
-    "hacker-news",
-    "copy-paste"
-  ],
-  "main": "dist/index.js",
-  "module": "dist/index.mjs",
-  "es2015": "dist/esm/index.mjs",
-  "es2017": "dist/esm/index.mjs",
-  "types": "dist/types/interface.d.ts",
+  "version": "7.0.0",
+  "description": "A Web Component to share urls and text on social networks",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "es2015": "dist/esm/index.js",
+  "es2017": "dist/esm/index.js",
+  "jsnext:main": "dist/esm/index.js",
+  "types": "dist/types/index.d.ts",
   "collection": "dist/collection/collection-manifest.json",
   "collection:main": "dist/collection/index.js",
-  "unpkg": "dist/websocialshare/websocialshare.js",
+  "unpkg": "dist/websocialshare/websocialshare.esm.js",
   "files": [
@@ -36,16 +20,15 @@ "dist/",
   "scripts": {
-    "build": "stencil build",
-    "web": "stencil build --prerender",
+    "build": "stencil build --docs",
     "start": "stencil build --dev --watch --serve",
-    "test": "stencil test --spec --e2e",
-    "test.watch": "stencil test --spec --e2e --watchAll",
-    "generate": "stencil generate"
+    "web": "stencil build"
   },
   "dependencies": {},
   "devDependencies": {
-    "@stencil/core": "^1.17.3",
-    "@stencil/postcss": "^1.0.1",
-    "@stencil/sass": "^1.3.2",
-    "@stencil/utils": "latest",
-    "autoprefixer": "^9.8.6"
+    "@stencil/core": "^2.3.0",
+    "@stencil/postcss": "^2.0.0",
+    "@stencil/sass": "^1.4.1",
+    "autoprefixer": "^10.2.3",
+    "husky": "^4.3.8",
+    "prettier": "^2.2.1",
+    "pretty-quick": "^3.1.0"
   },
@@ -62,15 +45,24 @@ "repository": {
   "homepage": "https://websocialshare.com",
-  "jest": {
-    "transform": {
-      "^.+\\.(ts|tsx)$": "<rootDir>/node_modules/@stencil/core/testing/jest.preprocessor.js"
-    },
-    "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(tsx?|jsx?)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "json",
-      "jsx"
-    ]
+  "keywords": [
+    "social",
+    "share",
+    "facebook",
+    "instagram",
+    "twitter",
+    "whatsapp",
+    "reddit",
+    "pinterest",
+    "pwa",
+    "progressive-web-app",
+    "progressive-web-apps",
+    "stenciljs",
+    "stencil",
+    "hacker-news",
+    "copy-paste"
+  ],
+  "husky": {
+    "hooks": {
+      "pre-commit": "pretty-quick --staged"
+    }
   }
 }

readme.md

 # Web Social Share
 
-Web Social Share is a Web Component  to share urls and content on social networks.
+Web Social Share is a Web Component to share urls and text.
 
-The component will present a dialog which will contains the different sharing options you selected.
-
 [![version](https://img.shields.io/npm/v/web-social-share/latest.svg?color=blue)](https://github.com/peterpeterparker/web-social-share)
@@ -12,21 +10,21 @@ [![npm](https://img.shields.io/npm/dm/web-social-share.svg)]()
 
-- [Web Social Share](#web-social-share)
-	- [Goals](#goals)
-	- [Installation](#installation)
-	- [Integration](#integration)
-	- [Getting Started](#getting-started)
-		- [show](#show)
-		- [share](#share)
-			- [Example](#example)
-			- [Vanilla JS](#vanilla-js)
-  - [Slots](#slots)
-    - [Styling your icons](#styling-your-icons)
-  - [Theming](#theming)
-  - [Events](#events)  
-  - [Fallback and detection](#fallback-and-detection)    
-  - [Web Share API](#web-share-api)  
-  - [Showcase](#showcase)
-  - [Theming](#theming)
-  - [Credits](#credits)
-  - [License](#license)
+- [Goals](#goals)
+- [Features](#features)
+- [Installation](#installation)
+- [Integration](#integration)
+- [Getting Started](#getting-started)
+  - [show](#show)
+  - [share](#share)
+    - [Example](#example)
+    - [Vanilla JS](#vanilla-js)
+- [Slots](#slots)
+  - [Styling your icons](#styling-your-icons)
+- [Theming](#theming)
+- [Events](#events)
+- [Fallback and detection](#fallback-and-detection)
+- [Web Share API](#web-share-api)
+- [Showcase](#showcase)
+- [Theming](#theming)
+- [Credits](#credits)
+- [License](#license)
 
@@ -37,7 +35,27 @@ ## Goals
 
-Nowadays, the [Web Share API](https://developer.mozilla.org/fr/docs/Web/API/Navigator/share) is supported by most recent mobile OS. Even though, it may remain interesting to use such a component for the desktop version of web apps.
+Nowadays, the [Web Share API](https://developer.mozilla.org/fr/docs/Web/API/Navigator/share) is supported by most recent mobile OS.
 
+Even though, it may remain interesting to use such a component for the desktop version of web apps.
+
+## Features
+
+The component present a dialog which contains the sharing options you selected.
+
+Following target are currently supported:
+
+- Facebook
+- Twitter
+- Email
+- Linkedin
+- Pinterest
+- Reddit
+- WhatsApp
+- Hacker News
+- Copy (to clipboard)
+
 ## Installation
 
-    $ npm install web-social-share
+```
+$ npm install web-social-share
+```
 
@@ -55,11 +73,5 @@ ## Integration
 ```
-<web-social-share show="true" share="options"></web-social-share>
+<web-social-share show={true} share={options}></web-social-share>
 ```
 
-or in an Angular application:
-
-```
-<web-social-share [show]="true" [share]="options" (closed)="close()"></web-social-share>
-```
-
 Both `show` and `share` are mandatory.
@@ -69,3 +81,3 @@
 
-Trigger the display or closing of the action sheet presenting the social-share options you have selected.
+Trigger the display, or close, of the action sheet which contains the social-share options.
 
@@ -76,72 +88,65 @@ `show` is a **boolean** parameter
 
-The following share options are supported:
+For details about them you could have a look to the interface `WebSocialShareInput` located under folder `src/types/web-social-share/`.
 
-- Facebook
-- Twitter
-- Email
-- Linkedin
-- Pinterest
-- Reddit
-- WhatsApp
-- Hacker News
-- Copy (to clipboard)
+`share` is a property of type **WebSocialShareInput**.
 
-For details about them you could have a look to the interface `WebSocialShareInput` located under folder `src/types/web-social-share/`.
+Note: `share` is an object. Therefore, it has to be parsed with JavaScript if you use the component in a vanilla Javascript application.
 
-`share` is a parameter of type **WebSocialShareInput**
-
 #### Example
 
-For example, if you would like to allow your users to share a website thru Facebook and Twitter, you could define basic options like following:
+For example, if you would like to allow your users to share a website through Facebook and Twitter, you could define basic options like following:
 
-    const share = {
-        config: [{
-              facebook: {
-                socialShareUrl: 'https://peterpeterparker.io'
-              }
-            },{
-              twitter: {
-                socialShareUrl: 'https://peterpeterparker.io'
-              }
-        }]
-    };
+```
+const share = {
+    config: [{
+          facebook: {
+            socialShareUrl: 'https://peterpeterparker.io'
+          }
+        },{
+          twitter: {
+            socialShareUrl: 'https://peterpeterparker.io'
+          }
+    }]
+};
+```
 
-If you would like to display the action default name, you could extend your configuration using the attribute `displayNames` like the following: 
+If you would like to display the action default name, you could extend your configuration using the attribute `displayNames` like the following:
 
-    const share = {
-        displayNames: true,
-        config: [{
-              facebook: {
-                socialShareUrl: 'https://peterpeterparker.io'
-              }
-            },{
-              twitter: {
-                socialShareUrl: 'https://peterpeterparker.io'
-              }
-        }]
-    };
-    
+```
+const share = {
+    displayNames: true,
+    config: [{
+          facebook: {
+            socialShareUrl: 'https://peterpeterparker.io'
+          }
+        },{
+          twitter: {
+            socialShareUrl: 'https://peterpeterparker.io'
+          }
+    }]
+};
+```
+
 Worth to notice, you could also provide your own custom brand name, for example in case you would translate the word `Email`, for example:
 
-    const share = {
-        displayNames: true,
-        config: [{
-              email: {
-                brandName: 'E-Mail-Adresse',
-                socialShareTo: '[e-mail]',
-                socialShareBody: 'https://peterpeterparker.io'
-              }
-        }]
-    };
-    
-#### Vanilla JS
+```
+const share = {
+    displayNames: true,
+    config: [{
+          email: {
+            brandName: 'E-Mail-Adresse',
+            socialShareTo: '[e-mail]',
+            socialShareBody: 'https://peterpeterparker.io'
+          }
+    }]
+};
+```
 
-For an example of Vanilla JS use, you could have a look to the `index.html` demo located in this repo under folder `src`.
-
 ### Slots
 
-Slots has to be used to inject the icons for your actions in the component.
+Slots have to be used to display the icon or text for your actions.
 
-The available slots are: `facebook`, `twitter`, `pinterest`, `linkedin`, `reddit`, `email`, `copy` and `whatsapp`.
+The available slots are: `facebook`, `twitter`, `pinterest`, `linkedin`, `reddit`, `email`, `copy`, `hackernews` and `whatsapp`.
 
+NOTE: Slot names MUST be lower case.
 ```
@@ -162,3 +167,3 @@ <web-social-share show="false">
 
-> Note that currently you may have to add the `style="display: block"` on the slotted elements, notably if you would use `<ion-icon/>`, for them to be shown.
+> Note that you may have to add the `style="display: block"` on the slotted elements, notably if you would use `<ion-icon/>`, for them to be shown.
 
@@ -174,3 +179,3 @@ #### Styling your icons
     <i class="fab fa-twitter" slot="twitter" style="color: #00aced; width: 1.4rem;"></i>
-</web-social-share>    
+</web-social-share>
 ```
@@ -182,21 +187,21 @@
 
-| CSS4 variable                      | Default | Note |
-| -------------------------- |-----------------|-----------------|
-| --web-social-share-backdrop-opacity | 0.25 | Backdrop opacity |
-| --web-social-share-backdrop-background | black | Backdrop background |
-| --web-social-share-height | 80px | Action sheet height |
-| --web-social-share-height-small-device | 140px | Action sheet height on device smaller than 540px |
-| --web-social-share-target-width | 4rem | An action container width |
-| --web-social-share-target-height | 3rem | An action container height |
-| --web-social-share-button-width | 100% | An action inner button width |
-| --web-social-share-button-height | 100% | An action inner button height |
-| --web-social-share-target-icon-container-height | 2rem | An action icon container height |
-| --web-social-share-button-font-size |  | The font-size of an action button |
-| --web-social-share-brand-font-size | 0.6rem | The font-size of an action brand name |
-| --web-social-share-brand-color | inherit | The color of an action brand name |
-| --web-social-share-brand-margin | 2px 0 | A margin for the brand name |
-| --web-social-share-zindex | 1000 | The base zIndex of the component |
-| --web-social-share-action-sheet-group-box-shadow | 0 0 8px 4px rgba(0,0,0,0.1) | A shadow around the action container |
-| --web-social-share-action-sheet-group-background | #fafafa | The background of the action container |
-| --web-social-share-action-sheet-group-border-radius | 8px 8px 0 0 | A border radius around the action container. Applied only if the windows is more than 540px |
+| CSS4 variable                                       | Default                     | Note                                                                                        |
+| --------------------------------------------------- | --------------------------- | ------------------------------------------------------------------------------------------- |
+| --web-social-share-backdrop-opacity                 | 0.25                        | Backdrop opacity                                                                            |
+| --web-social-share-backdrop-background              | black                       | Backdrop background                                                                         |
+| --web-social-share-height                           | 80px                        | Action sheet height                                                                         |
+| --web-social-share-height-small-device              | 140px                       | Action sheet height on device smaller than 540px                                            |
+| --web-social-share-target-width                     | 4rem                        | An action container width                                                                   |
+| --web-social-share-target-height                    | 3rem                        | An action container height                                                                  |
+| --web-social-share-button-width                     | 100%                        | An action inner button width                                                                |
+| --web-social-share-button-height                    | 100%                        | An action inner button height                                                               |
+| --web-social-share-target-icon-container-height     | 2rem                        | An action icon container height                                                             |
+| --web-social-share-button-font-size                 |                             | The font-size of an action button                                                           |
+| --web-social-share-brand-font-size                  | 0.6rem                      | The font-size of an action brand name                                                       |
+| --web-social-share-brand-color                      | inherit                     | The color of an action brand name                                                           |
+| --web-social-share-brand-margin                     | 2px 0                       | A margin for the brand name                                                                 |
+| --web-social-share-zindex                           | 1000                        | The base zIndex of the component                                                            |
+| --web-social-share-action-sheet-group-box-shadow    | 0 0 8px 4px rgba(0,0,0,0.1) | A shadow around the action container                                                        |
+| --web-social-share-action-sheet-group-background    | #fafafa                     | The background of the action container                                                      |
+| --web-social-share-action-sheet-group-border-radius | 8px 8px 0 0                 | A border radius around the action container. Applied only if the windows is more than 540px |
 
@@ -208,3 +213,3 @@ ## Events
 ```
-@Event() closed(void);
+@Event() closed<void>();
 ```
@@ -214,25 +219,13 @@
 
-In an Angular application, the event can be bind as following:
-
-```
-<web-social-share [show]="true" [share]="options" (closed)="close()"></web-social-share>
-```
-
-In Vanilla you need to add a `listener`:
-
-```
-document.querySelector('web-social-share').addListener('onClosed', () => console.log('Something)');
-```
-
 ## Fallback and detection
 
-This component is a dumb component. It don't proceed detection or fallback to anything in case one of the share options would not be supported by the device or browser where the component is used.
+This component is a dumb component. It do not proceed detection or fallback to anything in case one of the share options would not be supported by the device or browser where the component is used.
 
-For example, the share options "Copy (to clipboard)" use the Web Api [Clipboard​.write​Text()](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/writeText) which might not be supported. Anyway the action will be displayed and if used by the user, nothing will happen.
+For example, the share options "Copy (to clipboard)" use the Web Api [Clipboard.writeText()](https://developer.mozilla.org/en-US/docs/Web/API/Clipboard/writeText) which might not be supported. Anyway the action will be displayed and if used by the user, nothing will happen.
 
 ## Web Share API
 
-When I develop web apps I generally develop a mixed solution between Web Share API and this component. If the Web Share API is supported, and maybe sometimes in combination to detecting desktop or mobile, I use the browser API. But if not supported, I fallback on this component.  
+When I develop web apps I generally develop a mixed solution between Web Share API and this component. If the Web Share API is supported, and maybe sometimes in combination to detecting desktop or mobile, I use the browser API. If not supported, I fallback on this component.
 
-If interested to implement such a solution, check out the [blog post](https://dev.to/daviddalbusco/how-to-implement-the-web-share-api-with-a-fallback-b3) I published about it 
+If interested to implement such a solution, check out the [blog post](https://dev.to/daviddalbusco/how-to-implement-the-web-share-api-with-a-fallback-b3) I published about it
 
@@ -247,3 +240,3 @@ ## Showcase
 
-I didn't want to reinvent the wheel when it comes to the sharing actions themselves. Therefore I forked the features of [angular-socialshare](https://github.com/720kb/angular-socialshare). Kudos to [45kb](https://github.com/45kb) :+1:
+I didn't want to reinvent the wheel when it comes to the sharing actions themselves. Therefore, I forked the features of [angular-socialshare](https://github.com/720kb/angular-socialshare). Kudos to [45kb](https://github.com/45kb) :+1:
 
@@ -250,0 +243,0 @@ ## License

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses eval() which is a dangerous function. This prevents the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of medium supply chain risk alerts

3

decreased by-78.57%

Worsened metrics

Total package byte prevSize

382260

decreased by-59.5%

Dev dependency count

7

increased by40%

Number of package files

65

decreased by-32.99%

Lines of code

5858

decreased by-51.2%

Number of lines in readme file

235

decreased by-2.89%

No dependency changes