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++) {
|
32 | if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
33 | t[p[i]] = s[p[i]];
|
34 | }
|
35 | return t;
|
36 | };
|
37 | var __importDefault = (this && this.__importDefault) || function (mod) {
|
38 | return (mod && mod.__esModule) ? mod : { "default": mod };
|
39 | };
|
40 | Object.defineProperty(exports, "__esModule", { value: true });
|
41 | var react_1 = __importDefault(require("react"));
|
42 | var app_bridge_1 = require("@shopify/app-bridge");
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 |
|
49 |
|
50 | var Frame = (function (_super) {
|
51 | __extends(Frame, _super);
|
52 | function Frame(props) {
|
53 | var _this = _super.call(this, props) || this;
|
54 | _this.src = props.url;
|
55 | return _this;
|
56 | }
|
57 | Frame.prototype.componentDidMount = function () {
|
58 | var _a = this.props, context = _a.context, onInit = _a.onInit, url = _a.url;
|
59 | var frameOrigin = new URL(url).origin;
|
60 | if (!this.iframe) {
|
61 | return;
|
62 | }
|
63 | var transport = app_bridge_1.fromFrame(this.iframe, frameOrigin, context);
|
64 | this.detach = this.props.app.attach(transport);
|
65 | if (!onInit) {
|
66 | return;
|
67 | }
|
68 | onInit(this);
|
69 | };
|
70 | Frame.prototype.componentWillUnmount = function () {
|
71 | if (this.detach) {
|
72 | this.detach();
|
73 | }
|
74 | };
|
75 | Frame.prototype.componentDidUpdate = function (prevProps) {
|
76 | var _a = this.props, url = _a.url, onUrlChange = _a.onUrlChange;
|
77 | if (url !== prevProps.url && onUrlChange && this.iframe) {
|
78 | onUrlChange(this.iframe, url);
|
79 | }
|
80 | };
|
81 | Frame.prototype.render = function () {
|
82 | var _this = this;
|
83 | 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"]);
|
84 | return (react_1.default.createElement("iframe", __assign({ style: style, title: title, src: this.src }, props, { ref: function (element) { return (element ? (_this.iframe = element) : undefined); } })));
|
85 | };
|
86 | Frame.defaultProps = {
|
87 | context: app_bridge_1.Context.Main,
|
88 | };
|
89 | return Frame;
|
90 | }(react_1.default.Component));
|
91 | exports.default = Frame;
|