@openfin/core-web 0.46.80 → 0.46.82
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/out/api-client.cjs.js +1 -1
- package/out/api-client.d.ts +1 -1
- package/out/api-client.esm.js +1 -1
- package/out/docs/assets/hierarchy.js +1 -0
- package/out/docs/assets/highlight.css +23 -23
- package/out/docs/assets/icons.js +1 -1
- package/out/docs/assets/icons.svg +1 -1
- package/out/docs/assets/main.js +5 -5
- package/out/docs/assets/navigation.js +1 -1
- package/out/docs/assets/search.js +1 -1
- package/out/docs/assets/style.css +1443 -1288
- package/out/docs/documents/OpenFin_Web_Application_Developer_Guide.html +93 -20
- package/out/docs/documents/Platform_Developer_Guide.html +114 -33
- package/out/docs/functions/_openfin_core-web.connect.html +77 -0
- package/out/docs/functions/_openfin_core-web_iframe-broker.init.html +40 -0
- package/out/docs/functions/_openfin_core-web_iframe-broker.rejectConnections.html +40 -0
- package/out/docs/hierarchy.html +28 -0
- package/out/docs/index.html +38 -6
- package/out/docs/interfaces/_openfin_core-web.CustomLogger.html +63 -0
- package/out/docs/modules/_openfin_core-web.html +56 -0
- package/out/docs/modules/_openfin_core-web_iframe-broker.html +53 -0
- package/out/docs/modules/_openfin_core-web_shared-worker.html +40 -0
- package/out/docs/types/_openfin_core-web.BaseConfig.html +66 -0
- package/out/docs/types/_openfin_core-web.BaseConnectionOptions.html +65 -0
- package/out/docs/types/_openfin_core-web.ConnectConfig.html +31 -0
- package/out/docs/types/_openfin_core-web.InheritModeConnectConfig.html +57 -0
- package/out/docs/types/_openfin_core-web.StandAloneConnectConfig.html +51 -0
- package/out/docs/types/_openfin_core-web.ViewComponentConfig.html +31 -0
- package/out/docs/types/_openfin_core-web.WebCreateLayoutOptions.html +31 -0
- package/out/docs/types/_openfin_core-web.WebLayoutComponent.html +35 -0
- package/out/docs/types/_openfin_core-web.WebLayoutInitOptions.html +45 -0
- package/out/docs/types/_openfin_core-web.WebLayoutManager.html +31 -0
- package/out/docs/types/_openfin_core-web.WebLayoutOptions.html +35 -0
- package/out/docs/types/_openfin_core-web.WebLayoutPlatformOptions.html +55 -0
- package/out/docs/types/_openfin_core-web.WebLayoutSettings.html +63 -0
- package/out/docs/types/_openfin_core-web.WebLayoutSnapshot.html +51 -0
- package/out/docs/types/_openfin_core-web_iframe-broker.ConnectionOptions.html +63 -0
- package/out/docs/variables/_openfin_core-web_shared-worker.default.html +31 -0
- package/out/iframe-broker.cjs.js +1 -1
- package/out/iframe-broker.esm.js +1 -1
- package/out/main-0dd2f710.js +1 -0
- package/out/main-407c3513.js +1 -0
- package/out/main-78cc9512.js +3 -0
- package/out/main-f276b092.js +3 -0
- package/out/shared-worker.js +1 -1
- package/package.json +2 -2
- package/out/docs/functions/_openfin_core_web.connect.html +0 -18
- package/out/docs/functions/_openfin_core_web_iframe_broker.init.html +0 -1
- package/out/docs/functions/_openfin_core_web_iframe_broker.rejectConnections.html +0 -1
- package/out/docs/interfaces/_openfin_core_web.CustomLogger.html +0 -5
- package/out/docs/modules/_openfin_core_web.html +0 -22
- package/out/docs/modules/_openfin_core_web_iframe_broker.html +0 -10
- package/out/docs/modules/_openfin_core_web_shared_worker.html +0 -4
- package/out/docs/types/_openfin_core_web.BaseConfig.html +0 -5
- package/out/docs/types/_openfin_core_web.BaseConnectionOptions.html +0 -4
- package/out/docs/types/_openfin_core_web.ConnectConfig.html +0 -1
- package/out/docs/types/_openfin_core_web.InheritModeConnectConfig.html +0 -14
- package/out/docs/types/_openfin_core_web.StandAloneConnectConfig.html +0 -9
- package/out/docs/types/_openfin_core_web.ViewComponentConfig.html +0 -1
- package/out/docs/types/_openfin_core_web.WebCreateLayoutOptions.html +0 -1
- package/out/docs/types/_openfin_core_web.WebLayoutComponent.html +0 -4
- package/out/docs/types/_openfin_core_web.WebLayoutInitOptions.html +0 -7
- package/out/docs/types/_openfin_core_web.WebLayoutManager.html +0 -1
- package/out/docs/types/_openfin_core_web.WebLayoutOptions.html +0 -4
- package/out/docs/types/_openfin_core_web.WebLayoutPlatformOptions.html +0 -1
- package/out/docs/types/_openfin_core_web.WebLayoutSettings.html +0 -18
- package/out/docs/types/_openfin_core_web.WebLayoutSnapshot.html +0 -1
- package/out/docs/types/_openfin_core_web_iframe_broker.ConnectionOptions.html +0 -1
- package/out/docs/variables/_openfin_core_web_shared_worker.default.html +0 -1
- package/out/main-7c7ce26e.js +0 -3
- package/out/main-84b29526.js +0 -1
- package/out/main-e712c916.js +0 -1
- package/out/main-e84f399c.js +0 -3
|
@@ -1,51 +1,124 @@
|
|
|
1
|
-
<!DOCTYPE html><html class="default" lang="en"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>OpenFin Web Application Developer Guide | @openfin/core-web</title><meta name="description" content="Documentation for @openfin/core-web"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar"
|
|
1
|
+
<!DOCTYPE html><html class="default" lang="en" data-base="../"><head><meta charset="utf-8"/><meta http-equiv="x-ua-compatible" content="IE=edge"/><title>OpenFin Web Application Developer Guide | @openfin/core-web</title><meta name="description" content="Documentation for @openfin/core-web"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="stylesheet" href="../assets/style.css"/><link rel="stylesheet" href="../assets/highlight.css"/><script defer src="../assets/main.js"></script><script async src="../assets/icons.js" id="tsd-icons-script"></script><script async src="../assets/search.js" id="tsd-search-script"></script><script async src="../assets/navigation.js" id="tsd-nav-script"></script></head><body><script>document.documentElement.dataset.theme = localStorage.getItem("tsd-theme") || "os";document.body.style.display="none";setTimeout(() => window.app?app.showPage():document.body.style.removeProperty("display"),500)</script><header class="tsd-page-toolbar">
|
|
2
|
+
<div class="tsd-toolbar-contents container"><a href="../index.html" class="title">@openfin/core-web</a>
|
|
3
|
+
<div id="tsd-toolbar-links"></div><button id="tsd-search-trigger" class="tsd-widget" aria-label="Search"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-search"></use></svg></button><dialog id="tsd-search" aria-label="Search"><input role="combobox" id="tsd-search-input" aria-controls="tsd-search-results" aria-autocomplete="list" aria-expanded="true" autocapitalize="off" autocomplete="off" placeholder="Search the docs" maxLength="100"/>
|
|
4
|
+
<ul role="listbox" id="tsd-search-results"></ul>
|
|
5
|
+
<div id="tsd-search-status" aria-live="polite" aria-atomic="true">
|
|
6
|
+
<div>Preparing search index...</div></div></dialog><a href="#" class="tsd-widget menu" id="tsd-toolbar-menu-trigger" data-toggle="menu" aria-label="Menu"><svg width="16" height="16" viewBox="0 0 16 16" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-menu"></use></svg></a></div></header>
|
|
7
|
+
<div class="container container-main">
|
|
8
|
+
<div class="col-content">
|
|
9
|
+
<div class="tsd-page-title">
|
|
10
|
+
<ul class="tsd-breadcrumb" aria-label="Breadcrumb">
|
|
11
|
+
<li><a href="" aria-current="page">OpenFin Web Application Developer Guide</a></li></ul></div>
|
|
12
|
+
<div class="tsd-panel tsd-typography"><h1 id="openfin-web-application-developer-guide" class="tsd-anchor-link">Openfin Web Application Developer Guide<a href="#openfin-web-application-developer-guide" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h1>
|
|
13
|
+
<p>If you are a developer who is building contentful applications which use the OpenFin APIs, the default entry point of this package provides a <code>connect</code> function. This is designed to complement the type definitions found in <a href="https://www.npmjs.com/package/@openfin/core">@openfin/core</a>.</p>
|
|
2
14
|
<p>Note - if you are a platform developer looking to setup an OpenFin Web Interop Broker, please check out <a href="Platform_Developer_Guide.html">this guide</a>.</p>
|
|
3
|
-
<
|
|
15
|
+
<h2 id="first-steps" class="tsd-anchor-link">First Steps<a href="#first-steps" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
16
|
+
<p>To install <code>@openfin/core-web</code>, run the following command:</p>
|
|
4
17
|
<pre><code class="bash"><span class="hl-0">npm</span><span class="hl-1"> </span><span class="hl-2">install</span><span class="hl-1"> </span><span class="hl-2">@openfin/core-web</span><span class="hl-1"> </span><span class="hl-3">-S</span>
|
|
5
18
|
</code><button type="button">Copy</button></pre>
|
|
6
19
|
|
|
7
20
|
<p>We recommend using <code>@openfin/core-web</code> with a modern build tool like Next.js, Webpack or Vite.</p>
|
|
8
21
|
<p>It is framework agnostic, meaning it should work with any UI framework.</p>
|
|
9
|
-
<
|
|
22
|
+
<h2 id="connecting-to-a-web-broker" class="tsd-anchor-link">Connecting to a Web Broker<a href="#connecting-to-a-web-broker" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
23
|
+
<p>An <code>@openfin/core-web</code> Web Broker is a piece of hosted infrastructure which you can connect to from a web site in order to interact with other content connected to the same Web Broker. A Web Broker is responsible for deciding whether you can connect to it, and connecting you to other applications via OpenFin's Interop and Channels APIs.</p>
|
|
10
24
|
<p>When the Web Broker url is known, connecting to a specific <code>@openfin/core-web</code> broker will return a fin connection.</p>
|
|
11
|
-
<
|
|
25
|
+
<h3 id="example-basic-connection-setup" class="tsd-anchor-link">Example: Basic Connection Setup<a href="#example-basic-connection-setup" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
26
|
+
<pre><code class="typescript"><span class="hl-5">import</span><span class="hl-1"> { </span><span class="hl-6">connect</span><span class="hl-1"> } </span><span class="hl-5">from</span><span class="hl-1"> </span><span class="hl-2">'@openfin/core-web'</span><span class="hl-1">;</span><br/><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">brokerUrl</span><span class="hl-1"> = </span><span class="hl-2">'http://example.com/web-broker'</span><span class="hl-1">;</span><br/><br/><span class="hl-1">(</span><span class="hl-3">async</span><span class="hl-1"> () </span><span class="hl-3">=></span><span class="hl-1"> {</span><br/><span class="hl-1"> </span><span class="hl-4">// Connect to the OpenFin Web Broker.</span><br/><span class="hl-1"> </span><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">fin</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({ </span><span class="hl-6">options:</span><span class="hl-1"> { </span><span class="hl-6">brokerUrl</span><span class="hl-1"> } });</span><br/><br/><span class="hl-1"> </span><span class="hl-4">// You may now use the `fin` object. In this case, we connect to a channel.</span><br/><span class="hl-1"> </span><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">channelClient</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-6">fin</span><span class="hl-1">.</span><span class="hl-6">InterapplicationBus</span><span class="hl-1">.</span><span class="hl-6">Channel</span><span class="hl-1">.</span><span class="hl-0">connect</span><span class="hl-1">(</span><span class="hl-2">'some channel name'</span><span class="hl-1">);</span><br/><span class="hl-1">})();</span>
|
|
12
27
|
</code><button type="button">Copy</button></pre>
|
|
13
28
|
|
|
14
|
-
<
|
|
29
|
+
<h2 id="setting-a-timeout" class="tsd-anchor-link">Setting a Timeout<a href="#setting-a-timeout" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
30
|
+
<p>If desired, the timeout option (in milliseconds) can be specified to abandon the connection after a set amount of time.</p>
|
|
15
31
|
<p>An example below shows setting up a 30 second timeout.</p>
|
|
16
|
-
<
|
|
32
|
+
<h3 id="example-setting-a-timeout" class="tsd-anchor-link">Example: Setting a Timeout<a href="#example-setting-a-timeout" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
33
|
+
<pre><code class="typescript"><span class="hl-4">// This connect call will throw if a connection is not established within 30 seconds.</span><br/><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({ </span><span class="hl-6">options:</span><span class="hl-1"> { </span><span class="hl-6">brokerUrl</span><span class="hl-1">, </span><span class="hl-6">timeout:</span><span class="hl-1"> </span><span class="hl-14">30000</span><span class="hl-1"> } });</span>
|
|
17
34
|
</code><button type="button">Copy</button></pre>
|
|
18
35
|
|
|
19
|
-
<
|
|
36
|
+
<h2 id="setting-up-an-interop-connection" class="tsd-anchor-link">Setting up an Interop Connection<a href="#setting-up-an-interop-connection" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
37
|
+
<p>An Interop connection can be configured in order to automatically set up an interop client. This client may be accessed via the <code>fin.me.interop</code> namespace.</p>
|
|
20
38
|
<p>A Provider ID must be specified for the <code>fin.me.interop</code> client to work if <code>connectionInheritance</code> is not supported. An example is shown below:</p>
|
|
21
|
-
<
|
|
39
|
+
<h3 id="example-connecting-to-an-interop-broker" class="tsd-anchor-link">Example: Connecting to an Interop Broker<a href="#example-connecting-to-an-interop-broker" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
40
|
+
<pre><code class="typescript"><span class="hl-4">// Specify an interopConfig with a specific provider ID to initialize the `fin.me.interop` client on connection.</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">fin</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({ </span><span class="hl-6">options:</span><span class="hl-1"> { </span><span class="hl-6">brokerUrl</span><span class="hl-1">, </span><span class="hl-6">interopConfig:</span><span class="hl-1"> { </span><span class="hl-6">providerId:</span><span class="hl-1"> </span><span class="hl-2">'provider-id'</span><span class="hl-1"> } } });</span><br/><br/><span class="hl-4">// fin.me.interop is an InteropClient connected to the `provider-id` InteropBroker.</span><br/><span class="hl-6">fin</span><span class="hl-1">.</span><span class="hl-6">me</span><span class="hl-1">.</span><span class="hl-6">interop</span><span class="hl-1">.</span><span class="hl-0">addContextHandler</span><span class="hl-1">((</span><span class="hl-6">context</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> </span><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-2">'received context'</span><span class="hl-1">));</span>
|
|
22
41
|
</code><button type="button">Copy</button></pre>
|
|
23
42
|
|
|
24
|
-
<
|
|
25
|
-
<
|
|
43
|
+
<h2 id="specifying-an-initial-context-group" class="tsd-anchor-link">Specifying an Initial Context Group<a href="#specifying-an-initial-context-group" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
44
|
+
<p>By default OpenFin's Interop Client api does not select a context group. The following example illustrates setting up an initial context group during connection.</p>
|
|
45
|
+
<h3 id="example-joining-a-default-context-group" class="tsd-anchor-link">Example: Joining a Default Context Group<a href="#example-joining-a-default-context-group" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
46
|
+
<pre><code class="typescript"><span class="hl-4">// Specify an interopConfig with a specific provider ID and a context group to initialize the `fin.me.interop` client on connection.</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">fin</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">options:</span><span class="hl-1"> { </span><span class="hl-6">brokerUrl</span><span class="hl-1">, </span><span class="hl-6">interopConfig:</span><span class="hl-1"> { </span><span class="hl-6">providerId:</span><span class="hl-1"> </span><span class="hl-2">'provider-id'</span><span class="hl-1">, </span><span class="hl-6">currentContextGroup:</span><span class="hl-1"> </span><span class="hl-2">'red'</span><span class="hl-1"> } }</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-4">// The fin.me.interop client adds a context handler which will receive updates published on the `red` context group.</span><br/><span class="hl-6">fin</span><span class="hl-1">.</span><span class="hl-6">me</span><span class="hl-1">.</span><span class="hl-6">interop</span><span class="hl-1">.</span><span class="hl-0">addContextHandler</span><span class="hl-1">((</span><span class="hl-6">context</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> </span><span class="hl-6">console</span><span class="hl-1">.</span><span class="hl-0">log</span><span class="hl-1">(</span><span class="hl-2">'received context'</span><span class="hl-1">));</span>
|
|
26
47
|
</code><button type="button">Copy</button></pre>
|
|
27
48
|
|
|
28
|
-
<
|
|
49
|
+
<h2 id="initializing-fdc3" class="tsd-anchor-link">Initializing FDC3<a href="#initializing-fdc3" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
50
|
+
<p>This library does not produce any global variables. To leverage FDC3 you may use the <code>.getFDC3</code> or <code>.getFDC3Sync</code> apis of a connected <code>InteropClient</code>. (Note that with an interop config provided in <code>connect</code> <code>fin.me.interop</code> is instantiated as an <code>InteropClient</code>)</p>
|
|
29
51
|
<p>Supported versions for <code>fdc3</code> are <code>1.2</code> or <code>2.0</code>.</p>
|
|
30
|
-
<
|
|
52
|
+
<h3 id="example-creating-an-fdc3-client" class="tsd-anchor-link">Example: Creating an FDC3 Client<a href="#example-creating-an-fdc3-client" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h3>
|
|
53
|
+
<pre><code class="typescript"><span class="hl-5">import</span><span class="hl-1"> { </span><span class="hl-6">connect</span><span class="hl-1"> } </span><span class="hl-5">from</span><span class="hl-1"> </span><span class="hl-2">'@openfin/core-web'</span><span class="hl-1">;</span><br/><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">brokerUrl</span><span class="hl-1"> = </span><span class="hl-2">'http://example.com/web-broker'</span><span class="hl-1">;</span><br/><br/><span class="hl-4">// Specify an interopConfig with a specific provider ID and a context group to initialize the `fin.me.interop` client on connection.</span><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">fin</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({</span><br/><span class="hl-1"> </span><span class="hl-6">options:</span><span class="hl-1"> { </span><span class="hl-6">brokerUrl</span><span class="hl-1">, </span><span class="hl-6">interopConfig:</span><span class="hl-1"> { </span><span class="hl-6">providerId:</span><span class="hl-1"> </span><span class="hl-2">'provider-id'</span><span class="hl-1">, </span><span class="hl-6">currentContextGroup:</span><span class="hl-1"> </span><span class="hl-2">'red'</span><span class="hl-1"> } }</span><br/><span class="hl-1">});</span><br/><br/><span class="hl-4">// Set window.fdc3 to an FDC3 2.0 DesktopAgent which is connected to the `provider-id` InteropBroker on the `red' channel.</span><br/><span class="hl-6">window</span><span class="hl-1">.</span><span class="hl-6">fdc3</span><span class="hl-1"> = </span><span class="hl-6">fin</span><span class="hl-1">.</span><span class="hl-6">me</span><span class="hl-1">.</span><span class="hl-6">interop</span><span class="hl-1">.</span><span class="hl-0">getFDC3Sync</span><span class="hl-1">(</span><span class="hl-2">'2.0'</span><span class="hl-1">);</span>
|
|
31
54
|
</code><button type="button">Copy</button></pre>
|
|
32
55
|
|
|
33
56
|
<p>Note that FDC3 support in web is currently limited to context sharing on system channels.</p>
|
|
34
|
-
<
|
|
35
|
-
<
|
|
57
|
+
<h2 id="context-aware-connections-and-connection-inheritance" class="tsd-anchor-link">Context Aware Connections and Connection Inheritance<a href="#context-aware-connections-and-connection-inheritance" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
58
|
+
<p><code>@openfin/core-web</code> has been designed to support inheritance of brokerUrls and interop configurations if your content is running as a View within an OpenFin Layout. This allows content developers to develop platform-agnostic experiences and ensure that they are able to interact with other content connected to the same Web Broker.</p>
|
|
59
|
+
<h2 id="capture-debug-logs-to-your-own-services" class="tsd-anchor-link">Capture debug logs to your own services<a href="#capture-debug-logs-to-your-own-services" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
60
|
+
<p><code>@openfin/core-web</code> enables capturing logs via an optional <code>logger</code> connection option. It accepts an implementation of <code>CustomLogger</code>, which allows you to forward logs to your own logging infrastructure or external services.</p>
|
|
36
61
|
<p>The <code>CustomLogger</code> interface requires four methods: <code>debug</code>, <code>info</code>, <code>warn</code>, and <code>error</code>, each accepting a string message.</p>
|
|
37
|
-
<pre><code class="typescript"><span class="hl-
|
|
62
|
+
<pre><code class="typescript"><span class="hl-5">import</span><span class="hl-1"> { </span><span class="hl-6">connect</span><span class="hl-1">, </span><span class="hl-5">type</span><span class="hl-1"> </span><span class="hl-6">CustomLogger</span><span class="hl-1"> } </span><span class="hl-5">from</span><span class="hl-1"> </span><span class="hl-2">'@openfin/core-web'</span><span class="hl-1">;</span><br/><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">myLogger</span><span class="hl-1">: </span><span class="hl-13">CustomLogger</span><span class="hl-1"> = {</span><br/><span class="hl-1"> </span><span class="hl-0">debug</span><span class="hl-6">:</span><span class="hl-1"> (</span><span class="hl-6">message</span><span class="hl-1">: </span><span class="hl-13">string</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> {...},</span><br/><span class="hl-1"> </span><span class="hl-0">info</span><span class="hl-6">:</span><span class="hl-1"> (</span><span class="hl-6">message</span><span class="hl-1">: </span><span class="hl-13">string</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> {...},</span><br/><span class="hl-1"> </span><span class="hl-0">warn</span><span class="hl-6">:</span><span class="hl-1"> (</span><span class="hl-6">message</span><span class="hl-1">: </span><span class="hl-13">string</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> {...},</span><br/><span class="hl-1"> </span><span class="hl-0">error</span><span class="hl-6">:</span><span class="hl-1"> (</span><span class="hl-6">message</span><span class="hl-1">: </span><span class="hl-13">string</span><span class="hl-1">) </span><span class="hl-3">=></span><span class="hl-1"> {...}</span><br/><span class="hl-1">};</span><br/><br/><span class="hl-3">const</span><span class="hl-1"> </span><span class="hl-7">fin</span><span class="hl-1"> = </span><span class="hl-5">await</span><span class="hl-1"> </span><span class="hl-0">connect</span><span class="hl-1">({</span><br/><span class="hl-1"> ...,</span><br/><span class="hl-1"> </span><span class="hl-6">logger:</span><span class="hl-1"> </span><span class="hl-6">myLogger</span><span class="hl-1">,</span><br/><span class="hl-1"> </span><span class="hl-6">logLevel:</span><span class="hl-1"> </span><span class="hl-2">'debug'</span><br/><span class="hl-1">});</span>
|
|
38
63
|
</code><button type="button">Copy</button></pre>
|
|
39
64
|
|
|
40
65
|
<blockquote>
|
|
41
66
|
<p><strong>Note:</strong> The <code>logger</code> option respects the <code>logLevel</code> setting. Only messages at or above the specified level will get propagated.</p>
|
|
42
67
|
</blockquote>
|
|
43
|
-
<
|
|
68
|
+
<h2 id="api-reference" class="tsd-anchor-link">API Reference<a href="#api-reference" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
69
|
+
<p>(Please note, this link works in your IDE and not on <a href="http://npmjs.com">npmjs.com</a>, we will update this soon.)</p>
|
|
44
70
|
<ul>
|
|
45
71
|
<li><a href="../out/docs/@openfin/core-web/README.md">@openfin/core-web</a></li>
|
|
46
72
|
</ul>
|
|
47
|
-
<
|
|
48
|
-
<
|
|
49
|
-
<li><a href="https://
|
|
73
|
+
<h2 id="see-also" class="tsd-anchor-link">See Also<a href="#see-also" aria-label="Permalink" class="tsd-anchor-icon"><svg viewBox="0 0 24 24" aria-hidden="true"><use href="../assets/icons.svg#icon-anchor"></use></svg></a></h2>
|
|
74
|
+
<ul>
|
|
75
|
+
<li><a href="https://developer.openfin.co/docs/javascript/stable">Fin API reference</a></li>
|
|
76
|
+
<li><a href="https://developers.openfin.co/of-docs/docs/container-overview">OpenFin Container Developer guide</a></li>
|
|
50
77
|
</ul>
|
|
51
|
-
</div></div
|
|
78
|
+
</div></div>
|
|
79
|
+
<div class="col-sidebar">
|
|
80
|
+
<div class="page-menu">
|
|
81
|
+
<div class="tsd-navigation settings">
|
|
82
|
+
<details class="tsd-accordion"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>
|
|
83
|
+
<h3>Settings</h3></summary>
|
|
84
|
+
<div class="tsd-accordion-details">
|
|
85
|
+
<div class="tsd-filter-visibility"><span class="settings-label">Member Visibility</span>
|
|
86
|
+
<ul id="tsd-filter-options">
|
|
87
|
+
<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-inherited" name="inherited" checked/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>Inherited</span></label></li>
|
|
88
|
+
<li class="tsd-filter-item"><label class="tsd-filter-input"><input type="checkbox" id="tsd-filter-external" name="external"/><svg width="32" height="32" viewBox="0 0 32 32" aria-hidden="true"><rect class="tsd-checkbox-background" width="30" height="30" x="1" y="1" rx="6" fill="none"></rect><path class="tsd-checkbox-checkmark" d="M8.35422 16.8214L13.2143 21.75L24.6458 10.25" stroke="none" stroke-width="3.5" stroke-linejoin="round" fill="none"></path></svg><span>External</span></label></li></ul></div>
|
|
89
|
+
<div class="tsd-theme-toggle"><label class="settings-label" for="tsd-theme">Theme</label><select id="tsd-theme"><option value="os">OS</option><option value="light">Light</option><option value="dark">Dark</option></select></div></div></details></div>
|
|
90
|
+
<details open class="tsd-accordion tsd-page-navigation"><summary class="tsd-accordion-summary"><svg width="20" height="20" viewBox="0 0 24 24" fill="none" aria-hidden="true"><use href="../assets/icons.svg#icon-chevronDown"></use></svg>
|
|
91
|
+
<h3>On This Page</h3></summary>
|
|
92
|
+
<div class="tsd-accordion-details"><a href="#openfin-web-application-developer-guide"><span>Openfin <wbr/>Web <wbr/>Application <wbr/>Developer <wbr/>Guide</span></a>
|
|
93
|
+
<ul>
|
|
94
|
+
<li><a href="#first-steps"><span>First <wbr/>Steps</span></a></li>
|
|
95
|
+
<li><a href="#connecting-to-a-web-broker"><span>Connecting to a <wbr/>Web <wbr/>Broker</span></a></li>
|
|
96
|
+
<li>
|
|
97
|
+
<ul>
|
|
98
|
+
<li><a href="#example-basic-connection-setup"><span>Example: <wbr/>Basic <wbr/>Connection <wbr/>Setup</span></a></li></ul></li>
|
|
99
|
+
<li><a href="#setting-a-timeout"><span>Setting a <wbr/>Timeout</span></a></li>
|
|
100
|
+
<li>
|
|
101
|
+
<ul>
|
|
102
|
+
<li><a href="#example-setting-a-timeout"><span>Example: <wbr/>Setting a <wbr/>Timeout</span></a></li></ul></li>
|
|
103
|
+
<li><a href="#setting-up-an-interop-connection"><span>Setting up an <wbr/>Interop <wbr/>Connection</span></a></li>
|
|
104
|
+
<li>
|
|
105
|
+
<ul>
|
|
106
|
+
<li><a href="#example-connecting-to-an-interop-broker"><span>Example: <wbr/>Connecting to an <wbr/>Interop <wbr/>Broker</span></a></li></ul></li>
|
|
107
|
+
<li><a href="#specifying-an-initial-context-group"><span>Specifying an <wbr/>Initial <wbr/>Context <wbr/>Group</span></a></li>
|
|
108
|
+
<li>
|
|
109
|
+
<ul>
|
|
110
|
+
<li><a href="#example-joining-a-default-context-group"><span>Example: <wbr/>Joining a <wbr/>Default <wbr/>Context <wbr/>Group</span></a></li></ul></li>
|
|
111
|
+
<li><a href="#initializing-fdc3"><span>Initializing <wbr/>FDC3</span></a></li>
|
|
112
|
+
<li>
|
|
113
|
+
<ul>
|
|
114
|
+
<li><a href="#example-creating-an-fdc3-client"><span>Example: <wbr/>Creating an <wbr/>FDC3 <wbr/>Client</span></a></li></ul></li>
|
|
115
|
+
<li><a href="#context-aware-connections-and-connection-inheritance"><span>Context <wbr/>Aware <wbr/>Connections and <wbr/>Connection <wbr/>Inheritance</span></a></li>
|
|
116
|
+
<li><a href="#capture-debug-logs-to-your-own-services"><span>Capture debug logs to your own services</span></a></li>
|
|
117
|
+
<li><a href="#api-reference"><span>API <wbr/>Reference</span></a></li>
|
|
118
|
+
<li><a href="#see-also"><span>See <wbr/>Also</span></a></li></ul></div></details></div>
|
|
119
|
+
<div class="site-menu">
|
|
120
|
+
<nav class="tsd-navigation"><a href="../index.html">@openfin/core-web</a>
|
|
121
|
+
<ul class="tsd-small-nested-navigation" id="tsd-nav-container">
|
|
122
|
+
<li>Loading...</li></ul></nav></div></div></div><footer>
|
|
123
|
+
<p class="tsd-generator">Generated using <a href="https://typedoc.org/" target="_blank">TypeDoc</a></p></footer>
|
|
124
|
+
<div class="overlay"></div></body></html>
|