@parafin/core 2.0.1 → 2.1.0

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 (4) hide show
  1. package/index.ts +26 -8
  2. package/out/index.d.ts +4 -2
  3. package/out/index.js +20 -6
  4. package/package.json +1 -1
package/index.ts CHANGED
@@ -1,7 +1,9 @@
1
- type BaseProps = { token: string } | { partner: string }
1
+ type BaseProps = ({ token: string } | { partner: string }) & {
2
+ dashboardTargetElementId?: string
3
+ }
2
4
 
3
5
  type CapitalOrSpendProps = {
4
- product: 'capital' | 'spend_card'
6
+ product: 'capital' | 'spend_card' | 'cash_account'
5
7
  route?: string
6
8
  externalBusinessId?: string
7
9
  additionalQueryParams?: Record<string, string>
@@ -61,9 +63,11 @@ export const openParafinDashboard = (
61
63
 
62
64
  const frame = document.createElement('iframe')
63
65
  frame.id = 'parafin-dashboard'
64
- frame.style.position = 'fixed'
65
- frame.style.top = '0'
66
- frame.style.left = '0'
66
+ if (!props.dashboardTargetElementId) {
67
+ frame.style.position = 'fixed'
68
+ frame.style.top = '0'
69
+ frame.style.left = '0'
70
+ }
67
71
  frame.style.width = '100%'
68
72
  frame.style.height = '100%'
69
73
  frame.style.border = 'none'
@@ -74,6 +78,14 @@ export const openParafinDashboard = (
74
78
  frame.src = url
75
79
  frame.allow = 'accelerometer; gyroscope; clipboard-read; clipboard-write'
76
80
 
81
+ const dashboardTargetElement = props.dashboardTargetElementId
82
+ ? document.getElementById(props.dashboardTargetElementId)
83
+ : document.body
84
+
85
+ if (!dashboardTargetElement) {
86
+ throw new Error('Dashboard target element not found')
87
+ }
88
+
77
89
  const closeParafinDashboard = (e: MessageEvent) => {
78
90
  if (e.origin === origin && e.data?.message === 'close-dashboard') {
79
91
  if ('orderId' in props) {
@@ -85,13 +97,19 @@ export const openParafinDashboard = (
85
97
  }
86
98
  window.removeEventListener('message', closeParafinDashboard)
87
99
  frame.style.opacity = '0'
88
- setTimeout(() => document.body.removeChild(frame), 200)
100
+ setTimeout(() => {
101
+ dashboardTargetElement.removeChild(frame)
102
+ document.body.style.removeProperty('overflow')
103
+ }, 200)
89
104
  }
90
105
  }
91
106
 
92
107
  window.addEventListener('message', closeParafinDashboard)
93
- document.body.appendChild(frame)
94
- setTimeout(() => (frame.style.opacity = '1'), 1)
108
+ dashboardTargetElement.appendChild(frame)
109
+ setTimeout(() => {
110
+ frame.style.opacity = '1'
111
+ document.body.style.overflow = 'hidden'
112
+ }, 1)
95
113
  } catch (error) {
96
114
  console.error('Error loading Parafin dashboard', error)
97
115
  }
package/out/index.d.ts CHANGED
@@ -1,10 +1,12 @@
1
- type BaseProps = {
1
+ type BaseProps = ({
2
2
  token: string;
3
3
  } | {
4
4
  partner: string;
5
+ }) & {
6
+ dashboardTargetElementId?: string;
5
7
  };
6
8
  type CapitalOrSpendProps = {
7
- product: 'capital' | 'spend_card';
9
+ product: 'capital' | 'spend_card' | 'cash_account';
8
10
  route?: string;
9
11
  externalBusinessId?: string;
10
12
  additionalQueryParams?: Record<string, string>;
package/out/index.js CHANGED
@@ -34,9 +34,11 @@ export const openParafinDashboard = (props) => {
34
34
  }
35
35
  const frame = document.createElement('iframe');
36
36
  frame.id = 'parafin-dashboard';
37
- frame.style.position = 'fixed';
38
- frame.style.top = '0';
39
- frame.style.left = '0';
37
+ if (!props.dashboardTargetElementId) {
38
+ frame.style.position = 'fixed';
39
+ frame.style.top = '0';
40
+ frame.style.left = '0';
41
+ }
40
42
  frame.style.width = '100%';
41
43
  frame.style.height = '100%';
42
44
  frame.style.border = 'none';
@@ -46,6 +48,12 @@ export const openParafinDashboard = (props) => {
46
48
  frame.style.transition = 'opacity 0.2s';
47
49
  frame.src = url;
48
50
  frame.allow = 'accelerometer; gyroscope; clipboard-read; clipboard-write';
51
+ const dashboardTargetElement = props.dashboardTargetElementId
52
+ ? document.getElementById(props.dashboardTargetElementId)
53
+ : document.body;
54
+ if (!dashboardTargetElement) {
55
+ throw new Error('Dashboard target element not found');
56
+ }
49
57
  const closeParafinDashboard = (e) => {
50
58
  if (e.origin === origin && e.data?.message === 'close-dashboard') {
51
59
  if ('orderId' in props) {
@@ -59,12 +67,18 @@ export const openParafinDashboard = (props) => {
59
67
  }
60
68
  window.removeEventListener('message', closeParafinDashboard);
61
69
  frame.style.opacity = '0';
62
- setTimeout(() => document.body.removeChild(frame), 200);
70
+ setTimeout(() => {
71
+ dashboardTargetElement.removeChild(frame);
72
+ document.body.style.removeProperty('overflow');
73
+ }, 200);
63
74
  }
64
75
  };
65
76
  window.addEventListener('message', closeParafinDashboard);
66
- document.body.appendChild(frame);
67
- setTimeout(() => (frame.style.opacity = '1'), 1);
77
+ dashboardTargetElement.appendChild(frame);
78
+ setTimeout(() => {
79
+ frame.style.opacity = '1';
80
+ document.body.style.overflow = 'hidden';
81
+ }, 1);
68
82
  }
69
83
  catch (error) {
70
84
  console.error('Error loading Parafin dashboard', error);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@parafin/core",
3
- "version": "2.0.1",
3
+ "version": "2.1.0",
4
4
  "description": "Parafin embedded core",
5
5
  "author": "Parafin (https://www.parafin.com)",
6
6
  "module": "out/index.js",