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

Documentation update 3.6.0 (#5257)

Browse Source 
* documentation update 3.6.0

* documentation update 3.6.0

* update missing doc
This commit is contained in:
Eugenio Romano
2019-11-18 12:34:28 +00:00
committed by GitHub
parent 7ca2f5d1e9
commit a6ad7a5ad0
113 changed files with 421 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -151,7 +151,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`](../../../lib/content-services/content-metadata/interfaces/property.interface.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.

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

@@ -45,7 +45,7 @@ Defines column properties for DataTable, Tasklist, Document List and other compo
| ---- | ---- | ------------- | ----------- |
| 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 | |
| editable | `boolean` | false | Toggles the editing support of the column data. |
| 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`. |

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

@@ -28,6 +28,7 @@ See it live: [DataTable Quickstart](https://embed.plnkr.co/80qr4YFBeHjLMdAV0F6l/
- [Card view](#card-view)
- [Using events](#using-events)
- [Customizing the component's styles](#customizing-the-components-styles)
- [Resolver Function](#resolver-function)
- [See also](#see-also)
## Basic usage
@@ -354,7 +355,7 @@ Learm more about styling your datatable: [Customizing the component's styles](#c
| 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` | | Custom resolver function which is used to parse dynamic column objects. see [Resolver Function](#resolver-function)|
| 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. |
@@ -760,12 +761,15 @@ Once set up, the sticky header behaves as shown in the image below:
If you have a table with complex object, you might want to parse it before to display. you can do this using following steps.
# what is resolver
Resolver is a pure function which gets executed on each row and columns.
# purpose
It helps to parse the complex object in the data table.
# example
Assume we want to merge two properties and show them in a text format
```json
@@ -788,7 +792,6 @@ Assume we want to merge two properties and show them in a text format
}
```
here is the sample resolver which merge the users property and status and it will show in one column
```javascript
@@ -819,9 +822,6 @@ here is the sample resolver which merge the users property and status and it wil
![](../../docassets/images/custom-data-table-resolver.png)
## See also
- [Data column component](data-column.component.md)

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

@@ -27,7 +27,7 @@ based on the field type or the metadata information.
| 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 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`](../../core/models/form-field.model.md) definitions. |
| 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,8 +38,8 @@ 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 | Field Type | Component Type |
| ---------------------------------------------------------------------------------------------------- | ---------- | -------------- |
| _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) |

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

@@ -39,6 +39,7 @@ body of the element:
| 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. |
@@ -50,7 +51,7 @@ body of the element:
| Name | Type | Description |
| ---- | ---- | ----------- |
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the sidenav button is clicked. |
| clicked | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<boolean>` | Emitted when the sidenav button is clicked. |
## Details

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

@@ -45,6 +45,7 @@ You can specify the cell inside the `app.config.json` file:
| 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. |

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

@@ -29,22 +29,21 @@ Displays a input text that supports autocompletion
| 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. |
| highlight | `boolean` | false | Toggles highlighting of the search term in the results. |
| 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 | [`SearchTriggerDirective`](../../../lib/core/search-text/search-trigger.directive.ts) | null | Trigger autocomplete results on input change |
| searchTerm | `string` | empty | Preselected search widget value |
| debounceTime | `number` | 0 | Debounce time in miliseconds |
| collapseOnSubmit | `boolean` | true | Collapse search bar on submit |
| focusListener | [`Observable`](http://reactivex.io/documentation/observable.html) `<` [`FocusEvent`](https://developer.mozilla.org/en-US/docs/Web/API/FocusEvent) `>` | null | Listener for results-list events (focus, blur and focusout) |
| defaultState | [`SearchTextStateEnum`](../../../lib/core/models/search-text-input.model.ts) | collapsed | Default state of the search widget |
| searchAutocomplete | `any` | false | Trigger autocomplete results on input change. |
| searchTerm | `string` | "" | Search term preselected |
### Events
| Name | Type | Description |
| ---- | ---- | ----------- |
| searchChange | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<string>` | Emitted when search widget value is changed. |
| submit | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when search widget is submited. |
| 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 |
| reset | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<any>` | Emitted when the search widget is reseted |
| 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. |

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

@@ -111,8 +111,8 @@ See the [Custom layout](#custom-layout) section for full details of all availabl
| 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)`<>` | Emitted when the shared link used is not valid. |
| navigateBefore | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent|KeybordEvent>` | Emitted when user clicks 'Navigate Before' ("&lt;") button or keyboard left key |
| navigateNext | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<MouseEvent|KeybordEvent>` | Emitted when user clicks 'Navigate Next' (">") button or keyboard right key. |
| 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. |