diff --git a/docs/document-list.component.md b/docs/document-list.component.md index 0bfd40f76c..6e9ecfdebc 100644 --- a/docs/document-list.component.md +++ b/docs/document-list.component.md @@ -47,49 +47,48 @@ Displays the documents from a repository. ### Properties -The properties currentFolderId, folderNode and node are the entry initialization properties of the document list. They cannot be used together, choose the one that suites more your use case. - -| Name | Type | Default | Description | -| ---- | ---- | ------- | ----------- | -| permissionsStyle | [PermissionStyleModel\[\]](permissions-style.model.md) | null | Define a set of CSS styles styles to apply depending on the permission of the user on that node. See the [Permission Style model](permissions-style.model.md) page for further details and examples. | -| locationFormat | string | '/' | The default route for all the location-based columns (if declared). | -| navigate | boolean | true | Toggles navigation to folder content or file preview | -| navigationMode | string (click,dblclick) | dblclick | User interaction for folder navigation or file preview | -| thumbnails | boolean | false | Show document thumbnails rather than icons | -| selectionMode | string | 'single' | Row selection mode. Can be none, `single` or `multiple`. For `multiple` mode you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. | -| multiselect | boolean | false | Toggles multiselect mode | -| contentActions | boolean | false | Toggles content actions for each row | -| contentActionsPosition | string (left\|right) | right | Position of the content actions dropdown menu. | -| contextMenuActions | boolean | false | Toggles context menus for each row | -| emptyFolderImageUrl | string | assets/images/empty_doc_lib.svg | Custom image for empty folder | -| allowDropFiles | boolean | false | Toggle file drop support for rows (see **ng2-alfresco-core/UploadDirective** for more details) | -| sorting | string\[] | | Defines default sorting. The format is an array of 2 strings `[key, direction]` i.e. `['name', 'desc']` or `['name', 'asc']`. Set this value only if you want to override default sorting detected by the component based on columns. | -| 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 | -| loading | boolean | false | Toggles the loading state and animated spinners for the component. Used in combination with `navigate=false` to perform custom navigation and loading state indication. | -| rowFilter | `RowFilter` | | Custom row filter, [see more](#custom-row-filter). | -| imageResolver | `ImageResolver` | | Custom image resolver, [see more](#custom-image-resolver). | -| currentFolderId | string | null | The ID of the folder node to display or a reserved string alias for special sources (see **Data Sources**) | -| folderNode | [MinimalNodeEntryEntity](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/NodeMinimalEntry.md) | null | Currently displayed folder node | -| node | [NodePaging](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/NodePaging.md) | null | Document list will show all the nodes contained in the NodePaging entity | -| maxItems | number | Default value is stored into user preference settings | determine the size of the page for the element into document list | -| skipCount | number | 0 | element to skip over for pagination purpose | -| enableInfiniteScrolling | boolean | true | Enable documentlist to work into infinite scrolling mode | +| Name | Type | Description | +| ---- | ---- | ----------- | +| permissionsStyle | `PermissionStyleModel[]` | Define a set of CSS styles styles to apply depending on the permission of the user on that node. See the Permission Style model page for further details and examples.
Default value: `[]` | +| locationFormat | `string` | The default route for all the location-based columns (if declared).
Default value: `'/'` | +| navigate | `boolean` | Toggles navigation to folder content or file preview
Default value: `true` | +| navigationMode | `string` | User interaction for folder navigation or file preview. Valid values are "click" and "dblclick".
Default value: `DocumentListComponent.DOUBLE_CLICK_NAVIGATION` | +| thumbnails | `boolean` | Show document thumbnails rather than icons
Default value: `false` | +| selectionMode | `string` | Row selection mode. Can be null, \`single\` or \`multiple\`. For \`multiple\` mode, you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows.
Default value: `'single'` | +| multiselect | `boolean` | Toggles multiselect mode
Default value: `false` | +| contentActions | `boolean` | Toggles content actions for each row
Default value: `false` | +| contentActionsPosition | `string` | Position of the content actions dropdown menu. Can be set to "left" or "right".
Default value: `'right'` | +| contextMenuActions | `boolean` | Toggles context menus for each row
Default value: `false` | +| emptyFolderImageUrl | `string` | Custom image for empty folder
Default value: `'./assets/images/empty_doc_lib.svg'` | +| allowDropFiles | `boolean` | Toggle file drop support for rows (see Upload Directive for further details
Default value: `false` | +| sorting | `string[]` | Defines default sorting. The format is an array of 2 strings \`\[key, direction]\` i.e. \`\['name', 'desc']\` or \`\['name', 'asc']\`. Set this value only if you want to override the default sorting detected by the component based on columns. | +| rowStyle | `string` | The inline style to apply to every row. See the Angular NgStyle docs for more details and usage examples. | +| rowStyleClass | `string` | The CSS class to apply to every row | +| loading | `boolean` | Toggles the loading state and animated spinners for the component. Used in combination with \`navigate=false\` to perform custom navigation and loading state indication.
Default value: `false` | +| rowFilter | `any` | Custom row filter
Default value: `null` | +| imageResolver | `any` | Custom image resolver
Default value: `null` | +| currentFolderId | `string` | The ID of the folder node to display or a reserved string alias for special sources
Default value: `null` | +| folderNode | `MinimalNodeEntryEntity` | Currently displayed folder node
Default value: `null` | +| node | `NodePaging` | The Document list will show all the nodes contained in the NodePaging entity
Default value: `null` | +| maxItems | `number` | Default value is stored into user preference settings | +| skipCount | `number` | Number of elements to skip over for pagination purposes
Default value: `0` | +| enableInfiniteScrolling | `boolean` | Set document list to work in infinite scrolling mode
Default value: `false` | ### Events -| Name | Description | -| ---- | ----------- | -| nodeClick | emitted when user clicks a list node | -| nodeDblClick | emitted when user double-clicks list node | -| folderChange | emitted once current display folder has changed | -| preview | emitted when user acts upon files with either single or double click (depends on `navigation-mode`), recommended for Viewer components integration | -| permissionError | emitted when user is attempting to create a folder via action menu without having the permission to do it | -| ready | emitted when the documentList is ready and loads all the elements | -| error | emitted when API fails to get documentList data | +| Name | Type | Description | +| ---- | ---- | ----------- | +| nodeClick | `EventEmitter` | Emitted when the user clicks a list node | +| nodeDblClick | `EventEmitter` | Emitted when the user double-clicks a list node | +| folderChange | `EventEmitter` | Emitted when the current display folder changes | +| preview | `EventEmitter` | Emitted when the user acts upon files with either single or double click (depends on \`navigation-mode\`). Useful for integration with the Viewer component. | +| ready | `EventEmitter` | Emitted when the Document List has loaded all items and is ready for use | +| error | `EventEmitter` | Emitted when the API fails to get the Document List data | ## Details +The properties currentFolderId, folderNode and node are the entry initialization properties of the document list. They cannot be used together, so choose the one that suits your use case best. + ### DOM Events Below are the DOM events the DocumentList component emits. diff --git a/lib/config/DocProcessor/tools/tscProps.js b/lib/config/DocProcessor/tools/tscProps.js index a0143a865f..9336f7db17 100644 --- a/lib/config/DocProcessor/tools/tscProps.js +++ b/lib/config/DocProcessor/tools/tscProps.js @@ -2,7 +2,6 @@ exports.__esModule = true; var ts = require("typescript"); var path = require("path"); -var program = require("commander"); var heading = require("mdast-util-heading-range"); var unist = require("../unistHelpers"); function initPhase(aggData) { @@ -27,19 +26,18 @@ function updatePhase(tree, pathname, aggData) { var inTable_1 = buildInputsTable(inputs); var outTable_1 = buildOutputsTable(outputs); if (inTable_1) { - console.log("Made a props table"); heading(tree, "Properties", function (before, section, after) { return [before, inTable_1, after]; }); } if (outTable_1) { - console.log("Made an events table"); heading(tree, "Events", function (before, section, after) { return [before, outTable_1, after]; }); } } } + return true; } exports.updatePhase = updatePhase; function initialCap(str) { @@ -61,7 +59,7 @@ function fixCompodocFilename(rawName) { return finalName; } function getPropDocData(srcPath, docClassName, inputs, outputs) { - var prog = ts.createProgram(program.args, { + var prog = ts.createProgram([srcPath], { target: ts.ScriptTarget.ES5, module: ts.ModuleKind.CommonJS }); var sourceFiles = prog.getSourceFiles(); @@ -97,7 +95,8 @@ function getPropDataFromClass(checker, classDec, inputs, outputs) { if (prop.initializer) { initializer = prop.initializer.getText(sourceFile); } - var doc = ts.displayPartsToString(memSymbol.getDocumentationComment()); + var doc = ts.displayPartsToString(memSymbol.getDocumentationComment(checker)); + doc = doc.replace(/\r\n/g, " "); var propType = checker.typeToString(checker.getTypeOfSymbolAtLocation(memSymbol, memSymbol.valueDeclaration)); var dec = prop.decorators[0].getText(sourceFile); if (dec.match(/@Input/)) { @@ -127,23 +126,30 @@ function buildInputsTable(inputs) { unist.makeTableRow([ unist.makeTableCell([unist.makeText("Name")]), unist.makeTableCell([unist.makeText("Type")]), - unist.makeTableCell([unist.makeText("Default value")]), + // unist.makeTableCell([unist.makeText("Default value")]), unist.makeTableCell([unist.makeText("Description")]) ]) ]; for (var i = 0; i < inputs.length; i++) { var pName = inputs[i].name; var pType = inputs[i].type; - var pDefault = inputs[i].defaultValue || ""; - var pDesc = inputs[i].description || ""; + var pDefault = inputs[i].init || ""; + var pDesc = inputs[i].docText || ""; if (pDesc) { - pDesc = pDesc.trim().replace(/[\n\r]+/, " "); + //pDesc = pDesc.trim().replace(/[\n\r]+/, " "); + pDesc = pDesc.replace(/[\n\r]+/, " "); + } + var descCellContent = [unist.makeText(pDesc)]; + if (pDefault) { + descCellContent.push(unist.makeHTML("
")); + descCellContent.push(unist.makeText(" Default value: ")); + descCellContent.push(unist.makeInlineCode(pDefault)); } var cells = [ unist.makeTableCell([unist.makeText(pName)]), - unist.makeTableCell([unist.makeText(pType)]), - unist.makeTableCell([unist.makeText(pDefault)]), - unist.makeTableCell([unist.makeText(pDesc)]) + unist.makeTableCell([unist.makeInlineCode(pType)]), + //unist.makeTableCell([unist.makeText(pDefault)]), + unist.makeTableCell(descCellContent) ]; rows.push(unist.makeTableRow(cells)); } @@ -163,13 +169,13 @@ function buildOutputsTable(outputs) { for (var i = 0; i < outputs.length; i++) { var eName = outputs[i].name; var eType = outputs[i].type; - var eDesc = outputs[i].description || ""; + var eDesc = outputs[i].docText || ""; if (eDesc) { eDesc = eDesc.trim().replace(/[\n\r]+/, ' '); } var cells = [ unist.makeTableCell([unist.makeText(eName)]), - unist.makeTableCell([unist.makeText(eType)]), + unist.makeTableCell([unist.makeInlineCode(eType)]), unist.makeTableCell([unist.makeText(eDesc)]) ]; rows.push(unist.makeTableRow(cells)); diff --git a/lib/config/DocProcessor/tools/tscProps.ts b/lib/config/DocProcessor/tools/tscProps.ts index 739b1b5335..b154ee7ae7 100644 --- a/lib/config/DocProcessor/tools/tscProps.ts +++ b/lib/config/DocProcessor/tools/tscProps.ts @@ -6,6 +6,7 @@ import * as program from "commander"; import * as heading from "mdast-util-heading-range"; import * as unist from "../unistHelpers"; +import { JsxEmit } from "typescript"; export function initPhase(aggData) { } @@ -25,7 +26,7 @@ export function updatePhase(tree, pathname, aggData) { if (srcData) { let srcPath = srcData.path; let className = fixCompodocFilename(fileNameNoSuffix); - + let inputs = []; let outputs = []; getPropDocData(path.resolve(".", srcPath), className, inputs, outputs); @@ -34,20 +35,20 @@ export function updatePhase(tree, pathname, aggData) { let outTable = buildOutputsTable(outputs); if (inTable) { - console.log("Made a props table"); heading(tree, "Properties", (before, section, after) => { return [before, inTable, after]; }); } if (outTable) { - console.log("Made an events table"); heading(tree, "Events", (before, section, after) => { return [before, outTable, after]; }); } } } + + return true; } @@ -81,7 +82,7 @@ function fixCompodocFilename(rawName: string) { function getPropDocData(srcPath: string, docClassName: string, inputs: any[], outputs: any[]) { - let prog = ts.createProgram(program.args, { + let prog = ts.createProgram([srcPath], { target: ts.ScriptTarget.ES5, module: ts.ModuleKind.CommonJS }); @@ -135,7 +136,9 @@ function getPropDataFromClass( initializer = prop.initializer.getText(sourceFile); } - let doc = ts.displayPartsToString(memSymbol.getDocumentationComment()); + let doc = ts.displayPartsToString(memSymbol.getDocumentationComment(checker)); + doc = doc.replace(/\r\n/g, " "); + let propType = checker.typeToString(checker.getTypeOfSymbolAtLocation(memSymbol, memSymbol.valueDeclaration!)); let dec = prop.decorators[0].getText(sourceFile); @@ -169,7 +172,7 @@ function buildInputsTable(inputs: any[]) { unist.makeTableRow([ unist.makeTableCell([unist.makeText("Name")]), unist.makeTableCell([unist.makeText("Type")]), - unist.makeTableCell([unist.makeText("Default value")]), + // unist.makeTableCell([unist.makeText("Default value")]), unist.makeTableCell([unist.makeText("Description")]) ]) ]; @@ -177,18 +180,27 @@ function buildInputsTable(inputs: any[]) { for (var i = 0; i < inputs.length; i++) { var pName = inputs[i].name; var pType = inputs[i].type; - var pDefault = inputs[i].defaultValue || ""; - var pDesc = inputs[i].description || ""; + var pDefault = inputs[i].init || ""; + var pDesc = inputs[i].docText || ""; if (pDesc) { - pDesc = pDesc.trim().replace(/[\n\r]+/, " "); + //pDesc = pDesc.trim().replace(/[\n\r]+/, " "); + pDesc = pDesc.replace(/[\n\r]+/, " "); + } + + var descCellContent = [unist.makeText(pDesc)]; + + if (pDefault) { + descCellContent.push(unist.makeHTML("
")); + descCellContent.push(unist.makeText(" Default value: ")); + descCellContent.push(unist.makeInlineCode(pDefault)); } var cells = [ unist.makeTableCell([unist.makeText(pName)]), - unist.makeTableCell([unist.makeText(pType)]), - unist.makeTableCell([unist.makeText(pDefault)]), - unist.makeTableCell([unist.makeText(pDesc)]) + unist.makeTableCell([unist.makeInlineCode(pType)]), + //unist.makeTableCell([unist.makeText(pDefault)]), + unist.makeTableCell(descCellContent) ]; rows.push(unist.makeTableRow(cells)); @@ -214,7 +226,7 @@ function buildOutputsTable(outputs: any[]) { for (var i = 0; i < outputs.length; i++){ var eName = outputs[i].name; var eType = outputs[i].type; - var eDesc = outputs[i].description || ""; + var eDesc = outputs[i].docText || ""; if (eDesc) { eDesc = eDesc.trim().replace(/[\n\r]+/, ' '); @@ -222,7 +234,7 @@ function buildOutputsTable(outputs: any[]) { var cells = [ unist.makeTableCell([unist.makeText(eName)]), - unist.makeTableCell([unist.makeText(eType)]), + unist.makeTableCell([unist.makeInlineCode(eType)]), unist.makeTableCell([unist.makeText(eDesc)]) ]; diff --git a/lib/config/DocProcessor/unistHelpers.js b/lib/config/DocProcessor/unistHelpers.js index c812c51c9d..597ae764d4 100644 --- a/lib/config/DocProcessor/unistHelpers.js +++ b/lib/config/DocProcessor/unistHelpers.js @@ -21,6 +21,13 @@ module.exports = { }; }, + makeStrong: function (content) { + return { + "type": "strong", + "children": content + }; + }, + makeHeading: function (caption, depth) { return { "type": "heading", @@ -83,6 +90,20 @@ module.exports = { }; }, + makeInlineCode: function (codeText) { + return { + "type": "inlineCode", + "value": codeText + } + }, + + makeHTML: function (htmlText) { + return { + "type": "html", + "value": htmlText + }; + }, + isHeading: function (node) { return node.type === "heading"; }, diff --git a/lib/content-services/document-list/components/document-list.component.ts b/lib/content-services/document-list/components/document-list.component.ts index b047ca2a0e..72a7000374 100644 --- a/lib/content-services/document-list/components/document-list.component.ts +++ b/lib/content-services/document-list/components/document-list.component.ts @@ -70,140 +70,140 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte @ContentChild(DataColumnListComponent) columnList: DataColumnListComponent; - /* Define a set of CSS styles styles to apply depending on the permission - * of the user on that node. See the [Permission Style model](permissions-style.model.md) + /** Define a set of CSS styles styles to apply depending on the permission + * of the user on that node. See the Permission Style model * page for further details and examples. */ @Input() permissionsStyle: PermissionStyleModel[] = []; - /* The default route for all the location-based columns (if declared). */ + /** The default route for all the location-based columns (if declared). */ @Input() locationFormat: string = '/'; - /* Toggles navigation to folder content or file preview */ + /** Toggles navigation to folder content or file preview */ @Input() navigate: boolean = true; - /* User interaction for folder navigation or file preview. Valid values are "click" and "dblclick". */ + /** User interaction for folder navigation or file preview. Valid values are "click" and "dblclick". */ @Input() navigationMode: string = DocumentListComponent.DOUBLE_CLICK_NAVIGATION; // click|dblclick - /* Show document thumbnails rather than icons */ + /** Show document thumbnails rather than icons */ @Input() thumbnails: boolean = false; - /* Row selection mode. Can be null, `single` or `multiple`. For `multiple` mode, + /** Row selection mode. Can be null, `single` or `multiple`. For `multiple` mode, * you can use Cmd (macOS) or Ctrl (Win) modifier key to toggle selection for multiple rows. */ @Input() selectionMode: string = 'single'; // null|single|multiple - /* Toggles multiselect mode */ + /** Toggles multiselect mode */ @Input() multiselect: boolean = false; - /* Toggles content actions for each row */ + /** Toggles content actions for each row */ @Input() contentActions: boolean = false; - /* Position of the content actions dropdown menu. Can be set to "left" or "right". */ + /** Position of the content actions dropdown menu. Can be set to "left" or "right". */ @Input() contentActionsPosition: string = 'right'; // left|right - /* Toggles context menus for each row */ + /** Toggles context menus for each row */ @Input() contextMenuActions: boolean = false; - /* Custom image for empty folder */ + /** Custom image for empty folder */ @Input() emptyFolderImageUrl: string = './assets/images/empty_doc_lib.svg'; - /* Toggle file drop support for rows (see **UploadDirective** for further details */ + /** Toggle file drop support for rows (see Upload Directive for further details */ @Input() allowDropFiles: boolean = false; - /* Defines default sorting. The format is an array of 2 strings `[key, direction]` + /** Defines default sorting. The format is an array of 2 strings `[key, direction]` * i.e. `['name', 'desc']` or `['name', 'asc']`. Set this value only if you want to * override the default sorting detected by the component based on columns. */ @Input() sorting: string[]; - /* The inline style to apply to every row. See - * [NgStyle](https://angular.io/docs/ts/latest/api/common/index/NgStyle-directive.html) + /** The inline style to apply to every row. See + * the Angular NgStyle * docs for more details and usage examples. */ @Input() rowStyle: string; - /* The CSS class to apply to every row */ + /** The CSS class to apply to every row */ @Input() rowStyleClass: string; - /* Toggles the loading state and animated spinners for the component. Used in + /** Toggles the loading state and animated spinners for the component. Used in * combination with `navigate=false` to perform custom navigation and loading * state indication. */ @Input() loading: boolean = false; - /* Custom row filter */ + /** Custom row filter */ @Input() rowFilter: any | null = null; - /* Custom image resolver */ + /** Custom image resolver */ @Input() imageResolver: any | null = null; - /* The ID of the folder node to display or a reserved string alias for special sources */ + /** The ID of the folder node to display or a reserved string alias for special sources */ @Input() currentFolderId: string = null; - /* Currently displayed folder node */ + /** Currently displayed folder node */ @Input() folderNode: MinimalNodeEntryEntity = null; - /* Document list will show all the nodes contained in the NodePaging entity */ + /** The Document list will show all the nodes contained in the NodePaging entity */ @Input() node: NodePaging = null; - /* Default value is stored into user preference settings */ + /** Default value is stored into user preference settings */ @Input() maxItems: number; - /* element to skip over for pagination purpose */ + /** Number of elements to skip over for pagination purposes */ @Input() skipCount: number = 0; - /* Enable documentlist to work into infinite scrolling mode */ + /** Set document list to work in infinite scrolling mode */ @Input() enableInfiniteScrolling: boolean = false; - /* Emitted when the user clicks a list node */ + /** Emitted when the user clicks a list node */ @Output() nodeClick: EventEmitter = new EventEmitter(); - /* Emitted when the user double-clicks a list node */ + /** Emitted when the user double-clicks a list node */ @Output() nodeDblClick: EventEmitter = new EventEmitter(); - /* Emitted when the current display folder changes */ + /** Emitted when the current display folder changes */ @Output() folderChange: EventEmitter = new EventEmitter(); - /* Emitted when the user acts upon files with either single or double click + /** Emitted when the user acts upon files with either single or double click * (depends on `navigation-mode`). Useful for integration with the * Viewer component. */ @Output() preview: EventEmitter = new EventEmitter(); - /* Emitted when the Document List has loaded all items and is ready for use */ + /** Emitted when the Document List has loaded all items and is ready for use */ @Output() ready: EventEmitter = new EventEmitter(); - /* Emitted when the API fails to get the Document List data */ + /** Emitted when the API fails to get the Document List data */ @Output() error: EventEmitter = new EventEmitter();