react-famewall 0.1.3 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/README.md +33 -1
  2. package/dist/index.js +18 -5
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.modern.js +16 -4
  5. package/dist/index.modern.js.map +1 -1
  6. package/package.json +1 -1
package/README.md CHANGED
@@ -1,5 +1,7 @@
1
1
  # react-famewall
2
2
 
3
+ [![npm](https://img.shields.io/npm/v/react-famewall)](https://www.npmjs.com/package/react-famewall)
4
+
3
5
  > React component for Famewall Embeds
4
6
 
5
7
  Highlight and display social media mentions as beautiful testimonials. Enjoy the fame you receive from customers by [signing up here](https://famewall.io).
@@ -10,7 +12,7 @@ Highlight and display social media mentions as beautiful testimonials. Enjoy the
10
12
  npm install --save react-famewall
11
13
  ```
12
14
 
13
- ## Usage
15
+ ## Basic Usage
14
16
 
15
17
  ```jsx
16
18
  import React from 'react'
@@ -26,6 +28,36 @@ const App = () => {
26
28
  }
27
29
  ```
28
30
 
31
+ ## Dynamic card color (For websites with Dark Mode/ Light Mode Switch)
32
+
33
+ Use the 'cardTheme' prop to dynamically feed in "light" or "dark" if you want the wall to be compatible with dynamic card color based on your website's theme
34
+
35
+ ```jsx
36
+
37
+ const App = () => {
38
+
39
+ return(
40
+ <FamewallEmbed
41
+ wallUrl="famewall"
42
+ cardTheme="dark"
43
+ />
44
+ )
45
+ }
46
+ ```
47
+
48
+ ```jsx
49
+
50
+ const App = () => {
51
+
52
+ return(
53
+ <FamewallEmbed
54
+ wallUrl="famewall"
55
+ cardTheme="light"
56
+ />
57
+ )
58
+ }
59
+ ```
60
+
29
61
  ## License
30
62
 
31
63
  MIT ©2021 [Famewall](https://famewall.io)
package/dist/index.js CHANGED
@@ -1,11 +1,13 @@
1
1
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
2
2
 
3
- var React = _interopDefault(require('react'));
3
+ var React = require('react');
4
+ var React__default = _interopDefault(React);
4
5
  var IframeResizer = _interopDefault(require('iframe-resizer-react'));
5
6
  var nanoid = require('nanoid');
6
7
 
7
8
  var FamewallEmbed = function FamewallEmbed(_ref) {
8
- var wallUrl = _ref.wallUrl;
9
+ var wallUrl = _ref.wallUrl,
10
+ cardTheme = _ref.cardTheme;
9
11
 
10
12
  if (!wallUrl) {
11
13
  console.error('Wall URL is required');
@@ -13,12 +15,23 @@ var FamewallEmbed = function FamewallEmbed(_ref) {
13
15
  }
14
16
 
15
17
  var embedId = nanoid.nanoid();
16
- return /*#__PURE__*/React.createElement(IframeResizer, {
18
+ React.useEffect(function () {}, [cardTheme]);
19
+ React.useEffect(function () {
20
+ try {
21
+ var script = document.createElement("script");
22
+ script.src = "https://embed.famewall.io/iframeResizer.min.js";
23
+ script.async = true;
24
+ document.body.appendChild(script);
25
+ } catch (err) {}
26
+ }, []);
27
+ return /*#__PURE__*/React__default.createElement(IframeResizer, {
17
28
  title: "Famewall Embed " + wallUrl,
18
29
  id: embedId,
19
- src: "https://embed.famewall.io/wall/" + wallUrl,
30
+ src: cardTheme ? "https://embed.famewall.io/wall/" + wallUrl + "?theme=" + cardTheme : "https://embed.famewall.io/wall/" + wallUrl,
20
31
  frameBorder: "0",
21
- scrolling: "yes",
32
+ checkOrigin: false,
33
+ autoResize: true,
34
+ scrolling: false,
22
35
  width: "100%",
23
36
  style: {
24
37
  border: 0
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/index.js"],"sourcesContent":["import React from 'react'\nimport IframeResizer from 'iframe-resizer-react'\nimport {nanoid} from 'nanoid'\n\nconst FamewallEmbed = ({ wallUrl }) => {\n if (!wallUrl) {\n console.error('Wall URL is required')\n return null\n }\n const embedId = nanoid()\n\n return (\n <IframeResizer\n title={`Famewall Embed ${wallUrl}`}\n id={embedId}\n src={`https://embed.famewall.io/wall/${wallUrl}`}\n frameBorder='0'\n scrolling='yes'\n width='100%'\n style={{\n border: 0\n }}\n />\n )\n}\n\nexport default FamewallEmbed\n"],"names":["FamewallEmbed","wallUrl","console","error","embedId","nanoid","border"],"mappings":";;;;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAAiB;AAAA,MAAdC,OAAc,QAAdA,OAAc;;AACrC,MAAI,CAACA,OAAL,EAAc;AACZC,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,aAAM,EAAtB;AAEA,sBACE,oBAAC,aAAD;AACE,IAAA,KAAK,sBAAoBJ,OAD3B;AAEE,IAAA,EAAE,EAAEG,OAFN;AAGE,IAAA,GAAG,sCAAoCH,OAHzC;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,SAAS,EAAC,KALZ;AAME,IAAA,KAAK,EAAC,MANR;AAOE,IAAA,KAAK,EAAE;AACLK,MAAAA,MAAM,EAAE;AADH;AAPT,IADF;AAaD,CApBD;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../src/index.js"],"sourcesContent":["import React,{useEffect} from 'react'\r\nimport IframeResizer from 'iframe-resizer-react'\r\nimport {nanoid} from 'nanoid'\r\n\r\nconst FamewallEmbed = ({ wallUrl, cardTheme }) => {\r\n if (!wallUrl) {\r\n console.error('Wall URL is required')\r\n return null\r\n }\r\n const embedId = nanoid()\r\n\r\n useEffect(()=>{},[cardTheme])\r\n\r\n useEffect(()=>{\r\n try{\r\n const script = document.createElement(\"script\");\r\n\r\n script.src = \"https://embed.famewall.io/iframeResizer.min.js\";\r\n script.async = true;\r\n document.body.appendChild(script);\r\n }\r\n catch(err){}\r\n },[])\r\n\r\n return (\r\n <IframeResizer\r\n title={`Famewall Embed ${wallUrl}`}\r\n id={embedId}\r\n src={cardTheme?`https://embed.famewall.io/wall/${wallUrl}?theme=${cardTheme}`:`https://embed.famewall.io/wall/${wallUrl}`}\r\n frameBorder='0'\r\n checkOrigin={false}\r\n autoResize={true}\r\n scrolling={false}\r\n width='100%'\r\n style={{\r\n border: 0\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","wallUrl","cardTheme","console","error","embedId","nanoid","useEffect","script","document","createElement","src","async","body","appendChild","err","React","border"],"mappings":";;;;;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAA4B;AAAA,MAAzBC,OAAyB,QAAzBA,OAAyB;AAAA,MAAhBC,SAAgB,QAAhBA,SAAgB;;AAChD,MAAI,CAACD,OAAL,EAAc;AACZE,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,aAAM,EAAtB;AAEAC,EAAAA,eAAS,CAAC,YAAI,EAAL,EAAQ,CAACL,SAAD,CAAR,CAAT;AAEAK,EAAAA,eAAS,CAAC,YAAI;AACZ,QAAG;AACH,UAAMC,MAAM,GAAGC,QAAQ,CAACC,aAAT,CAAuB,QAAvB,CAAf;AAEAF,MAAAA,MAAM,CAACG,GAAP,GAAa,gDAAb;AACAH,MAAAA,MAAM,CAACI,KAAP,GAAe,IAAf;AACAH,MAAAA,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,MAA1B;AACC,KAND,CAOA,OAAMO,GAAN,EAAU;AACX,GATQ,EASP,EATO,CAAT;AAWA,sBACEC,6BAAC,aAAD;AACE,IAAA,KAAK,sBAAoBf,OAD3B;AAEE,IAAA,EAAE,EAAEI,OAFN;AAGE,IAAA,GAAG,EAAEH,SAAS,uCAAmCD,OAAnC,eAAoDC,SAApD,uCAAkGD,OAHlH;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,WAAW,EAAE,KALf;AAME,IAAA,UAAU,EAAE,IANd;AAOE,IAAA,SAAS,EAAE,KAPb;AAQE,IAAA,KAAK,EAAC,MARR;AASE,IAAA,KAAK,EAAE;AACLgB,MAAAA,MAAM,EAAE;AADH;AATT,IADF;AAeD,CAnCD;;;;"}
package/dist/index.modern.js CHANGED
@@ -1,9 +1,10 @@
1
- import React from 'react';
1
+ import React, { useEffect } from 'react';
2
2
  import IframeResizer from 'iframe-resizer-react';
3
3
  import { nanoid } from 'nanoid';
4
4
 
5
5
  var FamewallEmbed = function FamewallEmbed(_ref) {
6
- var wallUrl = _ref.wallUrl;
6
+ var wallUrl = _ref.wallUrl,
7
+ cardTheme = _ref.cardTheme;
7
8
 
8
9
  if (!wallUrl) {
9
10
  console.error('Wall URL is required');
@@ -11,12 +12,23 @@ var FamewallEmbed = function FamewallEmbed(_ref) {
11
12
  }
12
13
 
13
14
  var embedId = nanoid();
15
+ useEffect(function () {}, [cardTheme]);
16
+ useEffect(function () {
17
+ try {
18
+ var script = document.createElement("script");
19
+ script.src = "https://embed.famewall.io/iframeResizer.min.js";
20
+ script.async = true;
21
+ document.body.appendChild(script);
22
+ } catch (err) {}
23
+ }, []);
14
24
  return /*#__PURE__*/React.createElement(IframeResizer, {
15
25
  title: "Famewall Embed " + wallUrl,
16
26
  id: embedId,
17
- src: "https://embed.famewall.io/wall/" + wallUrl,
27
+ src: cardTheme ? "https://embed.famewall.io/wall/" + wallUrl + "?theme=" + cardTheme : "https://embed.famewall.io/wall/" + wallUrl,
18
28
  frameBorder: "0",
19
- scrolling: "yes",
29
+ checkOrigin: false,
30
+ autoResize: true,
31
+ scrolling: false,
20
32
  width: "100%",
21
33
  style: {
22
34
  border: 0
package/dist/index.modern.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.modern.js","sources":["../src/index.js"],"sourcesContent":["import React from 'react'\nimport IframeResizer from 'iframe-resizer-react'\nimport {nanoid} from 'nanoid'\n\nconst FamewallEmbed = ({ wallUrl }) => {\n if (!wallUrl) {\n console.error('Wall URL is required')\n return null\n }\n const embedId = nanoid()\n\n return (\n <IframeResizer\n title={`Famewall Embed ${wallUrl}`}\n id={embedId}\n src={`https://embed.famewall.io/wall/${wallUrl}`}\n frameBorder='0'\n scrolling='yes'\n width='100%'\n style={{\n border: 0\n }}\n />\n )\n}\n\nexport default FamewallEmbed\n"],"names":["FamewallEmbed","wallUrl","console","error","embedId","nanoid","border"],"mappings":";;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAAiB;AAAA,MAAdC,OAAc,QAAdA,OAAc;;AACrC,MAAI,CAACA,OAAL,EAAc;AACZC,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,MAAM,EAAtB;AAEA,sBACE,oBAAC,aAAD;AACE,IAAA,KAAK,sBAAoBJ,OAD3B;AAEE,IAAA,EAAE,EAAEG,OAFN;AAGE,IAAA,GAAG,sCAAoCH,OAHzC;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,SAAS,EAAC,KALZ;AAME,IAAA,KAAK,EAAC,MANR;AAOE,IAAA,KAAK,EAAE;AACLK,MAAAA,MAAM,EAAE;AADH;AAPT,IADF;AAaD,CApBD;;;;"}
1
+ {"version":3,"file":"index.modern.js","sources":["../src/index.js"],"sourcesContent":["import React,{useEffect} from 'react'\r\nimport IframeResizer from 'iframe-resizer-react'\r\nimport {nanoid} from 'nanoid'\r\n\r\nconst FamewallEmbed = ({ wallUrl, cardTheme }) => {\r\n if (!wallUrl) {\r\n console.error('Wall URL is required')\r\n return null\r\n }\r\n const embedId = nanoid()\r\n\r\n useEffect(()=>{},[cardTheme])\r\n\r\n useEffect(()=>{\r\n try{\r\n const script = document.createElement(\"script\");\r\n\r\n script.src = \"https://embed.famewall.io/iframeResizer.min.js\";\r\n script.async = true;\r\n document.body.appendChild(script);\r\n }\r\n catch(err){}\r\n },[])\r\n\r\n return (\r\n <IframeResizer\r\n title={`Famewall Embed ${wallUrl}`}\r\n id={embedId}\r\n src={cardTheme?`https://embed.famewall.io/wall/${wallUrl}?theme=${cardTheme}`:`https://embed.famewall.io/wall/${wallUrl}`}\r\n frameBorder='0'\r\n checkOrigin={false}\r\n autoResize={true}\r\n scrolling={false}\r\n width='100%'\r\n style={{\r\n border: 0\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","wallUrl","cardTheme","console","error","embedId","nanoid","useEffect","script","document","createElement","src","async","body","appendChild","err","border"],"mappings":";;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAA4B;AAAA,MAAzBC,OAAyB,QAAzBA,OAAyB;AAAA,MAAhBC,SAAgB,QAAhBA,SAAgB;;AAChD,MAAI,CAACD,OAAL,EAAc;AACZE,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,MAAM,EAAtB;AAEAC,EAAAA,SAAS,CAAC,YAAI,EAAL,EAAQ,CAACL,SAAD,CAAR,CAAT;AAEAK,EAAAA,SAAS,CAAC,YAAI;AACZ,QAAG;AACH,UAAMC,MAAM,GAAGC,QAAQ,CAACC,aAAT,CAAuB,QAAvB,CAAf;AAEAF,MAAAA,MAAM,CAACG,GAAP,GAAa,gDAAb;AACAH,MAAAA,MAAM,CAACI,KAAP,GAAe,IAAf;AACAH,MAAAA,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,MAA1B;AACC,KAND,CAOA,OAAMO,GAAN,EAAU;AACX,GATQ,EASP,EATO,CAAT;AAWA,sBACE,oBAAC,aAAD;AACE,IAAA,KAAK,sBAAoBd,OAD3B;AAEE,IAAA,EAAE,EAAEI,OAFN;AAGE,IAAA,GAAG,EAAEH,SAAS,uCAAmCD,OAAnC,eAAoDC,SAApD,uCAAkGD,OAHlH;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,WAAW,EAAE,KALf;AAME,IAAA,UAAU,EAAE,IANd;AAOE,IAAA,SAAS,EAAE,KAPb;AAQE,IAAA,KAAK,EAAC,MARR;AASE,IAAA,KAAK,EAAE;AACLe,MAAAA,MAAM,EAAE;AADH;AATT,IADF;AAeD,CAnCD;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-famewall",
3
- "version": "0.1.3",
3
+ "version": "0.1.6",
4
4
  "description": "React Component for Famewall Embeds",
5
5
  "author": "Goutham J <goutham@famewall.io>",
6
6
  "license": "MIT",