@ibm-wch-sdk/edit-api NPM

ibm-wch-sdk-edit-api

Exposes framework independent APIs for ibm-wch-sdk-edit-ng and similar SDKs.

Changes

CHANGELOG

Details

Refer to the documentation.

Class documentation

Refer to the documentation.

Changelog

Current

Added

Expose ActivePageService as active-page module to the edit provider

6.0.69

Changed

Added compatibility layer for EventTargetLike
Improved readme

Added

Initial version

Edit API

The edit API defines interfaces for consumers and providers of inline edit functionality.

interfaces: list of interfaces a consumer of the inline edit API can use to interact with a provider of this functionality.
provider: list of interfaces a provider of the inline edit API has to satisfy
modules: modules that the provider can use as context from the consuming host.

@ibm-wch-sdk/edit-api

Index

Interfaces

This section describes the interfaces exposed by the module.

WchInlineEditService

The WchInlineEditService interface allows a client to interact with the inline edit implementation. The implementation of this interface makes sure to load the inline edit provider and to fulfill the interface contract with the provider.

A consumer of this interface calls the registerComponent message for each HTML element that is supposed to be edited. The result of this call is an Observable. The inline edit registration begins as soon as someone subscribes to this observable and ends as soon as this subscription ends. It is in the responsibility of the consumer to make sure that the HTML element exists for the duration of the subscription.

Provider

The edit provider is a piece of javascript code that implements inline edit functionality. It is dynamically loaded by the SPA (typically via the SDK). The provider needs to conform to the following pattern:

Initialization

The edit module implements the WchInlineEditProvider interface, i.e. it exposes a register function. This function will be invoked for each editable HTML element and allows the edit provider to attach the desired edit hooks to the elements. The method is provided with:

a reference to the actual HTML element
an accessor expression that identifies the element on a content item to be edited. This expression is relative to the current rendering context
a reactive stream of rendering contexts. Note that the rendering contexts can change during the lifetime of this registration. Also there is no guarantee that the element pointed to by the accessor actually exists on the context. If a provide subscribes to the sequence of rendering contexts, it needs to make sure to NOT throw an exception in the subscribe block under any circumstances

Result

The result of a registration is an event provider. The purpose of this provider is to communicate inline edit operations on the HTML element to the host, i.e. the host registers for events on that event provider and the edit provider is responsible to firing these events (if the event is supported).

The event provider can optionally implement the Disposable interface. If implemented the host will call its dispose method after registration, before the HTML element gets removed from the DOM (so it's the inverse operation to the registration call).

Notifications

The implementor of the WchInlineEditProvider can optionally also implement the EventTargetLike interface, i.e. be an event emitter. This allows the provider to communicate information to the SDK, e.g. about enabled or disabled inline edit mode.

Currently supported notifications are:

wchInlineEditStart to notify about entering inline edit mode
wchInlineEditEnd to notify about leaving inline edit mode

Modules

The inline-edit-provider can use the global require function to access functionality (modules) provided by the edit host. The result of the require call is a Promise that resolves to an API object. This section lists the available modules.

WCH_LOGGER_MODULE

The wch-logger module provides access the to logging APIs. Edit providers are encouraged to use this API instead of the console to issue logging statements (see LoggerService).

WCH_INFO_MODULE

The wch-info module exposes information about the entry point URLs and whether or not the system is in preview mode or in live mode (see UrlConfig).

WCH_CONFIG_MODULE

The wch-config module exposes information about configured URLs for the current tenant, e.g. the URL to the authoring host.

WCH_ACTIVE_PAGE_MODULE

The wch-active-page module exposes the ActivePage interface.

@ibm-wch-sdk/edit-api > "compat"

External module: "compat"

Index

Interfaces

HasEventTargetAddRemove
JQueryStyleEventEmitter
NodeStyleEventEmitter

Type aliases

EventTargetLike
NodeEventHandler

Type aliases

EventTargetLike

Ƭ EventTargetLike: HasEventTargetAddRemove<T> | NodeStyleEventEmitter | JQueryStyleEventEmitter

Defined in compat.ts:39

NodeEventHandler

Ƭ NodeEventHandler: function

Defined in compat.ts:19

Type declaration

▸(...args: any[]): void

Parameters:

Param	Type
`Rest` args	`any`[]

Returns: void

@ibm-wch-sdk/edit-api > "index"

External module: "index"

Index

@ibm-wch-sdk/edit-api > "interfaces/inline.edit.service"

External module: "interfaces/inline.edit.service"

Index

Interfaces

WchInlineEditService

Type aliases

AccessorType

Type aliases

AccessorType

Ƭ AccessorType: string | null

Defined in interfaces/inline.edit.service.ts:8

@ibm-wch-sdk/edit-api > "modules/modules"

External module: "modules/modules"

Index

Variables

WCH_ACTIVE_PAGE_MODULE
WCH_CONFIG_MODULE
WCH_HTTP_MODULE
WCH_INFO_MODULE
WCH_LOGGER_MODULE

Variables

`<Const>` WCH_ACTIVE_PAGE_MODULE

● WCH_ACTIVE_PAGE_MODULE: "wch-active-page" = "wch-active-page"

Defined in modules/modules.ts:15

Token used to require the active page service see: PromiseLike

`<Const>` WCH_CONFIG_MODULE

● WCH_CONFIG_MODULE: "wch-config" = "wch-config"

Defined in modules/modules.ts:36

Token used to require the WchConfig service see: PromiseLike

`<Const>` WCH_HTTP_MODULE

● WCH_HTTP_MODULE: "wch-http" = "wch-http"

Defined in modules/modules.ts:8

Token used to access the http service see: PromiseLike

`<Const>` WCH_INFO_MODULE

● WCH_INFO_MODULE: "wch-info" = "wch-info"

Defined in modules/modules.ts:29

Token used to require the [[WchInfo]] service see: PromiseLike

`<Const>` WCH_LOGGER_MODULE

● WCH_LOGGER_MODULE: "wch-logger" = "wch-logger"

Defined in modules/modules.ts:22

WchInlineEditProvider

Type aliases

WchInlineEditRegistration
WchInlineEditRegistrationResult

Type aliases

WchInlineEditRegistration

Ƭ WchInlineEditRegistration: function

Defined in provider/inline.edit.provider.ts:11

Type declaration

▸(nativeElement: any, accessor: AccessorType, onRenderingContext: Observable<RenderingContext>): WchInlineEditRegistrationResult

Parameters:

Param	Type
nativeElement	`any`
accessor	AccessorType
onRenderingContext	`Observable`<`RenderingContext`>

Returns: WchInlineEditRegistrationResult

WchInlineEditRegistrationResult

Ƭ WchInlineEditRegistrationResult: * EventTargetLike<any> | EventTargetLike<any> & Disposable

Defined in provider/inline.edit.provider.ts:9

@ibm-wch-sdk/edit-api

Index

External modules

"compat"
"index"
"interfaces/inline.edit.service"
"modules/modules"
"modules/wch.config"
"provider/disposable"
"provider/editable.event"
"provider/inline.edit.event"
"provider/inline.edit.provider"

@ibm-wch-sdk/edit-api > "compat" > HasEventTargetAddRemove

Interface: HasEventTargetAddRemove

Type parameters

E

Hierarchy

HasEventTargetAddRemove

Index

Methods

addEventListener
removeEventListener

Methods

addEventListener

▸ addEventListener(type: string, listener: function | null, options?: boolean | AddEventListenerOptions): void

Defined in compat.ts:27

Parameters:

Param	Type
type	`string`
listener	`function` \| `null`
`Optional` options	`boolean` \| `AddEventListenerOptions`

Returns: void

removeEventListener

▸ removeEventListener(type: string, listener?: function | null, options?: EventListenerOptions | boolean): void

Defined in compat.ts:32

Parameters:

Param	Type
type	`string`
`Optional` listener	`function` \| `null`
`Optional` options	`EventListenerOptions` \| `boolean`

Returns: void

@ibm-wch-sdk/edit-api > "compat" > JQueryStyleEventEmitter

Interface: JQueryStyleEventEmitter

Hierarchy

JQueryStyleEventEmitter

Index

Properties

off

● off: function

Defined in compat.ts:23

Type declaration

▸(eventName: string, handler: Function): void

Parameters:

Param	Type
eventName	`string`
handler	`Function`

Returns: void

on

● on: function

Defined in compat.ts:22

Type declaration

▸(eventName: string, handler: Function): void

Parameters:

Param	Type
eventName	`string`
handler	`Function`

Returns: void

@ibm-wch-sdk/edit-api > "compat" > NodeStyleEventEmitter

Interface: NodeStyleEventEmitter

These definitons have basically been copied from

https://github.com/ReactiveX/rxjs/blob/master/src/internal/observable/fromEvent.ts

because they are not exported from rxjs. Apparently this is intended by the rxjs authors:

https://github.com/ReactiveX/rxjs/issues/3658

Hierarchy

NodeStyleEventEmitter

Index

Properties

addListener
removeListener

Properties

addListener

● addListener: function

Defined in compat.ts:12

Type declaration

▸(eventName: string | symbol, handler: NodeEventHandler): this

Parameters:

Param	Type
eventName	`string` \| `symbol`
handler	NodeEventHandler

Returns: this

removeListener

● removeListener: function

Defined in compat.ts:13

Type declaration

▸(eventName: string | symbol, handler: NodeEventHandler): this

Parameters:

Param	Type
eventName	`string` \| `symbol`
handler	NodeEventHandler

Returns: this

@ibm-wch-sdk/edit-api > "interfaces/inline.edit.service" > WchInlineEditService

Interface: WchInlineEditService

Implementation of the edit service used by the wchEditable directive.

Hierarchy

WchInlineEditService

Index

Methods

fromEvent
registerComponent

Methods

fromEvent

▸ fromEvent<T>(aName: string): Observable<T>

Defined in interfaces/inline.edit.service.ts:39

Attaches to an event issued by the edit library

Type parameters:

T

Parameters:

Param	Type	Description
aName	`string`	name of the event

Returns: Observable<T>

registerComponent

▸ registerComponent(nativeElement: any, accessor: AccessorType, onRenderingContext: Observable<RenderingContext>): Observable<EventTargetLike<any>>

Defined in interfaces/inline.edit.service.ts:27

Registers a particular DOM element as editable

Parameters:

Param	Type	Description
nativeElement	`any`	the DOM element to be edited
accessor	AccessorType	string identifying the member in the content item record to be edited. The value of 'null' means the the content item itself will be edited.
onRenderingContext	`Observable`<`RenderingContext`>	the rendering context associated with the edit operation. The same DOM element might represent multiple contexts over time

Returns: Observable<EventTargetLike<any>> the observable representing the registration result. The observable exposes an event producer that a client can attach to to receive edit events. The registration will only take place when subscribing to the observable and it will end when unsubscribing.

@ibm-wch-sdk/edit-api > "modules/wch.config" > WchConfig