Merge pull request #3206 from Alfresco/development

2.3.0

.travis.yml

@@ -6,6 +6,9 @@ node_js:
 
 addons:
     chrome: stable
+before_script:
+    - "sudo chown root /opt/google/chrome/chrome-sandbox"
+    - "sudo chmod 4755 /opt/google/chrome/chrome-sandbox"
 
 before_install:
     - export CHROME_BIN=chromium-browser
@@ -26,7 +29,7 @@ install:
         if ([ "$TRAVIS_BRANCH" = "master" ]); then
             (./scripts/npm-build-all.sh  || exit 1;);
         else
-            (./scripts/npm-build-all.sh  -vjsapi alpha || exit 1;);
+            (./scripts/npm-build-all.sh  -vjsapi alpha -sb || exit 1;);
         fi
       fi
 
@@ -48,7 +51,7 @@ script:
       fi
 
     - if ([ "$MODULE" == "packaging" ]); then
-            (cd lib && npm run new-build || exit 1;);
+            (cd lib && npm run build || exit 1;);
       fi
 
     - if ([ "$MODULE" == "demo-shell" ]); then
@@ -58,12 +61,30 @@ script:
             (./scripts/start.sh -dev -t -ss -vjsapi alpha || exit 1;);
        fi
       fi
+
 jobs:
     include:
+        - stage: Check build demo shell in production mode AND e2e
+          before_install:
+            - "export DISPLAY=:99.0"
+            - "sh -e /etc/init.d/xvfb start"
+          script: travis_wait 30 ./scripts/test-dist.sh
         - stage: Check 2.0.0 Project Update
           script: ./scripts/test-e2e-bc.sh
         - stage: Check ADF exports
           script: cd lib && npm run test-export
+        - stage: Update Generator
+          if: tag =~ .*beta.*
+          script: ./scripts/update-project.sh -gnu -t $GITHUB_TOKEN -n generator-ng2-alfresco-app
+        - stage: Update Content app
+          if: tag =~ .*beta.*
+          script: ./scripts/update-project.sh -gnu -t $GITHUB_TOKEN -n alfresco-content-app
+        - stage: Update DW
+          if: tag =~ .*beta.*
+          script: ./scripts/update-project.sh -gnu -t $GITHUB_TOKEN -n adf-app-manager-ui
+        - stage: Update ng2-components
+          if: tag =~ .*beta.*
+          script: ./scripts/update-project.sh -gnu -t $GITHUB_TOKEN -n alfresco-ng2-components
 
 # jobs:
 #   include:

.vscode/settings.json

@@ -9,7 +9,6 @@
         "**/.happypack": true
     },
     "editor.renderIndentGuides": true,
-    "tslint.configFile": "ng2-components/tslint.json",
     "markdownlint.config": {
         "MD032": false,
         "MD004": false,

CODE_OF_CONDUCT.md

@@ -0,0 +1,23 @@
+# Contributor Code of Conduct
+
+We want to make everyone feel welcome to contribute to ADF.
+We promise to respect everyone who posts issues, updates documentation,
+submits pull requests, provides feedback in comments, or makes any other contribution to the project.
+
+We expect all discussion about the project (on GitHub, social media and other channels) to be positive and constructive.
+We do not accept personal attacks, trolling, public or private harassment, insults,
+or other unprofessional conduct towards anyone.
+
+We promise to show respect to all contributors regardless of their gender, gender identity,
+sexual orientation, disability, age, race, ethnicity, religion, or level of experience.
+
+We expect all contributors to understand and follow these standards
+If any member of the community does not follow the code of conduct,
+the maintainers will do whatever they consider appropriate to stop the unacceptable behavior.
+This may include removing issues, comments, and PRs or blocking accounts.
+Any bans may be temporary or permanent, at the maintainers’ discretion.
+
+Contact us if you see any behavior that breaks the code of conduct, whether it is directed at you or at anyone else.
+We take responsibility for making sure the code of conduct is clear and understandable,
+so you should also contact us if you think there is anything that needs to be explained better.
+Our contact email address is: [conduct@alfresco.com](mailto:conduct@alfresco.com)

Dockerfile

@@ -1,4 +1,4 @@
-FROM nginx
+FROM nginx:alpine
 
 COPY demo-shell/nginx.conf /etc/nginx/nginx.conf
 

appveyor.yml

@@ -54,4 +54,4 @@ install:
 # Don't actually build.
 build: off
 matrix:
-  fast_finish: false
+  fast_finish: true

demo-shell/.angular-cli.json

@@ -149,14 +149,6 @@
     {
       "project": "src/tsconfig.app.json",
       "exclude": "**/node_modules/**/*"
-    },
-    {
-      "project": "src/tsconfig.spec.json",
-      "exclude": "**/node_modules/**/*"
-    },
-    {
-      "project": "e2e/tsconfig.e2e.json",
-      "exclude": "**/node_modules/**/*"
     }
   ],
   "test": {

demo-shell/README.md

@@ -22,44 +22,24 @@ To simplify development and reduce the time to get the application started, we h
 
 The settings above address most common scenarios for running ACS on port 8080 and APS on port 9999 and allow you to skip the CORS configuration.
 
-If you would like to change default proxy settings, please edit the `config/webpack.common.js` file.
+If you would like to change default proxy settings, please edit the `proxy.conf.js` file.
 
 ## Application settings (server-side)
 
-All server-side application settings are stored in the `app.config-dev.json` and `app.config-prod.json` files. 
+All server-side application settings are stored in the [src/app.config.json](src/app.config.json). 
 By default the configuration files have the content similar to the following one:
 
 ```json
 {
-    "ecmHost": "http://localhost:3000/ecm",
+    "$schema": "../../lib/core/app-config/schema.json",
-    "bpmHost": "http://localhost:3000/bpm",
+    "ecmHost": "http://{hostname}:{port}",
+    "bpmHost": "http://{hostname}:{port}",
     "application": {
-        "name": "Alfresco"
+        "name": "Alfresco ADF Application"
     }
 }
 ```
 
-You can add any additional settings to the application configuration file if needed.
-
-Configuration files are picked based on environment settings (see `app.module.ts` for more details).
-
-```ts
-let appConfigFile = 'app.config-dev.json';
-if (process.env.ENV === 'production') {
-    appConfigFile = 'app.config-prod.json';
-}
-
-@NgModule({
-    imports: [
-        ...
-        CoreModule.forRoot({
-            appConfigFile: appConfigFile
-        }),
-        ...
-    ]
-})
-```
-
 ## Development build
 
 ```sh
@@ -85,17 +65,10 @@ This command builds project in `production` mode.
 All output is placed to `dist` folder and can be served to your preferred web server.
 You should need no additional files outside the `dist` folder.
 
-### Important notes
-
-By default demo application is configured to use [wsrv](https://www.npmjs.com/package/wsrv) tool (lightweight web server)
-to serve production build output. It will be running at `0.0.0.0` address with port `3000` and allow you to access your application
-via network. However, you can use any web server of your choice in production.
-
 ## Development branch build
 
 If you want to run the demo shell with the latest changes from the development branch, use the following command from the /script folder:
 
 ```sh
-./npm-clean.sh
+npm run start:dev
-./start-linked.sh -install
 ```

demo-shell/e2e/app.e2e-spec.ts

@@ -1,14 +1,14 @@
 import { MyappPage } from './app.po';
 
 describe('myapp App', () => {
-  let page: MyappPage;
+    let page: MyappPage;
 
-  beforeEach(() => {
+    beforeEach(() => {
-    page = new MyappPage();
+        page = new MyappPage();
-  });
+    });
 
-  it('should display message saying app works', () => {
+    it('should display toolbar', () => {
-    page.navigateTo();
+        page.navigateTo();
-    expect(page.getParagraphText()).toEqual('app works!');
+        expect(page.getToolbar()).toBeDefined();
-  });
+    });
 });

demo-shell/e2e/app.po.ts

@@ -1,11 +1,11 @@
 import { browser, element, by } from 'protractor';
 
 export class MyappPage {
-  navigateTo() {
+    navigateTo() {
-    return browser.get('/');
+        return browser.get('/');
-  }
+    }
 
-  getParagraphText() {
+    getToolbar() {
-    return element(by.css('app-root h1')).getText();
+        return element(by.tagName('adf-toolbar'));
-  }
+    }
 }

demo-shell/package.json

@@ -1,27 +1,26 @@
 {
   "name": "Alfresco-ADF-Angular-Demo",
   "description": "Demo shell for Alfresco Angular components",
-  "version": "2.2.0",
+  "version": "2.3.0",
   "author": "Alfresco Software, Ltd.",
   "scripts": {
     "ng": "ng",
     "prestart": "npm run validate-config",
-    "start": "npm run server-versions && rimraf dist && ng serve --host 0.0.0.0 --app dist --open --aot=false",
+    "start": "npm run server-versions && rimraf dist && ng serve --host 0.0.0.0 --proxy-config proxy.conf.js --app dist --open",
-    "start:dev": " npm run lint && npm run server-versions && rimraf dist && npm run clean-lib-angular && concurrently \"ng serve --host 0.0.0.0 --disable-host-check --app dev pp-dev --proxy-config proxy.conf.js --open\" \"npm run style:dev --watch\" \"npm run copy:dev\" ",
+    "start:dev": " npm run lint && npm run server-versions && rimraf dist && npm run clean-lib-angular && concurrently \"ng serve --host 0.0.0.0 --disable-host-check --app dev --proxy-config proxy.conf.js --open\" \"npm run style:dev --watch\" \"npm run copy:dev\" ",
-    "start:dist": "npm run server-versions && rimraf dist && node --max_old_space_size=30000 node_modules/.bin/ng serve --prod --build-optimizer=false  --aot=false --host 0.0.0.0 --disable-host-check --app dist",
+    "start:dist": "npm run server-versions && rimraf dist && node --max_old_space_size=30000 node_modules/.bin/ng serve --prod --host 0.0.0.0 --disable-host-check --app dist --proxy-config proxy.conf.js -open",
-    "build": "npm run validate-config && npm run server-versions && rimraf dist && ng build  --app dist",
+    "build": "npm run validate-config && npm run server-versions && rimraf dist && ng build --app dist",
-    "build:dev": "npm run validate-config && npm run lint && npm run style:dev && npm run server-versions && rimraf dist && ng build  --app dev",
+    "build:dev": "npm run validate-config && npm run lint && npm run style:dev && npm run server-versions && rimraf dist && ng build --app dev",
-    "build:dist": "npm run validate-config && npm run style:dev && npm run server-versions && rimraf dist && node --max_old_space_size=30000 node_modules/.bin/ng build --prod  --build-optimizer=false  --aot=false --app dist",
+    "build:dist": "npm run validate-config && npm run server-versions && rimraf dist && ng build --prod --app dist",
     "style:dev": "npm run webpack -- --config  config/webpack.style.js --progress --profile --bail",
     "copy:dev": "node ./config/dev-copy-watch.js",
-    "test": "ng test",
+    "test": " ng test --single-run",
     "lint": "ng lint",
     "e2e": "ng e2e",
     "validate-config": "ajv validate -s ../lib/core/app-config/schema.json -d ./src/app.config.json --errors=text --verbose",
     "server-versions": "rimraf ./src/versions.json && npm list --depth=0 --json=true --prod=true > ./src/versions.json  || exit 0",
-    "clean": "npm run clean-build  && rimraf dist node_modules typings dist",
+    "clean": "rimraf dist node_modules typings",
     "clean-lib-angular": "rimraf ../lib/node_modules/@angular",
-    "clean-build": "rimraf 'app/{,**/}**.js' 'app/{,**/}**.js.map' 'app/{,**/}**.d.ts'",
     "clean-lock": "rimraf package-lock.json",
     "webpack": "node node_modules/webpack/bin/webpack.js"
   },
@@ -63,10 +62,10 @@
   ],
   "private": true,
   "dependencies": {
-    "@alfresco/adf-content-services": "2.2.0",
+    "@alfresco/adf-content-services": "2.3.0",
-    "@alfresco/adf-core": "2.2.0",
+    "@alfresco/adf-core": "2.3.0",
-    "@alfresco/adf-insights": "2.2.0",
+    "@alfresco/adf-insights": "2.3.0",
-    "@alfresco/adf-process-services": "2.2.0",
+    "@alfresco/adf-process-services": "2.3.0",
     "@angular/animations": "5.1.1",
     "@angular/cdk": "5.0.1",
     "@angular/common": "5.1.1",
@@ -79,10 +78,10 @@
     "@angular/platform-browser": "5.1.1",
     "@angular/platform-browser-dynamic": "5.1.1",
     "@angular/router": "5.1.1",
-    "@mat-datetimepicker/core": "^1.0.1",
+    "@mat-datetimepicker/core": "1.0.4",
-    "@mat-datetimepicker/moment": "^1.0.1",
+    "@mat-datetimepicker/moment": "1.0.4",
     "@ngx-translate/core": "9.1.1",
-    "alfresco-js-api": "2.2.0",
+    "alfresco-js-api": "2.3.0",
     "chart.js": "2.5.0",
     "classlist.js": "1.1.20150312",
     "core-js": "2.4.1",
@@ -101,7 +100,6 @@
     "zone.js": "0.8.14"
   },
   "devDependencies": {
-    "@angular-devkit/core": "0.0.28",
     "@angular/cli": "1.6.5",
     "@angular/compiler-cli": "^5.2.0",
     "@angular/language-service": "^5.2.0",

demo-shell/resources/i18n/de.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Details",
+      "COMMENTS": "Kommentare",
+      "PROPERTIES": "Eigenschaften",
+      "VERSIONS": "Versionen"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Löschen zulassen",
+      "SHOW_COMMENTS": "Anmerkungen zu Versionen einblenden",
+      "ALLOW_DOWNLOAD": "Versions-Download zulassen"
+    }
+  },
   "title": "Willkommen",
   "VERSION": {
     "NO_PERMISSION": "Sie verfügen nicht über die nötige Berechtigung, um Versionen dieses Inhalts zu verwalten",
@@ -9,6 +22,12 @@
       "TITLE": "Versionen verwalten"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Schließen",
+      "TITLE": "Metadaten"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "ADF-Demoanwendung",
     "HOME": "Startseite",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "DataTable (Lazy)",
     "FORM": "Formular",
     "FORM_LIST": "Formularliste",
+    "FORM_LOADING": "Formular laden",
     "UPLOADER": "Uploader",
     "WEBSCRIPT": "Webscript",
     "TAG": "Tag",
+    "TRASHCAN": "Papierkorb",
     "SOCIAL": "Soziale Funktionen",
     "SETTINGS": "Einstellungen",
     "OVERLAY_VIEWER": "Overlay-Viewer",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Erstellt von",
     "SEARCH_SERVICE_APPROACH": "Aktivieren Sie diese Option, um die Eingabeeigenschaft zu deaktivieren und die Nutzung des Services zu konfigurieren"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Endgültig löschen",
+      "RESTORE": "Wiederherstellen"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "Papierkorb ist leer",
+      "FIRST_TEXT": "Gelöschte Elemente werden in den Papierkorb verschoben.",
+      "SECOND_TEXT": "Leeren Sie den Papierkorb, um die Elemente endgültig zu löschen."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Mehrfachauswahl (mit Kontrollkästchen)",
     "MULTIPLE_FILE_UPLOAD": "Mehrere Dateien hochladen",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Hochladen aktivieren",
     "ENABLE_INFINITE_SCROLL": "Unendlich Scrollen aktivieren",
     "MULTISELECT_DESCRIPTION": "Mit der Befehls- (Mac) oder der Steuerungstaste (Windows) können Sie die Auswahl mehrerer Elemente umschalten",
-    "RECENT": "Zuletzt verwendete Dateien",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "Die Liste der zuletzt verwendeten Dateien ist leer"
+      },
+      "TITLE": "Zuletzt verwendete Dateien"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Namen anzeigen",
+      "IS_LOCKED": "Sperren",
       "TAG": "Tag",
       "CREATED_BY": "Erstellt von",
       "CREATED_ON": "Erstellt am",
-      "CREATED": "Erstellt"
+      "CREATED": "Erstellt",
+      "SIZE": "Größe",
+      "DELETED_ON": "Gelöscht",
+      "DELETED_BY": "Gelöscht von"
     },
     "TOOLBAR": {
       "CARDVIEW": "Kartenansichtsmodus",
@@ -59,7 +100,10 @@
       "DELETE": "Löschen"
     },
     "ACTIONS": {
+      "VERSIONS": "Versionen verwalten",
+      "METADATA": "Info",
       "DOWNLOAD": "Herunterladen",
+      "PERMISSION": "Berechtigung",
       "FOLDER": {
         "COPY": "Kopieren",
         "MOVE": "Verschieben",
@@ -98,6 +142,13 @@
     "STORE": "Speichern",
     "RESTORE": "Wiederherstellen"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Formulardaten",
+    "FORM_DATA_MESSAGE": "Geben Sie Werte ein, um das Formular auszufüllen",
+    "TYPEAHEAD_PLACEHOLDER": "Automatische Vervollständigung",
+    "RADIO_PLACEHOLDER": "Optionsschaltfläche",
+    "SELECT_PLACEHOLDER": "Dropdown"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Content Services-Tagliste",
     "INSERT": "Node-ID einfügen",
     "NODE_LIST": "Tagliste nach Node-ID"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Berechtigungen erben",
+    "INHERITED_PERMISSIONS_BUTTON": "Berechtigungen geerbt"
   }
 }

demo-shell/resources/i18n/en.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Details",
+      "COMMENTS": "Comments",
+      "PROPERTIES": "Properties",
+      "VERSIONS": "Versions"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Allow delete",
+      "SHOW_COMMENTS" : "Show comments on versions",
+      "ALLOW_DOWNLOAD" :"Enable version download"
+    }
+  },
     "title": "Welcome",
     "VERSION": {
       "NO_PERMISSION": "You don't have permission to manage versions of this content",
@@ -26,6 +39,7 @@
         "DATATABLE_LAZY": "Datatable (Lazy)",
         "FORM": "Form",
         "FORM_LIST": "Form List",
+        "FORM_LOADING": "Form Loading",
         "UPLOADER": "Uploader",
         "WEBSCRIPT": "Webscript",
         "TAG": "Tag",
@@ -42,7 +56,7 @@
     },
     "TRASHCAN" :{
       "ACTIONS":{
-        "DELETE_PERMANENT":"Delete permanent",
+        "DELETE_PERMANENT":"Delete permanently",
         "RESTORE":"Restore"
       },
       "EMPTY_STATE": {
@@ -63,12 +77,13 @@
         "MULTISELECT_DESCRIPTION" : "Use Cmd (Mac) or Ctrl (Windows) to toggle selection of multiple items",
         "RECENT" : {
           "EMPTY_STATE": {
-            "TITLE": "Recent is empty"
+            "TITLE": "Recent Files list is empty"
           },
           "TITLE":"Recent Files"
         },
         "COLUMNS": {
             "DISPLAY_NAME": "Display name",
+            "IS_LOCKED": "Lock",
             "TAG": "Tag",
             "CREATED_BY": "Created by",
             "CREATED_ON": "Created on",
@@ -88,6 +103,7 @@
             "VERSIONS": "Manage versions",
             "METADATA": "Info",
             "DOWNLOAD": "Download",
+            "PERMISSION": "Permission",
             "FOLDER": {
                 "COPY": "Copy",
                 "MOVE": "Move",
@@ -126,6 +142,13 @@
         "STORE": "Store",
         "RESTORE": "Restore"
     },
+    "FORM-LOADING": {
+      "FORM_DATA" : "Form Data",
+      "FORM_DATA_MESSAGE": "Enter values to populate the form",
+      "TYPEAHEAD_PLACEHOLDER": "Typeahead",
+      "RADIO_PLACEHOLDER": "Radio Button",
+      "SELECT_PLACEHOLDER": "DropDown"
+    },
     "LOGIN": {
         "CONTENT_SERVICES": "Content Services",
         "PROCESS_SERVICES": "Process Services",
@@ -143,5 +166,9 @@
         "LIST":"List Tags Content Services",
         "INSERT":"Insert Node ID",
         "NODE_LIST":"Tag list By Node ID"
+    },
+    "DEMO_PERMISSION": {
+       "INHERIT_PERMISSION_BUTTON" :"Inherit Permission" ,
+       "INHERITED_PERMISSIONS_BUTTON" : "Permission Inherited"
     }
 }

demo-shell/resources/i18n/es.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Detalles",
+      "COMMENTS": "Comentarios",
+      "PROPERTIES": "Propiedades",
+      "VERSIONS": "Versiones"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Permitir eliminar",
+      "SHOW_COMMENTS": "Mostrar comentarios en las versiones",
+      "ALLOW_DOWNLOAD": "Permitir descarga de la versión"
+    }
+  },
   "title": "Bienvenido",
   "VERSION": {
     "NO_PERMISSION": "No tiene permiso para administrar versiones de este contenido",
@@ -9,6 +22,12 @@
       "TITLE": "Gestionar versiones"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Cerrar",
+      "TITLE": "Metadatos"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "Aplicación ADF Demo",
     "HOME": "Inicio",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Tabla de datos (diferida)",
     "FORM": "Formulario",
     "FORM_LIST": "Lista de formularios",
+    "FORM_LOADING": "Carga de formulario",
     "UPLOADER": "Cargador",
     "WEBSCRIPT": "Webscript",
     "TAG": "Etiqueta",
+    "TRASHCAN": "Papelera",
     "SOCIAL": "Social",
     "SETTINGS": "Configuración",
     "OVERLAY_VIEWER": "Visor de superposición",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Creado por",
     "SEARCH_SERVICE_APPROACH": "Marque esto para desactivar la propiedad de entrada y configurar el uso del servicio"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Eliminar permanentemente",
+      "RESTORE": "Restaurar"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "La papelera está vacía",
+      "FIRST_TEXT": "Los elementos que elimine se trasladan a la papelera.",
+      "SECOND_TEXT": "Vacíe la papelera para eliminar los elementos permanentemente."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Selección múltiple (con casillas)",
     "MULTIPLE_FILE_UPLOAD": "Carga de varios ficheros",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Habilitar carga",
     "ENABLE_INFINITE_SCROLL": "Habilitar desplazamiento infinito",
     "MULTISELECT_DESCRIPTION": "Utilice Cmd (Mac) o Ctrl (Windows) para cambiar la selección de varios elementos",
-    "RECENT": "Ficheros recientes",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "La lista de ficheros recientes está vacía"
+      },
+      "TITLE": "Ficheros recientes"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Nombre a mostrar",
+      "IS_LOCKED": "Bloquear",
       "TAG": "Etiqueta",
       "CREATED_BY": "Creado por",
       "CREATED_ON": "Creado",
-      "CREATED": "Creado"
+      "CREATED": "Creado",
+      "SIZE": "Tamaño",
+      "DELETED_ON": "Eliminado",
+      "DELETED_BY": "Eliminado por"
     },
     "TOOLBAR": {
       "CARDVIEW": "Modo de vista de tarjeta",
@@ -59,14 +100,16 @@
       "DELETE": "Eliminar"
     },
     "ACTIONS": {
+      "VERSIONS": "Gestionar versiones",
+      "METADATA": "Información",
       "DOWNLOAD": "Descargar",
+      "PERMISSION": "Permiso",
       "FOLDER": {
         "COPY": "Copiar",
         "MOVE": "Mover",
         "DELETE": "Eliminar"
       },
       "DOCUMENT": {
-        "DOWNLOAD": "Descargar",
         "COPY": "Copiar",
         "MOVE": "Mover",
         "DELETE": "Eliminar",
@@ -99,6 +142,13 @@
     "STORE": "Almacenar",
     "RESTORE": "Restaurar"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Datos del formulario",
+    "FORM_DATA_MESSAGE": "Introduzca valores para rellenar el formulario",
+    "TYPEAHEAD_PLACEHOLDER": "Predictivo",
+    "RADIO_PLACEHOLDER": "Botón de opción",
+    "SELECT_PLACEHOLDER": "Desplegable"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -116,5 +166,9 @@
     "LIST": "Lista de etiquetas de Content Services",
     "INSERT": "Insertar ID del nodo",
     "NODE_LIST": "Lista de etiquetas por ID de nodo"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Heredar permiso",
+    "INHERITED_PERMISSIONS_BUTTON": "Permiso heredado"
   }
 }

demo-shell/resources/i18n/fr.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Détails",
+      "COMMENTS": "Commentaires",
+      "PROPERTIES": "Propriétés",
+      "VERSIONS": "Versions"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Autoriser la suppression",
+      "SHOW_COMMENTS": "Afficher les commentaires sur les versions",
+      "ALLOW_DOWNLOAD": "Autoriser le téléchargement de la version"
+    }
+  },
   "title": "Bienvenue",
   "VERSION": {
     "NO_PERMISSION": "Vous n'avez pas les droits d'accès pour gérer les versions de ce contenu",
@@ -9,6 +22,12 @@
       "TITLE": "Gérer les versions"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Fermer",
+      "TITLE": "Métadonnées"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "Application Démo ADF",
     "HOME": "Accueil",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Table de données (différé)",
     "FORM": "Formulaire",
     "FORM_LIST": "Liste de formulaires",
+    "FORM_LOADING": "Chargement du formulaire",
     "UPLOADER": "Chargeur",
     "WEBSCRIPT": "Script Web",
     "TAG": "Tag",
+    "TRASHCAN": "Corbeille",
     "SOCIAL": "Réseaux sociaux",
     "SETTINGS": "Paramètres",
     "OVERLAY_VIEWER": "Visualisation de la superposition",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Créé par",
     "SEARCH_SERVICE_APPROACH": "Cochez cette option pour désactiver la propriété d'entrée et configurer à partir du service"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Supprimer définitivement",
+      "RESTORE": "Restaurer"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "La corbeille est vide",
+      "FIRST_TEXT": "Les éléments supprimés sont placés dans la corbeille.",
+      "SECOND_TEXT": "Videz la corbeille pour supprimer définitivement les éléments."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Sélection multiple (avec cases à cocher)",
     "MULTIPLE_FILE_UPLOAD": "Importation de fichiers multiples",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Activer l'importation",
     "ENABLE_INFINITE_SCROLL": "Activer le défilement illimité",
     "MULTISELECT_DESCRIPTION": "Utiliser Cmd (Mac) ou Ctrl (Windows) pour activer/désactiver la sélection d'éléments multiples",
-    "RECENT": "Fichiers récents",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "La liste des fichiers récents est vide"
+      },
+      "TITLE": "Fichiers récents"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Nom affiché",
+      "IS_LOCKED": "Verrouiller",
       "TAG": "Tag",
       "CREATED_BY": "Créé par",
       "CREATED_ON": "Créé le",
-      "CREATED": "Créé"
+      "CREATED": "Créé",
+      "SIZE": "Taille",
+      "DELETED_ON": "Supprimé",
+      "DELETED_BY": "Supprimé par"
     },
     "TOOLBAR": {
       "CARDVIEW": "Mode d'affichage Carte",
@@ -59,7 +100,10 @@
       "DELETE": "Supprimer"
     },
     "ACTIONS": {
+      "VERSIONS": "Gérer les versions",
+      "METADATA": "Informations",
       "DOWNLOAD": "Télécharger",
+      "PERMISSION": "Droit d'accès",
       "FOLDER": {
         "COPY": "Copier",
         "MOVE": "Déplacer",
@@ -98,6 +142,13 @@
     "STORE": "Stocker",
     "RESTORE": "Restaurer"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Données du formulaire",
+    "FORM_DATA_MESSAGE": "Entrez les valeurs pour remplir le formulaire",
+    "TYPEAHEAD_PLACEHOLDER": "Saisie semi-automatique",
+    "RADIO_PLACEHOLDER": "Case d'option",
+    "SELECT_PLACEHOLDER": "Liste déroulante"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Liste de tags Content Services",
     "INSERT": "Insérer l'ID du nœud",
     "NODE_LIST": "Liste de tags par ID de nœud"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Hériter les droits d'accès",
+    "INHERITED_PERMISSIONS_BUTTON": "Droits d'accès hérités"
   }
 }

demo-shell/resources/i18n/it.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Dettagli",
+      "COMMENTS": "Commenti",
+      "PROPERTIES": "Proprietà",
+      "VERSIONS": "Versione"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Consenti eliminazione",
+      "SHOW_COMMENTS": "Mostra commenti sulle versioni",
+      "ALLOW_DOWNLOAD": "Abilita download versioni"
+    }
+  },
   "title": "Benvenuto",
   "VERSION": {
     "NO_PERMISSION": "Non hai il permesso di gestire versioni di questo contenuto",
@@ -9,6 +22,12 @@
       "TITLE": "Gestione versioni"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Chiudi",
+      "TITLE": "Metadati"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "Applicazione demo ADF",
     "HOME": "Home",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Caricamento dati (ottimizzato)",
     "FORM": "Modulo",
     "FORM_LIST": "Elenco moduli",
+    "FORM_LOADING": "Caricamento modulo",
     "UPLOADER": "Uploader",
     "WEBSCRIPT": "Webscript",
     "TAG": "Tag",
+    "TRASHCAN": "Cestino",
     "SOCIAL": "Social",
     "SETTINGS": "Impostazioni",
     "OVERLAY_VIEWER": "Visualizzatore overlay",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Creato da",
     "SEARCH_SERVICE_APPROACH": "Selezionare per disattivare la proprietà di input ed eseguire la configurazione utilizzando il servizio"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Elimina definitivamente",
+      "RESTORE": "Ripristina"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "Il cestino è vuoto",
+      "FIRST_TEXT": "Gli elementi eliminati vengono spostati nel cestino.",
+      "SECOND_TEXT": "Svuotare il cestino per eliminare definitivamente gli elementi."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Selezione multipla (con caselle di spunta)",
     "MULTIPLE_FILE_UPLOAD": "Caricamento di file multipli",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Abilita caricamento",
     "ENABLE_INFINITE_SCROLL": "Abilita scorrimento infinito",
     "MULTISELECT_DESCRIPTION": "Usa Cmd (Mac) o Ctrl (Windows) per attivare/disattivare la selezione di più elementi",
-    "RECENT": "File recenti",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "L'elenco File recenti è vuoto"
+      },
+      "TITLE": "File recenti"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Nome visualizzato",
+      "IS_LOCKED": "Blocca",
       "TAG": "Tag",
       "CREATED_BY": "Creato da",
       "CREATED_ON": "Creato il",
-      "CREATED": "Creato"
+      "CREATED": "Creato",
+      "SIZE": "Dimensione",
+      "DELETED_ON": "Eliminato",
+      "DELETED_BY": "Eliminato da"
     },
     "TOOLBAR": {
       "CARDVIEW": "Modalità di visualizzazione scheda",
@@ -59,7 +100,10 @@
       "DELETE": "Elimina"
     },
     "ACTIONS": {
+      "VERSIONS": "Gestione versioni",
+      "METADATA": "Informazioni",
       "DOWNLOAD": "Download",
+      "PERMISSION": "Permesso",
       "FOLDER": {
         "COPY": "Copia",
         "MOVE": "Sposta",
@@ -98,6 +142,13 @@
     "STORE": "Memorizza",
     "RESTORE": "Ripristina"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Dati modulo",
+    "FORM_DATA_MESSAGE": "Inserire i dati per compilare il modulo",
+    "TYPEAHEAD_PLACEHOLDER": "Typeahead",
+    "RADIO_PLACEHOLDER": "Pulsante di opzione",
+    "SELECT_PLACEHOLDER": "Elenco a discesa"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Elenco tag Content Services",
     "INSERT": "Inserisci ID nodo",
     "NODE_LIST": "Elenco tag per ID nodo"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Eredita permessi",
+    "INHERITED_PERMISSIONS_BUTTON": "Permesso ereditato"
   }
 }

demo-shell/resources/i18n/ja.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "詳細",
+      "COMMENTS": "コメント",
+      "PROPERTIES": "プロパティ",
+      "VERSIONS": "バージョン"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "削除を許可する",
+      "SHOW_COMMENTS": "バージョンに関するコメントを表示",
+      "ALLOW_DOWNLOAD": "バージョンのダウンロードを許可する"
+    }
+  },
   "title": "ようこそ",
   "VERSION": {
     "NO_PERMISSION": "このコンテンツのバージョンを管理する権限がありません",
@@ -9,6 +22,12 @@
       "TITLE": "バージョンの管理"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "閉じる",
+      "TITLE": "メタデータ"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "ADF デモアプリケーション",
     "HOME": "ホーム",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Datatable (遅延読み込み)",
     "FORM": "フォーム",
     "FORM_LIST": "フォームリスト",
+    "FORM_LOADING": "フォームを読み込んでいます",
     "UPLOADER": "アップローダー",
     "WEBSCRIPT": "Webscript",
     "TAG": "タグ",
+    "TRASHCAN": "ごみ箱",
     "SOCIAL": "ソーシャル",
     "SETTINGS": "設定",
     "OVERLAY_VIEWER": "オーバーレイビューア",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "作成者",
     "SEARCH_SERVICE_APPROACH": "入力プロパティを無効にし、サービスを使って設定する場合は、このチェックボックスをオンにします"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "完全に削除する",
+      "RESTORE": "復元"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "ごみ箱は空です",
+      "FIRST_TEXT": "削除するアイテムはごみ箱に移動されます。",
+      "SECOND_TEXT": "ごみ箱を空にするとアイテムが完全に削除されます。"
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "複数選択 (チェックボックスを使用)",
     "MULTIPLE_FILE_UPLOAD": "複数ファイルのアップロード",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "アップロードを有効にします",
     "ENABLE_INFINITE_SCROLL": "無限スクロールを有効にする",
     "MULTISELECT_DESCRIPTION": "複数選択の切り替えを行うには、Cmd (Mac) キーまたは Ctrl (Windows) キーを押します",
-    "RECENT": "最近使ったファイル",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "[最近使ったファイル] 一覧は空です"
+      },
+      "TITLE": "最近使ったファイル"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "表示名",
+      "IS_LOCKED": "ロック",
       "TAG": "タグ",
       "CREATED_BY": "作成者",
       "CREATED_ON": "作成日",
-      "CREATED": "作成日"
+      "CREATED": "作成日",
+      "SIZE": "サイズ",
+      "DELETED_ON": "削除済み",
+      "DELETED_BY": "削除者"
     },
     "TOOLBAR": {
       "CARDVIEW": "カード表示モード",
@@ -59,7 +100,10 @@
       "DELETE": "削除"
     },
     "ACTIONS": {
+      "VERSIONS": "バージョンの管理",
+      "METADATA": "情報",
       "DOWNLOAD": "ダウンロード",
+      "PERMISSION": "権限",
       "FOLDER": {
         "COPY": "コピー",
         "MOVE": "移動",
@@ -98,6 +142,13 @@
     "STORE": "保存",
     "RESTORE": "復元"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "フォーム データ",
+    "FORM_DATA_MESSAGE": "フォームに入力する値を入力してください",
+    "TYPEAHEAD_PLACEHOLDER": "先行入力",
+    "RADIO_PLACEHOLDER": "ラジオ ボタン",
+    "SELECT_PLACEHOLDER": "ドロップダウン"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Content Services のタグリスト",
     "INSERT": "ノード ID の挿入",
     "NODE_LIST": "ノード ID 別タグリスト"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "権限の継承",
+    "INHERITED_PERMISSIONS_BUTTON": "継承された権限"
   }
 }

demo-shell/resources/i18n/nb.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Detaljer",
+      "COMMENTS": "Kommentarer",
+      "PROPERTIES": "Egenskaper",
+      "VERSIONS": "Versjoner"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Tillat sletting",
+      "SHOW_COMMENTS": "Vis kommentarer om versjoner",
+      "ALLOW_DOWNLOAD": "Tillat versjonsnedlasting"
+    }
+  },
   "title": "Velkommen",
   "VERSION": {
     "NO_PERMISSION": "Du har ikke tillatelse til å håndtere versjoner av dette innholdet",
@@ -9,6 +22,12 @@
       "TITLE": "Håndtere versjoner"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Lukk",
+      "TITLE": "Metadata"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "ADF-demoprogam",
     "HOME": "Hjem",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Datatabell (avventende)",
     "FORM": "Skjema",
     "FORM_LIST": "Skjemaliste",
+    "FORM_LOADING": "Skjema lastes inn",
     "UPLOADER": "Opplaster",
     "WEBSCRIPT": "Webscript",
     "TAG": "Tagg",
+    "TRASHCAN": "Søppelkurv",
     "SOCIAL": "Sosial",
     "SETTINGS": "Innstillinger",
     "OVERLAY_VIEWER": "Overleggsfremviser",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Opprettet av",
     "SEARCH_SERVICE_APPROACH": "Velg dette for å deaktivere inndataegenskapen og konfigurere ved hjelp av tjenesten"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Slett for godt",
+      "RESTORE": "Gjenopprett"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "Søppelkurven er tom",
+      "FIRST_TEXT": "Elementer du sletter, flyttes til søppelkurven.",
+      "SECOND_TEXT": "Tøm søppelkurven for å slette elementer for godt."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Multivalg (med avskrysningsbokser)",
     "MULTIPLE_FILE_UPLOAD": "Opplasting av flere filer",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Aktiver opplasting",
     "ENABLE_INFINITE_SCROLL": "Aktiver uendelig rulling",
     "MULTISELECT_DESCRIPTION": "Bruk Cmd (Mac) eller Ctrl (Windows) for å veksle mellom valg av flere elementer",
-    "RECENT": "Nylig brukte filer",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "Nylige filer-listen er tom"
+      },
+      "TITLE": "Nylige filer"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Vis navn",
+      "IS_LOCKED": "Lås",
       "TAG": "Tagg",
       "CREATED_BY": "Opprettet av",
       "CREATED_ON": "Opprettet",
-      "CREATED": "Opprettet"
+      "CREATED": "Opprettet",
+      "SIZE": "Størrelse",
+      "DELETED_ON": "Slettet",
+      "DELETED_BY": "Slettet av"
     },
     "TOOLBAR": {
       "CARDVIEW": "Kortvisningsmodus",
@@ -59,7 +100,10 @@
       "DELETE": "Slett"
     },
     "ACTIONS": {
+      "VERSIONS": "Administrer versjoner",
+      "METADATA": "Info",
       "DOWNLOAD": "Last ned",
+      "PERMISSION": "Tillatelse",
       "FOLDER": {
         "COPY": "Kopier",
         "MOVE": "Flytt",
@@ -98,6 +142,13 @@
     "STORE": "Lagre",
     "RESTORE": "Gjenopprett"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Skjemadata",
+    "FORM_DATA_MESSAGE": "Skriv inn verdier for å fylle ut skjemaet",
+    "TYPEAHEAD_PLACEHOLDER": "Type-ahead",
+    "RADIO_PLACEHOLDER": "Alternativknapp",
+    "SELECT_PLACEHOLDER": "Nedtrekk"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Liste med tagger Innholdstjenester",
     "INSERT": "Sett inn node-ID",
     "NODE_LIST": "Tagg listen etter node-ID"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Arv tillatelse",
+    "INHERITED_PERMISSIONS_BUTTON": "Tillatelse arvet"
   }
 }

demo-shell/resources/i18n/nl.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Details",
+      "COMMENTS": "Opmerkingen",
+      "PROPERTIES": "Eigenschappen",
+      "VERSIONS": "Versies"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Verwijderen toestaan",
+      "SHOW_COMMENTS": "Opmerkingen over versies tonen",
+      "ALLOW_DOWNLOAD": "Downloaden van versies toestaan"
+    }
+  },
   "title": "Welkom",
   "VERSION": {
     "NO_PERMISSION": "U hebt geen rechten voor het beheren van versies van deze content",
@@ -9,6 +22,12 @@
       "TITLE": "Versies beheren"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Sluiten",
+      "TITLE": "Metagegevens"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "ADF-demotoepassing",
     "HOME": "Home",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Datatable (vertraagd)",
     "FORM": "Formulier",
     "FORM_LIST": "Formulierlijst",
+    "FORM_LOADING": "Formulier laden",
     "UPLOADER": "Uploader",
     "WEBSCRIPT": "Webscript",
     "TAG": "Tag",
+    "TRASHCAN": "Prullenbak",
     "SOCIAL": "Sociaal",
     "SETTINGS": "Instellingen",
     "OVERLAY_VIEWER": "Overlay-viewer",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Gemaakt door",
     "SEARCH_SERVICE_APPROACH": "Schakel dit in om de invoereigenschap uit te schakelen en om te configureren via de service"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Definitief verwijderen",
+      "RESTORE": "Herstellen"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "Prullenbak is leeg",
+      "FIRST_TEXT": "Items die u verwijdert, worden verplaatst naar de prullenbak.",
+      "SECOND_TEXT": "Leeg de prullenmand om items definitief te verwijderen."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Multiselect (met selectievakjes)",
     "MULTIPLE_FILE_UPLOAD": "Meerdere bestanden uploaden",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Uploaden inschakelen",
     "ENABLE_INFINITE_SCROLL": "Oneindig scrollen inschakelen",
     "MULTISELECT_DESCRIPTION": "Cmd (Mac) of Ctrl (Windows) gebruiken om de selectie van meerdere items in of uit te schakelen",
-    "RECENT": "Recente bestanden",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "Lijst met recente bestanden is leeg"
+      },
+      "TITLE": "Recente bestanden"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Getoonde naam",
+      "IS_LOCKED": "Vergrendeling",
       "TAG": "Tag",
       "CREATED_BY": "Gemaakt door",
       "CREATED_ON": "Gemaakt op",
-      "CREATED": "Gemaakt"
+      "CREATED": "Gemaakt",
+      "SIZE": "Grootte",
+      "DELETED_ON": "Verwijderd",
+      "DELETED_BY": "Verwijderd door"
     },
     "TOOLBAR": {
       "CARDVIEW": "Kaartweergavemodus",
@@ -59,7 +100,10 @@
       "DELETE": "Verwijderen"
     },
     "ACTIONS": {
+      "VERSIONS": "Versies beheren",
+      "METADATA": "Info",
       "DOWNLOAD": "Downloaden",
+      "PERMISSION": "Machtiging",
       "FOLDER": {
         "COPY": "Kopiëren",
         "MOVE": "Verplaatsen",
@@ -98,6 +142,13 @@
     "STORE": "Opslaan",
     "RESTORE": "Herstellen"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Formuliergegevens",
+    "FORM_DATA_MESSAGE": "Voer waarden in om het formulier in te vullen",
+    "TYPEAHEAD_PLACEHOLDER": "Automatische voltooiing",
+    "RADIO_PLACEHOLDER": "Keuzerondje",
+    "SELECT_PLACEHOLDER": "Dropdown"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Taglijst Content Services",
     "INSERT": "Node-id invoegen",
     "NODE_LIST": "Taglijst per node-id"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Machtiging overnemen",
+    "INHERITED_PERMISSIONS_BUTTON": "Machtiging overgenomen"
   }
 }

demo-shell/resources/i18n/pt-BR.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Detalhes",
+      "COMMENTS": "Comentários",
+      "PROPERTIES": "Propriedades",
+      "VERSIONS": "Versões"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Permitir apagar",
+      "SHOW_COMMENTS": "Mostrar comentários em versões",
+      "ALLOW_DOWNLOAD": "Permitir download da versão"
+    }
+  },
   "title": "Bem-vindo",
   "VERSION": {
     "NO_PERMISSION": "Você não tem permissão para gerenciar versões deste conteúdo",
@@ -9,6 +22,12 @@
       "TITLE": "Gerenciar versões"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Fechar",
+      "TITLE": "Metadados"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "Aplicativo Demo ADF",
     "HOME": "Página Inicial",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Datatable (Sob demanda)",
     "FORM": "Formulário",
     "FORM_LIST": "Lista de Formulário",
+    "FORM_LOADING": "Carregamento de formulário",
     "UPLOADER": "Carregador",
     "WEBSCRIPT": "Webscript",
     "TAG": "Marca",
+    "TRASHCAN": "Lixeira",
     "SOCIAL": "Social",
     "SETTINGS": "Configurações",
     "OVERLAY_VIEWER": "Visualizador de sobreposição",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Criado por",
     "SEARCH_SERVICE_APPROACH": "Marque essa opção para desativar a inserção e configurar a utilização do serviço"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Apagar permanentemente",
+      "RESTORE": "Restaurar"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "A lixeira está vazia",
+      "FIRST_TEXT": "Itens apagados são movidos para a Lixeira.",
+      "SECOND_TEXT": "Esvazie a Lixeira para apagar os itens permanentemente."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Seleção Múltipla (com caixas de seleção)",
     "MULTIPLE_FILE_UPLOAD": "Carregamento de Vários Arquivos",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Ativar carregamento",
     "ENABLE_INFINITE_SCROLL": "Ativar rolagem infinita",
     "MULTISELECT_DESCRIPTION": "Use Cmd (Mac) ou Ctrl (Windows) para alternar a seleção de vários itens",
-    "RECENT": "Arquivos recentes",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "A lista de Arquivos recentes está vazia"
+      },
+      "TITLE": "Arquivos recentes"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Nome de exibição",
+      "IS_LOCKED": "Bloqueio",
       "TAG": "Marca",
       "CREATED_BY": "Criado por",
       "CREATED_ON": "Criado em",
-      "CREATED": "Criado"
+      "CREATED": "Criado",
+      "SIZE": "Tamanho",
+      "DELETED_ON": "Excluído",
+      "DELETED_BY": "Excluído por"
     },
     "TOOLBAR": {
       "CARDVIEW": "Modo de visualização de cartão",
@@ -59,7 +100,10 @@
       "DELETE": "Excluir"
     },
     "ACTIONS": {
+      "VERSIONS": "Gerenciar versões",
+      "METADATA": "Informações",
       "DOWNLOAD": "Download",
+      "PERMISSION": "Permissão",
       "FOLDER": {
         "COPY": "Copiar",
         "MOVE": "Mover",
@@ -98,6 +142,13 @@
     "STORE": "Armazenar",
     "RESTORE": "Restaurar"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Dados do formulário",
+    "FORM_DATA_MESSAGE": "Insira os valores para preencher o formulário",
+    "TYPEAHEAD_PLACEHOLDER": "Campo de sugestão",
+    "RADIO_PLACEHOLDER": "Botão de opção",
+    "SELECT_PLACEHOLDER": "Lista suspensa"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Lista de Marcas do Content Services",
     "INSERT": "Inserir ID de Nó",
     "NODE_LIST": "Lista de marcas por ID de Nó"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Herdar permissão",
+    "INHERITED_PERMISSIONS_BUTTON": "Permissão herdada"
   }
 }

demo-shell/resources/i18n/ru.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "Сведения",
+      "COMMENTS": "Комментарии",
+      "PROPERTIES": "Свойства",
+      "VERSIONS": "Версии"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "Разрешить удаление",
+      "SHOW_COMMENTS": "Показать комментарии к версиям",
+      "ALLOW_DOWNLOAD": "Разрешить загрузку версии"
+    }
+  },
   "title": "Добро пожаловать",
   "VERSION": {
     "NO_PERMISSION": "У вас нет разрешения на управление версиями этого контента",
@@ -9,6 +22,12 @@
       "TITLE": "Управление версиями"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "Закрыть",
+      "TITLE": "Метаданные"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "Демонстрационное приложение ADF",
     "HOME": "Домашняя",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Таблица данных (частичная загрузка)",
     "FORM": "Форма",
     "FORM_LIST": "Список форм",
+    "FORM_LOADING": "Загрузка формы",
     "UPLOADER": "Загрузчик",
     "WEBSCRIPT": "Webscript",
     "TAG": "Метка",
+    "TRASHCAN": "Корзина",
     "SOCIAL": "Социальный",
     "SETTINGS": "Параметры",
     "OVERLAY_VIEWER": "Просмотр наложения",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "Создано пользователем",
     "SEARCH_SERVICE_APPROACH": "Установите флажок, чтобы отключить свойство ввода и настроить, используя службу."
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "Удалить навсегда",
+      "RESTORE": "Восстановить"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "Корзина пуста",
+      "FIRST_TEXT": "Элементы, которые вы удаляете, перемещаются в корзину.",
+      "SECOND_TEXT": "Очистите корзину, чтобы удалить элементы навсегда."
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "Выбор нескольких вариантов (с флажками)",
     "MULTIPLE_FILE_UPLOAD": "Загрузка нескольких файлов",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "Включить загрузку",
     "ENABLE_INFINITE_SCROLL": "Включить бесконечную прокрутку",
     "MULTISELECT_DESCRIPTION": "Использовать кнопку Cmd (Mac) или Ctrl (Windows) для переключения выбора нескольких элементов",
-    "RECENT": "Недавние файлы",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "Список последних файлов пуст"
+      },
+      "TITLE": "Последние файлы"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "Отображаемое имя",
+      "IS_LOCKED": "Блокировка",
       "TAG": "Метка",
       "CREATED_BY": "Создано пользователем",
       "CREATED_ON": "Дата создания",
-      "CREATED": "Создано"
+      "CREATED": "Создано",
+      "SIZE": "Размер",
+      "DELETED_ON": "Удаленные",
+      "DELETED_BY": "Удалено пользователем"
     },
     "TOOLBAR": {
       "CARDVIEW": "Режим просмотра карты",
@@ -59,7 +100,10 @@
       "DELETE": "Удалить"
     },
     "ACTIONS": {
+      "VERSIONS": "Управление версиями",
+      "METADATA": "Информация",
       "DOWNLOAD": "Скачать",
+      "PERMISSION": "Право",
       "FOLDER": {
         "COPY": "Копировать",
         "MOVE": "Переместить",
@@ -98,6 +142,13 @@
     "STORE": "Хранилище",
     "RESTORE": "Восстановить"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "Данные формы",
+    "FORM_DATA_MESSAGE": "Введите значения для заполнения формы",
+    "TYPEAHEAD_PLACEHOLDER": "Буфер клавиатуры",
+    "RADIO_PLACEHOLDER": "Селективная кнопка",
+    "SELECT_PLACEHOLDER": "Раскрывающееся меню"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "Список меток Content Services",
     "INSERT": "Вставить идентификатор узла",
     "NODE_LIST": "Список меток по идентификатору узла"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "Наследовать разрешение",
+    "INHERITED_PERMISSIONS_BUTTON": "Разрешение унаследовано"
   }
 }

demo-shell/resources/i18n/zh-CN.json

@@ -1,4 +1,17 @@
 {
+  "APP": {
+    "INFO_DRAWER": {
+      "TITLE": "详细信息",
+      "COMMENTS": "注释",
+      "PROPERTIES": "属性",
+      "VERSIONS": "版本"
+    },
+    "ADF_VERSION_MANAGER": {
+      "ALLOW_DELETE": "允许删除",
+      "SHOW_COMMENTS": "显示有关版本的注释",
+      "ALLOW_DOWNLOAD": "允许版本下载"
+    }
+  },
   "title": "欢迎使用",
   "VERSION": {
     "NO_PERMISSION": "您没有管理此内容版本的权限",
@@ -9,6 +22,12 @@
       "TITLE": "管理版本"
     }
   },
+  "METADATA": {
+    "DIALOG": {
+      "CLOSE": "关闭",
+      "TITLE": "元数据"
+    }
+  },
   "APP_LAYOUT": {
     "APP_NAME": "ADF 演示应用程序",
     "HOME": "主页",
@@ -20,9 +39,11 @@
     "DATATABLE_LAZY": "Datatable（迟缓）",
     "FORM": "表单",
     "FORM_LIST": "表单列表",
+    "FORM_LOADING": "表单加载",
     "UPLOADER": "上传程序",
     "WEBSCRIPT": "Webscript",
     "TAG": "标签",
+    "TRASHCAN": "垃圾桶",
     "SOCIAL": "社交",
     "SETTINGS": "设置",
     "OVERLAY_VIEWER": "重叠查看器",
@@ -33,6 +54,17 @@
     "SEARCH_CREATED_BY": "创建者",
     "SEARCH_SERVICE_APPROACH": "选中此项以禁用输入属性并使用服务进行配置"
   },
+  "TRASHCAN": {
+    "ACTIONS": {
+      "DELETE_PERMANENT": "永久删除",
+      "RESTORE": "恢复"
+    },
+    "EMPTY_STATE": {
+      "TITLE": "“垃圾”为空",
+      "FIRST_TEXT": "删除的项目移动到“垃圾”。",
+      "SECOND_TEXT": "清空“垃圾”以永久删除项目。"
+    }
+  },
   "DOCUMENT_LIST": {
     "MULTISELECT_CHECKBOXES": "多选（含复选框）",
     "MULTIPLE_FILE_UPLOAD": "上传多个文件",
@@ -43,13 +75,22 @@
     "DESCRIPTION_UPLOAD": "启用上传",
     "ENABLE_INFINITE_SCROLL": "启用无限滚动",
     "MULTISELECT_DESCRIPTION": "使用 Cmd (Mac) 或 Ctrl (Windows) 切换多个项目的选择",
-    "RECENT": "最近的文件",
+    "RECENT": {
+      "EMPTY_STATE": {
+        "TITLE": "\"最近的文件\"列表为空"
+      },
+      "TITLE": "最近的文件"
+    },
     "COLUMNS": {
       "DISPLAY_NAME": "显示名称",
+      "IS_LOCKED": "锁定",
       "TAG": "标签",
       "CREATED_BY": "创建者",
       "CREATED_ON": "创建日期",
-      "CREATED": "已创建"
+      "CREATED": "已创建",
+      "SIZE": "字号(&S)",
+      "DELETED_ON": "已删除",
+      "DELETED_BY": "删除人"
     },
     "TOOLBAR": {
       "CARDVIEW": "卡查看模式",
@@ -59,7 +100,10 @@
       "DELETE": "删除"
     },
     "ACTIONS": {
+      "VERSIONS": "管理版本",
+      "METADATA": "信息",
       "DOWNLOAD": "下载",
+      "PERMISSION": "权限",
       "FOLDER": {
         "COPY": "复制",
         "MOVE": "移动",
@@ -98,6 +142,13 @@
     "STORE": "存储",
     "RESTORE": "恢复"
   },
+  "FORM-LOADING": {
+    "FORM_DATA": "表单数据",
+    "FORM_DATA_MESSAGE": "输入值以填充表单",
+    "TYPEAHEAD_PLACEHOLDER": "预先输入",
+    "RADIO_PLACEHOLDER": "单选按钮",
+    "SELECT_PLACEHOLDER": "下拉列表"
+  },
   "LOGIN": {
     "CONTENT_SERVICES": "Content Services",
     "PROCESS_SERVICES": "Process Services",
@@ -115,5 +166,9 @@
     "LIST": "列表标签 Content Services",
     "INSERT": "插入节点 ID",
     "NODE_LIST": "标签列表（按节点 ID 排序）"
+  },
+  "DEMO_PERMISSION": {
+    "INHERIT_PERMISSION_BUTTON": "继承权限",
+    "INHERITED_PERMISSIONS_BUTTON": "已继承权限"
   }
 }

demo-shell/src/app.config.json

@@ -2,6 +2,7 @@
     "$schema": "../../lib/core/app-config/schema.json",
     "ecmHost": "http://{hostname}:{port}",
     "bpmHost": "http://{hostname}:{port}",
+    "contextRootBpm": "activiti-app",
     "application": {
         "name": "Alfresco ADF Application"
     },
@@ -51,6 +52,118 @@
             "label": "Simplified Chinese"
         }
     ],
+    "search": {
+      "limits": {
+        "permissionEvaluationTime": null,
+        "permissionEvaluationCount": null
+      },
+      "filterQueries": [
+        { "query": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
+        { "query": "NOT cm:creator:System" }
+      ],
+      "facetFields": {
+        "facets": [
+          { "field": "content.mimetype", "mincount": 1, "label": "Type" },
+          { "field": "content.size", "mincount": 1, "label": "Size" },
+          { "field": "creator", "mincount": 1, "label": "Creator" },
+          { "field": "modifier", "mincount": 1, "label": "Modifier" }
+        ]
+      },
+      "facetQueries": [
+        { "query": "created:2018", "label": "Created This Year" },
+        { "query": "content.mimetype", "label": "Type" },
+        { "query": "content.size:[0 TO 10240]", "label": "Size: xtra small"},
+        { "query": "content.size:[10240 TO 102400]", "label": "Size: small"},
+        { "query": "content.size:[102400 TO 1048576]", "label": "Size: medium" },
+        { "query": "content.size:[1048576 TO 16777216]", "label": "Size: large" },
+        { "query": "content.size:[16777216 TO 134217728]", "label": "Size: xtra large" },
+        { "query": "content.size:[134217728 TO MAX]", "label": "Size: XX large" }
+      ],
+      "query": {
+        "categories": [
+          {
+          "id": "broken",
+          "name": "Broken Facet",
+          "enabled": false,
+          "expanded": false,
+          "component": {
+            "selector": "adf-search-text",
+            "settings": {
+              "field": "fieldname"
+            }
+          }
+        },
+        {
+          "id": "queryName",
+          "name": "Name",
+          "enabled": true,
+          "expanded": true,
+          "component": {
+            "selector": "adf-search-text",
+            "settings": {
+              "pattern": "cm:name:'(.*?)'",
+              "field": "cm:name",
+              "placeholder": "Enter the name"
+            }
+          }
+        },
+        {
+          "id": "queryFields",
+          "name": "Fields",
+          "enabled": true,
+          "expanded": false,
+          "component": {
+            "selector": "adf-search-fields",
+            "settings": {
+              "field": null,
+              "options": [
+                { "name": "Name", "value": "name", "fields": ["name"], "default": true },
+                { "name": "File Size", "value": "content.sizeInBytes", "fields": ["content"], "default": true },
+                { "name": "Modified On", "value": "modifiedAt", "fields": ["modifiedAt"], "default": true },
+                { "name": "Modified By", "value": "modifiedByUser.displayName", "fields": ["modifiedByUser"], "default": true }
+              ]
+            }
+          }
+        },
+        {
+          "id": "queryType",
+          "name": "Type",
+          "enabled": true,
+          "expanded": false,
+          "component": {
+            "selector": "adf-search-radio",
+            "settings": {
+              "field": null,
+              "options": [
+                { "name": "None", "value": "", "default": true },
+                { "name": "All", "value": "TYPE:'cm:folder' OR TYPE:'cm:content'" },
+                { "name": "Folder", "value": "TYPE:'cm:folder'" },
+                { "name": "Document", "value": "TYPE:'cm:content'" }
+              ]
+            }
+          }
+        },
+        {
+          "id": "queryLocations",
+          "name": "Locations",
+          "enabled": true,
+          "expanded": false,
+          "component": {
+            "selector": "adf-search-scope-locations",
+            "settings": {
+              "field": null,
+              "options": [
+                { "name": "Default", "value": "nodes", "default": true },
+                { "name": "Nodes", "value": "nodes" },
+                { "name": "Deleted Nodes", "value": "deleted-nodes" },
+                { "name": "Versions", "value": "versions" }
+              ]
+            }
+          }
+        }
+        ]
+      }
+    },
     "pagination": {
         "size": 25,
         "supportedPageSizes": [ 5, 10, 15, 20 ]
@@ -371,5 +484,9 @@
                 "exif:exif": "*"
             }
         }
+    },
+    "adf-version-manager": {
+      "allowComments": true,
+      "allowDownload": true
     }
 }

demo-shell/src/app/app.component.html

@@ -1 +1,3 @@
 <router-outlet></router-outlet>
+<app-log></app-log>
+<router-outlet name="overlay"></router-outlet>

demo-shell/src/app/app.component.scss

@@ -33,3 +33,27 @@
         width: 52px;
     }
 }
+
+router-outlet[name="overlay"] + * {
+    width: 100%;
+    height: 100%;
+    z-index: 999999;
+    position: absolute;
+    top: 0;
+    right: 0;
+}
+
+@media (max-width: 425px) {
+    adf-content-node-selector {
+        .adf-content-node-selector-content-list {
+            .adf-data-table-cell {
+                display: none;
+            }
+
+            .adf-data-table-cell:first-child,
+            .adf-data-table-cell:nth-child(2) {
+                display: table-cell;
+            }            
+        }
+    }
+}

demo-shell/src/app/app.component.spec.ts

@@ -1,32 +1,25 @@
 import { TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
 
+import { AdfModule } from './adf.module';
 import { AppComponent } from './app.component';
 
 describe('AppComponent', () => {
-  beforeEach(async(() => {
+    beforeEach(async(() => {
-    TestBed.configureTestingModule({
+        TestBed.configureTestingModule({
-      declarations: [
+            imports: [
-        AppComponent
+                RouterTestingModule,
-      ],
+                AdfModule
-    }).compileComponents();
+            ],
-  }));
+            declarations: [
+                AppComponent
+            ]
+        }).compileComponents();
+    }));
 
-  it('should create the app', async(() => {
+    it('should create the app', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
+        const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
+        const app = fixture.debugElement.componentInstance;
-    expect(app).toBeTruthy();
+        expect(app).toBeTruthy();
-  }));
+    }));
-
-  it(`should have as title 'app works!'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app works!');
-  }));
-
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('app works!');
-  }));
 });

demo-shell/src/app/app.module.ts

@@ -18,8 +18,10 @@ import { SearchBarComponent } from './components/search/search-bar.component';
 import { SearchResultComponent } from './components/search/search-result.component';
 import { SearchExtendedComponent } from './components/search/search-extended.component';
 import { AboutComponent } from './components/about/about.component';
+import { LogComponent } from './components/log/log.component';
 import { FormComponent } from './components/form/form.component';
 import { FormListComponent } from './components/form/form-list.component';
+import { FormLoadingComponent } from './components/form/form-loading.component';
 import { CustomSourcesComponent } from './components/files/custom-sources.component';
 import { OverlayViewerComponent } from './components/overlay-viewer/overlay-viewer.component';
 
@@ -37,6 +39,7 @@ import { TagComponent } from './components/tag/tag.component';
 import { SocialComponent } from './components/social/social.component';
 import { VersionManagerDialogAdapterComponent } from './components/files/version-manager-dialog-adapter.component';
 import { MetadataDialogAdapterComponent } from './components/files/metadata-dialog-adapter.component';
+import { BlobPreviewComponent } from './components/blob-preview/blob-preview.component';
 
 import { ThemePickerModule } from './components/theme-picker/theme-picker';
 import { DebugAppConfigService } from './services/debug-app-config.service';
@@ -46,21 +49,22 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { TaskAttachmentsComponent } from './components/process-service/task-attachments.component';
 import { ProcessAttachmentsComponent } from './components/process-service/process-attachments.component';
 import { SharedLinkViewComponent } from './components/shared-link-view/shared-link-view.component';
-
+import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
+import { PreviewService } from './services/preview.service';
 
 @NgModule({
     imports: [
+        BrowserModule,
         BrowserAnimationsModule,
         ReactiveFormsModule,
-        BrowserModule,
         routing,
         FormsModule,
-        AdfModule,
         MaterialModule,
         ThemePickerModule,
         FlexLayoutModule,
         ChartsModule,
-        HttpClientModule
+        HttpClientModule,
+        AdfModule
     ],
     declarations: [
         AppComponent,
@@ -72,6 +76,7 @@ import { SharedLinkViewComponent } from './components/shared-link-view/shared-li
         SearchResultComponent,
         SearchExtendedComponent,
         AboutComponent,
+        LogComponent,
         ProcessServiceComponent,
         ShowDiagramComponent,
         FormViewerComponent,
@@ -92,7 +97,11 @@ import { SharedLinkViewComponent } from './components/shared-link-view/shared-li
         TaskAttachmentsComponent,
         ProcessAttachmentsComponent,
         OverlayViewerComponent,
-        SharedLinkViewComponent
+        SharedLinkViewComponent,
+        FormLoadingComponent,
+        DemoPermissionComponent,
+        FormLoadingComponent,
+        BlobPreviewComponent
     ],
     providers: [
         { provide: AppConfigService, useClass: DebugAppConfigService },
@@ -111,7 +120,8 @@ import { SharedLinkViewComponent } from './components/shared-link-view/shared-li
                 name: 'lazy-loading',
                 source: 'resources/lazy-loading'
             }
-        }
+        },
+        PreviewService
     ],
     entryComponents: [
         VersionManagerDialogAdapterComponent,

demo-shell/src/app/app.routes.ts

@@ -39,21 +39,21 @@ import { SocialComponent } from './components/social/social.component';
 import { FilesComponent } from './components/files/files.component';
 import { FormComponent } from './components/form/form.component';
 
-import { UploadButtonComponent } from '@alfresco/adf-content-services';
 import { FileViewComponent } from './components/file-view/file-view.component';
 import { CustomSourcesComponent } from './components/files/custom-sources.component';
 import { FormListComponent } from './components/form/form-list.component';
 import { OverlayViewerComponent } from './components/overlay-viewer/overlay-viewer.component';
 import { SharedLinkViewComponent } from './components/shared-link-view/shared-link-view.component';
+import { FormLoadingComponent } from './components/form/form-loading.component';
+import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
+import { BlobPreviewComponent } from './components/blob-preview/blob-preview.component';
 
 export const appRoutes: Routes = [
     { path: 'login', component: LoginComponent },
     { path: 'settings', component: SettingsComponent },
-    { path: 'files/:nodeId/view', component: FileViewComponent, canActivate: [ AuthGuardEcm ] },
+    { path: 'files/:nodeId/view', component: FileViewComponent, canActivate: [ AuthGuardEcm ], outlet: 'overlay' },
-    {
+    { path: 'preview/blob', component: BlobPreviewComponent, outlet: 'overlay', pathMatch: 'full' },
-        path: 'preview/s/:id',
+    { path: 'preview/s/:id', component: SharedLinkViewComponent },
-        component: SharedLinkViewComponent
-    },
     {
         path: '',
         component: AppLayoutComponent,
@@ -67,6 +67,10 @@ export const appRoutes: Routes = [
                 path: 'home',
                 component: HomeComponent
             },
+            {
+                path: 'settings-layout',
+                component: SettingsComponent
+            },
             {
                 path: 'trashcan',
                 component: TrashcanComponent,
@@ -82,6 +86,11 @@ export const appRoutes: Routes = [
                 component: FilesComponent,
                 canActivate: [AuthGuardEcm]
             },
+            {
+                path: 'files/:id/display/:mode',
+                component: FilesComponent,
+                canActivate: [AuthGuardEcm]
+            },
             {
                 path: 'dl-custom-sources',
                 component: CustomSourcesComponent,
@@ -91,11 +100,6 @@ export const appRoutes: Routes = [
                 path: 'datatable',
                 component: DataTableComponent
             },
-            {
-                path: 'uploader',
-                component: UploadButtonComponent,
-                canActivate: [AuthGuardEcm]
-            },
             {
                 path: 'search',
                 component: SearchResultComponent,
@@ -164,9 +168,15 @@ export const appRoutes: Routes = [
                 component: SocialComponent,
                 canActivate: [AuthGuardEcm]
             },
+            {
+                path: 'permissions/:id',
+                component: DemoPermissionComponent,
+                canActivate: [AuthGuardEcm]
+            },
             { path: 'about', component: AboutComponent },
             { path: 'form', component: FormComponent },
             { path: 'form-list', component: FormListComponent },
+            { path: 'form-loading', component: FormLoadingComponent },
             {
                 path: 'overlay-viewer',
                 component: OverlayViewerComponent,

demo-shell/src/app/components/app-layout/app-layout.component.html

@@ -1,47 +1,54 @@
-<mat-sidenav-container class="adf-nav-container">
+<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="false" [expandedSidenav]="false">
-    <mat-sidenav #sidenav class="adf-sidenav" position="end" mode="push">
-        <mat-nav-list>
-            <a mat-list-item *ngFor="let link of links" [routerLink]="link.href" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" (click)="sidenav.close()" class="adf-sidenav-link">
-                <mat-icon matListIcon>{{link.icon}}</mat-icon>
-                <span>{{link.title | translate }}</span>
-            </a>
-            <a mat-list-item adf-logout (click)="sidenav.close()">
-                <mat-icon matListIcon>exit_to_app</mat-icon>
-                <span>Logout</span>
-            </a>
-        </mat-nav-list>
-    </mat-sidenav>
 
-    <mat-toolbar color="primary" class="adf-app-layout-toolbar mat-elevation-z6">
+    <adf-sidenav-layout-header>
-        <adf-userinfo
+        <ng-template let-toggleMenu="toggleMenu">
-            class="adf-app-layout-user-profile"
+            <mat-toolbar color="primary" class="adf-app-layout-toolbar mat-elevation-z6">
-            [menuPositionX]="'before'"
+                <button mat-icon-button (click)="toggleMenu()">
-            [menuPositionY]="'above'">
+                    <mat-icon>menu</mat-icon>
-        </adf-userinfo>
+                </button>
 
-        <span fxFlex="1 1 auto" fxShow fxHide.lt-sm="true">{{'APP_LAYOUT.APP_NAME' | translate }}</span>
+                <span fxFlex="1 1 auto" fxShow fxHide.lt-sm="true">{{'APP_LAYOUT.APP_NAME' | translate }}</span>
 
-        <div class="adf-app-layout-menu-spacer"></div>
+                <div class="adf-app-layout-menu-spacer"></div>
 
-        <app-search-bar fxFlex="0 1 auto"></app-search-bar>
+                <app-search-bar fxFlex="0 1 auto"></app-search-bar>
 
-        <a fxFlex="0 0 auto" class="adf-toolbar-link" fxShow fxHide.lt-md="true" mat-button data-automation-id="home" href="" routerLink="/home" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">{{'APP_LAYOUT.HOME' | translate }}</a>
+                <adf-userinfo
-        <a fxFlex="0 0 auto" class="adf-toolbar-link" fxShow fxHide.lt-md="true" mat-button data-automation-id="files" href="" routerLink="/files" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">{{'APP_LAYOUT.CONTENT_SERVICES' | translate }}</a>
+                    class="adf-app-layout-user-profile"
-        <a fxFlex="0 0 auto" class="adf-toolbar-link" fxShow fxHide.lt-md="true"  mat-button data-automation-id="activiti" href="" routerLink="/activiti" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">{{'APP_LAYOUT.PROCESS_SERVICES' | translate }}</a>
+                    [menuPositionX]="'before'"
-        <a fxFlex="0 0 auto" class="adf-toolbar-link" fxShow fxHide.lt-md="true" mat-button data-automation-id="login" href="" routerLink="/login">Login</a>
+                    [menuPositionY]="'above'">
+                </adf-userinfo>
 
-        <app-theme-picker></app-theme-picker>
+                <app-theme-picker></app-theme-picker>
-        <button mat-icon-button [matMenuTriggerFor]="langMenu">
+                <button mat-icon-button [matMenuTriggerFor]="langMenu">
-            <mat-icon>language</mat-icon>
+                    <mat-icon>language</mat-icon>
-        </button>
+                </button>
-        <mat-menu #langMenu="matMenu">
+                <mat-menu #langMenu="matMenu">
-            <adf-language-menu></adf-language-menu>
+                    <adf-language-menu></adf-language-menu>
-        </mat-menu>
+                </mat-menu>
+            </mat-toolbar>
+        </ng-template>
+    </adf-sidenav-layout-header>
 
-        <button mat-icon-button (click)="sidenav.open()">
+    <adf-sidenav-layout-navigation>
-            <mat-icon>menu</mat-icon>
+        <ng-template let-isMenuMinimized="isMenuMinimized">
-        </button>
+            <mat-nav-list class="adf-sidenav-linklist">
-    </mat-toolbar>
+                <a mat-list-item *ngFor="let link of links" [attr.data-automation-id]="link.title | translate" [routerLink]="link.href" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }" class="adf-sidenav-link">
+                    <mat-icon matListIcon class="sidenav-menu-icon">{{link.icon}}</mat-icon>
+                    <div class="sidenav-menu-label" *ngIf="!isMenuMinimized()">{{link.title | translate }}</div>
+                </a>
+                <a mat-list-item adf-logout class="adf-sidenav-link">
+                    <mat-icon matListIcon class="sidenav-menu-icon">exit_to_app</mat-icon>
+                    <div class="sidenav-menu-label" *ngIf="!isMenuMinimized()">Logout</div>
+                </a>
+            </mat-nav-list>
+        </ng-template>
+    </adf-sidenav-layout-navigation>
 
-    <router-outlet></router-outlet>
+    <adf-sidenav-layout-content>
-</mat-sidenav-container>
+        <ng-template>
+            <router-outlet></router-outlet>
+        </ng-template>
+    </adf-sidenav-layout-content>
+
+</adf-sidenav-layout>

demo-shell/src/app/components/app-layout/app-layout.component.scss

@@ -1,5 +1,7 @@
 @mixin adf-app-layout-theme($theme) {
   $primary: map-get($theme, primary);
+  $background: map-get($theme, background);
+  $foreground: map-get($theme, foreground);
   $minimumAppWidth: 320px;
   $toolbarHeight: 64px;
 
@@ -17,12 +19,14 @@
    }
 
    .adf-app-layout-toolbar {
-     position: relative;
+       z-index: 1001;
-     overflow: visible !important;
+       position: relative;
+       overflow: visible !important;
    }
 
   .adf-app-layout {
-    display: block;
+    display: flex;
+    flex: 1;
     min-width: $minimumAppWidth;
     height: 100%;
 
@@ -32,10 +36,32 @@
       height: 100%;
     }
 
+    .adf-sidenav-linklist {
+      height: 100%;
+      overflow: auto;
+      padding-bottom: 8px;
+      box-sizing: border-box;
+    }
+
     .adf-sidenav-link {
+
       &.active {
         color: mat-color($primary);
       }
+
+      .sidenav-menu-icon {
+        margin-right: 20px;
+        font-size: 14px;
+      }
+
+      .sidenav-menu-label {
+        font-size: 14px;
+        white-space: nowrap;
+      }
+    }
+
+    .mat-nav-list .mat-list-item.adf-sidenav-link {
+      height: 40px;
     }
 
     &-user-profile {

demo-shell/src/app/components/app-layout/app-layout.component.ts

@@ -30,19 +30,19 @@ export class AppLayoutComponent {
     links: Array<any> = [
         { href: '/home', icon: 'home', title: 'APP_LAYOUT.HOME' },
         { href: '/files', icon: 'folder_open', title: 'APP_LAYOUT.CONTENT_SERVICES' },
-        { href: '/trashcan', icon: 'delete', title: 'APP_LAYOUT.TRASHCAN' },
         { href: '/activiti', icon: 'device_hub', title: 'APP_LAYOUT.PROCESS_SERVICES' },
         { href: '/login', icon: 'vpn_key', title: 'APP_LAYOUT.LOGIN' },
+        { href: '/trashcan', icon: 'delete', title: 'APP_LAYOUT.TRASHCAN' },
         { href: '/dl-custom-sources', icon: 'extension', title: 'APP_LAYOUT.CUSTOM_SOURCES' },
         { href: '/datatable', icon: 'view_module', title: 'APP_LAYOUT.DATATABLE' },
         { href: '/datatable-lazy', icon: 'view_module', title: 'APP_LAYOUT.DATATABLE_LAZY' },
         { href: '/form', icon: 'poll', title: 'APP_LAYOUT.FORM' },
         { href: '/form-list', icon: 'library_books', title: 'APP_LAYOUT.FORM_LIST' },
-        { href: '/uploader', icon: 'file_upload', title: 'APP_LAYOUT.UPLOADER' },
+        { href: '/form-loading', icon: 'cached', title: 'APP_LAYOUT.FORM_LOADING' },
         { href: '/webscript', icon: 'extension', title: 'APP_LAYOUT.WEBSCRIPT' },
         { href: '/tag', icon: 'local_offer', title: 'APP_LAYOUT.TAG' },
         { href: '/social', icon: 'thumb_up', title: 'APP_LAYOUT.SOCIAL' },
-        { href: '/settings', icon: 'settings', title: 'APP_LAYOUT.SETTINGS' },
+        { href: '/settings-layout', icon: 'settings', title: 'APP_LAYOUT.SETTINGS' },
         { href: '/extendedSearch', icon: 'search', title: 'APP_LAYOUT.SEARCH' },
         { href: '/overlay-viewer', icon: 'pageview', title: 'APP_LAYOUT.OVERLAY_VIEWER' },
         { href: '/about', icon: 'info_outline', title: 'APP_LAYOUT.ABOUT' }

demo-shell/src/app/components/blob-preview/blob-preview.component.ts

@@ -0,0 +1,21 @@
+import { Component } from '@angular/core';
+import { PreviewService } from '../../services/preview.service';
+import { Router } from '@angular/router';
+
+@Component({
+    templateUrl: 'bob-preview.component.html'
+})
+export class BlobPreviewComponent {
+    content: Blob;
+    name: string;
+
+    constructor(preview: PreviewService, router: Router) {
+        if (preview.content === null || preview.name === null) {
+            router.navigate([{ outlets: { overlay: null } }]);
+            return;
+        }
+
+        this.content = preview.content;
+        this.name = preview.name;
+    }
+}

demo-shell/src/app/components/blob-preview/bob-preview.component.html

@@ -0,0 +1,5 @@
+<adf-viewer 
+    [showViewer]="true" 
+    [blobFile]="content" 
+    [displayName]="name">
+</adf-viewer>

demo-shell/src/app/components/datatable/datatable.component.ts

@@ -178,7 +178,7 @@ export class DataTableComponent {
     getRowForNode() {
         const opts: any = {
             includeSource: true,
-            include: ['path', 'properties', 'allowableOperations']
+            include: ['path', 'properties', 'allowableOperations', 'permissions']
         };
 
         Observable.fromPromise(this.apiService.getInstance().nodes

demo-shell/src/app/components/file-view/file-view.component.html

@@ -1,15 +1,19 @@
 <ng-container *ngIf="nodeId">
 
     <ng-template let-node="node" #sidebarTemplate>
-        <adf-info-drawer title="Details">
+        <adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
-            <adf-info-drawer-tab label="Properties">
+            <adf-info-drawer-tab [label]="'APP.INFO_DRAWER.COMMENTS' | translate">
+                <adf-comments [nodeId]="nodeId"></adf-comments>
+            </adf-info-drawer-tab>
+
+            <adf-info-drawer-tab [label]="'APP.INFO_DRAWER.PROPERTIES' | translate">
                 <adf-content-metadata-card [node]="node"></adf-content-metadata-card>
             </adf-info-drawer-tab>
 
-            <adf-info-drawer-tab label="Versions">
+            <adf-info-drawer-tab [label]="'APP.INFO_DRAWER.VERSIONS' | translate">
                 <mat-card>
                     <mat-card-content>
-                        <adf-version-manager [node]="node">
+                        <adf-version-manager [node]="node" (uploadError)="uploadError($event)">
                         </adf-version-manager>
                     </mat-card-content>
                 </mat-card>

demo-shell/src/app/components/file-view/file-view.component.ts

@@ -18,6 +18,7 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { AlfrescoApiService } from '@alfresco/adf-core';
+import { MatSnackBar } from '@angular/material';
 
 @Component({
     selector: 'app-file-view',
@@ -30,6 +31,7 @@ export class FileViewComponent implements OnInit {
     constructor(
         private router: Router,
         private route: ActivatedRoute,
+        private snackBar: MatSnackBar,
         private apiService: AlfrescoApiService) {}
 
     ngOnInit() {
@@ -51,4 +53,7 @@ export class FileViewComponent implements OnInit {
         });
     }
 
+    uploadError(errorMessage: string) {
+        this.snackBar.open(errorMessage, '', { duration: 4000 });
+    }
 }

demo-shell/src/app/components/files/custom-sources.component.html

@@ -10,6 +10,7 @@
     </adf-toolbar-title>
 </adf-toolbar>
 <adf-document-list
+    #customSourcesDocumentList
     [currentFolderId]="selectedSource"
     locationFormat="/files"
     selectionMode="multiple">

demo-shell/src/app/components/files/custom-sources.component.ts

@@ -27,7 +27,7 @@ export class CustomSourcesComponent {
     @Input()
     selectedSource = '-recent-';
 
-    @ViewChild(DocumentListComponent)
+    @ViewChild('customSourcesDocumentList')
     documentList: DocumentListComponent;
 
     sources = [

demo-shell/src/app/components/files/files.component.html

@@ -29,7 +29,7 @@
     </mat-accordion>
 
     <div class="adf-site-container-style" id="site-container">
-        <adf-sites-dropdown (change)="onSiteChange($event)" [hideMyFiles]="false" >
+        <adf-sites-dropdown (change)="onSiteChange($event)" [hideMyFiles]="false" [relations]="'members'">
         </adf-sites-dropdown>
     </div>
     <div class="document-list-container" fxLayout="row" fxLayoutAlign="start stretch" fxLayoutGap="16px">
@@ -50,7 +50,6 @@
                     <adf-breadcrumb fxShow fxHide.lt-sm="true"
                                     class="files-breadcrumb"
                                     root="Personal Files"
-                                    (navigate)="onBreadcrumbNavigate($event)"
                                     [target]="documentList"
                                     [folderNode]="documentList.folderNode">
                     </adf-breadcrumb>
@@ -75,12 +74,14 @@
                         mat-icon-button
                         [disabled]="!canCreateContent(documentList.folderNode)"
                         title="{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}"
+                        (error)="openSnackMessage($event)"
                         [adf-create-folder]="getDocumentListCurrentFolderId()">
                         <mat-icon>create_new_folder</mat-icon>
                     </button>
                     <button mat-icon-button
                             [disabled]="!canEditFolder(documentList.selection)"
                             title="{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}"
+                            (error)="openSnackMessage($event)"
                             [adf-edit-folder]="documentList.selection[0]?.entry">
                         <mat-icon>create</mat-icon>
                     </button>
@@ -94,7 +95,7 @@
                             adf-node-permission="delete"
                             [adf-nodes]="documentList.selection"
                             title="{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}"
-                            (delete)="documentList.reload()"
+                            (delete)="onDeleteActionSuccess($event)"
                             [adf-delete]="documentList.selection">
                         <mat-icon>delete</mat-icon>
                     </button>
@@ -106,6 +107,14 @@
                             {{ favorite.hasFavorites() ? 'star' :'star_border' }}
                         </mat-icon>
                     </button>
+                    <button mat-icon-button
+                            [disabled]="!documentList.selection.length"
+                            [baseShareUrl]="baseShareUrl"
+                            [adf-share]="documentList.selection[0]">
+                        <mat-icon>
+                            share
+                        </mat-icon>
+                    </button>
                 </div>
 
                 <button fxFlex="1 0 auto" mat-icon-button [matMenuTriggerFor]="themePicker">
@@ -119,7 +128,7 @@
                     <button mat-menu-item (click)="toolbarColor = 'warn'">Warn</button>
                 </mat-menu>
 
-                <button mat-icon-button (click)="showVersions = !showVersions">
+                <button mat-icon-button (click)="showVersions = !showVersions" class="adf-show-versions-button">
                     <mat-icon *ngIf="!showVersions">chevron_left</mat-icon>
                     <mat-icon *ngIf="showVersions">chevron_right</mat-icon>
                 </button>
@@ -137,12 +146,14 @@
                         <span>{{ 'DOCUMENT_LIST.TOOLBAR.CARDVIEW' | translate }}</span>
                     </button>
                     <button mat-menu-item
+                            (error)="openSnackMessage($event)"
                             [adf-create-folder]="getDocumentListCurrentFolderId()">
                         <mat-icon>create_new_folder</mat-icon>
                         <span>{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}</span>
                     </button>
                     <button mat-menu-item
                             [disabled]="!canEditFolder(documentList.selection)"
+                            (error)="openSnackMessage($event)"
                             [adf-edit-folder]="documentList.selection[0]?.entry">
                         <mat-icon>create</mat-icon>
                         <span>{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}</span>
@@ -156,7 +167,9 @@
                     </button>
                     <button mat-menu-item
                             adf-node-permission="delete"
-                            [adf-nodes]="documentList.selection">
+                            [adf-nodes]="documentList.selection"
+                            (delete)="onDeleteActionSuccess($event)"
+                            [adf-delete]="documentList.selection">
                         <mat-icon>delete</mat-icon>
                         <span>{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}</span>
                     </button>
@@ -165,7 +178,6 @@
 
             <adf-document-list
                 #documentList
-                [enableInfiniteScrolling]="infiniteScrolling"
                 [permissionsStyle]="permissionsStyle"
                 [currentFolderId]="currentFolderId"
                 [contextMenuActions]="true"
@@ -175,6 +187,7 @@
                 [multiselect]="multiselect"
                 [display]="displayMode"
                 [node]="nodeResult"
+                [includeFields]="includeFields"
                 (error)="onNavigationError($event)"
                 (success)="resetError()"
                 (ready)="emitReadyEvent($event)"
@@ -226,6 +239,17 @@
                         </ng-template>
                     </data-column>
                     -->
+                    <data-column
+                        class="desktop-only"
+                        title="{{'DOCUMENT_LIST.COLUMNS.IS_LOCKED' | translate}}"
+                        key="id">
+                        <ng-template let-entry="$implicit">
+                            <button mat-icon-button [adf-node-lock]="entry.row.node.entry">
+                                <mat-icon *ngIf="entry.row.getValue('isLocked')">lock</mat-icon>
+                                <mat-icon *ngIf="!entry.row.getValue('isLocked')">lock_open</mat-icon>
+                            </button>
+                        </ng-template>
+                    </data-column>
                     <data-column
                         title="{{'DOCUMENT_LIST.COLUMNS.CREATED_BY' | translate}}"
                         key="createdByUser.displayName"
@@ -245,13 +269,13 @@
                     <!-- common actions -->
                     <content-action
                         icon="get_app"
-                        title="{{'DOCUMENT_LIST.ACTIONS.DOWNLOAD' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.DOWNLOAD"
                         handler="download">
                     </content-action>
                     <content-action
                         icon="content_copy"
-                        title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.COPY' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.FOLDER.COPY"
-                        permission="update"
+                        permission="copy"
                         [disableWithNoPermission]="true"
                         (error)="onContentActionError($event)"
                         (success)="onContentActionSuccess($event)"
@@ -259,7 +283,7 @@
                     </content-action>
                     <content-action
                         icon="redo"
-                        title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.MOVE' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.FOLDER.MOVE"
                         permission="update"
                         [disableWithNoPermission]="true"
                         (error)="onContentActionError($event)"
@@ -270,30 +294,43 @@
                         icon="delete"
                         permission="delete"
                         [disableWithNoPermission]="true"
-                        title="{{'DOCUMENT_LIST.ACTIONS.FOLDER.DELETE' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.FOLDER.DELETE"
                         (permissionEvent)="handlePermissionError($event)"
                         (success)="onDeleteActionSuccess($event)"
                         handler="delete">
                     </content-action>
                     <content-action
                         icon="info"
-                        title="{{'DOCUMENT_LIST.ACTIONS.METADATA' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.METADATA"
                         (execute)="onManageMetadata($event)">
                     </content-action>
                     <!-- document actions -->
                     <content-action
                         icon="storage"
                         target="document"
-                        title="{{'DOCUMENT_LIST.ACTIONS.VERSIONS' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.VERSIONS"
                         (execute)="onManageVersions($event)">
                     </content-action>
                     <content-action
                         *ngIf="authenticationService.isBpmLoggedIn()"
                         icon="play_arrow"
                         target="document" 
-                        title="{{'DOCUMENT_LIST.ACTIONS.DOCUMENT.PROCESS_ACTION' | translate}}"
+                        title="DOCUMENT_LIST.ACTIONS.DOCUMENT.PROCESS_ACTION"
                         (execute)="startProcesAction($event)">
                     </content-action>
+                    <content-action
+                        icon="settings_input_component"
+                        title="{{'DOCUMENT_LIST.ACTIONS.PERMISSION' | translate}}"
+                        permission="copy"
+                        (error)="onContentActionError($event)"
+                        (execute)="onPermissionRequested($event)">
+                    </content-action>
+                    <content-action
+                        icon="lock"
+                        permission="lock"
+                        handler="lock"
+                        title="Lock">
+                    </content-action>
                 </content-actions>
             </adf-document-list>
             <adf-pagination
@@ -321,7 +358,9 @@
                 <ng-container *ngIf="hasOneFileSelected();else choose_document_template">
                     <ng-container *ngIf="userHasPermissionToManageVersions(); else no_permission_to_versions">
                         <adf-version-manager
-                            [node]="documentList.selection[0].entry">
+                            [node]="documentList.selection[0].entry"
+                            [showComments]="showVersionComments"
+                            [allowDownload]="allowVersionDownload">
                         </adf-version-manager>
                     </ng-container>
                 </ng-container>
@@ -342,7 +381,7 @@
     </div>
 </div>
 
-<context-menu-holder></context-menu-holder>
+<adf-context-menu-holder></adf-context-menu-holder>
 
 <div *ngIf="processId">
     <adf-start-process
@@ -396,17 +435,29 @@
         </section>
 
         <section>
-            <mat-slide-toggle [color]="'primary'" [(ngModel)]="versioning">{{'DOCUMENT_LIST.ENABLE_VERSIONING' |
+            <mat-slide-toggle [color]="'primary'" [(ngModel)]="versioning">
-                translate}}
+                {{'DOCUMENT_LIST.ENABLE_VERSIONING' | translate}}
             </mat-slide-toggle>
         </section>
 
         <section>
-            <mat-slide-toggle [color]="'primary'" [(ngModel)]="infiniteScrolling">
+            <mat-slide-toggle color="primary" [(ngModel)]="infiniteScrolling">
                 {{'DOCUMENT_LIST.ENABLE_INFINITE_SCROLL' | translate}}
             </mat-slide-toggle>
         </section>
 
+        <section>
+            <mat-slide-toggle color="primary" [(ngModel)]="showVersionComments">
+                {{'APP.ADF_VERSION_MANAGER.SHOW_COMMENTS' | translate}}
+            </mat-slide-toggle>
+        </section>
+
+        <section>
+            <mat-slide-toggle color="primary" [(ngModel)]="allowVersionDownload">
+                {{'APP.ADF_VERSION_MANAGER.ALLOW_DOWNLOAD' | translate}}
+            </mat-slide-toggle>
+        </section>
+
         <h5>Upload</h5>
         <section *ngIf="acceptedFilesTypeShow">
             <mat-form-field floatPlaceholder="float">
@@ -432,7 +483,7 @@
                 [multipleFiles]="multipleFileUpload"
                 [uploadFolders]="folderUpload"
                 [maxFilesSize]="maxSizeShow ? maxFilesSize : null"
-                (error)="handleUploadError($event)"
+                (error)="openSnackMessage($event)"
                 [versioning]="versioning"
                 [adf-node-permission]="'create'"
                 [adf-nodes]="enableUpload ? getCurrentDocumentListNode() : []"
@@ -450,7 +501,7 @@
                 [multipleFiles]="multipleFileUpload"
                 [uploadFolders]="folderUpload"
                 [versioning]="versioning"
-                (error)="handleUploadError($event)"
+                (error)="openSnackMessage($event)"
                 [adf-node-permission]="'create'"
                 [adf-nodes]="enableUpload ? getCurrentDocumentListNode() : []"
                 (permissionEvent)="handlePermissionError($event)">
@@ -477,4 +528,4 @@
     </div>
 </div>
 
-<file-uploading-dialog #fileDialog></file-uploading-dialog>
+<adf-file-uploading-dialog #fileDialog (error)="openSnackMessage($event)" ></adf-file-uploading-dialog>

demo-shell/src/app/components/files/files.component.scss

@@ -1,149 +1,182 @@
-$minimumDocumentListWidth: 425px;
+@mixin adf-file-component-theme($theme) {
+    $minimumDocumentListWidth: 900px;
+    $foreground: map-get($theme, foreground);
 
-.container {
-    margin: 10px;
-}
-
-@media only screen and (max-width: 640px) {
     .container {
-        margin: 0;
+        margin: 10px !important;
-    }
-}
-
-.error-message {
-    text-align: left;
-}
-
-.error-message--text {
-    color: #d50000;
-}
-
-.adf-not-overlay-viewer {
-    height: 900px;
-}
-
-adf-document-list ::ng-deep adf-datatable tr.document-list__create {
-    background: green !important;
-}
-
-adf-document-list ::ng-deep adf-datatable tr.document-list__disable {
-    background: red !important;
-}
-
-adf-document-list ::ng-deep .adf-datatable-selected > svg {
-    fill: #00bcd4 !important;
-}
-
-.adf-site-container-style {
-    margin-top: 10px;
-    margin-bottom: 10px;
-    width: 100%;
-    min-width: 200px;
-}
-
-.adf-content-service-settings {
-    padding: 16px;
-}
-
-.adf-files-toolbar {
-    .adf-toolbar-title {
-        display: flex;
-        width: 100%;
-
-        .adf-breadcrumb {
-            width: 0;
-        }
-    }
-}
-
-.adf-manage-versions-sidebar {
-    width: 300px;
-    color: rgba(0, 0, 0, 0.87);
-
-    .adf-manage-versions-empty,
-    .adf-manage-versions-no-permission {
-        margin: 24px;
-        color: grey;
-        text-align: justify;
-
-        &-icon {
-            display: block;
-            font-size: 48px;
-            margin: 0 auto 32px auto;
-        }
     }
 
-    & ::ng-deep .adf-info-drawer-layout-header {
+    @media screen and ($mat-xsmall) {
-        display: none;
+        .container {
-    }
+            margin: 0;
-
-    & ::ng-deep .adf-info-drawer-layout-content {
-        padding: 0;
-
-        .adf-version-upload,
-        .adf-new-version-file-upload {
-            width: 100%;
-
-            & .mat-raised-button {
-                width: 100%;
-            }
         }
 
-        .adf-new-version-uploader-container {
+        .adf-show-versions-button.mat-icon-button {
-            padding: 8px 24px 16px 24px;
-        }
-    }
-}
-
-.adf-no-result__empty_doc_lib {
-    width: 565px;
-    height: 161px;
-    object-fit: contain;
-    margin-top: 17px;
-}
-
-.adf-empty_template {
-    text-align: center;
-    margin-top: 20px;
-    margin-bottom: 20px;
-}
-
-.adf-no-result-message {
-    height: 32px;
-    opacity: 0.26;
-    font-size: 24px;
-    line-height: 1.33;
-    letter-spacing: -1px;
-}
-
-.adf-container-recent {
-    mat-icon {
-        margin-left: 20px;
-    }
-
-    .empty-list__block {
-        height: 100%;
-        padding: 0;
-        margin: 0;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-    }
-}
-
-@media (max-width: $minimumDocumentListWidth) {
-    adf-document-list ::ng-deep adf-datatable {
-        & ::ng-deep .adf-data-table-cell--fileSize {
             display: none;
         }
     }
 
-    .adf-site-container-style {
+    .error-message {
-        width: 100%;
+        text-align: left;
-        display: block;
+    }
 
-        & ::ng-deep .adf-site-dropdown-list-element {
+    .error-message--text {
+        color: #d50000;
+    }
+
+    .adf-not-overlay-viewer {
+        height: 900px;
+    }
+
+    adf-document-list ::ng-deep adf-datatable tr.document-list__create {
+        background: green !important;
+    }
+
+    adf-document-list ::ng-deep adf-datatable tr.document-list__disable {
+        background: red !important;
+    }
+
+    adf-document-list ::ng-deep .adf-datatable-selected > svg {
+        fill: #00bcd4 !important;
+    }
+
+    .adf-site-container-style {
+        margin-top: 10px;
+        margin-bottom: 10px;
+        width: 100%;
+        min-width: 200px;
+    }
+
+    .adf-content-service-settings {
+        padding: 16px;
+    }
+
+    .adf-files-toolbar {
+        .adf-toolbar-title {
+            display: flex;
             width: 100%;
+
+            .adf-breadcrumb {
+                width: 0;
+            }
+        }
+    }
+
+    .adf-manage-versions-sidebar {
+        width: 300px !important;
+        color: rgba(0, 0, 0, 0.87);
+
+        .adf-manage-versions-empty,
+        .adf-manage-versions-no-permission {
+            margin: 44px;
+            color: mat-color($foreground, text, 0.54);
+            text-align: center;
+
+            &-icon {
+                display: block;
+                font-size: 48px;
+                margin: 0 auto 32px auto;
+            }
+        }
+
+        & ::ng-deep .adf-info-drawer-layout-header {
+            display: none;
+        }
+
+        & ::ng-deep .adf-info-drawer-layout-content {
+            padding: 0;
+
+            .adf-version-upload,
+            .adf-new-version-file-upload {
+                width: 100%;
+
+                & .mat-raised-button {
+                    width: 100%;
+                }
+            }
+
+            .adf-new-version-uploader-container {
+                padding: 8px 24px 16px 24px;
+            }
+        }
+    }
+
+    .adf-no-result__empty_doc_lib {
+        width: 565px;
+        height: 161px;
+        object-fit: contain;
+        margin-top: 17px;
+    }
+
+    .adf-empty_template {
+        text-align: center;
+        margin-top: 20px;
+        margin-bottom: 20px;
+    }
+
+    .adf-no-result-message {
+        height: 32px;
+        opacity: 0.26;
+        font-size: 24px;
+        line-height: 1.33;
+        letter-spacing: -1px;
+    }
+
+    .adf-container-recent {
+        mat-icon {
+            margin-left: 20px;
+        }
+
+        .empty-list__block {
+            height: 100%;
+            padding: 0;
+            margin: 0;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+        }
+    }
+
+    @media (max-device-width: $minimumDocumentListWidth) {
+        adf-document-list .adf-data-table {
+            .adf-data-table-cell,
+            .adf-datatable-table-cell-header {
+                display: none;
+            }
+    
+            .adf-data-table-cell:first-child,
+            .adf-datatable-table-cell-header:first-child,
+            .adf-data-table-cell:nth-child(2),
+            .adf-datatable-table-cell-header:nth-child(2) {
+                display: table-cell;
+            }                 
+        }
+
+        .adf-site-container-style {
+            width: 100%;
+            display: block;
+
+            & ::ng-deep .adf-site-dropdown-list-element {
+                width: 100%;
+            }
+        }
+
+        adf-file-uploading-dialog ::ng-deep .upload-dialog {
+            width: 80%;
+
+            & ::ng-deep adf-file-uploading-list ::ng-deep adf-file-uploading-list-row .adf-file-uploading-row__group {
+                min-width: 0;
+            }
+        }
+    }
+
+    @media (max-device-width: 1024px) {
+        adf-document-list .adf-data-table {
+    
+            .adf-data-table-cell:nth-child(4),
+            .adf-datatable-table-cell-header:nth-child(4) {
+                display: none;
+            }                 
         }
     }    
 }

demo-shell/src/app/components/files/files.component.ts

@@ -16,24 +16,19 @@
  */
 
 import {
-    Component, Input, OnInit, OnChanges, OnDestroy, ChangeDetectorRef,
+    Component, Input, OnInit, OnChanges, OnDestroy, Optional,
-    EventEmitter, Optional, ViewChild, SimpleChanges, Output
+    EventEmitter, ViewChild, SimpleChanges, Output
 } from '@angular/core';
+import { Location } from '@angular/common';
+
 import { MatDialog } from '@angular/material';
 import { ActivatedRoute, Params, Router } from '@angular/router';
+import { MinimalNodeEntity, NodePaging, Pagination, MinimalNodeEntryEntity, SiteEntry } from 'alfresco-js-api';
 import {
-    MinimalNodeEntity,
+    AuthenticationService, AppConfigService, ContentService, TranslationService,
-    NodePaging,
-    Pagination,
-    PathElementEntity,
-    MinimalNodeEntryEntity,
-    SiteEntry
-} from 'alfresco-js-api';
-import {
-    AuthenticationService, ContentService, TranslationService,
     FileUploadEvent, FolderCreatedEvent, LogService, NotificationService,
     UploadService, DataColumn, DataRow, UserPreferencesService,
-    PaginationComponent, FormValues, DisplayMode
+    PaginationComponent, FormValues, DisplayMode, UserPreferenceValues
 } from '@alfresco/adf-core';
 
 import { DocumentListComponent, PermissionStyleModel } from '@alfresco/adf-content-services';
@@ -43,6 +38,7 @@ import { SelectAppsDialogComponent } from '@alfresco/adf-process-services';
 import { VersionManagerDialogAdapterComponent } from './version-manager-dialog-adapter.component';
 import { MetadataDialogAdapterComponent } from './metadata-dialog-adapter.component';
 import { Subscription } from 'rxjs/Subscription';
+import { PreviewService } from '../../services/preview.service';
 
 const DEFAULT_FOLDER_TO_SHOW = '-my-';
 
@@ -58,6 +54,9 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     showViewer = false;
     showVersions = false;
     displayMode = DisplayMode.List;
+    includeFields = ['isLocked', 'aspectNames'];
+
+    baseShareUrl = this.appConfig.get<string>('ecmHost') + '/preview/s/';
 
     toolbarColor = 'default';
 
@@ -67,8 +66,8 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         { value: 'multiple', viewValue: 'Multiple' }
     ];
 
+    // The identifier of a node. You can also use one of these well-known aliases: -my- | -shared- | -root-
     @Input()
-        // The identifier of a node. You can also use one of these well-known aliases: -my- | -shared- | -root-
     currentFolderId: string = DEFAULT_FOLDER_TO_SHOW;
 
     formValues: FormValues = {};
@@ -93,9 +92,15 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     @Input()
     maxSizeShow = false;
 
+    @Input()
+    showVersionComments = true;
+
     @Input()
     versioning = false;
 
+    @Input()
+    allowVersionDownload = true;
+
     @Input()
     acceptedFilesType = '.jpg,.pdf,.js';
 
@@ -138,45 +143,43 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     @ViewChild('documentList')
     documentList: DocumentListComponent;
 
-    @ViewChild(PaginationComponent)
+    @ViewChild('standardPagination')
     standardPagination: PaginationComponent;
 
     permissionsStyle: PermissionStyleModel[] = [];
     infiniteScrolling: boolean;
     supportedPages: number[];
+    currentSiteid = '';
 
     private onCreateFolder: Subscription;
     private onEditFolder: Subscription;
 
-    constructor(private changeDetector: ChangeDetectorRef,
+    constructor(private notificationService: NotificationService,
-                private notificationService: NotificationService,
                 private uploadService: UploadService,
                 private contentService: ContentService,
                 private dialog: MatDialog,
+                private location: Location,
                 private translateService: TranslationService,
                 private router: Router,
                 private logService: LogService,
                 private preference: UserPreferencesService,
+                private appConfig: AppConfigService,
+                private preview: PreviewService,
                 @Optional() private route: ActivatedRoute,
                 public authenticationService: AuthenticationService) {
+        this.preference.select(UserPreferenceValues.SupportedPageSizes)
+            .subscribe((pages) => {
+                this.supportedPages = pages;
+            });
     }
 
     showFile(event) {
         const entry = event.value.entry;
         if (entry && entry.isFile) {
-            this.router.navigate(['/files', entry.id, 'view']);
+            this.preview.showResource(entry.id);
         }
     }
 
-    onFolderChange($event) {
-        this.currentFolderId = $event.value.id;
-        this.router.navigate(['/files', $event.value.id]);
-    }
-
-    onBreadcrumbNavigate(route: PathElementEntity) {
-        this.router.navigate(['/files', route.id]);
-    }
-
     toggleFolder() {
         this.multipleFileUpload = false;
         this.folderUpload = !this.folderUpload;
@@ -190,11 +193,15 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
                 skipCount: 0
             };
         }
+
         if (this.route) {
             this.route.params.forEach((params: Params) => {
-                if (params['id']) {
+                if (params['id'] && this.currentFolderId !== params['id']) {
                     this.currentFolderId = params['id'];
-                    this.changeDetector.detectChanges();
+                }
+
+                if (params['mode']) {
+                    this.displayMode = DisplayMode.Gallery;
                 }
             });
         }
@@ -205,7 +212,7 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         this.contentService.folderCreated.subscribe(value => this.onFolderCreated(value));
         this.onCreateFolder = this.contentService.folderCreate.subscribe(value => this.onFolderAction(value));
         this.onEditFolder = this.contentService.folderEdit.subscribe(value => this.onFolderAction(value));
-        this.supportedPages = this.preference.getDifferentPageSizes();
+        this.supportedPages = this.supportedPages ? this.supportedPages : this.preference.getDefaultPageSizes();
 
         // this.permissionsStyle.push(new PermissionStyleModel('document-list__create', PermissionsEnum.CREATE));
         // this.permissionsStyle.push(new PermissionStyleModel('document-list__disable', PermissionsEnum.NOT_CREATE, false, true));
@@ -274,33 +281,29 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
         }
     }
 
+    onFolderChange($event) {
+        this.router.navigate(['/files', $event.value.id]);
+    }
+
     handlePermissionError(event: any) {
         this.translateService.get('PERMISSON.LACKOF', {
             permission: event.permission,
             action: event.action,
             type: event.type
         }).subscribe((message) => {
-            this.notificationService.openSnackMessage(
+            this.openSnackMessage(message);
-                message,
-                4000
-            );
         });
     }
 
-    handleUploadError(event: any) {
+    openSnackMessage(event: any) {
         this.notificationService.openSnackMessage(
             event,
             4000
         );
     }
 
-    emitReadyEvent(event: any) {
+    emitReadyEvent(event: NodePaging) {
-        if (this.pageIsEmpty(event)) {
+        this.documentListReady.emit(event);
-            this.standardPagination.goPrevious();
-        } else {
-            this.documentListReady.emit(event);
-            this.pagination = event.list.pagination;
-        }
     }
 
     pageIsEmpty(node: NodePaging) {
@@ -322,31 +325,47 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
                 translatedErrorMessage = this.translateService.get('OPERATION.ERROR.UNKNOWN');
         }
 
-        this.notificationService.openSnackMessage(translatedErrorMessage.value, 4000);
+        this.openSnackMessage(translatedErrorMessage.value);
     }
 
     onContentActionSuccess(message) {
         const translatedMessage: any = this.translateService.get(message);
-        this.notificationService.openSnackMessage(translatedMessage.value, 4000);
+        this.openSnackMessage(translatedMessage.value);
+        this.reloadForInfiniteScrolling();
     }
 
     onDeleteActionSuccess(message) {
         this.uploadService.fileDeleted.next(message);
         this.deleteElementSuccess.emit();
+        this.reloadForInfiniteScrolling();
+        this.openSnackMessage(message);
+    }
+
+    onPermissionRequested(node) {
+        this.router.navigate(['/permissions', node.value.entry.id]);
+    }
+
+    private reloadForInfiniteScrolling() {
+        if (this.infiniteScrolling) {
+            this.documentList.skipCount = 0;
+        }
+        this.documentList.reload();
     }
 
     onManageVersions(event) {
         const contentEntry = event.value.entry;
+        const showComments = this.showVersionComments;
+        const allowDownload = this.allowVersionDownload;
 
         if (this.contentService.hasPermission(contentEntry, 'update')) {
             this.dialog.open(VersionManagerDialogAdapterComponent, {
-                data: { contentEntry },
+                data: { contentEntry: contentEntry, showComments: showComments, allowDownload: allowDownload },
                 panelClass: 'adf-version-manager-dialog',
                 width: '630px'
             });
         } else {
             const translatedErrorMessage: any = this.translateService.get('OPERATION.ERROR.PERMISSION');
-            this.notificationService.openSnackMessage(translatedErrorMessage.value, 4000);
+            this.openSnackMessage(translatedErrorMessage.value);
         }
     }
 
@@ -361,7 +380,7 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
             });
         } else {
             const translatedErrorMessage: any = this.translateService.get('OPERATION.ERROR.PERMISSION');
-            this.notificationService.openSnackMessage(translatedErrorMessage.value, 4000);
+            this.openSnackMessage(translatedErrorMessage.value);
         }
     }
 
@@ -449,10 +468,17 @@ export class FilesComponent implements OnInit, OnChanges, OnDestroy {
     }
 
     toogleGalleryView(): void {
+        const url = this
+            .router
+            .createUrlTree(['/files', this.currentFolderId, 'display', this.displayMode])
+            .toString();
+
         if (this.displayMode === DisplayMode.List) {
             this.displayMode = DisplayMode.Gallery;
+            this.location.go(url);
         } else {
             this.displayMode = DisplayMode.List;
+            this.location.go(url);
         }
     }
 }

demo-shell/src/app/components/files/version-manager-dialog-adapter.component.html

@@ -1,6 +1,6 @@
 <header mat-dialog-title>{{'VERSION.DIALOG.TITLE' | translate}}</header>
 <section mat-dialog-content>
-    <adf-version-manager [node]="contentEntry"></adf-version-manager>
+    <adf-version-manager [node]="contentEntry" [allowDownload]="allowDownload" [showComments]="showComments" (uploadError)="uploadError($event)"></adf-version-manager>
 </section>
 <footer mat-dialog-actions fxLayout="row" fxLayoutAlign="end center">
     <button mat-button (click)="close()">{{'VERSION.DIALOG.CLOSE' | translate}}</button>

demo-shell/src/app/components/files/version-manager-dialog-adapter.component.ts

@@ -18,6 +18,7 @@
 import { Component, Inject, ViewEncapsulation } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
 import { MinimalNodeEntryEntity } from 'alfresco-js-api';
+import { MatSnackBar } from '@angular/material';
 
 @Component({
     templateUrl: './version-manager-dialog-adapter.component.html',
@@ -27,9 +28,19 @@ export class VersionManagerDialogAdapterComponent {
 
     public contentEntry: MinimalNodeEntryEntity;
 
+    showComments = true;
+    allowDownload = true;
+
     constructor(@Inject(MAT_DIALOG_DATA) data: any,
+                private snackBar: MatSnackBar,
                 private containingDialog?: MatDialogRef<VersionManagerDialogAdapterComponent>) {
         this.contentEntry = data.contentEntry;
+        this.showComments = data.hasOwnProperty('showComments') ? data.showComments : this.showComments;
+        this.allowDownload = data.hasOwnProperty('allowDownload') ? data.allowDownload : this.allowDownload;
+    }
+
+    uploadError(errorMessage: string) {
+        this.snackBar.open(errorMessage, '', { duration: 4000 });
     }
 
     close() {

demo-shell/src/app/components/form/demo-form.ts

@@ -2,14 +2,14 @@
  * @license
  * Copyright 2016 Alfresco Software, Ltd.
  *
- * Licensed under the Apache License, Version 2.0 (the "License");
+ * Licensed under the Apache License, Version 2.0 (the 'License');
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
  *
  *     http://www.apache.org/licenses/LICENSE-2.0
  *
  * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
+ * distributed under the License is distributed on an 'AS IS' BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
@@ -1450,4 +1450,271 @@ export class DemoForm {
         };
     }
 
+    static getSimpleFormDefinition(): any {
+        return {
+            'id': 1001,
+            'name': 'SIMPLE_FORM_EXAMPLE',
+            'description': '',
+            'version': 1,
+            'lastUpdatedBy': 2,
+            'lastUpdatedByFullName': 'Test01 01Test',
+            'lastUpdated': '2018-02-26T17:44:04.543+0000',
+            'stencilSetId': 0,
+            'referenceId': null,
+            'taskId': '9999',
+            'formDefinition': {
+              'tabs': [],
+              'fields': [
+                {
+                  'fieldType': 'ContainerRepresentation',
+                  'id': '1519666726245',
+                  'name': 'Label',
+                  'type': 'container',
+                  'value': null,
+                  'required': false,
+                  'readOnly': false,
+                  'overrideId': false,
+                  'colspan': 1,
+                  'placeholder': null,
+                  'minLength': 0,
+                  'maxLength': 0,
+                  'minValue': null,
+                  'maxValue': null,
+                  'regexPattern': null,
+                  'optionType': null,
+                  'hasEmptyValue': null,
+                  'options': null,
+                  'restUrl': null,
+                  'restResponsePath': null,
+                  'restIdProperty': null,
+                  'restLabelProperty': null,
+                  'tab': null,
+                  'className': null,
+                  'dateDisplayFormat': null,
+                  'layout': null,
+                  'sizeX': 2,
+                  'sizeY': 1,
+                  'row': -1,
+                  'col': -1,
+                  'visibilityCondition': null,
+                  'numberOfColumns': 2,
+                  'fields': {
+                    '1': [
+                      {
+                        'fieldType': 'RestFieldRepresentation',
+                        'id': 'typeahedField',
+                        'name': 'TypeahedField',
+                        'type': 'typeahead',
+                        'value': null,
+                        'required': false,
+                        'readOnly': false,
+                        'overrideId': false,
+                        'colspan': 1,
+                        'placeholder': null,
+                        'minLength': 0,
+                        'maxLength': 0,
+                        'minValue': null,
+                        'maxValue': null,
+                        'regexPattern': null,
+                        'optionType': null,
+                        'hasEmptyValue': null,
+                        'options': null,
+                        'restUrl': 'https://jsonplaceholder.typicode.com/users',
+                        'restResponsePath': null,
+                        'restIdProperty': 'id',
+                        'restLabelProperty': 'name',
+                        'tab': null,
+                        'className': null,
+                        'params': {
+                          'existingColspan': 1,
+                          'maxColspan': 2
+                        },
+                        'dateDisplayFormat': null,
+                        'layout': {
+                          'row': -1,
+                          'column': -1,
+                          'colspan': 1
+                        },
+                        'sizeX': 1,
+                        'sizeY': 1,
+                        'row': -1,
+                        'col': -1,
+                        'visibilityCondition': null,
+                        'endpoint': null,
+                        'requestHeaders': null
+                      }
+                    ],
+                    '2': [
+                      {
+                        'fieldType': 'RestFieldRepresentation',
+                        'id': 'radioButton',
+                        'name': 'RadioButtons',
+                        'type': 'radio-buttons',
+                        'value': null,
+                        'required': false,
+                        'readOnly': false,
+                        'overrideId': false,
+                        'colspan': 1,
+                        'placeholder': null,
+                        'minLength': 0,
+                        'maxLength': 0,
+                        'minValue': null,
+                        'maxValue': null,
+                        'regexPattern': null,
+                        'optionType': null,
+                        'hasEmptyValue': null,
+                        'options': [
+                          {
+                            'id': 'option_1',
+                            'name': 'Option 1'
+                          },
+                          {
+                            'id': 'option_2',
+                            'name': 'Option 2'
+                          },
+                          {
+                            'id': 'option_3',
+                            'name': 'Option 3'
+                          }
+                        ],
+                        'restUrl': null,
+                        'restResponsePath': null,
+                        'restIdProperty': null,
+                        'restLabelProperty': null,
+                        'tab': null,
+                        'className': null,
+                        'params': {
+                          'existingColspan': 1,
+                          'maxColspan': 1
+                        },
+                        'dateDisplayFormat': null,
+                        'layout': {
+                          'row': -1,
+                          'column': -1,
+                          'colspan': 1
+                        },
+                        'sizeX': 1,
+                        'sizeY': 2,
+                        'row': -1,
+                        'col': -1,
+                        'visibilityCondition': null,
+                        'endpoint': null,
+                        'requestHeaders': null
+                      }
+                    ]
+                  }
+                },
+                {
+                  'fieldType': 'ContainerRepresentation',
+                  'id': '1519666735185',
+                  'name': 'Label',
+                  'type': 'container',
+                  'value': null,
+                  'required': false,
+                  'readOnly': false,
+                  'overrideId': false,
+                  'colspan': 1,
+                  'placeholder': null,
+                  'minLength': 0,
+                  'maxLength': 0,
+                  'minValue': null,
+                  'maxValue': null,
+                  'regexPattern': null,
+                  'optionType': null,
+                  'hasEmptyValue': null,
+                  'options': null,
+                  'restUrl': null,
+                  'restResponsePath': null,
+                  'restIdProperty': null,
+                  'restLabelProperty': null,
+                  'tab': null,
+                  'className': null,
+                  'dateDisplayFormat': null,
+                  'layout': null,
+                  'sizeX': 2,
+                  'sizeY': 1,
+                  'row': -1,
+                  'col': -1,
+                  'visibilityCondition': null,
+                  'numberOfColumns': 2,
+                  'fields': {
+                    '1': [
+                      {
+                        'fieldType': 'RestFieldRepresentation',
+                        'id': 'selectBox',
+                        'name': 'SelectBox',
+                        'type': 'dropdown',
+                        'value': 'Choose one...',
+                        'required': false,
+                        'readOnly': false,
+                        'overrideId': false,
+                        'colspan': 1,
+                        'placeholder': null,
+                        'minLength': 0,
+                        'maxLength': 0,
+                        'minValue': null,
+                        'maxValue': null,
+                        'regexPattern': null,
+                        'optionType': 'manual',
+                        'hasEmptyValue': true,
+                        'options': [
+                          {
+                            'id': 'empty',
+                            'name': 'Choose one...'
+                          },
+                          {
+                            'id': 'option_1',
+                            'name': '1'
+                          },
+                          {
+                            'id': 'option_2',
+                            'name': '2'
+                          },
+                          {
+                            'id': 'option_3',
+                            'name': '3'
+                          }
+                        ],
+                        'restUrl': null,
+                        'restResponsePath': null,
+                        'restIdProperty': null,
+                        'restLabelProperty': null,
+                        'tab': null,
+                        'className': null,
+                        'params': {
+                          'existingColspan': 1,
+                          'maxColspan': 2
+                        },
+                        'dateDisplayFormat': null,
+                        'layout': {
+                          'row': -1,
+                          'column': -1,
+                          'colspan': 1
+                        },
+                        'sizeX': 1,
+                        'sizeY': 1,
+                        'row': -1,
+                        'col': -1,
+                        'visibilityCondition': null,
+                        'endpoint': null,
+                        'requestHeaders': null
+                      }
+                    ],
+                    '2': []
+                  }
+                }
+              ],
+              'outcomes': [],
+              'javascriptEvents': [],
+              'className': '',
+              'style': '',
+              'customFieldTemplates': {},
+              'metadata': {},
+              'variables': [],
+              'customFieldsValueInfo': {},
+              'gridsterForm': false
+            }
+          };
+    }
+
 }

demo-shell/src/app/components/form/fake-form.service.ts

@@ -0,0 +1,54 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Observable } from 'rxjs/Observable';
+import { Injectable } from '@angular/core';
+import {
+    AppConfigService, AlfrescoApiService, EcmModelService, LogService, FormService, FormOutcomeEvent
+} from '@alfresco/adf-core';
+import { Subject } from 'rxjs/Subject';
+
+@Injectable()
+export class FakeFormService extends FormService {
+
+    executeOutcome = new Subject<FormOutcomeEvent>();
+
+    constructor(appConfig: AppConfigService,
+        ecmModelService: EcmModelService,
+        apiService: AlfrescoApiService,
+        protected logService: LogService) {
+        super(ecmModelService, apiService, logService);
+    }
+
+    public getRestFieldValues(taskId: string, fieldId: string): Observable<any> {
+        if (fieldId === 'typeahedField') {
+            return Observable.of([
+                { 'id': '1', 'name': 'Leanne Graham' },
+                { 'id': '2', 'name': 'Ervin Howell' },
+                { 'id': '3', 'name': 'Clementine Bauch' },
+                { 'id': '4', 'name': 'Patricia Lebsack' },
+                { 'id': '5', 'name': 'Chelsey Dietrich' },
+                { 'id': '6', 'name': 'Mrs. Dennis Schulist' },
+                { 'id': '7', 'name': 'Kurtis Weissnat' },
+                { 'id': '8', 'name': 'Nicholas Runolfsdottir V' },
+                { 'id': '9', 'name': 'Glenna Reichert' },
+                { 'id': '10', 'name': 'Clementina DuBuque' }]);
+        } else {
+            return super.getRestFieldValues(taskId, fieldId);
+        }
+    }
+}

demo-shell/src/app/components/form/form-list.component.html

@@ -1,7 +1,7 @@
 <adf-form-list [forms]="formList" (row-dblclick)="onRowDblClick($event)">
 </adf-form-list>
 <div class="form-container" *ngIf="!isEmptyForm()">
-    <adf-form [form]="form" [data]="restoredData">
+    <adf-form #adfForm [form]="form" [data]="restoredData">
     </adf-form>
 </div>
 <button mat-button (click)="store()" color="primary">{{'FORM-LIST.STORE' | translate }}</button>

demo-shell/src/app/components/form/form-list.component.ts

@@ -25,7 +25,7 @@ import { FormComponent, FormModel, FormService, LogService } from '@alfresco/adf
 })
 export class FormListComponent {
 
-    @ViewChild(FormComponent)
+    @ViewChild('adfForm')
     activitiForm: FormComponent;
 
     formList: any [] = [];

demo-shell/src/app/components/form/form-loading.component.html

@@ -0,0 +1,41 @@
+<div class="form-container">
+    <mat-accordion>
+        <mat-expansion-panel>
+            <mat-expansion-panel-header>
+                <mat-panel-title>
+                    {{'FORM-LOADING.FORM_DATA' | translate}}
+                </mat-panel-title>
+                <mat-panel-description>
+                    {{'FORM-LOADING.FORM_DATA_MESSAGE' | translate}}
+                </mat-panel-description>
+            </mat-expansion-panel-header>
+            <mat-list>
+                <mat-list-item>
+                    <mat-form-field>
+                        <input matInput
+                              placeholder="{{'FORM-LOADING.TYPEAHEAD_PLACEHOLDER' | translate}}"
+                              [(ngModel)]="typeaheadFieldValue">
+                    </mat-form-field>
+                </mat-list-item>
+                <mat-list-item>
+                    <mat-form-field>
+                        <input matInput
+                               placeholder="{{'FORM-LOADING.SELECT_PLACEHOLDER' | translate}}"
+                               [(ngModel)]="selectFieldValue">
+                    </mat-form-field>
+                </mat-list-item>
+                <mat-list-item>
+                    <mat-form-field>
+                        <input matInput
+                               placeholder="{{'FORM-LOADING.RADIO_PLACEHOLDER' | translate}}"
+                               [(ngModel)]="radioButtonFieldValue">
+                    </mat-form-field>
+                </mat-list-item>
+            </mat-list>
+        <button mat-button color="primary" (click)="onLoadButtonClicked()">Load</button>
+        </mat-expansion-panel>
+    </mat-accordion>
+    <mat-divider></mat-divider>
+    <adf-form [showRefreshButton]="false" [form]="form" [data]="formattedData">
+    </adf-form>
+</div>

demo-shell/src/app/components/form/form-loading.component.scss

@@ -0,0 +1,3 @@
+.form-container {
+    padding: 10px;
+}

demo-shell/src/app/components/form/form-loading.component.ts

@@ -0,0 +1,60 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Inject, OnInit } from '@angular/core';
+import { FormModel, FormService, FormOutcomeEvent } from '@alfresco/adf-core';
+import { InMemoryFormService } from '../../services/in-memory-form.service';
+import { DemoForm } from './demo-form';
+import { FakeFormService } from './fake-form.service';
+
+@Component({
+    selector: 'app-form-loading',
+    templateUrl: 'form-loading.component.html',
+    styleUrls: ['form-loading.component.scss'],
+    providers: [
+        { provide: FormService, useClass: FakeFormService },
+    ]
+})
+export class FormLoadingComponent implements OnInit {
+
+    form: FormModel;
+    typeaheadFieldValue = '';
+    selectFieldValue = '';
+    radioButtonFieldValue = '';
+    formattedData = {};
+
+    constructor(@Inject(FormService) private formService: InMemoryFormService) {
+        formService.executeOutcome.subscribe((formOutcomeEvent: FormOutcomeEvent) => {
+            formOutcomeEvent.preventDefault();
+        });
+    }
+
+    ngOnInit() {
+        this.formattedData = {};
+        const formDefinitionJSON: any = DemoForm.getSimpleFormDefinition();
+        this.form = this.formService.parseForm(formDefinitionJSON);
+    }
+
+    onLoadButtonClicked() {
+        this.formattedData = {
+                               'typeahedField': this.typeaheadFieldValue,
+                               'selectBox': this.selectFieldValue,
+                               'radioButton': this.radioButtonFieldValue
+                            };
+    }
+
+}

demo-shell/src/app/components/home/home.component.html

@@ -1,4 +1,4 @@
-<header class="adf-home-background adf-primary-background-color">
+<header class="adf-home-background">
     <div class="adf-home-section ad">
         <div class="adf-home-headline">
             <h1 class="mat-h1">ADF</h1>

demo-shell/src/app/components/home/home.component.scss

@@ -1,3 +1,9 @@
+:host {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
 .adf-home-header-background {
     overflow: hidden;
 }
@@ -8,6 +14,7 @@
 }
 
 .adf-home-headline {
+
     h1 {
         font-size: 56px;
         font-weight: 300;

demo-shell/src/app/components/log/log.component.css

@@ -0,0 +1,27 @@
+.log-list-type {
+    float: left;
+}
+
+.log-list-text {
+    float: left;
+}
+
+.log-card {
+    min-width: 200px;
+    z-index: 1;
+    height: 20%;
+    width: 40%;
+    position: fixed;
+    top: 1em;
+    right: 1em;
+    opacity: 0.9;
+    overflow: scroll;
+}
+
+.log-ERROR {
+    color: red;
+}
+
+.log-WARN {
+    color: yellow;
+}

demo-shell/src/app/components/log/log.component.html

@@ -0,0 +1,12 @@
+<mat-card class="log-card" *ngIf="show">
+    <mat-card-header>
+        <mat-card-title><h2>Log Service</h2></mat-card-title>
+    </mat-card-header>
+    <mat-card-content class="log-container">
+
+        <div *ngIf="logsData">
+            <adf-datatable [data]="logsData"></adf-datatable>
+        </div>
+
+    </mat-card-content>
+</mat-card>

demo-shell/src/app/components/log/log.component.ts

@@ -0,0 +1,52 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, HostListener } from '@angular/core';
+import { LogService, ObjectDataTableAdapter } from '@alfresco/adf-core';
+
+@Component({
+    selector: 'app-log',
+    templateUrl: './log.component.html',
+    styleUrls: ['./log.component.css']
+})
+export class LogComponent {
+    logs: any[] = [];
+    show = false;
+    ctrlLKey = 12;
+    logsData: ObjectDataTableAdapter;
+
+    constructor(public logService: LogService) {
+
+        logService.onMessage.subscribe((message) => {
+            this.logs.push({ type: message.type, text: JSON.stringify(message.text) });
+            this.logsData = new ObjectDataTableAdapter(this.logs, [
+                { type: 'text', key: 'type', title: 'Log level', sortable: true },
+                { type: 'text', key: 'text', title: 'Message', sortable: false }
+            ]);
+        });
+    }
+
+    @HostListener('document:keypress', ['$event'])
+    handleKeyboardEvent(event: KeyboardEvent) {
+        const key = event.keyCode;
+
+        if (key === this.ctrlLKey) {
+            this.show = !this.show;
+        }
+
+    }
+}

demo-shell/src/app/components/login/login.component.css

@@ -1,40 +0,0 @@
-.setting-button {
-    position: absolute;
-    right: 10px;
-    top: 10px;
-    z-index: 1;
-    background-color: rgb(68,138,255);
-    color: rgb(255,255,255);
-}
-
-.settings {
-    border-radius: 8px;
-    position: absolute;
-    background-color: papayawhip;
-    color: cadetblue;
-    left: 10px;
-    top: 10px;
-    z-index: 1;
-}
-
-.toggle {
-    width: 190px;
-    margin: 5px;
-    padding: 5px;
-}
-
-@media (min-width: 721px) {
-    .mobile-settings {
-        display: none;
-    }
-}
-
-@media (max-width: 720px) {
-    .settings {
-        display: none;
-    }
-}
-
-.settings ::ng-deep .mat-slide-toggle-thumb-container {
-    cursor: pointer;
-}

demo-shell/src/app/components/login/login.component.html

@@ -41,7 +41,7 @@
 
 <!--SETTING BUTTON-->
 
-<a mat-fab class="setting-button" data-automation-id="settings" href="" routerLink="/settings">
+<a mat-fab class="setting-button" data-automation-id="settings" href="" routerLink="/settings" color="accent">
     <mat-icon>settings</mat-icon>
 </a>
 
@@ -92,5 +92,7 @@
                 {{ 'LOGIN.LOGIN_FOOTER'| translate }}
             </mat-slide-toggle>
         </p>
+        <button type="button" mat-raised-button color="accent" class="mobile-setting-button" routerLink="/settings" data-automation-id="settings">{{ 'APP_LAYOUT.SETTINGS'| translate }}</button>
+
     </div>
 </adf-login>

demo-shell/src/app/components/login/login.component.scss

@@ -0,0 +1,52 @@
+@mixin adf-login-component-theme($theme) {
+    .setting-button.mat-fab.mat-accent {
+        position: absolute;
+        right: 10px;
+        top: 10px;
+        z-index: 1;
+
+    }
+
+    .settings {
+        border-radius: 8px;
+        position: absolute;
+        background-color: papayawhip;
+        color: cadetblue;
+        left: 10px;
+        top: 10px;
+        z-index: 1;
+    }
+
+    .toggle {
+        width: 190px;
+        margin: 5px;
+        padding: 5px;
+    }
+
+    .mobile-settings, .mobile-setting-button {
+        display: none;
+    }
+
+    @media screen and ($mat-small) {
+        .settings, .setting-button.mat-fab.mat-accent  {
+            display: none;
+        }
+
+        .mobile-settings, .mobile-setting-button {
+            display: block;
+        }
+
+        .mobile-setting-button {
+            width: 100%;
+        }
+
+        .mobile-settings {
+            padding-bottom: 20px;
+            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+        }
+    }
+
+    .settings ::ng-deep .mat-slide-toggle-thumb-container {
+        cursor: pointer;
+    }
+}

demo-shell/src/app/components/login/login.component.ts

@@ -23,7 +23,7 @@ import { LogService, StorageService } from '@alfresco/adf-core';
 @Component({
     selector: 'app-login',
     templateUrl: './login.component.html',
-    styleUrls: ['./login.component.css']
+    styleUrls: ['./login.component.scss']
 })
 export class LoginComponent implements OnInit {
 

demo-shell/src/app/components/permissions/demo-permissions.component.html

@@ -0,0 +1,12 @@
+<div class="inherit_permission_button">
+    <button mat-raised-button
+            [color]="toggleStatus?'accent':'primary'"
+            adf-inherit-permission [nodeId]="nodeId"
+            (updated)="onUpdatedPermissions($event)">
+            {{ (toggleStatus?'DEMO_PERMISSION.INHERITED_PERMISSIONS_BUTTON':'DEMO_PERMISSION.INHERIT_PERMISSION_BUTTON') | translate}}</button>
+</div>
+<div>
+	<adf-permission-list #permissionList [nodeId]="nodeId">
+	</adf-permission-list>
+</div>
+

demo-shell/src/app/components/permissions/demo-permissions.component.scss

@@ -0,0 +1,6 @@
+.inherit_permission_button {
+    padding-top: 20px;
+    display: flex;
+    justify-content: space-evenly;
+    padding-bottom: 20px;
+}

demo-shell/src/app/components/permissions/demo-permissions.component.ts

@@ -0,0 +1,59 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Component, Optional, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute, Params} from '@angular/router';
+import { PermissionListComponent } from '@alfresco/adf-content-services';
+import { MinimalNodeEntryEntity } from 'alfresco-js-api';
+import { NodesApiService } from '@alfresco/adf-core';
+
+@Component({
+    selector: 'app-permissions',
+    templateUrl: './demo-permissions.component.html',
+    styleUrls: ['./demo-permissions.component.scss']
+})
+export class DemoPermissionComponent implements OnInit {
+
+    @ViewChild('permissionList')
+    displayPermissionComponent: PermissionListComponent;
+
+    nodeId: string;
+    toggleStatus = false;
+
+    constructor(@Optional() private route: ActivatedRoute,
+                private nodeService: NodesApiService) {
+    }
+
+    ngOnInit() {
+        if (this.route) {
+            this.route.params.forEach((params: Params) => {
+                if (params['id']) {
+                    this.nodeId = params['id'];
+                }
+            });
+        }
+        this.nodeService.getNode(this.nodeId, {include: ['permissions'] }).subscribe( (currentNode: MinimalNodeEntryEntity) => {
+            this.toggleStatus = currentNode.permissions.isInheritanceEnabled;
+        });
+    }
+
+    onUpdatedPermissions(node: MinimalNodeEntryEntity) {
+        this.toggleStatus = node.permissions.isInheritanceEnabled;
+        this.displayPermissionComponent.reload();
+    }
+
+}

demo-shell/src/app/components/process-service/process-attachments.component.html

@@ -36,12 +36,3 @@
 
     </div>
 </div>
-
-<div *ngIf="fileShowed">
-    <adf-viewer
-        [(showViewer)]="fileShowed"
-        [blobFile]="content"
-        [displayName]="contentName"
-        [overlayMode]="true">
-    </adf-viewer>
-</div>

demo-shell/src/app/components/process-service/process-attachments.component.ts

@@ -19,32 +19,42 @@ import { Component, Input, OnChanges, OnInit, ViewChild } from '@angular/core';
 import { ProcessInstance, ProcessService ,
     ProcessAttachmentListComponent, ProcessUploadService } from '@alfresco/adf-process-services';
 import { UploadService } from '@alfresco/adf-core';
+import { AlfrescoApiService } from '@alfresco/adf-core';
+import { AppConfigService } from '@alfresco/adf-core';
+import { PreviewService } from '../../services/preview.service';
+
+export function processUploadServiceFactory(api: AlfrescoApiService, config: AppConfigService) {
+    return new ProcessUploadService(api, config);
+}
 
 @Component({
     selector: 'app-process-attachments',
     templateUrl: './process-attachments.component.html',
     styleUrls: ['./process-attachments.component.css'],
     providers: [
-        { provide: UploadService, useClass: ProcessUploadService }
+        {
+            provide: UploadService,
+            useFactory: (processUploadServiceFactory),
+            deps: [AlfrescoApiService, AppConfigService]
+        }
     ]
 })
 
 export class ProcessAttachmentsComponent implements OnInit, OnChanges {
 
-    @ViewChild(ProcessAttachmentListComponent)
+    @ViewChild('processAttachList')
     processAttachList: ProcessAttachmentListComponent;
 
     @Input()
     processInstanceId: string;
 
-    fileShowed = false;
-    content: Blob;
-    contentName: string;
-
     processInstance: ProcessInstance;
 
-    constructor(private uploadService: UploadService, private processService: ProcessService) {
+    constructor(
-    }
+        private uploadService: UploadService,
+        private processService: ProcessService,
+        private preview: PreviewService
+    ) {}
 
     ngOnInit() {
         this.uploadService.fileUploadComplete.subscribe(value => this.onFileUploadComplete(value.data));
@@ -64,9 +74,7 @@ export class ProcessAttachmentsComponent implements OnInit, OnChanges {
     }
 
     onAttachmentClick(content: any): void {
-        this.fileShowed = true;
+        this.preview.showBlob(content.name, content.contentBlob);
-        this.content = content.contentBlob;
-        this.contentName = content.name;
     }
 
     isCompletedProcess(): boolean {

demo-shell/src/app/components/process-service/process-service.component.html

@@ -121,6 +121,7 @@
                         <adf-accordion-group [heading]="'Processes'" [isSelected]="true" [isOpen]="true"
                                              [headingIcon]="'assessment'">
                             <adf-process-instance-filters
+                                #activitiprocessfilter
                                 [filterParam]="{index: 0}"
                                 [appId]="appId"
                                 (filterClick)="onProcessFilterClick($event)"
@@ -163,6 +164,7 @@
                 </div>
                 <div class="adf-grid-item adf-processes-details" *ngIf="!isStartProcessMode()" fxFlex.gt-md="1 1 auto">
                     <adf-process-instance-details
+                        #activitiprocessdetails
                         [processInstanceId]="currentProcessInstanceId"
                         (processCancelled)="processCancelled()"
                         (showProcessDiagram)="onShowProcessDiagram($event)"
@@ -190,6 +192,7 @@
                 <div class="adf-grid-item adf-processes-start" fxFlex.gt-md="1 1 auto"
                      *ngIf="isStartProcessMode()">
                     <adf-start-process
+                        #activitiStartProcess
                         [appId]="appId"
                         [name]="defaultProcessName"
                         [processDefinitionName]="defaultProcessDefinitionName"
@@ -230,12 +233,3 @@
         </div>
     </mat-tab>
 </mat-tab-group>
-
-<div *ngIf="fileShowed">
-    <adf-viewer
-        [(showViewer)]="fileShowed"
-        [blobFile]="content"
-        [displayName]="contentName"
-        [overlayMode]="true">
-    </adf-viewer>
-</div>

demo-shell/src/app/components/process-service/process-service.component.scss

@@ -1,105 +1,102 @@
-
+@mixin adf-process-service-component-theme($theme){
-.adf-no-form-container {
+    .adf-no-form-container {
-    text-align: center;
+        text-align: center;
-    font-weight: 600;
+        font-weight: 600;
-    font-size: 18px;
+        font-size: 18px;
-}
-
-.adf-grid {
-
-    .adf-grid-item {
-        margin: 4px;
-        box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
-        padding: 10px;
     }
 
-    .adf-list-buttons {
+    .adf-grid {
-        margin-bottom: 24px;
-    }
 
-    .adf-list-buttons-start {
+        .adf-grid-item {
-        width: 100%;
+            margin: 4px;
-    }
+            box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
-
+            padding: 10px;
-    .adf-tasks-list.small-pagination,
-    .adf-processes-list.small-pagination {
-        .adf-pagination {
-
-            flex-wrap: wrap;
-            padding-bottom: 24px;
-            padding-top: 8px;
-
-            &__block {
-                border-right: none;
-            }
-
-            &__range-block.adf-pagination__block:first-child {
-                order: 1;
-                width: 60%;
-                flex: 0 0 auto;
-                box-sizing: border-box;
-                padding-left: 2px;
-                justify-content: flex-start;
-            }
-
-            &__perpage-block {
-                order: 3;
-                width: 60%;
-                box-sizing: border-box;
-                padding-left: 2px;
-                justify-content: flex-start;
-            }
-
-            &__actualinfo-block {
-                order: 2;
-                width: 40%;
-                box-sizing: border-box;
-                padding-right: 2px;
-                justify-content: flex-end;
-            }
-
-            &__controls-block {
-                order: 4;
-                width: 40%;
-                box-sizing: border-box;
-                padding-right: 2px;
-                justify-content: flex-end;
-            }
-        }
-    }
-
-    .adf-list {
-        .adf-data-table {
-            border: none;
         }
 
-        .adf-data-table tr,
+        .adf-list-buttons {
-        .adf-data-table td {
+            margin-bottom: 24px;
-            height: 36px;
-            font-size: 14px;
         }
 
-        .adf-data-table td {
+        .adf-list-buttons-start {
-            padding-top: 0;
+            width: 100%;
-            padding-bottom: 0;
-            border-bottom: none;
         }
 
-        .adf-data-table th {
+        .adf-tasks-list.small-pagination,
-            padding-top: 0;
+        .adf-processes-list.small-pagination {
-            padding-bottom: 0;
+            .adf-pagination {
-            height: 40px;
+
-            vertical-align: middle;
+                flex-wrap: wrap;
-            font-size: 14px;
+                padding-bottom: 24px;
+                padding-top: 8px;
+
+                &__block {
+                    border-right: none;
+                }
+
+                &__range-block.adf-pagination__block:first-child {
+                    order: 1;
+                    width: 60%;
+                    flex: 0 0 auto;
+                    box-sizing: border-box;
+                    padding-left: 2px;
+                    justify-content: flex-start;
+                }
+
+                &__perpage-block {
+                    order: 3;
+                    width: 60%;
+                    box-sizing: border-box;
+                    padding-left: 2px;
+                    justify-content: flex-start;
+                }
+
+                &__actualinfo-block {
+                    order: 2;
+                    width: 40%;
+                    box-sizing: border-box;
+                    padding-right: 2px;
+                    justify-content: flex-end;
+                }
+
+                &__controls-block {
+                    order: 4;
+                    width: 40%;
+                    box-sizing: border-box;
+                    padding-right: 2px;
+                    justify-content: flex-end;
+                }
+            }
         }
-    }
 
-    @media screen and (max-width: 1279px) {
+        .adf-list {
-        container-widget .grid-list {
+            .adf-data-table {
-            flex-direction: column;
+                border: none;
+            }
 
-            .grid-list-item {
+            .adf-data-table tr,
-                width: 100% !important;
+            .adf-data-table td {
+                height: 36px;
+                font-size: 14px;
+            }
+
+            .adf-data-table td {
+                padding-top: 0;
+                padding-bottom: 0;
+                border-bottom: none;
+            }
+
+            .adf-data-table th {
+                padding-top: 0;
+                padding-bottom: 0;
+                height: 40px;
+                vertical-align: middle;
+                font-size: 14px;
+            }
+        }
+
+        @media screen and ($mat-small) {
+            container-widget .grid-list {
+                flex-direction: column;
             }
         }
     }

demo-shell/src/app/components/process-service/process-service.component.ts

@@ -63,6 +63,7 @@ import {
 import { Subscription } from 'rxjs/Subscription';
 import { /*CustomEditorComponent*/ CustomStencil01 } from './custom-editor/custom-editor.component';
 import { DemoFieldValidator } from './demo-field-validator';
+import { PreviewService } from '../../services/preview.service';
 
 const currentProcessIdNew = '__NEW__';
 const currentTaskIdNew = '__NEW__';
@@ -75,34 +76,34 @@ const currentTaskIdNew = '__NEW__';
 })
 export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit {
 
-    @ViewChild(TaskFiltersComponent)
+    @ViewChild('activitifilter')
     activitifilter: TaskFiltersComponent;
 
-    @ViewChild(PaginationComponent)
+    @ViewChild('processListPagination')
     processListPagination: PaginationComponent;
 
-    @ViewChild(PaginationComponent)
+    @ViewChild('taskListPagination')
     taskListPagination: PaginationComponent;
 
-    @ViewChild(TaskListComponent)
+    @ViewChild('taskList')
     taskList: TaskListComponent;
 
-    @ViewChild(ProcessFiltersComponent)
+    @ViewChild('activitiprocessfilter')
     activitiprocessfilter: ProcessFiltersComponent;
 
-    @ViewChild(ProcessInstanceListComponent)
+    @ViewChild('processList')
     processList: ProcessInstanceListComponent;
 
-    @ViewChild(ProcessInstanceDetailsComponent)
+    @ViewChild('activitiprocessdetails')
     activitiprocessdetails: ProcessInstanceDetailsComponent;
 
-    @ViewChild(TaskDetailsComponent)
+    @ViewChild('activitidetails')
     activitidetails: TaskDetailsComponent;
 
-    @ViewChild(StartProcessInstanceComponent)
+    @ViewChild('activitiStartProcess')
     activitiStartProcess: StartProcessInstanceComponent;
 
-    @ViewChild(AnalyticsReportListComponent)
+    @ViewChild('analyticsreportlist')
     analyticsreportlist: AnalyticsReportListComponent;
 
     @Input()
@@ -111,14 +112,10 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     @Output()
     changePageSize: EventEmitter<Pagination> = new EventEmitter();
 
-    fileShowed = false;
     selectFirstReport = false;
 
     private tabs = { tasks: 0, processes: 1, reports: 2 };
 
-    content: Blob;
-    contentName: string;
-
     layoutType: string;
     currentTaskId: string;
     currentProcessInstanceId: string;
@@ -161,6 +158,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
                 private apiService: AlfrescoApiService,
                 private logService: LogService,
                 private appConfig: AppConfigService,
+                private preview: PreviewService,
                 formRenderingService: FormRenderingService,
                 formService: FormService,
                 private preferenceService: UserPreferencesService) {
@@ -225,7 +223,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
             this.currentProcessInstanceId = null;
         });
         this.layoutType = AppsListComponent.LAYOUT_GRID;
-        this.supportedPages = this.preferenceService.getDifferentPageSizes();
+        this.supportedPages = this.preferenceService.getDefaultPageSizes();
     }
 
     ngOnDestroy() {
@@ -385,9 +383,7 @@ export class ProcessServiceComponent implements AfterViewInit, OnDestroy, OnInit
     }
 
     onContentClick(content: any): void {
-        this.fileShowed = true;
+        this.preview.showBlob(content.name, content.contentBlob);
-        this.content = content.contentBlob;
-        this.contentName = content.name;
     }
 
     onAuditClick(event: any) {

demo-shell/src/app/components/process-service/task-attachments.component.html

@@ -33,12 +33,3 @@
 
     </div>
 </div>
-
-<div *ngIf="fileShowed">
-    <adf-viewer
-        [(showViewer)]="fileShowed"
-        [blobFile]="content"
-        [displayName]="contentName"
-        [overlayMode]="true">
-    </adf-viewer>
-</div>

demo-shell/src/app/components/process-service/task-attachments.component.ts

@@ -17,33 +17,40 @@
 
 import { Component, Input, OnChanges, OnInit, ViewChild } from '@angular/core';
 import { TaskListService, TaskAttachmentListComponent, TaskDetailsModel, TaskUploadService } from '@alfresco/adf-process-services';
-import { UploadService } from '@alfresco/adf-core';
+import { UploadService, AlfrescoApiService, AppConfigService } from '@alfresco/adf-core';
+import { PreviewService } from '../../services/preview.service';
+
+export function taskUploadServiceFactory(api: AlfrescoApiService, config: AppConfigService) {
+    return new TaskUploadService(api, config);
+}
 
 @Component({
     selector: 'app-task-attachments',
     templateUrl: './task-attachments.component.html',
     styleUrls: ['./task-attachments.component.css'],
     providers: [
-        { provide: UploadService, useClass: TaskUploadService }
+        {
+            provide: UploadService,
+            useFactory: (taskUploadServiceFactory),
+            deps: [AlfrescoApiService, AppConfigService]
+        }
     ]
 })
 
 export class TaskAttachmentsComponent implements OnInit, OnChanges {
 
-    @ViewChild(TaskAttachmentListComponent)
+    @ViewChild('taskAttachList')
     taskAttachList: TaskAttachmentListComponent;
 
     @Input()
     taskId: string;
 
-    fileShowed = false;
-    content: Blob;
-    contentName: string;
-
     taskDetails: any;
 
-    constructor(private uploadService: UploadService, private activitiTaskList: TaskListService) {
+    constructor(
-    }
+        private uploadService: UploadService,
+        private activitiTaskList: TaskListService,
+        private preview: PreviewService) {}
 
     ngOnInit() {
         this.uploadService.fileUploadComplete.subscribe(value => this.onFileUploadComplete(value.data));
@@ -63,9 +70,7 @@ export class TaskAttachmentsComponent implements OnInit, OnChanges {
     }
 
     onAttachmentClick(content: any): void {
-        this.fileShowed = true;
+        this.preview.showBlob(content.name, content.contentBlob);
-        this.content = content.contentBlob;
-        this.contentName = content.name;
     }
 
     isCompletedTask(): boolean {

demo-shell/src/app/components/search/search-config-test.service.ts

@@ -23,7 +23,7 @@ export class TestSearchConfigurationService implements SearchConfigurationInterf
     constructor() {
     }
 
-    public generateQueryBody(searchTerm: string, maxResults: string, skipCount: string): QueryBody {
+    public generateQueryBody(searchTerm: string, maxResults: number, skipCount: number): QueryBody {
         const defaultQueryBody: QueryBody = {
             query: {
                 query: searchTerm ? `${searchTerm}* OR name:${searchTerm}*` : searchTerm

demo-shell/src/app/components/search/search-result.component.html

@@ -1,3 +1,4 @@
+
 <adf-search [searchTerm]="searchedWord"
             [maxResults]="maxItems"
             [skipResults]="skipCount"
@@ -5,15 +6,25 @@
             #search>
 </adf-search>
 
-<app-files-component
+<div class="adf-search-results__facets">
-        [currentFolderId]="null"
+    <adf-search-chip-list [searchFilter]="searchFilter"></adf-search-chip-list>
-        [nodeResult]="resultNodePageList"
+</div>
-        [disableDragArea]="true"
+
-        [pagination]="pagination"
+<div class="adf-search-results">
-        (changedPageSize)="onRefreshPagination($event)"
+    <adf-search-filter #searchFilter></adf-search-filter>
-        (changedPageNumber)="onRefreshPagination($event)"
+
-        (turnedNextPage)="onRefreshPagination($event)"
+    <div class="adf-search-results__content">
-        (loadNext)="onRefreshPagination($event)"
+        <app-files-component
-        (turnedPreviousPage)="onRefreshPagination($event)"
+                [currentFolderId]="null"
-        (deleteElementSuccess)="onDeleteElementSuccess($event)">
+                [nodeResult]="resultNodePageList"
-</app-files-component>
+                [disableDragArea]="true"
+                [pagination]="pagination"
+                (changedPageSize)="onRefreshPagination($event)"
+                (changedPageNumber)="onRefreshPagination($event)"
+                (turnedNextPage)="onRefreshPagination($event)"
+                (loadNext)="onRefreshPagination($event)"
+                (turnedPreviousPage)="onRefreshPagination($event)"
+                (deleteElementSuccess)="onDeleteElementSuccess($event)">
+        </app-files-component>
+    </div>
+</div>

demo-shell/src/app/components/search/search-result.component.scss

@@ -1,3 +1,21 @@
+.adf-search-results {
+    display: flex;
+    margin-left: 5px;
+
+    .adf-search-settings {
+        width: 260px;
+        border: 1px solid #eee;
+    }
+
+    &__facets {
+        margin: 5px;
+    }
+
+    &__content {
+        flex: 1;
+    }
+}
+
 div.search-results-container {
     padding: 0 20px 20px 20px;
 }

demo-shell/src/app/components/search/search-result.component.ts

@@ -18,7 +18,7 @@
 import { Component, OnInit, Optional, ViewChild } from '@angular/core';
 import { Router, ActivatedRoute, Params } from '@angular/router';
 import { NodePaging, Pagination } from 'alfresco-js-api';
-import { SearchComponent } from '@alfresco/adf-content-services';
+import { SearchComponent, SearchQueryBuilderService } from '@alfresco/adf-content-services';
 import { UserPreferencesService } from '@alfresco/adf-core';
 
 @Component({
@@ -40,14 +40,21 @@ export class SearchResultComponent implements OnInit {
 
     constructor(public router: Router,
                 private preferences: UserPreferencesService,
+                private queryBuilder: SearchQueryBuilderService,
                 @Optional() private route: ActivatedRoute) {
         this.maxItems = this.preferences.paginationSize;
+        queryBuilder.paging = {
+            maxItems: this.maxItems,
+            skipCount: 0
+        };
     }
 
     ngOnInit() {
         if (this.route) {
             this.route.params.forEach((params: Params) => {
                 this.searchedWord = params.hasOwnProperty(this.queryParamName) ? params[this.queryParamName] : null;
+                this.queryBuilder.queryFragments['queryName'] = `cm:name:'${this.searchedWord}'`;
+                this.queryBuilder.update();
             });
         }
         this.maxItems = this.preferences.paginationSize;
@@ -59,8 +66,14 @@ export class SearchResultComponent implements OnInit {
     }
 
     onRefreshPagination(pagination: Pagination) {
-         this.maxItems = pagination.maxItems;
+        this.maxItems = pagination.maxItems;
-         this.skipCount = pagination.skipCount;
+        this.skipCount = pagination.skipCount;
+
+        this.queryBuilder.paging = {
+            maxItems: pagination.maxItems,
+            skipCount: pagination.skipCount
+        };
+        this.queryBuilder.update();
     }
 
     onDeleteElementSuccess(element: any) {

demo-shell/src/app/components/tag/tag.component.ts

@@ -24,5 +24,5 @@ import { Component } from '@angular/core';
 })
 export class TagComponent {
 
-    nodeId = '74cd8a96-8a21-47e5-9b3b-a1b3e296787d';
+    nodeId = '';
 }

demo-shell/src/app/components/theme-picker/theme-picker.html

@@ -1,9 +1,9 @@
-<button mat-icon-button [mat-menu-trigger-for]="themeMenu" matTooltip="Select a theme!">
+<button data-automation-id="theme menu" mat-icon-button [mat-menu-trigger-for]="themeMenu" matTooltip="Select a theme!">
     <mat-icon>format_color_fill</mat-icon>
 </button>
 
 <mat-menu class="docs-theme-picker-menu" #themeMenu="matMenu" x-position="before">
-    <button *ngFor="let theme of themes"  mat-menu-item (click)="installTheme(theme)" >
+    <button *ngFor="let theme of themes" [attr.data-automation-id]="theme.name" mat-menu-item (click)="installTheme(theme)" >
         <mat-icon mat-list-icon [matTooltip]="theme.name" class="docs-theme-chosen-icon" [style.color]="theme.accent"
                  [style.background]="theme.primary"
                  *ngIf="currentTheme === theme">check_circle

demo-shell/src/app/components/trashcan/trashcan.component.html

@@ -92,6 +92,7 @@
 
         </adf-document-list>
         <adf-pagination [ngClass]="{ 'no-border' : documentList.isEmpty()}"
+                        [supportedPageSizes]="supportedPages"
                         [target]="documentList">
         </adf-pagination>
     </div>

demo-shell/src/app/components/trashcan/trashcan.component.ts

@@ -25,6 +25,7 @@
 
 import { Component, ViewChild } from '@angular/core';
 import { DocumentListComponent } from '@alfresco/adf-content-services';
+import { UserPreferencesService, UserPreferenceValues } from '@alfresco/adf-core';
 
 @Component({
     templateUrl: './trashcan.component.html',
@@ -32,11 +33,20 @@ import { DocumentListComponent } from '@alfresco/adf-content-services';
 })
 export class TrashcanComponent {
 
-    @ViewChild(DocumentListComponent)
+    @ViewChild('documentList')
-    documentList;
+    documentList: DocumentListComponent;
+
+    supportedPages = [];
+
+    constructor(private preference: UserPreferencesService) {
+        this.preference.select(UserPreferenceValues.SupportedPageSizes)
+        .subscribe((pages) => {
+            this.supportedPages = pages;
+        });
+    }
 
     refresh() {
-        this.documentList.loadTrashcan();
+        this.documentList.reload();
         this.documentList.resetSelection();
     }
 

demo-shell/src/app/material.module.ts

@@ -27,6 +27,7 @@ import {
     MatListModule,
     MatMenuModule,
     MatToolbarModule,
+    MatSnackBarModule,
     MatExpansionModule
 } from '@angular/material';
 
@@ -41,6 +42,7 @@ const MATERIAL_MODULES = [
     MatListModule,
     MatMenuModule,
     MatToolbarModule,
+    MatSnackBarModule,
     MatExpansionModule
 ];
 

demo-shell/src/app/services/debug-app-config.service.ts

@@ -27,11 +27,11 @@ export class DebugAppConfigService extends AppConfigService {
     }
 
     /** @override */
-    get<T>(key: string): T {
+    get<T>(key: string, defaultValue?: T): T {
         if (key === 'ecmHost' || key === 'bpmHost') {
             return <T> (<any> this.storage.getItem(key) || super.get<T>(key));
         }
-        return super.get<T>(key);
+        return super.get<T>(key, defaultValue);
     }
 
 }

demo-shell/src/app/services/preview.service.ts

@@ -0,0 +1,38 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Injectable } from '@angular/core';
+import { Router } from '@angular/router';
+
+@Injectable()
+export class PreviewService {
+
+    public content: Blob = null;
+    public name: string = null;
+
+    constructor(private router: Router) {}
+
+    showResource(resourceId): void {
+        this.router.navigate([{ outlets: { overlay: ['files', resourceId, 'view'] } }]);
+    }
+
+    showBlob(name: string, content: Blob): void {
+        this.name = name;
+        this.content = content;
+        this.router.navigate([{ outlets: { overlay: ['preview', 'blob'] } }]);
+    }
+}

demo-shell/src/custom-style-dev.scss

@@ -1,4 +1,8 @@
 @import './app/components/app-layout/app-layout.component.scss';
+@import './app/components/files/files.component.scss';
+@import './app/components/login/login.component.scss';
+@import './app/components/process-service/process-service.component.scss';
+
 
 @import 'content-services/styles/index';
 @import 'process-services/styles/index';
@@ -16,6 +20,10 @@ $theme:   mat-light-theme($primary, $accent, $warn);
 
 @include angular-material-theme($theme);
 @include adf-app-layout-theme($theme);
+@include adf-file-component-theme($theme);
+@include adf-login-component-theme($theme);
+@include adf-process-service-component-theme($theme);
+
 
 @include adf-content-services-theme($theme);
 @include adf-process-services-theme($theme);

demo-shell/src/custom-style.scss

@@ -1,4 +1,8 @@
 @import './app/components/app-layout/app-layout.component.scss';
+@import './app/components/files/files.component.scss';
+@import './app/components/login/login.component.scss';
+@import './app/components/process-service/process-service.component.scss';
+
 
 @import '~@alfresco/adf-content-services/theming';
 @import '~@alfresco/adf-process-services/theming';
@@ -16,6 +20,10 @@ $theme:   mat-light-theme($primary, $accent, $warn);
 
 @include angular-material-theme($theme);
 @include adf-app-layout-theme($theme);
+@include adf-file-component-theme($theme);
+@include adf-login-component-theme($theme);
+@include adf-process-service-component-theme($theme);
+
 
 @include adf-content-services-theme($theme);
 @include adf-process-services-theme($theme);

demo-shell/src/polyfills.ts

@@ -60,6 +60,10 @@ import 'zone.js/dist/zone';  // Included with Angular CLI.
  * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
  */
 import 'intl';  // Run `npm install --save intl`.
+/**
+ * Need to import at least one locale-data with intl.
+ */
+import 'intl/locale-data/jsonp/en';
 
 /**
  * Support custom event in IE11

demo-shell/src/tsconfig.spec.json

@@ -2,19 +2,41 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
-    "module": "commonjs",
+    "module": "es2015",
-    "target": "es5",
+    "rootDir": "..",
-    "baseUrl": "",
+    "baseUrl": ".",
+    "skipLibCheck": false,
     "types": [
       "jasmine",
       "node"
-    ]
+    ],
+    "paths": {
+      "alfresco-js-api": [
+        "../node_modules/alfresco-js-api/dist/alfresco-js-api.js"
+      ],
+      "rxjs/*": [
+        "../node_modules/rxjs/*"
+      ],
+      "@angular/*": [
+        "../node_modules/@angular/*"
+      ],
+      "@alfresco/adf-core": [
+        "../../lib/core"
+      ],
+      "@alfresco/adf-content-services": [
+        "../../lib/content-services"
+      ],
+      "@alfresco/adf-process-services": [
+        "../../lib/process-services"
+      ],
+      "@alfresco/adf-insights": [
+        "../../lib/insights"
+      ]
+    }
   },
-  "files": [
+  "exclude": [
-    "test.ts"
   ],
-  "include": [
+  "angularCompilerOptions": {
-    "**/*.spec.ts",
+    "skipTemplateCodegen": false
-    "**/*.d.ts"
+  }
-  ]
 }

demo-shell/tsconfig.json

@@ -19,5 +19,8 @@
       "es2016",
       "dom"
     ]
-  }
+  },
+  "exclude": [
+    "node_modules"
+  ]
 }

demo-shell/tslint.json

@@ -45,7 +45,6 @@
     "no-bitwise": true,
     "no-console": [
       true,
-      "log",
       "debug",
       "info",
       "time",
@@ -99,7 +98,6 @@
         "variable-declaration": "nospace"
       }
     ],
-    "typeof-compare": true,
     "unified-signatures": true,
     "variable-name": false,
     "whitespace": [

docs/README.md

@@ -16,6 +16,9 @@ that the component is complete and suitable for normal use. The other status lev
 -   **Experimental** ![](docassets/images/ExperimentalIcon.png) - The component is available for
     experimentation but not fully complete and tested for production code.
 
+There is also a set of ADF tutorials that describe how to accomplish tasks step-by-step.
+See the [Tutorials index](tutorials/README.md) for the full list.
+
 ## Contents
 
 -   [User Guide](#user-guide)
@@ -28,12 +31,12 @@ that the component is complete and suitable for normal use. The other status lev
 
 <!--guide start-->
 
--   [Angular Material Design](angular-material-design.md)
+-   [Angular Material Design](user-guide/angular-material-design.md)
--   [Form Extensibility and Customisation](extensibility.md)
+-   [Form Extensibility and Customisation](user-guide/extensibility.md)
--   [Internationalization in ADF](internationalization.md)
+-   [Internationalization in ADF](user-guide/internationalization.md)
--   [Theming](theming.md)
+-   [Theming](user-guide/theming.md)
--   [Typography](typography.md)
+-   [Typography](user-guide/typography.md)
--   [Walkthrough - adding indicators to highlight information about a node](metadata-indicators.md)
+-   [Walkthrough - adding indicators to highlight information about a node](user-guide/metadata-indicators.md)
 
 <!--guide end-->
 
@@ -52,111 +55,115 @@ for more information about installing and using the source code.
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Card view component](card-view.component.md) | Displays a configurable property list renderer. | [Source](../lib/core/card-view/components/card-view/card-view.component.ts) |
+| [Card view component](core/card-view.component.md) | Displays a configurable property list renderer. | [Source](../lib/core/card-view/components/card-view/card-view.component.ts) |
-| [Accordion group component](accordion-group.component.md) | Adds a collapsible panel to an [accordion menu](accordion.component.md). | [Source](../lib/core/collapsable/accordion-group.component.ts) |
+| [Accordion group component](core/accordion-group.component.md) | Adds a collapsible panel to an accordion menu. | [Source](../lib/core/collapsable/accordion-group.component.ts) |
-| [Accordion component](accordion.component.md) | Creates a collapsible accordion menu. | [Source](../lib/core/collapsable/accordion.component.ts) |
+| [Accordion component](core/accordion.component.md) | Creates a collapsible accordion menu. | [Source](../lib/core/collapsable/accordion.component.ts) |
-| [Data column component](data-column.component.md) | Defines column properties for DataTable, Tasklist, Document List and other components. | [Source](../lib/core/data-column/data-column.component.ts) |
+| [Comment list component](core/comment-list.component.md) | Shows a list of comments. | [Source](../lib/core/comments/comment-list.component.ts) |
-| [Datatable component](datatable.component.md) | Displays data as a table with customizable columns and presentation. | [Source](../lib/core/datatable/components/datatable/datatable.component.ts) |
+| [Comments component](core/comments.component.md) | Displays comments from users involved in a specified task or content and allows an involved user to add a comment to a task or a content. | [Source](../lib/core/comments/comments.component.ts) |
-| [Form field component](form-field.component.md) | A form field in an APS form. | [Source](../lib/core/form/components/form-field/form-field.component.ts) |
+| [Data column component](core/data-column.component.md) | Defines column properties for DataTable, Tasklist, Document List and other components. | [Source](../lib/core/data-column/data-column.component.ts) |
-| [Form list component](form-list.component.md) | Shows APS forms as a list. | [Source](../lib/core/form/components/form-list.component.ts) |
+| [Datatable component](core/datatable.component.md) | Displays data as a table with customizable columns and presentation. | [Source](../lib/core/datatable/components/datatable/datatable.component.ts) |
-| [Form component](form.component.md) | Shows a Form from APS (see it live: [Form Quickstart](https://embed.plnkr.co/YSLXTqb3DtMhVJSqXKkE/)) | [Source](../lib/core/form/components/form.component.ts) |
+| [Form field component](core/form-field.component.md) | A form field in an APS form. | [Source](../lib/core/form/components/form-field/form-field.component.ts) |
-| [Start form component](start-form.component.md) | Displays the Start Form for a process. | [Source](../lib/core/form/components/start-form.component.ts) |
+| [Form list component](core/form-list.component.md) | Shows APS forms as a list. | [Source](../lib/core/form/components/form-list.component.ts) |
-| [Text mask component](text-mask.component.md) | Implements text field input masks. | [Source](../lib/core/form/components/widgets/text/text-mask.component.ts) |
+| [Form component](core/form.component.md) | Shows a Form from APS | [Source](../lib/core/form/components/form.component.ts) |
-| [Info drawer layout component](info-drawer-layout.component.md) | Displays a sidebar-style information panel. | [Source](../lib/core/info-drawer/info-drawer-layout.component.ts) |
+| [Start form component](core/start-form.component.md) | Displays the Start Form for a process. | [Source](../lib/core/form/components/start-form.component.ts) |
-| [Info drawer component](info-drawer.component.md) | Displays a sidebar-style information panel with tabs. | [Source](../lib/core/info-drawer/info-drawer.component.ts) |
+| [Text mask component](core/text-mask.component.md) | Implements text field input masks. | [Source](../lib/core/form/components/widgets/text/text-mask.component.ts) |
-| [Language menu component](language-menu.component.md) | Displays all the languages that are present in the "app.config.json" or the default one (EN). | [Source](../lib/core/language-menu/language-menu.component.ts) |
+| [Info drawer layout component](core/info-drawer-layout.component.md) | Displays a sidebar-style information panel. | [Source](../lib/core/info-drawer/info-drawer-layout.component.ts) |
-| [Login component](login.component.md) | Authenticates to Alfresco Content Services and Alfresco Process Services. | [Source](../lib/core/login/components/login.component.ts) |
+| [Info drawer component](core/info-drawer.component.md) | Displays a sidebar-style information panel with tabs. | [Source](../lib/core/info-drawer/info-drawer.component.ts) |
-| [Infinite pagination component](infinite-pagination.component.md) | Adds "infinite" pagination to the component it is used with. | [Source](../lib/core/pagination/infinite-pagination.component.ts) |
+| [Language menu component](core/language-menu.component.md) | Displays all the languages that are present in the "app.config.json" or the default one (EN). | [Source](../lib/core/language-menu/language-menu.component.ts) |
-| [Pagination component](pagination.component.md) | Adds pagination to the component it is used with. | [Source](../lib/core/pagination/pagination.component.ts) |
+| [Login component](core/login.component.md) | Authenticates to Alfresco Content Services and Alfresco Process Services. | [Source](../lib/core/login/components/login.component.ts) |
-| [Host settings component](host-settings.component.md) | Validates the URLs for ACS and APS and saves them in the user's local storage | [Source](../lib/core/settings/host-settings.component.ts) |
+| [Infinite pagination component](core/infinite-pagination.component.md) | Adds "infinite" pagination to the component it is used with. | [Source](../lib/core/pagination/infinite-pagination.component.ts) |
-| [Sidebar action menu component](sidebar-action-menu.component.md) | Displays a sidebar-action menu information panel. | [Source](../lib/core/sidebar/sidebar-action-menu.component.ts) |
+| [Pagination component](core/pagination.component.md) | Adds pagination to the component it is used with. | [Source](../lib/core/pagination/pagination.component.ts) |
-| [Toolbar divider component](toolbar-divider.component.md) | Divides groups of elements in a Toolbar with a visual separator. | [Source](../lib/core/toolbar/toolbar-divider.component.ts) |
+| [Host settings component](core/host-settings.component.md) | Validates the URLs for ACS and APS and saves them in the user's local storage | [Source](../lib/core/settings/host-settings.component.ts) |
-| [Toolbar title component](toolbar-title.component.md) | Supplies custom HTML to be included in a Toolbar component title. | [Source](../lib/core/toolbar/toolbar-title.component.ts) |
+| [Sidebar action menu component](core/sidebar-action-menu.component.md) | Displays a sidebar-action menu information panel. | [Source](../lib/core/sidebar/sidebar-action-menu.component.ts) |
-| [Toolbar component](toolbar.component.md) | Simple container for headers, titles, actions and breadcrumbs. | [Source](../lib/core/toolbar/toolbar.component.ts) |
+| [Sidenav layout component](core/sidenav-layout.component.md) | Displays the standard three-region ADF application layout. | [Source](../lib/core/sidenav-layout/components/sidenav-layout/sidenav-layout.component.ts) |
-| [User info component](user-info.component.md) | Shows user information. | [Source](../lib/core/userinfo/components/user-info.component.ts) |
+| [Toolbar divider component](core/toolbar-divider.component.md) | Divides groups of elements in a Toolbar with a visual separator. | [Source](../lib/core/toolbar/toolbar-divider.component.ts) |
-| [Viewer component](viewer.component.md) | Displays content from an ACS repository. | [Source](../lib/core/viewer/components/viewer.component.ts) |
+| [Toolbar title component](core/toolbar-title.component.md) | Supplies custom HTML to be included in a Toolbar component title. | [Source](../lib/core/toolbar/toolbar-title.component.ts) |
+| [Toolbar component](core/toolbar.component.md) | Simple container for headers, titles, actions and breadcrumbs. | [Source](../lib/core/toolbar/toolbar.component.ts) |
+| [User info component](core/user-info.component.md) | Shows user information. | [Source](../lib/core/userinfo/components/user-info.component.ts) |
+| [Viewer component](core/viewer.component.md) | Displays content from an ACS repository. | [Source](../lib/core/viewer/components/viewer.component.ts) |
 
 ## Directives
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Context menu directive](context-menu.directive.md) | Adds a context menu to a component. | [Source](../lib/core/context-menu/context-menu.directive.ts) |
+| [Context menu directive](core/context-menu.directive.md) | Adds a context menu to a component. | [Source](../lib/core/context-menu/context-menu.directive.ts) |
-| [Highlight directive](highlight.directive.md) | Adds highlighting to selected sections of an HTML element's content. | [Source](../lib/core/directives/highlight.directive.ts) |
+| [Highlight directive](core/highlight.directive.md) | Adds highlighting to selected sections of an HTML element's content. | [Source](../lib/core/directives/highlight.directive.ts) |
-| [Logout directive](logout.directive.md) | Logs the user out when the decorated element is clicked. | [Source](../lib/core/directives/logout.directive.ts) |
+| [Logout directive](core/logout.directive.md) | Logs the user out when the decorated element is clicked. | [Source](../lib/core/directives/logout.directive.ts) |
-| [Node delete directive](node-delete.directive.md) | Deletes multiple files and folders. | [Source](../lib/core/directives/node-delete.directive.ts) |
+| [Node delete directive](core/node-delete.directive.md) | Deletes multiple files and folders. | [Source](../lib/core/directives/node-delete.directive.ts) |
-| [Node favorite directive](node-favorite.directive.md) | Selectively toggles nodes as favorite | [Source](../lib/core/directives/node-favorite.directive.ts) |
+| [Node favorite directive](core/node-favorite.directive.md) | Selectively toggles nodes as favorites. | [Source](../lib/core/directives/node-favorite.directive.ts) |
-| [Node permission directive](node-permission.directive.md) | Selectively disables an HTML element or Angular component | [Source](../lib/core/directives/node-permission.directive.ts) |
+| [Node permission directive](core/node-permission.directive.md) | Selectively disables an HTML element or Angular component | [Source](../lib/core/directives/node-permission.directive.ts) |
-| [Node restore directive](node-restore.directive.md) | Restores deleted nodes to their original location. | [Source](../lib/core/directives/node-restore.directive.ts) |
+| [Node restore directive](core/node-restore.directive.md) | Restores deleted nodes to their original location. | [Source](../lib/core/directives/node-restore.directive.ts) |
-| [Upload directive](upload.directive.md) | Allows your components or common HTML elements reacting on File drag and drop in order to upload content. | [Source](../lib/core/directives/upload.directive.ts) |
+| [Upload directive](core/upload.directive.md) | Uploads content in response to file drag and drop. | [Source](../lib/core/directives/upload.directive.ts) |
 
 ## Models
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Form field model](form-field.model.md) | Contains the value and metadata for a field of an [ADF Form](form.component.md). | [Source](../lib/core/form/components/widgets/core/form-field.model.ts) |
+| [Form field model](core/form-field.model.md) | Contains the value and metadata for a field of a Form component. | [Source](../lib/core/form/components/widgets/core/form-field.model.ts) |
-| [Comment process model](comment-process.model.md) | Represents a comment added to a Process Services task or process instance. | [Source](../lib/core/models/comment-process.model.ts) |
+| [Comment process model](core/comment-process.model.md) | Represents a comment added to a Process Services task or process instance. | [Source](../lib/core/models/comment-process.model.ts) |
-| [Product version model](product-version.model.md) | Contains version and license information classes for Alfresco products. | [Source](../lib/core/models/product-version.model.ts) |
+| [Product version model](core/product-version.model.md) | Contains version and license information classes for Alfresco products. | [Source](../lib/core/models/product-version.model.ts) |
-| [User process model](user-process.model.md) | Represents a Process Services user. | [Source](../lib/core/models/user-process.model.ts) |
+| [User process model](core/user-process.model.md) | Represents a Process Services user. | [Source](../lib/core/models/user-process.model.ts) |
-| [Bpm user model](bpm-user.model.md) | Contains information about a Process Services user. | [Source](../lib/core/userinfo/models/bpm-user.model.ts) |
+| [Bpm user model](core/bpm-user.model.md) | Contains information about a Process Services user. | [Source](../lib/core/userinfo/models/bpm-user.model.ts) |
-| [Ecm user model](ecm-user.model.md) | Contains information about a Content Services user. | [Source](../lib/core/userinfo/models/ecm-user.model.ts) |
+| [Ecm user model](core/ecm-user.model.md) | Contains information about a Content Services user. | [Source](../lib/core/userinfo/models/ecm-user.model.ts) |
 
 ## Pipes
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [File size pipe](file-size.pipe.md) | Converts a number of bytes to the equivalent in KB, MB, etc. | [Source](../lib/core/pipes/file-size.pipe.ts) |
+| [File size pipe](core/file-size.pipe.md) | Converts a number of bytes to the equivalent in KB, MB, etc. | [Source](../lib/core/pipes/file-size.pipe.ts) |
-| [Mime type icon pipe](mime-type-icon.pipe.md) | Retrieves an icon to represent a MIME type. | [Source](../lib/core/pipes/mime-type-icon.pipe.ts) |
+| [Mime type icon pipe](core/mime-type-icon.pipe.md) | Retrieves an icon to represent a MIME type. | [Source](../lib/core/pipes/mime-type-icon.pipe.ts) |
-| [Node name tooltip pipe](node-name-tooltip.pipe.md) | Formats the tooltip for a Node. | [Source](../lib/core/pipes/node-name-tooltip.pipe.ts) |
+| [Node name tooltip pipe](core/node-name-tooltip.pipe.md) | Formats the tooltip for a Node. | [Source](../lib/core/pipes/node-name-tooltip.pipe.ts) |
-| [Text highlight pipe](text-highlight.pipe.md) | Adds highlighting to words or sections of text that match a search string. | [Source](../lib/core/pipes/text-highlight.pipe.ts) |
+| [Text highlight pipe](core/text-highlight.pipe.md) | Adds highlighting to words or sections of text that match a search string. | [Source](../lib/core/pipes/text-highlight.pipe.ts) |
-| [Time ago pipe](time-ago.pipe.md) | Converts a recent past date into a number of days ago. | [Source](../lib/core/pipes/time-ago.pipe.ts) |
+| [Time ago pipe](core/time-ago.pipe.md) | Converts a recent past date into a number of days ago. | [Source](../lib/core/pipes/time-ago.pipe.ts) |
-| [User initial pipe](user-initial.pipe.md) | Takes the name fields of a UserProcessModel object and extracts and formats the initials. | [Source](../lib/core/pipes/user-initial.pipe.ts) |
+| [User initial pipe](core/user-initial.pipe.md) | Takes the name fields of a UserProcessModel object and extracts and formats the initials. | [Source](../lib/core/pipes/user-initial.pipe.ts) |
 
 ## Services
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Card view update service](card-view-update.service.md) | Reports edits and clicks within fields of a [Card View component](card-view.component.md). | [Source](../lib/core/card-view/services/card-view-update.service.ts) |
+| [Card view update service](core/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) |
-| [Activiti alfresco service](activiti-alfresco.service.md) | Gets Alfresco Repository folder content based on a Repository account configured in Alfresco Process Services (APS). | [Source](../lib/core/form/services/activiti-alfresco.service.ts) |
+| [Activiti alfresco service](core/activiti-alfresco.service.md) | Gets Alfresco Repository folder content based on a Repository account configured in Alfresco Process Services (APS). | [Source](../lib/core/form/services/activiti-alfresco.service.ts) |
-| [Form rendering service](form-rendering.service.md) | Maps an APS form field type string onto the corresponding form widget component type. | [Source](../lib/core/form/services/form-rendering.service.ts) |
+| [Form rendering service](core/form-rendering.service.md) | Maps an APS form field type string onto the corresponding form widget component type. | [Source](../lib/core/form/services/form-rendering.service.ts) |
-| [Form service](form.service.md) | Implements Process Services form methods | [Source](../lib/core/form/services/form.service.ts) |
+| [Form service](core/form.service.md) | Implements Process Services form methods | [Source](../lib/core/form/services/form.service.ts) |
-| [Node service](node.service.md) | Gets Alfresco Repository node metadata and creates nodes with metadata.  | [Source](../lib/core/form/services/node.service.ts) |
+| [Node service](core/node.service.md) | Gets Alfresco Repository node metadata and creates nodes with metadata.  | [Source](../lib/core/form/services/node.service.ts) |
-| [Process content service](process-content.service.md) | Manipulates content related to a Process Instance or Task Instance in APS. | [Source](../lib/core/form/services/process-content.service.ts) |
+| [Process content service](core/process-content.service.md) | Manipulates content related to a Process Instance or Task Instance in APS. | [Source](../lib/core/form/services/process-content.service.ts) |
-| [Alfresco api service](alfresco-api.service.md) | Provides access to initialized **AlfrescoJSApi** instance. | [Source](../lib/core/services/alfresco-api.service.ts) |
+| [Alfresco api service](core/alfresco-api.service.md) | Provides access to an initialized **AlfrescoJSApi** instance. | [Source](../lib/core/services/alfresco-api.service.ts) |
-| [Apps process service](apps-process.service.md) | Gets details of the Process Services apps that are deployed for the user. | [Source](../lib/core/services/apps-process.service.ts) |
+| [Apps process service](core/apps-process.service.md) | Gets details of the Process Services apps that are deployed for the user. | [Source](../lib/core/services/apps-process.service.ts) |
-| [Auth guard bpm service](auth-guard-bpm.service.md) | Adds authentication with Process Services to a route within the app. | [Source](../lib/core/services/auth-guard-bpm.service.ts) |
+| [Auth guard bpm service](core/auth-guard-bpm.service.md) | Adds authentication with Process Services to a route within the app. | [Source](../lib/core/services/auth-guard-bpm.service.ts) |
-| [Auth guard ecm service](auth-guard-ecm.service.md) | Adds authentication with Content Services to a route within the app. | [Source](../lib/core/services/auth-guard-ecm.service.ts) |
+| [Auth guard ecm service](core/auth-guard-ecm.service.md) | Adds authentication with Content Services to a route within the app. | [Source](../lib/core/services/auth-guard-ecm.service.ts) |
-| [Auth guard service](auth-guard.service.md) | Adds authentication to a route within the app. | [Source](../lib/core/services/auth-guard.service.ts) |
+| [Auth guard service](core/auth-guard.service.md) | Adds authentication to a route within the app. | [Source](../lib/core/services/auth-guard.service.ts) |
-| [Authentication service](authentication.service.md) | Provides authentication for use with the Login component. | [Source](../lib/core/services/authentication.service.ts) |
+| [Authentication service](core/authentication.service.md) | Provides authentication to ACS and APS. | [Source](../lib/core/services/authentication.service.ts) |
-| [Comment process service](comment-process.service.md) | Adds and retrieves comments for task and process instances in Process Services. | [Source](../lib/core/services/comment-process.service.ts) |
+| [Comment content service](core/comment-content.service.md) | Adds and retrieves comments for nodes in Content Services. | [Source](../lib/core/services/comment-content.service.ts) |
-| [Content service](content.service.md) | Accesses app-generated data objects via URLs and file downloads. | [Source](../lib/core/services/content.service.ts) |
+| [Comment process service](core/comment-process.service.md) | Adds and retrieves comments for task and process instances in Process Services. | [Source](../lib/core/services/comment-process.service.ts) |
-| [Cookie service](cookie.service.md) | Stores key-value data items as browser cookies. | [Source](../lib/core/services/cookie.service.ts) |
+| [Content service](core/content.service.md) | Accesses app-generated data objects via URLs and file downloads. | [Source](../lib/core/services/content.service.ts) |
-| [Deleted nodes api service](deleted-nodes-api.service.md) | Gets a list of Content Services nodes currently in the trash. | [Source](../lib/core/services/deleted-nodes-api.service.ts) |
+| [Cookie service](core/cookie.service.md) | Stores key-value data items as browser cookies. | [Source](../lib/core/services/cookie.service.ts) |
-| [Discovery api service](discovery-api.service.md) | Gets version and license information for Process Services and Content Services. | [Source](../lib/core/services/discovery-api.service.ts) |
+| [Deleted nodes api service](core/deleted-nodes-api.service.md) | Gets a list of Content Services nodes currently in the trash. | [Source](../lib/core/services/deleted-nodes-api.service.ts) |
-| [Favorites api service](favorites-api.service.md) | Gets a list of items a user has marked as their favorites. | [Source](../lib/core/services/favorites-api.service.ts) |
+| [Discovery api service](core/discovery-api.service.md) | Gets version and license information for Process Services and Content Services. | [Source](../lib/core/services/discovery-api.service.ts) |
-| [Highlight transform service](highlight-transform.service.md) | Adds HTML to a string to highlight chosen sections. | [Source](../lib/core/services/highlight-transform.service.ts) |
+| [Favorites api service](core/favorites-api.service.md) | Gets a list of items a user has marked as their favorites. | [Source](../lib/core/services/favorites-api.service.ts) |
-| [Log service](log.service.md) | Provide a log functionality for your ADF application. | [Source](../lib/core/services/log.service.ts) |
+| [Highlight transform service](core/highlight-transform.service.md) | Adds HTML to a string to highlight chosen sections. | [Source](../lib/core/services/highlight-transform.service.ts) |
-| [Nodes api service](nodes-api.service.md) | Accesses and manipulates ACS document nodes using their node IDs. | [Source](../lib/core/services/nodes-api.service.ts) |
+| [Log service](core/log.service.md) | Provide a log functionality for your ADF application. | [Source](../lib/core/services/log.service.ts) |
-| [Notification service](notification.service.md) | Shows a notification message with optional feedback. | [Source](../lib/core/services/notification.service.ts) |
+| [Nodes api service](core/nodes-api.service.md) | Accesses and manipulates ACS document nodes using their node IDs. | [Source](../lib/core/services/nodes-api.service.ts) |
-| [Page title service](page-title.service.md) | Sets the page title. | [Source](../lib/core/services/page-title.service.ts) |
+| [Notification service](core/notification.service.md) | Shows a notification message with optional feedback. | [Source](../lib/core/services/notification.service.ts) |
-| [People content service](people-content.service.md) | Gets information about a Content Services user. | [Source](../lib/core/services/people-content.service.ts) |
+| [Page title service](core/page-title.service.md) | Sets the page title. | [Source](../lib/core/services/page-title.service.ts) |
-| [People process service](people-process.service.md) | Gets information about Process Services users. | [Source](../lib/core/services/people-process.service.ts) |
+| [People content service](core/people-content.service.md) | Gets information about a Content Services user.   | [Source](../lib/core/services/people-content.service.ts) |
-| [Renditions service](renditions.service.md) ![Deprecated](docassets/images/DeprecatedIcon.png) | Manages prearranged conversions of content to different formats. | [Source](../lib/core/services/renditions.service.ts) |
+| [People process service](core/people-process.service.md) | Gets information about Process Services users. | [Source](../lib/core/services/people-process.service.ts) |
-| [Search configuration service](search-configuration.service.md) | Provides fine control of parameters to a search. | [Source](../lib/core/services/search-configuration.service.ts) |
+| [Renditions service](core/renditions.service.md) ![Deprecated](docassets/images/DeprecatedIcon.png) | Manages prearranged conversions of content to different formats. | [Source](../lib/core/services/renditions.service.ts) |
-| [Shared links api service](shared-links-api.service.md) | Finds shared links to Content Services items. | [Source](../lib/core/services/shared-links-api.service.ts) |
+| [Search configuration service](core/search-configuration.service.md) | Provides fine control of parameters to a search. | [Source](../lib/core/services/search-configuration.service.ts) |
-| [Sites service](sites.service.md) | Accesses and manipulates sites from a Content Services repository. | [Source](../lib/core/services/sites.service.ts) |
+| [Shared links api service](core/shared-links-api.service.md) | Finds shared links to Content Services items. | [Source](../lib/core/services/shared-links-api.service.ts) |
-| [Storage service](storage.service.md) | Stores items in the form of key-value pairs. | [Source](../lib/core/services/storage.service.ts) |
+| [Sites service](core/sites.service.md) | Accesses and manipulates sites from a Content Services repository. | [Source](../lib/core/services/sites.service.ts) |
-| [Thumbnail service](thumbnail.service.md) | Retrieves an SVG thumbnail image to represent a document type. | [Source](../lib/core/services/thumbnail.service.ts) |
+| [Storage service](core/storage.service.md) | Stores items in the form of key-value pairs. | [Source](../lib/core/services/storage.service.ts) |
-| [Translation service](translation.service.md) | Supports localisation. | [Source](../lib/core/services/translation.service.ts) |
+| [Thumbnail service](core/thumbnail.service.md) | Retrieves an SVG thumbnail image to represent a document type. | [Source](../lib/core/services/thumbnail.service.ts) |
-| [Upload service](upload.service.md) | Provides access to various APIs related to file upload features. | [Source](../lib/core/services/upload.service.ts) |
+| [Translation service](core/translation.service.md) | Supports localisation. | [Source](../lib/core/services/translation.service.ts) |
-| [User preferences service](user-preferences.service.md) | Stores preferences for components. | [Source](../lib/core/services/user-preferences.service.ts) |
+| [Upload service](core/upload.service.md) | Provides access to various APIs related to file upload features. | [Source](../lib/core/services/upload.service.ts) |
-| [Bpm user service](bpm-user.service.md) | Gets information about the current Process Services user. | [Source](../lib/core/userinfo/services/bpm-user.service.ts) |
+| [User preferences service](core/user-preferences.service.md) | Stores preferences for components. | [Source](../lib/core/services/user-preferences.service.ts) |
-| [Ecm user service](ecm-user.service.md) | Gets information about a Content Services user. | [Source](../lib/core/userinfo/services/ecm-user.service.ts) |
+| [Bpm user service](core/bpm-user.service.md) | Gets information about the current Process Services user. | [Source](../lib/core/userinfo/services/bpm-user.service.ts) |
+| [Ecm user service](core/ecm-user.service.md) | Gets information about a Content Services user. | [Source](../lib/core/userinfo/services/ecm-user.service.ts) |
 
 ## Widgets
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Content widget](content.widget.md) | Shows the content preview. | [Source](../lib/core/form/components/widgets/content/content.widget.ts) |
+| [Content widget](core/content.widget.md) | Shows the content preview. | [Source](../lib/core/form/components/widgets/content/content.widget.ts) |
 
 <!--core end-->
 
@@ -164,9 +171,9 @@ for more information about installing and using the source code.
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Data Table Adapter interface](datatable-adapter.interface.md) | Defines how table data is supplied to [DataTable](datatable.component.md) and [Tasklist](task-list.component.md) components. | [Source](../lib/core/datatable/data/datatable-adapter.ts) |
+| [Data Table Adapter interface](core/datatable-adapter.interface.md) | Defines how table data is supplied to DataTable and Tasklist components. | [Source](../lib/core/datatable/data/datatable-adapter.ts) |
-| [Form Field Validator interface](form-field-validator.interface.md) | Defines how the input fields of [ADF Form](form.component.md) and [ADF Task Details](task-details.component.md) components are validated. | [Source](../lib/core/form/components/widgets/core/form-field-validator.ts) |
+| [Form Field Validator interface](core/form-field-validator.interface.md) | Defines how the input fields of Form and Task Details components are validated. | [Source](../lib/core/form/components/widgets/core/form-field-validator.ts) |
-| [Search Configuration interface](search-configuration.interface.md) | Provides fine control of parameters to a search. | [Source](../lib/core/services/search-configuration.service.ts) |
+| [Search Configuration interface](core/search-configuration.interface.md) | Provides fine control of parameters to a search. | [Source](../lib/core/services/search-configuration.service.ts) |
 
 [(Back to Contents)](#contents)
 
@@ -183,54 +190,64 @@ for more information about installing and using the source code.
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Breadcrumb component](breadcrumb.component.md) | Indicates the current position within a navigation hierarchy. | [Source](../lib/content-services/breadcrumb/breadcrumb.component.ts) |
+| [Breadcrumb component](content-services/breadcrumb.component.md) | Indicates the current position within a navigation hierarchy. | [Source](../lib/content-services/breadcrumb/breadcrumb.component.ts) |
-| [Dropdown breadcrumb component](dropdown-breadcrumb.component.md) | Indicates the current position within a navigation hierarchy using a dropdown menu. | [Source](../lib/content-services/breadcrumb/dropdown-breadcrumb.component.ts) |
+| [Dropdown breadcrumb component](content-services/dropdown-breadcrumb.component.md) | Indicates the current position within a navigation hierarchy using a dropdown menu. | [Source](../lib/content-services/breadcrumb/dropdown-breadcrumb.component.ts) |
-| [Content metadata component](content-metadata.component.md) | Allows a user to display and edit metadata related to a node. | [Source](../lib/content-services/content-metadata/components/content-metadata/content-metadata.component.ts) |
+| [Content metadata component](content-services/content-metadata.component.md) | Displays and edits metadata related to a node. | [Source](../lib/content-services/content-metadata/components/content-metadata/content-metadata.component.ts) |
-| [Content node selector panel component](content-node-selector-panel.component.md) | Opens a [Content Node Selector](content-node-selector.component.md) in its own dialog window. | [Source](../lib/content-services/content-node-selector/content-node-selector-panel.component.ts) |
+| [Content node selector panel component](content-services/content-node-selector-panel.component.md) | Opens a Content Node Selector in its own dialog window. | [Source](../lib/content-services/content-node-selector/content-node-selector-panel.component.ts) |
-| [Content node selector component](content-node-selector.component.md) | Allows a user to select items from a Content Services repository. | [Source](../lib/content-services/content-node-selector/content-node-selector.component.ts) |
+| [Content node selector component](content-services/content-node-selector.component.md) | Allows a user to select items from a Content Services repository. | [Source](../lib/content-services/content-node-selector/content-node-selector.component.ts) |
-| [Content action component](content-action.component.md) | Adds options to a Document List actions menu for a particular content type. | [Source](../lib/content-services/document-list/components/content-action/content-action.component.ts) |
+| [Content action component](content-services/content-action.component.md) | Adds options to a Document List actions menu for a particular content type. | [Source](../lib/content-services/document-list/components/content-action/content-action.component.ts) |
-| [Document list component](document-list.component.md) | Displays the documents from a repository. | [Source](../lib/content-services/document-list/components/document-list.component.ts) |
+| [Document list component](content-services/document-list.component.md) | Displays the documents from a repository. | [Source](../lib/content-services/document-list/components/document-list.component.ts) |
-| [Search control component](search-control.component.md) | Displays a input text which shows find-as-you-type suggestions. | [Source](../lib/content-services/search/components/search-control.component.ts) |
+| [Permission list component](content-services/permission-list.component.md) | Shows node permissions as a table. | [Source](../lib/content-services/permission-manager/components/permission-list/permission-list.component.ts) |
-| [Search component](search.component.md) | Searches items for supplied search terms.  | [Source](../lib/content-services/search/components/search.component.ts) |
+| [Search chip list component](content-services/search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../lib/content-services/search/components/search-chip-list/search-chip-list.component.ts) |
-| [Sites dropdown component](sites-dropdown.component.md) | Displays a dropdown menu to show and interact with the sites of the current user. | [Source](../lib/content-services/site-dropdown/sites-dropdown.component.ts) |
+| [Search control component](content-services/search-control.component.md) | Displays a input text which shows find-as-you-type suggestions. | [Source](../lib/content-services/search/components/search-control.component.ts) |
-| [Like component](like.component.md) | Allows a user to add "likes" to an item. | [Source](../lib/content-services/social/like.component.ts) |
+| [Search filter component](content-services/search-filter.component.md) | Represents a main container component for custom search and faceted search settings. | [Source](../lib/content-services/search/components/search-filter/search-filter.component.ts) |
-| [Rating component](rating.component.md) | Allows a user to add ratings to an item. | [Source](../lib/content-services/social/rating.component.ts) |
+| [Search component](content-services/search.component.md) | Searches items for supplied search terms.  | [Source](../lib/content-services/search/components/search.component.ts) |
-| [Tag actions component](tag-actions.component.md) | Shows available actions for tags. | [Source](../lib/content-services/tag/tag-actions.component.ts) |
+| [Sites dropdown component](content-services/sites-dropdown.component.md) | Displays a dropdown menu to show and interact with the sites of the current user. | [Source](../lib/content-services/site-dropdown/sites-dropdown.component.ts) |
-| [Tag list component](tag-list.component.md) | Shows tags for an item. | [Source](../lib/content-services/tag/tag-list.component.ts) |
+| [Like component](content-services/like.component.md) | Allows a user to add "likes" to an item. | [Source](../lib/content-services/social/like.component.ts) |
-| [Tag node list component](tag-node-list.component.md) | Shows tags for a node. | [Source](../lib/content-services/tag/tag-node-list.component.ts) |
+| [Rating component](content-services/rating.component.md) | Allows a user to add ratings to an item. | [Source](../lib/content-services/social/rating.component.ts) |
-| [File uploading dialog component](file-uploading-dialog.component.md) | Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components. | [Source](../lib/content-services/upload/components/file-uploading-dialog.component.ts) |
+| [Tag actions component](content-services/tag-actions.component.md) | Shows available actions for tags. | [Source](../lib/content-services/tag/tag-actions.component.ts) |
-| [Upload button component](upload-button.component.md) | Activates a file upload. | [Source](../lib/content-services/upload/components/upload-button.component.ts) |
+| [Tag list component](content-services/tag-list.component.md) | Shows tags for an item. | [Source](../lib/content-services/tag/tag-list.component.ts) |
-| [Upload drag area component](upload-drag-area.component.md) | Adds a drag and drop area to upload files to Alfresco. | [Source](../lib/content-services/upload/components/upload-drag-area.component.ts) |
+| [Tag node list component](content-services/tag-node-list.component.md) | Shows tags for a node. | [Source](../lib/content-services/tag/tag-node-list.component.ts) |
-| [Version list component](version-list.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node in a [Version Manager component](version-manager.component.md) | [Source](../lib/content-services/version-manager/version-list.component.ts) |
+| [File uploading dialog component](content-services/file-uploading-dialog.component.md) | Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components. | [Source](../lib/content-services/upload/components/file-uploading-dialog.component.ts) |
-| [Version manager component](version-manager.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node with the ability to upload a new version. | [Source](../lib/content-services/version-manager/version-manager.component.ts) |
+| [Upload button component](content-services/upload-button.component.md) | Activates a file upload. | [Source](../lib/content-services/upload/components/upload-button.component.ts) |
-| [Webscript component](webscript.component.md) | Provides access to Webscript features. | [Source](../lib/content-services/webscript/webscript.component.ts) |
+| [Upload drag area component](content-services/upload-drag-area.component.md) | Adds a drag and drop area to upload files to ACS. | [Source](../lib/content-services/upload/components/upload-drag-area.component.ts) |
+| [Upload version button component](content-services/upload-version-button.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Activates a file version upload. | [Source](../lib/content-services/upload/components/upload-version-button.component.ts) |
+| [Version list component](content-services/version-list.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node in a Version Manager component | [Source](../lib/content-services/version-manager/version-list.component.ts) |
+| [Version manager component](content-services/version-manager.component.md) ![Experimental](docassets/images/ExperimentalIcon.png) | Displays the version history of a node with the ability to upload a new version. | [Source](../lib/content-services/version-manager/version-manager.component.ts) |
+| [Webscript component](content-services/webscript.component.md) | Provides access to Webscript features. | [Source](../lib/content-services/webscript/webscript.component.ts) |
 
 ## Directives
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Node download directive](node-download.directive.md) | Allows folders and/or files to be downloaded. Multiple nodes are packed as a '.ZIP' archive. | [Source](../lib/content-services/directives/node-download.directive.ts) |
+| [Node download directive](content-services/node-download.directive.md) | Allows folders and/or files to be downloaded, with multiple nodes packed as a '.ZIP' archive. | [Source](../lib/content-services/directives/node-download.directive.ts) |
-| [Folder create directive](folder-create.directive.md) | Allows folders to be created. | [Source](../lib/content-services/folder-directive/folder-create.directive.ts) |
+| [Node lock directive](content-services/node-lock.directive.md) | Locks a node. | [Source](../lib/content-services/directives/node-lock.directive.ts) |
-| [Folder edit directive](folder-edit.directive.md) | Allows folders to be edited. | [Source](../lib/content-services/folder-directive/folder-edit.directive.ts) |
+| [Node share directive](content-services/node-share.directive.md) | Creates and manages public shared links for files. | [Source](../lib/content-services/directives/node-share.directive.ts) |
-| [File draggable directive](file-draggable.directive.md) | Provide drag-and-drop features for an element such as a `div`. | [Source](../lib/content-services/upload/directives/file-draggable.directive.ts) |
+| [Folder create directive](content-services/folder-create.directive.md) | Creates folders. | [Source](../lib/content-services/folder-directive/folder-create.directive.ts) |
+| [Folder edit directive](content-services/folder-edit.directive.md) | Allows folders to be edited. | [Source](../lib/content-services/folder-directive/folder-edit.directive.ts) |
+| [Inherited button directive](content-services/inherited-button.directive.md) | Update the current node by adding/removing the inherited permissions. | [Source](../lib/content-services/permission-manager/components/inherited-button.directive.ts) |
+| [File draggable directive](content-services/file-draggable.directive.md) | Provides drag-and-drop features for an element such as a `div`. | [Source](../lib/content-services/upload/directives/file-draggable.directive.ts) |
 
 ## Models
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Document library model](document-library.model.md) | Defines classes for use with the Content Services node API. | [Source](../lib/content-services/document-list/models/document-library.model.ts) |
+| [Document library model](content-services/document-library.model.md) | Defines classes for use with the Content Services node API. | [Source](../lib/content-services/document-list/models/document-library.model.ts) |
-| [Permissions style model](permissions-style.model.md) | Sets custom CSS styles for rows of a [Document List](document-list.component.md) according to the item's permissions. | [Source](../lib/content-services/document-list/models/permissions-style.model.ts) |
+| [Permissions style model](content-services/permissions-style.model.md) | Sets custom CSS styles for rows of a Document List according to the item's permissions. | [Source](../lib/content-services/document-list/models/permissions-style.model.ts) |
 
 ## Services
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Content node dialog service](content-node-dialog.service.md) | Displays and manages dialogs for selecting content to open, copy or upload. | [Source](../lib/content-services/content-node-selector/content-node-dialog.service.ts) |
+| [Content node dialog service](content-services/content-node-dialog.service.md) | Displays and manages dialogs for selecting content to open, copy or upload. | [Source](../lib/content-services/content-node-selector/content-node-dialog.service.ts) |
-| [Document actions service](document-actions.service.md) | Implements the document menu actions for the Document List component. | [Source](../lib/content-services/document-list/services/document-actions.service.ts) |
+| [Custom resources service](content-services/custom-resources.service.md) | Manages Document List information that is specific to a user. | [Source](../lib/content-services/document-list/services/custom-resources.service.ts) |
-| [Document list service](document-list.service.md) | Implements node operations used by the Document List component. | [Source](../lib/content-services/document-list/services/document-list.service.ts) |
+| [Document actions service](content-services/document-actions.service.md) | Implements the document menu actions for the Document List component. | [Source](../lib/content-services/document-list/services/document-actions.service.ts) |
-| [Folder actions service](folder-actions.service.md) | Implements the folder menu actions for the Document List component. | [Source](../lib/content-services/document-list/services/folder-actions.service.ts) |
+| [Document list service](content-services/document-list.service.md) | Implements node operations used by the Document List component. | [Source](../lib/content-services/document-list/services/document-list.service.ts) |
-| [Rating service](rating.service.md) | Manages ratings for items in Content Services. | [Source](../lib/content-services/social/services/rating.service.ts) |
+| [Folder actions service](content-services/folder-actions.service.md) | Implements the folder menu actions for the Document List component. | [Source](../lib/content-services/document-list/services/folder-actions.service.ts) |
-| [Tag service](tag.service.md) | Manages tags in Content Services. | [Source](../lib/content-services/tag/services/tag.service.ts) |
+| [Node permission service](content-services/node-permission.service.md) | Manages the role permissions for the content nodes | [Source](../lib/content-services/permission-manager/services/node-permission.service.ts) |
+| [Search query builder service](content-services/search-query-builder.service.md) | Stores information from all the custom search and faceted search widgets, compiles and runs the final Search query. | [Source](../lib/content-services/search/search-query-builder.service.ts) |
+| [Rating service](content-services/rating.service.md) | Manages ratings for items in Content Services. | [Source](../lib/content-services/social/services/rating.service.ts) |
+| [Tag service](content-services/tag.service.md) | Manages tags in Content Services. | [Source](../lib/content-services/tag/services/tag.service.ts) |
 
 <!--content-services end-->
 
@@ -249,52 +266,51 @@ for more information about installing and using the source code.
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Apps list component](apps-list.component.md) | Shows all available apps. | [Source](../lib/process-services/app-list/apps-list.component.ts) |
+| [Apps list component](process-services/apps-list.component.md) | Shows all available apps. | [Source](../lib/process-services/app-list/apps-list.component.ts) |
-| [Create process attachment component](create-process-attachment.component.md) | Displays 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 process attachment component](process-services/create-process-attachment.component.md) | Displays 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](create-task-attachment.component.md) | Displays Upload Component (Drag and Click) to upload the attachment to a specified task | [Source](../lib/process-services/attachment/create-task-attachment.component.ts) |
+| [Create task attachment component](process-services/create-task-attachment.component.md) | Displays Upload Component (Drag and Click) to upload the attachment to a specified task | [Source](../lib/process-services/attachment/create-task-attachment.component.ts) |
-| [Process attachment list component](process-attachment-list.component.md) | Displays attached documents on a specified process instance | [Source](../lib/process-services/attachment/process-attachment-list.component.ts) |
+| [Process attachment list component](process-services/process-attachment-list.component.md) | Displays attached documents on a specified process instance | [Source](../lib/process-services/attachment/process-attachment-list.component.ts) |
-| [Task attachment list component](task-attachment-list.component.md) | Displays attached documents on a specified task. | [Source](../lib/process-services/attachment/task-attachment-list.component.ts) |
+| [Task attachment list component](process-services/task-attachment-list.component.md) | Displays attached documents on a specified task. | [Source](../lib/process-services/attachment/task-attachment-list.component.ts) |
-| [Comment list component](comment-list.component.md) | Shows a list of comments. | [Source](../lib/process-services/comments/comment-list.component.ts) |
+| [People component](process-services/people.component.md) | Displays users involved with a specified task | [Source](../lib/process-services/people/components/people/people.component.ts) |
-| [Comments component](comments.component.md) | Displays comments from users involved in a specified task and allows an involved user to add a comment to the task. | [Source](../lib/process-services/comments/comments.component.ts) |
+| [People list component](process-services/people-list.component.md) | Shows a list of users (people). | [Source](../lib/process-services/people/components/people-list/people-list.component.ts) |
-| [Process comments component](process-comments.component.md) | Displays comments associated with a particular process instance and allows the user to add new comments. | [Source](../lib/process-services/comments/process-comments.component.ts) |
+| [People search component](process-services/people-search.component.md) | Searches users/people. | [Source](../lib/process-services/people/components/people-search/people-search.component.ts) |
-| [People component](people.component.md) | Displays users involved with a specified task | [Source](../lib/process-services/people/components/people/people.component.ts) |
+| [Process comments component](process-services/process-comments.component.md) | Displays comments associated with a particular process instance and allows the user to add new comments. | [Source](../lib/process-services/process-comments/process-comments.component.ts) |
-| [People list component](people-list.component.md) | Shows a list of users (people). | [Source](../lib/process-services/people/components/people-list/people-list.component.ts) |
+| [Process filters component](process-services/process-filters.component.md) | Collection of criteria used to filter process instances, which may be customized by users. | [Source](../lib/process-services/process-list/components/process-filters.component.ts) |
-| [People search component](people-search.component.md) | Searches users/people. | [Source](../lib/process-services/people/components/people-search/people-search.component.ts) |
+| [Process instance details component](process-services/process-instance-details.component.md) | Displays detailed information on a specified process instance | [Source](../lib/process-services/process-list/components/process-instance-details.component.ts) |
-| [Process filters component](process-filters.component.md) | Collection of criteria used to filter process instances, which may be customized by users. | [Source](../lib/process-services/process-list/components/process-filters.component.ts) |
+| [Process instance header component](process-services/process-instance-header.component.md) | Sub-component of the process details component, which renders some general information about the selected process. | [Source](../lib/process-services/process-list/components/process-instance-header.component.ts) |
-| [Process instance details component](process-instance-details.component.md) | Displays detailed information on a specified process instance | [Source](../lib/process-services/process-list/components/process-instance-details.component.ts) |
+| [Process instance tasks component](process-services/process-instance-tasks.component.md) | Lists both the active and completed tasks associated with a particular process instance | [Source](../lib/process-services/process-list/components/process-instance-tasks.component.ts) |
-| [Process instance header component](process-instance-header.component.md) | Sub-component of the process details component, which renders some general information about the selected process. | [Source](../lib/process-services/process-list/components/process-instance-header.component.ts) |
+| [Process list component](process-services/process-list.component.md) | Renders a list containing all the process instances matched by the parameters specified. | [Source](../lib/process-services/process-list/components/process-list.component.ts) |
-| [Process instance tasks component](process-instance-tasks.component.md) | Lists both the active and completed tasks associated with a particular process instance | [Source](../lib/process-services/process-list/components/process-instance-tasks.component.ts) |
+| [Start process component](process-services/start-process.component.md) | Starts a process. | [Source](../lib/process-services/process-list/components/start-process.component.ts) |
-| [Process list component](process-list.component.md) | Renders a list containing all the process instances matched by the parameters specified. | [Source](../lib/process-services/process-list/components/process-list.component.ts) |
+| [Checklist component](process-services/checklist.component.md) | Shows the checklist task functionality. | [Source](../lib/process-services/task-list/components/checklist.component.ts) |
-| [Start process component](start-process.component.md) | Starts a process. | [Source](../lib/process-services/process-list/components/start-process.component.ts) |
+| [Start task component](process-services/start-task.component.md) | Creates/Starts new task for the specified app | [Source](../lib/process-services/task-list/components/start-task.component.ts) |
-| [Checklist component](checklist.component.md) | Shows the checklist task functionality. | [Source](../lib/process-services/task-list/components/checklist.component.ts) |
+| [Task details component](process-services/task-details.component.md) | Shows the details of the task ID passed in as input. | [Source](../lib/process-services/task-list/components/task-details.component.ts) |
-| [Start task component](start-task.component.md) | Creates/Starts new task for the specified app | [Source](../lib/process-services/task-list/components/start-task.component.ts) |
+| [Task filters component](process-services/task-filters.component.md) | Shows all available filters. | [Source](../lib/process-services/task-list/components/task-filters.component.ts) |
-| [Task details component](task-details.component.md) | Shows the details of the task id passed in input | [Source](../lib/process-services/task-list/components/task-details.component.ts) |
+| [Task header component](process-services/task-header.component.md) | Shows all the information related to a task. | [Source](../lib/process-services/task-list/components/task-header.component.ts) |
-| [Task filters component](task-filters.component.md) | Shows all available filters. | [Source](../lib/process-services/task-list/components/task-filters.component.ts) |
+| [Task list component](process-services/task-list.component.md) | Renders a list containing all the tasks matched by the parameters specified. | [Source](../lib/process-services/task-list/components/task-list.component.ts) |
-| [Task header component](task-header.component.md) | Shows all the information related to a task. | [Source](../lib/process-services/task-list/components/task-header.component.ts) |
+| [Task standalone component](process-services/task-standalone.component.md) | This component can be used when there is no form attached to a task. | [Source](../lib/process-services/task-list/components/task-standalone.component.ts) |
-| [Task list component](task-list.component.md) | Renders a list containing all the tasks matched by the parameters specified. | [Source](../lib/process-services/task-list/components/task-list.component.ts) |
 
 ## Directives
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Process audit directive](process-audit.directive.md) | Fetches the Process Audit information in the pdf or json format. | [Source](../lib/process-services/process-list/components/process-audit.directive.ts) |
+| [Process audit directive](process-services/process-audit.directive.md) | Fetches the Process Audit information the PDF or JSON format. | [Source](../lib/process-services/process-list/components/process-audit.directive.ts) |
-| [Task audit directive](task-audit.directive.md) | Fetches the Task Audit information in the pdf or json format. | [Source](../lib/process-services/task-list/components/task-audit.directive.ts) |
+| [Task audit directive](process-services/task-audit.directive.md) | Fetches the Task Audit information in PDF or JSON format. | [Source](../lib/process-services/task-list/components/task-audit.directive.ts) |
 
 ## Models
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Filter model](filter.model.md) | Contains classes related to filters in Process Services. | [Source](../lib/process-services/task-list/models/filter.model.ts) |
+| [Filter model](process-services/filter.model.md) | Contains classes related to filters in Process Services. | [Source](../lib/process-services/task-list/models/filter.model.ts) |
-| [Task details model](task-details.model.md) | Information about a task. | [Source](../lib/process-services/task-list/models/task-details.model.ts) |
+| [Task details model](process-services/task-details.model.md) | Information about a task. | [Source](../lib/process-services/task-list/models/task-details.model.ts) |
 
 ## Services
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Process filter service](process-filter.service.md) | Manage Process Filters, which are pre-configured Process Instance queries.  | [Source](../lib/process-services/process-list/services/process-filter.service.ts) |
+| [Process filter service](process-services/process-filter.service.md) | Manage Process Filters, which are pre-configured Process Instance queries.  | [Source](../lib/process-services/process-list/services/process-filter.service.ts) |
-| [Process service](process.service.md) | Manage Process Instances, Process Variables, and Process Audit Log.  | [Source](../lib/process-services/process-list/services/process.service.ts) |
+| [Process service](process-services/process.service.md) | Manages Process Instances, Process Variables, and Process Audit Log.  | [Source](../lib/process-services/process-list/services/process.service.ts) |
-| [Task filter service](task-filter.service.md) | Manage Task Filters, which are pre-configured Task Instance queries.  | [Source](../lib/process-services/task-list/services/task-filter.service.ts) |
+| [Task filter service](process-services/task-filter.service.md) | Manage Task Filters, which are pre-configured Task Instance queries.  | [Source](../lib/process-services/task-list/services/task-filter.service.ts) |
-| [Tasklist service](tasklist.service.md) | Manage Task Instances.  | [Source](../lib/process-services/task-list/services/tasklist.service.ts) |
+| [Tasklist service](process-services/tasklist.service.md) | Manages Task Instances. | [Source](../lib/process-services/task-list/services/tasklist.service.ts) |
 
 <!--process-services end-->
 
@@ -313,11 +329,11 @@ for more information about installing and using the source code.
 
 | Name | Description | Source link |
 | ---- | ----------- | ----------- |
-| [Widget component](widget.component.md) | Base class for standard and custom widget classes. | [Source](../lib/insights/analytics-process/components/widgets/widget.component.ts) |
+| [Widget component](insights/widget.component.md) | Base class for standard and custom widget classes. | [Source](../lib/insights/analytics-process/components/widgets/widget.component.ts) |
-| [Analytics generator component](analytics-generator.component.md) | Generates and shows charts | [Source](../lib/insights/analytics-process/components/analytics-generator.component.ts) |
+| [Analytics generator component](insights/analytics-generator.component.md) | Generates and shows charts | [Source](../lib/insights/analytics-process/components/analytics-generator.component.ts) |
-| [Analytics report list component](analytics-report-list.component.md) | Shows a list of all available reports | [Source](../lib/insights/analytics-process/components/analytics-report-list.component.ts) |
+| [Analytics report list component](insights/analytics-report-list.component.md) | Shows a list of all available reports | [Source](../lib/insights/analytics-process/components/analytics-report-list.component.ts) |
-| [Analytics component](analytics.component.md) | Shows the charts related to the reportId passed as input | [Source](../lib/insights/analytics-process/components/analytics.component.ts) |
+| [Analytics component](insights/analytics.component.md) | Shows the charts related to the reportId passed as input | [Source](../lib/insights/analytics-process/components/analytics.component.ts) |
-| [Diagram component](diagram.component.md) | Displays process diagrams. | [Source](../lib/insights/diagram/components/diagram.component.ts) |
+| [Diagram component](insights/diagram.component.md) | Displays process diagrams. | [Source](../lib/insights/diagram/components/diagram.component.ts) |
 
 <!--insights end-->
 

docs/alfresco-api.service.md

@@ -1,38 +0,0 @@
----
-Added: v2.0.0
-Status: Active
----
-# Alfresco Api Service
-
-Provides access to initialized **AlfrescoJSApi** instance.
-
-## Basic Usage
-
-```ts
-export class MyComponent implements OnInit {
-
-    constructor(private apiService: AlfrescoApiService) {   
-    }
-
-    ngOnInit() {
-        let nodeId = 'some-node-id';
-        let params = {};
-        this.apiService.getInstance().nodes
-            .getNodeChildren(nodeId, params)
-            .then(result => console.log(result));
-    }
-}
-```
-
-## Details
-
-**Note for developers**: _the TypeScript declaration files for Alfresco JS API
-are still under development and some Alfresco APIs may not be accessed
-via your favourite IDE's intellisense or TypeScript compiler. 
-In case of any TypeScript type check errors you can still call any supported 
-Alfresco JS api by casting the instance to `any` type like the following:_
-
-```ts
-let api: any = this.apiService.getInstance();
-api.nodes.addNode('-root-', body, {});
-```

docs/apps-process.service.md

@@ -1,36 +0,0 @@
----
-Added: v2.0.0
-Status: Active
----
-# Apps Process service
-
-Gets details of the Process Services apps that are deployed for the user.
-
-## Methods
-
-`getDeployedApplications(): Observable<AppDefinitionRepresentation[]>`<br/>
-Gets a list of deployed apps for this user.
-
-`getDeployedApplicationsByName(name: string): Observable<AppDefinitionRepresentation>`<br/>
-Gets a list of deployed apps for this user, where the app name is `name`.
-
-`getApplicationDetailsById(appId: number): Observable<AppDefinitionRepresentation>`<br/>
-Get the details for a specific app ID number.
-
-## Details
-
-This service can be used to access the Process Services apps that are available
-to the current user. You can find more information about the
-returned `AppDefinitionRepresentation` class in the [Filter model page](filter.model.md)
-and in the
-[Process Services Apps API](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-activiti-rest-api/docs/AppsApi.md#getAppDefinitions).
-The methods of this service make use of the
-[getAppDefinitions](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-activiti-rest-api/docs/AppsApi.md#getAppDefinitions)
-method, also from the Apps API.
-
-<!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
-<!-- seealso start -->
-## See also
-
-- [Filter model](filter.model.md)
-<!-- seealso end -->

docs/authentication.service.md

@@ -1,40 +0,0 @@
----
-Added: v2.0.0
-Status: Active
----
-# Authentication Service
-
-Provides authentication for use with the Login component.
-
-## Basic Usage
-
-**app.component.ts**
-
-```ts
-import { AuthenticationService } from '@alfresco/adf-core';
-
-@Component({...})
-export class AppComponent {
-    constructor(authService: AuthenticationService) {
-        this.AuthenticationService.login('admin', 'admin').subscribe(
-            token => {
-                console.log(token);
-            },
-            error => {
-                console.log(error);
-            }
-        );
-    }
-}
-```
-
-### Events
-
-| Name | Description |
-| ---- | ----------- |
-| onLogin | Raised when user logs in |
-| onLogout | Raised when user logs out |
-
-## Details
-
-The authentication service is used inside the [login component](login.component.md) and is possible to find there an example of how to use it.

docs/breadcrumb.component.md

@@ -1,38 +0,0 @@
----
-Added: v2.0.0
-Status: Active
----
-# Breadcrumb Component
-
-Indicates the current position within a navigation hierarchy.
-
-![Breadcrumb](docassets/images/breadcrumb.png)
-
-## Basic Usage
-
-```html
-<adf-breadcrumb
-    [target]="documentList"
-    [folderNode]="documentList.folderNode">
-</adf-breadcrumb>
-```
-
-### Properties
-
-| Name | Type | Default value | Description |
-| ---- | ---- | ------------- | ----------- |
-| folderNode | `MinimalNodeEntryEntity` | `null` | Active node, builds UI based on folderNode.path.elements collection.  |
-| root | `string` | `null` | (optional) Name of the root element of the breadcrumb. You can use this property to rename "Company Home" to "Personal Files" for example. You can use an i18n resource key for the property value. |
-| rootId | `string` | `null` | (optional) The id of the root element. You can use this property to set a custom element the breadcrumb should start with. |
-| target | `DocumentListComponent` |  | (optional) Document List component to operate with. The list will update when the breadcrumb is clicked. |
-
-### Events
-
-| Name | Type | Description |
-| ---- | ---- | ----------- |
-| navigate | `EventEmitter<PathElementEntity>` | Emitted when the user clicks on a breadcrumb. |
-
-## See also
-
--   [Document list component](document-list.component.md)
--   [Dropdown breadcrumb component](dropdown-breadcrumb.component.md)

docs/comment-process.service.md

@@ -1,32 +0,0 @@
----
-Added: v2.0.0
-Status: Active
----
-# Comment Process service
-
-Adds and retrieves comments for task and process instances in Process Services.
-
-## Methods
-
-`addTaskComment(taskId: string, message: string): Observable<CommentProcessModel>`<br/>
-Adds a comment to a task.
-
-`getTaskComments(taskId: string): Observable<CommentProcessModel[]>`<br/>
-Gets all comments that have been added to a task.
-
-`addProcessInstanceComment(processInstanceId: string, message: string): Observable<CommentProcessModel>`<br/>
-Adds a comment to a process instance.
-
-`getProcessInstanceComments(processInstanceId: string): Observable<CommentProcessModel[]>`<br/>
-Gets all comments that have been added to a process instance.
-
-## Details
-
-See the [Comment Process model](comment-process.model.md) for more information about the
-comments returned by the methods of this service. Also, the Comments API section of the
-[Alfresco JS API docs](https://github.com/Alfresco/alfresco-js-api/tree/master/src/alfresco-activiti-rest-api)
-has further details about the underlying REST API.
-
-## See also
-
--   [Comment process model](comment-process.model.md)

docs/content-metadata.component.md

@@ -1,199 +0,0 @@
----
-Added: v2.1.0
-Status: Active
----
-# Content Metadata Card component
-
-Allows a user to display and edit metadata related to a node.
-
-<img src="docassets/images/ContentMetadata.png" width="325">
-
-## Basic Usage
-
-The component shows metadata related to the given node. The component uses the card view component to render the properties of metadata aspects.
-The different aspects and their properties to be shown can be configured as application config preset, for details about it see the related section below. By default the component only shows the basic properties of the node. Clicking on the pencil icon at the bottom, renders the underlying card view component in edit mode enabling to edit and update the metadata properties.
-
-```html
-<adf-content-metadata-card
-    [displayEmpty]="false"
-    [preset]="'*'"
-    [node]="node">
-</adf-content-metadata-card>
-```
-
-### Properties
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| node | MinimalNodeEntryEntity | - | (**required**) The node entity to fetch metadata about |
-| displayEmpty | boolean | false | Display empty values in card view or not |
-| preset | string | "*" | The metadata preset's name, which defines aspects and their properties |
-
-## Details
-
-### Application config presets
-
-In the application config file you can define different presets for the metadata component or override the default preset. The **default** preset is "*" if not set, meaning the component will display every aspects and properties of the nodes without filtering. 
-
-Beside the default preset you can define as many presets as you want, if you'd like to use different metadata components with different presets.
-
-To understand presets better, you can have a look at on the following different example configurations.
-
-### Indifferent config
-
-If you don't have any preset configured manually in you application config, this would be equivalent as if you had the application config as defined below:
-
-```json
-...
-"content-metadata": {
-    "presets": {
-        "default": "*"
-    }
-}
-...
-```
-
-### Aspect oriented config
-
-With this type of configuration you are able to "whitelist" aspects and properties for a preset, but everything will be grouped by aspects and there is no further way to group properties. If you want to group different properties in groups you define, scroll down a bit and have a look at on the layout oriented configruration.
-
-#### Whitelisting only a few aspects in the default preset
-
-If you want to restrict to only a few aspects (e.g.: exif, your-custom-aspect), you have to use the name of that particular aspect to be able to whitelist it. In case of exif aspect this is "exif:exif".
-
-```json
-...
-"content-metadata": {
-    "presets": {
-        "default": {
-            "custom:aspect": "*",
-            "exif:exif": "*"
-        }
-    }
-}
-...
-```
-
-#### Whitelisting only a few properties of a few aspects in the default preset
-
-If you want to filter more, you can do this on property level also. For this, you have to list the names of whitelisted aspect properties in an array of strings. Again, for identifying a property, you have to use its name.
-
-```json
-...
-"content-metadata": {
-    "presets": {
-        "default": {
-            "custom:aspect": "*",
-            "exif:exif": [ "exif:pixelXDimension", "exif:pixelYDimension"]
-        }
-    }
-}
-...
-```
-
-#### Whitelisting only a few properties of a few aspects in a custom preset
-
-And finally, you can create any custom aspect following the same rules.
-
-```json
-...
-"content-metadata": {
-    "presets": {
-        "default": "*",
-        "kitten-images": {
-            "custom:aspect": "*",
-            "exif:exif": [ "exif:pixelXDimension", "exif:pixelYDimension"]
-        }
-    }
-}
-...
-```
-
-### Layout oriented config
-
-Beside the aspect oriented configuration, it is possible to configure the groups and properties in a more detailed way. With this type of configuration any property of any aspect / type can be "cherry picked"-ed and grouped into and accordion drawer, with defining a translatable title in the preset configuration.
-
-#### Basic elements
-
-The following config will result in one accordion group named "TRANSLATABLE_TITLE_FOR_GROUP_1", with all the properties from the custom:aspect followed by the two properties (exif:pixelXDimension, exif:pixelYDimension) from the exif:exif aspect followed by one property (custom:myPropertyName) from custom:type.
-
-```json
-...
-"content-metadata": {
-    "presets": {
-        "kitten-images": [{
-            "title": "TRANSLATABLE_TITLE_FOR_GROUP_1",
-            "items": [
-                { "aspect": "custom:aspect", "properties": "*" },
-                { "aspect": "exif:exif", "properties": [ "exif:pixelXDimension", "exif:pixelYDimension"] },
-                { "type": "custom:type", "properties": [ "custom:myPropertyName" ] },
-            ] 
-        }]
-    }
-}
-...
-```
-
-#### More complex example
-
-As a more complex config, you can study the one below:
-
-```json
-  "content-metadata": {
-    "presets": {
-      "kittens": [
-      {
-        "title": "GROUP-TITLE1-TRANSLATION-KEY",
-        "items": [
-          { 
-            "aspect": "exif:exif",
-            "properties": "*"
-          },
-          { 
-            "aspect": "kitten:vet-records", 
-            "properties": [ "kitten:custom1", "kitten:custom3" ]
-          },
-          { 
-            "aspect": "owner:parameters", 
-            "properties": [ "owner:name" ]
-          },
-          { 
-            "type": "kitten:kitten", 
-            "properties": [ "kitten:name", "kitten:color" ]
-          }
-        ]
-      },
-      {
-        "title": "GROUP-TITLE2-TRANSLATION-KEY",
-        "items": [
-          {
-            "aspect": "kitten:food", 
-            "properties": [ "kitten:favourite-food", "kitten:recommended-food" ] 
-          }
-        ]
-      }
-    ]
-  }
-```
-The end result of this config would be two accordion groups with the properties like this:
-
-|GROUP-TITLE1-TRANSLATION-KEY|
-|---|
-|exif:param1|
-|exif:param2|
-|...|
-|exif:paramN|
-|kitten:custom1|
-|kitten:custom3|
-|owner:name|
-|kitten:name|
-|kitten:color|
-
-|GROUP-TITLE2-TRANSLATION-KEY|
-|---|
-|kitten:favourite-food|
-|kitten:recommended-food|
-
-## What happens when there is a whitelisted aspect in the config but the given node doesn't relate to that aspect
-
-Nothing, this aspect (as it is not related to the node) will be simply ignored and not be displayed. The aspects to be displayed are calculated as an intersection of the preset's aspects and the aspects related to the node.

docs/content-node-selector-panel.component.md

@@ -1,91 +0,0 @@
----
-Added: v2.1.0
-Status: Active
----
-# Content Node Selector Panel component
-
-Opens a [Content Node Selector](content-node-selector.component.md) in its own dialog window.
-
-## Basic Usage
-
-```html
-    <adf-content-node-selector-panel
-        [currentFolderId]="currentFolderId"
-        [dropdownHideMyFiles]="dropdownHideMyFiles"
-        [dropdownSiteList]="dropdownSiteList"
-        [rowFilter]="rowFilter"
-        [imageResolver]="imageResolver"
-        (select)="onSelect($event)">
-    </adf-content-node-selector-panel>
-```
-
-### Properties
-
-| Name | Type | Default | Description |
-| ---- | ---- | ------- | ----------- |
-| currentFolderId | string | null | Node ID of the folder currently listed |
-| dropdownHideMyFiles | boolean | false | Hide the "My Files" option added to the site list by default. [See More](sites-dropdown.component.md) |
-| dropdownSiteList | [SitePaging](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/SitePaging.md) |  | custom site for site dropdown same as siteList. [See More](sites-dropdown.component.md#properties) |
-| rowFilter | RowFilter | null | Custom row filter function. [See More](document-list.component.md#custom-row-filter) |
-| imageResolver | ImageResolver | null | Custom image resolver function. [See More](document-list.component.md#custom-image-resolver) |
-| pageSize | number | 10 | Number of items shown per page in the list |
-| isSelectionValid | ValidationFunction | defaultValidation | Function used to decide if the selected node has permission to be the chosen. The defaultValidation always returns true.  |
-| breadcrumbTransform | (node) => any | null | Action to be performed to the chosen/folder node before building the breadcrumb UI. Can be useful in case a custom formatting is needed to the breadcrumb, so changing the node's path elements that help build the breadcrumb can be done through this function. |
-
-#### Using breadcrumbTransform example
-
-Before opening the Content Node Selector, you can add a breadcrumbTransform function to the ContentNodeSelectorComponentData to make changes to what is displayed on the breadcrumb. For example, something like this:
-```
-    const data: ContentNodeSelectorComponentData = {
-        title: title,
-        actionName: action,
-        currentFolderId: contentEntry.parentId,
-        imageResolver: this.imageResolver.bind(this),
-        rowFilter : this.rowFilter.bind(this, contentEntry.id),
-        isSelectionValid: this.hasEntityCreatePermission.bind(this),
-        breadcrumbTransform: this.changeBreadcrumbPath.bind(this), // here is the transform function
-        select: select
-    };
-
-    this.openContentNodeDialog(data, 'adf-content-node-selector-dialog', '630px');
-```
-where the transform function could be something like this:
-```
-    private changeBreadcrumbPath(node: MinimalNodeEntryEntity) {
-
-        if (node && node.path && node.path.elements) {
-            const elements = node.path.elements;
-
-            if (elements.length > 1) {
-                if (elements[1].name === 'Sites') {
-                    elements.splice(1, 1);
-                }
-            }
-        }
-
-        return node;
-    }
-```
-and here is the display of the breadcrumb before and after transform:
-![Content Node Selector breadcrumbTransfrom before/after screenshot](docassets/images/breadcrumbTransform.png)
-
-
-### Events
-
-| Name | Description |
-| ---- | ----------- |
-| select | Emitted when the user has chosen an item |
-
-## Details
-
-This component opens a _content node selector_ in its own dialog window. This behaves a lot like the
-standard file open/save dialogs used by applications to choose files. Full details are given in the
-[Content Node Selector component](content-node-selector.component.md) page (this is similar but does
-not manage the dialog window for you). Also, the
-[Content Node Dialog service](content-node-dialog.service.md) has several methods that give you
-finer control over the behavior of the dialog.
-
-## See also
-
--   [Content Node Selector component](content-node-selector.component.md)
--   [Content Node Dialog service](content-node-dialog.service.md)

docs/content-services/README.md

@@ -0,0 +1,73 @@
+# ADF Content Services
+
+Contains components related to Content Services.
+See the library's
+[README file](../../lib/content-services/README.md)
+for more information about installing and using the source code.
+
+<!--content-services start-->
+
+## Components
+
+| Name | Description | Source link |
+| ---- | ----------- | ----------- |
+| [Breadcrumb component](breadcrumb.component.md) | Indicates the current position within a navigation hierarchy. | [Source](../../lib/content-services/breadcrumb/breadcrumb.component.ts) |
+| [Dropdown breadcrumb component](dropdown-breadcrumb.component.md) | Indicates the current position within a navigation hierarchy using a dropdown menu. | [Source](../../lib/content-services/breadcrumb/dropdown-breadcrumb.component.ts) |
+| [Content metadata component](content-metadata.component.md) | Displays and edits metadata related to a node. | [Source](../../lib/content-services/content-metadata/components/content-metadata/content-metadata.component.ts) |
+| [Content node selector panel component](content-node-selector-panel.component.md) | Opens a Content Node Selector in its own dialog window. | [Source](../../lib/content-services/content-node-selector/content-node-selector-panel.component.ts) |
+| [Content node selector component](content-node-selector.component.md) | Allows a user to select items from a Content Services repository. | [Source](../../lib/content-services/content-node-selector/content-node-selector.component.ts) |
+| [Content action component](content-action.component.md) | Adds options to a Document List actions menu for a particular content type. | [Source](../../lib/content-services/document-list/components/content-action/content-action.component.ts) |
+| [Document list component](document-list.component.md) | Displays the documents from a repository. | [Source](../../lib/content-services/document-list/components/document-list.component.ts) |
+| [Permission list component](permission-list.component.md) | Shows node permissions as a table. | [Source](../../lib/content-services/permission-manager/components/permission-list/permission-list.component.ts) |
+| [Search chip list component](search-chip-list.component.md) | Displays search criteria as a set of "chips". | [Source](../../lib/content-services/search/components/search-chip-list/search-chip-list.component.ts) |
+| [Search control component](search-control.component.md) | Displays a input text which shows find-as-you-type suggestions. | [Source](../../lib/content-services/search/components/search-control.component.ts) |
+| [Search filter component](search-filter.component.md) | Represents a main container component for custom search and faceted search settings. | [Source](../../lib/content-services/search/components/search-filter/search-filter.component.ts) |
+| [Search component](search.component.md) | Searches items for supplied search terms.  | [Source](../../lib/content-services/search/components/search.component.ts) |
+| [Sites dropdown component](sites-dropdown.component.md) | Displays a dropdown menu to show and interact with the sites of the current user. | [Source](../../lib/content-services/site-dropdown/sites-dropdown.component.ts) |
+| [Like component](like.component.md) | Allows a user to add "likes" to an item. | [Source](../../lib/content-services/social/like.component.ts) |
+| [Rating component](rating.component.md) | Allows a user to add ratings to an item. | [Source](../../lib/content-services/social/rating.component.ts) |
+| [Tag actions component](tag-actions.component.md) | Shows available actions for tags. | [Source](../../lib/content-services/tag/tag-actions.component.ts) |
+| [Tag list component](tag-list.component.md) | Shows tags for an item. | [Source](../../lib/content-services/tag/tag-list.component.ts) |
+| [Tag node list component](tag-node-list.component.md) | Shows tags for a node. | [Source](../../lib/content-services/tag/tag-node-list.component.ts) |
+| [File uploading dialog component](file-uploading-dialog.component.md) | Shows a dialog listing all the files uploaded with the Upload Button or Drag Area components. | [Source](../../lib/content-services/upload/components/file-uploading-dialog.component.ts) |
+| [Upload button component](upload-button.component.md) | Activates a file upload. | [Source](../../lib/content-services/upload/components/upload-button.component.ts) |
+| [Upload drag area component](upload-drag-area.component.md) | Adds a drag and drop area to upload files to ACS. | [Source](../../lib/content-services/upload/components/upload-drag-area.component.ts) |
+| [Upload version button component](upload-version-button.component.md) ![Experimental](../docassets/images/ExperimentalIcon.png) | Activates a file version upload. | [Source](../../lib/content-services/upload/components/upload-version-button.component.ts) |
+| [Version list component](version-list.component.md) ![Experimental](../docassets/images/ExperimentalIcon.png) | Displays the version history of a node in a Version Manager component | [Source](../../lib/content-services/version-manager/version-list.component.ts) |
+| [Version manager component](version-manager.component.md) ![Experimental](../docassets/images/ExperimentalIcon.png) | Displays the version history of a node with the ability to upload a new version. | [Source](../../lib/content-services/version-manager/version-manager.component.ts) |
+| [Webscript component](webscript.component.md) | Provides access to Webscript features. | [Source](../../lib/content-services/webscript/webscript.component.ts) |
+
+## Directives
+
+| Name | Description | Source link |
+| ---- | ----------- | ----------- |
+| [Node download directive](node-download.directive.md) | Allows folders and/or files to be downloaded, with multiple nodes packed as a '.ZIP' archive. | [Source](../../lib/content-services/directives/node-download.directive.ts) |
+| [Node lock directive](node-lock.directive.md) | Locks a node. | [Source](../../lib/content-services/directives/node-lock.directive.ts) |
+| [Node share directive](node-share.directive.md) | Creates and manages public shared links for files. | [Source](../../lib/content-services/directives/node-share.directive.ts) |
+| [Folder create directive](folder-create.directive.md) | Creates folders. | [Source](../../lib/content-services/folder-directive/folder-create.directive.ts) |
+| [Folder edit directive](folder-edit.directive.md) | Allows folders to be edited. | [Source](../../lib/content-services/folder-directive/folder-edit.directive.ts) |
+| [Inherited button directive](inherited-button.directive.md) | Update the current node by adding/removing the inherited permissions. | [Source](../../lib/content-services/permission-manager/components/inherited-button.directive.ts) |
+| [File draggable directive](file-draggable.directive.md) | Provides drag-and-drop features for an element such as a `div`. | [Source](../../lib/content-services/upload/directives/file-draggable.directive.ts) |
+
+## Models
+
+| Name | Description | Source link |
+| ---- | ----------- | ----------- |
+| [Document library model](document-library.model.md) | Defines classes for use with the Content Services node API. | [Source](../../lib/content-services/document-list/models/document-library.model.ts) |
+| [Permissions style model](permissions-style.model.md) | Sets custom CSS styles for rows of a Document List according to the item's permissions. | [Source](../../lib/content-services/document-list/models/permissions-style.model.ts) |
+
+## Services
+
+| Name | Description | Source link |
+| ---- | ----------- | ----------- |
+| [Content node dialog service](content-node-dialog.service.md) | Displays and manages dialogs for selecting content to open, copy or upload. | [Source](../../lib/content-services/content-node-selector/content-node-dialog.service.ts) |
+| [Custom resources service](custom-resources.service.md) | Manages Document List information that is specific to a user. | [Source](../../lib/content-services/document-list/services/custom-resources.service.ts) |
+| [Document actions service](document-actions.service.md) | Implements the document menu actions for the Document List component. | [Source](../../lib/content-services/document-list/services/document-actions.service.ts) |
+| [Document list service](document-list.service.md) | Implements node operations used by the Document List component. | [Source](../../lib/content-services/document-list/services/document-list.service.ts) |
+| [Folder actions service](folder-actions.service.md) | Implements the folder menu actions for the Document List component. | [Source](../../lib/content-services/document-list/services/folder-actions.service.ts) |
+| [Node permission service](node-permission.service.md) | Manages the role permissions for the content nodes | [Source](../../lib/content-services/permission-manager/services/node-permission.service.ts) |
+| [Search query builder service](search-query-builder.service.md) | Stores information from all the custom search and faceted search widgets, compiles and runs the final Search query. | [Source](../../lib/content-services/search/search-query-builder.service.ts) |
+| [Rating service](rating.service.md) | Manages ratings for items in Content Services. | [Source](../../lib/content-services/social/services/rating.service.ts) |
+| [Tag service](tag.service.md) | Manages tags in Content Services. | [Source](../../lib/content-services/tag/services/tag.service.ts) |
+
+<!--content-services end-->

docs/content-services/breadcrumb.component.md

@@ -0,0 +1,92 @@
+---
+Added: v2.0.0
+Status: Active
+Last reviewed: 2018-03-12
+---
+
+# Breadcrumb Component
+
+Indicates the current position within a navigation hierarchy.
+
+![Breadcrumb](../docassets/images/breadcrumb.png)
+
+## Basic Usage
+
+```html
+<adf-breadcrumb
+    [target]="documentList"
+    [folderNode]="documentList.folderNode">
+</adf-breadcrumb>
+```
+
+### Properties
+
+| Name | Type | Default value | Description |
+| ---- | ---- | ------------- | ----------- |
+| folderNode | `MinimalNodeEntryEntity` | `null` | Active node, builds UI based on folderNode.path.elements collection.  |
+| root | `string` | `null` | (optional) Name of the root element of the breadcrumb. You can use this property to rename "Company Home" to "Personal Files" for example. You can use an i18n resource key for the property value. |
+| rootId | `string` | `null` | (optional) The id of the root element. You can use this property to set a custom element the breadcrumb should start with. |
+| target | `DocumentListComponent` |  | (optional) Document List component to operate with. The list will update when the breadcrumb is clicked. |
+| transform | `(node: any) => any` |  | Transformation to be performed on the chosen/folder node before building the breadcrumb UI. Can be useful when custom formatting is needed for the breadcrumb. You can change the path elements from the node that are used to build the breadcrumb using this function. |
+
+### Events
+
+| Name | Type | Description |
+| ---- | ---- | ----------- |
+| navigate | `EventEmitter<PathElementEntity>` | Emitted when the user clicks on a breadcrumb.  |
+
+## Details
+
+### Using the transform function
+
+The function supplied in the `transform` property lets you modify the Node object that the component
+uses to find the "crumbs" for the list. You can use this, for example, to remove unwanted items from
+the list by altering the node's `path.elements` property.
+
+Below is an example of how you might do this with the
+[Content Node Selector component](content-node-selector.component.md). In this case, you pass the 
+transform function via the `breadcrumbTransform` property of `ContentNodeSelectorComponentData` during
+initialization:
+
+```ts
+    const data: ContentNodeSelectorComponentData = {
+        title: title,
+        actionName: action,
+        currentFolderId: contentEntry.parentId,
+        imageResolver: this.imageResolver.bind(this),
+        rowFilter : this.rowFilter.bind(this, contentEntry.id),
+        isSelectionValid: this.hasEntityCreatePermission.bind(this),
+        breadcrumbTransform: this.changeBreadcrumbPath.bind(this), // here is the transform function
+        select: select
+    };
+
+    this.openContentNodeDialog(data, 'adf-content-node-selector-dialog', '630px');
+```
+
+A transform function to remove the "Sites" folder from the path would look something like this:
+
+```ts
+    private changeBreadcrumbPath(node: MinimalNodeEntryEntity) {
+
+        if (node && node.path && node.path.elements) {
+            const elements = node.path.elements;
+
+            if (elements.length > 1) {
+                if (elements[1].name === 'Sites') {
+                    elements.splice(1, 1);
+                }
+            }
+        }
+
+        return node;
+    }
+```
+
+Below, the breadcrumb is shown before and after the transform function is applied:
+
+![Content Node Selector breadcrumbTransfrom before/after screenshot](../docassets/images/breadcrumbTransform.png)
+
+## See also
+
+-   [Document list component](document-list.component.md)
+-   [Dropdown breadcrumb component](dropdown-breadcrumb.component.md)

docs/content-services/content-action.component.md

@@ -6,7 +6,7 @@ Status: Active
 
 Adds options to a Document List actions menu for a particular content type.
 
-![Document Actions](docassets/images/document-actions.png)
+![Document Actions](../docassets/images/document-actions.png)
 
 ## Contents
 
@@ -17,9 +17,9 @@ Adds options to a Document List actions menu for a particular content type.
 
 -   [Details](#details)
 
-    -   [Built-in action examples](#built-in-action-examples)
+    -   [Examples](#examples)
-    -   [Error, Permission and Success callbacks](#error-permission-and-success-callbacks)
     -   [Customizing built-in actions](#customizing-built-in-actions)
+    -   [Error, Permission and Success callbacks](#error-permission-and-success-callbacks)
 
 -   [See also](#see-also)
 
@@ -80,7 +80,7 @@ export class MyView {
 
 | Name | Type | Default value | Description |
 | ---- | ---- | ------------- | ----------- |
-| title | `string` | `'Action'` | The title of the action as shown in the menu.  |
+| title | `string` | `'Action'` | The title of the action as shown in the menu. If the title is a translation key the translation will be automatically showed.  |
 | icon | `string` |  | The name of the icon to display next to the menu command (can be left blank).  |
 | handler | `string` |  | System actions. Can be "delete", "download", "copy" or "move".  |
 | target | `string` | [ContentActionTarget.All](https://github.com/Alfresco/alfresco-ng2-components/blob/development/lib/content-services/document-list/models/content-action.model.ts) | Type of item that the action applies to. Can be one of the values provided by the enum : **All**, **Folder**, **Document**  |
@@ -100,11 +100,12 @@ export class MyView {
 ## Details
 
 The document actions are rendered on a dropdown menu for each items of content. You can use the
-`target` property to choose whether the action applies to folders or documents. 
+`target` property to choose whether the action applies to folders , documents or both. (By default the actions arre applied to both)
 
 A number of built-in actions are defined to handle common use cases:
 
 -   **Download** (document)
+-   **lock** (document)
 -   **Copy** (document, folder)
 -   **Move** (document, folder)
 -   **Delete** (document, folder)
@@ -150,16 +151,65 @@ type and other details of the item just deleted:
   }
 ```
 
-![Custom delete message screenshot](docassets/images/ContentActSnackMessage.png)
+![Custom delete message screenshot](../docassets/images/ContentActSnackMessage.png)
 
-### Built-in action examples
+### Examples
 
-#### Delete - System handler combined with custom handler
+#### System handler
    
-If you specify both `handler="delete"` and your own custom handler with
+This action simply execute one of the built-in actions described above:
-`(execute)="myCustomActionAfterDelete($event)"`, your handler will run after a delete completes
+
-successfully. A delete operation is considered successful if there are no permission or
+   ```html
-network-related errors for the delete request. You can avoid permission errors simply by disabling
+   <adf-document-list [contentActions]="true"...>
+       <content-actions>
+   
+           <content-action
+               target="document"
+               title="Download"
+               handler="download">
+           </content-action>
+   
+       </content-actions>
+   </adf-document-list>
+   ```
+
+![Download document action](../docassets/images/document-action-download.png)
+
+#### Custom handler
+
+If you specify a custom handler it will be executed at any click of the action:
+
+
+```html
+<adf-document-list [contentActions]="true"...>
+   <content-actions>
+
+       <content-action
+           title="custom-action"
+           (execute)="myCustomAction($event)">
+       </content-action>
+
+   </content-actions>
+</adf-document-list>
+```
+
+
+```ts
+export class MyComponent {
+
+    myCustomAction(event: any) {
+        //Your cusrtom logic
+    }
+
+}
+```
+
+#### System handler combined with custom handler
+
+If you specify both system handler and your own custom handler with
+`(execute)="myCustomActionAfterDelete($event)"`, your handler will run after a system handler completes 
+successfully. A system operation is considered successful if there are no permission or
+network-related errors for the system request. You can avoid permission errors simply by disabling
 an item for users who don't have permission to use it (set `disableWithNoPermission="true"`). 
 
 ```html
@@ -171,6 +221,7 @@ an item for users who don't have permission to use it (set `disableWithNoPermiss
             title="Delete"
             permission="delete"
             disableWithNoPermission="true"
+            (execute)="myCustomActionAfterDelete($event)"
             handler="delete">
         </content-action>
 
@@ -178,11 +229,23 @@ an item for users who don't have permission to use it (set `disableWithNoPermiss
 </adf-document-list>
 ```
 
-![Delete disable action button](docassets/images/content-action-disable-delete-button.png)
+```ts
+export class MyComponent {
+
+    myCustomActionAfterDelete(event: any) {
+        //Your cusrtom logic
+    }
+
+}
+```
+
+![Delete disable action button](../docassets/images/content-action-disable-delete-button.png)
+
+#### Permission check
 
 You can also implement the `permissionEvent` to handle permission errors
 (to show the user a notification, for example). Subscribe to this event from your component
-and use the [Notification service](notification.service.md) to show a message.
+and use the [Notification service](../core/notification.service.md) to show a message.
 
 ```html
 <adf-document-list [contentActions]="true"...>
@@ -192,6 +255,7 @@ and use the [Notification service](notification.service.md) to show a message.
             target="document"
             title="Delete"
             permission="delete"
+            (execute)="myCustomActionAfterDelete($event)"
             (permissionEvent)="onPermissionsFailed($event)"
             handler="delete">
         </content-action>
@@ -210,27 +274,8 @@ export class MyComponent {
 }
 ```
 
-![Delete show notification message](docassets/images/content-action-notification-message.png)
+![Delete show notification message](../docassets/images/content-action-notification-message.png)
 
-#### Download
-
-This action simply starts a download of the corresponding document file.
-
-```html
-<adf-document-list [contentActions]="true"...>
-    <content-actions>
-
-        <content-action
-            target="document"
-            title="Download"
-            handler="download">
-        </content-action>
-
-    </content-actions>
-</adf-document-list>
-```
-
-![Download document action](docassets/images/document-action-download.png)
 
 #### Copy and move
 
@@ -238,7 +283,7 @@ These actions show the destination chooser dialog for copy and move actions. By
 the destination chooser lists all the folders of the subject item's parent. However, it won't
 allow the item being copied/moved to be the destination if it is itself a folder.
 
-![Copy/move dialog](docassets/images/document-action-copymovedialog.png)
+![Copy/move dialog](../docassets/images/document-action-copymovedialog.png)
 
 ```html
 <adf-document-list [contentActions]="true"...>
@@ -272,6 +317,14 @@ allow the item being copied/moved to be the destination if it is itself a folder
 </adf-document-list>
 ```
 
+### Customizing built-in actions
+
+The built-in actions are defined in the [Document Actions service](document-actions.service.md) and
+[Folder Actions service](folder-actions.service.md) but you can register new actions with these services
+and override the default implementations. See the doc pages for
+[Document Actions service](document-actions.service.md) and [Folder Actions service](folder-actions.service.md)
+for details and examples.
+
 ### Error, Permission and Success callbacks
 
 Defining error, permission and success callbacks are pretty much the same as doing it for the delete permission handling.
@@ -280,15 +333,7 @@ Defining error, permission and success callbacks are pretty much the same as doi
 -   The success callback's only parameter is the translatable success message string (could be used for showing in snackbar for example)
 -   The permissionEvent callback is the same as described above with the delete action
 
-![Copy/move document action](docassets/images/document-action-copymove.png)
+![Copy/move document action](../docassets/images/document-action-copymove.png)
-
-### Customizing built-in actions
-
-The built-in actions are defined in the [Document Actions service](document-actions.service.md) and
-[Folder Actions service](folder-actions.service.md) but you can register new actions with these services
-and override the default implementations. See the doc pages for
-[Document Actions service](document-actions.service.md) and [Folder Actions service](folder-actions.service.md)
-for details and examples.
 
 <!-- Don't edit the See also section. Edit seeAlsoGraph.json and run config/generateSeeAlso.js -->
 

docs/content-services/content-metadata.component.md

@@ -0,0 +1,215 @@
+---
+Added: v2.1.0
+Status: Active
+Last reviewed: 2018-04-16
+---
+
+# Content Metadata Card component
+
+Displays and edits metadata related to a node.
+
+![Content metadata screenshot](../docassets/images/ContentMetadata.png)
+
+## Basic Usage
+
+```html
+<adf-content-metadata-card
+    [displayEmpty]="false"
+    [preset]="'*'"
+    [node]="node">
+</adf-content-metadata-card>
+```
+
+## Class members
+
+### Properties
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| node | MinimalNodeEntryEntity | - | (**required**) The node entity to fetch metadata about |
+| displayEmpty | boolean | false | Toggles whether to display empty values in the card view |
+| readOnly | boolean | true | Toggles whether the edit button should be shown |
+| multi | boolean | false | The multi parameter of the underlying material expansion panel |
+| preset | string | "*" | Name of the metadata preset, which defines aspects and their properties |
+
+## Details
+
+The component shows metadata related to a given node. It uses the
+[Card View component](../core/card-view.component.md) to render the properties of metadata aspects.
+The different aspects and their properties to be shown can be configured as application config
+presets (see below). By default the component only shows the basic properties of the node.
+The user can click on the pencil icon at the bottom of the component to edit the metadata
+properties.
+
+### Application config presets
+
+You can define different presets for the metadata component or override the default presets in
+the `app.config.json` file. The **default** preset is "*" if not set, meaning the component
+will display every aspect and property of a node without filtering. 
+
+You can define as many extra presets as you need for your components.
+
+The example configurations below show the options in detail.
+
+#### Indifferent config
+
+The default configuration behaves like the following:
+
+```json
+...
+"content-metadata": {
+    "presets": {
+        "default": "*"
+    }
+}
+...
+```
+
+#### Aspect oriented config
+
+With this type of configuration you can "whitelist" aspects and properties for a preset, but everything will be grouped by aspects and there is no further way to group properties. Use a
+[layout oriented configuration](#layout-oriented-config) if you want to define your own
+custom groups.
+
+The default configuration shows every aspect but you can restrict it to just a small selection
+of aspects by "whitelisting" the ones you want in the `default` section. In the example below,
+just the `exif:exif` and `custom:aspect` aspects are whitelisted:
+
+```json
+...
+"content-metadata": {
+    "presets": {
+        "default": {
+            "custom:aspect": "*",
+            "exif:exif": "*"
+        }
+    }
+}
+...
+```
+
+You can further restrict the whitelist to specific properties of one or more aspects by using
+an array of property names in place of the "*" filter:
+
+```json
+...
+"content-metadata": {
+    "presets": {
+        "default": {
+            "custom:aspect": "*",
+            "exif:exif": [ "exif:pixelXDimension", "exif:pixelYDimension"]
+        }
+    }
+}
+...
+```
+
+A final example shows the same process applied to a custom preset called "kitten-images":
+
+```json
+...
+"content-metadata": {
+    "presets": {
+        "default": "*",
+        "kitten-images": {
+            "custom:aspect": "*",
+            "exif:exif": [ "exif:pixelXDimension", "exif:pixelYDimension"]
+        }
+    }
+}
+...
+```
+
+### Layout oriented config
+
+You can also go beyond the aspect oriented configuration if you need to configure the groups and properties in a more detailed way. With this type of configuration any property of any aspect/type
+can be "cherry picked" and grouped into an accordion drawer, along wwith a translatable title
+defined in the preset configuration.
+
+#### Basic elements
+
+The following config will produce one accordion group named "TRANSLATABLE_TITLE_FOR_GROUP_1",
+with all the properties from `custom:aspect` followed by the two properties (`exif:pixelXDimension`
+and `exif:pixelYDimension`) from the `exif:exif` aspect and then one property (`custom:myPropertyName`) from `custom:type`:
+
+```json
+...
+"content-metadata": {
+    "presets": {
+        "kitten-images": [{
+            "title": "TRANSLATABLE_TITLE_FOR_GROUP_1",
+            "items": [
+                { "aspect": "custom:aspect", "properties": "*" },
+                { "aspect": "exif:exif", "properties": [ "exif:pixelXDimension", "exif:pixelYDimension"] },
+                { "type": "custom:type", "properties": [ "custom:myPropertyName" ] },
+            ] 
+        }]
+    }
+}
+...
+```
+
+#### More complex example
+
+A more complex config is shown in the example below:
+
+```json
+  "content-metadata": {
+    "presets": {
+      "kittens": [
+      {
+        "title": "GROUP-TITLE1-TRANSLATION-KEY",
+        "items": [
+          { 
+            "aspect": "exif:exif",
+            "properties": "*"
+          },
+          { 
+            "aspect": "kitten:vet-records", 
+            "properties": [ "kitten:custom1", "kitten:custom3" ]
+          },
+          { 
+            "aspect": "owner:parameters", 
+            "properties": [ "owner:name" ]
+          },
+          { 
+            "type": "kitten:kitten", 
+            "properties": [ "kitten:name", "kitten:color" ]
+          }
+        ]
+      },
+      {
+        "title": "GROUP-TITLE2-TRANSLATION-KEY",
+        "items": [
+          {
+            "aspect": "kitten:food", 
+            "properties": [ "kitten:favourite-food", "kitten:recommended-food" ] 
+          }
+        ]
+      }
+    ]
+  }
+```
+The result of this config would be two accordion groups with the following properties:
+
+|GROUP-TITLE1-TRANSLATION-KEY|
+|---|
+|exif:param1|
+|exif:param2|
+|...|
+|exif:paramN|
+|kitten:custom1|
+|kitten:custom3|
+|owner:name|
+|kitten:name|
+|kitten:color|
+
+|GROUP-TITLE2-TRANSLATION-KEY|
+|---|
+|kitten:favourite-food|
+|kitten:recommended-food|
+
+## What happens when there is a whitelisted aspect in the config but the given node doesn't relate to that aspect
+
+Nothing - since this aspect is not related to the node, it will simply be ignored and not
+displayed. The aspects to be displayed are calculated as an intersection of the preset's aspects and the aspects related to the node.

docs/content-services/content-node-dialog.service.md

@@ -1,13 +1,18 @@
 ---
 Added: v2.1.0
 Status: Active
+Last reviewed: 2018-03-13
 ---
+
 # Content Node Dialog service
 
 Displays and manages dialogs for selecting content to open, copy or upload.
 
 ## Methods
 
+-   `openLockNodeDialog(nodeEntry: MinimalNodeEntryEntity): Observable<string>`
+    Opens a dialog to lock or unlock file
+    -   `nodeEntry` - Item to lock or unlock.
 -   `openFileBrowseDialogByFolderId(folderNodeId: string): Observable<MinimalNodeEntryEntity[]>`  
     Opens a file browser at a chosen folder location.   
     -   `folderNodeId` - ID of the folder to use 

docs/content-services/content-node-selector-panel.component.md

@@ -0,0 +1,64 @@
+---
+Added: v2.1.0
+Status: Active
+Last reviewed: 2018-04-16
+---
+
+# Content Node Selector Panel component
+
+Opens a Content Node Selector in its own dialog window.
+
+![Content Node Selector screenshot](../docassets/images/ContentNodeSelector.png)
+
+## Basic Usage
+
+```html
+    <adf-content-node-selector-panel
+        [currentFolderId]="currentFolderId"
+        [dropdownHideMyFiles]="dropdownHideMyFiles"
+        [dropdownSiteList]="dropdownSiteList"
+        [rowFilter]="rowFilter"
+        [imageResolver]="imageResolver"
+        (select)="onSelect($event)">
+    </adf-content-node-selector-panel>
+```
+
+### Properties
+
+| Name | Type | Default value | Description |
+| ---- | ---- | ------------- | ----------- |
+| currentFolderId | `string` | `null` | Node ID of the folder currently listed.  |
+| dropdownHideMyFiles | `boolean` | `false` | Hide the "My Files" option added to the site list by default. See the [Sites Dropdown component](sites-dropdown.component.md) for more information. |
+| dropdownSiteList | `SitePaging` | `null` | Custom site for site dropdown same as siteList. See the [Sites Dropdown component](sites-dropdown.component.md) for more information. |
+| rowFilter | `RowFilter` | `null` | Custom row filter function. See the [Document List component](document-list.component.md#custom-row-filter) for more information. |
+| imageResolver | `ImageResolver` | `null` | Custom image resolver function. See the [Document List component](document-list.component.md#custom-row-filter) for more information.  |
+| pageSize | `number` |  | Number of items shown per page in the list.  |
+| isSelectionValid | `ValidationFunction` | `defaultValidation` | Function used to decide if the selected node has permission to be selected. Default value is a function that always returns true. |
+| breadcrumbTransform | `(node: any) => any` |  | Transformation to be performed on the chosen/folder node before building the breadcrumb UI. Can be useful when custom formatting is needed for the breadcrumb. You can change the path elements from the node that are used to build the breadcrumb using this function. |
+
+### Events
+
+| Name | Type | Description |
+| ---- | ---- | ----------- |
+| select | `EventEmitter<MinimalNodeEntryEntity[]>` | Emitted when the user has chosen an item.  |
+
+## Details
+
+This component opens a _content node selector_ in its own dialog window. This behaves a lot like the
+standard file open/save dialogs used by applications to choose files. Full details are given in the
+[Content Node Selector component](content-node-selector.component.md) page (this is similar but does
+not manage the dialog window for you). Also, the
+[Content Node Dialog service](content-node-dialog.service.md) has several methods that give you
+finer control over the behavior of the dialog.
+
+### Using the breadcrumbTransform function
+
+The `breadcrumbTransform` property lets you modify the Node object that is used to generate the
+list of breadcrumbs. You can use this, for example, to remove path elements that are not
+relevant to the use case. See the [Breadcrumb component](breadcrumb.component.md) page for an
+example of how to use this function.
+
+## See also
+
+-   [Content Node Selector component](content-node-selector.component.md)
+-   [Content Node Dialog service](content-node-dialog.service.md)

docs/content-services/content-node-selector.component.md

@@ -1,32 +1,28 @@
 ---
 Added: v2.0.0
 Status: Active
+Last reviewed: 2018-03-29
 ---
+
 # Content Node Selector component
 
 Allows a user to select items from a Content Services repository.
 
-![Content Node Selector screenshot](docassets/images/ContentNodeSelector.png)
+![Content Node Selector screenshot](../docassets/images/ContentNodeSelector.png)
 
-## Basic Usage
+## Class members
 
 ### Properties
 
-| Name | Type | Default | Description |
+| Name | Type | Default value | Description |
-| ---- | ---- | ------- | ----------- |
+| ---- | ---- | ------------- | ----------- |
-| title | string | "" | Text shown at the top of the selector |
+| currentFolderId | `string` | null | Deprecated: in 2.1.0 |
-| currentFolderId | string | null | Node ID of the folder currently listed |
+| dropdownHideMyFiles | `boolean` | false | Deprecated: in 2.1.0 |
-| dropdownHideMyFiles | boolean | false | Hide the "My Files" option added to the site list by default. [See More](sites-dropdown.component.md) |
+| dropdownSiteList | `SitePaging` | null | Deprecated: in 2.1.0 |
-| dropdownSiteList | [SitePaging](https://github.com/Alfresco/alfresco-js-api/blob/master/src/alfresco-core-rest-api/docs/SitePaging.md) |  | custom site for site dropdown same as siteList. [See More](sites-dropdown.component.md#properties) |
+| imageResolver | `ImageResolver` | null | Deprecated: in 2.1.0 |
-| rowFilter | RowFilter | null | Custom row filter function. [See More](document-list.component.md#custom-row-filter) |
+| pageSize | `number` |  | Deprecated: in 2.1.0 |
-| imageResolver | ImageResolver | null | Custom image resolver function. [See More](document-list.component.md#custom-image-resolver) |
+| rowFilter | `RowFilter` | null | Deprecated: in 2.1.0 |
-| pageSize | number | 10 | Number of items shown per page in the list |
+| title | `string` | null | Deprecated: in 2.1.0 |
-
-### Events
-
-| Name | Description |
-| ---- | ----------- |
-| select | Emitted when the user has selected an item |
 
 ## Details
 
@@ -115,6 +111,14 @@ a row filter to hide document nodes in a folder selector. See the
 [Advanced Usage and Customization](document-list.component.md#advanced-usage-and-customization)
 section of the Document List page to learn how these functions are implemented.
 
+### Using the breadcrumbTransform function
+
+The `breadcrumbTransform` property of `ContentNodeSelectorComponentData` lets you modify
+the Node object that is used to generate the
+list of breadcrumbs. You can use this, for example, to remove path elements that are not
+relevant to the use case. See the [Breadcrumb component](breadcrumb.component.md) page for an
+example of how to use this function.
+
 ## See also
 
 -   [Document list component](document-list.component.md)