add loading param to remark-snackplayer plugin (facebook#2367)

idealx · Dec 5, 2020 · 0ad8af3 · 0ad8af3
1 parent 3e30040
commit 0ad8af3
Show file tree

Hide file tree

Showing 7 changed files with 23 additions and 20 deletions.
diff --git a/plugins/remark-snackplayer/package.json b/plugins/remark-snackplayer/package.json
@@ -1,8 +1,8 @@
 {
   "name": "@react-native-website/remark-snackplayer",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "private": true,
-  "description": "Remark SnackPlayer Plugin",
+  "description": "Remark Expo Snack Plugin",
   "main": "src/index.js",
   "keywords": [
     "remark",
@@ -20,9 +20,9 @@
   },
   "dependencies": {
     "dedent": "^0.7.0",
-    "object.fromentries": "^2.0.2",
+    "object.fromentries": "^2.0.3",
     "unist-builder": "^2.0.3",
-    "unist-util-visit-parents": "^3.1.0"
+    "unist-util-visit-parents": "^3.1.1"
   },
   "devDependencies": {
     "remark": "^12.0.1",

diff --git a/plugins/remark-snackplayer/src/index.js b/plugins/remark-snackplayer/src/index.js
@@ -17,7 +17,7 @@ const parseParams = (paramString = '') => {
 const processNode = (node, parent) => {
   return new Promise(async (resolve, reject) => {
     try {
-      let params = parseParams(node.meta);
+      const params = parseParams(node.meta);
 
       // Gather necessary Params
       const name = params.name ? decodeURIComponent(params.name) : 'Example';
@@ -26,12 +26,11 @@ const processNode = (node, parent) => {
         : 'Example usage';
       const sampleCode = node.value;
       const encodedSampleCode = encodeURIComponent(sampleCode);
-      const platform = params.platform ? params.platform : 'web';
-      const supportedPlatforms = params.supportedPlatforms
-        ? params.supportedPlatforms
-        : 'ios,android,web';
-      const theme = params.theme ? params.theme : 'light';
-      const preview = params.preview ? params.preview : 'true';
+      const platform = params.platform || 'web';
+      const supportedPlatforms = params.supportedPlatforms || 'ios,android,web';
+      const theme = params.theme || 'light';
+      const preview = params.preview || 'true';
+      const loading = params.loading || 'lazy';
 
       // Generate Node for SnackPlayer
       const snackPlayerDiv = u('html', {
@@ -45,6 +44,7 @@ const processNode = (node, parent) => {
             data-snack-supported-platforms="${supportedPlatforms}"
             data-snack-theme="${theme}"
             data-snack-preview="${preview}"
+            data-snack-loading="${loading}"
           ></div>
           `,
       });

diff --git a/plugins/remark-snackplayer/tests/markdown/test2.md b/plugins/remark-snackplayer/tests/markdown/test2.md
@@ -15,7 +15,7 @@ const YourApp = () => {
 export default YourApp;
 ```
 
-```SnackPlayer name=SecondPlayer&theme=dark&preview=false&supportedPlatforms=ios
+```SnackPlayer name=SecondPlayer&theme=dark&preview=false&supportedPlatforms=ios&loading=eager
 import React from 'react';
 import { Text, View } from 'react-native';
 

diff --git a/plugins/remark-snackplayer/tests/output/output1.html b/plugins/remark-snackplayer/tests/output/output1.html
@@ -7,4 +7,5 @@
   data-snack-supported-platforms="ios,android,web"
   data-snack-theme="light"
   data-snack-preview="true"
+  data-snack-loading="lazy"
 ></div>
diff --git a/plugins/remark-snackplayer/tests/output/output2.html b/plugins/remark-snackplayer/tests/output/output2.html
@@ -7,6 +7,7 @@
   data-snack-supported-platforms="ios,android,web"
   data-snack-theme="light"
   data-snack-preview="true"
+  data-snack-loading="lazy"
 ></div>
 
 <div
@@ -18,4 +19,5 @@
   data-snack-supported-platforms="ios"
   data-snack-theme="dark"
   data-snack-preview="false"
+  data-snack-loading="eager"
 ></div>
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
@@ -11,7 +11,7 @@ module.exports = {
   scripts: [
     {
       src:
-        'https://cdn.jsdelivr.net/npm/focus-visible@5.0.2/dist/focus-visible.min.js',
+        'https://cdn.jsdelivr.net/npm/focus-visible@5.2.0/dist/focus-visible.min.js',
       defer: true,
     },
     {src: 'https://snack.expo.io/embed.js', defer: true},

diff --git a/yarn.lock b/yarn.lock
@@ -7886,14 +7886,14 @@ object.assign@^4.1.0, object.assign@^4.1.1:
     has-symbols "^1.0.1"
     object-keys "^1.1.1"
 
-object.fromentries@^2.0.2:
-  version "2.0.2"
-  resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.2.tgz#4a09c9b9bb3843dd0f89acdb517a794d4f355ac9"
-  integrity sha512-r3ZiBH7MQppDJVLx6fhD618GKNG40CZYH9wgwdhKxBDDbQgjeWGGd4AtkZad84d291YxvWe7bJGuE65Anh0dxQ==
+object.fromentries@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/object.fromentries/-/object.fromentries-2.0.3.tgz#13cefcffa702dc67750314a3305e8cb3fad1d072"
+  integrity sha512-IDUSMXs6LOSJBWE++L0lzIbSqHl9KDCfff2x/JSEIDtEUavUnyMYC2ZGay/04Zq4UT8lvd4xNhU4/YHKibAOlw==
   dependencies:
+    call-bind "^1.0.0"
     define-properties "^1.1.3"
-    es-abstract "^1.17.0-next.1"
-    function-bind "^1.1.1"
+    es-abstract "^1.18.0-next.1"
     has "^1.0.3"
 
 object.getownpropertydescriptors@^2.0.3, object.getownpropertydescriptors@^2.1.0:
@@ -11630,7 +11630,7 @@ unist-util-visit-children@^1.0.0:
   resolved "https://registry.yarnpkg.com/unist-util-visit-children/-/unist-util-visit-children-1.1.4.tgz#e8a087e58a33a2815f76ea1901c15dec2cb4b432"
   integrity sha512-sA/nXwYRCQVRwZU2/tQWUqJ9JSFM1X3x7JIOsIgSzrFHcfVt6NkzDtKzyxg2cZWkCwGF9CO8x4QNZRJRMK8FeQ==
 
-unist-util-visit-parents@^3.0.0, unist-util-visit-parents@^3.1.0:
+unist-util-visit-parents@^3.0.0, unist-util-visit-parents@^3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/unist-util-visit-parents/-/unist-util-visit-parents-3.1.1.tgz#65a6ce698f78a6b0f56aa0e88f13801886cdaef6"
   integrity sha512-1KROIZWo6bcMrZEwiH2UrXDyalAa0uqzWCxCJj6lPOvTve2WkfgCytoDTPaMnodXh1WrXOq0haVYHj99ynJlsg==