@storyteq/platform-integration 1.0.0 → 1.0.2
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.
- package/README.md +38 -3
- package/build/classes/CreateMediaPage.d.ts +4 -0
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -52,6 +52,7 @@ const createMediaPage = new StoryteqPlatform.createMediaPage(
|
|
|
52
52
|
1000, // template ID,
|
|
53
53
|
{
|
|
54
54
|
assetManagerScope: [], // Scope the asset selection to a set of asset providers
|
|
55
|
+
notifications: [ {} ], // Will send a notification to the target route upon media status change with the full media object
|
|
55
56
|
publish: [ {} ], // Upon rendering completion, publish to this channel
|
|
56
57
|
},
|
|
57
58
|
);
|
|
@@ -61,6 +62,9 @@ createMediaPage
|
|
|
61
62
|
.on('created', (media) => {
|
|
62
63
|
console.log({ media });
|
|
63
64
|
});
|
|
65
|
+
.on('batch-created', (batch) => {
|
|
66
|
+
console.log({ batch });
|
|
67
|
+
});
|
|
64
68
|
```
|
|
65
69
|
|
|
66
70
|
### CRM Analytics page
|
|
@@ -90,8 +94,15 @@ const createMediaPage = new StoryteqPlatform.createMediaPage(
|
|
|
90
94
|
1000, // template ID,
|
|
91
95
|
{
|
|
92
96
|
assetManagerScope: [], // Scope the asset selection to a set of asset providers
|
|
97
|
+
notifications: [
|
|
98
|
+
{
|
|
99
|
+
type: 'webhook',
|
|
100
|
+
route: 'https://my-webhook-site.com'
|
|
101
|
+
}
|
|
102
|
+
],
|
|
93
103
|
publish: [ {} ], // Upon rendering completion, publish to this channel
|
|
94
104
|
mediaRecreateHash: '11abcaaaa0abcdabcabcabca49abx321',
|
|
105
|
+
// creationType: 'batch', // if left empty, it will default to single media create form
|
|
95
106
|
ui: {
|
|
96
107
|
forceMediaPreviewBeforeCreate: 'always',
|
|
97
108
|
customizationItems: [
|
|
@@ -139,6 +150,9 @@ createMediaPage
|
|
|
139
150
|
.on('created', (media) => {
|
|
140
151
|
console.log({ media });
|
|
141
152
|
});
|
|
153
|
+
.on('batch-created', (batch) => {
|
|
154
|
+
console.log({ batch });
|
|
155
|
+
});
|
|
142
156
|
```
|
|
143
157
|
|
|
144
158
|
#### General configuration Attributes
|
|
@@ -147,6 +161,23 @@ createMediaPage
|
|
|
147
161
|
\
|
|
148
162
|
By setting the value of ```mediaRecreateHash``` to a media hash, all parameter values that was used to create this media will be directly applied in the media create form.
|
|
149
163
|
|
|
164
|
+
##### notifications
|
|
165
|
+
\
|
|
166
|
+
Optional parameter. An array of objects containing two string keys: ```type``` and ```route```. ```type``` should be set to ```'webhook'```, while ```route``` is the webhook url. When set, each time a media/creative has it's rendering status updated, the media body will be send to the webhook. Example:
|
|
167
|
+
|
|
168
|
+
```js
|
|
169
|
+
notifications: [
|
|
170
|
+
{
|
|
171
|
+
type: 'webhook',
|
|
172
|
+
route: 'https://my-webhook-site.com'
|
|
173
|
+
}
|
|
174
|
+
],
|
|
175
|
+
```
|
|
176
|
+
|
|
177
|
+
##### creationType
|
|
178
|
+
\
|
|
179
|
+
Optional parameter. Leaving it empty will result in spwaning the single media creation form. But by setting ```creationType``` to the string value ```batch```, you will instead spawn the batch creation form. This form allows you to create several media in one go.
|
|
180
|
+
|
|
150
181
|
#### UI Configuration Attributes
|
|
151
182
|
|
|
152
183
|
##### forceMediaPreviewBeforeCreate
|
|
@@ -168,20 +199,24 @@ Possible configurations:
|
|
|
168
199
|
|---------------------|------------------------------------------------------------------------------------------------|--------------------------------|
|
|
169
200
|
| host_product_name | Name of your company/product | Free text (string) |
|
|
170
201
|
| media_alias | Alias of media/creative | Free text (string) |
|
|
202
|
+
| media_alias_plural | Alias of media/creative in plural form | Free text (string) |
|
|
203
|
+
| batch_alias | Alias of batch | Free text (string) |
|
|
171
204
|
| button_media_create | Media create button custom description/text | Free text (string) |
|
|
172
|
-
| end_screen_title | Title of the screen indicating a media has been created/published
|
|
173
|
-
| end_screen_subtitle | Subtitle of the screen indicating a media has been created/published
|
|
205
|
+
| end_screen_title | Title of the screen indicating a media or media batch has been created/published | Free text (string) |
|
|
206
|
+
| end_screen_subtitle | Subtitle of the screen indicating a media or media batch has been created/published | Free text (string) |
|
|
174
207
|
| color_theme_hex | Color theme of UI elements such as buttons, loading bars, etc. | Hex code (string) |
|
|
175
208
|
| full_screen | Choice of having the create form cover the whole screen or not | true/false |
|
|
176
209
|
| cancelable | Shows a cancel button on the create media form that will event a 'canceled' event when pressed | true/false (defaults to false) |
|
|
210
|
+
| show_end_screen_for_batches | Showing end screen dialog after creating a batch | true/false (defaults to false) |
|
|
177
211
|
|
|
178
212
|
##### endScreenActions
|
|
179
213
|
\
|
|
180
214
|
```endScreenActions``` is an array of configuration objects that allows you to customize the UI of the 'end screen', by adding certain actions.
|
|
181
|
-
The end screen is what appears after you have initiated the creation/publishing of a media.
|
|
215
|
+
The end screen is what appears after you have initiated the creation/publishing of a media or media batch.
|
|
182
216
|
\
|
|
183
217
|
Possible configurations:
|
|
184
218
|
|
|
185
219
|
| Attribute/Action | Description | Option(s) |
|
|
186
220
|
|----------------------|----------------------------------------------------------------------------|-----------------------------------|
|
|
187
221
|
| create_another_media | By including this, a button will appear that allow you to recreate a media | Free text (string, inside button) |
|
|
222
|
+
| create_another_batch | By including this, a button will appear that allow you to recreate a batch | Free text (string, inside button) |
|
package/build/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","mappings":"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","sources":["webpack://@storyteq/platform-integration/webpack/universalModuleDefinition","webpack://@storyteq/platform-integration/external umd {\"commonjs\":\"lodash-es\",\"commonjs2\":\"lodash-es\",\"amd\":\"lodash-es\",\"root\":\"_\"}","webpack://@storyteq/platform-integration/webpack/bootstrap","webpack://@storyteq/platform-integration/webpack/runtime/define property getters","webpack://@storyteq/platform-integration/webpack/runtime/hasOwnProperty shorthand","webpack://@storyteq/platform-integration/webpack/runtime/make namespace object","webpack://@storyteq/platform-integration/./src/classes/BaseFrameController.ts","webpack://@storyteq/platform-integration/./src/get-frame-url.ts","webpack://@storyteq/platform-integration/./src/classes/CreateMediaPage.ts","webpack://@storyteq/platform-integration/./src/classes/CrmAnalyticsPage.ts"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"lodash-es\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"lodash-es\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"@storyteq/platform-integration\"] = factory(require(\"lodash-es\"));\n\telse\n\t\troot[\"@storyteq/platform-integration\"] = factory(root[\"_\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE__731__) {\nreturn ","module.exports = __WEBPACK_EXTERNAL_MODULE__731__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import { forEach, omit } from 'lodash-es';\nimport { getFrameUrl } from '../get-frame-url';\nimport { OneOf } from '../interfaces/one-of.interface';\n\nexport class BaseFrameController<T extends Array<string>> {\n private _url: URL;\n private _eventListeners: Array<{ event: string; cb: (data: unknown) => void }> = [];\n private _readyForToken = false;\n private _jwtToken: string;\n private _frame: HTMLIFrameElement;\n\n private _readyForTokenCb = () => {\n this._readyForToken = true;\n\n if (this._jwtToken) {\n this.setJwtToken(this._jwtToken);\n this._jwtToken = '';\n }\n };\n\n constructor(\n public readonly spawnElement: string,\n public readonly authToken: string | false,\n uri: string,\n config: string,\n public readonly availableEvents: T,\n extraSearchParams: Record<string, string> = {}\n ) {\n this._url = new URL(uri, getFrameUrl());\n\n const searchParams: Record<string, string> = {\n no_navigation: 'true',\n config: config,\n ...extraSearchParams,\n };\n\n if (authToken) {\n searchParams.auth_token = authToken;\n } else {\n searchParams.auth_via_message = '';\n\n this._eventListeners.push({ event: 'ready_for_token', cb: this._readyForTokenCb });\n }\n\n forEach(searchParams, (value: string, key: string) => {\n this._url.searchParams.set(key, value);\n });\n\n this._init();\n }\n\n private _init(): void {\n if (!['interactive', 'complete'].includes(document.readyState)) {\n document.addEventListener('readystatechange', () => {\n if (['interactive', 'complete'].includes(document.readyState)) this._spawn();\n });\n } else this._spawn();\n }\n\n private _spawn(): void {\n const iframe: HTMLIFrameElement = document.createElement('iframe');\n\n iframe.src = this._url.toString();\n iframe.style.width = '100%';\n iframe.style.height = '100%';\n iframe.style.position = 'absolute';\n iframe.style.border = 'none';\n\n const spawnElement: HTMLElement = document.querySelector(this.spawnElement);\n\n if (!spawnElement) {\n console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`);\n }\n\n spawnElement.style.position = 'relative';\n spawnElement.appendChild(iframe);\n\n this._frame = iframe;\n\n this._initiatePageListeners();\n }\n\n private _receiveMessage = (e: MessageEvent) => {\n if (e.origin === this._url.origin) {\n try {\n const messagePayload = JSON.parse(e.data);\n\n this._eventListeners.forEach(({ event, cb }) => {\n const eventPayload = omit(messagePayload, ['event']);\n\n if (event === messagePayload.event) cb(eventPayload);\n });\n } catch (error) {\n console.error('[Storyteq platform integration] Failed to parse incoming frame message;', e.data);\n }\n }\n };\n\n private _initiatePageListeners(): void {\n window.addEventListener('message', this._receiveMessage, false);\n }\n\n public on(event: OneOf<T>, cb: (data: unknown) => void): this {\n if (!this.availableEvents.includes(event)) {\n console.error(`[Storyteq platform integration] Trying to listen to unsupported event \"${event}\"`);\n }\n\n this._eventListeners.push({\n event,\n cb,\n });\n\n return this;\n }\n\n public sendMessage(message: any): this {\n this._frame.contentWindow.postMessage(message, { targetOrigin: this._url.origin });\n\n return this;\n }\n\n public setJwtToken(token: string): this {\n if (!this._readyForToken) {\n this._jwtToken = token;\n } else {\n this.sendMessage({ type: 'JWT_TOKEN', token });\n }\n\n return this;\n }\n\n public destroy(): void {\n if (!this._frame) {\n return;\n }\n\n window.removeEventListener('message', this._receiveMessage);\n\n this._eventListeners = [];\n\n try {\n this._frame.parentElement.removeChild(this._frame);\n } catch (error) {}\n }\n}\n","export function getFrameUrl() {\n return window.APP_URL ?? 'https://platform.storyteq.com';\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'canceled'] = [\n 'loaded',\n 'created',\n 'batch-created',\n 'canceled',\n];\n\nexport interface ICreateMediaConfig {\n creationType?: 'batch';\n assetManagerScope?: Array<unknown>; // Scope the asset selection to a set of asset providers\n publish?: Array<{ type: string; variant?: string; parameters?: Array<string> }>; // Upon rendering completion, publish to this channel\n mediaRecreateHash?: string;\n ui?: {\n customizationItems?: Array<{ item: string; value: string | boolean }>;\n endScreenActions?: Array<{ action: string; value: string }>;\n forceMediaPreviewBeforeCreate?: 'on_first_render' | 'always';\n }; // Customize the UI\n}\nexport class CreateMediaPage extends BaseFrameController<typeof AVAILABLE_CREATE_MEDIA_EVENTS> {\n constructor(\n spawnElement: string,\n STAuthToken: string | false,\n templateId: number,\n config: ICreateMediaConfig = {},\n companyId?: string\n ) {\n const page = `/integration`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), AVAILABLE_CREATE_MEDIA_EVENTS, {\n company_id: companyId,\n templateId: `${templateId}`,\n });\n }\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport class CrmAnalyticsPage extends BaseFrameController<['loaded']> {\n constructor(spawnElement: string, STAuthToken: string | false, templateId: number, campaignId: number, config?) {\n const page = `/campaigns/${campaignId}/templates/${templateId}`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), ['loaded']);\n }\n}\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__731__","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","BaseFrameController","constructor","spawnElement","authToken","uri","config","availableEvents","extraSearchParams","_eventListeners","_readyForToken","_readyForTokenCb","_jwtToken","setJwtToken","_receiveMessage","e","origin","_url","messagePayload","JSON","parse","data","forEach","event","cb","eventPayload","omit","error","console","URL","window","APP_URL","searchParams","no_navigation","auth_token","auth_via_message","push","set","_init","includes","document","readyState","_spawn","addEventListener","iframe","createElement","src","toString","style","width","height","position","border","querySelector","appendChild","_frame","_initiatePageListeners","on","sendMessage","message","contentWindow","postMessage","targetOrigin","token","type","destroy","removeEventListener","parentElement","removeChild","AVAILABLE_CREATE_MEDIA_EVENTS","CreateMediaPage","STAuthToken","templateId","companyId","super","stringify","company_id","CrmAnalyticsPage","campaignId"],"sourceRoot":""}
|
|
1
|
+
{"version":3,"file":"index.js","mappings":"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","sources":["webpack://@storyteq/platform-integration/webpack/universalModuleDefinition","webpack://@storyteq/platform-integration/external umd {\"commonjs\":\"lodash-es\",\"commonjs2\":\"lodash-es\",\"amd\":\"lodash-es\",\"root\":\"_\"}","webpack://@storyteq/platform-integration/webpack/bootstrap","webpack://@storyteq/platform-integration/webpack/runtime/define property getters","webpack://@storyteq/platform-integration/webpack/runtime/hasOwnProperty shorthand","webpack://@storyteq/platform-integration/webpack/runtime/make namespace object","webpack://@storyteq/platform-integration/./src/classes/BaseFrameController.ts","webpack://@storyteq/platform-integration/./src/get-frame-url.ts","webpack://@storyteq/platform-integration/./src/classes/CreateMediaPage.ts","webpack://@storyteq/platform-integration/./src/classes/CrmAnalyticsPage.ts"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"lodash-es\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"lodash-es\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"@storyteq/platform-integration\"] = factory(require(\"lodash-es\"));\n\telse\n\t\troot[\"@storyteq/platform-integration\"] = factory(root[\"_\"]);\n})(this, function(__WEBPACK_EXTERNAL_MODULE__731__) {\nreturn ","module.exports = __WEBPACK_EXTERNAL_MODULE__731__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId](module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// define getter functions for harmony exports\n__webpack_require__.d = function(exports, definition) {\n\tfor(var key in definition) {\n\t\tif(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {\n\t\t\tObject.defineProperty(exports, key, { enumerable: true, get: definition[key] });\n\t\t}\n\t}\n};","__webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }","// define __esModule on exports\n__webpack_require__.r = function(exports) {\n\tif(typeof Symbol !== 'undefined' && Symbol.toStringTag) {\n\t\tObject.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });\n\t}\n\tObject.defineProperty(exports, '__esModule', { value: true });\n};","import { forEach, omit } from 'lodash-es';\nimport { getFrameUrl } from '../get-frame-url';\nimport { OneOf } from '../interfaces/one-of.interface';\n\nexport class BaseFrameController<T extends Array<string>> {\n private _url: URL;\n private _eventListeners: Array<{ event: string; cb: (data: unknown) => void }> = [];\n private _readyForToken = false;\n private _jwtToken: string;\n private _frame: HTMLIFrameElement;\n\n private _readyForTokenCb = () => {\n this._readyForToken = true;\n\n if (this._jwtToken) {\n this.setJwtToken(this._jwtToken);\n this._jwtToken = '';\n }\n };\n\n constructor(\n public readonly spawnElement: string,\n public readonly authToken: string | false,\n uri: string,\n config: string,\n public readonly availableEvents: T,\n extraSearchParams: Record<string, string> = {}\n ) {\n this._url = new URL(uri, getFrameUrl());\n\n const searchParams: Record<string, string> = {\n no_navigation: 'true',\n config: config,\n ...extraSearchParams,\n };\n\n if (authToken) {\n searchParams.auth_token = authToken;\n } else {\n searchParams.auth_via_message = '';\n\n this._eventListeners.push({ event: 'ready_for_token', cb: this._readyForTokenCb });\n }\n\n forEach(searchParams, (value: string, key: string) => {\n this._url.searchParams.set(key, value);\n });\n\n this._init();\n }\n\n private _init(): void {\n if (!['interactive', 'complete'].includes(document.readyState)) {\n document.addEventListener('readystatechange', () => {\n if (['interactive', 'complete'].includes(document.readyState)) this._spawn();\n });\n } else this._spawn();\n }\n\n private _spawn(): void {\n const iframe: HTMLIFrameElement = document.createElement('iframe');\n\n iframe.src = this._url.toString();\n iframe.style.width = '100%';\n iframe.style.height = '100%';\n iframe.style.position = 'absolute';\n iframe.style.border = 'none';\n\n const spawnElement: HTMLElement = document.querySelector(this.spawnElement);\n\n if (!spawnElement) {\n console.error(`[Storyteq platform integration] Failed to find target element ${this.spawnElement}`);\n }\n\n spawnElement.style.position = 'relative';\n spawnElement.appendChild(iframe);\n\n this._frame = iframe;\n\n this._initiatePageListeners();\n }\n\n private _receiveMessage = (e: MessageEvent) => {\n if (e.origin === this._url.origin) {\n try {\n const messagePayload = JSON.parse(e.data);\n\n this._eventListeners.forEach(({ event, cb }) => {\n const eventPayload = omit(messagePayload, ['event']);\n\n if (event === messagePayload.event) cb(eventPayload);\n });\n } catch (error) {\n console.error('[Storyteq platform integration] Failed to parse incoming frame message;', e.data);\n }\n }\n };\n\n private _initiatePageListeners(): void {\n window.addEventListener('message', this._receiveMessage, false);\n }\n\n public on(event: OneOf<T>, cb: (data: unknown) => void): this {\n if (!this.availableEvents.includes(event)) {\n console.error(`[Storyteq platform integration] Trying to listen to unsupported event \"${event}\"`);\n }\n\n this._eventListeners.push({\n event,\n cb,\n });\n\n return this;\n }\n\n public sendMessage(message: any): this {\n this._frame.contentWindow.postMessage(message, { targetOrigin: this._url.origin });\n\n return this;\n }\n\n public setJwtToken(token: string): this {\n if (!this._readyForToken) {\n this._jwtToken = token;\n } else {\n this.sendMessage({ type: 'JWT_TOKEN', token });\n }\n\n return this;\n }\n\n public destroy(): void {\n if (!this._frame) {\n return;\n }\n\n window.removeEventListener('message', this._receiveMessage);\n\n this._eventListeners = [];\n\n try {\n this._frame.parentElement.removeChild(this._frame);\n } catch (error) {}\n }\n}\n","export function getFrameUrl() {\n return window.APP_URL ?? 'https://platform.storyteq.com';\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport const AVAILABLE_CREATE_MEDIA_EVENTS: ['loaded', 'created', 'batch-created', 'canceled'] = [\n 'loaded',\n 'created',\n 'batch-created',\n 'canceled',\n];\n\nexport interface ICreateMediaConfig {\n creationType?: 'batch';\n assetManagerScope?: Array<unknown>; // Scope the asset selection to a set of asset providers\n publish?: Array<{ type: string; variant?: string; parameters?: Array<string> }>; // Upon rendering completion, publish to this channel\n notifications?: Array<{ type?: string; route?: string }>; // Will send a notification to the target route upon media status change with the full media object\n mediaRecreateHash?: string;\n ui?: {\n customizationItems?: Array<{ item: string; value: string | boolean }>;\n endScreenActions?: Array<{ action: string; value: string }>;\n forceMediaPreviewBeforeCreate?: 'on_first_render' | 'always';\n }; // Customize the UI\n}\nexport class CreateMediaPage extends BaseFrameController<typeof AVAILABLE_CREATE_MEDIA_EVENTS> {\n constructor(\n spawnElement: string,\n STAuthToken: string | false,\n templateId: number,\n config: ICreateMediaConfig = {},\n companyId?: string\n ) {\n const page = `/integration`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), AVAILABLE_CREATE_MEDIA_EVENTS, {\n company_id: companyId,\n templateId: `${templateId}`,\n });\n }\n}\n","import { BaseFrameController } from './BaseFrameController';\n\nexport class CrmAnalyticsPage extends BaseFrameController<['loaded']> {\n constructor(spawnElement: string, STAuthToken: string | false, templateId: number, campaignId: number, config?) {\n const page = `/campaigns/${campaignId}/templates/${templateId}`;\n\n super(spawnElement, STAuthToken, page, JSON.stringify(config), ['loaded']);\n }\n}\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__731__","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","undefined","__webpack_modules__","d","definition","key","o","Object","defineProperty","enumerable","get","obj","prop","prototype","hasOwnProperty","call","r","Symbol","toStringTag","value","BaseFrameController","constructor","spawnElement","authToken","uri","config","availableEvents","extraSearchParams","_eventListeners","_readyForToken","_readyForTokenCb","_jwtToken","setJwtToken","_receiveMessage","e","origin","_url","messagePayload","JSON","parse","data","forEach","event","cb","eventPayload","omit","error","console","URL","window","APP_URL","searchParams","no_navigation","auth_token","auth_via_message","push","set","_init","includes","document","readyState","_spawn","addEventListener","iframe","createElement","src","toString","style","width","height","position","border","querySelector","appendChild","_frame","_initiatePageListeners","on","sendMessage","message","contentWindow","postMessage","targetOrigin","token","type","destroy","removeEventListener","parentElement","removeChild","AVAILABLE_CREATE_MEDIA_EVENTS","CreateMediaPage","STAuthToken","templateId","companyId","super","stringify","company_id","CrmAnalyticsPage","campaignId"],"sourceRoot":""}
|