npm package: @ibm-wch-sdk/api-mock
Description: Software development kit to simplify the development of Angular based single page applications against Watson Content Hub.
Latest version: 6.0.524

<a name="_6413c217ac070f0cc888ef237e5f77bca091ed14c4a6b017e8102394c2fc842d"></a>
# ibm-wch-sdk-api

Exposes framework independent APIs for [ibm-wch-sdk-ng](https://www.npmjs.com/package/ibm-wch-sdk-ng) and similar SDK.

## Details

Refer to the [documentation](#_4f5f0d570547cc32a6c26a19831659ff187906f3e173dec4cc7caa8b01b03375).

## Changes

[CHANGELOG](#_20bdb6f8aeaf2e57d73cf0f8f7596ac3a05ab33429cf49a686e6738debcd4512)

## Class documentation

Refer to the [documentation](#_28a07594e891c43454fa39c2c573639385bbf768c0897d05c3db61d89570388b).

<a name="_4f5f0d570547cc32a6c26a19831659ff187906f3e173dec4cc7caa8b01b03375"></a>
# API

* [services](#_2e7dfe61ef2eebf4639dddfd3db5850531fea53c360a5cca7e3920d2b11a3dfb)
* [interfaces](#_e85450ea16246a3e0ff45a1d4454cf0289c2825a0cc4a222723860b94f3a9cdf)
<a name="_20bdb6f8aeaf2e57d73cf0f8f7596ac3a05ab33429cf49a686e6738debcd4512"></a>
# Changelog

## Current

### Added

* Initial version
<a name="_28a07594e891c43454fa39c2c573639385bbf768c0897d05c3db61d89570388b"></a>

Delivery
========

Typescript definitions of the [WCH Delivery APIs](https://developer.ibm.com/api/view/dx-prod:ibm-watson-content-hub:title-IBM_Watson_Content_Hub).

## Index

### External modules

* ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)
* ["interfaces/delivery/v1/rendering/context/rendering.context"](#_0185f15535291ba2d99f8860819d4bdc90c5c488c9b3d156f70d0aac973bd1b7)
* ["interfaces/delivery/v1/site/site.context"](#_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5)

---


<a name="_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8"></a>
[@ibm-wch-sdk/api-mock](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)

# External module: "index"

## Index

---


<a name="_0185f15535291ba2d99f8860819d4bdc90c5c488c9b3d156f70d0aac973bd1b7"></a>
[@ibm-wch-sdk/api-mock](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["interfaces/delivery/v1/rendering/context/rendering.context"](#_0185f15535291ba2d99f8860819d4bdc90c5c488c9b3d156f70d0aac973bd1b7)

# External module: "interfaces/delivery/v1/rendering/context/rendering.context"

## Index

### Variables

* [EMPTY_RENDERING_CONTEXT](#_0185f15535291ba2d99f8860819d4bdc90c5c488c9b3d156f70d0aac973bd1b7)

---

## Variables

<a id="empty_rendering_context"></a>

### `<Const>` EMPTY_RENDERING_CONTEXT

**● EMPTY_RENDERING_CONTEXT**: *`RenderingContext`* =  freezeDeep({
    id: '00000000-0000-0000-0000-000000000000',
    elements: {},
    layouts: {},
    markups: {},
    context: EMPTY_SITE_CONTEXT
})

*Defined in interfaces/delivery/v1/rendering/context/rendering.context.ts:5*

___


<a name="_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5"></a>
[@ibm-wch-sdk/api-mock](#_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0) > ["interfaces/delivery/v1/site/site.context"](#_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5)

# External module: "interfaces/delivery/v1/site/site.context"

## Index

### Variables

* [EMPTY_SITE](#_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5)
* [EMPTY_SITE_CONTEXT](#_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5)

---

## Variables

<a id="empty_site"></a>

### `<Const>` EMPTY_SITE

**● EMPTY_SITE**: *`Site`* =  freezeDeep({
    pages: [],
    id: '00000000-0000-0000-0000-000000000000'
})

*Defined in interfaces/delivery/v1/site/site.context.ts:4*

___
<a id="empty_site_context"></a>

### `<Const>` EMPTY_SITE_CONTEXT

**● EMPTY_SITE_CONTEXT**: *`SiteContext`* =  freezeDeep({
    parent: undefined,
    sibling: [],
    breadcrumb: [],
    children: [],
    site: EMPTY_SITE
})

*Defined in interfaces/delivery/v1/site/site.context.ts:9*

___


<a name="_2e7dfe61ef2eebf4639dddfd3db5850531fea53c360a5cca7e3920d2b11a3dfb"></a>
# Services

* [logging][./logging/]
* [info][./info/]
<a name="_e85450ea16246a3e0ff45a1d4454cf0289c2825a0cc4a222723860b94f3a9cdf"></a>
# Interfaces

* [logging](#_bf82eb0c990fed72cb6202e6637de386337fcd5333c02a2a11eec69abda51324)
* [delivery](#_93acaf358afd2719ba9b61156e5a1692b35bde21ef30536d187fc22f02dbc33e)
* [sdk](#_68e84d440988b4bf8d61b2879ed7ad2d519769630167e4b8e0da3e7c3a44ea39)
* [messages](#_0457e4c7a4d5f3d3229398309f2c7232155d4eab86b58baf4b4a1f08b68e9ac0)
<a name="_96fdf8c61d5bb26367a408e8d5dba5da59ddf12345ac319ff3123e2c56e986f0"></a>

Delivery
========

Typescript definitions of the [WCH Delivery APIs](https://developer.ibm.com/api/view/dx-prod:ibm-watson-content-hub:title-IBM_Watson_Content_Hub).

## Index

### External modules

* ["index"](#_d53838c3180bb9a0e5494e993ceb8942c9866e807f2cfe89645b7e36005a0cf8)
* ["interfaces/delivery/v1/rendering/context/rendering.context"](#_0185f15535291ba2d99f8860819d4bdc90c5c488c9b3d156f70d0aac973bd1b7)
* ["interfaces/delivery/v1/site/site.context"](#_7a3c20cbecc6cb9f80b672797a7d6dac6f4c1b6d37af31ef5e6a0e89e682ceb5)

---


<a name="_bf82eb0c990fed72cb6202e6637de386337fcd5333c02a2a11eec69abda51324"></a>
# Logging

The logger interfaces allow to plug custom loggers via the `LoggerFactory`. In addition they expose a simple logger interface, modelled after the standard console logger.

<a name="_93acaf358afd2719ba9b61156e5a1692b35bde21ef30536d187fc22f02dbc33e"></a>
# Delivery

Typescript definitions of the [WCH Delivery APIs](https://developer.ibm.com/api/view/dx-prod:ibm-watson-content-hub:title-IBM_Watson_Content_Hub).
<a name="_68e84d440988b4bf8d61b2879ed7ad2d519769630167e4b8e0da3e7c3a44ea39"></a>
# WchSdk

The SDK defines the plain JS WCH SDK APIs .

## Properties

* [router](#_0557eb1307e18251a07c49f9eee2260c7f975c23eae7e0d6fdba3bc0c1662083)
* [version](#_b0a3f94cae004a78e2ce40a0220853a2c7b3d876b525909f1f03d6212be15ca6) the current version of the SDK, including a version number and the build date

## Methods

* `refresh()`: causes the currently displayed data to be refreshed

The SDK is available on the global window object

```javascript
window.WchSdk
```

## Cross Origin Eventing

The SDK supports [WebMessaging](https://www.w3.org/TR/webmessaging/) to allow communication across frames via the [postMessage](https://www.w3.org/TR/webmessaging/#dom-window-postmessage) functionality. Each message sent to the SDK needs to contain a `type` and an `id` field. The type is used to identify the meaning of the message, the id to allow the caller to correlate potential responses.

Responses to messages sent to the iframe (e.g. messages back from the SDK to the parent frame) can optionally use [channelMessaging](https://www.w3.org/TR/webmessaging/#channel-messaging). If the first element of the transfer object contains a [messagePort](https://www.w3.org/TR/webmessaging/#messageport), this will be used for reply messages or notifications. Else these replies will be sent against the parent window, directly.

### Supported Message Types

* `WchSdk.refresh`: refreshes the data currently displayed by the application. The message has no response.
* `WchSdk.router.navigateByPath`: navigates to the specified path. Responds with a `WchSdk.router.navigateByPathResponse` response. Takes:
    * `path`: path to navigate to
* `WchSdk.router.activeRoute.subscribe`: subscribes a listener for changes in the active route (i.e. navigations). The event will be responsed by a response containing a handle that can be used to unsubscribe. Whenever a navigation occurs, the SDK will send a `WchSdk.router.activeRoute` message to the caller.
* `WchSdk.router.route.subscribe`: subscribes a listener for changes for a given route. The event will be responsed by a response containing a handle that can be used to unsubscribe. Whenever the route changes, comes into existence or is deleted, the SDK will send a `WchSdk.router.route` message to the caller. Takes:
    * `route`: a string or string array that describes the route to listen to. If the value is a string, then it must be the escaped path, starting with a slash but not ending with a slash. If it is a string array, each value represents the unescaped path segment, the segments to not contain slashes.
* `WchSdk.unsubscribe`: unsubscribes from a subscription given the subscription handle
    * `handle`: the subscription handle

### Supported Response Types

* `WchSdk.router.navigateByPathResponse`: sent as a response to a `WchSdk.router.navigateByPath` message from the SDK to the caller. Replicates the caller message fields and in addition:
    * `success`: true if the navigation completed, else false
    * `error`: an optional error object
* `WchSdk.router.activeRoute.subscribeResponse`: sent as a response to `WchSdk.router.activeRoute.subscribe`.
    * `handle`: handle to the subscription, can be used to unsubscribe
* `WchSdk.router.route.subscribeResponse`: sent as a response to `WchSdk.router.route.subscribe`.
    * `handle`: handle to the subscription, can be used to unsubscribe
* `WchSdk.router.activeRoute`: sent from the SDK to the subscriber for modifications in the navigation.
    * `page`: The selected page. Will be `null` if this is the last event (e.g. because of an application shutdown)

## Examples

### Listen for Navigation Events

This example shows how a parent frame can listen for navigation events of an SPA. The example uses [channelMessaging](https://www.w3.org/TR/webmessaging/#channel-messaging) to establish a direct communication channel from the SDK to the parent frame. Navigation events will be sent via this channel.

Note that the use of a channel is not required. If no channel is passed in, the navigation events will be sent directly to the parent window via [postMessage](https://www.w3.org/TR/webmessaging/#dom-window-postmessage).

The example doe NOT show how to unsubscribe.

```javascript
/**
 * Message sent to the SDK to subscribe for navigation notifications
*/
var msg = {
	type: 'WchSdk.router.activeRoute.subscribe',
	id: 'someid'
};

// use a message channel to receive the responses
var channel = new MessageChannel();

/** Perform  the subscription, transfer one end of the channel to the SDK.
 * Note that the second parameter is the origin of the iframe.
*/
myframe.contentWindow.postMessage(msg, "http://localhost:4200", [channel.port2]);

/**
 * Listen for changes in the navigation
 * We expect two types of callbacks here, one for each navigation event
 * and a response sending the subscription handle, so we can unsubscribe later.
 */
channel.port1.addEventListener('message', msg => {
  // check for the message type
  const data = msg.data;
  if (data.type === 'WchSdk.router.activeRoute') {
    // log the active route
	console.log('navigation in iframe', data.page.route);
  } else
  if (data.type === 'WchSdk.router.activeRoute.subscribeResponse') {
	console.log('subscription handle', data.handle);
  }

});
// start the bi-directional communication
channel.port1.start();
```

<a name="_0457e4c7a4d5f3d3229398309f2c7232155d4eab86b58baf4b4a1f08b68e9ac0"></a>
# Messaging

## Cross Origin Eventing

The SDK supports [WebMessaging](https://www.w3.org/TR/webmessaging/) to allow communication across frames via the [postMessage](https://www.w3.org/TR/webmessaging/#dom-window-postmessage) functionality. Each message sent to the SDK needs to contain a `type` and an `id` field. The type is used to identify the meaning of the message, the id to allow the caller to correlate potential responses.

Responses to messages sent to the iframe (e.g. messages back from the SDK to the parent frame) can optionally use [channelMessaging](https://www.w3.org/TR/webmessaging/#channel-messaging). If the first element of the transfer object contains a [messagePort](https://www.w3.org/TR/webmessaging/#messageport), this will be used for reply messages or notifications. Else these replies will be sent against the parent window, directly.

### Supported Message Types

* `WchSdk.refresh`: refreshes the data currently displayed by the application. The message has no response.
* `WchSdk.router.navigateByPath`: navigates to the specified path. Responds with a `WchSdk.router.navigateByPathResponse` response. Takes:
    * `path`: path to navigate to
* `WchSdk.router.activeRoute.subscribe`: subscribes a listener for changes in the active route (i.e. navigations). The event will be responsed by a response containing a handle that can be used to unsubscribe. Whenever a navigation occurs, the SDK will send a `WchSdk.router.activeRoute` message to the caller.
* `WchSdk.router.route.subscribe`: subscribes a listener for changes for a given route. The event will be responsed by a response containing a handle that can be used to unsubscribe. Whenever the route changes, comes into existence or is deleted, the SDK will send a `WchSdk.router.route` message to the caller. Takes:
    * `route`: a string or string array that describes the route to listen to. If the value is a string, then it must be the escaped path, starting with a slash but not ending with a slash. If it is a string array, each value represents the unescaped path segment, the segments to not contain slashes.
* `WchSdk.unsubscribe`: unsubscribes from a subscription given the subscription handle
    * `handle`: the subscription handle

### Supported Response Types

* `WchSdk.router.navigateByPathResponse`: sent as a response to a `WchSdk.router.navigateByPath` message from the SDK to the caller. Replicates the caller message fields and in addition:
    * `success`: true if the navigation completed, else false
    * `error`: an optional error object
* `WchSdk.router.activeRoute.subscribeResponse`: sent as a response to `WchSdk.router.activeRoute.subscribe`.
    * `handle`: handle to the subscription, can be used to unsubscribe
* `WchSdk.router.route.subscribeResponse`: sent as a response to `WchSdk.router.route.subscribe`.
    * `handle`: handle to the subscription, can be used to unsubscribe
* `WchSdk.router.activeRoute`: sent from the SDK to the subscriber for modifications in the navigation.
    * `page`: The selected page. Will be `null` if this is the last event (e.g. because of an application shutdown)

## Examples

### Listen for Navigation Events

This example shows how a parent frame can listen for navigation events of an SPA. The example uses [channelMessaging](https://www.w3.org/TR/webmessaging/#channel-messaging) to establish a direct communication channel from the SDK to the parent frame. Navigation events will be sent via this channel.

Note that the use of a channel is not required. If no channel is passed in, the navigation events will be sent directly to the parent window via [postMessage](https://www.w3.org/TR/webmessaging/#dom-window-postmessage).

The example doe NOT show how to unsubscribe.

```javascript
/**
 * Message sent to the SDK to subscribe for navigation notifications
*/
var msg = {
	type: 'WchSdk.router.activeRoute.subscribe',
	id: 'someid'
};

// use a message channel to receive the responses
var channel = new MessageChannel();

/** Perform  the subscription, transfer one end of the channel to the SDK.
 * Note that the second parameter is the origin of the iframe.
*/
myframe.contentWindow.postMessage(msg, "http://localhost:4200", [channel.port2]);

/**
 * Listen for changes in the navigation
 * We expect two types of callbacks here, one for each navigation event
 * and a response sending the subscription handle, so we can unsubscribe later.
 */
channel.port1.addEventListener('message', msg => {
  // check for the message type
  const data = msg.data;
  if (data.type === 'WchSdk.router.activeRoute') {
    // log the active route
	console.log('navigation in iframe', data.page.route);
  } else
  if (data.type === 'WchSdk.router.activeRoute.subscribeResponse') {
	console.log('subscription handle', data.handle);
  }

});
// start the bi-directional communication
channel.port1.start();
```

<a name="_0557eb1307e18251a07c49f9eee2260c7f975c23eae7e0d6fdba3bc0c1662083"></a>
# WchSdkRouter

The SDK router allows to navigate to WCH pages or components.

## Methods

* `navigateByPath(path: string): PromiseLike<boolean>`: navigates to a WCH component given its path. The path can be read from the site information in the [RenderingContext](#_906e04b82a255a705cd1d41db3203c7fabc2ca96596c041a7d4dd4975bf6554d). The return value indicates when this navigation has completed.
* `activeRoute(): Observable<SitePage>`: returns the active route in form of a page reference
* `activeRenderingContext(): Observable<RenderingContext>`: returns the active rendering context
<a name="_b0a3f94cae004a78e2ce40a0220853a2c7b3d876b525909f1f03d6212be15ca6"></a>
# WchSdkVersion

Defines version number and build date.
<a name="_906e04b82a255a705cd1d41db3203c7fabc2ca96596c041a7d4dd4975bf6554d"></a>
## RenderingContext

Refer to the [design document](https://github.ibm.com/DX/squad-publishing-runtime/wiki/Rendering-Context) or the [documentation](https://developer.ibm.com/customer-engagement/docs/wch/rendering/) for more details about the structure.

The basic structure of elements is described in the [Authoring content](https://developer.ibm.com/customer-engagement/docs/wch/authoring-content/) section.