[ADF-1549] Removed doc content from library README files (#2400)

* [ADF-1549] Removed doc content from library README files

* [ADF-1549] Removed doc content from library README files

* [ADF-1583] Fix change detection error (the quick way) (#2396)

* Fix change detection error (the quick way)

* Fix it the second time

* raise keyboard events, improve task list keyboard handling (#2401)

* [ADF-1549] Removed doc content from library README files

* [ADF-1549] Added doc update from Tasklist readme

docIndex.md

@@ -315,6 +315,7 @@ for more information about installing and using the source code.
 ### Directives
 
 - [Context menu directive](docs/context-menu.directive.md)
+- [Logout directive](docs/logout.directive.md)
 - [Node permission directive](docs/node-permission.directive.md)
 - [Upload directive](docs/upload.directive.md)
 - [*Mdl menu directive](ng2-components/ng2-alfresco-core/src/components/material/mdl-menu.directive.ts)

docs/document-list.component.md

@@ -89,6 +89,7 @@ The properties currentFolderId, folderNode and node are the entry initialization
 | allowDropFiles | boolean | false | Toggle file drop support for rows (see **ng2-alfresco-core/UploadDirective** for more details) |
 | sorting | string[] | | Defines default sorting. The format is an array of 2 strings `[key, direction]` i.e. `['name', 'desc']` or `['name', 'asc']`. Set this value only if you want to override default sorting detected by the component based on columns. |
 | locationFormat | string | '/' | The default route for all the location-based columns (if declared). |
+| supportedPageSizes | number[] | [5, 10, 15, 20] | Supported page sizes for the pagination component. You can also use application configuration file to set it as a global setting using `document-list.supportedPageSizes` key. |
 
 ### Events
 

docs/logout.directive.md

@@ -0,0 +1,26 @@
+# Logout directive
+
+Logs the user out when the decorated element is clicked.
+
+<!-- markdown-toc start - Don't edit this section.  npm run toc to generate it-->
+
+<!-- toc -->
+
+- [Basic Usage](#basic-usage)
+
+<!-- tocstop -->
+
+<!-- markdown-toc end -->
+
+## Basic Usage
+
+```html
+<button adf-logout>Logout</button>
+```
+
+<!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
+<!-- seealso start -->
+## See also
+
+- [Login component](login.component.md)
+<!-- seealso end -->

docs/seeAlsoGraph.json

@@ -37,7 +37,8 @@
     "info-drawer.component": ["info-drawer-layout.component"],
     "info-drawer-layout.component": [],
     "like.component": ["rating.component"],
-    "login.component": [],
+    "login.component": ["logout.directive"],
+    "logout.directive": [],
     "metadata-indicators": [],
     "node-permission.directive": [],
     "notification.service": [],

docs/tasklist.component.md

@@ -48,6 +48,8 @@ You can also use HTML-based schema declaration like shown below:
 | page | number | 0 | The page of the tasks to fetch. |
 | size | number | 5 | The number of tasks to fetch. |
 | assignment | string || The assignment of the process. <ul>Possible values are: <li>assignee : where the current user is the assignee</li> <li>candidate: where the current user is a task candidate </li><li>group_x: where the task is assigned to a group where the current user is a member of.</li> <li>no value: where the current user is involved</li> </ul> |
+| selectionMode | string | 'single' | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows.  | 
+| multiselect | boolean | false | Toggles multiple row selection, renders checkboxes at the beginning of each row | 
 | state | string || Define state of the processes. Possible values are: `completed`, `active` |
 | hasIcon | boolean | true | Toggle the icon on the left . |
 | landingTaskId | string | | Define which task id should be selected after the reloading. If the task id doesn't exist or nothing is passed it will select the first task |
@@ -60,6 +62,7 @@ You can also use HTML-based schema declaration like shown below:
 | --- | --- |
 | onSuccess | Raised when the task list is loaded |
 | rowClick | Raised when the task in the list is clicked |
+| rowsSelected | Raised when the a row is selected/unselected | 
 
 ## Details
 

ng2-components/README.md

@@ -1,215 +1,40 @@
 # Alfresco Angular Components
 
-**NOTE:** We are in the process of transferring docs from the component library
-README files to a new system. This file lists all the docs currently in the
-READMEs but the complete index for the docs can now be found in the
-[Component Docs Index](../docIndex.md).
-
 <!-- markdown-toc start - Don't edit this section.  npm run toc to generate it-->
 
 <!-- toc -->
 
-- [Guide](#guide)
+- [Documentation](#documentation)
-- [Core](#core)
+- [Libraries](#libraries)
-  * [Components](#components)
-  * [Directives](#directives)
-- [Content services](#content-services)
-  * [Components](#components-1)
-- [Process services](#process-services)
-  * [components](#components)
-- [Services](#services)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Guide
+## Documentation
 
-- [Theming](../docs/theming.md)
+The [docs index](../docIndex.md) lists all available documentation for components and
+also includes a user guide that explains techniques in greater detail.
 
-## Core
+## Libraries
 
-### Components
+ADF consists of 16 libraries. Click the links below to see the README files for the
+libraries, which contain information about installing, prerequisites, license and other
+details about the sources.
 
-<!-- CORE START-->
+- [ADF Analytics](ng2-activiti-analytics/README.md)
-- [adf-accordion](ng2-alfresco-core/README.md)
+- [ADF Diagrams](ng2-activiti-diagrams/README.md)
-- [adf-accordion-group](ng2-alfresco-core/README.md)
+- [ADF Form](ng2-activiti-form/README.md)
-- [adf-card-view](ng2-alfresco-core/README.md)
+- [ADF Processlist](ng2-activiti-processlist/README.md)
-- [adf-card-view-textitem](ng2-alfresco-core/README.md)
+- [ADF Tasklist](ng2-activiti-tasklist/README.md)
-- [adf-card-view-mapitem](ng2-alfresco-core/README.md)
+- [ADF Core](ng2-alfresco-core/README.md)
-- [adf-card-view-dateitem](ng2-alfresco-core/README.md)
+- [ADF Datatable](ng2-alfresco-datatable/README.md)
-- [adf-card-view-item-dispatcher](ng2-alfresco-core/README.md)
+- [ADF Documentlist](ng2-alfresco-documentlist/README.md)
-- [adf-toolbar](ng2-alfresco-core/README.md)
+- [ADF Login](ng2-alfresco-login/README.md)
-- [adf-toolbar-title](ng2-alfresco-core/README.md)
+- [ADF Search](ng2-alfresco-search/README.md)
-- [adf-toolbar-divider](ng2-alfresco-core/README.md)
+- [ADF Social](ng2-alfresco-social/README.md)
-- [adf-pagination](ng2-alfresco-core/README.md)
+- [ADF Tag](ng2-alfresco-tag/README.md)
-- [adf-context-menu-holder](ng2-alfresco-core/README.md)
+- [ADF Upload](ng2-alfresco-upload/README.md)
-- [adf-info-drawer-layout](ng2-alfresco-core/README.md)
+- [ADF Userinfo](ng2-alfresco-userinfo/README.md)
-- [adf-info-drawer-tab](ng2-alfresco-core/README.md)
+- [ADF Viewer](ng2-alfresco-viewer/README.md)
-- [adf-download-zip-dialog](ng2-alfresco-core/README.md)
+- [ADF Webscript](ng2-alfresco-webscript/README.md)
-- [adf-create-folder-dialog](ng2-alfresco-core/README.md)<!-- CORE END-->
-<!-- CORE END-->
-
-### Directives
-
-<!-- CORE DIRECTIVE START-->
-- [adf-card-view-content-proxy](ng2-alfresco-core/README.md)
-- [adf-context-menu](ng2-alfresco-core/README.md)
-- [adf-mdl-menu](ng2-alfresco-core/README.md)
-- [adf-mdl-textfield](ng2-alfresco-core/README.md)
-- [adf-upload](ng2-alfresco-core/README.md)
-- [adf-node-permission](ng2-alfresco-core/README.md)
-- [adf-highlight](ng2-alfresco-core/README.md)<!-- CORE DIRECTIVE END-->
-
-## Content services
-
-### Components
-
-<!-- CONTENT START-->
-- [adf-webscript-get](ng2-alfresco-webscript/README.md)
-- [adf-file-uploading-dialog](ng2-alfresco-upload/README.md)
-- [adf-file-uploading-list](ng2-alfresco-upload/README.md)
-- [adf-upload-drag-area](ng2-alfresco-upload/README.md)
-- [adf-upload-button](ng2-alfresco-upload/README.md)
-- [adf-file-uploading-list-row](ng2-alfresco-upload/README.md)
-- [adf-userinfo](ng2-alfresco-userinfo/README.md)
-- [adf-login](ng2-alfresco-login/README.md)
-- [adf-location-cell](ng2-alfresco-datatable/README.md)
-- [adf-empty-list](ng2-alfresco-datatable/README.md)
-- [adf-datatable](ng2-alfresco-datatable/README.md)
-- [adf-tag-node-list](ng2-alfresco-tag/README.md)
-- [adf-tag-list](ng2-alfresco-tag/README.md)
-- [adf-search](ng2-alfresco-search/README.md)
-- [adf-tag-node-actions-list](ng2-alfresco-tag/README.md)
-- [adf-search-control](ng2-alfresco-search/README.md)
-- [adf-search-autocomplete](ng2-alfresco-search/README.md)
-- [adf-datatable-cell](ng2-alfresco-datatable/README.md)
-- [adf-viewer-dialog](ng2-alfresco-viewer/README.md)
-- [adf-txt-viewer](ng2-alfresco-viewer/README.md)
-- [adf-pdf-viewer](ng2-alfresco-viewer/README.md)
-- [adf-not-supported-format](ng2-alfresco-viewer/README.md)
-- [adf-media-player](ng2-alfresco-viewer/README.md)
-- [adf-viewer](ng2-alfresco-viewer/README.md)
-- [adf-img-viewer](ng2-alfresco-viewer/README.md)
-- [adf-rating](ng2-alfresco-social/README.md)
-- [adf-like](ng2-alfresco-social/README.md)
-- [adf-sites-dropdown](ng2-alfresco-documentlist/README.md)
-- [adf-content-node-selector](ng2-alfresco-documentlist/README.md)
-- [adf-dropdown-breadcrumb](ng2-alfresco-documentlist/README.md)
-- [adf-breadcrumb](ng2-alfresco-documentlist/README.md)
-- [adf-document-list](ng2-alfresco-documentlist/README.md)<!-- CONTENT END-->
-<!-- CONTENT END-->
-
-<!-- CONTENT DIRECTIVE START--><!-- CONTENT DIRECTIVE END-->
-
-## Process services
-
-### components
-
-<!-- BUSINESS START-->
-- [adf-diagram-publish-task](ng2-activiti-diagrams/README.md)
-- [adf-text-editor](ng2-activiti-form/README.md)
-- [adf-dropdown-editor](ng2-activiti-form/README.md)
-- [adf-date-editor](ng2-activiti-form/README.md)
-- [adf-boolean-editor](ng2-activiti-form/README.md)
-- [adf-unknown-widget](ng2-activiti-form/README.md)
-- [adf-date-range-widget](ng2-activiti-analytics/README.md)
-- [adf-diagram-sequence-flow](ng2-activiti-diagrams/README.md)
-- [adf-diagram](ng2-activiti-diagrams/README.md)
-- [adf-tasklist](ng2-activiti-tasklist/README.md)
-- [adf-process-instance-details](ng2-activiti-processlist/README.md)
-- [adf-start-process](ng2-activiti-processlist/README.md)
-- [adf-process-instance-list](ng2-activiti-processlist/README.md)
-- [adf-process-instance-tasks](ng2-activiti-processlist/README.md)
-- [adf-process-instance-variables](ng2-activiti-processlist/README.md)
-- [adf-process-instance-header](ng2-activiti-processlist/README.md)
-- [adf-process-instance-filters](ng2-activiti-processlist/README.md)
-- [adf-process-instance-comments](ng2-activiti-processlist/README.md)
-- [adf-process-attachment-list](ng2-activiti-processlist/README.md)
-- [adf-create-process-attachment](ng2-activiti-processlist/README.md)
-- [adf-task-header](ng2-activiti-tasklist/README.md)
-- [adf-filters](ng2-activiti-tasklist/README.md)
-- [adf-task-attachment-list](ng2-activiti-tasklist/README.md)
-- [adf-people](ng2-activiti-tasklist/README.md)
-- [adf-task-details](ng2-activiti-tasklist/README.md)
-- [adf-start-task](ng2-activiti-tasklist/README.md)
-- [adf-people-list](ng2-activiti-tasklist/README.md)
-- [adf-people-search](ng2-activiti-tasklist/README.md)
-- [adf-create-task-attachment](ng2-activiti-tasklist/README.md)
-- [adf-comments](ng2-activiti-tasklist/README.md)
-- [adf-comment-list](ng2-activiti-tasklist/README.md)
-- [adf-checklist](ng2-activiti-tasklist/README.md)
-- [adf-apps](ng2-activiti-tasklist/README.md)
-- [adf-content](ng2-activiti-form/README.md)
-- [adf-form-field](ng2-activiti-form/README.md)
-- [adf-start-form](ng2-activiti-form/README.md)
-- [adf-form](ng2-activiti-form/README.md)
-- [adf-form-list](ng2-activiti-form/README.md)
-- [adf-analytics](ng2-activiti-analytics/README.md)
-- [adf-analytics-report-parameters](ng2-activiti-analytics/README.md)
-- [adf-analytics-report-list](ng2-activiti-analytics/README.md)
-- [adf-analytics-report-heat-map](ng2-activiti-analytics/README.md)
-- [adf-analytics-generator](ng2-activiti-analytics/README.md)<!-- BUSINESS END-->
-<!-- BUSINESS END-->
-
-<!-- BUSINESS DIRECTIVE START--><!-- BUSINESS DIRECTIVE END-->
-
-## Services
-
-<!-- SERVICES START-->
-- [DiagramsService](ng2-activiti-diagrams/src/services/diagrams.service.ts)
-- [DiagramColorService](ng2-activiti-diagrams/src/services/diagram-color.service.ts)
-- [ContextMenuService](ng2-alfresco-core/src/components/context-menu/context-menu.service.ts)
-- [RaphaelService](ng2-activiti-diagrams/src/components/raphael/raphael.service.ts)
-- [TagService](ng2-alfresco-tag/src/services/tag.service.ts)
-- [EcmUserService](ng2-alfresco-userinfo/src/services/ecm-user.service.ts)
-- [BpmUserService](ng2-alfresco-userinfo/src/services/bpm-user.service.ts)
-- [ProcessUploadService](ng2-activiti-processlist/src/services/process-upload.service.ts)
-- [ProcessService](ng2-activiti-processlist/src/services/process.service.ts)
-- [ProcessUploadService](ng2-activiti-tasklist/src/services/process-upload.service.ts)
-- [TaskListService](ng2-activiti-tasklist/src/services/tasklist.service.ts)
-- [PeopleService](ng2-activiti-tasklist/src/services/people.service.ts)
-- [WidgetVisibilityService](ng2-activiti-form/src/services/widget-visibility.service.ts)
-- [NodeService](ng2-activiti-form/src/services/node.service.ts)
-- [FormService](ng2-activiti-form/src/services/form.service.ts)
-- [FormRenderingService](ng2-activiti-form/src/services/form-rendering.service.ts)
-- [ActivitiContentService](ng2-activiti-form/src/services/activiti-content-service.ts)
-- [ActivitiAlfrescoContentService](ng2-activiti-form/src/services/activiti-alfresco.service.ts)
-- [EcmModelService](ng2-activiti-form/src/services/ecm-model.service.ts)
-- [RenderingQueueService](ng2-alfresco-viewer/src/services/rendering-queue.services.ts)
-- [ViewerService](ng2-alfresco-viewer/src/services/viewer.service.ts)
-- [AnalyticsService](ng2-activiti-analytics/src/services/analytics.service.ts)
-- [RatingService](ng2-alfresco-social/src/services/rating.service.ts)
-- [FolderActionsService](ng2-alfresco-documentlist/src/services/folder-actions.service.ts)
-- [NodeActionsService](ng2-alfresco-documentlist/src/services/node-actions.service.ts)
-- [DocumentListService](ng2-alfresco-documentlist/src/services/document-list.service.ts)
-- [DocumentActionsService](ng2-alfresco-documentlist/src/services/document-actions.service.ts)
-- [UploadService](ng2-alfresco-core/src/services/upload.service.ts)
-- [CardViewUpdateService](ng2-alfresco-core/src/services/card-view-update.service.ts)
-- [SitesApiService](ng2-alfresco-core/src/services/sites-api.service.ts)
-- [SharedLinksApiService](ng2-alfresco-core/src/services/shared-links-api.service.ts)
-- [SearchService](ng2-alfresco-core/src/services/search.service.ts)
-- [SearchApiService](ng2-alfresco-core/src/services/search-api.service.ts)
-- [PeopleApiService](ng2-alfresco-core/src/services/people-api.service.ts)
-- [FavoritesApiService](ng2-alfresco-core/src/services/favorites-api.service.ts)
-- [NodesApiService](ng2-alfresco-core/src/services/nodes-api.service.ts)
-- [TranslationService](ng2-alfresco-core/src/services/translation.service.ts)
-- [DiscoveryApiService](ng2-alfresco-core/src/services/discovery-api.service.ts)
-- [DeletedNodesApiService](ng2-alfresco-core/src/services/deleted-nodes-api.service.ts)
-- [UserPreferencesService](ng2-alfresco-core/src/services/user-preferences.service.ts)
-- [ThumbnailService](ng2-alfresco-core/src/services/thumbnail.service.ts)
-- [StorageService](ng2-alfresco-core/src/services/storage.service.ts)
-- [RenditionsService](ng2-alfresco-core/src/services/renditions.service.ts)
-- [NotificationService](ng2-alfresco-core/src/services/notification.service.ts)
-- [AlfrescoSettingsService](ng2-alfresco-core/src/services/alfresco-settings.service.ts)
-- [LogService](ng2-alfresco-core/src/services/log.service.ts)
-- [CookieService](ng2-alfresco-core/src/services/cookie.service.ts)
-- [ContentService](ng2-alfresco-core/src/services/content.service.ts)
-- [AuthenticationService](ng2-alfresco-core/src/services/authentication.service.ts)
-- [AlfrescoContentService](ng2-alfresco-core/src/services/alfresco-content.service.ts)
-- [AppConfigService](ng2-alfresco-core/src/services/app-config.service.ts)
-- [AlfrescoApiService](ng2-alfresco-core/src/services/alfresco-api.service.ts)<!-- SERVICES END-->
-
-You can browse all the components at the following address:
-
-[http://devproducts.alfresco.com/](http://devproducts.alfresco.com/)

ng2-components/ng2-activiti-analytics/README.md

@@ -6,143 +6,37 @@ Contains the Activiti Analytics component and other related components.
 
 <!-- toc -->
 
-- [Activiti Analytics Component](#activiti-analytics-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-- [Activiti Analytics List Component](#activiti-analytics-list-component)
+- [NPM scripts](#npm-scripts)
-  * [Basic Usage](#basic-usage-1)
+- [Demo](#demo)
-    + [Properties](#properties-1)
+- [License](#license)
-    + [Events](#events-1)
-- [Analytics Generator Component](#analytics-generator-component)
-  * [Basic Usage](#basic-usage-2)
-    + [Properties](#properties-2)
-    + [Events](#events-2)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Activiti Analytics Component
+## Documentation
 
-The component shows the charts related to the reportId passed as input
+See the [ADF Analytics](../../docIndex.md#adf-analytics) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic Usage
+## Prerequisites
-
-```html
-<adf-analytics 
-    [appId]="1001" 
-    [reportId]="2006">
-</adf-analytics>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| appId | string | The application id |
-| reportId | string | The report id |
-| hideParameters | boolean | Toggle the analytics parameters |
-
-You can also hide chart parameters UI by setting the `hideParameters` to `true`:
-
-```html
-<adf-analytics 
-    [appId]="appId" 
-    [reportId]="reportId" 
-    [hideParameters]="true">
-</adf-analytics>
-```
-
-![Analytics-without-parameters](docs/assets/analytics-without-parameters.png)
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | The event is emitted when the report parameters are loaded |
-| onError | The event is emitted when an error occurs during the loading |
-| reportSaved | The event is emitted when a report is saved |
-| reportDeleted | The event is emitted when a report is deleted |
-
-## Activiti Analytics List Component
-
-The component shows the list of all the available reports
-
-### Basic Usage
-
-```html
-<analytics-report-list
-    [layoutType]="'LIST'">
-</analytics-report-list>
-```
-
-#### Properties
-
-| Name | Type | Required | Default | Description |
-| --- | --- | --- | --- | --- |
-| appId | string | optional | | The application id |
-| layoutType | string | required | | Define the layout of the apps. There are two possible values: GRID or LIST. LIST is the default value|
-| selectFirst | boolean | optional | false | Change the value to true if you want to select the first item in the list as default|
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | The event is emitted when the report list is loaded |
-| onError | The event is emitted when an error occurs during the loading |
-| reportClick | The event is emitted when the report in the list is selected |
-
-## Analytics Generator Component
-
-The component generates and shows the charts
-
-### Basic Usage
-
-```html
-<adf-analytics-generator 
-    [reportId]="reportId" 
-    [reportParamQuery]="reportParamQuery">
-</adf-analytics>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | -- |
-| reportId | string | The report id |
-| reportParamQuery | ReportQuery | The object contains all the parameters that the report needs |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the charts are loaded |
-| onError | Raised when an error occurs during the loading |
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configurations, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan to use this component with projects generated by Angular CLI, you can read more in [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-activiti-analytics
 ```
 
-### Build from sources
+## Build from sources
 
 You can build the component from sources with the following commands:
 
@@ -154,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -163,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -173,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-activiti-diagrams/README.md

@@ -6,76 +6,37 @@ Contains the Activiti Diagram component.
 
 <!-- toc -->
 
-- [Activiti Diagram Component](#activiti-diagram-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-- [Project Information](#project-information)
+- [NPM scripts](#npm-scripts)
-  * [Prerequisites](#prerequisites)
+- [Demo](#demo)
-  * [Install](#install)
+- [License](#license)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Activiti Diagram Component
+## Documentation
 
-### Basic Usage
+See the [ADF Diagrams](../../docIndex.md#adf-diagrams) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-This component shows the diagram of a process.
+## Prerequisites
-
-```html
-<adf-diagram 
-    [processDefinitionId]="processDefinitionId">
-</adf-diagram>
-```
-
-The below component shows the diagram of a running process instance with the activities highlighted according to their state (Active/Completed/Pending).
-
-```html
-<adf-diagram 
-    [processInstanceId]="processInstanceId">
-</adf-diagram>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | -- |
-| metricPercentages | any | The array that contains the percentage of time for each element |
-| processInstanceId | any | |
-| metricColor | any | The array that contains the color for each element |
-| metricType | any | The string that specifies the metric type |
-| width | number | |
-| height | number | |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the diagrams elements are loaded |
-| onError | Raised when an error occurs during loading |
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configurations, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan to use this component with projects generated by Angular CLI, you can read more in [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-activiti-diagrams
 ```
 
-### Build from sources
+## Build from sources
 
 You can build the component from sources with the following commands:
 
@@ -87,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -96,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -106,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-activiti-form/README.md

@@ -6,580 +6,37 @@ Contains the Activiti Form component and other related components and services.
 
 <!-- toc -->
 
-- [Library Contents](#library-contents)
+- [Documentation](#documentation)
-  * [Components](#components)
+- [Prerequisites](#prerequisites)
-  * [Services](#services)
+- [Install](#install)
-- [Activiti Form component](#activiti-form-component)
+- [Build from sources](#build-from-sources)
-  * [Basic Usage](#basic-usage)
+- [NPM scripts](#npm-scripts)
-    + [Properties](#properties)
+- [Demo](#demo)
-    + [Advanced properties](#advanced-properties)
+- [License](#license)
-    + [Events](#events)
-  * [Details](#details)
-    + [Custom empty form template](#custom-empty-form-template)
-    + [Controlling outcome execution behaviour](#controlling-outcome-execution-behaviour)
-    + [Form Field Validators](#form-field-validators)
-      - [Custom set of validators](#custom-set-of-validators)
-      - [Custom validator example](#custom-validator-example)
-- [Activiti Content Component](#activiti-content-component)
-  * [Basic Usage](#basic-usage-1)
-    + [Properties](#properties-1)
-    + [Events](#events-1)
-- [ADF Form List Component](#adf-form-list-component)
-  * [Basic Usage](#basic-usage-2)
-    + [Properties](#properties-2)
-- [FormService Service](#formservice-service)
-  * [Basic Usage](#basic-usage-3)
-    + [Events](#events-2)
-    + [Methods](#methods)
-- [Other documentation](#other-documentation)
-  * [Common scenarios](#common-scenarios)
-    + [Changing field value based on another field](#changing-field-value-based-on-another-field)
-    + [Listen all form Events](#listen-all-form-events)
-- [See also](#see-also)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Library Contents
+## Documentation
 
-### Components
+See the [ADF Form](../../docIndex.md#adf-form) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-- [ActivitiForm](#activitiform-component)
+## Prerequisites
-- ActivitiStartForm
-
-### Services
-
-- [FormService](#formservice)
-- ActivitiAlfrescoContentService
-- EcmModelService
-- FormRenderingService
-- NodeService
-- WidgetVisibilityService
-
-## Activiti Form component
-
-The component shows a Form from Activiti (see it live: [Form Quickstart](https://embed.plnkr.co/YSLXTqb3DtMhVJSqXKkE/))
-
-### Basic Usage
-
-```html
-<adf-form 
-    [taskId]="taskId">
-</adf-form>
-```
-
-**Display form instance by task id:**
-
-```html
-<adf-form 
-    [taskId]="selectedTask?.id">
-</adf-form>
-```
-
-For an existing Task both form and values will be fetched and displayed.
-
-**Display form definition by form id:**
-
-```html
-<adf-form 
-    [formId]="selectedFormDefinition?.id"
-    [data]="customData">
-</adf-form>
-```
-
-Only form definition will be fetched.
-
-**Display form definition by form name:**
-
-```html
-<adf-form 
-    [formName]="selectedFormDefinition?.name"
-    [data]="customData">
-</adf-form>
-```
-
-**Display form definition by ECM nodeId:**
-
-In this case the metadata of the node are showed in an activiti Form.
-If there is no form definied in activiti for the type of the node,
-a new form will be automaticaly created in Activiti.
-
-```html
-<adf-form 
-    [nodeId]="'e280be3a-6584-45a1-8bb5-89bfe070262e'">
-</adf-form>
-```
-
-**Display form definition by form name, and store the form field as metadata:**
-
-The param nameNode is optional.
-
-```html
-<adf-form 
-    [formName]="'activitiForms:patientFolder'"
-    [saveMetadata]="true"
-    [path]="'/Sites/swsdp/documentLibrary'"
-    [nameNode]="'test'">
-</adf-form>
-```
-
-**Display form definition by ECM nodeId:**
-
-In this case the metadata of the node are shown in an activiti Form,
-and store the form field as metadata. The param nameNode is optional.
-
-```html
-<adf-form 
-    [nodeId]="'e280be3a-6584-45a1-8bb5-89bfe070262e'"
-    [saveMetadata]="true"
-    [path]="'/Sites/swsdp/documentLibrary'"
-    [nameNode]="'test'">
-</adf-form>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| taskId | string | | Task id to fetch corresponding form and values. |
-| formId | string | | The id of the form definition to load and display with custom values. |
-| formName | string | | Name of the form definition to load and display with custom values. |
-| data | FormValues | | Custom form values map to be used with the rendered form. |
-| showTitle | boolean | true | Toggle rendering of the form title. |
-| showCompleteButton | boolean | true | Toggle rendering of the `Complete` outcome button. |
-| disableCompleteButton | boolean | false | The `Complete` outcome button is shown but it will be disabled. |
-| showSaveButton | boolean | true | Toggle rendering of the `Save` outcome button. |
-| readOnly | boolean | false | Toggle readonly state of the form. Enforces all form widgets render readonly if enabled. |
-| showRefreshButton | boolean | true | Toggle rendering of the `Refresh` button. |
-| showValidationIcon | boolean | true | Toggle rendering of the validation icon next form title. |
-| saveMetadata | boolean | false | Store the value of the form as metadata. |
-| path | string |  |  Path of the folder where to store the metadata. |
-| nameNode | string | true | Name to assign to the new node where the metadata are stored. |
-| fieldValidators | FormFieldValidator[] | See [Form Field Validators](#form-field-validators) section below | Contains a list of form field validator instances. |
-
-#### Advanced properties
-
- The following properties are for complex customisation purposes:
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| form | FormModel | | Underlying form model instance. |
-| showDebugButton | boolean | false | Toggle debug options. |
-| debugMode | boolean | false | Toggle debug mode, allows displaying additional data for development and debugging purposes. |
-
-#### Events
-
-| Name |  Return Type | Description |
-| --- | --- | --- |
-| formLoaded | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form is loaded or reloaded. |
-| formSaved | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts)  | Invoked when form is submitted with `Save` or custom outcomes.  |
-| formCompleted | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts)  | Invoked when form is submitted with `Complete` outcome.  |
-| formDataRefreshed | [FormModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form.model.ts) | Invoked when form values are refreshed due to a data property change  |
-| executeOutcome | [FormOutcomeEvent](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form-outcome-event.model.ts) | Invoked when any outcome is executed, default behaviour can be prevented via `event.preventDefault()` |
-| onError | any | Invoked at any error |
-
-### Details
-
-All `form*` events receive an instance of the `FormModel` as event argument for ease of development:
-
-**MyView.component.html**
-
-```html
-<adf-form
-    [taskId]="selectedTask?.id"
-    (formSaved)="onFormSaved($event)">
-</adf-form>
-```
-
-**MyView.component.ts**
-
-```ts
-onFormSaved(form: FormModel) {
-    console.log(form);
-}
-```
-
-#### Custom empty form template
-
-You can add a template that will be show if no form definition has been found
-
-```html
-<adf-form .... >
-
-    <div empty-form >
-        <h2>Empty form</h2>
-    </div>
-
-</adf-form>
-
-```
-
-#### Controlling outcome execution behaviour
-
-If absolutely needed it is possible taking full control over form outcome execution by means of `executeOutcome` event.
-This event is fired upon each outcome execution, both system and custom ones.
-
-You can prevent default behaviour by calling `event.preventDefault()`.
-This allows for example having custom form validation scenarios and/or additional validation summary presentation.
-
-Alternatively you may want just running additional code on outcome execution without suppressing default one.
-
-**MyView.component.html**
-
-```html
-<adf-form
-    [taskId]="selectedTask?.id"
-    executeOutcome="validateForm($event)">
-</adf-form>
-```
-
-**MyView.component.ts**
-
-```ts
-import { FormOutcomeEvent } from 'ng2-activiti-form';
-
-export class MyView {
-
-    validateForm(event: FormOutcomeEvent) {
-        let outcome = event.outcome;
-
-        // you can also get additional properties of outcomes
-        // if you defined them within outcome definition
-
-        if (outcome) {
-            let form = outcome.form;
-            if (form) {
-                // check/update the form here
-                event.preventDefault();
-            }
-        }
-    }
-
-}
-```
-
-There are two additional functions that can be of a great value when controlling outcomes:
-
-- `saveTaskForm()` - saves current form
-- `completeTaskForm(outcome?: string)` - save and complete form with a given outcome name
-
-**Please note that if `event.preventDefault()` is not called then default outcome behaviour
-will also be executed after your custom code.**
-
-#### Form Field Validators
-
-The Form component provides you with access to all Form Field validators. By default the following instances are created automatically:
-
-- RequiredFieldValidator
-- NumberFieldValidator
-- MinLengthFieldValidator
-- MaxLengthFieldValidator
-- MinValueFieldValidator
-- MaxValueFieldValidator
-- RegExFieldValidator
-- DateFieldValidator
-- MinDateFieldValidator
-- MaxDateFieldValidator
-
-If needed, you can completely redefine the set of validators used by the form.
-
-All changes to `fieldValidators` collection are automatically applied to all the further validation cycles.
-
-##### Custom set of validators
-
-You can provide your own set of field validators based on either custom validator instances, or a mixture of default and custom ones.
-
-```html
-<adf-form [fieldValidators]="fieldValidators"></adf-form>
-```
-
-The Form component exposes a special `FORM_FIELD_VALIDATORS` constant that allows you get a quick access to all system validator instances.
-
-```ts
-import { FORM_FIELD_VALIDATORS } from 'ng2-activiti-form';
-
-@Component({...})
-export class AppComponent {
-
-    fieldValidators = [
-        // default set of ADF validators if needed
-        ...FORM_FIELD_VALIDATORS,
-
-        // custom validators
-        new MyValidator1(),
-        new MyValidator2()
-    ];
-
-}
-```
-
-##### Custom validator example
-
-A form field validator must implement the "FormFieldValidator" interface:
-
-```ts
-export interface FormFieldValidator {
-
-    isSupported(field: FormFieldModel): boolean;
-    validate(field: FormFieldModel): boolean;
-
-}
-```
-
-There might be many different validators used for various field types and purposes,
-so the validation layer needs every validator instance to support "isSupported" call.
-
-It is up to validator to declare support for a form field.
-If you want to check field types the [FormFieldTypes](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-types.ts) class can help you with the predefined constants and helper methods.
-
-In addition every validator has access to all underlying APIs of the [FormFieldModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts),
-including the reference to the Form instance and so other form fields.
-
-Below is a source code for a demo validator that is executed for all the "TEXT" fields, and ensures the value is not "admin", otherwise the `field.validationSummary` value is set to an error.
-
-```ts
-import { FormFieldModel, FormFieldTypes, FormFieldValidator } from 'ng2-activiti-form';
-
-export class DemoFieldValidator implements FormFieldValidator {
-
-    isSupported(field: FormFieldModel): boolean {
-        return field && field.type === FormFieldTypes.TEXT;
-    }
-
-    validate(field: FormFieldModel): boolean {
-        if (this.isSupported(field)) {
-            if (field.value && field.value.toLowerCase() === 'admin') {
-                field.validationSummary = 'Sorry, the value cannot be "admin".';
-                return false;
-            }
-        }
-        return true;
-    }
-
-}
-```
-
-Your component can extend the default validation set instead of replacing it entirely.
-In the example below we redefine a default validation set with an additional "DemoFieldValidator":
-
-```ts
-import { DemoFieldValidator } from './demo-field-validator';
-
-@Component({...})
-export class AppComponent {
-
-    fieldValidators = [
-        ...FORM_FIELD_VALIDATORS,
-        new DemoFieldValidator()
-    ];
-
-}
-```
-
-You can now use the 'fieldValidators' property with the Form or Task Details components to assign custom validator set for the underlying Form Model:
-
-```html
-<activiti-task-details
-    [fieldValidators]="fieldValidators"
-    taskId="123">
-</<activiti-task-details>
-
-<!-- OR -->
-
-<adf-form
-    [fieldValidators]="fieldValidators"
-    taskI="123">
-</adf-form>
-```
-
-Now if you run the application and try to enter "admin" in one of the text fields (either optional or required), you should see the following error:
-
-![](docs/assets/demo-validator.png)
-
-## Activiti Content Component
-
-The component shows the content preview.
-
-### Basic Usage
-
-```html
-<adf-content
-    [contentId]="'1001'">
-</adf-content>
-```
-
-#### Properties
-
-The recommended set of properties can be found in the following table:
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| contentId | string |  | The content id to show. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| contentClick | Invoked when the content is clicked. |
-
-## ADF Form List Component
-
-The component shows the activiti forms as a list.
-
-### Basic Usage
-
-```html
-<adf-form-list
-[forms]="[{ name: 'My Name', lastUpdatedByFullName: 'My User Name', lastUpdated: '2017-06-01'}]">
-</adf-form-list>
-```
-
-#### Properties
-
-The recommended set of properties can be found in the following table:
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| forms | any |  | The array that contains the information to show inside the list. |
-
-## FormService Service
-
-### Basic Usage
-
-```ts
-import { FormService, FormEvent, FormFieldEvent } from 'ng2-activiti-form';
-
-@Component(...)
-class MyComponent {
-
-    constructor(formService: FormService) {
-
-        formService.formLoaded.subscribe(
-            (e: FormEvent) => {
-                console.log(`Form loaded: ${e.form.id}`);
-            }
-        );
-
-        formService.formFieldValueChanged.subscribe(
-            (e: FormFieldEvent) => {
-                console.log(`Field value changed. Form: ${e.form.id}, Field: ${e.field.id}, Value: ${e.field.value}`);
-            }
-        );
-
-    }
-
-}
-```
-
-#### Events
-
-| Name | Args Type | Description |
-| --- | --- | --- |
-| formLoaded | FormEvent | Raised when form has been loaded or reloaded |
-| formFieldValueChanged | FormFieldEvent | Raised when input values change |
-| taskCompleted | FormEvent | Raised when a task is completed successfully |
-| taskCompletedError | FormErrorEvent | Raised when a task is completed unsuccessfully  |
-| taskSaved | FormEvent | Raised when a task is saved successfully |
-| taskSavedError | FormErrorEvent | Raised when a task is saved unsuccessfully |
-| executeOutcome | FormOutcomeEvent | Raised when a form outcome is executed |
-| formEvents | Event | You can subscribe to this event to listen : ( click, blur, change, focus, focusin, focusout, input, invalid, select) of any elements in the form , see doc below |
-| validateForm | ValidateFormEvent | Raised each time a form is validated. You can use it to provide custom validation or prevent default behaviour. |
-| validateFormField | ValidateFormFieldEvent | Raised each time a form field is validated. You can use it to provide custom validation or prevent default behaviour.|
-
-#### Methods
-
-| Name | Params | Returns | Description |
-| --- | --- | --- | --- |
-| createFormFromANode | (formName: string) | Observable\<any\> | Create a Form with a fields for each metadata properties |
-| createForm | (formName: string) | Observable\<any\> | Create a Form |
-| addFieldsToAForm | (formId: string, formModel: FormDefinitionModel) | Observable\<any\> | Add Fileds to A form |
-| searchFrom | (name: string) | Observable\<any\> | Search For A Form by name |
-| getForms | n/a | Observable\<any\> | Get All the forms |
-| getProcessDefinitions | n/a | Observable\<any\> | Get Process Definitions |
-| getTasks | n/a | Observable\<any\> | Get All the Tasks |
-| getTask | (taskId: string) | Observable\<any\> | Get Task |
-| saveTaskForm | (taskId: string, formValues: FormValues) | Observable\<any\> | Save Task Form |
-| completeTaskForm | (taskId: string, formValues: FormValues, outcome?: string) | Observable\<any\> | Complete Task Form |
-| getTaskForm | (taskId: string) | Observable\<any\> | Get Form related to a taskId |
-| getFormDefinitionById | (formId: string) | Observable\<any\> | Get Form Definition |
-| getFormDefinitionByName | (name: string) | Observable\<any\> | Returns form definition by a given name. |
-| getStartFormInstance | (processId: string) | Observable\<any\> | Get start form instance for a given processId |
-| getStartFormDefinition | (processId: string) | Observable\<any\> | Get start form definition for a given process |
-| createTemporaryRawRelatedContent | (file: any) | Observable\<any\> | Save File |
-| getRestFieldValues | (taskId: string, field: string) | Observable\<any\> |  |
-| getRestFieldValuesByProcessId | (processDefinitionId: string, field: string) | Observable\<any\> |  |
-| getRestFieldValuesColumnByProcessId | (processDefinitionId: string, field: string, column?: string) | Observable\<any\> |  |
-| getRestFieldValuesColumn | (taskId: string, field: string, column?: string) | Observable\<any\> |  |
-| getWorkflowGroups\ | (filter: string, groupId?: string) | Observable\<GroupModel[]\> |  |
-| getWorkflowUsers\ | (filter: string, groupId?: string) | Observable\<GroupUserModel[]\> |  |
-
-## Other documentation
-
-### Common scenarios
-
-#### Changing field value based on another field
-
-Create a simple Form with a dropdown widget (id: `type`), and a multiline text (id: `description`).
-
-```ts
-formService.formFieldValueChanged.subscribe((e: FormFieldEvent) => {
-    if (e.field.id === 'type') {
-        const fields: FormFieldModel[] = e.form.getFormFields();
-        const description = fields.find(f => f.id === 'description');
-        if (description != null) {
-            console.log(description);
-            description.value = 'Type set to ' + e.field.value;
-        }
-    }
-});
-```
-
-You subscribe to the `formFieldValueChanged` event and check whether event is raised for the `type` widget, then you search for a `description` widget and assign its value to some simple text.
-
-The result should be as following:
-
-![](docs/assets/form-service-sample-01.png)
-
-#### Listen all form Events
-
-If you want to listen all the events fired in the form you can subscribe to this Subject :
-
-```ts
-formService.formEvents.subscribe((event: Event) => {
-  console.log('Event fired:' + event.type);
-  console.log('Event Target:' + event.target);
-});
-```
-
-## See also
-
-- [Form Stencils with Angular 2](docs/stencils.md)
-- [Form Extensibility and Customisation](docs/extensibility.md).
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan to use this component with projects generated by Angular CLI, you can read more in [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-activiti-form
 ```
 
-### Build from sources
+## Build from sources
 
 You can build the component from sources with the following commands:
 
@@ -591,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -600,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -610,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-activiti-processlist/README.md

@@ -6,425 +6,37 @@ Contains the Activiti Process Instance List component and other related componen
 
 <!-- toc -->
 
-- [Activiti Process Instance List](#activiti-process-instance-list)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-- [Process Filters Component](#process-filters-component)
+- [Demo](#demo)
-  * [Basic Usage](#basic-usage-1)
+- [License](#license)
-    + [Properties](#properties-1)
-    + [Events](#events-1)
-  * [Details](#details-1)
-    + [How filter the activiti process filters](#how-filter-the-activiti-process-filters)
-    + [FilterParamsModel](#filterparamsmodel)
-    + [How to create an accordion menu with the processes filter](#how-to-create-an-accordion-menu-with-the-processes-filter)
-- [Start Process component](#start-process-component)
-  * [Basic Usage](#basic-usage-2)
-    + [Properties](#properties-2)
-    + [Events](#events-2)
-- [Process Details component](#process-details-component)
-  * [Basic Usage](#basic-usage-3)
-    + [Properties](#properties-3)
-    + [Events](#events-3)
-- [Process Instance Details Header component](#process-instance-details-header-component)
-  * [Basic Usage](#basic-usage-4)
-    + [Properties](#properties-4)
-    + [Events](#events-4)
-- [Process Instance Tasks component](#process-instance-tasks-component)
-  * [Basic Usage](#basic-usage-5)
-    + [Properties](#properties-5)
-    + [Events](#events-5)
-- [Process Instance Comments component](#process-instance-comments-component)
-  * [Basic Usage](#basic-usage-6)
-    + [Properties](#properties-6)
-- [Process Attachment List component](#process-attachment-list-component)
-  * [Basic Usage](#basic-usage-7)
-    + [Properties](#properties-7)
-    + [Events](#events-6)
-- [Create Process Attachment component](#create-process-attachment-component)
-  * [Basic Usage](#basic-usage-8)
-    + [Properties](#properties-8)
-    + [Events](#events-7)
-- [Process Audit Directive](#process-audit-directive)
-  * [Basic Usage](#basic-usage-9)
-    + [Properties](#properties-9)
-    + [Events](#events-8)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-<!-- Displays lists of process instances both active and completed, using any defined process filter, and renders details for any chosen instance.-->
+## Documentation
 
-## Activiti Process Instance List
+See the [ADF Processlist](../../docIndex.md#adf-processlist) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-This component renders a list containing all the process instances matched by the parameters specified.
+## Prerequisites
-
-### Basic Usage
-
-**app.component.html**
-
-```html
-<adf-process-instance-list 
-    [appId]="'1'" 
-    [state]="'open'">
-</adf-process-instance-list>
-```
-
-#### Properties
-
-| Name | Description |
-| --- | --- |
-| appId | The id of the app. |
-| processDefinitionKey | The processDefinitionKey of the process. |
-| state | Define state of the processes. Possible values are `running`, `completed` and `all` |
-| sort | Define sort of the processes. Possible values are `created-desc`, `created-asc`, `ended-desc`, `ended-asc` |
-| schemaColumn | List of columns to display in the process instances datatable (see the [Details](#details) section below) |
-
-#### Events
-
-- **rowClick**: Emitted when a row in the process list is clicked
-- **onSuccess**: Emitted when the list of process instances has been loaded successfully from the server
-- **onError**: Emitted when an error is encountered loading the list of process instances from the server
-
-### Details
-
-Example value for the schemaColumn property (see [Properties](#properties) section above):
-
-```json
-[
-    {type: 'text', key: 'id', title: 'Id', sortable: true},
-    {type: 'text', key: 'name', title: 'Name', cssClass: 'full-width name-column', sortable: true},
-    {type: 'text', key: 'started', title: 'Started', sortable: true},
-    {type: 'text', key: 'startedBy.email', title: 'Started By', sortable: true}
-]
-```
-
-## Process Filters Component
-
-Collection of criteria used to filter process instances, which may be customized by users.
-
-### Basic Usage
-
-```html
-<adf-process-instance-filters
-    appId="1001">
-</adf-process-instance-filters>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| filterParam | [FilterParamsModel](#filterparamsmodel) | The params to filter the task filter. If there is no match the default one (first filter of the list) is selected |
-| appId | string | Display filters available to the current user for the application with the specified ID. |
-| appName | string | Display filters available to the current user for the application with the specified name. |
-| hasIcon | boolean | Toggle to show or not the filter's icon. |
-
-If both `appId` and `appName` are specified then `appName` will take precedence and `appId` will be ignored.
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the list of filters has been successfully loaded from the server |
-| onError | Raised when an error occurs |
-| filterClick | Raised when the user selects a filter from the list |
-
-### Details
-
-This component displays a list of available filters and allows the user to select any given
-filter as the active filter.
-
-The most common usage is in driving a process instance list to allow the user to choose which
-process instances are displayed in the list.
-
-#### How filter the activiti process filters
-
- ```html
-<adf-process-instance-filters 
-    [filterParam]="{index: 0}">
-</adf-filters>
- ```
-
-You can use inside the filterParam one of the properties defined by [FilterParamsModel](#filterparamsmodel) (see below).
-
-#### FilterParamsModel
-
-```json
-{
-    "id": "number",
-    "name": "string",
-    "index": "number"
-}
-```
-
-| Name | Type | Description |
-| --- | --- | --- |
-| id | string | The id of the task filter. |
-| name | string | The name of the task filter, lowercase is checked. |
-| index | number | Zero-based position of the filter in the array. |
-
-#### How to create an accordion menu with the processes filter
-
-You can create an accordion menu using the AccordionComponent that wrap the activiti task filter.
-The AccordionComponent is exposed by the alfresco-core.
-
-```html
-<adf-accordion>
-    <adf-accordion-group 
-        [heading]="'Processes'" 
-        [isSelected]="true" 
-        [headingIcon]="'assessment'">
-        <adf-process-instance-filters
-            [appId]="appId"
-            (filterClick)="onProcessFilterClick($event)"
-            (onSuccess)="onSuccessProcessFilterList($event)">
-        </adf-process-instance-filters>
-    </adf-accordion-group>
-</adf-accordion>
-```
-
-![how-create-accordion-menu](docs/assets/how-to-create-accordion-menu.png)
-
-## Start Process component
-
-Displays Start Process, allowing the user to specify some basic details needed to start a new process instance.
-
-### Basic Usage
-
-```html
-<adf-start-process 
-    appId="YOUR_APP_ID" >
-</adf-start-process>
-```
-![adf-start-process ](docs/assets/start-process.png)
-
-#### Properties
-
-| Name | Description |
-| --- | --- |
-| appId |  (required): Limit the list of processes which can be started to those contained in the specified app |
-| variables | Variables in input to the process [RestVariable](https://github.com/Alfresco/alfresco-js-api/tree/master/src/alfresco-activiti-rest-api/docs/RestVariable.md)|
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| start | Raised when the process start |
-| cancel | Raised when the process canceled |
-| error | Raised when the start process fail |
-
-## Process Details component
-
-Displays detailed information on a specified process instance
-
-### Basic Usage
-
-```html
-<adf-process-instance-details 
-    processInstanceId="YOUR_PROCESS_INSTANCE_ID">
-</adf-process-instance-details>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| processInstanceId | string | (required): The numeric ID of the process instance to display |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| processCancelledEmitter | Raised when the current process is cancelled by the user from within the component |
-| taskFormCompletedEmitter | Raised when the form associated with an active task is completed from within the component |
-| showProcessDiagram | Raised when the show diagram button is clicked |
-
-## Process Instance Details Header component
-
-Sub-component of the process details component, which renders some general information about the selected process.
-
-### Basic Usage
-
-```html
-<adf-process-instance-header   
-    processInstance="localProcessDetails">
-</adf-process-instance-details>
-```
-![adf-process-instance-header](docs/assets/adf-process-instance-header-attachment.png)
-
-#### Properties
-
-| Name | Type| Description |
-| --- | --- | --- |
-| processInstance | [ProcessInstanceModel](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-activiti-processlist/src/models/process-instance.model.ts) | (**required**): Full details of the process instance to display information about |
-
-#### Events
-
-This component does not define any events.
-
-## Process Instance Tasks component
-
-Lists both the active and completed tasks associated with a particular process instance
-
-### Basic Usage
-
-```html
-<adf-process-instance-tasks 
-    processInstanceId="YOUR_PROCESS_INSTANCE_ID" 
-    showRefreshButton="true">
-</adf-process-instance-tasks>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| processInstanceId | string | (**required**): The ID of the process instance to display tasks for |
-| showRefreshButton | boolean | (default: `true`): Whether to show a refresh button next to the list of tasks to allow this to be updated from the server |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| taskFormCompletedEmitter | Raised when the form associated with an active task is completed from within the component |
-
-## Process Instance Comments component
-
-Displays comments associated with a particular process instance and allows the user to add new comments
-
-### Basic Usage
-
-```html
-<adf-process-instance-comments 
-    processInstanceId="YOUR_PROCESS_INSTANCE_ID">
-</adf-process-instance-comments>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| processInstanceId | string | (**required**): The numeric ID of the process instance to display comments for |
-
-## Process Attachment List component
-
-Displays attached documents on a specified process instance
-
-### Basic Usage
-
-```html
-<adf-process-attachment-list
-    [processInstanceId]="YOUR_PROCESS_INSTANCE_ID"
-    (attachmentClick)="YOUR_ATTACHMENT_CLICK_EMITTER_HANDLER">
-</adf-process-attachment-list>
-```
-![process-attachment-list-sample](docs/assets/process-attachment-list.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | -- |
-| processInstanceId | string | (**required**): The ID of the process instance to display |
-| disabled | boolean | false | Disable/Enable read only mode for attachement list |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| attachmentClick | Raised when the attachment double clicked or selected view option from context menu by the user from within the component and return a Blob obj of the object clicker|
-| success | Raised when the attachment list fetch all the attach and return a list of attachments |
-| error | Raised when the attachment list is not able to fetch the attachments for example network error   |
-
-## Create Process Attachment component
-
-Displays Upload Component(Drag and Click) to upload the attachment to a specified process instance
-
-### Basic Usage
-
-```html
-<adf-create-process-attachment 
-    [processInstanceId]="YOUR_PROCESS_INSTANCE_ID"
-    (error)="YOUR_CREATE_ATTACHMENT_ERROR_HANDLER"
-    (success)="YOUR_CREATE_ATTACHMENT_SUCCESS_HANDLER">
-</adf-create-process-attachment>
-```
-
-![process-create-attachment](docs/assets/process-create-attachment.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| processInstanceId | string | (**required**): The ID of the process instance to display |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| error | Raised when the error occurred while creating/uploading the attachment by the user from within the component |
-| success | Raised when the attachment created/uploaded successfully from within the component |
-
-## Process Audit Directive
-
-Provide a way to fetch the Process Audit information in the pdf or json format.
-
-### Basic Usage
-
-```html
-<button
-    adf-process-audit
-    [process-id]="processId"
-    [format]="'pdf'"
-    [download]="true"
-    md-icon-button (clicked)="onAuditClick($event)" (error)="onAuditError($event)" >
-    <md-icon>assignment_ind</md-icon>
-</button>
-```
-
-![adf-process-audit-directive](docs/assets/adf-process-audit-directive.png)
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| taskId | string | | (**required**) The id of the task. |
-| format | string | pdf | In whitch format you want the task audit information (pdf or json). |
-| download | boolean | false | True If you want download the file on the click event. |
-| fileName | string | Audit | Represent the name of the file to download in case the format is pdf. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| clicked | Raised when the task audit info is ready |
-| error | Raised if there is an error during fetching task information |
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-activiti-processlist
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -436,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -445,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -455,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-activiti-tasklist/README.md

@@ -6,735 +6,37 @@ Contains the Activiti Task List component and other related components and class
 
 <!-- toc -->
 
-- [Activiti Task List component](#activiti-task-list-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-    + [DataTableAdapter example](#datatableadapter-example)
+- [Demo](#demo)
-    + [DataColumn Properties](#datacolumn-properties)
+- [License](#license)
-- [Activiti Task Details component](#activiti-task-details-component)
-  * [Basic Usage](#basic-usage-1)
-    + [Properties](#properties-1)
-    + [Events](#events-1)
-  * [Details](#details-1)
-    + [Custom 'empty Activiti Task Details' template](#custom-empty-activiti-task-details-template)
-- [Activiti Apps Component](#activiti-apps-component)
-  * [Basic Usage](#basic-usage-2)
-    + [Properties](#properties-2)
-    + [Events](#events-2)
-  * [Details](#details-2)
-    + [How filter the activiti apps](#how-filter-the-activiti-apps)
-- [Activiti Filter component](#activiti-filter-component)
-  * [Basic Usage](#basic-usage-3)
-    + [Properties](#properties-3)
-    + [Events](#events-3)
-  * [Details](#details-3)
-    + [How filter the activiti task filters](#how-filter-the-activiti-task-filters)
-    + [FilterParamsModel](#filterparamsmodel)
-    + [How to create an accordion menu with the task filter](#how-to-create-an-accordion-menu-with-the-task-filter)
-- [Activiti Checklist Component](#activiti-checklist-component)
-  * [Basic Usage](#basic-usage-4)
-    + [Properties](#properties-4)
-- [Task Attachment List Component](#task-attachment-list-component)
-  * [Basic Usage](#basic-usage-5)
-    + [Properties](#properties-5)
-    + [Events](#events-4)
-- [Create Task Attachment Component](#create-task-attachment-component)
-  * [Basic Usage](#basic-usage-6)
-    + [Properties](#properties-6)
-    + [Events](#events-5)
-- [Activiti Task Header component](#activiti-task-header-component)
-  * [Basic Usage](#basic-usage-7)
-    + [Properties](#properties-7)
-    + [Events](#events-6)
-  * [Details](#details-4)
-    + [TaskDetailsModel](#taskdetailsmodel)
-- [Task People Component](#task-people-component)
-  * [Basic Usage](#basic-usage-8)
-    + [Properties](#properties-8)
-    + [Events](#events-7)
-  * [Details](#details-5)
-    + [How to customize the people component behavior](#how-to-customize-the-people-component-behavior)
-    + [Involve People single click and close search](#involve-people-single-click-and-close-search)
-    + [Involve People single click without close search](#involve-people-single-click-without-close-search)
-    + [Involve People double click and close search](#involve-people-double-click-and-close-search)
-    + [Involve People double double without close search](#involve-people-double-double-without-close-search)
-- [ADF Comments Component](#adf-comments-component)
-  * [Basic Usage](#basic-usage-9)
-    + [Properties](#properties-9)
-    + [Events](#events-8)
-- [Start Task Component](#start-task-component)
-  * [Basic Usage](#basic-usage-10)
-    + [Properties](#properties-10)
-    + [Events](#events-9)
-- [People Search component](#people-search-component)
-  * [Basic Usage](#basic-usage-11)
-    + [Properties](#properties-11)
-    + [Events](#events-10)
-  * [Details](#details-6)
-- [Task Audit Directive](#task-audit-directive)
-  * [Basic Usage](#basic-usage-12)
-    + [Properties](#properties-12)
-    + [Events](#events-11)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Activiti Task List component
+## Documentation
 
-Renders a list containing all the tasks matched by the parameters specified.
+See the [ADF Tasklist](../../docIndex.md#adf-tasklist) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic Usage
+## Prerequisites
-
-```html
-<adf-tasklist 
-    [appId]="'1'" 
-    [state]="'open'" 
-    [assignment]="'assignee'">
-</adf-tasklist>
-```
-
-You can also use HTML-based schema declaration like shown below:
-
-```html
-<adf-tasklist ...>
-    <data-columns>
-        <data-column key="name" title="NAME" class="full-width name-column"></data-column>
-        <data-column key="created" title="Created" class="hidden"></data-column>
-    </data-columns>
-</adf-tasklist>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| appId | string || The id of the app. |
-| processDefinitionKey | string || The processDefinitionKey of the process. |
-| processInstanceId | string || The processInstanceId of the process. |
-| page | number | 0 | The page of the tasks to fetch. |
-| size | number | 5 | The number of tasks to fetch. |
-| assignment | string || The assignment of the process. <ul>Possible values are: <li>assignee : where the current user is the assignee</li> <li>candidate: where the current user is a task candidate </li><li>group_x: where the task is assigned to a group where the current user is a member of.</li> <li>no value: where the current user is involved</li> </ul> |
-| selectionMode | string | 'single' | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows.  |
-| multiselect | boolean | false | Toggles multiple row selection, renders checkboxes at the beginning of each row |
-| state | string || Define state of the processes. Possible values are: `completed`, `active` |
-| hasIcon | boolean | true | Toggle the icon on the left . |
-| landingTaskId | string | | Define which task id should be selected after the reloading. If the task id doesn't exist or nothing is passed it will select the first task |
-| sort | string | | Define the sort of the processes. Possible values are : `created-desc`, `created-asc`, `due-desc`, `due-asc` |
-| data | DataTableAdapter | | JSON object that represent the number and the type of the columns that you want show (see the [example](#datatableadapter-example) section below) |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the task list is loaded |
-| rowClick | Raised when the task in the list is clicked |
-| rowsSelected | Raised when the a row is selected/unselected |
-
-### Details
-
-This component displays lists of process instances both active and completed, using any defined process filter, and
-render details of any chosen instance.
-
-#### DataTableAdapter example
-
-```json
-[
- {"type": "text", "key": "id", "title": "Id"},
- {"type": "text", "key": "name", "title": "Name", "cssClass": "full-width name-column", "sortable": true},
- {"type": "text", "key": "formKey", "title": "Form Key", "sortable": true},
- {"type": "text", "key": "created", "title": "Created", "sortable": true}
-]
-```
-
-#### DataColumn Properties
-
-Here's the list of available properties you can define for a Data Column definition.
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| key | string | | Data source key, can be either column/property key like `title` or property path like `createdBy.name` |
-| type | string (text\|image\|date) | text | Value type |
-| format | string | | Value format (if supported by components), for example format of the date |
-| sortable | boolean | true | Toggles ability to sort by this column, for example by clicking the column header |
-| title | string | | Display title of the column, typically used for column headers |
-| template | `TemplateRef` | | Custom column template |
-| sr-title | string | | Screen reader title, used for accessibility purposes |
-| class | string | | Additional CSS class to be applied to column (header and cells) |
-
-## Activiti Task Details component
-
-Shows the details of the task id passed in input
-
-### Basic Usage
-
-```html
-<adf-task-details 
-    [taskId]="taskId">
-</adf-task-details>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| taskId | string | | (**required**) The id of the task details that we are asking for. |
-| showNextTask | boolean | true | Automatically render the next one, when the task is completed. |
-| showFormTitle | boolean | true | Toggle rendering of the form title. |
-| readOnlyForm | boolean | false | Toggle readonly state of the form. Enforces all form widgets render readonly if enabled. |
-| showFormRefreshButton | boolean | true | Toggle rendering of the `Refresh` button. |
-| showFormSaveButton | boolean | true| Toggle rendering of the `Save` outcome button. |
-| showFormCompleteButton | boolean | true | Toggle rendering of the Form `Complete` outcome button |
-| peopleIconImageUrl | string | | Define a custom people icon image |
-| showHeader | boolean | true | Toggle task details Header component |
-| showHeaderContent | boolean | true | Toggle collapsed/expanded state of the Header component |
-| showInvolvePeople | boolean | true | Toggle `Involve People` feature for Header component |
-| showComments | boolean | true | Toggle `Comments` feature for Header component |
-| showChecklist | boolean | true | Toggle `Checklist` feature for Header component |
-| fieldValidators | FormFieldValidator[] | [] | Field validators for use with the form. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| formLoaded | Raised when form is loaded or reloaded. |
-| formSaved | Raised when form is submitted with `Save` or custom outcomes.  |
-| formCompleted | Raised when form is submitted with `Complete` outcome.  |
-| taskCreated | Raised when a checklist task is created.  |
-| executeOutcome | Raised when any outcome is executed, default behaviour can be prevented via `event.preventDefault()` |
-| onError | Raised at any error |
-
-### Details
-
-#### Custom 'empty Activiti Task Details' template
-
-By default the Activiti Task Details provides the following message for the empty task details:
-
-```html
-No Tasks
-```
-
-This can be changed by adding the following custom html template:
-
-```html
-<adf-task-details [taskId]="taskId">
-    <no-task-details-template>
-        <template>
-             <h1>Sorry, no tasks here</h1>
-             <img src="example.jpg">
-        </template>
-    </no-task-details-template>
-</adf-task-details>    
-```
-
-Note that can put any HTML content as part of the template, including other Angular components.
-
-## Activiti Apps Component
-
-Shows all available apps.
-
-### Basic Usage
-
-```html
-<adf-apps 
-    [layoutType]="'GRID'">
-</adf-apps>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| layoutType | string | (**required**) Define the layout of the apps. There are two possible values: GRID or LIST. |
-| filtersAppId | Object | Provide a way to filter the apps to show. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| appClick | Raised when an app entry is clicked |
-
-### Details
-
-#### How filter the activiti apps
-
-If you want to show some specific apps you can specify them through the filtersAppId parameters
-
-```html
-<adf-apps 
-    [filtersAppId]="'[
-        {defaultAppId: 'tasks'}, 
-        {deploymentId: '15037'}, 
-        {name : 'my app name'}]'">
-</adf-apps>
-```
-
-In this specific case only the Tasks app, the app with deploymentId 15037 and the app with "my app name" will be showed
-![how-filter-apps](docs/assets/how-filter-apps.png)
-
-You can use inside the filter one of the following property 
-
-```json
-{ 
-    "defaultAppId": "string", 
-    "deploymentId": "string", 
-    "name": "string", 
-    "id": "number", 
-    "modelId": "number",
-    "tenantId": "number"
-}
-```
-
-## Activiti Filter component
-
-Shows all available filters.
-
-### Basic Usage
-
-```html
-<adf-filters></adf-filters>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| filterParam | [FilterParamsModel](#filterparamsmodel) | The params to filter the task filter. If there is no match the default one (first filter of the list) is selected |
-| appId | string | Display filters available to the current user for the application with the specified ID. |
-| `appName` | string | Display filters available to the current user for the application with the specified name. |
-| `hasIcon` | boolean | Toggle to show or not the filter's icon. |
-
-If both `appId` and `appName` are specified then `appName` will take precedence and `appId` will be ignored.
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| filterClick | Raised when the filter in the list is clicked  |
-| onSuccess | Raised when the list is loaded  |
-| onError | Raised if there is an error during the loading  |
-
-### Details
-
-#### How filter the activiti task filters
-
- ```html
-<adf-filters 
-    [filterParam]="{name:'My tasks'}">
-</adf-filters>
-
-```
-
-
-You can use inside the filterParam one of the properties from [FilterParamsModel](#filterparamsmodel) (see below).
-
-#### FilterParamsModel
-
-```json
-{
-    "id": "number",
-    "name": "string",
-    "index": "number"
-}
-```
-
-| Name | Type | Description |
-| --- | --- | --- |
-| id | string | The id of the task filter |
-| name | string | The name of the task filter, lowercase is checked |
-| index | string | The zero-based position of the filter in the array. |
-
-#### How to create an accordion menu with the task filter
-
-You can create an accordion menu using the AccordionComponent that wrap the activiti task filter.
-The AccordionComponent is exposed by the alfresco-core.
-
-```html
-<adf-accordion>
-    <adf-accordion-group [heading]="'Tasks'" [isSelected]="true" [headingIcon]="'assignment'">
-        <adf-filters
-            [appId]="appId"
-            [hasIcon]="false"
-            (filterClick)="onTaskFilterClick($event)"
-            (onSuccess)="onSuccessTaskFilterList($event)"
-            #activitifilter>
-        </adf-filters>
-    </adf-accordion-group>
-</adf-accordion>
-```
-
-![how-create-accordion-menu](docs/assets/how-to-create-accordion-menu.png)
-
-## Activiti Checklist Component
-
-Shows the checklist task functionality.
-
-### Basic Usage
-
-```html
-<adf-checklist 
-    [readOnly]="false" 
-    [taskId]="taskId" 
-    [assignee]="taskAssignee.id" 
-</adf-checklist>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| taskId | string | (**required**) The id of the parent task which sub tasks are attached on. |
-| readOnlyForm | boolean | Toggle readonly state of the form. Enforces all form widgets render readonly if enabled. |
-| assignee | string | (**required**) The assignee id where the subtasks are assigned to. |
-
-
-## Task Attachment List Component
-
-Displays attached documents on a specified task
-
-### Basic Usage
-
-```html
-<adf-task-attachment-list 
-    [taskId]="YOUR_TASK_ID" 
-    (attachmentClick)="YOUR_HANDLER">
-</adf-task-attachment-list>
-```
-![task-attachment-list-sample](docs/assets/task-attachment-list.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| taskId | string | (**required**): The ID of the task to display |
-| disabled | boolean | false | Disable/Enable read only mode for attachement list |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| attachmentClick | Raised when the attachment double clicked or selected view option from context menu by the user from within the component and return a Blob obj of the object clicker|
-| success | Raised when the attachment list fetch all the attach and return a list of attachments |
-| error | Raised when the attachment list is not able to fetch the attachments for example network error   |
-
-## Create Task Attachment Component
-
-Displays Upload Component(Drag and Click) to upload the attachment to a specified task
-
-### Basic Usage
-
-```html
-<adf-create-task-attachment 
-    [taskId]="YOUR_TASK_ID" 
-    (error)="YOUR_CREATE_ATTACHMENT_ERROR_HANDLER"
-    (success)="YOUR_CREATE_ATTACHMENT_SUCCESS_HANDLER">
-</adf-create-task-attachment>
-```
-
-![task-create-attachment](docs/assets/task-create-attachment.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| taskId | string | (**required**): The numeric ID of the task to display |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| error | Raised when the error occurred while creating/uploading the attachment by the user from within the component |
-| success | Raised when the attachment created/uploaded successfully from within the component |
-
-## Activiti Task Header component
-
-Shows all the information related to a task.
-
-### Basic Usage
-
-```html
-<adf-task-header
-    [taskDetails]="taskDetails">
-</adf-task-header>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| taskDetails | [TaskDetailsModel](#taskdetailsmodel) | | (**required**) The task details related to the task. |
-| formName | string | | The name of the form. |
-
-![adf-task-header](docs/assets/adf-task-header.png)
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| claim | Raised when the task is claimed. |
-| unclaim | Raised when the task is unclaimed (requeued). |
-
-### Details
-
-The purpose of the component is to populate the local variable called `properties` (array of CardViewModel), with all the information that we want to display.
-
-
-#### TaskDetailsModel
-
-```json
-{ 
-    "id": "string", 
-    "assignee": "User", 
-    "dueDate": "data", 
-    "endDate": "string", 
-    "description": "string"
-}
-```
-
-## Task People Component
-
-Displays involved users to a specified task
-
-### Basic Usage
-
-```html
-<adf-people 
-    [people]="YOUR_INVOLVED_PEOPLE_LIST" 
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-people>
-```
-
-![activiti-people](docs/assets/activiti_people.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| people | User[] | The array of User object to display |
-| taskId | string | The numeric ID of the task |
-| readOnly | boolean | The boolean flag |
-
-#### Events
-
-No Events
-
-### Details
-
-#### How to customize the people component behavior
-
-The people component provide two methods to customize the behavior:
-- involveUserAndCloseSearch: The selected user is going to be added and the search section closed
-- involveUserWithoutCloseSearch: The selected user is going to be added without close the search section
-
-In this way will be easy customize the people component to involve the user with the single or double click event:
-
-#### Involve People single click and close search
-
-```html
-<adf-people #people
-    (row-click)="people.involveUserAndCloseSearch()"
-    [people]="YOUR_INVOLVED_PEOPLE_LIST"
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-people>
-```
-
-![involve-people-single-click-and-close-search](docs/assets/involve-people-single-click-and-close-search.gif)
-
-#### Involve People single click without close search
-
-```html
-<adf-people #people
-    (row-click)="people.involveUserWithoutCloseSearch()"
-    [people]="YOUR_INVOLVED_PEOPLE_LIST"
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-people>
-```
-
-![involve-people-single-click-without-close-search](docs/assets/involve-people-single-click-without-close-search.gif)
-
-#### Involve People double click and close search
-
-```html
-<adf-people #people
-    (row-dblclick)="people.involveUserAndCloseSearch()"
-    [people]="YOUR_INVOLVED_PEOPLE_LIST"
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-people>
-```
-
-![involve-people-double-click-and-close-search](docs/assets/involve-people-double-click-and-close-search.gif)
-
-#### Involve People double double without close search
-
-```html
-<adf-people #people
-    (row-dblclick)="people.involveUserWithoutCloseSearch()"
-    [people]="YOUR_INVOLVED_PEOPLE_LIST"
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-people>
-```
-
-![involve-people-double-click-without-close-search](docs/assets/involve-people-double-click-without-close-search.gif)
-
-## ADF Comments Component
-
-Displays comments from users involved in a specified task and allows an involved user to add a comment to the task.
-
-### Basic Usage
-
-```html
-<adf-comments
-    [taskId]="YOUR_TASK_ID"
-    [readOnly]="YOUR_READ_ONLY_FLAG">
-</adf-comments>
-```
-
-![adf-comments](docs/assets/adf-comments.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| taskId | string | The numeric ID of the task |
-| readOnly | boolean | The boolean flag |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| error | Raised when an error occurs while displaying/adding a comment |
-
-## Start Task Component
-
-Creates/Starts new task for the specified app
-
-### Basic Usage
-
-```html
-<adf-start-task
-    [appId]="YOUR_APP_ID">
-</adf-start-task>
-```
-
-![adf-start-task](docs/assets/adf-start-task.png)
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| appId | string | (**required**): The id of the app. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| success | Raised when the task is successfully created |
-| cancel | Raised when the cancel button is pressed by the user |
-| error | Raised if there is an error during task creation |
-
-
-## People Search component
-
-Searches users/people.
-
-### Basic Usage
-
-```html
-<adf-people-search></adf-people-search>
-```
-
-#### Properties
-
-| Name | Type | Description |
-| --- | --- | --- |
-| results | Observable<User[]> | The params to show people list |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| searchPeople | Raised when the search people with new keyword  |
-| success | Raised when select the user and click action button  |
-| closeSearch | Raised when click the clse button  |
-
-### Details
-
- ```html
-<adf-people-search
-        (searchPeople)="searchUser($event)"
-        (success)="involveUser($event)"
-        (closeSearch)="onCloseSearch()"
-        [results]="peopleSearch$">
-            <header-title>{{ 'TASK_DETAILS.LABELS.ADD_PEOPLE' | translate }}</header-title>
-            <action-button-label>{{ 'PEOPLE.ADD_USER' | translate }}</action-button-label>
-        </adf-people-search>
-
-```
-
-## Task Audit Directive
-
-Provides a way to fetch the Task Audit information in the pdf or json format.
-
-### Basic Usage
-
-```html
-<button
-    adf-task-audit
-    [task-id]="taskId"
-    [download]="download"
-    md-icon-button (clicked)="onAuditClick($event)" (error)="onAuditError($event)" >
-    <md-icon>assignment_ind</md-icon>
-</button>
-```
-
-![adf-task-audit-directive](docs/assets/adf-task-audit-directive.png)
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| taskId | string | | (**required**) The id of the task. |
-| format | string | pdf | In whitch format you want the task audit information (pdf or json). |
-| download | boolean | false | True If you want download the file on the click event. |
-| fileName | string | Audit | Represent the name of the file to download in case the format is pdf. |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| clicked | Raised when the task audit info is ready |
-| error | Raised if there is an error during fetching task information |
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-activiti-tasklist
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 ```sh
@@ -746,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -755,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -765,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-datatable/README.md

@@ -6,723 +6,37 @@ Contains the DataTable component and other related components and classes.
 
 <!-- toc -->
 
-- [DataTable component](#datatable-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-    + [DataColumn Properties](#datacolumn-properties)
+- [Demo](#demo)
-    + [DataTable DOM Events](#datatable-dom-events)
+- [License](#license)
-    + [Automatic column header translation](#automatic-column-header-translation)
-    + [Custom tooltips](#custom-tooltips)
-    + [Custom Empty content template](#custom-empty-content-template)
-    + [Loading content template](#loading-content-template)
-    + [Column Templates](#column-templates)
-    + [Events](#events-1)
-      - [rowClick event](#rowclick-event)
-      - [rowDblClick event](#rowdblclick-event)
-      - [showRowContextMenu event](#showrowcontextmenu-event)
-      - [showRowActionsMenu event](#showrowactionsmenu-event)
-      - [executeRowAction event](#executerowaction-event)
-    + [Data sources](#data-sources)
-    + [Generate schema](#generate-schema)
-- [Pagination Component](#pagination-component)
-  * [Basic Usage](#basic-usage)
-    + [Properties](#properties-1)
-    + [Events](#events-2)
-  * [Details](#details-1)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## DataTable component
+## Documentation
 
-Displays data as a table with customizable columns and presentation.
+See the [ADF Datatable](../../docIndex.md#adf-datatable) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-![DataTable demo](docs/assets/datatable-demo.png)
+## Prerequisites
-
-See it live: [DataTable Quickstart](https://embed.plnkr.co/80qr4YFBeHjLMdAV0F6l/)
-
-### Basic usage
-
-**app.component.html**
-
-```html
-<adf-datatable 
-    [data]="data">
-</adf-datatable>
-```
-
-**app.component.ts**
-
-```ts
-import { ObjectDataTableAdapter }  from 'ng2-alfresco-datatable';
-
-@Component({...})
-export class DataTableDemo {
-    data: ObjectDataTableAdapter;
-
-    constructor() {
-        this.data = new ObjectDataTableAdapter(
-            // data
-            [
-                {id: 1, name: 'Name 1'},
-                {id: 2, name: 'Name 2'}
-            ],
-            // schema
-            [
-                {
-                    type: 'text',
-                    key: 'id',
-                    title: 'Id',
-                    sortable: true
-                },
-                {
-                    type: 'text',
-                    key: 'name',
-                    title: 'Name',
-                    cssClass: 'full-width',
-                    sortable: true
-                }
-            ]
-        );
-    }
-}
-```
-
-You can also use HTML-based schema declaration like shown below:
-
-```html
-<adf-datatable [data]="data">
-    <data-columns>
-        <data-column key="icon" type="image" [sortable]="false"></data-column>
-        <data-column key="id" title="Id"></data-column>
-        <data-column key="createdOn" title="Created"></data-column>
-        <data-column key="name" title="Name" class="full-width name-column"></data-column>
-        <data-column key="createdBy.name" title="Created By"></data-column>
-    </data-columns>
-</adf-datatable>
-```
-
-```ts
-import { ObjectDataTableAdapter } from 'ng2-alfresco-datatable';
-
-@Component({...})
-export class DataTableDemo {
-    data: ObjectDataTableAdapter;
-
-    constructor() {
-        this.data = new ObjectDataTableAdapter(
-            // data
-            [
-                {
-                    id: 1, 
-                    name: 'Name 1', 
-                    createdBy : { name: 'user'}, 
-                    createdOn: 123, 
-                    icon: 'http://example.com/img.png'
-                },
-                {
-                    id: 2, 
-                    name: 'Name 2', 
-                    createdBy : { name: 'user 2'}, 
-                    createdOn: 123, 
-                    icon: 'http://example.com/img.png'
-                }
-            ]
-        );
-    }
-}
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| selectionMode | string | 'single' | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows.  |
-| rowStyle | string | | The inline style to apply to every row, see [NgStyle](https://angular.io/docs/ts/latest/api/common/index/NgStyle-directive.html) docs for more details and usage examples |
-| rowStyleClass | string | | The CSS class to apply to every row |
-| data | DataTableAdapter | instance of **ObjectDataTableAdapter** | data source |
-| rows | Object[] | [] | The rows that the datatable should show |
-| multiselect | boolean | false | Toggles multiple row selection, renders checkboxes at the beginning of each row |
-| actions | boolean | false | Toggles data actions column |
-| actionsPosition | string (left\|right) | right | Position of the actions dropdown menu. | 
-| fallbackThumbnail | string |  | Fallback image for row where thumbnail is missing|
-| contextMenu | boolean | false | Toggles custom context menu for the component |
-| allowDropFiles | boolean | false | Toggle file drop support for rows (see **ng2-alfresco-core/UploadDirective** for more details) |
-| loading | boolean | false | Flag that indicates if the datatable is in loading state and needs to show the loading template. Read the documentation above to see how to configure a loading template  |
-| showHeader | boolean | true | Toggles header visibility |
-| selection | DataRow[] | [] | Contains selected rows |
-
-#### Events
-
-| Name | Description
-| --- | --- |
-| [rowClick](#rowclick-event) | Emitted when user clicks the row |
-| [rowDblClick](#rowdblclick-event) | Emitted when user double-clicks the row |
-| [showRowContextMenu](#showrowcontextmenu-event) | Emitted before context menu is displayed for a row |
-| [showRowActionsMenu](#showrowactionsmenu-event) | Emitted before actions menu is displayed for a row |
-| [executeRowAction](#executerowaction-event) | Emitted when row action is executed by user |
-
-### Details
-
-#### DataColumn Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| key | string | | Data source key, can be either column/property key like `title` or property path like `createdBy.name` |
-| type | string (text\|image\|date) | text | Value type |
-| format | string | | Value format (if supported by components), for example format of the date |
-| sortable | boolean | true | Toggles ability to sort by this column, for example by clicking the column header |
-| title | string | | Display title of the column, typically used for column headers. You can use the i18n resouce key to get it translated automatically. |
-| template | `TemplateRef` | | Custom column template |
-| sr-title | string | | Screen reader title, used for accessibility purposes |
-| class | string | | Additional CSS class to be applied to column (header and cells) |
-| formatTooltip | Function | | Custom tooltip formatter function. |
-
-#### DataTable DOM Events
-
-Below are the DOM events raised by DataTable component.
-These events bubble up the component tree and can be handled by any parent component.
-
-| Name | Description |
-| --- | --- |
-| row-click | Raised when user clicks a row |
-| row-dblclick | Raised when user double-clicks a row |
-| row-select | Raised after user selects a row |
-| row-unselect | Raised after user unselects a row |
-
-For example:
-
-```html
-<root-component (row-click)="onRowClick($event)">
-    <child-component>
-        <adf-datatable></adf-datatable>
-    </child-component>
-</root-component>
-```
-
-```ts
-onRowClick(event) {
-    console.log(event);
-}
-```
-
-![](docs/assets/datatable-dom-events.png)
-
-#### Automatic column header translation
-
-You can also use i18n resource keys with DataColumn `title` property.
-The component will automatically check the corresponding i18n resources and fetch corresponding value.
-
-```html
-<data-column
-    key="name"
-    title="MY.RESOURCE.KEY">
-</data-column>
-```
-
-This feature is optional. Regular text either plain or converted via the `translate` pipe will still be working as it was before.
-
-#### Custom tooltips
-
-You can create custom tooltips for the table cells by providing a `formatTooltip` property with a tooltip formatter function when declaring a data column.
-
-```html
-<data-column
-    title="Name"
-    key="name"
-    [formatTooltip]="getNodeNameTooltip"
-    class="full-width ellipsis-cell">
-</data-column>
-```
-
-And the code in this case will be similar to the following:
-
-```ts
-import { DataColumn, DataRow } from 'ng2-alfresco-datatable';
-
-@Component({...})
-export class MyComponent {
-    ...
-
-    getNodeNameTooltip(row: DataRow, col: DataColumn): string {
-        if (row) {
-            return row.getValue('name');
-        }
-        return null;
-    }
-}
-```
-
-To disable the tooltip your function can return `null` or an empty string.
-
-#### Custom Empty content template
-
-You can add a template that will be shown when there are no results in your datatable:
-
-```html
-<adf-datatable
-    [data]="data"
-    [actions]="contentActions"
-    [multiselect]="multiselect"
-    (showRowContextMenu)="onShowRowContextMenu($event)"
-    (showRowActionsMenu)="onShowRowActionsMenu($event)"
-    (executeRowAction)="onExecuteRowAction($event)"
-    (rowClick)="onRowClick($event)"
-    (rowDblClick)="onRowDblClick($event)">
-    
-    
-        <no-content-template>
-            <!--Add your custom empty template here-->
-            <ng-template>
-                <h1>Sorry, no content</h1>
-            </ng-template>
-        </no-content-template>
-        
-</adf-datatable>
-```
-
-You can use the empty list component if you want to show the default ADF empty template.
-
-You can use any HTML layout or Angular component as a content of the empty template section by using the special `<adf-empty-list-header>, <adf-empty-list-body>, <adf-empty-list-footer>` elements:
-
-```html
-<adf-datatable
-    [data]="data"
-    [actions]="contentActions"
-    [multiselect]="multiselect"
-    (showRowContextMenu)="onShowRowContextMenu($event)"
-    (showRowActionsMenu)="onShowRowActionsMenu($event)"
-    (executeRowAction)="onExecuteRowAction($event)"
-    (rowClick)="onRowClick($event)"
-    (rowDblClick)="onRowDblClick($event)">
-        
-        <adf-empty-list>
-            <adf-empty-list-header>"'My custom Header'"</adf-empty-list-header>
-            <adf-empty-list-body>"'My custom body'"</adf-empty-list-body>
-            <adf-empty-list-footer>"'My custom footer'"</adf-empty-list-footer>
-            <ng-content>"'HTML Layout'"</ng-content>
-        </adf-empty-list>
-        
-</adf-datatable>
-```
-
-| Name | Type | Default | Description
-| --- | --- | --- | --- |
-| emptyListImageUrl | String | empty_doc_lib.svg | The default image used as background |
-| emptyMsg | String | This list is empty | The default title message |
-| dragDropMsg | String | Drag and drop | The default drag and drop message |
-| additionalMsg | String | Drag and drop | The default additional message |
-
-![](docs/assets/adf-empty-list.png)
-
-#### Loading content template
-
-You can add a template that will be shown during the loading of your data:
-
-```html
-<adf-datatable
-    [data]="data"
-    [actions]="contentActions"
-    [multiselect]="multiselect"
-    [loading]=isLoading()"
-    (showRowContextMenu)="onShowRowContextMenu($event)"
-    (showRowActionsMenu)="onShowRowActionsMenu($event)"
-    (executeRowAction)="onExecuteRowAction($event)"
-    (rowClick)="onRowClick($event)"
-    (rowDblClick)="onRowDblClick($event)">
-    
-        <loading-content-template>
-            <ng-template>
-               <!--Add your custom loading template here-->
-                <md-progress-spinner
-                    class="adf-document-list-loading-margin"
-                    [color]="'primary'"
-                    [mode]="'indeterminate'">
-                </md-progress-spinner>
-            </ng-template>
-        </loading-content-template>
-        
-</adf-datatable>
-```
-
-```js
-    isLoading(): boolean {
-        //your custom logic to identify if you are in a loading state 
-    }
-```
-
-Note: the `<loading-content-template>` and `<no-content-template>` can be used together
-
-#### Column Templates
-
-It is possible to assign a custom column template like the following:
-
-```html
-<adf-datatable ...>
-    <data-columns>
-        <data-column title="Version" key="properties.cm:versionLabel">
-            <template let-value="value">
-                <span>V. {{value}}</span>
-            </template>
-        </data-column>
-    </data-columns>
-</adf-datatable>
-```
-
-Example above shows access to the underlying cell value by binding `value` property to the underlying context `value`:
-
-```html
-<template let-value="value">
-```
-
-Alternatively you can get access to the entire data context using the following syntax:
-
-```html
-<template let-entry="$implicit">
-```
-
-That means you are going to create local variable `entry` that is bound to the data context via Angular's special `$implicit` keyword.
-
-```html
-<template let-entry="$implicit">
-    <span>V. {{entry.data.getValue(entry.row, entry.col)}}</span>
-</template>
-```
-
-In the second case `entry` variable is holding a reference to the following data context:
-
-```ts
-{
-    data: DataTableAdapter,
-    row: DataRow,
-    col: DataColumn
-}
-```
-
-#### Events
-
-##### rowClick event
-
-Emitted when user clicks a row.
-
-Event properties:
-
-```ts
-sender: any     // DataTable instance 
-value: DataRow, // row clicked
-event: Event    // original HTML DOM event
-```
-
-Handler example:
-
-```ts
-onRowClicked(event: DataRowEvent) {
-    console.log(event.value);
-}
-```
-
-This event is cancellable, you can use `event.preventDefault()` to prevent default behaviour.
-
-##### rowDblClick event
-
-Emitted when user double-clicks a row.
-
-Event properties:
-
-```ts
-sender: any     // DataTable instance 
-value: DataRow, // row clicked
-event: Event    // original HTML DOM event
-```
-
-Handler example:
-
-```ts
-onRowDblClicked(event: DataRowEvent) {
-    console.log(event.value);
-}
-```
-
-This event is cancellable, you can use `event.preventDefault()` to prevent default behaviour.
-
-##### showRowContextMenu event
-
-Emitted before context menu is displayed for a row.
-
-Note that DataTable itself does not populate context menu items,
-you can provide all necessary content via handler.
-
-Event properties:
-
-```ts
-value: {
-    row: DataRow,
-    col: DataColumn,
-    actions: []
-}
-```
-
-Handler example:
-
-```ts
-onShowRowContextMenu(event: DataCellEvent) {
-    event.value.actions = [
-        { ... },
-        { ... }
-    ]
-}
-```
-
-This event is cancellable, you can use `event.preventDefault()` to prevent default behaviour.
-
-DataTable will automatically render provided menu items.
-
-See the [ContextMenu](https://www.npmjs.com/package/ng2-alfresco-core)
-documentation for more details on context actions format and behaviour.
-
-##### showRowActionsMenu event
-
-Emitted before actions menu is displayed for a row.
-Requires `actions` property to be set to `true`.
-
-Event properties:
-
-```ts
-value: {
-    row: DataRow,
-    action: any
-}
-```
-
-Note that DataTable itself does not populate action menu items,
-you can provide all necessary content via handler.
-
-This event is cancellable, you can use `event.preventDefault()` to prevent default behaviour.
-
-##### executeRowAction event
-
-Emitted when a row action is executed by the user.
-
-Usually accompanies `showRowActionsMenu` event. 
-DataTable itself does not execute actions but provides support for external
-integration. If there were actions provided with `showRowActionsMenu` event
-then `executeRowAction` will be automatically executed when user clicks 
-corresponding menu item.
-
-```html
-<adf-datatable
-    [data]="data"
-    [multiselect]="multiselect"
-    [actions]="true"
-    (showRowActionsMenu)="onShowRowActionsMenu($event)"
-    (executeRowAction)="onExecuteRowAction($event)">
-</adf-datatable>
-```
-
-```ts
-import { DataCellEvent, DataRowActionEvent } from 'ng2-alfresco-datatable';
-
-onShowRowActionsMenu(event: DataCellEvent) {
-    let myAction = {
-        title: 'Hello'
-        // your custom metadata needed for onExecuteRowAction
-    };
-    event.value.actions = [
-        myAction
-    ];
-}
-
-onExecuteRowAction(event: DataRowActionEvent) {
-    let args = event.value;
-    console.log(args.row);
-    console.log(args.action);
-    window.alert(`My custom action: ${args.action.title}`);
-}
-```
-
-![](docs/assets/datatable-actions-ui.png)
-
-![](docs/assets/datatable-actions-console.png)
-
-Developers are allowed to use any payloads as row actions.
-The only requirement for the objects is having `title` property.
-
-Once corresponding action is clicked in the dropdown menu DataTable invokes `executeRowAction` event
-where you can handle the process, inspect the action payload and all custom properties defined earlier,
-and do corresponding actions.
-
-#### Data sources
-
-DataTable component gets data by means of data adapter. 
-It is possible having data retrieved from different kinds of sources by implementing
-a custom `DataTableAdapter` using the following interfaces:
-
-```ts
-interface DataTableAdapter {
-    selectedRow: DataRow;
-    getRows(): Array<DataRow>;
-    setRows(rows: Array<DataRow>): void;
-    getColumns(): Array<DataColumn>;
-    setColumns(columns: Array<DataColumn>): void;
-    getValue(row: DataRow, col: DataColumn): any;
-    getSorting(): DataSorting;
-    setSorting(sorting: DataSorting): void;
-    sort(key?: string, direction?: string): void;
-}
-
-interface DataRow {
-     isSelected: boolean;
-     isDropTarget?: boolean;
-     hasValue(key: string): boolean;
-     getValue(key: string): any;
-     cssClass?: string;
-}
-
-interface DataColumn {
-    key: string;
-    type: string; // text|image|date
-    format?: string;
-    sortable?: boolean;
-    title?: string;
-    srTitle?: string;
-    cssClass?: string;
-    template?: TemplateRef<any>;
-}
-```
-
-DataTable provides [ObjectDataTableAdapter](https://github.com/Alfresco/alfresco-ng2-components/blob/master/ng2-components/ng2-alfresco-datatable/src/data/object-datatable-adapter.ts) out-of-the-box. 
-This is a simple data adapter implementation that binds to object arrays 
-and turns object fields into columns:
-
-```ts
-let data = new ObjectDataTableAdapter(
-    // data
-    [
-        { id: 1, name: 'Name 1' },
-        { id: 2, name: 'Name 2' }
-    ],
-    // schema
-    [
-        { 
-            type: 'text', 
-            key: 'id', 
-            title: 'Id', 
-            sortable: true 
-        },
-        {
-            type: 'text', 
-            key: 'name', 
-            title: 'Name', 
-            sortable: true
-        }
-    ]
-);
-```
-
-#### Generate schema
-
-It is possible to auto generate your schema if you have only the data row  
-
-```ts
-let data =  [
-    { id: 2, name: 'abs' },
-    { id: 1, name: 'xyz' }
-];
-
-let schema = ObjectDataTableAdapter.generateSchema(data);
-
-/*Auto generated schema value:
-[
-    { 
-        type: 'text', 
-        key: 'id', 
-        title: 'Id', 
-        sortable: false 
-    },
-    {
-        type: 'text', 
-        key: 'name', 
-        title: 'Name', 
-        sortable: false
-    }
-] 
-*/
-
-```
-
-## Pagination Component
-
-Adds pagination to the component it is used with.
-
-![](docs/assets/basic.png)
-
-### Basic Usage
-
-```html
-<adf-pagination
-    [pagination]="pagination"
-    [supportedPageSizes]="sizes"
-    (change)="onChange($event)"
-    (nextPage)="onNextPage($event)"
-    (prevPage)="onPreviousPage($event)"
-    (changePageSize)="onChangePageSize($event)"
-    (changePageNumber)="onChangePageNumber($event)">
-</adf-pagination>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| pagination | Pagination | | Pagination object |
-| supportedPageSizes | Array&lt;number&gt; | [ 25, 50, 100 ] | An array of page sizes |
-
-#### Events
-
-| Name | Type | Description |
-| --- | --- | --- |
-| change | EventEmitter&lt;PaginationQueryParams&gt; | Triggered for any action in pagination |
-| nextPage | EventEmitter&lt;Pagination&gt; | Triggered on next page action |
-| prevPage | EventEmitter&lt;Pagination&gt; | Triggered on previous page action |
-| changePageSize | EventEmitter&lt;Pagination&gt; | Triggered on page size change action |
-| changePageNumber | EventEmitter&lt;Pagination&gt; | Triggered on page change action |
-
-### Details
-
-The pagination object is a generic component to paginate component. The Alfresco API are paginated and return a Pagination object. You can use the pagination object to feed the pagination component and then listen to the event which returns the current pagination and query again the API with the options chosen by the user.
-
-Each event helps to detect the certain action that user have made using the component.
-
-For `change` event, a [PaginationQueryParams](https://github.com/Alfresco/alfresco-ng2-components/tree/master/ng2-components/ng2-alfresco-core/src/components/pagination/pagination-query-params.ts) (including the query params supported by the REST API, `skipCount` and `maxItems`) is returned.
-
-For all events other than `change`, a new [Pagination object](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/Pagination.md) is returned as in the folowing example, with updated properties to be used to query further.
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-datatable
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -734,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -743,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -753,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-login/README.md

@@ -6,244 +6,24 @@ Contains the Login component.
 
 <!-- toc -->
 
-- [Login component](#login-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-    + [Handling events](#handling-events)
+- [Demo](#demo)
-    + [Change footer content](#change-footer-content)
+- [License](#license)
-    + [Change header content](#change-header-content)
-    + [Extra content](#extra-content)
-    + [Custom logo and background](#custom-logo-and-background)
-    + [Customize Validation rules](#customize-validation-rules)
-    + [Controlling form submit execution behaviour](#controlling-form-submit-execution-behaviour)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Login component
+## Documentation
 
-Authenticates to Alfresco Content Services and Alfresco Process Services.
+See the [ADF Login](../../docIndex.md#adf-login) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic usage
+## Prerequisites
-
-```html
-<adf-login 
-    providers="ECM"
-    successRoute="/home">
-</adf-login>
-```
-
-#### Properties
-
-| Name | Type | Default Value | Description |
-| --- | --- | --- | --- |
-| providers | string | | Possible valid values are ECM, BPM or ALL. The default behaviour of this component will log in only in the ECM . If you want to log in in both systems the correct value to use is ALL. |
-| successRoute | string | | Route to redirect to upon successful login. |
-| disableCsrf | boolean | false | To prevent the CSRF Token from being submitted. Only for Alfresco Process Services call |
-| needHelpLink | string | | It will change the url of the NEED HELP link in the footer  |
-| registerLink | string | | It will change the url of the REGISTER link in the footer |
-| logoImageUrl | string | \<ADF logo image> | To change the logo image with a customised image |
-| copyrightText | string | \<ADF copyright string> | The copyright text below the login box |
-| backgroundImageUrl | string | \<ADF background image> | To change the background image with a customised image |
-| fieldsValidation | { [key: string]: any; }, extra?: { [key: string]: any; } |  | Use it to customise the validation rules of the login form |
-| showRememberMe | boolean | false | Toggle `Remember me` checkbox visibility |
-| showLoginActions | boolean | false | Toggle extra actions visibility (`Need Help`, `Register`, etc.) |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the login is done |
-| onError | Raised when the login fails |
-| executeSubmit | Raised when the form is submitted |
-
-### Details
-
-#### Handling events
-
-**app.component.html**
-
-```html
-<adf-login 
-    providers="ALL"
-    (onSuccess)="mySuccessMethod($event)"
-    (onError)="myErrorMethod($event)">
-</adf-login>
-```
-
-**app.component.ts**
-
-```ts
-export class AppComponent {
-
-    mySuccessMethod($event) {
-        console.log('Success Login EventEmitt called with: ' + $event.value);
-    }
-
-    myErrorMethod($event) {
-        console.log('Error Login EventEmitt called with: ' + $event.value);
-    }
-}
-```
-
-#### Change footer content
-
-<img src="assets/custom-footer.png" width="400" />
-
-You can replace the entire content in the footer of the login component with your custom content.
-
-```html
-<adf-login ...>
-    <login-footer><template>My custom HTML for the footer</template></login-footer>
-</adf-login>`
-```
-
-#### Change header content
-
-<img src="assets/custom-header.png" width="400" />
-
-You can replace the entire content in the header of the login component with your custom content.
-
-```html
-<adf-login ...>
-    <login-header><template>My custom HTML for the header</template></login-header>
-</adf-login>`
-```
-
-#### Extra content
-
-You can put additional html content between `alfresco-login` tags to get it rendered as part of the login dialog.
-This becomes handy in case you need to extend it with custom input fields handled by your application or parent component:
-
-```html
-<adf-login ...>
-    <div>
-        <div>Your extra content</div>
-    </div>
-</adf-login>
-```
-
-Here's an example of custom content:
-
-<img src="assets/login-extra-content.png" height="400" />
-
-#### Custom logo and background
-
-It is possible changing logo and background images to custom values.
-
-```html
-<adf-login 
-    [backgroundImageUrl]="'http://images.freeimages.com/images/previews/638/wood-wall-for-background-1634466.jpg'"
-    [logoImageUrl]="'http://images.freeimages.com/images/previews/eac/honeybee-with-a-house-1633609.jpg'">
-</adf-login>
-```
-
-Should give you something like the following:
-
-<img src="assets/custom-login.png" width="600" />
-
-Alternatively you can bind to your component properties and provide values dynamically if needed:
-
-```html
-<adf-login
-    [backgroundImageUrl]="myCustomBackground"
-    [logoImageUrl]="myCustomLogo">
-</adf-login>
-```
-
-#### Customize Validation rules
-
-If needed it is possible to customise the validation rules of the login
-form. You can add/modify the default rules of the login form.
-
-**MyCustomLogin.component.html**
-
-```html
-<adf-login 
-    [fieldsValidation]="customValidation"
-    #alfrescologin>
-</adf-login>
-```
-
-**MyCustomLogin.component.ts**
-
-```ts
-export class MyCustomLogin {
-    
-    @ViewChild('alfrescologin')
-    alfrescologin: any;
-
-    customValidation: any;
-
-    constructor(public router: Router) {
-        this.customValidation = {
-            username: ['', Validators.compose([Validators.required, Validators.minLength(8), Validators.maxLength(10)])],
-            password: ['', Validators.required]
-        };
-    }
-
-    ngOnInit() {
-        this.alfrescologin.addCustomValidationError('username', 'minlength', 'Username must be at least 8 characters.');
-        this.alfrescologin.addCustomValidationError('username', 'maxlength', 'Username must not be longer than 11 characters.');
-    }
-}
-```
-
-#### Controlling form submit execution behaviour
-
-If absolutely needed it is possible taking full control over form 
-submit execution by means of `executeSubmit` event. 
-This event is fired on form submit.
-
-You can prevent default behaviour by calling `event.preventDefault()`. 
-This allows for example having custom form validation scenarios and/or additional validation summary presentation.
-
-Alternatively you may want just running additional code without suppressing default one.
-
-**MyCustomLogin.component.html**
-
-```html
-<adf-login 
-    (executeSubmit)="validateForm($event)" 
-    #alfrescologin>
-</adf-login>
-```
-
-**MyCustomLogin.component.ts**
-
-```ts
-export class MyCustomLogin {
-
-    validateForm(event: any) {
-        let values = event.values;
-        
-        // check if the username is in the blacklist
-        if (values.controls['username'].value === 'invalidUsername') {
-            this.alfrescologin.addCustomFormError('username', 'the
-            username is in blacklist');
-            event.preventDefault();
-        }
-    }
-    
-}
-```
-
-**Please note that if `event.preventDefault()` is not called then default behaviour 
-will also be executed after your custom code.**
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
@@ -252,13 +32,13 @@ necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng
 
 See it live: [Login Quickstart](http://embed.plnkr.co/PfZytJyHcl3xIsa8pdMo/)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-login
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -270,7 +50,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -279,7 +59,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -289,6 +69,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-search/README.md

@@ -6,139 +6,37 @@ Contains the Search and Search Results components.
 
 <!-- toc -->
 
-- [Search component](#search-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-- [Search Results component](#search-results-component)
+- [Demo](#demo)
-  * [Basic usage](#basic-usage-1)
+- [License](#license)
-    + [Properties](#properties-1)
-    + [Events](#events-1)
-  * [Details](#details-1)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Search component
+## Documentation
 
-### Basic usage
+See the [ADF Search](../../docIndex.md#adf-search) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-```html
+## Prerequisites
-<adf-search-control 
-    [searchTerm]="searchTerm"
-    inputType="search"
-    (searchChange)="onSearchChange($event);"
-    (searchSubmit)="onSearchSubmit($event);"
-    (fileSelect)="onSearchResultSelect($event);">
-</adf-search-control>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| searchTerm | string  | |  Search term to pre-populate the field with |
-| inputType | string  | "text" | Type of the input field to render, e.g. "search" or "text" (default) |
-| autocomplete | boolean | true  | Whether the browser should offer field auto-completion for the input field to the user. |
-| highlight | boolean | false  | Use the true value if you want to see the searched word highlighted. |
-| expandable | boolean |  true  | Whether to use an expanding search control, if false then a regular input is used. |
-| liveSearchEnabled | boolean | true  | Whether find-as-you-type suggestions should be offered for matching content items. Set to false to disable. |
-| liveSearchRoot | string | "-root-" | NodeRef or node name where the search should start. |
-| liveSearchResultType | string | |  Node type to filter live search results by, e.g. 'cm:content'. |
-| liveSearchMaxResults | number | 5 |  Maximum number of results to show in the live search. |
-| liveSearchResultSort | string | |  Criteria to sort live search results by, must be one of "name" ,  "modifiedAt" or "createdAt" |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| searchChange | Emitted when the search term is changed. The search term is provided in the 'value' property of the returned object.  If the term is less than three characters in length then the term is truncated to an empty string. |
-| searchSubmit | Emitted when the search form is submitted. The search term is provided in the 'value' property of the returned object. |
-| fileSelect | Emitted when a file item from the list of find-as-you-type results is selected |
-
-### Details
-
-```html
-<adf-search-control
-    [searchTerm]="searchTerm"
-    inputType="search"
-    (searchChange)="onSearchChange($event);"
-    (searchSubmit)="onSearchSubmit($event);"
-    (fileSelect)="onSearchResultSelect($event);">
-</adf-search-control>
-```
-
-Example of a component that uses the search control. In this example the search term is simply logged to the console
-but instead the component could emit an event to be consumed upstream, or it could trigger a change inside a search
-results component embedded inside the same component.
-
-## Search Results component
-
-### Basic usage
-
-```html
-<adf-search 
-    [searchTerm]="searchTerm">
-</adf-search>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| searchTerm | string | | Search term to use when executing the search. Updating this value will run a new search and update the results  |
-| rootNodeId | string | "-root-" | NodeRef or node name where the search should start. |
-| resultType | string | | Node type to filter search results by, e.g. 'cm:content', 'cm:folder' if you want only the files. |
-| maxResults | number  | 20 | Maximum number of results to show in the search. |
-| resultSort | string  | | Criteria to sort search results by, must be one of "name" , "modifiedAt" or "createdAt" |
-| navigationMode | string | "dblclick" | Event used to initiate a navigation action to a specific result, one of "click" or "dblclick" |
-| navigate | boolean | true | Allow documentlist to navigate or not. For more information see documentlist component's documentation |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| preview | Emitted when user acts upon files with either single or double click (depends on `navigation-mode`), recommended for Viewer components integration  |
-| nodeDbClick | Emitted when user acts upon files or folders with double click **only when `navigation-mode` is set to false**, giving more freedom then just simply previewing the file |
-| resultsLoad | Emitted when search results have fully loaded |
-
-### Details
-
-```html
-<adf-search
-    [searchTerm]="searchTerm">
-</adf-search>
-```
-
-Example of a component that displays search results, using the Angular2 router to supply a 'q' parameter containing the
-search term. If no router is present on the page or if the router does not provide such parameter then an empty
-results page will be shown.
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-search
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -150,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -159,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -169,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-social/README.md

@@ -6,88 +6,37 @@ Contains the ADF Like and ADF Rating components.
 
 <!-- toc -->
 
-- [ADF Like component](#adf-like-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-- [ADF Rating component](#adf-rating-component)
+- [NPM scripts](#npm-scripts)
-  * [Basic Usage](#basic-usage-1)
+- [Demo](#demo)
-    + [Properties](#properties-1)
+- [License](#license)
-    + [Events](#events-1)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## ADF Like component
+## Documentation
 
-![Custom columns](docs/assets/social1.png)
+See the [ADF Social](../../docIndex.md#adf-social) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic Usage
+## Prerequisites
-
-```html
-<adf-like [nodeId]="nodeId"></adf-like>
-``` 
-
-#### Properties
-
-| Attribute | Type | Default | Description |
-| --- | --- | --- | --- |
-| nodeId | string | | The identifier of a node.| 
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| changeVote | Raised when vote gets changed |
-
-## ADF Rating component
-
-![Custom columns](docs/assets/social2.png)
-
-### Basic Usage
-
-```html
-<adf-rating  
-    [nodeId]="'74cd8a96-8a21-47e5-9b3b-a1b3e296787d'">
-</adf-rating>
-``` 
-
-#### Properties
-
-| Attribute | Type | Default | Description |
-| --- | --- | --- | --- |
-| nodeId | string | | The identifier of a node |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| changeVote | Raised when vote gets changed |
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-social
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -99,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -108,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -118,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-tag/README.md

@@ -6,81 +6,37 @@ Contains the Alfresco Tag Node Actions list, Tag List and Node List components.
 
 <!-- toc -->
 
-- [Alfresco Tag Node Actions List component](#alfresco-tag-node-actions-list-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-- [Alfresco Tag Node List component](#alfresco-tag-node-list-component)
+- [Build from sources](#build-from-sources)
-  * [Basic Usage](#basic-usage-1)
+- [NPM scripts](#npm-scripts)
-    + [Properties](#properties-1)
+- [Demo](#demo)
-- [Alfresco Tag List component](#alfresco-tag-list-component)
+- [License](#license)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Alfresco Tag Node Actions List component
+## Documentation
 
-![Custom columns](docs/assets/tag3.png)
+See the [ADF Tag](../../docIndex.md#adf-tag) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic Usage
+## Prerequisites
-
-```html
-<adf-tag-node-actions-list 
-    [nodeId]="nodeId">
-</adf-tag-node-actions-list>
-```  
-
-#### Properties
-
-| Attribute | Type | Default | Description |
-| --- | --- | --- | --- |
-| nodeId | string | | The identifier of a node |
-
-## Alfresco Tag Node List component
-
-### Basic Usage
-
-```html
-<adf-tag-node-list 
-    [nodeId]="nodeId">
-</adf-tag-node-list>
-``` 
-
-#### Properties
-
-| Attribute | Type | Default | Description |
-| --- | --- | --- | --- |
-| nodeId | string | | The identifier of a node |
-
-![Custom columns](docs/assets/tag1.png)                         
-
-## Alfresco Tag List component
-
-![Custom columns](docs/assets/tag2.png)                         
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-tag
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -92,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -101,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -111,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-upload/README.md

@@ -6,246 +6,37 @@ Contains components for handling uploads to Content Services.
 
 <!-- toc -->
 
-- [Upload Button Component](#upload-button-component)
+- [Documentation](#documentation)
-  * [Basic Usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-    + [Events](#events)
+- [Build from sources](#build-from-sources)
-  * [Details](#details)
+- [NPM scripts](#npm-scripts)
-    + [How to show notification message with no permission](#how-to-show-notification-message-with-no-permission)
+- [Demo](#demo)
-    + [How to disable the button when the delete permission is missing](#how-to-disable-the-button-when-the-delete-permission-is-missing)
+- [License](#license)
-- [Upload Drag Area Component](#upload-drag-area-component)
-  * [Basic Usage](#basic-usage-1)
-    + [Properties](#properties-1)
-    + [Events](#events-1)
-- [File Uploading Dialog Component](#file-uploading-dialog-component)
-  * [Basic Usage](#basic-usage-2)
-    + [Properties](#properties-2)
-  * [Details](#details-1)
-- [Upload Service](#upload-service)
-  * [Basic Usage](#basic-usage-3)
-    + [Events](#events-2)
-  * [Details](#details-2)
-    + [Ignore list configuration](#ignore-list-configuration)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Upload Button Component
+## Documentation
 
-### Basic Usage
+See the [ADF Upload](../../docIndex.md#adf-upload) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-```html
+## Prerequisites
-<adf-upload-button 
-    [parentId]="-my-"
-    [uploadFolders]="true"
-    [multipleFiles]="false"
-    [acceptedFilesType]=".jpg,.gif,.png,.svg"
-    [versioning]="false"
-    (onSuccess)="customMethod($event)">
-</adf-upload-button>
-<file-uploading-dialog></file-uploading-dialog>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| disabled | boolean | false | Toggle component disabled state if there is no node permission checking |
-| **(deprecated)** showNotificationBar | boolean | true | Hide/show notification bar. **Deprecated in 1.6.0: use UploadService events and NotificationService api instead.** |
-| uploadFolders | boolean | false | Allow/disallow upload folders (only for Chrome) |
-| multipleFiles | boolean | false | Allow/disallow multiple files |
-| acceptedFilesType | string | * |  array of allowed file extensions , example: ".jpg,.gif,.png,.svg" |
-| **(deprecated)** currentFolderPath | string | '/Sites/swsdp/documentLibrary' | define the path where the files are uploaded. **Deprecated in 1.6.0: use rootFolderId instead.** |
-| **(deprecated)** rootFolderId | string | '-root-' | The ID of the root folder node. **Deprecated in 1.6.2: use parentId instead.** |
-| parentId | string | empty | The ID of the root. It can be the nodeId if you are using the upload for the Content Service or taskId/processId for the Process Service. |
-| versioning | boolean | false | Versioning false is the default uploader behaviour and it renames the file using an integer suffix if there is a name clash. Versioning true to indicate that a major version should be created |
-| staticTitle | string | (predefined) | define the text of the upload button |
-| **(deprecated)** disableWithNoPermission ***use node permission directive from core instead*** | boolean | false |  If the value is true and the user doesn't have the permission to delete the node the button will be disabled |
-| tooltip | string | | Custom tooltip |
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the file is uploaded |
-
-### Details
-
-#### How to show notification message with no permission
-
-You can show a notification error when the user doesn't have the right permission to perform the action.
-The UploadButtonComponent provides the event permissionEvent that is raised when the delete permission is missing
-You can subscribe to this event from your component and use the NotificationService to show a message.
-
-```html
-<adf-upload-button
-    [rootFolderId]="currentFolderId"
-    (permissionEvent)="onUploadPermissionFailed($event)">
-</adf-upload-button>
-```
-
-```ts
-export class MyComponent {
-
-    onUploadPermissionFailed(event: any) {
-        this.notificationService.openSnackMessage(
-            `you don't have the ${event.permission} permission to ${event.action} the ${event.type} `, 4000
-        );
-    }
-
-}
-```
-
-![Upload notification message](docs/assets/upload-notification-message.png)
-
-#### How to disable the button when the delete permission is missing
-
-You can easily disable the button when the user doesn't have the permission to perform the action.
-The UploadButtonComponent provides the property disableWithNoPermission that can be true. In this way the button should be disabled if the delete permission is missing for the node.
-
-```html
-<adf-upload-button
-    [rootFolderId]="currentFolderId"
-    [disableWithNoPermission]="true">
-</adf-upload-button>
-```
-
-![Upload disable button](docs/assets/upload-disable-button.png)
-
-## Upload Drag Area Component
-
-Adds a drag and drop area to upload files to Alfresco.
-
-### Basic Usage
-
-```html
-<adf-upload-drag-area (onSuccess)="customMethod($event)">
-    <div style="width: 200px; height: 100px; border: 1px solid #888888">
-        DRAG HERE
-    </div>
-</adf-upload-drag-area>
-<file-uploading-dialog></file-uploading-dialog>
-```
-
-```ts
-export class AppComponent {
-
-    public onSuccess(event: Object): void {
-        console.log('File uploaded');
-    }
-
-}
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| disabled | boolean | false | Toggle component disabled state |
-| **(deprecated)** enabled | boolean | true | Toggle component enabled state |
-| **(deprecated)** showNotificationBar | boolean | true |  Hide/show notification bar. **Deprecated in 1.6.0: use UploadService events and NotificationService api instead.** |
-| rootFolderId | string | '-root-' | The ID of the root folder node. |
-| **(deprecated)** currentFolderPath | string | '/' | define the path where the files are uploaded. **Deprecated in 1.6.0: use rootFolderId instead.** |
-| versioning | boolean | false |  Versioning false is the default uploader behaviour and it renames the file using an integer suffix if there is a name clash. Versioning true to indicate that a major version should be created  | 
-
-#### Events
-
-| Name | Description |
-| --- | --- |
-| onSuccess | Raised when the file is uploaded |
-
-## File Uploading Dialog Component
-
-Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components.
-
-### Basic Usage
-
-```html
-<file-uploading-dialog></file-uploading-dialog>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| position | string | 'right' | Dialog position. Accepted values are 'left' or 'right' |
-
-### Details
-
-This component should be used in combination with upload button or drag & drop area.
-
-## Upload Service
-
-Provides access to various APIs related to file upload features.
-
-### Basic Usage
-
-#### Events
-
-| Name | Type | Description |
-| --- | --- | --- |
-| queueChanged | FileModel[] | Raised every time the file queue changes. |
-| fileUpload | FileUploadEvent | Raised every time a File model changes its state. |
-| fileUploadStarting | FileUploadEvent | Raised when upload starts. |
-| fileUploadCancelled | FileUploadEvent | Raised when upload gets cancelled by user.  |
-| fileUploadProgress | FileUploadEvent | Raised during file upload process and contains the current progress for the particular File model. |
-| fileUploadAborted | FileUploadEvent | Raised when file upload gets aborted by the server. |
-| fileUploadError | FileUploadEvent | Raised when an error occurs to file upload. |
-| fileUploadComplete | FileUploadCompleteEvent | Raised when file upload is complete. |
-| fileUploadDelete | FileUploadDeleteEvent | Raised when uploaded file is removed from server. |
-| fileDeleted | string | This can be invoked when a file is deleted from an external source to upload the file dialog status. |
-
-### Details
-
-#### Ignore list configuration
-
-Is possible add an ignore list for files that you don't want to allow upload on your CS.
-The configuration of this service is saved in the ***app.config.json file***.If you want more details about the configuration service follow this [link](https://github.com/Alfresco/alfresco-ng2-components/tree/master/ng2-components/ng2-alfresco-core#appconfigservice).
-In the example below you can see how filtered out the : '.git', '.DS_Store' and 'desktop.ini'.
-
-**app.config.json**
-
-```json
-{
-    "ecmHost": "http://localhost:3000/ecm",
-    "bpmHost": "http://localhost:3000/bpm",
-    "application": {
-        "name": "Alfresco"
-    },
-    "files": {
-          "excluded": [".DS_Store", "desktop.ini", ".git"]
-    }
-}
-```
-
-Note:
-- Standard glob patterns work.
-- You can end patterns with a forward slash / to specify a directory.
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-upload
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -257,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -266,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -276,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-userinfo/README.md

@@ -6,61 +6,37 @@ Contains the Alfresco User Info component.
 
 <!-- toc -->
 
-- [Alfresco User Info component](#alfresco-user-info-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-  * [Details](#details)
+- [Build from sources](#build-from-sources)
-- [Project Information](#project-information)
+- [NPM scripts](#npm-scripts)
-  * [Prerequisites](#prerequisites)
+- [Demo](#demo)
-  * [Install](#install)
+- [License](#license)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Alfresco User Info component
+## Documentation
 
-### Basic usage
+See the [ADF Analytics](../../docIndex.md#adf-analytics) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-```html
+## Prerequisites
-<adf-userinfo></adf-userinfo>
-```
-
-#### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| ecmBackgroundImage | string | (alfresco image) | Custom path for the background banner image for ECM users |
-| bpmBackgroundImage | string | (alfresco image) | Custom path for the background banner image for BPM users |
-| menuPositionX | string |   | Custom choice for opening the menu bottom : `before` or `after`  |
-| menuPositionY | string |   | Custom choice for opening the menu bottom : `above` or `below`  |
-| fallBackThumbnailImage | string | (alfresco image) | Fallback image for profile when thumbnail is missing|
-
-### Details
-
-This will show a round icon with user and on click some user information.
-If user is logged in with ECM and BPM the ECM image will be shown.
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-userinfo
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -72,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -81,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -91,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-viewer/README.md

@@ -6,184 +6,37 @@ Contains the Alfresco Viewer component.
 
 <!-- toc -->
 
-- [Alfresco Viewer component](#alfresco-viewer-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-  * [Details](#details)
+- [Build from sources](#build-from-sources)
-    + [Supported file formats](#supported-file-formats)
+- [NPM scripts](#npm-scripts)
-    + [PDF Conversion](#pdf-conversion)
+- [Demo](#demo)
-    + [Configuring PDF.js library](#configuring-pdfjs-library)
+- [License](#license)
-    + [Custom extension handler](#custom-extension-handler)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Alfresco Viewer component
+## Documentation
 
-See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/)
+See the [ADF Viewer](../../docIndex.md#adf-viewer) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-### Basic usage
+## Prerequisites
-
-Using with node id:
-
-```html
-<adf-viewer 
-    [showViewer]="true" 
-    [overlayMode]="true" 
-    [fileNodeId]="'d367023a-7ebe-4f3a-a7d0-4f27c43f1045'">
-</adf-viewer>
-```
-
-Using with file url:
-
-```html
-<adf-viewer 
-    [overlayMode]="true" 
-    [urlFile]="'filename.pdf'">
-</adf-viewer>
-```
-
-#### Properties
-
-| Attribute | Options | Default | Description |
-| --- | --- | --- | --- |
-| fileNodeId | string | | Node Id of the file to load |
-| urlFile | string | | If you want to load an external file that does not come from ECM you can use this Url where to load the file |
-| urlBlob | Blob | | If you want to load a Blob File |
-| overlayMode | boolean | false | If `true` show the Viewer full page over the present content otherwise will fit the parent div |
-| showViewer | boolean | true | Hide or show the viewer |
-| showToolbar | boolean | true | Hide or show the toolbars |
-| displayName | string | | You can specify the name of the file |
-
-### Details
-
-#### Supported file formats
-
-| Type | Extension |
-| --- | --- |
-| Media | wav, Mp3, Mp4, WebM, Ogv |
-| Images | png, jpg, jpeg, gif, bmp |
-| Text | pdf, txt |
-
-#### PDF Conversion
-
-![Rendition](docs/assets/renditions.png)                         
-
-Note for unsupported extensions the viewer will offer the possibility to convert to PDF if that kind of extension is supported by the [content service renditions service](https://community.alfresco.com/docs/DOC-5879-rendition-service)
-
-#### Configuring PDF.js library
-
-In order to configure your webpack-enabled application with the PDF.js library please follow the next steps.
-
-Install pdfjs-dist
-
-```sh
-npm install pdfjs-dist
-```
-
-Update `vendors.ts` by appending the following:
-
-```ts
-// PDF.js
-require('pdfjs-dist/web/compatibility.js');
-const pdfjsLib = require('pdfjs-dist');
-pdfjsLib.PDFJS.workerSrc = './pdf.worker.js';
-require('pdfjs-dist/web/pdf_viewer.js');
-```
-
-The code above enables the "viewer" component and "compatibility" mode for all the browsers.
-It also configures the web worker for PDF.js library to render PDF files in the background.
-
-Update the `plugins` section of the `webpack.common.js` file with the next lines:
-
-```js
-new CopyWebpackPlugin([
-    ...
-    {
-        from: 'node_modules/pdfjs-dist/build/pdf.worker.js',
-        to: 'pdf.worker.js'
-    }
-])
-```
-
-The Viewer component now should be able displaying PDF files.
-
-#### Custom extension handler
-
-If you want to handle other file formats that are not yet supported by the ng2-alfresco-viewer you can define your own custom handler.
-
-Below you can find an example with the use of `extension-viewer` if you can handle 3d files
-
-```html
-<adf-viewer 
-    [(showViewer)]="fileShowed"
-    [fileNodeId]="fileNodeId"
-    [overlayMode]="true">
-    
-    <extension-viewer [supportedExtensions]="['obj','3ds']" #extension>
-        <template let-urlFileContent="urlFileContent" let-extension="extension">
-            <threed-viewer 
-                [urlFile]="urlFileContent" 
-                [extension]="extension">
-            </threed-viewer>
-        </template>
-    </extension-viewer>
-
-</adf-viewer> 
-```
-
-Note: you need adding `ng2-3d-editor` dependency to your `package.json` file to make the example above work.
-
-It is possible to define multiple `extension-viewer` templates:
-
-```html
-<adf-viewer 
-    [(showViewer)]="fileShowed"
-    [fileNodeId]="fileNodeId"
-    [overlayMode]="true">
-
-    <extension-viewer [supportedExtensions]="['xls','xlsx']" #extension>
-        <template let-urlFileContent="urlFileContent"  >
-            <my-custom-xls-component 
-                urlFileContent="urlFileContent">
-            </my-custom-xls-component>
-        </template>
-    </extension-viewer>
-
-    <extension-viewer [supportedExtensions]="['txt']" #extension>
-        <template  let-urlFileContent="urlFileContent" >               
-            <my-custom-txt-component 
-                urlFileContent="urlFileContent">
-            </my-custom-txt-component>
-        </template>
-    </extension-viewer>
-</adf-viewer> 
-```
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-viewer
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -195,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -204,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -214,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

ng2-components/ng2-alfresco-webscript/README.md

@@ -6,202 +6,37 @@ Contains the Alfresco Webscript Get component.
 
 <!-- toc -->
 
-- [Alfresco Webscript Get component](#alfresco-webscript-get-component)
+- [Documentation](#documentation)
-  * [Basic usage](#basic-usage)
+- [Prerequisites](#prerequisites)
-    + [Properties](#properties)
+- [Install](#install)
-  * [Details](#details)
+- [Build from sources](#build-from-sources)
-    + [Webscript View HTML example](#webscript-view-html-example)
+- [NPM scripts](#npm-scripts)
-    + [Webscript View DATATABLE example](#webscript-view-datatable-example)
+- [Demo](#demo)
-    + [Webscript View JSON example](#webscript-view-json-example)
+- [License](#license)
-- [Project Information](#project-information)
-  * [Prerequisites](#prerequisites)
-  * [Install](#install)
-  * [Build from sources](#build-from-sources)
-  * [NPM scripts](#npm-scripts)
-  * [Demo](#demo)
-  * [License](#license)
 
 <!-- tocstop -->
 
 <!-- markdown-toc end -->
 
-## Alfresco Webscript Get component
+## Documentation
 
-### Basic usage
+See the [ADF Webscript](../../docIndex.md#adf-webscript) section of the [docs index](../../docIndex.md)
+for all available documentation on this library.
 
-```html
+## Prerequisites
-<adf-webscript-get 
-    [scriptPath]="string"
-    [scriptArgs]="Object"
-    [contextRoot]="string"
-    [servicePath]="string"
-    [showData]="boolean"
-    [contentType]="JSON | HTML | DATATABLE | TEXT"
-    (onSuccess)= "logData($event)">
- </adf-webscript-get>
-```
-
-Another example:
-
-**app.component.html**
-
-```html
-<adf-webscript-get 
-    [scriptPath]="scriptPath"
-    [scriptArgs]="scriptArgs"
-    [contextRoot]="contextRoot"
-    [servicePath]="servicePath" 
-    [contentType]="'HTML'">
-</adf-webscript-get>
-```
-
-**app.component.ts**
-
-```ts
-export class AppComponent {
-    scriptPath: string = 'sample/folder/Company%20Home';
-    contextRoot: string = 'alfresco';
-    servicePath: string = 'service';
-}
-```
-
-#### Properties
-
-| Attribute | Type | Default | Description |
-| --- | --- | --- | --- |
-| scriptPath | string | |  (**mandatory**) path to Web Script (as defined by Web Script) |
-| scriptArgs | Object | | arguments to pass to Web Script |
-| contextRoot | string | | path where application is deployed | 
-| scriptPath | string | alfresco |  path to Web Script (as defined by Web Script) | 
-| contentType | string | service | path where Web Script service is mapped default value | 
-| contentType | string | TEXT | how to handle the data received from the web script JSON , HTML , DATATABLE or TEXT |
-| onSuccess | event | |  You can get the plain data from the webscript through the **onSuccess** event parameter and use it as you need in your application |
-| showData | booleann | true | render the webscript data |
-
-**contentType** {string}  
-***data***      {string}  data containing the plain value you get from the webscipt as an output parameter
-
-### Details
-
-#### Webscript View HTML example
-
-This sample demonstrates how to implement a Webscript component that renders the HTML contents that come from a webscript
-This sample Web Scripts reside in your Alfresco Server. You can access the folder webscript here:
-
-```http://localhost:8080/alfresco/service/sample/folder/Company%20Home```
-
-```html
-<adf-webscript-get 
-    [scriptPath]="scriptPath"
-    [contextRoot]="'alfresco'"
-    [servicePath]="'service'";
-    [scriptPath]="'Sample/folder/Company%20Home'"
-    [contentType]="'HTML'">
-</adf-webscript-get>
-```                          
-
-![Custom columns](docs/assets/HTML.png)                         
-
-#### Webscript View DATATABLE example
-
-This sample demonstrates how to implement a Webscript component that renders the JSON contents that come from a webscript
-
-```http://localhost:8080/alfresco/service/sample/folder/DATATABLE```
-
-```html
-<adf-webscript-get 
-    [scriptPath]="scriptPath"
-    [contextRoot]="'alfresco'"
-    [servicePath]="'service'";
-    [scriptPath]="'Sample/folder/DATATABLE'"
-    [contentType]="'DATATABLE'">
-</adf-webscript-get>
-```  
-
-If you want to show the result from a webscript inside a ng2-alfresco-datatable you have to return from the GET of the webscript the datastructure below:
-subdivide in data and schema
-
-```ts
-data: [],
-schema: []
-```
-
-this is an example: 
-
-```ts
-data: [
-    {id: 1, name: 'Name 1'},
-    {id: 2, name: 'Name 2'}
-],
-schema: [{
-    type: 'text',
-    key: 'id',
-    title: 'Id',
-    sortable: true
-}, {
-    type: 'text',
-    key: 'name',
-    title: 'Name',
-    sortable: true
-}]
-```
-
-or you can send just the array data and the component will create a schema for you: 
-
-```ts
-data: [
-    {id: 1, name: 'Name 1'},
-    {id: 2, name: 'Name 2'}
-]]
-```
-
-that will render the following table
-
-![Custom columns](docs/assets/datatable.png)
-
-#### Webscript View JSON example
-
-This sample demonstrates how to implement a Webscript component that renders the JSON contents that come from a webscript
-This sample Web Scripts reside in your Alfresco Server. You can access the folder webscript here:
-
-```http://localhost:8080/alfresco/service/sample/folder/JSON%EXAMPLE```
-
-```html
-<adf-webscript-get 
-    [scriptPath]="scriptPath"
-    [contextRoot]="'alfresco'"
-    [servicePath]="'service'";
-    [scriptPath]="'Sample/folder/JSON_EXAMPLE'"
-    [contentType]="'HTML'"
-    [showData]="false"
-    (onSuccess)="logDataExample($event)">
-</adf-webscript-get>
-``` 
-
-You can get the plain data from the webscript through the **onSuccess** event parameter and use it as you need in your application
-
-```ts
-logDataExample(data) {
-    console.log('You webscript data are here' + data);
-}
-```
-
-## Project Information
-
-### Prerequisites
 
 Before you start using this development framework, make sure you have installed all required software and done all the
 necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
 
 > If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
 
-### Install
+## Install
 
 ```sh
 npm install ng2-alfresco-webscript
 ```
 
-### Build from sources
+## Build from sources
 
 You can build component from sources with the following commands:
 
@@ -213,7 +48,7 @@ npm run build
 > The `build` task rebuilds all the code, runs tslint, license checks 
 > and other quality check tools before performing unit testing.
 
-### NPM scripts
+## NPM scripts
 
 | Command | Description |
 | --- | --- |
@@ -222,7 +57,7 @@ npm run build
 | npm run test-browser | Run unit tests in the browser
 | npm run coverage | Run unit tests and display code coverage report |
 
-### Demo
+## Demo
 
 Please check the demo folder for a demo project
 
@@ -232,6 +67,6 @@ npm install
 npm start
 ```
 
-### License
+## License
 
 [Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)