From 3bee9a70f5cd394d4551d4632d9330760862b231 Mon Sep 17 00:00:00 2001
From: Andy Stark <30621568+therealandeeee@users.noreply.github.com>
Date: Tue, 16 Jan 2018 00:10:02 +0000
Subject: [PATCH] [ADF-1769] Updates to prop table script (#2829)
* [ADF-1769] Fixed prop table tool formatting
* [ADF-1769] Added code style to event type column
---
docs/document-list.component.md | 73 +++++++++----------
lib/config/DocProcessor/tools/tscProps.js | 34 +++++----
lib/config/DocProcessor/tools/tscProps.ts | 40 ++++++----
lib/config/DocProcessor/unistHelpers.js | 21 ++++++
.../components/document-list.component.ts | 64 ++++++++--------
5 files changed, 135 insertions(+), 97 deletions(-)
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();