inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Doc 4.1.0 (#6215)

Browse Source 
* docbuild

* docbuild

* doc license audit

* remove link redirect to testing
This commit is contained in:
Eugenio Romano
2020-10-08 18:33:57 +01:00
committed by GitHub
parent 2747b7fc13
commit d7db9adbf6
177 changed files with 2638 additions and 2121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

194
docs/core/components/card-view.component.md
View File

@@ -106,16 +106,16 @@ Defining properties from Typescript:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| displayClearAction | `boolean` | true | Toggles whether or not to display clear action. |
| displayEmpty | `boolean` | true | Toggles whether or not to show empty items in non-editable mode. |
| displayNoneOption | `boolean` | true | Toggles whether or not to display none option. |
| editable | `boolean` | | Toggles whether or not the items can be edited. |
| multiValueSeparator | `string` | DEFAULT_SEPARATOR | String separator between multi-value property items. |
| properties | [`CardViewItem`](../../../lib/core/card-view/interfaces/card-view-item.interface.ts)`[]` | | (**required**) Items to show in the card view. |
| useChipsForMultiValueProperty | `boolean` | true | Toggles whether or not to enable chips for multivalued properties. |
| Name | Type | Default value | Description |
| ----------------------------- | ---------------------------------------------------------------------------------------- | ----------------- | ------------------------------------------------------------------ |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| displayClearAction | `boolean` | true | Toggles whether or not to display clear action. |
| displayEmpty | `boolean` | true | Toggles whether or not to show empty items in non-editable mode. |
| displayNoneOption | `boolean` | true | Toggles whether or not to display none option. |
| editable | `boolean` | | Toggles whether or not the items can be edited. |
| multiValueSeparator | `string` | DEFAULT_SEPARATOR | String separator between multi-value property items. |
| properties | [`CardViewItem`](../../../lib/core/card-view/interfaces/card-view-item.interface.ts)`[]` | | (**required**) Items to show in the card view. |
| useChipsForMultiValueProperty | `boolean` | true | Toggles whether or not to enable chips for multivalued properties. |
## Details
@@ -157,7 +157,7 @@ You can optionally set up the card view so that its properties can be edited. Yo
the editing of properties at two levels:
- **Global level** - _via the editable parameter of the card-view.component_
- **[`Property`](../../../node_modules/@alfresco/js-api/src/api/content-rest-api/model/property.ts) level** - _in each property via the editable attribute_
- **[`Property`](../../../lib/content-services/src/lib/content-metadata/interfaces/property.interface.ts) level** - _in each property via the editable attribute_
If you set the global editable parameter to false, no properties can be edited regardless of their
individual `editable` settings.
@@ -182,22 +182,22 @@ specific data types, as described below.
const textItemProperty = new CardViewTextItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| clickable | boolean | false | Toggles whether the property responds to clicks |
| clickableCallBack | function | null | Function to execute when click the element |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| useChipsForMultiValueProperty | `boolean` | true | Toggles whether or not to enable chips for multivalued properties. |
| multiValueSeparator | `string` | ',' | String separator between multi-value property items. |
| icon | string | | The material icon to show beside the item if it is clickable |
| multiline | boolean | false | Single or multiline text |
| pipes | [`CardViewTextItemPipeProperty`](../../../lib/core/card-view/interfaces/card-view-textitem-pipe-property.interface.ts)\[] | \[] | Pipes to be applied to the text before display |
| Name | Type | Default | Description |
| ----------------------------- | ------------------------------------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------------------------ |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| clickable | boolean | false | Toggles whether the property responds to clicks |
| clickableCallBack | function | null | Function to execute when click the element |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| useChipsForMultiValueProperty | `boolean` | true | Toggles whether or not to enable chips for multivalued properties. |
| multiValueSeparator | `string` | ',' | String separator between multi-value property items. |
| icon | string | | The material icon to show beside the item if it is clickable |
| multiline | boolean | false | Single or multiline text |
| pipes | [`CardViewTextItemPipeProperty`](../../../lib/core/card-view/interfaces/card-view-textitem-pipe-property.interface.ts)\[] | \[] | Pipes to be applied to the text before display |
##### Using pipes with a Card Text Item
@@ -227,14 +227,14 @@ new CardViewTextItemModel({
const mapItemProperty = new CardViewMapItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | Map | | A map that contains the key value pairs |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| clickable | boolean | false | Toggles whether the property responds to clicks |
| Name | Type | Default | Description |
| -------------- | ------- | ------- | -------------------------------------------------- |
| label\* | string | | Item label |
| value\* | Map | | A map that contains the key value pairs |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| clickable | boolean | false | Toggles whether the property responds to clicks |
#### Card Date Item
@@ -244,16 +244,16 @@ const mapItemProperty = new CardViewMapItemModel(options);
const dateItemProperty = new CardViewDateItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | any | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| format | string | "MMM DD YYYY" | Any date format that momentjs accepts |
| Name | Type | Default | Description |
| --------------------- | --------- | ------------- | ---------------------------------------------------------- |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| copyToClipboardAction | `boolean` | true | Toggles whether or not to enable copy to clipboard action. |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | | The default value to display if the value is empty |
| displayValue\* | any | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| format | string | "MMM DD YYYY" | Any date format that momentjs accepts |
#### Card Datetime Item
@@ -263,15 +263,15 @@ const dateItemProperty = new CardViewDateItemModel(options);
const datetimeItemProperty = new CardViewDatetimeItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | any | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| format | string | "MMM DD YYYY HH:mm" | Any datetime format that momentjs accepts |
| Name | Type | Default | Description |
| -------------- | ------- | ------------------- | -------------------------------------------------- |
| label\* | string | | Item label |
| value\* | any | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | any | any | The default value to display if the value is empty |
| displayValue\* | string | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| format | string | "MMM DD YYYY HH:mm" | Any datetime format that momentjs accepts |
#### Card Bool Item
@@ -281,14 +281,14 @@ const datetimeItemProperty = new CardViewDatetimeItemModel(options);
const boolItemProperty = new CardViewBoolItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | boolean | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | boolean | false | The default value to display if the value is empty |
| displayValue\* | boolean | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| Name | Type | Default | Description |
| -------------- | ------- | ------- | -------------------------------------------------- |
| label\* | string | | Item label |
| value\* | boolean | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | boolean | false | The default value to display if the value is empty |
| displayValue\* | boolean | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
#### Card Int Item
@@ -298,14 +298,14 @@ const boolItemProperty = new CardViewBoolItemModel(options);
const intItemProperty = new CardViewIntItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | integer | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | integer | | The default value to display if the value is empty |
| displayValue\* | integer | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| Name | Type | Default | Description |
| -------------- | ------- | ------- | -------------------------------------------------- |
| label\* | string | | Item label |
| value\* | integer | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | integer | | The default value to display if the value is empty |
| displayValue\* | integer | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
#### Card Float Item
@@ -315,14 +315,14 @@ const intItemProperty = new CardViewIntItemModel(options);
const floatItemProperty = new CardViewFloatItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| value\* | float | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | float | | The default value to display if the value is empty |
| displayValue\* | float | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
| Name | Type | Default | Description |
| -------------- | ------- | ------- | -------------------------------------------------- |
| label\* | string | | Item label |
| value\* | float | | The original data value for the item |
| key\* | string | | Identifying key (important when editing the item) |
| default | float | | The default value to display if the value is empty |
| displayValue\* | float | | The value to display |
| editable | boolean | false | Toggles whether the item is editable |
#### Card Key Value Pairs Item
@@ -332,12 +332,12 @@ const floatItemProperty = new CardViewFloatItemModel(options);
const keyValuePairsItemProperty = new CardViewKeyValuePairsItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value\* | `[{ name: '', value: '' }, ...]` | | The original data value for the item |
| Name | Type | Default | Description |
| -------- | -------------------------------- | ------- | ------------------------------------------------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value\* | `[{ name: '', value: '' }, ...]` | | The original data value for the item |
#### Card Select Item
@@ -347,13 +347,13 @@ const keyValuePairsItemProperty = new CardViewKeyValuePairsItemModel(options);
const selectItemProperty = new CardViewSelectItemModel(options);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value | string | | The original data value for the item |
| options$\* | [`Observable`](http://reactivex.io/documentation/observable.html)<[`CardViewSelectItemOption`](../../../lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts)\[]> | | The original data value for the item |
| Name | Type | Default | Description |
| ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------- | ------------------------------------------------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value | string | | The original data value for the item |
| options$\* | [`Observable`](http://reactivex.io/documentation/observable.html)<[`CardViewSelectItemOption`](../../../lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts)\[]> | | The original data value for the item |
#### Card Array Item
@@ -363,12 +363,12 @@ const selectItemProperty = new CardViewSelectItemModel(options);
const arrayItemProperty = new CardViewArrayItemModel(items);
```
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value | [`Observable`](http://reactivex.io/documentation/observable.html)<[`CardViewArrayItem`](../../../lib/core/card-view/models/card-view-arrayitem.model.ts)\[]> | | The original data value for the item |
| Name | Type | Default | Description |
| -------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------- | ------------------------------------------------- |
| label\* | string | | Item label |
| key\* | string | | Identifying key (important when editing the item) |
| editable | boolean | false | Toggles whether the item is editable |
| value | [`Observable`](http://reactivex.io/documentation/observable.html)<[`CardViewArrayItem`](../../../lib/core/card-view/models/card-view-arrayitem.model.ts)\[]> | | The original data value for the item |
## See also

10
docs/core/components/comment-list.component.md
View File

@@ -63,12 +63,12 @@ In the component template use the [comment list component](comment-list.componen
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| comments | [`CommentModel`](../../../lib/core/models/comment.model.ts)`[]` | | The comments data used to populate the list. |
| Name | Type | Default value | Description |
| -------- | --------------------------------------------------------------- | ------------- | -------------------------------------------- |
| comments | [`CommentModel`](../../../lib/core/models/comment.model.ts)`[]` | | The comments data used to populate the list. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| -------- | --------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------- |
| clickRow | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`CommentModel`](../../../lib/core/models/comment.model.ts)`>` | Emitted when the user clicks on one of the comment rows. |

14
docs/core/components/comments.component.md
View File

@@ -32,14 +32,14 @@ Displays comments from users involved in a specified task or content and allows
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| nodeId | `string` | | The numeric ID of the node. |
| readOnly | `boolean` | false | Are the comments read only? |
| taskId | `string` | | The numeric ID of the task. |
| Name | Type | Default value | Description |
| -------- | --------- | ------------- | --------------------------- |
| nodeId | `string` | | The numeric ID of the node. |
| readOnly | `boolean` | false | Are the comments read only? |
| taskId | `string` | | The numeric ID of the task. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| ----- | ----------------------------------------------------------------- | --------------------------------------------------------------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when an error occurs while displaying/adding a comment. |

38
docs/core/components/data-column.component.md
View File

@@ -41,20 +41,20 @@ Defines column properties for DataTable, Tasklist, Document List and other compo
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| copyContent | `boolean` | | Enables/disables a [Clipboard directive](../../core/directives/clipboard.directive.md) to allow copying of cell contents. |
| cssClass | `string` | | Additional CSS class to be applied to column (header and cells). |
| editable | `boolean` | false | Toggles the editing support of the column data. |
| focus | `boolean` | true | Enable or disable cell focus |
| format | `string` | | Value format (if supported by the parent component), for example format of the date. |
| formatTooltip | `Function` | | Custom tooltip formatter function. |
| key | `string` | | Data source key. Can be either a column/property key like `title` or a property path like `createdBy.name`. |
| sortable | `boolean` | true | Toggles ability to sort by this column, for example by clicking the column header. |
| sortingKey | `string` | | When using server side sorting the column used by the api call where the sorting will be performed |
| srTitle | `string` | | Title to be used for screen readers. |
| title | `string` | "" | Display title of the column, typically used for column headers. You can use the i18n resource key to get it translated automatically. |
| type | `string` | "text" | Value type for the column. Possible settings are 'text', 'image', 'date', 'fileSize', 'location', and 'json'. |
| Name | Type | Default value | Description |
| ------------- | ---------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------- |
| copyContent | `boolean` | | Enables/disables a [Clipboard directive](../../core/directives/clipboard.directive.md) to allow copying of cell contents. |
| cssClass | `string` | | Additional CSS class to be applied to column (header and cells). |
| editable | `boolean` | false | Toggles the editing support of the column data. |
| focus | `boolean` | true | Enable or disable cell focus |
| format | `string` | | Value format (if supported by the parent component), for example format of the date. |
| formatTooltip | `Function` | | Custom tooltip formatter function. |
| key | `string` | | Data source key. Can be either a column/property key like `title` or a property path like `createdBy.name`. |
| sortable | `boolean` | true | Toggles ability to sort by this column, for example by clicking the column header. |
| sortingKey | `string` | | When using server side sorting the column used by the api call where the sorting will be performed |
| srTitle | `string` | | Title to be used for screen readers. |
| title | `string` | "" | Display title of the column, typically used for column headers. You can use the i18n resource key to get it translated automatically. |
| type | `string` | "text" | Value type for the column. Possible settings are 'text', 'image', 'date', 'fileSize', 'location', and 'json'. |
## Details
@@ -124,11 +124,11 @@ You can provide custom column/cell templates that may contain other Angular comp
Every cell in the DataTable component is bound to the dynamic data context containing the following properties:
| Name | Type | Description |
| ---- | ---- | ----------- |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | Data adapter instance. |
| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | Current data row instance. |
| col | [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) | Current data column instance. |
| Name | Type | Description |
| ---- | --------------------------------------------------------------------------- | ----------------------------- |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | Data adapter instance. |
| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | Current data row instance. |
| col | [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) | Current data column instance. |
You can use all three properties to gain full access to underlying data from within your custom templates.
In order to wire HTML templates with the data context you will need to define a variable that is bound to `$implicit` as shown below:

80
docs/core/components/datatable.component.md
View File

@@ -342,38 +342,38 @@ Learm more about styling your datatable: [Customizing the component's styles](#c
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| actions | `boolean` | false | Toggles the data actions column. |
| actionsPosition | `string` | "right" | Position of the actions dropdown menu. Can be "left" or "right". |
| allowFiltering | `boolean` | false | Flag that indicate if the datatable allow the use facet [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) search for filtering. |
| columns | `any[]` | \[] | The columns that the datatable will show. |
| contextMenu | `boolean` | false | Toggles custom context menu for the component. |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | | Data source for the table |
| display | `string` | DisplayMode.List | Selects the display mode of the table. Can be "list" or "gallery". |
| fallbackThumbnail | `string` | | Fallback image for rows where the thumbnail is missing. |
| loading | `boolean` | false | Flag that indicates if the datatable is in loading state and needs to show the loading template (see the docs to learn how to configure a loading template). |
| multiselect | `boolean` | false | Toggles multiple row selection, which renders checkboxes at the beginning of each row. |
| noPermission | `boolean` | false | Flag that indicates if the datatable should show the "no permission" template. |
| resolverFn | `Function` | null | Custom resolver function which is used to parse dynamic column objects see the docs to learn how to configure a resolverFn. |
| rowMenuCacheEnabled | `boolean` | true | Should the items for the row actions menu be cached for reuse after they are loaded the first time? |
| 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. |
| rows | `any[]` | \[] | The rows that the datatable will show. |
| 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. |
| showHeader | `string` | | Toggles the header. |
| sorting | `any[]` | \[] | Define the sort order of the datatable. Possible values are : [`created`, `desc`], [`created`, `asc`], [`due`, `desc`], [`due`, `asc`] |
| stickyHeader | `boolean` | false | Toggles the sticky header mode. |
| Name | Type | Default value | Description |
| ------------------- | --------------------------------------------------------------------------- | ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| actions | `boolean` | false | Toggles the data actions column. |
| actionsPosition | `string` | "right" | Position of the actions dropdown menu. Can be "left" or "right". |
| allowFiltering | `boolean` | false | Flag that indicate if the datatable allow the use facet [widget](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) search for filtering. |
| columns | `any[]` | \[] | The columns that the datatable will show. |
| contextMenu | `boolean` | false | Toggles custom context menu for the component. |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | | Data source for the table |
| display | `string` | DisplayMode.List | Selects the display mode of the table. Can be "list" or "gallery". |
| fallbackThumbnail | `string` | | Fallback image for rows where the thumbnail is missing. |
| loading | `boolean` | false | Flag that indicates if the datatable is in loading state and needs to show the loading template (see the docs to learn how to configure a loading template). |
| multiselect | `boolean` | false | Toggles multiple row selection, which renders checkboxes at the beginning of each row. |
| noPermission | `boolean` | false | Flag that indicates if the datatable should show the "no permission" template. |
| resolverFn | `Function` | null | Custom resolver function which is used to parse dynamic column objects see the docs to learn how to configure a resolverFn. |
| rowMenuCacheEnabled | `boolean` | true | Should the items for the row actions menu be cached for reuse after they are loaded the first time? |
| 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. |
| rows | `any[]` | \[] | The rows that the datatable will show. |
| 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. |
| showHeader | `string` | ShowHeaderMode.Data | Toggles the header. |
| sorting | `any[]` | \[] | Define the sort order of the datatable. Possible values are : [`created`, `desc`], [`created`, `asc`], [`due`, `desc`], [`due`, `asc`] |
| stickyHeader | `boolean` | false | Toggles the sticky header mode. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| executeRowAction | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowActionEvent`](../../../lib/core/datatable/components/data-row-action.event.ts)`>` | Emitted when the user executes a row action. |
| rowClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowEvent`](../../../lib/core/datatable/data/data-row-event.model.ts)`>` | Emitted when the user clicks a row. |
| rowDblClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowEvent`](../../../lib/core/datatable/data/data-row-event.model.ts)`>` | Emitted when the user double-clicks a row. |
| showRowActionsMenu | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataCellEvent`](../../../lib/core/datatable/components/data-cell.event.ts)`>` | Emitted before the actions menu is displayed for a row. |
| showRowContextMenu | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataCellEvent`](../../../lib/core/datatable/components/data-cell.event.ts)`>` | Emitted before the context menu is displayed for a row. |
| Name | Type | Description |
| ------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------- |
| executeRowAction | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowActionEvent`](../../../lib/core/datatable/components/data-row-action.event.ts)`>` | Emitted when the user executes a row action. |
| rowClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowEvent`](../../../lib/core/datatable/data/data-row-event.model.ts)`>` | Emitted when the user clicks a row. |
| rowDblClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataRowEvent`](../../../lib/core/datatable/data/data-row-event.model.ts)`>` | Emitted when the user double-clicks a row. |
| showRowActionsMenu | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataCellEvent`](../../../lib/core/datatable/components/data-cell.event.ts)`>` | Emitted before the actions menu is displayed for a row. |
| showRowContextMenu | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`DataCellEvent`](../../../lib/core/datatable/components/data-cell.event.ts)`>` | Emitted before the context menu is displayed for a row. |
## Details
@@ -395,18 +395,18 @@ for more information.
Below are the DOM events emitted by the 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 |
| row-keyup | Raised on the 'keyup' event for the focused row. |
| 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 |
| row-keyup | Raised on the 'keyup' event for the focused row. |
| sorting-changed | Raised after user clicks the sortable column header. |
| header-dragover | Raised when dragging content over the header. |
| header-drop | Raised when data is dropped on the column header. |
| cell-dragover | Raised when dragging data over the cell. |
| cell-drop | Raised when data is dropped on the column cell. |
| header-dragover | Raised when dragging content over the header. |
| header-drop | Raised when data is dropped on the column header. |
| cell-dragover | Raised when dragging data over the cell. |
| cell-drop | Raised when data is dropped on the column cell. |
#### Drop Events

10
docs/core/components/empty-content.component.md
View File

@@ -29,11 +29,11 @@ Provides a generic "Empty Content" placeholder for components.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| icon | `string` | "cake" | Material Icon to use. |
| subtitle | `string` | "" | String or Resource Key for the subtitle. |
| title | `string` | "" | String or Resource Key for the title. |
| Name | Type | Default value | Description |
| -------- | -------- | ------------- | ---------------------------------------- |
| icon | `string` | "cake" | Material Icon to use. |
| subtitle | `string` | "" | String or Resource Key for the subtitle. |
| title | `string` | "" | String or Resource Key for the title. |
## Details

6
docs/core/components/error-content.component.md
View File

@@ -21,9 +21,9 @@ this.router.navigate(['/error', errorCode]);
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| errorCode | `string` | | Error code associated with this error. |
| Name | Type | Default value | Description |
| --------- | -------- | ------------- | -------------------------------------- |
| errorCode | `string` | | Error code associated with this error. |
## Details

48
docs/core/components/form-field.component.md
View File

@@ -25,9 +25,9 @@ based on the field type or the metadata information.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| field | [`FormFieldModel`](../../core/models/form-field.model.md) | null | Contains all the necessary data needed to determine what UI [`Widget`](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) to use when rendering the field in the form. You would typically not create this data manually but instead create the form in APS and export it to get to all the `FormFieldModel` definitions. |
| Name | Type | Default value | Description |
| ----- | --------------------------------------------------------- | ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| field | [`FormFieldModel`](../../core/models/form-field.model.md) | null | Contains all the necessary data needed to determine what UI [`Widget`](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) to use when rendering the field in the form. You would typically not create this data manually but instead create the form in APS and export it to get to all the `FormFieldModel` definitions. |
## Details
@@ -38,24 +38,24 @@ uses `<adf-form-field>` components to render the form fields.
Forms defined in APS have the following default mappings for the form fields:
| _APS [`Form`](../../../lib/process-services/src/lib/task-list/models/form.model.ts) Designer_ [`Widget`](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) | Field Type | Component Type |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------- | -------------- |
| Text | text | [`TextWidgetComponent`](../../../lib/core/form/components/widgets/text/text.widget.ts) |
| Multi-line text | multi-line-text | [`MultilineTextWidgetComponentComponent`](../../../lib/core/form/components/widgets/multiline-text/multiline-text.widget.ts) |
| Number | integer | [`NumberWidgetComponent`](../../../lib/core/form/components/widgets/number/number.widget.ts) |
| Checkbox | boolean | [`CheckboxWidgetComponent`](../../../lib/core/form/components/widgets/checkbox/checkbox.widget.ts) |
| Date | date | [`DateWidgetComponent`](../../../lib/core/form/components/widgets/date/date.widget.ts) |
| Dropdown | dropdown | [`DropdownWidgetComponent`](../../../lib/core/form/components/widgets/dropdown/dropdown.widget.ts) |
| Typeahead | typeahead | [`TypeaheadWidgetComponent`](../../../lib/core/form/components/widgets/typeahead/typeahead.widget.ts) |
| Amount | amount | [`AmountWidgetComponent`](../../../lib/core/form/components/widgets/amount/amount.widget.ts) |
| Radio buttons | radio-buttons | [`RadioButtonsWidgetComponent`](../../../lib/core/form/components/widgets/radio-buttons/radio-buttons.widget.ts) |
| People | people | [`PeopleWidgetComponent`](../../../lib/core/form/components/widgets/people/people.widget.ts) |
| Group of people | functional-group | [`FunctionalGroupWidgetComponent`](../../../lib/core/form/components/widgets/functional-group/functional-group.widget.ts) |
| Dynamic table | dynamic-table | [`DynamicTableWidgetComponent`](../../../lib/core/form/components/widgets/dynamic-table/dynamic-table.widget.ts) |
| Hyperlink | hyperlink | [`HyperlinkWidgetComponent`](../../../lib/core/form/components/widgets/hyperlink/hyperlink.widget.ts) |
| Header | group | [`ContainerWidgetComponent`](../../../lib/core/form/components/widgets/container/container.widget.ts) |
| Attach File | upload | AttachWidgetComponent or [`UploadWidgetComponent`](../../../lib/core/form/components/widgets/upload/upload.widget.ts) (based on metadata) |
| Display value | readonly | [`TextWidgetComponent`](../../../lib/core/form/components/widgets/text/text.widget.ts) |
| Display text | readonly-text | [`DisplayTextWidgetComponent`](../../../lib/core/form/components/widgets/display-text/display-text.widget.ts) |
| N/A | container | [`ContainerWidgetComponent`](../../../lib/core/form/components/widgets/container/container.widget.ts) (layout component) |
| N/A | N/A | [`UnknownWidgetComponent`](../../../lib/core/form/components/widgets/unknown/unknown.widget.ts) |
| _APS [`Form`](../../../lib/process-services/src/lib/task-list/models/form.model.ts) Designer_ [`Widget`](../../../lib/testing/src/lib/core/pages/form/widgets/widget.ts) | Field Type | Component Type |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
| Text | text | [`TextWidgetComponent`](../../../lib/core/form/components/widgets/text/text.widget.ts) |
| Multi-line text | multi-line-text | [`MultilineTextWidgetComponentComponent`](../../../lib/core/form/components/widgets/multiline-text/multiline-text.widget.ts) |
| Number | integer | [`NumberWidgetComponent`](../../../lib/core/form/components/widgets/number/number.widget.ts) |
| Checkbox | boolean | [`CheckboxWidgetComponent`](../../../lib/core/form/components/widgets/checkbox/checkbox.widget.ts) |
| Date | date | [`DateWidgetComponent`](../../../lib/core/form/components/widgets/date/date.widget.ts) |
| Dropdown | dropdown | [`DropdownWidgetComponent`](../../../lib/core/form/components/widgets/dropdown/dropdown.widget.ts) |
| Typeahead | typeahead | [`TypeaheadWidgetComponent`](../../../lib/core/form/components/widgets/typeahead/typeahead.widget.ts) |
| Amount | amount | [`AmountWidgetComponent`](../../../lib/core/form/components/widgets/amount/amount.widget.ts) |
| Radio buttons | radio-buttons | [`RadioButtonsWidgetComponent`](../../../lib/core/form/components/widgets/radio-buttons/radio-buttons.widget.ts) |
| People | people | [`PeopleWidgetComponent`](../../../lib/core/form/components/widgets/people/people.widget.ts) |
| Group of people | functional-group | [`FunctionalGroupWidgetComponent`](../../../lib/core/form/components/widgets/functional-group/functional-group.widget.ts) |
| Dynamic table | dynamic-table | [`DynamicTableWidgetComponent`](../../../lib/core/form/components/widgets/dynamic-table/dynamic-table.widget.ts) |
| Hyperlink | hyperlink | [`HyperlinkWidgetComponent`](../../../lib/core/form/components/widgets/hyperlink/hyperlink.widget.ts) |
| Header | group | [`ContainerWidgetComponent`](../../../lib/core/form/components/widgets/container/container.widget.ts) |
| Attach File | upload | AttachWidgetComponent or [`UploadWidgetComponent`](../../../lib/core/form/components/widgets/upload/upload.widget.ts) (based on metadata) |
| Display value | readonly | [`TextWidgetComponent`](../../../lib/core/form/components/widgets/text/text.widget.ts) |
| Display text | readonly-text | [`DisplayTextWidgetComponent`](../../../lib/core/form/components/widgets/display-text/display-text.widget.ts) |
| N/A | container | [`ContainerWidgetComponent`](../../../lib/core/form/components/widgets/container/container.widget.ts) (layout component) |
| N/A | N/A | [`UnknownWidgetComponent`](../../../lib/core/form/components/widgets/unknown/unknown.widget.ts) |

6
docs/core/components/form-list.component.md
View File

@@ -21,6 +21,6 @@ Shows forms as a list.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| forms | `any[]` | \[] | The array that contains the information to show inside the list. |
| Name | Type | Default value | Description |
| ----- | ------- | ------------- | ---------------------------------------------------------------- |
| forms | `any[]` | \[] | The array that contains the information to show inside the list. |

24
docs/core/components/header.component.md
View File

@@ -36,21 +36,21 @@ body of the element:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| color | `string` | | Background color for the header. It can be any hex color code or one of the Material theme colors: 'primary', 'accent' or 'warn'. |
| expandedSidenav | `boolean` | true | expandedSidenav: Toggles the expanded state of the component. |
| logo | `string` | | Path to an image file for the application logo. |
| position | `string` | "start" | The side of the page that the drawer is attached to (can be 'start' or 'end') |
| redirectUrl | `string \| any[]` | "/" | The router link for the application logo, when clicked. |
| showSidenavToggle | `boolean` | true | Toggles whether the sidenav button will be displayed in the header or not. |
| title | `string` | | Title of the application. |
| tooltip | `string` | | The tooltip text for the application logo. |
| Name | Type | Default value | Description |
| ----------------- | ----------------- | ------------- | --------------------------------------------------------------------------------------------------------------------------------- |
| color | `string` | | Background color for the header. It can be any hex color code or one of the Material theme colors: 'primary', 'accent' or 'warn'. |
| expandedSidenav | `boolean` | true | expandedSidenav: Toggles the expanded state of the component. |
| logo | `string` | | Path to an image file for the application logo. |
| position | `string` | "start" | The side of the page that the drawer is attached to (can be 'start' or 'end') |
| redirectUrl | `string \| any[]` | "/" | The router link for the application logo, when clicked. |
| showSidenavToggle | `boolean` | true | Toggles whether the sidenav button will be displayed in the header or not. |
| title | `string` | | Title of the application. |
| tooltip | `string` | | The tooltip text for the application logo. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| ------- | --------------------------------------------------------------------- | ------------------------------------------- |
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the sidenav button is clicked. |
## Details

14
docs/core/components/host-settings.component.md
View File

@@ -32,14 +32,14 @@ Validates the URLs for ACS and APS and saves them in the user's local storage
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| providers | `string[]` | | Tells the component which provider options are available. Possible valid values are "ECM" (Content), "BPM" (Process) , "ALL" (Content and Process), 'OAUTH2' SSO. |
| Name | Type | Default value | Description |
| --------- | ---------- | ------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| providers | `string[]` | | Tells the component which provider options are available. Possible valid values are "ECM" (Content), "BPM" (Process) , "ALL" (Content and Process), 'OAUTH2' SSO. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| cancel | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the user cancels the changes. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when the URL is invalid. |
| Name | Type | Description |
| ------- | --------------------------------------------------------------------- | -------------------------------------------------- |
| cancel | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the user cancels the changes. |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when the URL is invalid. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the changes are successfully applied. |

8
docs/core/components/icon.component.md
View File

@@ -26,10 +26,10 @@ Provides a universal way of rendering registered and named icons.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| color | [`ThemePalette`](https://github.com/angular/components/blob/master/src/material/core/common-behaviors/color.ts) | | Theme color palette for the component. |
| value | `string` | | Icon value, which can be either a ligature name or a custom icon in the format `[namespace]:[name]`. |
| Name | Type | Default value | Description |
| ----- | --------------------------------------------------------------------------------------------------------------- | ------------- | ---------------------------------------------------------------------------------------------------- |
| color | [`ThemePalette`](https://github.com/angular/components/blob/master/src/material/core/common-behaviors/color.ts) | | Theme color palette for the component. |
| value | `string` | | Icon value, which can be either a ligature name or a custom icon in the format `[namespace]:[name]`. |
## Details

14
docs/core/components/infinite-pagination.component.md
View File

@@ -36,16 +36,16 @@ Adds "infinite" pagination to the component it is used with.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| isLoading | `boolean` | false | Is a new page loading? |
| pageSize | `number` | | Number of items that are added with each "load more" event. |
| target | [`PaginatedComponent`](../../../lib/core/pagination/paginated-component.interface.ts) | | Component that provides custom pagination support. |
| Name | Type | Default value | Description |
| --------- | ------------------------------------------------------------------------------------- | ------------- | ----------------------------------------------------------- |
| isLoading | `boolean` | false | Is a new page loading? |
| pageSize | `number` | | Number of items that are added with each "load more" event. |
| target | [`PaginatedComponent`](../../../lib/core/pagination/paginated-component.interface.ts) | | Component that provides custom pagination support. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| -------- | ------------------------------------------------------------------------------------------------------------------------------------------------ | ----------------------------------------------- |
| loadMore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`RequestPaginationModel`](../../../lib/core/models/request-pagination.model.ts)`>` | Emitted when the "Load More" button is clicked. |
## Details

6
docs/core/components/info-drawer-layout.component.md
View File

@@ -42,9 +42,9 @@ with the following names:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| showHeader | `boolean` | true | The visibility of the header. |
| Name | Type | Default value | Description |
| ---------- | --------- | ------------- | ----------------------------- |
| showHeader | `boolean` | true | The visibility of the header. |
## Details

8
docs/core/components/info-drawer-tab.component.md
View File

@@ -53,10 +53,10 @@ You can also combine `icon` and `label` properties.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| icon | `string` | null | Icon to render for the tab. |
| label | `string` | "" | The title of the tab (string or translation key). |
| Name | Type | Default value | Description |
| ----- | -------- | ------------- | ------------------------------------------------- |
| icon | `string` | null | Icon to render for the tab. |
| label | `string` | "" | The title of the tab (string or translation key). |
## Details

14
docs/core/components/info-drawer.component.md
View File

@@ -47,16 +47,16 @@ have any content you like:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| selectedIndex | `number` | 0 | The selected index tab. |
| showHeader | `boolean` | true | The visibility of the header. |
| title | `string \| null` | null | The title of the info drawer (string or translation key). |
| Name | Type | Default value | Description |
| ------------- | ---------------- | ------------- | --------------------------------------------------------- |
| selectedIndex | `number` | 0 | The selected index tab. |
| showHeader | `boolean` | true | The visibility of the header. |
| title | `string \| null` | null | The title of the info drawer (string or translation key). |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| ---------- | -------------------------------------------------------------------- | ---------------------------------------------- |
| currentTab | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<number>` | Emitted when the currently active tab changes. |
## Details

18
docs/core/components/json-cell.component.md
View File

@@ -39,15 +39,15 @@ You can specify the cell inside the `app.config.json` file:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| column | [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) | | Data that defines the column. |
| copyContent | `boolean` | | Enables/disables a [Clipboard directive](../../core/directives/clipboard.directive.md) to allow copying of the cell's content. |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | | Data table adapter instance. |
| editable | `boolean` | false | Editable JSON. |
| resolverFn | `Function` | null | Custom resolver function which is used to parse dynamic column objects |
| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | | Data that defines the row. |
| tooltip | `string` | | Text for the cell's tooltip. |
| Name | Type | Default value | Description |
| ----------- | --------------------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------ |
| column | [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) | | Data that defines the column. |
| copyContent | `boolean` | | Enables/disables a [Clipboard directive](../../core/directives/clipboard.directive.md) to allow copying of the cell's content. |
| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | | Data table adapter instance. |
| editable | `boolean` | false | Editable JSON. |
| resolverFn | `Function` | null | Custom resolver function which is used to parse dynamic column objects |
| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | | Data that defines the row. |
| tooltip | `string` | | Text for the cell's tooltip. |
## Details

4
docs/core/components/login-dialog-panel.component.md
View File

@@ -13,8 +13,8 @@ Shows and manages a login dialog.
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| ------- | -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginSuccessEvent`](../../../lib/core/login/models/login-success.event.ts)`>` | Emitted when the login succeeds. |
## Details

32
docs/core/components/login.component.md
View File

@@ -75,25 +75,25 @@ with custom input fields handled by your application or parent component:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| backgroundImageUrl | `string` | | Path to a custom background image. |
| copyrightText | `string` | | The copyright text below the login box. |
| fieldsValidation | `any` | | Custom validation rules for the login form. |
| logoImageUrl | `string` | | Path to a custom logo image. |
| needHelpLink | `string` | "" | Sets the URL of the NEED HELP link in the footer. |
| registerLink | `string` | "" | Sets the URL of the REGISTER link in the footer. |
| showLoginActions | `boolean` | true | Should the extra actions (`Need Help`, `Register`, etc) be shown? |
| showRememberMe | `boolean` | true | Should the `Remember me` checkbox be shown? When selected, this option will remember the logged-in user after the browser is closed to avoid logging in repeatedly. |
| successRoute | `string` | null | Route to redirect to on successful login. |
| Name | Type | Default value | Description |
| ------------------ | --------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| backgroundImageUrl | `string` | | Path to a custom background image. |
| copyrightText | `string` | | The copyright text below the login box. |
| fieldsValidation | `any` | | Custom validation rules for the login form. |
| logoImageUrl | `string` | | Path to a custom logo image. |
| needHelpLink | `string` | "" | Sets the URL of the NEED HELP link in the footer. |
| registerLink | `string` | "" | Sets the URL of the REGISTER link in the footer. |
| showLoginActions | `boolean` | true | Should the extra actions (`Need Help`, `Register`, etc) be shown? |
| showRememberMe | `boolean` | true | Should the `Remember me` checkbox be shown? When selected, this option will remember the logged-in user after the browser is closed to avoid logging in repeatedly. |
| successRoute | `string` | null | Route to redirect to on successful login. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginErrorEvent`](../../../lib/core/login/models/login-error.event.ts)`>` | Emitted when the login fails. |
| executeSubmit | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginSubmitEvent`](../../../lib/core/login/models/login-submit.event.ts)`>` | Emitted when the login form is submitted. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginSuccessEvent`](../../../lib/core/login/models/login-success.event.ts)`>` | Emitted when the login is successful. |
| Name | Type | Description |
| ------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginErrorEvent`](../../../lib/core/login/models/login-error.event.ts)`>` | Emitted when the login fails. |
| executeSubmit | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginSubmitEvent`](../../../lib/core/login/models/login-submit.event.ts)`>` | Emitted when the login form is submitted. |
| success | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`LoginSuccessEvent`](../../../lib/core/login/models/login-success.event.ts)`>` | Emitted when the login is successful. |
## Details

8
docs/core/components/notification-history.component.md
View File

@@ -22,7 +22,7 @@ The main purpose of the [Notification history component](../../core/components/n
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| menuPositionX | `string` | "after" | Custom choice for opening the menu at the bottom. Can be `before` or `after`. |
| menuPositionY | `string` | "below" | Custom choice for opening the menu at the bottom. Can be `above` or `below`. |
| Name | Type | Default value | Description |
| ------------- | -------- | ------------- | ----------------------------------------------------------------------------- |
| menuPositionX | `string` | "after" | Custom choice for opening the menu at the bottom. Can be `before` or `after`. |
| menuPositionY | `string` | "below" | Custom choice for opening the menu at the bottom. Can be `above` or `below`. |

24
docs/core/components/pagination.component.md
View File

@@ -40,21 +40,21 @@ Adds pagination to the component it is used with.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| supportedPageSizes | `number[]` | | An array of page sizes. |
| target | [`PaginatedComponent`](../../../lib/core/pagination/paginated-component.interface.ts) | | Component that provides custom pagination support. |
| pagination | [`PaginationModel`](../../../lib/core/models/pagination.model.ts) | | Pagination object. |
| Name | Type | Default value | Description |
| ------------------ | ------------------------------------------------------------------------------------- | ------------- | -------------------------------------------------- |
| supportedPageSizes | `number[]` | | An array of page sizes. |
| target | [`PaginatedComponent`](../../../lib/core/pagination/paginated-component.interface.ts) | | Component that provides custom pagination support. |
| pagination | [`PaginationModel`](../../../lib/core/models/pagination.model.ts) | | Pagination object. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| change | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when pagination changes in any way. |
| changePageNumber | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the page number changes. |
| changePageSize | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the page size changes. |
| nextPage | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the next page is requested. |
| prevPage | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the previous page is requested. |
| Name | Type | Description |
| ---------------- | --------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- |
| change | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when pagination changes in any way. |
| changePageNumber | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the page number changes. |
| changePageSize | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the page size changes. |
| nextPage | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the next page is requested. |
| prevPage | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`PaginationModel`](../../../lib/core/models/pagination.model.ts)`>` | Emitted when the previous page is requested. |
## Details

36
docs/core/components/search-text-input.component.md
View File

@@ -26,24 +26,24 @@ Displays a input text that supports autocompletion
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| autocomplete | `boolean` | false | Toggles auto-completion of the search input field. |
| collapseOnSubmit | `boolean` | true | Collapse search bar on submit. |
| debounceTime | `number` | 0 | Debounce time in milliseconds. |
| defaultState | `SearchTextStateEnum` | | Default state expanded or Collapsed. |
| expandable | `boolean` | true | Toggles whether to use an expanding search control. If false then a regular input is used. |
| focusListener | [`Observable`](http://reactivex.io/documentation/observable.html)`<FocusEvent>` | | Listener for results-list events (focus, blur and focusout). |
| inputType | `string` | "text" | Type of the input field to render, e.g. "search" or "text" (default). |
| liveSearchEnabled | `boolean` | true | Toggles "find-as-you-type" suggestions for possible matches. |
| searchAutocomplete | `any` | false | Trigger autocomplete results on input change. |
| searchTerm | `string` | "" | Search term preselected |
| Name | Type | Default value | Description |
| ------------------ | ------------------------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------ |
| autocomplete | `boolean` | false | Toggles auto-completion of the search input field. |
| collapseOnSubmit | `boolean` | true | Collapse search bar on submit. |
| debounceTime | `number` | 0 | Debounce time in milliseconds. |
| defaultState | `SearchTextStateEnum` | | Default state expanded or Collapsed. |
| expandable | `boolean` | true | Toggles whether to use an expanding search control. If false then a regular input is used. |
| focusListener | [`Observable`](http://reactivex.io/documentation/observable.html)`<FocusEvent>` | | Listener for results-list events (focus, blur and focusout). |
| inputType | `string` | "text" | Type of the input field to render, e.g. "search" or "text" (default). |
| liveSearchEnabled | `boolean` | true | Toggles "find-as-you-type" suggestions for possible matches. |
| searchAutocomplete | `any` | false | Trigger autocomplete results on input change. |
| searchTerm | `string` | "" | Search term preselected |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| reset | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the result list is reset |
| searchChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | 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 it is truncated to an empty string. |
| selectResult | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the result list is selected |
| submit | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the search is submitted by pressing the ENTER key. The search term is provided as the value of the event. |
| Name | Type | Description |
| ------------ | --------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| reset | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the result list is reset |
| searchChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | 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 it is truncated to an empty string. |
| selectResult | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the result list is selected |
| submit | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the search is submitted by pressing the ENTER key. The search term is provided as the value of the event. |

10
docs/core/components/sidebar-action-menu.component.md
View File

@@ -42,11 +42,11 @@ the following names:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| expanded | `boolean` | | Toggle the sidebar action menu on expand. |
| title | `string` | | The title of the sidebar action. |
| width | `number` | 272 | Width in pixels for sidebar action menu options. |
| Name | Type | Default value | Description |
| -------- | --------- | ------------- | ------------------------------------------------ |
| expanded | `boolean` | | Toggle the sidebar action menu on expand. |
| title | `string` | | The title of the sidebar action. |
| width | `number` | 272 | Width in pixels for sidebar action menu options. |
## Details

26
docs/core/components/sidenav-layout.component.md
View File

@@ -67,19 +67,19 @@ sub-components (note the use of `<ng-template>` in the sub-components' body sect
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| expandedSidenav | `boolean` | true | Should the navigation region be expanded initially? |
| hideSidenav | `boolean` | false | Toggles showing/hiding the navigation region. |
| position | `string` | "start" | The side that the drawer is attached to. Possible values are 'start' and 'end'. |
| sidenavMax | `number` | | Maximum size of the navigation region. |
| sidenavMin | `number` | | Minimum size of the navigation region. |
| stepOver | `number` | | Screen size at which display switches from small screen to large screen configuration. |
| Name | Type | Default value | Description |
| --------------- | --------- | ------------- | -------------------------------------------------------------------------------------- |
| expandedSidenav | `boolean` | true | Should the navigation region be expanded initially? |
| hideSidenav | `boolean` | false | Toggles showing/hiding the navigation region. |
| position | `string` | "start" | The side that the drawer is attached to. Possible values are 'start' and 'end'. |
| sidenavMax | `number` | | Maximum size of the navigation region. |
| sidenavMin | `number` | | Minimum size of the navigation region. |
| stepOver | `number` | | Screen size at which display switches from small screen to large screen configuration. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| Name | Type | Description |
| -------- | --------------------------------------------------------------------- | ------------------------------------------------------------------------------------- |
| expanded | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the menu toggle and the collapsed/expanded state of the sideNav changes. |
## Details
@@ -124,9 +124,9 @@ Each template is given a context containing the following methods:
Beside the template context's **isMenuMinimized** variable, another way to listen to the component's menu's open/closed state is with the `menuOpenState$` observable, which is driven by a `BehaviorSubject` in the background. The value emitted by this observable is the opposite of the `isMenuMinimized` template variable.
| Name | Type | Default | Description |
| ---- | ---- | ------- | ----------- |
| menuOpenState$ | [`Observable`](http://reactivex.io/documentation/observable.html)&lt;boolean> | true | Another way to listen to menu open/closed state |
| Name | Type | Default | Description |
| -------------- | ----------------------------------------------------------------------------- | ------- | ----------------------------------------------- |
| menuOpenState$ | [`Observable`](http://reactivex.io/documentation/observable.html)&lt;boolean> | true | Another way to listen to menu open/closed state |
Every time the menu state is changed, the following values are emitted:

18
docs/core/components/sorting-picker.component.md
View File

@@ -26,18 +26,18 @@ Selects from a set of predefined sorting definitions and directions.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| ascending | `boolean` | true | Current sorting direction |
| options | `Array<Function>` | \[] | Available sorting options |
| selected | `string` | | Currently selected option key |
| Name | Type | Default value | Description |
| --------- | ----------------- | ------------- | ----------------------------- |
| ascending | `boolean` | true | Current sorting direction |
| options | `Array<Function>` | \[] | Available sorting options |
| selected | `string` | | Currently selected option key |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| sortingChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Raised each time direction gets changed. |
| valueChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Raised each time sorting key gets changed. |
| Name | Type | Description |
| ------------- | --------------------------------------------------------------------- | ------------------------------------------ |
| sortingChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Raised each time direction gets changed. |
| valueChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Raised each time sorting key gets changed. |
## Details

73
docs/core/components/start-form.component.md
View File

@@ -24,45 +24,46 @@ Displays the Start [`Form`](../../../lib/process-services/src/lib/task-list/mode
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| data | [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts) | | Custom form values map to be used with the rendered form. |
| disableCompleteButton | `boolean` | false | If true then the `Complete` outcome button is shown but it will be disabled. |
| disableSaveButton | `boolean` | false | If true then the `Save` outcome button is shown but will be disabled. |
| disableStartProcessButton | `boolean` | false | If true then the `Start Process` outcome button is shown but it will be disabled. |
| fieldValidators | [`FormFieldValidator`](../../../lib/core/form/components/widgets/core/form-field-validator.ts)`[]` | | Contains a list of form field validator instances. |
| form | [`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts) | | Underlying [form model](../../../lib/core/form/components/widgets/core/form.model.ts) instance. |
| formId | `number` | | 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. |
| nameNode | `string` | | Name to assign to the new node where the metadata are stored. |
| nodeId | `string` | | Content Services node ID for the form metadata. |
| path | `string` | | Path of the folder where the metadata will be stored. |
| processDefinitionId | `string` | | [Definition](../../../node_modules/@alfresco/js-api/src/api/content-rest-api/model/definition.ts) ID of the process to start, this parameter can not be use in combination with processId |
| processId | `string` | | Process ID of the process to start, this parameter can not be use in combination with processDefinitionId |
| readOnly | `boolean` | false | Toggle readonly state of the form. Forces all form widgets to render as readonly if enabled. |
| readOnlyForm | `boolean` | false | Is the form read-only (ie, can't be edited)? |
| saveMetadata | `boolean` | false | Toggle saving of form metadata. |
| showCompleteButton | `boolean` | true | Toggle rendering of the `Complete` outcome button. |
| showOutcomeButtons | `boolean` | true | Should form outcome buttons be shown? |
| showRefreshButton | `boolean` | true | Should the refresh button be shown? |
| showSaveButton | `boolean` | true | Toggle rendering of the `Save` outcome button. |
| showTitle | `boolean` | true | Toggle rendering of the form title. |
| showValidationIcon | `boolean` | true | Toggle rendering of the validation icon next to the form title. |
| taskId | `string` | | Task id to fetch corresponding form and values. |
| Name | Type | Default value | Description |
| ------------------------- | -------------------------------------------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| data | [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts) | | Custom form values map to be used with the rendered form. |
| disableCompleteButton | `boolean` | false | If true then the `Complete` outcome button is shown but it will be disabled. |
| disableSaveButton | `boolean` | false | If true then the `Save` outcome button is shown but will be disabled. |
| disableStartProcessButton | `boolean` | false | If true then the `Start Process` outcome button is shown but it will be disabled. |
| enableFixedSpacedForm | `boolean` | true | The form will set a prefixed space for invisible fields. |
| fieldValidators | [`FormFieldValidator`](../../../lib/core/form/components/widgets/core/form-field-validator.ts)`[]` | | Contains a list of form field validator instances. |
| form | [`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts) | | Underlying [form model](../../../lib/core/form/components/widgets/core/form.model.ts) instance. |
| formId | `number` | | 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. |
| nameNode | `string` | | Name to assign to the new node where the metadata are stored. |
| nodeId | `string` | | Content Services node ID for the form metadata. |
| path | `string` | | Path of the folder where the metadata will be stored. |
| processDefinitionId | `string` | | [Definition](../../../lib/cli/node_modules/@alfresco/js-api/src/api/content-rest-api/model/definition.ts) ID of the process to start, this parameter can not be use in combination with processId |
| processId | `string` | | Process ID of the process to start, this parameter can not be use in combination with processDefinitionId |
| readOnly | `boolean` | false | Toggle readonly state of the form. Forces all form widgets to render as readonly if enabled. |
| readOnlyForm | `boolean` | false | Is the form read-only (ie, can't be edited)? |
| saveMetadata | `boolean` | false | Toggle saving of form metadata. |
| showCompleteButton | `boolean` | true | Toggle rendering of the `Complete` outcome button. |
| showOutcomeButtons | `boolean` | true | Should form outcome buttons be shown? |
| showRefreshButton | `boolean` | true | Should the refresh button be shown? |
| showSaveButton | `boolean` | true | Toggle rendering of the `Save` outcome button. |
| showTitle | `boolean` | true | Toggle rendering of the form title. |
| showValidationIcon | `boolean` | true | Toggle rendering of the validation icon next to the form title. |
| taskId | `string` | | Task id to fetch corresponding form and values. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when any error occurs. |
| executeOutcome | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormOutcomeEvent`](../../../lib/core/form/components/widgets/core/form-outcome-event.model.ts)`>` | Emitted when any outcome is executed. Default behaviour can be prevented via `event.preventDefault()`. |
| formCompleted | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is submitted with the `Complete` outcome. |
| formContentClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ContentLinkModel`](../../../lib/core/form/components/widgets/core/content-link.model.ts)`>` | Emitted when a field of the form is clicked. |
| formDataRefreshed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when form values are refreshed due to a data property change. |
| formError | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormFieldModel`](../../core/models/form-field.model.md)`[]>` | Emitted when the supplied form values have a validation error. |
| formLoaded | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is loaded or reloaded. |
| formSaved | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is submitted with the `Save` or custom outcomes. |
| outcomeClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the user clicks one of the outcome buttons that completes the form. |
| Name | Type | Description |
| ------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------ |
| error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when any error occurs. |
| executeOutcome | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormOutcomeEvent`](../../../lib/core/form/components/widgets/core/form-outcome-event.model.ts)`>` | Emitted when any outcome is executed. Default behaviour can be prevented via `event.preventDefault()`. |
| formCompleted | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is submitted with the `Complete` outcome. |
| formContentClicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`ContentLinkModel`](../../../lib/core/form/components/widgets/core/content-link.model.ts)`>` | Emitted when a field of the form is clicked. |
| formDataRefreshed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when form values are refreshed due to a data property change. |
| formError | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormFieldModel`](../../core/models/form-field.model.md)`[]>` | Emitted when the supplied form values have a validation error. |
| formLoaded | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is loaded or reloaded. |
| formSaved | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts)`>` | Emitted when the form is submitted with the `Save` or custom outcomes. |
| outcomeClick | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the user clicks one of the outcome buttons that completes the form. |
## Details

6
docs/core/components/text-mask.component.md
View File

@@ -19,9 +19,9 @@ Implements text field input masks.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| inputMask | `Function` | | Object defining mask and "reversed" status. |
| Name | Type | Default value | Description |
| --------- | ---------- | ------------- | ------------------------------------------- |
| inputMask | `Function` | | Object defining mask and "reversed" status. |
## Details

8
docs/core/components/toolbar.component.md
View File

@@ -72,10 +72,10 @@ pushed to the right by a spacer:
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| color | [`ThemePalette`](https://github.com/angular/components/blob/master/src/material/core/common-behaviors/color.ts) | | Toolbar color. Can be changed to empty value (default), `primary`, `accent` or `warn`. |
| title | `string` | "" | Toolbar title. |
| Name | Type | Default value | Description |
| ----- | --------------------------------------------------------------------------------------------------------------- | ------------- | -------------------------------------------------------------------------------------- |
| color | [`ThemePalette`](https://github.com/angular/components/blob/master/src/material/core/common-behaviors/color.ts) | | Toolbar color. Can be changed to empty value (default), `primary`, `accent` or `warn`. |
| title | `string` | "" | Toolbar title. |
## Details

16
docs/core/components/user-info.component.md
View File

@@ -19,14 +19,14 @@ Shows user information.
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| bpmBackgroundImage | `string` | | Custom path for the background banner image for APS users. |
| ecmBackgroundImage | `string` | | Custom path for the background banner image for ACS users. |
| menuPositionX | [`MenuPositionX`](https://github.com/angular/components/blob/master/src/material/menu/menu-positions.ts) | "after" | Custom choice for opening the menu at the bottom. Can be `before` or `after`. |
| menuPositionY | [`MenuPositionY`](https://github.com/angular/components/blob/master/src/material/menu/menu-positions.ts) | "below" | Custom choice for opening the menu at the bottom. Can be `above` or `below`. |
| namePosition | `string` | "right" | When the username is shown, this defines its position relative to the user info button. Can be `right` or `left`. |
| showName | `boolean` | true | Shows/hides the username next to the user info button. |
| Name | Type | Default value | Description |
| ------------------ | -------------------------------------------------------------------------------------------------------- | ------------- | ----------------------------------------------------------------------------------------------------------------- |
| bpmBackgroundImage | `string` | | Custom path for the background banner image for APS users. |
| ecmBackgroundImage | `string` | | Custom path for the background banner image for ACS users. |
| menuPositionX | [`MenuPositionX`](https://github.com/angular/components/blob/master/src/material/menu/menu-positions.ts) | "after" | Custom choice for opening the menu at the bottom. Can be `before` or `after`. |
| menuPositionY | [`MenuPositionY`](https://github.com/angular/components/blob/master/src/material/menu/menu-positions.ts) | "below" | Custom choice for opening the menu at the bottom. Can be `above` or `below`. |
| namePosition | `string` | "right" | When the username is shown, this defines its position relative to the user info button. Can be `right` or `left`. |
| showName | `boolean` | true | Shows/hides the username next to the user info button. |
## Details

90
docs/core/components/viewer.component.md
View File

@@ -74,57 +74,57 @@ See the [Custom layout](#custom-layout) section for full details of all availabl
### Properties
| Name | Type | Default value | Description |
| ---- | ---- | ------------- | ----------- |
| allowDownload | `boolean` | true | Toggles downloading. |
| allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. |
| allowGoBack | `boolean` | true | Allows `back` navigation |
| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. |
| allowNavigate | `boolean` | false | Toggles before/next navigation. You can use the arrow buttons to navigate between documents in the collection. |
| allowPrint | `boolean` | false | Toggles printing. |
| allowRightSidebar | `boolean` | false | Allow the right sidebar. |
| allowThumbnails | `boolean` | true | Toggles PDF thumbnails. |
| blobFile | [`Blob`](https://developer.mozilla.org/en-US/docs/Web/API/Blob) | | Loads a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob) File |
| canNavigateBefore | `boolean` | true | Toggles the "before" ("&lt;") button. Requires `allowNavigate` to be enabled. |
| canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. |
| displayName | `string` | | Specifies the name of the file when it is not available from the URL. |
| fileName | `string` | | Content filename. |
| maxRetries | `number` | 30 | Number of times the Viewer will retry fetching content Rendition. There is a delay of at least one second between attempts. |
| mimeType | `string` | | MIME type of the file content (when not determined by the filename extension). |
| nodeId | `string` | null | [Node](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/content-rest-api/docs/Node.md) Id of the file to load. |
| overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. |
| sharedLinkId | `string` | null | Shared link id (to display shared file). |
| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. |
| showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. |
| showToolbar | `boolean` | true | Hide or show the toolbar |
| showViewer | `boolean` | true | Hide or show the viewer |
| sidebarLeftTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the left sidebar. The template context contains the loaded node data. |
| sidebarRightTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the right sidebar. The template context contains the loaded node data. |
| thumbnailsTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the pdf thumbnails. |
| urlFile | `string` | "" | If you want to load an external file that does not come from ACS you can use this URL to specify where to load the file from. |
| urlFileViewer | `string` | null | Viewer to use with the `urlFile` address (`pdf`, `image`, `media`, `text`). Used when `urlFile` has no filename and extension. |
| versionId | `string` | null | Version Id of the file to load. |
| Name | Type | Default value | Description |
| -------------------- | --------------------------------------------------------------- | ------------- | ------------------------------------------------------------------------------------------------------------------------------ |
| allowDownload | `boolean` | true | Toggles downloading. |
| allowFullScreen | `boolean` | true | Toggles the 'Full Screen' feature. |
| allowGoBack | `boolean` | true | Allows `back` navigation |
| allowLeftSidebar | `boolean` | false | Allow the left the sidebar. |
| allowNavigate | `boolean` | false | Toggles before/next navigation. You can use the arrow buttons to navigate between documents in the collection. |
| allowPrint | `boolean` | false | Toggles printing. |
| allowRightSidebar | `boolean` | false | Allow the right sidebar. |
| allowThumbnails | `boolean` | true | Toggles PDF thumbnails. |
| blobFile | [`Blob`](https://developer.mozilla.org/en-US/docs/Web/API/Blob) | | Loads a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob) File |
| canNavigateBefore | `boolean` | true | Toggles the "before" ("&lt;") button. Requires `allowNavigate` to be enabled. |
| canNavigateNext | `boolean` | true | Toggles the next (">") button. Requires `allowNavigate` to be enabled. |
| displayName | `string` | | Specifies the name of the file when it is not available from the URL. |
| fileName | `string` | | Content filename. |
| maxRetries | `number` | 30 | Number of times the Viewer will retry fetching content Rendition. There is a delay of at least one second between attempts. |
| mimeType | `string` | | MIME type of the file content (when not determined by the filename extension). |
| nodeId | `string` | null | [Node](https://github.com/Alfresco/alfresco-js-api/blob/develop/src/api/content-rest-api/docs/Node.md) Id of the file to load. |
| overlayMode | `boolean` | false | If `true` then show the Viewer as a full page over the current content. Otherwise fit inside the parent div. |
| sharedLinkId | `string` | null | Shared link id (to display shared file). |
| showLeftSidebar | `boolean` | false | Toggles left sidebar visibility. Requires `allowLeftSidebar` to be set to `true`. |
| showRightSidebar | `boolean` | false | Toggles right sidebar visibility. Requires `allowRightSidebar` to be set to `true`. |
| showToolbar | `boolean` | true | Hide or show the toolbar |
| showViewer | `boolean` | true | Hide or show the viewer |
| sidebarLeftTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the left sidebar. The template context contains the loaded node data. |
| sidebarRightTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the right sidebar. The template context contains the loaded node data. |
| thumbnailsTemplate | [`TemplateRef`](https://angular.io/api/core/TemplateRef)`<any>` | null | The template for the pdf thumbnails. |
| urlFile | `string` | "" | If you want to load an external file that does not come from ACS you can use this URL to specify where to load the file from. |
| urlFileViewer | `string` | null | Viewer to use with the `urlFile` address (`pdf`, `image`, `media`, `text`). Used when `urlFile` has no filename and extension. |
| versionId | `string` | null | Version Id of the file to load. |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| extensionChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when the filename extension changes. |
| goBack | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`BaseEvent`](../../../lib/core/events/base.event.ts)`<any>>` | Emitted when user clicks the 'Back' button. |
| invalidSharedLink | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the shared link used is not valid. |
| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent \| KeyboardEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button. |
| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent \| KeyboardEvent>` | Emitted when user clicks 'Navigate Next' (">") button. |
| print | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`BaseEvent`](../../../lib/core/events/base.event.ts)`<any>>` | Emitted when user clicks the 'Print' button. |
| showViewerChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the viewer is shown or hidden. |
| Name | Type | Description |
| ----------------- | -------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------- |
| extensionChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when the filename extension changes. |
| goBack | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`BaseEvent`](../../../lib/core/events/base.event.ts)`<any>>` | Emitted when user clicks the 'Back' button. |
| invalidSharedLink | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the shared link used is not valid. |
| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent \| KeyboardEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button. |
| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent \| KeyboardEvent>` | Emitted when user clicks 'Navigate Next' (">") button. |
| print | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`BaseEvent`](../../../lib/core/events/base.event.ts)`<any>>` | Emitted when user clicks the 'Print' button. |
| showViewerChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the viewer is shown or hidden. |
## Keyboard shortcuts
| Name | Description |
| ---- | ----------- |
| Esc | Close the viewer (overlay mode only). |
| Left | Invoke 'Navigate before' action. |
| Right | Invoke 'Navigate next' action. |
| Ctrl+F | Activate full-screen mode. |
| Name | Description |
| ------ | ------------------------------------- |
| Esc | Close the viewer (overlay mode only). |
| Left | Invoke 'Navigate before' action. |
| Right | Invoke 'Navigate next' action. |
| Ctrl+F | Activate full-screen mode. |
## Details