altair-graphql-core 7.3.4 → 7.3.6

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.
@@ -27,6 +27,7 @@ export declare class PluginFrameWorker extends EvaluatorWorker {
27
27
  private id;
28
28
  private instanceType;
29
29
  private params;
30
+ private messageListeners;
30
31
  constructor();
31
32
  getInstanceType(): InstanceType;
32
33
  getParams(): FrameOptions;
@@ -10,6 +10,7 @@ class PluginFrameWorker extends worker_1.EvaluatorWorker {
10
10
  constructor() {
11
11
  super();
12
12
  this.instanceType = exports.instanceTypes.MAIN;
13
+ this.messageListeners = [];
13
14
  // Check for params in special params object on the window object first. Using srcdoc, we will set the params on the window object
14
15
  const paramFromWindow = window.__ALTAIR_PLUGIN_PARAMS__;
15
16
  const paramsFromUrl = Object.fromEntries(new URLSearchParams(window.location.search));
@@ -33,12 +34,14 @@ class PluginFrameWorker extends worker_1.EvaluatorWorker {
33
34
  return this.params;
34
35
  }
35
36
  onMessage(handler) {
36
- window.addEventListener('message', (e) => {
37
+ const listener = (e) => {
37
38
  if (e.origin !== this.origin) {
38
39
  return;
39
40
  }
40
41
  handler(e.data);
41
- });
42
+ };
43
+ window.addEventListener('message', listener);
44
+ this.messageListeners.push(listener);
42
45
  }
43
46
  send(type, payload) {
44
47
  window.parent.postMessage({ type, payload, frameId: this.id }, this.origin);
@@ -52,6 +55,9 @@ class PluginFrameWorker extends worker_1.EvaluatorWorker {
52
55
  }
53
56
  destroy() {
54
57
  // cleanup resources
58
+ this.messageListeners.forEach((listener) => {
59
+ window.removeEventListener('message', listener);
60
+ });
55
61
  window.close();
56
62
  }
57
63
  }
@@ -21,6 +21,7 @@ interface PluginParentWorkerOptionsWithUrl extends BasePluginParentWorkerOptions
21
21
  export type PluginParentWorkerOptions = PluginParentWorkerOptionsWithScripts | PluginParentWorkerOptionsWithUrl;
22
22
  export declare class PluginParentWorker extends EvaluatorWorker {
23
23
  private opts;
24
+ private messageListeners;
24
25
  constructor(opts: PluginParentWorkerOptions);
25
26
  private iframe;
26
27
  private frameReadyPromise;
@@ -8,6 +8,7 @@ class PluginParentWorker extends worker_1.EvaluatorWorker {
8
8
  constructor(opts) {
9
9
  super();
10
10
  this.opts = opts;
11
+ this.messageListeners = [];
11
12
  this.iframe = this.createIframe();
12
13
  this.frameReadyPromise = new Promise((resolve) => {
13
14
  this.iframe.addEventListener('load', () => {
@@ -71,7 +72,7 @@ class PluginParentWorker extends worker_1.EvaluatorWorker {
71
72
  return this.opts.instanceType ?? frame_worker_1.instanceTypes.MAIN;
72
73
  }
73
74
  onMessage(handler) {
74
- window.addEventListener('message', (e) => {
75
+ const listener = (e) => {
75
76
  if (e.origin !== 'null' || e.source !== this.iframe.contentWindow) {
76
77
  return;
77
78
  }
@@ -80,7 +81,9 @@ class PluginParentWorker extends worker_1.EvaluatorWorker {
80
81
  return;
81
82
  }
82
83
  handler(e.data);
83
- }, false);
84
+ };
85
+ window.addEventListener('message', listener, false);
86
+ this.messageListeners.push(listener);
84
87
  }
85
88
  send(type, payload) {
86
89
  this.frameReady().then(() => {
@@ -97,6 +100,10 @@ class PluginParentWorker extends worker_1.EvaluatorWorker {
97
100
  this.iframe.addEventListener('error', handler);
98
101
  }
99
102
  destroy() {
103
+ // cleanup resources
104
+ this.messageListeners.forEach((listener) => {
105
+ window.removeEventListener('message', listener);
106
+ });
100
107
  this.iframe.remove();
101
108
  }
102
109
  }
@@ -20,22 +20,13 @@ With a #212529 (dark cool gray) background, #343a40 would make a good border col
20
20
  If you choose #232931 (rich blue-gray) as the background, #3a4149 would be a suitable border shade.
21
21
  For a #2d2f33 (slightly lighter dark gray) background, #404448 could work well for borders.
22
22
  */
23
- // TODO: Introduce glassmorphism
24
- // https://uxdesign.cc/glassmorphism-in-user-interfaces-1f39bb1308c9
25
- // https://codepen.io/kanishkkunal/pen/QWGzBwz
26
- // https://codepen.io/TurkAysenur/pen/ZEpxeYm
27
- // https://codepen.io/gutugaluppo/pen/MWjjWPx
28
- // https://codepen.io/omeal/pen/VwKKgjG
29
- // https://codepen.io/opeala/pen/yLaMBvN
30
- // https://dribbble.com/shots/16261258-Metaspark-web-site-design-landing-page-home-page-ui/attachments/8128256?mode=media
31
- // https://smarative.com/blog/realistic-frosted-glassmorphism-css-gradient-borders
32
23
  exports.foundations = {
33
24
  easing: 'ease',
34
25
  colors: {
35
26
  black: '#201e1f',
36
27
  darkGray: '#a6a6a6',
37
28
  gray: '#eaeaea',
38
- lightGray: '#f0f0f0',
29
+ lightGray: '#fafafa',
39
30
  white: '#ffffff',
40
31
  green: '#64CB29',
41
32
  blue: '#2d9ee0',
@@ -69,8 +60,8 @@ const theme = (0, deepmerge_1.default)(exports.foundations, {
69
60
  offBg: exports.foundations.colors.white,
70
61
  font: exports.foundations.colors.black,
71
62
  offFont: exports.foundations.colors.darkGray,
72
- border: exports.foundations.colors.gray,
73
- offBorder: exports.foundations.colors.lightGray,
63
+ border: exports.foundations.colors.darkGray,
64
+ offBorder: exports.foundations.colors.gray,
74
65
  headerBg: exports.foundations.colors.white,
75
66
  },
76
67
  shadow: {
@@ -10,6 +10,7 @@ const injectScript = (url) => {
10
10
  const script = document.createElement('script');
11
11
  script.type = 'text/javascript';
12
12
  script.src = url;
13
+ script.crossOrigin = 'anonymous';
13
14
  script.onload = () => resolve(null);
14
15
  script.onerror = (err) => reject(err);
15
16
  head.appendChild(script);
@@ -25,6 +26,7 @@ const injectStylesheet = (url) => {
25
26
  const style = document.createElement('link');
26
27
  style.type = 'text/css';
27
28
  style.rel = 'stylesheet';
29
+ style.crossOrigin = 'anonymous';
28
30
  style.href = url;
29
31
  style.onload = () => resolve(null);
30
32
  style.onerror = (err) => reject(err);
@@ -27,6 +27,7 @@ export declare class PluginFrameWorker extends EvaluatorWorker {
27
27
  private id;
28
28
  private instanceType;
29
29
  private params;
30
+ private messageListeners;
30
31
  constructor();
31
32
  getInstanceType(): InstanceType;
32
33
  getParams(): FrameOptions;
@@ -7,6 +7,7 @@ export class PluginFrameWorker extends EvaluatorWorker {
7
7
  constructor() {
8
8
  super();
9
9
  this.instanceType = instanceTypes.MAIN;
10
+ this.messageListeners = [];
10
11
  // Check for params in special params object on the window object first. Using srcdoc, we will set the params on the window object
11
12
  const paramFromWindow = window.__ALTAIR_PLUGIN_PARAMS__;
12
13
  const paramsFromUrl = Object.fromEntries(new URLSearchParams(window.location.search));
@@ -30,12 +31,14 @@ export class PluginFrameWorker extends EvaluatorWorker {
30
31
  return this.params;
31
32
  }
32
33
  onMessage(handler) {
33
- window.addEventListener('message', (e) => {
34
+ const listener = (e) => {
34
35
  if (e.origin !== this.origin) {
35
36
  return;
36
37
  }
37
38
  handler(e.data);
38
- });
39
+ };
40
+ window.addEventListener('message', listener);
41
+ this.messageListeners.push(listener);
39
42
  }
40
43
  send(type, payload) {
41
44
  window.parent.postMessage({ type, payload, frameId: this.id }, this.origin);
@@ -49,6 +52,9 @@ export class PluginFrameWorker extends EvaluatorWorker {
49
52
  }
50
53
  destroy() {
51
54
  // cleanup resources
55
+ this.messageListeners.forEach((listener) => {
56
+ window.removeEventListener('message', listener);
57
+ });
52
58
  window.close();
53
59
  }
54
60
  }
@@ -21,6 +21,7 @@ interface PluginParentWorkerOptionsWithUrl extends BasePluginParentWorkerOptions
21
21
  export type PluginParentWorkerOptions = PluginParentWorkerOptionsWithScripts | PluginParentWorkerOptionsWithUrl;
22
22
  export declare class PluginParentWorker extends EvaluatorWorker {
23
23
  private opts;
24
+ private messageListeners;
24
25
  constructor(opts: PluginParentWorkerOptions);
25
26
  private iframe;
26
27
  private frameReadyPromise;
@@ -5,6 +5,7 @@ export class PluginParentWorker extends EvaluatorWorker {
5
5
  constructor(opts) {
6
6
  super();
7
7
  this.opts = opts;
8
+ this.messageListeners = [];
8
9
  this.iframe = this.createIframe();
9
10
  this.frameReadyPromise = new Promise((resolve) => {
10
11
  this.iframe.addEventListener('load', () => {
@@ -68,7 +69,7 @@ export class PluginParentWorker extends EvaluatorWorker {
68
69
  return this.opts.instanceType ?? instanceTypes.MAIN;
69
70
  }
70
71
  onMessage(handler) {
71
- window.addEventListener('message', (e) => {
72
+ const listener = (e) => {
72
73
  if (e.origin !== 'null' || e.source !== this.iframe.contentWindow) {
73
74
  return;
74
75
  }
@@ -77,7 +78,9 @@ export class PluginParentWorker extends EvaluatorWorker {
77
78
  return;
78
79
  }
79
80
  handler(e.data);
80
- }, false);
81
+ };
82
+ window.addEventListener('message', listener, false);
83
+ this.messageListeners.push(listener);
81
84
  }
82
85
  send(type, payload) {
83
86
  this.frameReady().then(() => {
@@ -94,6 +97,10 @@ export class PluginParentWorker extends EvaluatorWorker {
94
97
  this.iframe.addEventListener('error', handler);
95
98
  }
96
99
  destroy() {
100
+ // cleanup resources
101
+ this.messageListeners.forEach((listener) => {
102
+ window.removeEventListener('message', listener);
103
+ });
97
104
  this.iframe.remove();
98
105
  }
99
106
  }
@@ -14,22 +14,13 @@ With a #212529 (dark cool gray) background, #343a40 would make a good border col
14
14
  If you choose #232931 (rich blue-gray) as the background, #3a4149 would be a suitable border shade.
15
15
  For a #2d2f33 (slightly lighter dark gray) background, #404448 could work well for borders.
16
16
  */
17
- // TODO: Introduce glassmorphism
18
- // https://uxdesign.cc/glassmorphism-in-user-interfaces-1f39bb1308c9
19
- // https://codepen.io/kanishkkunal/pen/QWGzBwz
20
- // https://codepen.io/TurkAysenur/pen/ZEpxeYm
21
- // https://codepen.io/gutugaluppo/pen/MWjjWPx
22
- // https://codepen.io/omeal/pen/VwKKgjG
23
- // https://codepen.io/opeala/pen/yLaMBvN
24
- // https://dribbble.com/shots/16261258-Metaspark-web-site-design-landing-page-home-page-ui/attachments/8128256?mode=media
25
- // https://smarative.com/blog/realistic-frosted-glassmorphism-css-gradient-borders
26
17
  export const foundations = {
27
18
  easing: 'ease',
28
19
  colors: {
29
20
  black: '#201e1f',
30
21
  darkGray: '#a6a6a6',
31
22
  gray: '#eaeaea',
32
- lightGray: '#f0f0f0',
23
+ lightGray: '#fafafa',
33
24
  white: '#ffffff',
34
25
  green: '#64CB29',
35
26
  blue: '#2d9ee0',
@@ -63,8 +54,8 @@ const theme = deepmerge(foundations, {
63
54
  offBg: foundations.colors.white,
64
55
  font: foundations.colors.black,
65
56
  offFont: foundations.colors.darkGray,
66
- border: foundations.colors.gray,
67
- offBorder: foundations.colors.lightGray,
57
+ border: foundations.colors.darkGray,
58
+ offBorder: foundations.colors.gray,
68
59
  headerBg: foundations.colors.white,
69
60
  },
70
61
  shadow: {
@@ -7,6 +7,7 @@ export const injectScript = (url) => {
7
7
  const script = document.createElement('script');
8
8
  script.type = 'text/javascript';
9
9
  script.src = url;
10
+ script.crossOrigin = 'anonymous';
10
11
  script.onload = () => resolve(null);
11
12
  script.onerror = (err) => reject(err);
12
13
  head.appendChild(script);
@@ -21,6 +22,7 @@ export const injectStylesheet = (url) => {
21
22
  const style = document.createElement('link');
22
23
  style.type = 'text/css';
23
24
  style.rel = 'stylesheet';
25
+ style.crossOrigin = 'anonymous';
24
26
  style.href = url;
25
27
  style.onload = () => resolve(null);
26
28
  style.onerror = (err) => reject(err);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "altair-graphql-core",
3
3
  "description": "Several of the core logic for altair graphql client",
4
- "version": "7.3.4",
4
+ "version": "7.3.6",
5
5
  "author": "Samuel Imolorhe <altair@sirmuel.design> (https://sirmuel.design)",
6
6
  "bugs": "https://github.com/altair-graphql/altair/issues",
7
7
  "dependencies": {
@@ -79,5 +79,5 @@
79
79
  "test": "jest"
80
80
  },
81
81
  "types": "./build/index.d.ts",
82
- "gitHead": "83abc5fdb9e222ca08417f5f26671045025fa462"
82
+ "gitHead": "580fe5c59a2274dea13edfa69c8f43968f99ce7a"
83
83
  }