1 | "use strict";
|
2 | var __extends = (this && this.__extends) || (function () {
|
3 | var extendStatics = function (d, b) {
|
4 | extendStatics = Object.setPrototypeOf ||
|
5 | ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
|
6 | function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
|
7 | return extendStatics(d, b);
|
8 | };
|
9 | return function (d, b) {
|
10 | extendStatics(d, b);
|
11 | function __() { this.constructor = d; }
|
12 | d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
|
13 | };
|
14 | })();
|
15 | var __assign = (this && this.__assign) || function () {
|
16 | __assign = Object.assign || function(t) {
|
17 | for (var s, i = 1, n = arguments.length; i < n; i++) {
|
18 | s = arguments[i];
|
19 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
20 | t[p] = s[p];
|
21 | }
|
22 | return t;
|
23 | };
|
24 | return __assign.apply(this, arguments);
|
25 | };
|
26 | var __rest = (this && this.__rest) || function (s, e) {
|
27 | var t = {};
|
28 | for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
29 | t[p] = s[p];
|
30 | if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
31 | for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)
|
32 | t[p[i]] = s[p[i]];
|
33 | return t;
|
34 | };
|
35 | var __importDefault = (this && this.__importDefault) || function (mod) {
|
36 | return (mod && mod.__esModule) ? mod : { "default": mod };
|
37 | };
|
38 | Object.defineProperty(exports, "__esModule", { value: true });
|
39 | var react_1 = __importDefault(require("react"));
|
40 | var app_bridge_1 = require("@shopify/app-bridge");
|
41 |
|
42 |
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 | var Frame = (function (_super) {
|
49 | __extends(Frame, _super);
|
50 | function Frame(props) {
|
51 | var _this = _super.call(this, props) || this;
|
52 | _this.src = props.url;
|
53 | return _this;
|
54 | }
|
55 | Frame.prototype.componentDidMount = function () {
|
56 | var _a = this.props, context = _a.context, onInit = _a.onInit, url = _a.url;
|
57 | var frameOrigin = new URL(url).origin;
|
58 | if (!this.iframe) {
|
59 | return;
|
60 | }
|
61 | var transport = app_bridge_1.fromFrame(this.iframe, frameOrigin, context);
|
62 | this.detach = this.props.app.attach(transport);
|
63 | if (!onInit) {
|
64 | return;
|
65 | }
|
66 | onInit(this);
|
67 | };
|
68 | Frame.prototype.componentWillUnmount = function () {
|
69 | if (this.detach) {
|
70 | this.detach();
|
71 | }
|
72 | };
|
73 | Frame.prototype.componentDidUpdate = function (prevProps) {
|
74 | var _a = this.props, url = _a.url, onUrlChange = _a.onUrlChange;
|
75 | if (url !== prevProps.url && onUrlChange && this.iframe) {
|
76 | onUrlChange(this.iframe, url);
|
77 | }
|
78 | };
|
79 | Frame.prototype.render = function () {
|
80 | var _this = this;
|
81 | var _a = this.props, app = _a.app, config = _a.config, title = _a.title, url = _a.url, style = _a.style, onUrlChange = _a.onUrlChange, onInit = _a.onInit, props = __rest(_a, ["app", "config", "title", "url", "style", "onUrlChange", "onInit"]);
|
82 | return (react_1.default.createElement("iframe", __assign({ style: style, title: title, src: this.src }, props, { ref: function (element) { return (element ? (_this.iframe = element) : undefined); } })));
|
83 | };
|
84 | Frame.defaultProps = {
|
85 | context: app_bridge_1.Context.Main,
|
86 | };
|
87 | return Frame;
|
88 | }(react_1.default.Component));
|
89 | exports.default = Frame;
|