@getflip/bridge 0.0.0-new-shell-20231128130728
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/LICENSE.md +25 -0
- package/README.md +472 -0
- package/dist/dialog/dialog.d.ts +10 -0
- package/dist/dialog/dialog.js +45 -0
- package/dist/dialog/dialog.js.map +1 -0
- package/dist/dialog/dialog.spec.d.ts +1 -0
- package/dist/dialog/dialog.spec.js +83 -0
- package/dist/dialog/dialog.spec.js.map +1 -0
- package/dist/dialog/dialog.types.d.ts +33 -0
- package/dist/dialog/dialog.types.js +2 -0
- package/dist/dialog/dialog.types.js.map +1 -0
- package/dist/dialog/index.d.ts +2 -0
- package/dist/dialog/index.js +3 -0
- package/dist/dialog/index.js.map +1 -0
- package/dist/events/events.d.ts +3 -0
- package/dist/events/events.js +44 -0
- package/dist/events/events.js.map +1 -0
- package/dist/events/events.spec.d.ts +1 -0
- package/dist/events/events.spec.js +64 -0
- package/dist/events/events.spec.js.map +1 -0
- package/dist/events/events.types.d.ts +27 -0
- package/dist/events/events.types.js +8 -0
- package/dist/events/events.types.js.map +1 -0
- package/dist/events/index.d.ts +2 -0
- package/dist/events/index.js +3 -0
- package/dist/events/index.js.map +1 -0
- package/dist/i18n/i18n.d.ts +3 -0
- package/dist/i18n/i18n.js +18 -0
- package/dist/i18n/i18n.js.map +1 -0
- package/dist/i18n/i18n.spec.d.ts +1 -0
- package/dist/i18n/i18n.spec.js +27 -0
- package/dist/i18n/i18n.spec.js.map +1 -0
- package/dist/i18n/i18n.types.d.ts +6 -0
- package/dist/i18n/i18n.types.js +2 -0
- package/dist/i18n/i18n.types.js.map +1 -0
- package/dist/i18n/index.d.ts +2 -0
- package/dist/i18n/index.js +3 -0
- package/dist/i18n/index.js.map +1 -0
- package/dist/index.cjs.js +290 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.d.ts +15 -0
- package/dist/index.js +16 -0
- package/dist/index.js.map +1 -0
- package/dist/index.mjs +274 -0
- package/dist/index.mjs.map +1 -0
- package/dist/index.spec.d.ts +1 -0
- package/dist/index.spec.js +20 -0
- package/dist/index.spec.js.map +1 -0
- package/dist/logging/index.d.ts +1 -0
- package/dist/logging/index.js +2 -0
- package/dist/logging/index.js.map +1 -0
- package/dist/logging/logging.d.ts +1 -0
- package/dist/logging/logging.js +8 -0
- package/dist/logging/logging.js.map +1 -0
- package/dist/logging/logging.spec.d.ts +1 -0
- package/dist/logging/logging.spec.js +19 -0
- package/dist/logging/logging.spec.js.map +1 -0
- package/dist/messaging/index.d.ts +2 -0
- package/dist/messaging/index.js +3 -0
- package/dist/messaging/index.js.map +1 -0
- package/dist/messaging/messaging.d.ts +15 -0
- package/dist/messaging/messaging.js +70 -0
- package/dist/messaging/messaging.js.map +1 -0
- package/dist/messaging/messaging.spec.d.ts +1 -0
- package/dist/messaging/messaging.spec.js +59 -0
- package/dist/messaging/messaging.spec.js.map +1 -0
- package/dist/messaging/messaging.types.d.ts +11 -0
- package/dist/messaging/messaging.types.js +2 -0
- package/dist/messaging/messaging.types.js.map +1 -0
- package/dist/modal/index.d.ts +2 -0
- package/dist/modal/index.js +3 -0
- package/dist/modal/index.js.map +1 -0
- package/dist/modal/modal.d.ts +10 -0
- package/dist/modal/modal.js +45 -0
- package/dist/modal/modal.js.map +1 -0
- package/dist/modal/modal.spec.d.ts +1 -0
- package/dist/modal/modal.spec.js +81 -0
- package/dist/modal/modal.spec.js.map +1 -0
- package/dist/modal/modal.types.d.ts +30 -0
- package/dist/modal/modal.types.js +2 -0
- package/dist/modal/modal.types.js.map +1 -0
- package/dist/navigation/index.d.ts +2 -0
- package/dist/navigation/index.js +3 -0
- package/dist/navigation/index.js.map +1 -0
- package/dist/navigation/navigation.d.ts +1 -0
- package/dist/navigation/navigation.js +12 -0
- package/dist/navigation/navigation.js.map +1 -0
- package/dist/navigation/navigation.spec.d.ts +1 -0
- package/dist/navigation/navigation.spec.js +22 -0
- package/dist/navigation/navigation.spec.js.map +1 -0
- package/dist/navigation/navigation.types.d.ts +6 -0
- package/dist/navigation/navigation.types.js +2 -0
- package/dist/navigation/navigation.types.js.map +1 -0
- package/dist/theming/index.d.ts +2 -0
- package/dist/theming/index.js +3 -0
- package/dist/theming/index.js.map +1 -0
- package/dist/theming/theming.d.ts +2 -0
- package/dist/theming/theming.js +11 -0
- package/dist/theming/theming.js.map +1 -0
- package/dist/theming/theming.spec.d.ts +1 -0
- package/dist/theming/theming.spec.js +19 -0
- package/dist/theming/theming.spec.js.map +1 -0
- package/dist/theming/theming.types.d.ts +8 -0
- package/dist/theming/theming.types.js +2 -0
- package/dist/theming/theming.types.js.map +1 -0
- package/dist/types.d.ts +49 -0
- package/dist/types.js +23 -0
- package/dist/types.js.map +1 -0
- package/package.json +37 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
Copyright (c) 2022-present Flip GmbH
|
|
2
|
+
|
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy of
|
|
4
|
+
this software and associated documentation files (the "Software"), to deal in
|
|
5
|
+
the Software without restriction, including without limitation the rights to
|
|
6
|
+
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
|
|
7
|
+
the Software, and to permit persons to whom the Software is furnished to do so,
|
|
8
|
+
subject to the following conditions:
|
|
9
|
+
|
|
10
|
+
The above copyright notice and this permission notice shall be included in all
|
|
11
|
+
copies or substantial portions of the Software.
|
|
12
|
+
|
|
13
|
+
The rights granted above may only be exercised to develop and distribute
|
|
14
|
+
applications that integrate or interoperate with Flip software or services, and
|
|
15
|
+
in the case of external, stand-alone applications that do not embed directly
|
|
16
|
+
inside Flip, the rights granted above may only be exercised to develop and
|
|
17
|
+
distribute applications that are dissimilar and visually distinct from Flip
|
|
18
|
+
products and services, as determined by Flip in its sole discretion.
|
|
19
|
+
|
|
20
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
21
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
|
|
22
|
+
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
|
|
23
|
+
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
|
|
24
|
+
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
|
|
25
|
+
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,472 @@
|
|
|
1
|
+
# Flip Bridge
|
|
2
|
+
|
|
3
|
+
The Flip Bridge handles communication between your embeddable apps and the Flip
|
|
4
|
+
App or Flip Admin Console.
|
|
5
|
+
|
|
6
|
+
**Contents**
|
|
7
|
+
|
|
8
|
+
- [Installation](#installation)
|
|
9
|
+
- [Usage](#usage)
|
|
10
|
+
- [Methods](#methods)
|
|
11
|
+
- [Internationalization](#internationalization)
|
|
12
|
+
- [Navigation](#navigation)
|
|
13
|
+
- [Theming](#theming)
|
|
14
|
+
- [Dialogs](#dialogs)
|
|
15
|
+
- [Modals](#modals)
|
|
16
|
+
- [Events](#events)
|
|
17
|
+
- [Error Handling](#error-handling)
|
|
18
|
+
- [Development](#development)
|
|
19
|
+
|
|
20
|
+
## Installation
|
|
21
|
+
|
|
22
|
+
```sh
|
|
23
|
+
npm install --save @getflip/bridge
|
|
24
|
+
# or
|
|
25
|
+
yarn add @getflip/bridge
|
|
26
|
+
```
|
|
27
|
+
|
|
28
|
+
## Usage
|
|
29
|
+
|
|
30
|
+
The library exposes a set of functions and listeners you can use to communicate
|
|
31
|
+
with the Flip App and Flip Admin Console (host app for short).
|
|
32
|
+
|
|
33
|
+
**Before using the provided functions, you have to call the `initFlipBridge`
|
|
34
|
+
function to set up the Flip Bridge.**
|
|
35
|
+
|
|
36
|
+
```js
|
|
37
|
+
import { initFlipBridge } from "@getflip/bridge";
|
|
38
|
+
|
|
39
|
+
initFlipBridge({
|
|
40
|
+
debug: true,
|
|
41
|
+
hostAppOrigin: "http://localhost:4200", // has to be the origin of the targeted host app
|
|
42
|
+
});
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
## Methods
|
|
46
|
+
|
|
47
|
+
### Internationalization
|
|
48
|
+
|
|
49
|
+
#### `getAvailableLangs`
|
|
50
|
+
|
|
51
|
+
Get all available languages of the host app.
|
|
52
|
+
|
|
53
|
+
**Returns** `Promise<string[]>`
|
|
54
|
+
|
|
55
|
+
**Example**
|
|
56
|
+
|
|
57
|
+
```js
|
|
58
|
+
import { getAvailableLangs } from "@getflip/bridge";
|
|
59
|
+
|
|
60
|
+
const availableLanguages = await getAvailableLangs(); // e.g. ['de', 'en', 'fr', …]
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
#### `getLang`
|
|
64
|
+
|
|
65
|
+
Get the current language of the host app.
|
|
66
|
+
|
|
67
|
+
**Returns** `Promise<string>`
|
|
68
|
+
|
|
69
|
+
**Example**
|
|
70
|
+
|
|
71
|
+
```js
|
|
72
|
+
import { getLang } from "@getflip/bridge";
|
|
73
|
+
|
|
74
|
+
const currentLanguage = await getLang(); // e.g. 'en'
|
|
75
|
+
```
|
|
76
|
+
|
|
77
|
+
### Navigation
|
|
78
|
+
|
|
79
|
+
#### `navigate`
|
|
80
|
+
|
|
81
|
+
Navigate to a specific route.
|
|
82
|
+
|
|
83
|
+
**Param** `string`
|
|
84
|
+
|
|
85
|
+
**Returns** `Promise<boolean>`
|
|
86
|
+
|
|
87
|
+
**Example**
|
|
88
|
+
|
|
89
|
+
```js
|
|
90
|
+
import { navigate } from "@getflip/bridge";
|
|
91
|
+
|
|
92
|
+
await navigate("/my-app/settings");
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
### Theming
|
|
96
|
+
|
|
97
|
+
#### `getTheme`
|
|
98
|
+
|
|
99
|
+
Get the current theme.
|
|
100
|
+
|
|
101
|
+
**Returns**
|
|
102
|
+
|
|
103
|
+
```js
|
|
104
|
+
Promise<{
|
|
105
|
+
activeTheme: "light" | "dark";
|
|
106
|
+
preferredTheme: "light" | "dark" | undefined;
|
|
107
|
+
}>
|
|
108
|
+
```
|
|
109
|
+
|
|
110
|
+
**Example**
|
|
111
|
+
|
|
112
|
+
```js
|
|
113
|
+
import { getTheme } from "@getflip/bridge";
|
|
114
|
+
|
|
115
|
+
const theme = await getTheme();
|
|
116
|
+
```
|
|
117
|
+
|
|
118
|
+
### Dialogs
|
|
119
|
+
|
|
120
|
+
#### `createDialog`
|
|
121
|
+
|
|
122
|
+
Creates a modal dialog rendered by the host app.
|
|
123
|
+
|
|
124
|
+
**Param**
|
|
125
|
+
|
|
126
|
+
```js
|
|
127
|
+
{
|
|
128
|
+
hideLabel?: boolean;
|
|
129
|
+
id: string;
|
|
130
|
+
intent?: 'primary' | 'critical';
|
|
131
|
+
label: string;
|
|
132
|
+
text: string;
|
|
133
|
+
primaryAction?: {
|
|
134
|
+
label: string;
|
|
135
|
+
};
|
|
136
|
+
secondaryAction?: {
|
|
137
|
+
label: string;
|
|
138
|
+
};
|
|
139
|
+
}
|
|
140
|
+
```
|
|
141
|
+
|
|
142
|
+
**Returns**
|
|
143
|
+
|
|
144
|
+
```js
|
|
145
|
+
Promise<{
|
|
146
|
+
id: string;
|
|
147
|
+
open: () => Promise<boolean>;
|
|
148
|
+
close: () => Promise<boolean>;
|
|
149
|
+
destroy: () => Promise<boolean>;
|
|
150
|
+
}>
|
|
151
|
+
```
|
|
152
|
+
|
|
153
|
+
**Example**
|
|
154
|
+
|
|
155
|
+
```js
|
|
156
|
+
import { createDialog } from "@getflip/bridge";
|
|
157
|
+
|
|
158
|
+
const dialog = await createDialog({
|
|
159
|
+
id: "my-dialog",
|
|
160
|
+
label: "My Dialog",
|
|
161
|
+
text: "Lorem ipsum",
|
|
162
|
+
primaryAction: {
|
|
163
|
+
label: "Close",
|
|
164
|
+
},
|
|
165
|
+
});
|
|
166
|
+
|
|
167
|
+
await dialog.open();
|
|
168
|
+
```
|
|
169
|
+
|
|
170
|
+
#### `openDialog`
|
|
171
|
+
|
|
172
|
+
Opens a dialog.
|
|
173
|
+
|
|
174
|
+
**Param**
|
|
175
|
+
|
|
176
|
+
```js
|
|
177
|
+
{
|
|
178
|
+
id: string; // the dialog id
|
|
179
|
+
}
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
**Returns** `Promise<boolean>`
|
|
183
|
+
|
|
184
|
+
**Example**
|
|
185
|
+
|
|
186
|
+
```js
|
|
187
|
+
import { createDialog, openDialog } from "@getflip/bridge";
|
|
188
|
+
|
|
189
|
+
await createDialog({
|
|
190
|
+
id: "my-dialog",
|
|
191
|
+
label: "My Dialog",
|
|
192
|
+
text: "Lorem ipsum",
|
|
193
|
+
});
|
|
194
|
+
|
|
195
|
+
await openDialog({ id: "my-dialog" });
|
|
196
|
+
```
|
|
197
|
+
|
|
198
|
+
#### `closeDialog`
|
|
199
|
+
|
|
200
|
+
Closes a dialog.
|
|
201
|
+
|
|
202
|
+
**Param**
|
|
203
|
+
|
|
204
|
+
```js
|
|
205
|
+
{
|
|
206
|
+
id: string; // the dialog id
|
|
207
|
+
}
|
|
208
|
+
```
|
|
209
|
+
|
|
210
|
+
**Returns** `Promise<boolean>`
|
|
211
|
+
|
|
212
|
+
**Example**
|
|
213
|
+
|
|
214
|
+
```js
|
|
215
|
+
import { closeDialog } from "@getflip/bridge";
|
|
216
|
+
|
|
217
|
+
await closeDialog({ id: "my-dialog" });
|
|
218
|
+
```
|
|
219
|
+
|
|
220
|
+
#### `destroyDialog`
|
|
221
|
+
|
|
222
|
+
Destroys a dialog, removing it from the DOM.
|
|
223
|
+
|
|
224
|
+
**Param**
|
|
225
|
+
|
|
226
|
+
```js
|
|
227
|
+
{
|
|
228
|
+
id: string; // the dialog id
|
|
229
|
+
}
|
|
230
|
+
```
|
|
231
|
+
|
|
232
|
+
**Returns** `Promise<boolean>`
|
|
233
|
+
|
|
234
|
+
**Example**
|
|
235
|
+
|
|
236
|
+
```js
|
|
237
|
+
import { destroyDialog } from "@getflip/bridge";
|
|
238
|
+
|
|
239
|
+
await destroyDialog({ id: "my-dialog" });
|
|
240
|
+
```
|
|
241
|
+
|
|
242
|
+
### Modals
|
|
243
|
+
|
|
244
|
+
#### `createModal`
|
|
245
|
+
|
|
246
|
+
Creates a modal rendered by the host app. The modal will show the passed URL as
|
|
247
|
+
an iFrame.
|
|
248
|
+
|
|
249
|
+
**Param**
|
|
250
|
+
|
|
251
|
+
```js
|
|
252
|
+
{
|
|
253
|
+
id: string;
|
|
254
|
+
label: string;
|
|
255
|
+
primaryAction?: {
|
|
256
|
+
label: string;
|
|
257
|
+
};
|
|
258
|
+
secondaryAction?: {
|
|
259
|
+
label: string;
|
|
260
|
+
};
|
|
261
|
+
url: string;
|
|
262
|
+
}
|
|
263
|
+
```
|
|
264
|
+
|
|
265
|
+
**Returns**
|
|
266
|
+
|
|
267
|
+
```js
|
|
268
|
+
Promise<{
|
|
269
|
+
id: string;
|
|
270
|
+
open: () => Promise<boolean>;
|
|
271
|
+
close: () => Promise<boolean>;
|
|
272
|
+
destroy: () => Promise<boolean>;
|
|
273
|
+
}>
|
|
274
|
+
```
|
|
275
|
+
|
|
276
|
+
**Example**
|
|
277
|
+
|
|
278
|
+
```js
|
|
279
|
+
import { createModal } from "@getflip/bridge";
|
|
280
|
+
|
|
281
|
+
const modal = await createModal({
|
|
282
|
+
id: "my-moadl",
|
|
283
|
+
label: "My Modal",
|
|
284
|
+
primaryAction: {
|
|
285
|
+
label: "Close",
|
|
286
|
+
},
|
|
287
|
+
url: "https://google.com",
|
|
288
|
+
});
|
|
289
|
+
|
|
290
|
+
await modal.open();
|
|
291
|
+
```
|
|
292
|
+
|
|
293
|
+
#### `openModal`
|
|
294
|
+
|
|
295
|
+
Opens a modal.
|
|
296
|
+
|
|
297
|
+
**Param**
|
|
298
|
+
|
|
299
|
+
```js
|
|
300
|
+
{
|
|
301
|
+
id: string; // the modal id
|
|
302
|
+
}
|
|
303
|
+
```
|
|
304
|
+
|
|
305
|
+
**Returns** `Promise<boolean>`
|
|
306
|
+
|
|
307
|
+
**Example**
|
|
308
|
+
|
|
309
|
+
```js
|
|
310
|
+
import { createModal, openModal } from "@getflip/bridge";
|
|
311
|
+
|
|
312
|
+
await createModal({
|
|
313
|
+
id: "my-modal",
|
|
314
|
+
label: "My Modal",
|
|
315
|
+
url: "https://google.com",
|
|
316
|
+
});
|
|
317
|
+
|
|
318
|
+
await openModal({ id: "my-modal" });
|
|
319
|
+
```
|
|
320
|
+
|
|
321
|
+
#### `closeModal`
|
|
322
|
+
|
|
323
|
+
Closes a modal.
|
|
324
|
+
|
|
325
|
+
**Param**
|
|
326
|
+
|
|
327
|
+
```js
|
|
328
|
+
{
|
|
329
|
+
id: string; // the modal id
|
|
330
|
+
}
|
|
331
|
+
```
|
|
332
|
+
|
|
333
|
+
**Returns** `Promise<boolean>`
|
|
334
|
+
|
|
335
|
+
**Example**
|
|
336
|
+
|
|
337
|
+
```js
|
|
338
|
+
import { closeModal } from "@getflip/bridge";
|
|
339
|
+
|
|
340
|
+
await closeModal({ id: "my-modal" });
|
|
341
|
+
```
|
|
342
|
+
|
|
343
|
+
#### `destroyModal`
|
|
344
|
+
|
|
345
|
+
Destroys a modal, removing it from the DOM.
|
|
346
|
+
|
|
347
|
+
**Param**
|
|
348
|
+
|
|
349
|
+
```js
|
|
350
|
+
{
|
|
351
|
+
id: string; // the modal id
|
|
352
|
+
}
|
|
353
|
+
```
|
|
354
|
+
|
|
355
|
+
**Returns** `Promise<boolean>`
|
|
356
|
+
|
|
357
|
+
**Example**
|
|
358
|
+
|
|
359
|
+
```js
|
|
360
|
+
import { destroyModal } from "@getflip/bridge";
|
|
361
|
+
|
|
362
|
+
await destroyModal({ id: "my-modal" });
|
|
363
|
+
```
|
|
364
|
+
|
|
365
|
+
## Events
|
|
366
|
+
|
|
367
|
+
Use the `subscribe` functions to subscribe to events.
|
|
368
|
+
|
|
369
|
+
```js
|
|
370
|
+
import { subscribe, BridgeEventType } from "@getflip/bridge";
|
|
371
|
+
|
|
372
|
+
const unsubscribe = await subscribe(BridgeEventType.THEME_CHANGE, (event) => {
|
|
373
|
+
console.log(event.data);
|
|
374
|
+
});
|
|
375
|
+
|
|
376
|
+
// …
|
|
377
|
+
|
|
378
|
+
await unsubscribe();
|
|
379
|
+
```
|
|
380
|
+
|
|
381
|
+
### `LANG_CHANGE`
|
|
382
|
+
|
|
383
|
+
Fires when the user selected language changes.
|
|
384
|
+
|
|
385
|
+
**Event**
|
|
386
|
+
|
|
387
|
+
```js
|
|
388
|
+
{
|
|
389
|
+
data: string; // e.g. 'en'
|
|
390
|
+
type: BridgeEventType.LANG_CHANGE;
|
|
391
|
+
}
|
|
392
|
+
```
|
|
393
|
+
|
|
394
|
+
### `PRIMARY_ACTION_CLICK`
|
|
395
|
+
|
|
396
|
+
Fires when the primary action button of a dialog or modal is clicked.
|
|
397
|
+
|
|
398
|
+
**Event**
|
|
399
|
+
|
|
400
|
+
```js
|
|
401
|
+
{
|
|
402
|
+
data: {
|
|
403
|
+
parentId: string; // id of the action's dialog or modal
|
|
404
|
+
}
|
|
405
|
+
type: BridgeEventType.PRIMARY_ACTION_CLICK;
|
|
406
|
+
}
|
|
407
|
+
```
|
|
408
|
+
|
|
409
|
+
### `SECONDARY_ACTION_CLICK`
|
|
410
|
+
|
|
411
|
+
Fires when the secondary action button of a dialog or modal is clicked.
|
|
412
|
+
|
|
413
|
+
**Event**
|
|
414
|
+
|
|
415
|
+
```js
|
|
416
|
+
{
|
|
417
|
+
data: {
|
|
418
|
+
parentId: string; // id of the action's dialog or modal
|
|
419
|
+
}
|
|
420
|
+
type: BridgeEventType.SECONDARY_ACTION_CLICK;
|
|
421
|
+
}
|
|
422
|
+
```
|
|
423
|
+
|
|
424
|
+
### `THEME_CHANGE`
|
|
425
|
+
|
|
426
|
+
Fires when the user theme changes.
|
|
427
|
+
|
|
428
|
+
**Event**
|
|
429
|
+
|
|
430
|
+
```js
|
|
431
|
+
{
|
|
432
|
+
data: {
|
|
433
|
+
activeTheme: "light" | "dark";
|
|
434
|
+
preferredTheme: "light" | "dark" | undefined;
|
|
435
|
+
}
|
|
436
|
+
type: BridgeEventType.THEME_CHANGE;
|
|
437
|
+
}
|
|
438
|
+
```
|
|
439
|
+
|
|
440
|
+
## Error Handling
|
|
441
|
+
|
|
442
|
+
All provided functions return promises that throw an error if the execution
|
|
443
|
+
failed. The errors have the following format.
|
|
444
|
+
|
|
445
|
+
```js
|
|
446
|
+
{
|
|
447
|
+
code: BridgeErrorCode; // e.g. 'FORBIDDEN_ORIGIN'
|
|
448
|
+
}
|
|
449
|
+
```
|
|
450
|
+
|
|
451
|
+
### `FORBIDDEN_ORIGIN`
|
|
452
|
+
|
|
453
|
+
Thrown when the origin of the requesting app is not allowed by the host app.
|
|
454
|
+
Please check if your app is correctly registered in the Flip Partner Dashboard
|
|
455
|
+
and the `hostAppOrigin` option is set (see [Usage](#usage)).
|
|
456
|
+
|
|
457
|
+
### `INVALID_REQUEST`
|
|
458
|
+
|
|
459
|
+
The host app identified the request as invalid. This typically occurs when the
|
|
460
|
+
provided parameters are invalid.
|
|
461
|
+
|
|
462
|
+
## Development
|
|
463
|
+
|
|
464
|
+
Start the compiler in watch mode for local development:
|
|
465
|
+
|
|
466
|
+
```
|
|
467
|
+
yarn dev
|
|
468
|
+
```
|
|
469
|
+
|
|
470
|
+
Production builds and releases are managed via our Github workflows. Make sure
|
|
471
|
+
to create a Changeset using `yarn changeset` if you want to trigger a new
|
|
472
|
+
release.
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { CloseDialogRequest, CloseDialogRequestParams, CreateDialogRequestParams, DestroyDialogRequest, DestroyDialogRequestParams, OpenDialogRequest, OpenDialogRequestParams } from "./dialog.types";
|
|
2
|
+
export declare function createDialog(params: CreateDialogRequestParams): Promise<{
|
|
3
|
+
id: string;
|
|
4
|
+
open: () => Promise<import("../types").BridgeError | OpenDialogRequest>;
|
|
5
|
+
close: () => Promise<import("../types").BridgeError | CloseDialogRequest>;
|
|
6
|
+
destroy: () => Promise<import("../types").BridgeError | DestroyDialogRequest>;
|
|
7
|
+
} | undefined>;
|
|
8
|
+
export declare function openDialog(params: OpenDialogRequestParams): Promise<import("../types").BridgeError | OpenDialogRequest>;
|
|
9
|
+
export declare function closeDialog(params: CloseDialogRequestParams): Promise<import("../types").BridgeError | CloseDialogRequest>;
|
|
10
|
+
export declare function destroyDialog(params: DestroyDialogRequestParams): Promise<import("../types").BridgeError | DestroyDialogRequest>;
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { v4 as uuidv4 } from "uuid";
|
|
2
|
+
import { makeRequest } from "../messaging";
|
|
3
|
+
import { BridgeMethod } from "../types";
|
|
4
|
+
export async function createDialog(params) {
|
|
5
|
+
const request = {
|
|
6
|
+
id: uuidv4(),
|
|
7
|
+
method: BridgeMethod.CREATE_DIALOG,
|
|
8
|
+
params,
|
|
9
|
+
};
|
|
10
|
+
const result = await makeRequest(request);
|
|
11
|
+
if (!result) {
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
return {
|
|
15
|
+
id: params.id,
|
|
16
|
+
open: async () => openDialog({ id: params.id }),
|
|
17
|
+
close: async () => closeDialog({ id: params.id }),
|
|
18
|
+
destroy: async () => destroyDialog({ id: params.id }),
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
export async function openDialog(params) {
|
|
22
|
+
const request = {
|
|
23
|
+
id: uuidv4(),
|
|
24
|
+
method: BridgeMethod.OPEN_DIALOG,
|
|
25
|
+
params,
|
|
26
|
+
};
|
|
27
|
+
return makeRequest(request);
|
|
28
|
+
}
|
|
29
|
+
export async function closeDialog(params) {
|
|
30
|
+
const request = {
|
|
31
|
+
id: uuidv4(),
|
|
32
|
+
method: BridgeMethod.CLOSE_DIALOG,
|
|
33
|
+
params,
|
|
34
|
+
};
|
|
35
|
+
return makeRequest(request);
|
|
36
|
+
}
|
|
37
|
+
export async function destroyDialog(params) {
|
|
38
|
+
const request = {
|
|
39
|
+
id: uuidv4(),
|
|
40
|
+
method: BridgeMethod.DESTROY_DIALOG,
|
|
41
|
+
params,
|
|
42
|
+
};
|
|
43
|
+
return makeRequest(request);
|
|
44
|
+
}
|
|
45
|
+
//# sourceMappingURL=dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.js","sourceRoot":"","sources":["../../src/dialog/dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,IAAI,MAAM,EAAE,MAAM,MAAM,CAAC;AACpC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAYxC,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,MAAiC;IAClE,MAAM,OAAO,GAAwB;QACnC,EAAE,EAAE,MAAM,EAAE;QACZ,MAAM,EAAE,YAAY,CAAC,aAAa;QAClC,MAAM;KACP,CAAC;IAEF,MAAM,MAAM,GAAG,MAAM,WAAW,CAAsB,OAAO,CAAC,CAAC;IAE/D,IAAI,CAAC,MAAM,EAAE;QACX,OAAO;KACR;IAED,OAAO;QACL,EAAE,EAAE,MAAM,CAAC,EAAE;QACb,IAAI,EAAE,KAAK,IAAI,EAAE,CAAC,UAAU,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC;QAC/C,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC,WAAW,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC;QACjD,OAAO,EAAE,KAAK,IAAI,EAAE,CAAC,aAAa,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC;KACtD,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,UAAU,CAAC,MAA+B;IAC9D,MAAM,OAAO,GAAsB;QACjC,EAAE,EAAE,MAAM,EAAE;QACZ,MAAM,EAAE,YAAY,CAAC,WAAW;QAChC,MAAM;KACP,CAAC;IAEF,OAAO,WAAW,CAAoB,OAAO,CAAC,CAAC;AACjD,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,WAAW,CAAC,MAAgC;IAChE,MAAM,OAAO,GAAuB;QAClC,EAAE,EAAE,MAAM,EAAE;QACZ,MAAM,EAAE,YAAY,CAAC,YAAY;QACjC,MAAM;KACP,CAAC;IAEF,OAAO,WAAW,CAAqB,OAAO,CAAC,CAAC;AAClD,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,aAAa,CAAC,MAAkC;IACpE,MAAM,OAAO,GAAyB;QACpC,EAAE,EAAE,MAAM,EAAE;QACZ,MAAM,EAAE,YAAY,CAAC,cAAc;QACnC,MAAM;KACP,CAAC;IAEF,OAAO,WAAW,CAAuB,OAAO,CAAC,CAAC;AACpD,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { BridgeMethod } from "../types";
|
|
2
|
+
import { closeDialog, createDialog, destroyDialog, openDialog } from "./dialog";
|
|
3
|
+
jest.mock("../messaging", () => {
|
|
4
|
+
const originalModule = jest.requireActual("../messaging");
|
|
5
|
+
return Object.assign(Object.assign({ __esModule: true }, originalModule), { makeRequest: async (request) => {
|
|
6
|
+
originalModule.makeRequest(request);
|
|
7
|
+
return true;
|
|
8
|
+
} });
|
|
9
|
+
});
|
|
10
|
+
describe("dialog", () => {
|
|
11
|
+
beforeAll(() => {
|
|
12
|
+
global.flipBridgeOptions = { hostAppOrigin: "http://localhost" };
|
|
13
|
+
});
|
|
14
|
+
test("'createDialog' sends correct request", async () => {
|
|
15
|
+
const params = {
|
|
16
|
+
hideLabel: false,
|
|
17
|
+
id: "my-dialog",
|
|
18
|
+
label: "My Dialog",
|
|
19
|
+
text: "Lorem ipsum",
|
|
20
|
+
intent: "critical",
|
|
21
|
+
primaryAction: {
|
|
22
|
+
label: "Primary",
|
|
23
|
+
},
|
|
24
|
+
secondaryAction: {
|
|
25
|
+
label: "Secondary",
|
|
26
|
+
},
|
|
27
|
+
};
|
|
28
|
+
const spy = jest.fn();
|
|
29
|
+
window.top.postMessage = spy;
|
|
30
|
+
const response = await createDialog(params);
|
|
31
|
+
expect(spy).toHaveBeenCalledWith({
|
|
32
|
+
id: spy.mock.calls[0][0].id,
|
|
33
|
+
method: BridgeMethod.CREATE_DIALOG,
|
|
34
|
+
params,
|
|
35
|
+
}, "http://localhost");
|
|
36
|
+
expect(response === null || response === void 0 ? void 0 : response.id).toBe(params.id);
|
|
37
|
+
expect(typeof (response === null || response === void 0 ? void 0 : response.close)).toBe("function");
|
|
38
|
+
expect(typeof (response === null || response === void 0 ? void 0 : response.open)).toBe("function");
|
|
39
|
+
});
|
|
40
|
+
test("'openDialog' sends correct request", async () => {
|
|
41
|
+
const params = {
|
|
42
|
+
id: "my-dialog",
|
|
43
|
+
};
|
|
44
|
+
const spy = jest.fn();
|
|
45
|
+
window.top.postMessage = spy;
|
|
46
|
+
const response = await openDialog(params);
|
|
47
|
+
expect(spy).toHaveBeenCalledWith({
|
|
48
|
+
id: spy.mock.calls[0][0].id,
|
|
49
|
+
method: BridgeMethod.OPEN_DIALOG,
|
|
50
|
+
params,
|
|
51
|
+
}, "http://localhost");
|
|
52
|
+
expect(response).toBe(true);
|
|
53
|
+
});
|
|
54
|
+
test("'closeDialog' sends correct request", async () => {
|
|
55
|
+
const params = {
|
|
56
|
+
id: "my-dialog",
|
|
57
|
+
};
|
|
58
|
+
const spy = jest.fn();
|
|
59
|
+
window.top.postMessage = spy;
|
|
60
|
+
const response = await closeDialog(params);
|
|
61
|
+
expect(spy).toHaveBeenCalledWith({
|
|
62
|
+
id: spy.mock.calls[0][0].id,
|
|
63
|
+
method: BridgeMethod.CLOSE_DIALOG,
|
|
64
|
+
params,
|
|
65
|
+
}, "http://localhost");
|
|
66
|
+
expect(response).toBe(true);
|
|
67
|
+
});
|
|
68
|
+
test("'destroyDialog' sends correct request", async () => {
|
|
69
|
+
const params = {
|
|
70
|
+
id: "my-dialog",
|
|
71
|
+
};
|
|
72
|
+
const spy = jest.fn();
|
|
73
|
+
window.top.postMessage = spy;
|
|
74
|
+
const response = await destroyDialog(params);
|
|
75
|
+
expect(spy).toHaveBeenCalledWith({
|
|
76
|
+
id: spy.mock.calls[0][0].id,
|
|
77
|
+
method: BridgeMethod.DESTROY_DIALOG,
|
|
78
|
+
params,
|
|
79
|
+
}, "http://localhost");
|
|
80
|
+
expect(response).toBe(true);
|
|
81
|
+
});
|
|
82
|
+
});
|
|
83
|
+
//# sourceMappingURL=dialog.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.spec.js","sourceRoot":"","sources":["../../src/dialog/dialog.spec.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AACxC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAQhF,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,GAAG,EAAE;IAC7B,MAAM,cAAc,GAAG,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;IAE1D,qCACE,UAAU,EAAE,IAAI,IACb,cAAc,KACjB,WAAW,EAAE,KAAK,EAAE,OAAsB,EAAE,EAAE;YAC5C,cAAc,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YACpC,OAAO,IAAI,CAAC;QACd,CAAC,IACD;AACJ,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,QAAQ,EAAE,GAAG,EAAE;IACtB,SAAS,CAAC,GAAG,EAAE;QACZ,MAAc,CAAC,iBAAiB,GAAG,EAAE,aAAa,EAAE,kBAAkB,EAAE,CAAC;IAC5E,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,sCAAsC,EAAE,KAAK,IAAI,EAAE;QACtD,MAAM,MAAM,GAA8B;YACxC,SAAS,EAAE,KAAK;YAChB,EAAE,EAAE,WAAW;YACf,KAAK,EAAE,WAAW;YAClB,IAAI,EAAE,aAAa;YACnB,MAAM,EAAE,UAAU;YAClB,aAAa,EAAE;gBACb,KAAK,EAAE,SAAS;aACjB;YACD,eAAe,EAAE;gBACf,KAAK,EAAE,WAAW;aACnB;SACF,CAAC;QAEF,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAErB,MAAM,CAAC,GAAW,CAAC,WAAW,GAAG,GAAG,CAAC;QAEtC,MAAM,QAAQ,GAAG,MAAM,YAAY,CAAC,MAAM,CAAC,CAAC;QAE5C,MAAM,CAAC,GAAG,CAAC,CAAC,oBAAoB,CAC9B;YACE,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YAC3B,MAAM,EAAE,YAAY,CAAC,aAAa;YAClC,MAAM;SACP,EACD,kBAAkB,CACnB,CAAC;QAEF,MAAM,CAAC,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QACrC,MAAM,CAAC,OAAO,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,CAAA,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAChD,MAAM,CAAC,OAAO,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,CAAA,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACjD,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,oCAAoC,EAAE,KAAK,IAAI,EAAE;QACpD,MAAM,MAAM,GAA4B;YACtC,EAAE,EAAE,WAAW;SAChB,CAAC;QAEF,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAErB,MAAM,CAAC,GAAW,CAAC,WAAW,GAAG,GAAG,CAAC;QAEtC,MAAM,QAAQ,GAAG,MAAM,UAAU,CAAC,MAAM,CAAC,CAAC;QAE1C,MAAM,CAAC,GAAG,CAAC,CAAC,oBAAoB,CAC9B;YACE,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YAC3B,MAAM,EAAE,YAAY,CAAC,WAAW;YAChC,MAAM;SACP,EACD,kBAAkB,CACnB,CAAC;QAEF,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACrD,MAAM,MAAM,GAA6B;YACvC,EAAE,EAAE,WAAW;SAChB,CAAC;QAEF,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAErB,MAAM,CAAC,GAAW,CAAC,WAAW,GAAG,GAAG,CAAC;QAEtC,MAAM,QAAQ,GAAG,MAAM,WAAW,CAAC,MAAM,CAAC,CAAC;QAE3C,MAAM,CAAC,GAAG,CAAC,CAAC,oBAAoB,CAC9B;YACE,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YAC3B,MAAM,EAAE,YAAY,CAAC,YAAY;YACjC,MAAM;SACP,EACD,kBAAkB,CACnB,CAAC;QAEF,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;IAEH,IAAI,CAAC,uCAAuC,EAAE,KAAK,IAAI,EAAE;QACvD,MAAM,MAAM,GAA+B;YACzC,EAAE,EAAE,WAAW;SAChB,CAAC;QAEF,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QAErB,MAAM,CAAC,GAAW,CAAC,WAAW,GAAG,GAAG,CAAC;QAEtC,MAAM,QAAQ,GAAG,MAAM,aAAa,CAAC,MAAM,CAAC,CAAC;QAE7C,MAAM,CAAC,GAAG,CAAC,CAAC,oBAAoB,CAC9B;YACE,EAAE,EAAE,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE;YAC3B,MAAM,EAAE,YAAY,CAAC,cAAc;YACnC,MAAM;SACP,EACD,kBAAkB,CACnB,CAAC;QAEF,MAAM,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { SwirlDialogIntent } from "@getflip/swirl-components/dist/types/components/swirl-dialog/swirl-dialog";
|
|
2
|
+
import { BridgeRequest } from "../messaging/messaging.types";
|
|
3
|
+
import { BridgeMethod } from "../types";
|
|
4
|
+
export type CreateDialogRequestParams = {
|
|
5
|
+
hideLabel?: boolean;
|
|
6
|
+
id: string;
|
|
7
|
+
intent?: SwirlDialogIntent;
|
|
8
|
+
label: string;
|
|
9
|
+
text: string;
|
|
10
|
+
primaryAction?: {
|
|
11
|
+
label: string;
|
|
12
|
+
};
|
|
13
|
+
secondaryAction?: {
|
|
14
|
+
label: string;
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
export type OpenDialogRequestParams = {
|
|
18
|
+
id: string;
|
|
19
|
+
};
|
|
20
|
+
export type CloseDialogRequestParams = {
|
|
21
|
+
id: string;
|
|
22
|
+
};
|
|
23
|
+
export type DestroyDialogRequestParams = {
|
|
24
|
+
id: string;
|
|
25
|
+
};
|
|
26
|
+
export type CreateDialogRequest = BridgeRequest<BridgeMethod.CREATE_DIALOG, CreateDialogRequestParams>;
|
|
27
|
+
export type OpenDialogRequest = BridgeRequest<BridgeMethod.OPEN_DIALOG, OpenDialogRequestParams>;
|
|
28
|
+
export type CloseDialogRequest = BridgeRequest<BridgeMethod.CLOSE_DIALOG, CloseDialogRequestParams>;
|
|
29
|
+
export type DestroyDialogRequest = BridgeRequest<BridgeMethod.DESTROY_DIALOG, CloseDialogRequestParams>;
|
|
30
|
+
export type CreateDialogResult = boolean;
|
|
31
|
+
export type OpenDialogResult = boolean;
|
|
32
|
+
export type CloseDialogResult = boolean;
|
|
33
|
+
export type DestroyDialogResult = boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.types.js","sourceRoot":"","sources":["../../src/dialog/dialog.types.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/dialog/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC"}
|