diff --git a/docs/README.md b/docs/README.md index a772af2d7d..70328cf129 100644 --- a/docs/README.md +++ b/docs/README.md @@ -91,7 +91,6 @@ for more information about installing and using the source code. | [Error Content Component](core/components/error-content.component.md) | Displays info about a specific error. | [Source](../lib/core/templates/error-content/error-content.component.ts) | | [Form field component](core/components/form-field.component.md) | Represents a UI field in a form. | [Source](../lib/core/form/components/form-field/form-field.component.ts) | | [Form List Component](core/components/form-list.component.md) | Shows forms as a list. | [Source](../lib/core/form/components/form-list.component.ts) | -| [Form component](core/components/form.component.md) | Shows a Form from APS | [Source](../lib/core/form/components/form.component.ts) | | [Header component](core/components/header.component.md) | Reusable header for Alfresco applications. | [Source](../lib/core/layout/components/header/header.component.ts) | | [Host settings component](core/components/host-settings.component.md) ![Internal](docassets/images/InternalIcon.png) | Validates the URLs for ACS and APS and saves them in the user's local storage | [Source](../lib/core/settings/host-settings.component.ts) | | [Icon Component](core/components/icon.component.md) | Provides a universal way of rendering registered and named icons. | [Source](../lib/core/icon/icon.component.ts) | @@ -99,6 +98,7 @@ for more information about installing and using the source code. | [Info drawer layout component](core/components/info-drawer-layout.component.md) | Displays a sidebar-style information panel. | [Source](../lib/core/info-drawer/info-drawer-layout.component.ts) | | [Info Drawer Tab component](core/components/info-drawer-tab.component.md) | Renders tabs in a Info drawer component. | [Source](../lib/core/info-drawer/info-drawer.component.ts) | | [Info Drawer component](core/components/info-drawer.component.md) | Displays a sidebar-style information panel with tabs. | [Source](../lib/core/info-drawer/info-drawer.component.ts) | +| [JsonCell component](core/components/json-cell.component.md) | Show Json formated value inside datatable component. | [Source](../lib/core/datatable/components/datatable/json-cell.component.ts) | | [Language Menu component](core/components/language-menu.component.md) | Displays all the languages that are present in "app.config.json" and the default (EN). | [Source](../lib/core/language-menu/language-menu.component.ts) | | [Login Dialog Panel component](core/components/login-dialog-panel.component.md) | Shows and manages a login dialog. | [Source](../lib/core/login/components/login-dialog-panel.component.ts) | | [Login Dialog component](core/components/login-dialog.component.md) | Allows a user to perform a login via a dialog. | [Source](../lib/core/login/components/login-dialog.component.ts) | @@ -107,7 +107,7 @@ for more information about installing and using the source code. | [Sidebar action menu component](core/components/sidebar-action-menu.component.md) | Displays a sidebar-action menu information panel. | [Source](../lib/core/layout/components/sidebar-action/sidebar-action-menu.component.ts) | | [Sidenav Layout component](core/components/sidenav-layout.component.md) | Displays the standard three-region ADF application layout. | [Source](../lib/core/layout/components/sidenav-layout/sidenav-layout.component.ts) | | [Sorting Picker Component](core/components/sorting-picker.component.md) | Selects from a set of predefined sorting definitions and directions. | [Source](../lib/core/sorting-picker/sorting-picker.component.ts) | -| [Start Form component](core/components/start-form.component.md) | Displays the Start Form for a process. | [Source](../lib/core/form/components/start-form.component.ts) | +| [Start Form component](core/components/start-form.component.md) | Displays the Start Form for a process. | [Source](../lib/process-services/form/start-form.component.ts) | | [Text Mask directive](core/components/text-mask.component.md) | Implements text field input masks. | [Source](../lib/core/form/components/widgets/text/text-mask.component.ts) | | [Toolbar Divider Component](core/components/toolbar-divider.component.md) | Divides groups of elements in a Toolbar with a visual separator. | [Source](../lib/core/toolbar/toolbar-divider.component.ts) | | [Toolbar Title Component](core/components/toolbar-title.component.md) | Supplies custom HTML to be included in a Toolbar component title. | [Source](../lib/core/toolbar/toolbar-title.component.ts) | @@ -120,6 +120,7 @@ for more information about installing and using the source code. | Name | Description | Source link | | ---- | ----------- | ----------- | | [Check Allowable Operation directive](core/directives/check-allowable-operation.directive.md) | Selectively disables an HTML element or Angular component. | [Source](../lib/core/directives/check-allowable-operation.directive.ts) | +| [Clipboard directive](core/directives/clipboard.directive.md) | Copies text to the clipboard. | [Source](../lib/core/clipboard/clipboard.directive.ts) | | [Context Menu directive](core/directives/context-menu.directive.md) | Adds a context menu to a component. | [Source](../lib/core/context-menu/context-menu.directive.ts) | | [Highlight directive](core/directives/highlight.directive.md) | Adds highlighting to selected sections of an HTML element's content. | [Source](../lib/core/directives/highlight.directive.ts) | | [Logout directive](core/directives/logout.directive.md) | Logs the user out when the decorated element is clicked. | [Source](../lib/core/directives/logout.directive.ts) | @@ -178,6 +179,7 @@ for more information about installing and using the source code. | [Bpm User service](core/services/bpm-user.service.md) | Gets information about the current Process Services user. | [Source](../lib/core/userinfo/services/bpm-user.service.ts) | | [Card Item Type service](core/services/card-item-types.service.md) | Maps type names to field component types for the Card View component. | [Source](../lib/core/card-view/services/card-item-types.service.ts) | | [Card View Update service](core/services/card-view-update.service.md) | Reports edits and clicks within fields of a Card View component. | [Source](../lib/core/card-view/services/card-view-update.service.ts) | +| [Clipboard service](core/services/clipboard.service.md) | Copies text to the clipboard. | [Source](../lib/core/clipboard/clipboard.service.ts) | | [Comment Content service](core/services/comment-content.service.md) | Adds and retrieves comments for nodes in Content Services. | [Source](../lib/core/services/comment-content.service.ts) | | [Comment Process service](core/services/comment-process.service.md) | Adds and retrieves comments for task and process instances in Process Services. | [Source](../lib/core/services/comment-process.service.ts) | | [Content service](core/services/content.service.md) | Accesses app-generated data objects via URLs and file downloads. | [Source](../lib/core/services/content.service.ts) | @@ -348,6 +350,7 @@ for more information about installing and using the source code. | [Checklist Component](process-services/components/checklist.component.md) | Shows the checklist task functionality. | [Source](../lib/process-services/task-list/components/checklist.component.ts) | | [Create Process Attachment component](process-services/components/create-process-attachment.component.md) | Displays an Upload Component (Drag and Click) to upload the attachment to a specified process instance. | [Source](../lib/process-services/attachment/create-process-attachment.component.ts) | | [Create Task Attachment Component](process-services/components/create-task-attachment.component.md) | Displays an Upload Component (Drag and Click) to upload the attachment to a specified task. | [Source](../lib/process-services/attachment/create-task-attachment.component.ts) | +| [Form component](process-services/components/form.component.md) | Shows a Form from APS | [Source](../lib/process-services/form/form.component.ts) | | [People list component](process-services/components/people-list.component.md) | Shows a list of users (people). | [Source](../lib/process-services/people/components/people-list/people-list.component.ts) | | [People Search component](process-services/components/people-search.component.md) | Searches users/people. | [Source](../lib/process-services/people/components/people-search/people-search.component.ts) | | [People Component](process-services/components/people.component.md) | Displays users involved with a specified task | [Source](../lib/process-services/people/components/people/people.component.ts) | @@ -404,6 +407,7 @@ for more information about installing and using the source code. | [App List Cloud Component](process-services-cloud/components/app-list-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows all deployed cloud application instances. | [Source](../lib/process-services-cloud/src/lib/app/components/app-list-cloud.component.ts) | | [Edit Process Filter Cloud component](process-services-cloud/components/edit-process-filter-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Shows/edits process filter details. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/edit-process-filter-cloud.component.ts) | | [Edit Task Filter Cloud component](process-services-cloud/components/edit-task-filter-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Edits task filter details. | [Source](../lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filter-cloud.component.ts) | +| [Form cloud component](process-services-cloud/components/form-cloud.component.md) | Shows a form from Process Services. | [Source](../lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts) | | [Group Cloud component](process-services-cloud/components/group-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Searches Groups. | [Source](../lib/process-services-cloud/src/lib/group/components/group-cloud.component.ts) | | [People Cloud Component](process-services-cloud/components/people-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Allows one or more users to be selected (with auto-suggestion) based on the input parameters. | [Source](../lib/process-services-cloud/src/lib/task/start-task/components/people-cloud/people-cloud.component.ts) | | [Process Filters Cloud Component](process-services-cloud/components/process-filters-cloud.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Lists all available process filters and allows to select a filter. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/components/process-filters-cloud.component.ts) | @@ -434,6 +438,7 @@ for more information about installing and using the source code. | Name | Description | Source link | | ---- | ----------- | ----------- | | [Apps Process Cloud Service](process-services-cloud/services/apps-process-cloud.service.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Gets details of deployed apps for the current user. | [Source](../lib/process-services-cloud/src/lib/app/services/apps-process-cloud.service.ts) | +| [Form cloud service](process-services-cloud/services/form-cloud.service.md) | Implements Process Services form methods | [Source](../lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts) | | [Group Cloud Service](process-services-cloud/services/group-cloud.service.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Searches and gets information for groups. | [Source](../lib/process-services-cloud/src/lib/group/services/group-cloud.service.ts) | | [Process Filter Cloud Service](process-services-cloud/services/process-filter-cloud.service.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Manage Process Filters, which are pre-configured Process Instance queries. | [Source](../lib/process-services-cloud/src/lib/process/process-filters/services/process-filter-cloud.service.ts) | | [Process Header Cloud Service](process-services-cloud/services/process-header-cloud.service.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Manages cloud process instances. | [Source](../lib/process-services-cloud/src/lib/process/process-header/services/process-header-cloud.service.ts) | diff --git a/docs/core/components/data-column.component.md b/docs/core/components/data-column.component.md index e097e5cdc6..e8c197b8dc 100644 --- a/docs/core/components/data-column.component.md +++ b/docs/core/components/data-column.component.md @@ -2,7 +2,7 @@ Title: Data Column Component Added: v2.0.0 Status: Active -Last reviewed: 2018-11-12 +Last reviewed: 2019-04-12 --- # [Data Column Component](../../../lib/core/data-column/data-column.component.ts "Defined in data-column.component.ts") @@ -20,6 +20,7 @@ Defines column properties for DataTable, Tasklist, Document List and other compo - [Custom tooltips](#custom-tooltips) - [Column Template](#column-template) - [Styling Techniques](#styling-techniques) + - [Using the `copyContent` option](#using-the-copycontent-option) - [See also](#see-also) ## Basic Usage @@ -42,6 +43,7 @@ Defines column properties for DataTable, Tasklist, Document List and other compo | 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). | | format | `string` | | Value format (if supported by the parent component), for example format of the date. | | formatTooltip | `Function` | | Custom tooltip formatter function. | @@ -49,7 +51,7 @@ Defines column properties for DataTable, Tasklist, Document List and other compo | sortable | `boolean` | true | Toggles ability to sort by this column, for example by clicking the column header. | | 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'. | +| type | `string` | "text" | Value type for the column. Possible settings are 'text', 'image', 'date', 'fileSize', 'location', and 'json'. | ## Details @@ -298,6 +300,34 @@ Now you can declare columns and assign the `desktop-only` class where needed: ![Responsive Mobile](../../docassets/images/responsive-mobile.png) +### Using the `copyContent` option + +When the `copyContent` property is true, a +Clipboard directive +is added to each cell in the column. This lets the user copy the cell content +to the clipboard with a mouse click. + +See the [Clipboard Directive](../directives/clipboard.directive.md) page for full details of the directive. + +Example of using `copyContent` from a JSON config file: + +```json +[ + {"type": "text", "key": "id", "title": "Id", "copyContent": "true"}, + {"type": "text", "key": "name", "title": "name"}, +] +``` + +HTML `` element example: + +```html + + + + ... + + +``` ## See also - [Document list component](../../content-services/components/document-list.component.md) diff --git a/docs/core/components/datatable.component.md b/docs/core/components/datatable.component.md index 1eff7b0e2c..96d8caacba 100644 --- a/docs/core/components/datatable.component.md +++ b/docs/core/components/datatable.component.md @@ -2,7 +2,7 @@ Title: DataTable component Added: v2.0.0 Status: Active -Last reviewed: 2019-03-20 +Last reviewed: 2019-04-12 --- # [DataTable component](../../../lib/core/datatable/components/datatable/datatable.component.ts "Defined in datatable.component.ts") @@ -311,7 +311,7 @@ together in the same datatable. | ---- | ---- | ------------- | ----------- | | actions | `boolean` | false | Toggles the data actions column. | | actionsPosition | `string` | "right" | Position of the actions dropdown menu. Can be "left" or "right". | -| allowDropFiles | `boolean` | false | Toggles file drop support for rows (see [Upload directive](../directives/upload.directive.md) for further details). | +| allowDropFiles | `boolean` | false | Toggles file drop support for rows (see [Upload directive](upload.directive.md) for further details). | | 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 | @@ -625,7 +625,8 @@ widths according to your needs: #### No-growing cells -As mentioned before, in the beginning, all cells have the same width. You can prevent cells from growing by using the `adf-no-grow-cell` class. +As mentioned before, all cells initially have the same width. You can prevent cells from +growing by using the `adf-no-grow-cell` class. ```js { @@ -636,7 +637,7 @@ As mentioned before, in the beginning, all cells have the same width. You can pr } ``` -Notice that this class is compatible with `adf-ellipsis-cell` and for that reason it has a `min-width` of `100px`. You can override this property in your custom class to better suit your needs. +Note that this class is compatible with `adf-ellipsis-cell` and for that reason it has a `min-width` of `100px`. You can override this property in your custom class to better suit your needs. ![](../../docassets/images/datatable-no-grow-cell.png) @@ -680,27 +681,6 @@ the total height of all rows exceeds the fixed height of the parent element. ``` -### CopyClipboardDirective example - -See the [Copy Content Directive ](../directives/clipboard.directive.md) page for full details of the directive - -Json config file: -```json -[ - {"type": "text", "key": "id", "title": "Id", "copyContent": "true"}, - {"type": "text", "key": "name", "title": "name"}, -] -``` -HTML data-columns -```html - - - - - - -``` - Once set up, the sticky header behaves as shown in the image below: ![](../../docassets/images/datatable-sticky-header.png) diff --git a/docs/core/components/json-cell.component.md b/docs/core/components/json-cell.component.md index 6862af1a19..803685a6c7 100644 --- a/docs/core/components/json-cell.component.md +++ b/docs/core/components/json-cell.component.md @@ -1,12 +1,13 @@ --- -Title: JsonCell component -Added: v2.0.0 +Title: Json Cell component +Added: v3.2.0 Status: Active +Last reviewed: 2019-04-12 --- -# [JsonCellComponent](../../../lib/core/datatable/components/datatable/json-cell.component.ts "Defined in empty-list.component.ts") +# [Json Cell Component](../../../lib/core/datatable/components/datatable/json-cell.component.ts "Defined in json-cell.component.ts") -Show Json formated value inside datatable component. +Shows a JSON-formatted value inside a datatable component. ## Basic Usage @@ -18,7 +19,7 @@ Show Json formated value inside datatable component. ``` -You can specify the cell inside configuration file +You can specify the cell inside the `app.config.json` file: ```javascript "adf-cloud-process-list": { @@ -40,14 +41,16 @@ You can specify the cell inside configuration file | Name | Type | Default value | Description | | ---- | ---- | ------------- | ----------- | -| data | [`DataTableAdapter`](../../../lib/core/datatable/data/datatable-adapter.ts) | `null` | Data adapter instance. | -| column | [`DataColumn`](../../../lib/core/datatable/data/data-column.model.ts) | `null` | Data that defines the column | -| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | | Data that defines the row | - +| 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. | +| row | [`DataRow`](../../../lib/core/datatable/data/data-row.model.ts) | | Data that defines the row. | +| tooltip | `string` | | Text for the cell's tooltip. | ## Details -This component provides a custom display to show a [Datatable component](datatable.component.md) cell +This component provides a custom display to show JSON data in a +[Datatable component](datatable.component.md) cell ## See also diff --git a/docs/core/directives/clipboard.directive.md b/docs/core/directives/clipboard.directive.md index f96560d451..7d586277af 100644 --- a/docs/core/directives/clipboard.directive.md +++ b/docs/core/directives/clipboard.directive.md @@ -1,13 +1,13 @@ --- -Title: Copy Clipboard directive +Title: Clipboard directive Added: v3.2.0 Status: Active -Last reviewed: 2019-04-01 +Last reviewed: 2019-04-12 --- # [Clipboard directive](../../../lib/core/clipboard/clipboard.directive.ts "Defined in clipboard.directive.ts") -Copy text to clipboard +Copies text to the clipboard. ## Basic Usage @@ -21,16 +21,25 @@ Copy text to clipboard ``` - ## Class members ### Properties | Name | Type | Default value | Description | | ---- | ---- | ------------- | ----------- | -| target | `HTMLElement ref` | false | HTMLElement reference | -| clipboard-notification | `string` | | Translation key message for toast notification | +| adf-clipboard | `string` | | Translation key or message for the tooltip. | +| clipboard-notification | `string` | | Translation key or message for snackbar notification. | +| target | [`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)` \| `[`HTMLTextAreaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement) | | Reference to the HTML element containing the text to copy. | ## Details -When the user hover the directive element a tooltip will will show up to inform that, when you click on the current element, the content or the reference content will be copied into the clipboard. +Clicking on the decorated element will copy the text content of that element (or the +element specified in the `target` property) to the clipboard. + +Use the parameter to `adf-clipboard` to specify a tooltip message that will be shown when +the user hovers the mouse over the element. You can also provide a snackbar message in the +`clipboard-notification` property, which will appear when the copying is complete. + +## See also + +- [Clipboard service](../../core/services/clipboard.service.md) diff --git a/docs/core/services/clipboard.service.md b/docs/core/services/clipboard.service.md new file mode 100644 index 0000000000..cdea589991 --- /dev/null +++ b/docs/core/services/clipboard.service.md @@ -0,0 +1,38 @@ +--- +Title: Clipboard service +Added: v3.2.0 +Status: Active +Last reviewed: 2019-04-12 +--- + +# [Clipboard service](../../../lib/core/clipboard/clipboard.service.ts "Defined in clipboard.service.ts") + +Copies text to the clipboard. + +## Class members + +### Methods + +- **copyContentToClipboard**(content: `string`, message: `string`)
+ Copies a text string to the clipboard. + - _content:_ `string` - Text to copy + - _message:_ `string` - Snackbar message to alert when copying happens +- **copyToClipboard**(target: [`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)`|`[`HTMLTextAreaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement), message?: `string`)
+ Copies text from an HTML element to the clipboard. + - _target:_ [`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)`|`[`HTMLTextAreaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement) - HTML element to be copied + - _message:_ `string` - (Optional) Snackbar message to alert when copying happens +- **isTargetValid**(target: [`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)`|`[`HTMLTextAreaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement)): `boolean`
+ Checks if the target element can have its text copied. + - _target:_ [`HTMLInputElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement)`|`[`HTMLTextAreaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement) - Target HTML element + - **Returns** `boolean` - True if the text can be copied, false otherwise + +## Details + +Use `copyContentToClipboard` to copy a text string or `isTargetValid` and +`copyToClipboard` to copy the content of an HTML element in the page. The +`message` parameter specifies a snackbar message to alert the user when the +copying operation takes place. + +## See also + +- [Clipboard directive](../../core/directives/clipboard.directive.md) diff --git a/docs/process-services-cloud/claim-task.directive.md b/docs/process-services-cloud/claim-task.directive.md deleted file mode 100644 index 97ccdd8e80..0000000000 --- a/docs/process-services-cloud/claim-task.directive.md +++ /dev/null @@ -1,26 +0,0 @@ ---- -Title: Claim Task Directive -Added: v3.1.0 -Status: Experimental -Last reviewed: 2019-03-05 ---- - -# [Claim task directive](../../lib/process-services-cloud/src/lib/task/directives/claim-task.directive.ts "Defined in claim-task.directive.ts") - -Claim a task - -## Basic Usage - -```html - -``` -## Class members - -### Properties - -| Name | Type | Default value | Description | -| ---- | ---- | ------------- | ----------- | -| taskId | `string` | empty |(Required) The id of the task. | -| appName | `string` | empty | (Required) The name of the application. | -| success | `EventEmitter` | empty | Emitted when the task is completed. | -| error | `EventEmitter` | empty | Emitted when the task cannot be completed. | \ No newline at end of file diff --git a/docs/process-services-cloud/components/form-cloud.component.md b/docs/process-services-cloud/components/form-cloud.component.md index 820ce4e62a..039cb58ac9 100644 --- a/docs/process-services-cloud/components/form-cloud.component.md +++ b/docs/process-services-cloud/components/form-cloud.component.md @@ -1,13 +1,13 @@ --- -Title: Form component +Title: Form cloud component Added: v3.2.0 Status: Active -Last reviewed: 2019-04-01 +Last reviewed: 2019-04-12 --- # [Form cloud component](../../../lib/process-services-cloud/src/lib/form/components/form-cloud.component.ts "Defined in form-cloud.component.ts") -Shows a [`form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) from Process Services +Shows a [`form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) from Process Services. ## Contents @@ -53,21 +53,21 @@ The template defined inside `empty-form` will be shown when no form definition i | Name | Type | Default value | Description | | ---- | ---- | ------------- | ----------- | | appName | `string` | | App id to fetch corresponding form and values. | -| taskId | `string` | | Task id to fetch corresponding form and values. | -| form | [`FormCloudModel`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) | | Underlying [form model](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) instance. | -| formId | `string` | | The id of the form definition to load and display with custom values. | -| data | [`TaskVariableCloud[]`](../../../lib/process-services-cloud/src/lib/form/models/task-variable.model.ts) | | Custom form values map to be used with the rendered form. | +| data | [`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.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. | | 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 | [`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) | | Underlying [form model](../../../lib/core/form/components/widgets/core/form.model.ts) instance. | +| formId | `string` | | Task id to fetch corresponding form and values. | +| nameNode | `string` | | Name to assign to the new node where the metadata are stored. | +| path | `string` | | Path of the folder where the metadata will be stored. | | readOnly | `boolean` | false | Toggle readonly state of the form. Forces all form widgets to render as readonly if enabled. | | showCompleteButton | `boolean` | true | Toggle rendering of the `Complete` outcome button. | -| showDebugButton | `boolean` | false | Toggle debug options. | | showRefreshButton | `boolean` | true | Toggle rendering of the `Refresh` button. | | 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 @@ -75,11 +75,11 @@ The template defined inside `empty-form` will be shown when no form definition i | ---- | ---- | ----------- | | error | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`` | 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)`<`[`FormCloudModel`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is submitted with the `Complete` outcome. | -| formDataRefreshed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloudModel`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when form values are refreshed due to a data property change. | +| formCompleted | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is submitted with the `Complete` outcome. | +| formDataRefreshed | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.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)`<`[`FormCloudModel`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is loaded or reloaded. | -| formSaved | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloudModel`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is submitted with the `Save` or custom outcomes. | +| formLoaded | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is loaded or reloaded. | +| formSaved | [`EventEmitter`](https://angular.io/api/core/EventEmitter)`<`[`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)`>` | Emitted when the form is submitted with the `Save` or custom outcomes. | ## Details @@ -130,7 +130,6 @@ For an existing Task both the form and its values will be fetched and displayed. In this case, only the form definition will be fetched. - ### Controlling outcome execution behaviour In unusual circumstances, you may need to take complete control of form outcome execution. @@ -252,11 +251,10 @@ In the CSS, you can target any outcome ID and change the style as in this exampl ![](../../docassets/images/form-style-sample.png) - ## See also - [Form Field Validator interface](../../core/interfaces/form-field-validator.interface.md) - [Extensibility](../../user-guide/extensibility.md) - [Form rendering service](../../core/services/form-rendering.service.md) - [Form field model](../../core/models/form-field.model.md) -- [Form service](../services/form-cloud.service.md) +- [Form cloud service](../services/form-cloud.service.md) diff --git a/docs/process-services-cloud/services/form-cloud.service.md b/docs/process-services-cloud/services/form-cloud.service.md index fcb2dab5bd..aeca24c579 100644 --- a/docs/process-services-cloud/services/form-cloud.service.md +++ b/docs/process-services-cloud/services/form-cloud.service.md @@ -2,7 +2,7 @@ Title: Form cloud service Added: v3.2.0 Status: Active -Last reviewed: 2019-04-02 +Last reviewed: 2019-04-12 --- # [Form cloud service](../../../lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts "Defined in form-cloud.service.ts") @@ -12,55 +12,74 @@ Implements Process Services form methods ## Basic Usage ```ts -import { FormService } from '@alfresco/adf-core'; +import { FormCloudService } from '@alfresco/adf-process-services-cloud'; @Component(...) class MyComponent { - constructor(formService: FormService) { + constructor(formCloudService: FormCloudService) {} } ``` +## Class members + ### Methods -- `parseForm(json: any, data?:`[`TaskVariableCloud,`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)`readOnly: boolean = false):`[`FormModel`](../../../lib/core/form/components/widgets/core/form.model.ts) - Parses JSON data to create a corresponding [`Form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) model. - - `json` - JSON to create the form - - `data` - (Optional) [`Values`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts) for the form fields - - `readOnly` - Should the form fields be read-only? +- **completeTaskForm**(appName: `string`, taskId: `string`, formId: `string`, formValues: [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts), outcome: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>`
+ Completes a task form. + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - _formId:_ `string` - ID of the form to complete + - _formValues:_ [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts) - [Form](../../../lib/process-services/task-list/models/form.model.ts) values object + - _outcome:_ `string` - (Optional) [Form](../../../lib/process-services/task-list/models/form.model.ts) outcome + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>` - Updated task details +- **createTemporaryRawRelatedContent**(file: `any`, nodeId: `any`): [`Observable`](http://reactivex.io/documentation/observable.html)``
-- `saveTaskForm(appName: string, taskId: string, formId: string, formValues: FormValues):`[`Observable`](http://reactivex.io/documentation/observable.html)`` - Saves task [`form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts). - - `appName` - App Name - - `taskId` - Task Id - - `formId` - Form Id - - `formValues` - [`Form Values`](../../../lib/core/form/components/widgets/core/form-values.ts) + - _file:_ `any` - + - _nodeId:_ `any` - + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`` - -- `completeTaskForm(appName: string, taskId: string, formId: string, formValues: FormValues, outcome: string):`[`Observable`](http://reactivex.io/documentation/observable.html)`` - Completes task [`form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) - - `appName` - App Name - - `taskId` - Task Id - - `formId` - Form Id - - `formValues` - [`Form Values`](../../../lib/core/form/components/widgets/core/form-values.ts) - - `outcome` - (Optional) [`Form`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) Outcome +- **getForm**(appName: `string`, taskId: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)``
+ Gets a form definition. + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`` - Form definition +- **getProcessStorageFolderTask**(appName: `string`, taskId: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)``
-- `getTaskForm(appName: string, taskId: string):`[`Observable`](http://reactivex.io/documentation/observable.html)`` - Get form defintion of a task - - `appName` - App Name - - `taskId` - Task Id + - _appName:_ `string` - + - _taskId:_ `string` - + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`` - -- `getForm(appName: string, formId: string):`[`Observable`](http://reactivex.io/documentation/observable.html)`` - Get a form definition - - `appName` - App Name - - `formId` - Form Id +- **getTask**(appName: `string`, taskId: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>`
+ Gets details of a task + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>` - Details of the task +- **getTaskForm**(appName: `string`, taskId: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)``
+ Gets the form definition of a task. + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`` - Form definition +- **getTaskVariables**(appName: `string`, taskId: `string`): [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)`[]>`
+ Gets the variables of a task. + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)`[]>` - Task variables +- **parseForm**(json: `any`, data?: [`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)`[]`, readOnly: `boolean` = `false`): [`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts)
+ Parses JSON data to create a corresponding form. + - _json:_ `any` - JSON data to create the form + - _data:_ [`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)`[]` - (Optional) (Optional) Values for the form's fields + - _readOnly:_ `boolean` - Toggles whether or not the form should be read-only + - **Returns** [`FormCloud`](../../../lib/process-services-cloud/src/lib/form/models/form-cloud.model.ts) - [Form](../../../lib/process-services/task-list/models/form.model.ts) created from the JSON specification +- **saveTaskForm**(appName: `string`, taskId: `string`, formId: `string`, formValues: [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts)): [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>`
+ Saves a task form. + - _appName:_ `string` - Name of the app + - _taskId:_ `string` - ID of the target task + - _formId:_ `string` - ID of the form to save + - _formValues:_ [`FormValues`](../../../lib/core/form/components/widgets/core/form-values.ts) - [Form](../../../lib/process-services/task-list/models/form.model.ts) values object + - **Returns** [`Observable`](http://reactivex.io/documentation/observable.html)`<`[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)`>` - Updated task details -- `getTask(appName: string, taskId: string):`[`Observable`](http://reactivex.io/documentation/observable.html)<[`TaskDetailsCloudModel`](../../../lib/process-services-cloud/src/lib/task/start-task/models/task-details-cloud.model.ts)> - Gets details of a task. - - `appName` - App Name - - `taskId` - Task Id +## See also -- `getTaskVariables(appName: string, taskId: string):`[`Observable`](http://reactivex.io/documentation/observable.html)<[`TaskVariableCloud`](../../../lib/process-services-cloud/src/lib/form/models/task-variable-cloud.model.ts)[]> - Gets variables of a task. - - `appName` - App Name - - `taskId` - Task Id +- [Form cloud component](../components/form-cloud.component.md) diff --git a/docs/process-services-cloud/unclaim-tas.directie.md b/docs/process-services-cloud/unclaim-tas.directie.md deleted file mode 100644 index 1bdebdf9b0..0000000000 --- a/docs/process-services-cloud/unclaim-tas.directie.md +++ /dev/null @@ -1,26 +0,0 @@ ---- -Title: Unclaim Task Directive -Added: v3.1.0 -Status: Experimental -Last reviewed: 2019-03-05 ---- - -# [Unclaim task directive](../../lib/process-services-cloud/src/lib/task/directives/unclaim-task.directive.ts "Defined in unclaim-task.directive.ts") - -Unclaim a task - -## Basic Usage - -```html - -``` -## Class members - -### Properties - -| Name | Type | Default value | Description | -| ---- | ---- | ------------- | ----------- | -| taskId | `string` | empty |(Required) The id of the task. | -| appName | `string` | empty | (Required) The name of the application. | -| success | `EventEmitter` | empty | Emitted when the task is completed. | -| error | `EventEmitter` | empty | Emitted when the task cannot be completed. | \ No newline at end of file diff --git a/lib/core/clipboard/clipboard.directive.ts b/lib/core/clipboard/clipboard.directive.ts index 8ca6d16f6e..167fc08ac3 100644 --- a/lib/core/clipboard/clipboard.directive.ts +++ b/lib/core/clipboard/clipboard.directive.ts @@ -23,13 +23,16 @@ import { ClipboardService } from './clipboard.service'; exportAs: 'adfClipboard' }) export class ClipboardDirective { + /** Translation key or message for the tooltip. */ // tslint:disable-next-line:no-input-rename @Input('adf-clipboard') placeholder: string; + /** Reference to the HTML element containing the text to copy. */ @Input() target: HTMLInputElement | HTMLTextAreaElement; + /** Translation key or message for snackbar notification. */ // tslint:disable-next-line:no-input-rename @Input('clipboard-notification') message: string; diff --git a/lib/core/clipboard/clipboard.service.ts b/lib/core/clipboard/clipboard.service.ts index 53064a3beb..a265340e70 100644 --- a/lib/core/clipboard/clipboard.service.ts +++ b/lib/core/clipboard/clipboard.service.ts @@ -28,6 +28,11 @@ export class ClipboardService { private logService: LogService, private notificationService: NotificationService) {} + /** + * Checks if the target element can have its text copied. + * @param target Target HTML element + * @returns True if the text can be copied, false otherwise + */ isTargetValid(target: HTMLInputElement | HTMLTextAreaElement) { if (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement) { return !target.hasAttribute('disabled'); @@ -35,6 +40,11 @@ export class ClipboardService { return false; } + /** + * Copies text from an HTML element to the clipboard. + * @param target HTML element to be copied + * @param message Snackbar message to alert when copying happens + */ copyToClipboard(target: HTMLInputElement | HTMLTextAreaElement, message?: string) { if (this.isTargetValid(target)) { try { @@ -48,6 +58,11 @@ export class ClipboardService { } } + /** + * Copies a text string to the clipboard. + * @param content Text to copy + * @param message Snackbar message to alert when copying happens + */ copyContentToClipboard(content: string, message: string) { try { document.addEventListener('copy', (e: ClipboardEvent) => { diff --git a/lib/core/data-column/data-column.component.ts b/lib/core/data-column/data-column.component.ts index 345dace375..554e48e835 100644 --- a/lib/core/data-column/data-column.component.ts +++ b/lib/core/data-column/data-column.component.ts @@ -32,7 +32,7 @@ export class DataColumnComponent implements OnInit { key: string; /** Value type for the column. Possible settings are 'text', 'image', - * 'date', 'fileSize' and 'location'. + * 'date', 'fileSize', 'location', and 'json'. */ @Input() type: string = 'text'; @@ -66,7 +66,7 @@ export class DataColumnComponent implements OnInit { @Input('class') cssClass: string; - /** flag to show the copy content directive */ + /** Enables/disables a Clipboard directive to allow copying of cell contents. */ @Input() copyContent: boolean; diff --git a/lib/core/datatable/components/datatable/datatable-cell.component.ts b/lib/core/datatable/components/datatable/datatable-cell.component.ts index 01b6f5cb45..256f3bf2b2 100644 --- a/lib/core/datatable/components/datatable/datatable-cell.component.ts +++ b/lib/core/datatable/components/datatable/datatable-cell.component.ts @@ -55,20 +55,25 @@ import { Node } from '@alfresco/js-api'; host: { class: 'adf-datatable-cell' } }) export class DataTableCellComponent implements OnInit, OnDestroy { + /** Data table adapter instance. */ @Input() data: DataTableAdapter; + /** Data that defines the column. */ @Input() column: DataColumn; + /** Data that defines the row. */ @Input() row: DataRow; value$ = new BehaviorSubject(''); + /** Enables/disables a Clipboard directive to allow copying of the cell's content. */ @Input() copyContent: boolean; + /** Text for the cell's tooltip. */ @Input() tooltip: string; diff --git a/lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts b/lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts index 1c4a7ab0ae..eeced9d7f1 100644 --- a/lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts +++ b/lib/process-services-cloud/src/lib/form/services/form-cloud.service.ts @@ -36,6 +36,12 @@ export class FormCloudService { private logService: LogService ) {} + /** + * Gets the form definition of a task. + * @param appName Name of the app + * @param taskId ID of the target task + * @returns Form definition + */ getTaskForm(appName: string, taskId: string): Observable { return this.getTask(appName, taskId).pipe( switchMap((task: TaskDetailsCloudModel) => { @@ -52,6 +58,14 @@ export class FormCloudService { ); } + /** + * Saves a task form. + * @param appName Name of the app + * @param taskId ID of the target task + * @param formId ID of the form to save + * @param formValues Form values object + * @returns Updated task details + */ saveTaskForm(appName: string, taskId: string, formId: string, formValues: FormValues): Observable { const apiUrl = this.buildSaveFormUrl(appName, formId); const saveFormRepresentation = { values: formValues, taskId: taskId }; @@ -89,6 +103,15 @@ export class FormCloudService { ); } + /** + * Completes a task form. + * @param appName Name of the app + * @param taskId ID of the target task + * @param formId ID of the form to complete + * @param formValues Form values object + * @param outcome (Optional) Form outcome + * @returns Updated task details + */ completeTaskForm(appName: string, taskId: string, formId: string, formValues: FormValues, outcome: string): Observable { const apiUrl = this.buildSubmitFormUrl(appName, formId); const completeFormRepresentation: any = { values: formValues, taskId: taskId }; @@ -111,6 +134,12 @@ export class FormCloudService { ); } + /** + * Gets details of a task + * @param appName Name of the app + * @param taskId ID of the target task + * @returns Details of the task + */ getTask(appName: string, taskId: string): Observable { const apiUrl = this.buildGetTaskUrl(appName, taskId); return from(this.apiService @@ -145,6 +174,12 @@ export class FormCloudService { ); } + /** + * Gets the variables of a task. + * @param appName Name of the app + * @param taskId ID of the target task + * @returns Task variables + */ getTaskVariables(appName: string, taskId: string): Observable { const apiUrl = this.buildGetTaskVariablesUrl(appName, taskId); return from(this.apiService @@ -162,6 +197,12 @@ export class FormCloudService { ); } + /** + * Gets a form definition. + * @param appName Name of the app + * @param taskId ID of the target task + * @returns Form definition + */ getForm(appName: string, taskId: string): Observable { const apiUrl = this.buildGetFormUrl(appName, taskId); const bodyParam = {}, pathParams = {}, queryParams = {}, headerParams = {}, @@ -179,6 +220,13 @@ export class FormCloudService { ); } + /** + * Parses JSON data to create a corresponding form. + * @param json JSON data to create the form + * @param data (Optional) Values for the form's fields + * @param readOnly Toggles whether or not the form should be read-only + * @returns Form created from the JSON specification + */ parseForm(json: any, data?: TaskVariableCloud[], readOnly: boolean = false): FormCloud { if (json) { const form = new FormCloud(json, data, readOnly, this); diff --git a/tools/doc/doctool.config.json b/tools/doc/doctool.config.json index 78d5fac00f..51e365e500 100644 --- a/tools/doc/doctool.config.json +++ b/tools/doc/doctool.config.json @@ -36,6 +36,8 @@ "Blob": "https://developer.mozilla.org/en-US/docs/Web/API/Blob", "Promise": "https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises", "EventEmitter": "https://angular.io/api/core/EventEmitter", + "HTMLInputElement": "https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement", + "HTMLTextAreaElement": "https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement", "MatDialog": "https://material.angular.io/components/dialog/overview", "MatIconRegistry": "https://material.angular.io/components/icon/api", "MatSnackBarRef": "https://material.angular.io/components/snack-bar/overview",