react-famewall 0.1.10 → 1.0.3

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 +81 -81
  2. package/dist/index.js +91 -25
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.modern.js +91 -25
  5. package/dist/index.modern.js.map +1 -1
  6. package/package.json +53 -54
package/README.md CHANGED
@@ -1,81 +1,81 @@
1
- # react-famewall
2
-
3
- [![npm](https://img.shields.io/npm/v/react-famewall)](https://www.npmjs.com/package/react-famewall)
4
-
5
- > React component for Famewall Embeds
6
-
7
- Highlight and display social media mentions as beautiful testimonials. Enjoy the fame you receive from customers by [signing up here](https://famewall.io).
8
-
9
- ## Install
10
-
11
- ```bash
12
- npm install --save react-famewall
13
- ```
14
-
15
- ## Basic Usage
16
-
17
- ```jsx
18
- import React from 'react'
19
- import FamewallEmbed from 'react-famewall'
20
-
21
- const App = () => {
22
-
23
- return(
24
- <FamewallEmbed
25
- wallUrl="famewall"
26
- />
27
- )
28
- }
29
- ```
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
-
61
- ## Carousel Embed
62
-
63
- Use 'carouselMode' prop to enable testimonials to be displayed as a carousel
64
-
65
- ```jsx
66
-
67
- const App = () => {
68
-
69
- return(
70
- <FamewallEmbed
71
- wallUrl="famewall"
72
- cardTheme="dark"
73
- carouselMode={true}
74
- />
75
- )
76
- }
77
- ```
78
-
79
- ## License
80
-
81
- MIT ©2021 [Famewall](https://famewall.io)
1
+ # react-famewall
2
+
3
+ [![npm](https://img.shields.io/npm/v/react-famewall)](https://www.npmjs.com/package/react-famewall)
4
+
5
+ > React component for Famewall Embeds
6
+
7
+ Highlight and display social media mentions as beautiful testimonials. Enjoy the fame you receive from customers by [signing up here](https://famewall.io).
8
+
9
+ ## Install
10
+
11
+ ```bash
12
+ npm install --save react-famewall
13
+ ```
14
+
15
+ ## Basic Usage
16
+
17
+ ```jsx
18
+ import React from 'react'
19
+ import FamewallEmbed from 'react-famewall'
20
+
21
+ const App = () => {
22
+
23
+ return(
24
+ <FamewallEmbed
25
+ wallUrl="famewall"
26
+ />
27
+ )
28
+ }
29
+ ```
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
+
61
+ ## Carousel Embed
62
+
63
+ Use 'carouselMode' prop to enable testimonials to be displayed as a carousel
64
+
65
+ ```jsx
66
+
67
+ const App = () => {
68
+
69
+ return(
70
+ <FamewallEmbed
71
+ wallUrl="famewall"
72
+ cardTheme="dark"
73
+ carouselMode={true}
74
+ />
75
+ )
76
+ }
77
+ ```
78
+
79
+ ## License
80
+
81
+ MIT ©2021 [Famewall](https://famewall.io)
package/dist/index.js CHANGED
@@ -1,37 +1,103 @@
1
1
  function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
2
2
 
3
3
  var React = _interopDefault(require('react'));
4
- var IframeResizer = _interopDefault(require('iframe-resizer-react'));
5
4
  var nanoid = require('nanoid');
6
5
 
7
- var FamewallEmbed = function FamewallEmbed(_ref) {
8
- var wallUrl = _ref.wallUrl,
9
- cardTheme = _ref.cardTheme,
10
- _ref$carouselMode = _ref.carouselMode,
11
- carouselMode = _ref$carouselMode === void 0 ? false : _ref$carouselMode;
6
+ function _inheritsLoose(subClass, superClass) {
7
+ subClass.prototype = Object.create(superClass.prototype);
8
+ subClass.prototype.constructor = subClass;
12
9
 
13
- if (!wallUrl) {
14
- console.error('Wall URL is required');
15
- return null;
10
+ _setPrototypeOf(subClass, superClass);
11
+ }
12
+
13
+ function _setPrototypeOf(o, p) {
14
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
15
+ o.__proto__ = p;
16
+ return o;
17
+ };
18
+
19
+ return _setPrototypeOf(o, p);
20
+ }
21
+
22
+ var FamewallEmbed = /*#__PURE__*/function (_React$Component) {
23
+ _inheritsLoose(FamewallEmbed, _React$Component);
24
+
25
+ function FamewallEmbed(props) {
26
+ var _this;
27
+
28
+ _this = _React$Component.call(this, props) || this;
29
+ _this.state = {
30
+ embedId: ''
31
+ };
32
+ return _this;
16
33
  }
17
34
 
18
- var embedId = nanoid.nanoid();
19
- return /*#__PURE__*/React.createElement(IframeResizer, {
20
- title: "Famewall Embed " + wallUrl,
21
- id: embedId,
22
- src: cardTheme ? "https://wallembed.famewall.io/" + (!carouselMode ? 'wall' : 'carousel') + "/" + wallUrl + "?theme=" + cardTheme : "https://wallembed.famewall.io/" + (!carouselMode ? 'wall' : 'carousel') + "/" + wallUrl,
23
- frameBorder: "0",
24
- checkOrigin: false,
25
- autoResize: true,
26
- scrolling: "no",
27
- width: "100%",
28
- style: {
29
- border: 0,
30
- width: '1px',
31
- minWidth: '100%'
35
+ var _proto = FamewallEmbed.prototype;
36
+
37
+ _proto.componentDidMount = function componentDidMount() {
38
+ if (!this.props.wallUrl) {
39
+ console.error('Wall URL is required');
40
+ return null;
32
41
  }
33
- });
34
- };
42
+
43
+ var s = document.createElement('script');
44
+ s.type = 'text/javascript';
45
+ s.defer = true;
46
+ s.src = "https://embed.famewall.io/frame.js";
47
+ this.instance.appendChild(s);
48
+ var embedId = nanoid.nanoid();
49
+ this.setState({
50
+ embedId: embedId
51
+ });
52
+ };
53
+
54
+ _proto.render = function render() {
55
+ var _this2 = this;
56
+
57
+ var _this$props = this.props,
58
+ wallUrl = _this$props.wallUrl,
59
+ cardTheme = _this$props.cardTheme,
60
+ carouselMode = _this$props.carouselMode;
61
+
62
+ if (cardTheme === "dark") {
63
+ return /*#__PURE__*/React.createElement("div", {
64
+ ref: function ref(el) {
65
+ return _this2.instance = el;
66
+ },
67
+ style: {
68
+ width: '100%',
69
+ height: '100%'
70
+ }
71
+ }, /*#__PURE__*/React.createElement("div", {
72
+ className: "famewall-embed",
73
+ "data-src": wallUrl,
74
+ "data-format": !carouselMode ? "grid" : "carousel",
75
+ "data-theme": 'dark',
76
+ style: {
77
+ width: "100%"
78
+ }
79
+ }));
80
+ } else return /*#__PURE__*/React.createElement("div", {
81
+ ref: function ref(el) {
82
+ return _this2.instance = el;
83
+ },
84
+ style: {
85
+ width: '100%',
86
+ height: '100%'
87
+ }
88
+ }, /*#__PURE__*/React.createElement("div", {
89
+ className: "famewall-embed",
90
+ "data-src": wallUrl,
91
+ "data-format": !carouselMode ? "grid" : "carousel",
92
+ "data-theme": 'light',
93
+ style: {
94
+ width: "100%"
95
+ }
96
+ }));
97
+ };
98
+
99
+ return FamewallEmbed;
100
+ }(React.Component);
35
101
 
36
102
  module.exports = FamewallEmbed;
37
103
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/index.js"],"sourcesContent":["import React from 'react'\r\nimport IframeResizer from 'iframe-resizer-react'\r\nimport {nanoid} from 'nanoid'\r\n\r\nconst FamewallEmbed = ({ wallUrl, cardTheme, carouselMode=false }) => {\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 return (\r\n <IframeResizer\r\n title={`Famewall Embed ${wallUrl}`}\r\n id={embedId}\r\n src={cardTheme?`https://wallembed.famewall.io/${!carouselMode?'wall':'carousel'}/${wallUrl}?theme=${cardTheme}`:`https://wallembed.famewall.io/${!carouselMode?'wall':'carousel'}/${wallUrl}`}\r\n frameBorder='0'\r\n checkOrigin={false}\r\n autoResize={true}\r\n scrolling=\"no\"\r\n width='100%'\r\n style={{\r\n border: 0,\r\n width: '1px',\r\n minWidth: '100%'\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","wallUrl","cardTheme","carouselMode","console","error","embedId","nanoid","border","width","minWidth"],"mappings":";;;;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAAgD;AAAA,MAA7CC,OAA6C,QAA7CA,OAA6C;AAAA,MAApCC,SAAoC,QAApCA,SAAoC;AAAA,+BAAzBC,YAAyB;AAAA,MAAzBA,YAAyB,kCAAZ,KAAY;;AACpE,MAAI,CAACF,OAAL,EAAc;AACZG,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,aAAM,EAAtB;AAEA,sBACE,oBAAC,aAAD;AACE,IAAA,KAAK,sBAAoBN,OAD3B;AAEE,IAAA,EAAE,EAAEK,OAFN;AAGE,IAAA,GAAG,EAAEJ,SAAS,uCAAkC,CAACC,YAAD,GAAc,MAAd,GAAqB,UAAvD,UAAqEF,OAArE,eAAsFC,SAAtF,uCAAmI,CAACC,YAAD,GAAc,MAAd,GAAqB,UAAxJ,UAAsKF,OAHtL;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,WAAW,EAAE,KALf;AAME,IAAA,UAAU,EAAE,IANd;AAOE,IAAA,SAAS,EAAC,IAPZ;AAQE,IAAA,KAAK,EAAC,MARR;AASE,IAAA,KAAK,EAAE;AACLO,MAAAA,MAAM,EAAE,CADH;AAELC,MAAAA,KAAK,EAAE,KAFF;AAGLC,MAAAA,QAAQ,EAAE;AAHL;AATT,IADF;AAiBD,CAxBD;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../src/index.js"],"sourcesContent":["import React from 'react'\r\nimport { nanoid } from 'nanoid'\r\n\r\nclass FamewallEmbed extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = { embedId: '' };\r\n }\r\n\r\n componentDidMount() {\r\n if (!this.props.wallUrl) {\r\n console.error('Wall URL is required')\r\n return null\r\n }\r\n\r\n const s = document.createElement('script');\r\n s.type = 'text/javascript';\r\n s.defer = true\r\n s.src = \"https://embed.famewall.io/frame.js\";\r\n this.instance.appendChild(s);\r\n \r\n const embedId = nanoid();\r\n this.setState({ embedId: embedId });\r\n }\r\n\r\n render() {\r\n\r\n const { wallUrl, cardTheme, carouselMode } = this.props;\r\n\r\n if(cardTheme===\"dark\"){\r\n return (\r\n <div ref={el => (this.instance = el)} style={{width:'100%', height:'100%'}}>\r\n <div className=\"famewall-embed\" data-src={wallUrl} data-format={!carouselMode?\"grid\":\"carousel\"} data-theme={'dark'} style={{ width: \"100%\" }}></div>\r\n </div>\r\n \r\n )\r\n }\r\n else\r\n return (\r\n <div ref={el => (this.instance = el)} style={{width:'100%', height:'100%'}}>\r\n <div className=\"famewall-embed\" data-src={wallUrl} data-format={!carouselMode?\"grid\":\"carousel\"} data-theme={'light'} style={{ width: \"100%\" }}></div>\r\n </div>\r\n\r\n )\r\n }\r\n}\r\n\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","props","state","embedId","componentDidMount","wallUrl","console","error","s","document","createElement","type","defer","src","instance","appendChild","nanoid","setState","render","cardTheme","carouselMode","el","width","height","React","Component"],"mappings":";;;;;;;;;;;;;;;;;;;;;IAGMA;;;AAEJ,yBAAYC,KAAZ,EAAmB;AAAA;;AACjB,wCAAMA,KAAN;AACA,UAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE;AAAX,KAAb;AAFiB;AAGlB;;;;SAEDC,oBAAA,6BAAoB;AAClB,QAAI,CAAC,KAAKH,KAAL,CAAWI,OAAhB,EAAyB;AACvBC,MAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,aAAO,IAAP;AACD;;AAED,QAAMC,CAAC,GAAGC,QAAQ,CAACC,aAAT,CAAuB,QAAvB,CAAV;AACAF,IAAAA,CAAC,CAACG,IAAF,GAAS,iBAAT;AACAH,IAAAA,CAAC,CAACI,KAAF,GAAU,IAAV;AACAJ,IAAAA,CAAC,CAACK,GAAF,GAAQ,oCAAR;AACA,SAAKC,QAAL,CAAcC,WAAd,CAA0BP,CAA1B;AAEA,QAAML,OAAO,GAAGa,aAAM,EAAtB;AACA,SAAKC,QAAL,CAAc;AAAEd,MAAAA,OAAO,EAAEA;AAAX,KAAd;AACD;;SAEDe,SAAA,kBAAS;AAAA;;AAEP,sBAA6C,KAAKjB,KAAlD;AAAA,QAAQI,OAAR,eAAQA,OAAR;AAAA,QAAiBc,SAAjB,eAAiBA,SAAjB;AAAA,QAA4BC,YAA5B,eAA4BA,YAA5B;;AAEA,QAAGD,SAAS,KAAG,MAAf,EAAsB;AACpB,0BACE;AAAK,QAAA,GAAG,EAAE,aAAAE,EAAE;AAAA,iBAAK,MAAI,CAACP,QAAL,GAAgBO,EAArB;AAAA,SAAZ;AAAsC,QAAA,KAAK,EAAE;AAACC,UAAAA,KAAK,EAAC,MAAP;AAAeC,UAAAA,MAAM,EAAC;AAAtB;AAA7C,sBACE;AAAK,QAAA,SAAS,EAAC,gBAAf;AAAgC,oBAAUlB,OAA1C;AAAmD,uBAAa,CAACe,YAAD,GAAc,MAAd,GAAqB,UAArF;AAAiG,sBAAY,MAA7G;AAAqH,QAAA,KAAK,EAAE;AAAEE,UAAAA,KAAK,EAAE;AAAT;AAA5H,QADF,CADF;AAMD,KAPD,MASA,oBACE;AAAK,MAAA,GAAG,EAAE,aAAAD,EAAE;AAAA,eAAK,MAAI,CAACP,QAAL,GAAgBO,EAArB;AAAA,OAAZ;AAAsC,MAAA,KAAK,EAAE;AAACC,QAAAA,KAAK,EAAC,MAAP;AAAeC,QAAAA,MAAM,EAAC;AAAtB;AAA7C,oBACE;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAgC,kBAAUlB,OAA1C;AAAmD,qBAAa,CAACe,YAAD,GAAc,MAAd,GAAqB,UAArF;AAAiG,oBAAY,OAA7G;AAAsH,MAAA,KAAK,EAAE;AAAEE,QAAAA,KAAK,EAAE;AAAT;AAA7H,MADF,CADF;AAMD;;;EA1CyBE,KAAK,CAACC;;;;"}
package/dist/index.modern.js CHANGED
@@ -1,35 +1,101 @@
1
1
  import React from 'react';
2
- import IframeResizer from 'iframe-resizer-react';
3
2
  import { nanoid } from 'nanoid';
4
3
 
5
- var FamewallEmbed = function FamewallEmbed(_ref) {
6
- var wallUrl = _ref.wallUrl,
7
- cardTheme = _ref.cardTheme,
8
- _ref$carouselMode = _ref.carouselMode,
9
- carouselMode = _ref$carouselMode === void 0 ? false : _ref$carouselMode;
4
+ function _inheritsLoose(subClass, superClass) {
5
+ subClass.prototype = Object.create(superClass.prototype);
6
+ subClass.prototype.constructor = subClass;
10
7
 
11
- if (!wallUrl) {
12
- console.error('Wall URL is required');
13
- return null;
8
+ _setPrototypeOf(subClass, superClass);
9
+ }
10
+
11
+ function _setPrototypeOf(o, p) {
12
+ _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
13
+ o.__proto__ = p;
14
+ return o;
15
+ };
16
+
17
+ return _setPrototypeOf(o, p);
18
+ }
19
+
20
+ var FamewallEmbed = /*#__PURE__*/function (_React$Component) {
21
+ _inheritsLoose(FamewallEmbed, _React$Component);
22
+
23
+ function FamewallEmbed(props) {
24
+ var _this;
25
+
26
+ _this = _React$Component.call(this, props) || this;
27
+ _this.state = {
28
+ embedId: ''
29
+ };
30
+ return _this;
14
31
  }
15
32
 
16
- var embedId = nanoid();
17
- return /*#__PURE__*/React.createElement(IframeResizer, {
18
- title: "Famewall Embed " + wallUrl,
19
- id: embedId,
20
- src: cardTheme ? "https://wallembed.famewall.io/" + (!carouselMode ? 'wall' : 'carousel') + "/" + wallUrl + "?theme=" + cardTheme : "https://wallembed.famewall.io/" + (!carouselMode ? 'wall' : 'carousel') + "/" + wallUrl,
21
- frameBorder: "0",
22
- checkOrigin: false,
23
- autoResize: true,
24
- scrolling: "no",
25
- width: "100%",
26
- style: {
27
- border: 0,
28
- width: '1px',
29
- minWidth: '100%'
33
+ var _proto = FamewallEmbed.prototype;
34
+
35
+ _proto.componentDidMount = function componentDidMount() {
36
+ if (!this.props.wallUrl) {
37
+ console.error('Wall URL is required');
38
+ return null;
30
39
  }
31
- });
32
- };
40
+
41
+ var s = document.createElement('script');
42
+ s.type = 'text/javascript';
43
+ s.defer = true;
44
+ s.src = "https://embed.famewall.io/frame.js";
45
+ this.instance.appendChild(s);
46
+ var embedId = nanoid();
47
+ this.setState({
48
+ embedId: embedId
49
+ });
50
+ };
51
+
52
+ _proto.render = function render() {
53
+ var _this2 = this;
54
+
55
+ var _this$props = this.props,
56
+ wallUrl = _this$props.wallUrl,
57
+ cardTheme = _this$props.cardTheme,
58
+ carouselMode = _this$props.carouselMode;
59
+
60
+ if (cardTheme === "dark") {
61
+ return /*#__PURE__*/React.createElement("div", {
62
+ ref: function ref(el) {
63
+ return _this2.instance = el;
64
+ },
65
+ style: {
66
+ width: '100%',
67
+ height: '100%'
68
+ }
69
+ }, /*#__PURE__*/React.createElement("div", {
70
+ className: "famewall-embed",
71
+ "data-src": wallUrl,
72
+ "data-format": !carouselMode ? "grid" : "carousel",
73
+ "data-theme": 'dark',
74
+ style: {
75
+ width: "100%"
76
+ }
77
+ }));
78
+ } else return /*#__PURE__*/React.createElement("div", {
79
+ ref: function ref(el) {
80
+ return _this2.instance = el;
81
+ },
82
+ style: {
83
+ width: '100%',
84
+ height: '100%'
85
+ }
86
+ }, /*#__PURE__*/React.createElement("div", {
87
+ className: "famewall-embed",
88
+ "data-src": wallUrl,
89
+ "data-format": !carouselMode ? "grid" : "carousel",
90
+ "data-theme": 'light',
91
+ style: {
92
+ width: "100%"
93
+ }
94
+ }));
95
+ };
96
+
97
+ return FamewallEmbed;
98
+ }(React.Component);
33
99
 
34
100
  export default FamewallEmbed;
35
101
  //# sourceMappingURL=index.modern.js.map
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'\r\nimport IframeResizer from 'iframe-resizer-react'\r\nimport {nanoid} from 'nanoid'\r\n\r\nconst FamewallEmbed = ({ wallUrl, cardTheme, carouselMode=false }) => {\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 return (\r\n <IframeResizer\r\n title={`Famewall Embed ${wallUrl}`}\r\n id={embedId}\r\n src={cardTheme?`https://wallembed.famewall.io/${!carouselMode?'wall':'carousel'}/${wallUrl}?theme=${cardTheme}`:`https://wallembed.famewall.io/${!carouselMode?'wall':'carousel'}/${wallUrl}`}\r\n frameBorder='0'\r\n checkOrigin={false}\r\n autoResize={true}\r\n scrolling=\"no\"\r\n width='100%'\r\n style={{\r\n border: 0,\r\n width: '1px',\r\n minWidth: '100%'\r\n }}\r\n />\r\n )\r\n}\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","wallUrl","cardTheme","carouselMode","console","error","embedId","nanoid","border","width","minWidth"],"mappings":";;;;AAIA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,OAAgD;AAAA,MAA7CC,OAA6C,QAA7CA,OAA6C;AAAA,MAApCC,SAAoC,QAApCA,SAAoC;AAAA,+BAAzBC,YAAyB;AAAA,MAAzBA,YAAyB,kCAAZ,KAAY;;AACpE,MAAI,CAACF,OAAL,EAAc;AACZG,IAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,WAAO,IAAP;AACD;;AACD,MAAMC,OAAO,GAAGC,MAAM,EAAtB;AAEA,sBACE,oBAAC,aAAD;AACE,IAAA,KAAK,sBAAoBN,OAD3B;AAEE,IAAA,EAAE,EAAEK,OAFN;AAGE,IAAA,GAAG,EAAEJ,SAAS,uCAAkC,CAACC,YAAD,GAAc,MAAd,GAAqB,UAAvD,UAAqEF,OAArE,eAAsFC,SAAtF,uCAAmI,CAACC,YAAD,GAAc,MAAd,GAAqB,UAAxJ,UAAsKF,OAHtL;AAIE,IAAA,WAAW,EAAC,GAJd;AAKE,IAAA,WAAW,EAAE,KALf;AAME,IAAA,UAAU,EAAE,IANd;AAOE,IAAA,SAAS,EAAC,IAPZ;AAQE,IAAA,KAAK,EAAC,MARR;AASE,IAAA,KAAK,EAAE;AACLO,MAAAA,MAAM,EAAE,CADH;AAELC,MAAAA,KAAK,EAAE,KAFF;AAGLC,MAAAA,QAAQ,EAAE;AAHL;AATT,IADF;AAiBD,CAxBD;;;;"}
1
+ {"version":3,"file":"index.modern.js","sources":["../src/index.js"],"sourcesContent":["import React from 'react'\r\nimport { nanoid } from 'nanoid'\r\n\r\nclass FamewallEmbed extends React.Component {\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = { embedId: '' };\r\n }\r\n\r\n componentDidMount() {\r\n if (!this.props.wallUrl) {\r\n console.error('Wall URL is required')\r\n return null\r\n }\r\n\r\n const s = document.createElement('script');\r\n s.type = 'text/javascript';\r\n s.defer = true\r\n s.src = \"https://embed.famewall.io/frame.js\";\r\n this.instance.appendChild(s);\r\n \r\n const embedId = nanoid();\r\n this.setState({ embedId: embedId });\r\n }\r\n\r\n render() {\r\n\r\n const { wallUrl, cardTheme, carouselMode } = this.props;\r\n\r\n if(cardTheme===\"dark\"){\r\n return (\r\n <div ref={el => (this.instance = el)} style={{width:'100%', height:'100%'}}>\r\n <div className=\"famewall-embed\" data-src={wallUrl} data-format={!carouselMode?\"grid\":\"carousel\"} data-theme={'dark'} style={{ width: \"100%\" }}></div>\r\n </div>\r\n \r\n )\r\n }\r\n else\r\n return (\r\n <div ref={el => (this.instance = el)} style={{width:'100%', height:'100%'}}>\r\n <div className=\"famewall-embed\" data-src={wallUrl} data-format={!carouselMode?\"grid\":\"carousel\"} data-theme={'light'} style={{ width: \"100%\" }}></div>\r\n </div>\r\n\r\n )\r\n }\r\n}\r\n\r\n\r\nexport default FamewallEmbed\r\n"],"names":["FamewallEmbed","props","state","embedId","componentDidMount","wallUrl","console","error","s","document","createElement","type","defer","src","instance","appendChild","nanoid","setState","render","cardTheme","carouselMode","el","width","height","React","Component"],"mappings":";;;;;;;;;;;;;;;;;;;IAGMA;;;AAEJ,yBAAYC,KAAZ,EAAmB;AAAA;;AACjB,wCAAMA,KAAN;AACA,UAAKC,KAAL,GAAa;AAAEC,MAAAA,OAAO,EAAE;AAAX,KAAb;AAFiB;AAGlB;;;;SAEDC,oBAAA,6BAAoB;AAClB,QAAI,CAAC,KAAKH,KAAL,CAAWI,OAAhB,EAAyB;AACvBC,MAAAA,OAAO,CAACC,KAAR,CAAc,sBAAd;AACA,aAAO,IAAP;AACD;;AAED,QAAMC,CAAC,GAAGC,QAAQ,CAACC,aAAT,CAAuB,QAAvB,CAAV;AACAF,IAAAA,CAAC,CAACG,IAAF,GAAS,iBAAT;AACAH,IAAAA,CAAC,CAACI,KAAF,GAAU,IAAV;AACAJ,IAAAA,CAAC,CAACK,GAAF,GAAQ,oCAAR;AACA,SAAKC,QAAL,CAAcC,WAAd,CAA0BP,CAA1B;AAEA,QAAML,OAAO,GAAGa,MAAM,EAAtB;AACA,SAAKC,QAAL,CAAc;AAAEd,MAAAA,OAAO,EAAEA;AAAX,KAAd;AACD;;SAEDe,SAAA,kBAAS;AAAA;;AAEP,sBAA6C,KAAKjB,KAAlD;AAAA,QAAQI,OAAR,eAAQA,OAAR;AAAA,QAAiBc,SAAjB,eAAiBA,SAAjB;AAAA,QAA4BC,YAA5B,eAA4BA,YAA5B;;AAEA,QAAGD,SAAS,KAAG,MAAf,EAAsB;AACpB,0BACE;AAAK,QAAA,GAAG,EAAE,aAAAE,EAAE;AAAA,iBAAK,MAAI,CAACP,QAAL,GAAgBO,EAArB;AAAA,SAAZ;AAAsC,QAAA,KAAK,EAAE;AAACC,UAAAA,KAAK,EAAC,MAAP;AAAeC,UAAAA,MAAM,EAAC;AAAtB;AAA7C,sBACE;AAAK,QAAA,SAAS,EAAC,gBAAf;AAAgC,oBAAUlB,OAA1C;AAAmD,uBAAa,CAACe,YAAD,GAAc,MAAd,GAAqB,UAArF;AAAiG,sBAAY,MAA7G;AAAqH,QAAA,KAAK,EAAE;AAAEE,UAAAA,KAAK,EAAE;AAAT;AAA5H,QADF,CADF;AAMD,KAPD,MASA,oBACE;AAAK,MAAA,GAAG,EAAE,aAAAD,EAAE;AAAA,eAAK,MAAI,CAACP,QAAL,GAAgBO,EAArB;AAAA,OAAZ;AAAsC,MAAA,KAAK,EAAE;AAACC,QAAAA,KAAK,EAAC,MAAP;AAAeC,QAAAA,MAAM,EAAC;AAAtB;AAA7C,oBACE;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAgC,kBAAUlB,OAA1C;AAAmD,qBAAa,CAACe,YAAD,GAAc,MAAd,GAAqB,UAArF;AAAiG,oBAAY,OAA7G;AAAsH,MAAA,KAAK,EAAE;AAAEE,QAAAA,KAAK,EAAE;AAAT;AAA7H,MADF,CADF;AAMD;;;EA1CyBE,KAAK,CAACC;;;;"}
package/package.json CHANGED
@@ -1,54 +1,53 @@
1
- {
2
- "name": "react-famewall",
3
- "version": "0.1.10",
4
- "description": "React Component for Famewall Embeds",
5
- "author": "Goutham J <goutham@famewall.io>",
6
- "license": "MIT",
7
- "repository": "gouterz/react-famewall",
8
- "main": "dist/index.js",
9
- "module": "dist/index.modern.js",
10
- "source": "src/index.js",
11
- "engines": {
12
- "node": ">=10"
13
- },
14
- "scripts": {
15
- "build": "microbundle-crl --no-compress --format modern,cjs",
16
- "start": "microbundle-crl watch --no-compress --format modern,cjs",
17
- "prepare": "run-s build",
18
- "predeploy": "cd example && npm install && npm run build",
19
- "deploy": "gh-pages -d example/build"
20
- },
21
- "peerDependencies": {
22
- "react": "^16.0.0"
23
- },
24
- "devDependencies": {
25
- "babel-eslint": "^10.0.3",
26
- "cross-env": "^7.0.2",
27
- "eslint": "^6.8.0",
28
- "eslint-config-prettier": "^6.7.0",
29
- "eslint-config-standard": "^14.1.0",
30
- "eslint-config-standard-react": "^9.2.0",
31
- "eslint-plugin-import": "^2.18.2",
32
- "eslint-plugin-node": "^11.0.0",
33
- "eslint-plugin-prettier": "^3.1.1",
34
- "eslint-plugin-promise": "^4.2.1",
35
- "eslint-plugin-react": "^7.17.0",
36
- "eslint-plugin-standard": "^4.0.1",
37
- "gh-pages": "^2.2.0",
38
- "microbundle-crl": "^0.13.10",
39
- "npm-run-all": "^4.1.5",
40
- "prettier": "^2.0.4",
41
- "react": "^16.13.1",
42
- "react-dom": "^16.13.1",
43
- "react-scripts": "^3.4.1"
44
- },
45
- "files": [
46
- "dist"
47
- ],
48
- "dependencies": {
49
- "debug": "^4.2.0",
50
- "iframe-resizer-react": "^1.1.0",
51
- "nanoid": "^3.3.1",
52
- "prop-types": "^15.6.2"
53
- }
54
- }
1
+ {
2
+ "name": "react-famewall",
3
+ "version": "1.0.3",
4
+ "description": "React Component for Famewall Embeds",
5
+ "author": "Goutham J <goutham@famewall.io>",
6
+ "license": "MIT",
7
+ "repository": "gouterz/react-famewall",
8
+ "main": "dist/index.js",
9
+ "module": "dist/index.modern.js",
10
+ "source": "src/index.js",
11
+ "engines": {
12
+ "node": ">=10"
13
+ },
14
+ "scripts": {
15
+ "build": "microbundle-crl --no-compress --format modern,cjs",
16
+ "start": "microbundle-crl watch --no-compress --format modern,cjs",
17
+ "prepare": "run-s build",
18
+ "predeploy": "cd example && npm install && npm run build",
19
+ "deploy": "gh-pages -d example/build"
20
+ },
21
+ "peerDependencies": {
22
+ "react": "^16.0.0"
23
+ },
24
+ "devDependencies": {
25
+ "babel-eslint": "^10.0.3",
26
+ "cross-env": "^7.0.2",
27
+ "eslint": "^6.8.0",
28
+ "eslint-config-prettier": "^6.7.0",
29
+ "eslint-config-standard": "^14.1.0",
30
+ "eslint-config-standard-react": "^9.2.0",
31
+ "eslint-plugin-import": "^2.18.2",
32
+ "eslint-plugin-node": "^11.0.0",
33
+ "eslint-plugin-prettier": "^3.1.1",
34
+ "eslint-plugin-promise": "^4.2.1",
35
+ "eslint-plugin-react": "^7.17.0",
36
+ "eslint-plugin-standard": "^4.0.1",
37
+ "gh-pages": "^2.2.0",
38
+ "microbundle-crl": "^0.13.10",
39
+ "npm-run-all": "^4.1.5",
40
+ "prettier": "^2.0.4",
41
+ "react": "^16.13.1",
42
+ "react-dom": "^16.13.1",
43
+ "react-scripts": "^3.4.1"
44
+ },
45
+ "files": [
46
+ "dist"
47
+ ],
48
+ "dependencies": {
49
+ "debug": "^4.2.0",
50
+ "nanoid": "^3.3.1",
51
+ "prop-types": "^15.6.2"
52
+ }
53
+ }