Feature/content fragment

angular.json

@@ -203,6 +203,46 @@
         }
       }
     },
+    "aem-angular-core-spa-wcm-components-contentfragment-v1": {
+      "projectType": "library",
+      "root": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1",
+      "sourceRoot": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-ng-packagr:build",
+          "options": {
+            "tsConfig": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/tsconfig.lib.json",
+            "project": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/tsconfig.lib.prod.json"
+            }
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src/test.ts",
+            "tsConfig": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/tsconfig.spec.json",
+            "karmaConfig": "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/karma.conf.js"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/tsconfig.lib.json",
+              "projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
     "aem-angular-core-spa-wcm-components-tabs-v1": {
       "projectType": "library",
       "root": "projects/aem-angular-core-spa-wcm-components/containers/tabs/v1",

package.json

@@ -12,6 +12,7 @@
     "test-cover-libs": "npm-run-all test-container-core test-accordion-v1 test-carousel-v1 test-container-v1 test-tabs-v1 build-spa",
     "lint": "ng lint",
     "e2e": "ng e2e",
+    "cover:library:spa:contentfragment:v1": "ng test aem-angular-core-spa-wcm-components-contentfragment-v1 --code-coverage=true",
     "cover:library:spa:container:core": "ng test aem-angular-core-spa-wcm-components-core  --code-coverage=true",
     "cover:library:spa:accordion:v1": "ng test aem-angular-core-spa-wcm-components-accordion-v1  --code-coverage=true",
     "cover:library:spa:carousel:v1": "ng test aem-angular-core-spa-wcm-components-carousel-v1  --code-coverage=true",

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/README.md

@@ -0,0 +1,24 @@
+# AemAngularCoreSpaWcmComponents
+
+This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 9.1.12.
+
+## Code scaffolding
+
+Run `ng generate component component-name --project aem-angular-core-spa-wcm-components` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project aem-angular-core-spa-wcm-components`.
+> Note: Don't forget to add `--project aem-angular-core-spa-wcm-components` or else it will be added to the default project in your `angular.json` file. 
+
+## Build
+
+Run `ng build aem-angular-core-spa-wcm-components` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+## Publishing
+
+After building your library with `ng build aem-angular-core-spa-wcm-components`, go to the dist folder `cd dist/aem-angular-core-spa-wcm-components` and run `npm publish`.
+
+## Running unit tests
+
+Run `ng test aem-angular-core-spa-wcm-components` to execute the unit tests via [Karma](https://karma-runner.github.io).
+
+## Further help
+
+To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/karma.conf.js

@@ -0,0 +1,24 @@
+/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ ~ Copyright 2020 Adobe Systems Incorporated
+ ~
+ ~ 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.
+ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
+
+// Karma configuration file, see link for more information
+// https://karma-runner.github.io/1.0/config/configuration-file.html
+
+const karmaConfigGenerator = require('../../../../../karma-conf-generator');
+
+module.exports = function (config) {
+  return karmaConfigGenerator(config, 'aem-angular-core-spa-wcm-components-container-v1');
+};

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/ng-package.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "../../../../../node_modules/ng-packagr/ng-package.schema.json",
+  "dest": "../../../../../dist/aem-angular-core-spa-wcm-components/containers/contentfragment/v1",
+  "lib": {
+    "entryFile": "src/public-api.ts"
+  },
+  "whitelistedNonPeerDependencies": [
+    "."
+  ]
+}

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/package.json

@@ -0,0 +1,16 @@
+{
+  "name": "@adobe/aem-core-components-angular-spa-contentfragment-v1",
+  "version": "0.0.6",
+  "author": "Adobe Systems Inc.",
+  "license": "Apache-2.0",
+  "peerDependencies": {
+    "@adobe/aem-angular-editable-components": "^1.0.3",
+    "@adobe/aem-spa-component-mapping": "^1.0.5",
+    "@adobe/aem-spa-page-model-manager": "^1.0.3",
+    "@angular/common": "^9.1.12",
+    "@angular/core": "^9.1.12"
+  },
+  "dependencies": {
+    "tslib": "^1.10.0"
+  }
+}

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src/contentfragment.v1.component.html

@@ -0,0 +1,7 @@
+<ng-container >
+    <div *ngIf="showFragment()" aemContentFragment [cqItem]="getItemSelf()"
+                        [cqPath]="getPathSelf()"
+                        [itemName]="getItemKey()"></div>
+
+    <div *ngIf="showPlaceHolder()" class="cf-placeholder">ContentFragment is empty.</div>
+</ng-container>

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src/contentfragment.v1.component.ts

@@ -0,0 +1,63 @@
+/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ ~ Copyright 2020 Adobe Systems Incorporated
+ ~
+ ~ 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, Input} from "@angular/core";
+import {ContentFragmentV1Element, ContentFragmentV1Properties} from "./model";
+import {AbstractContainerComponent} from "@adobe/aem-core-components-angular-spa/core";
+
+const ITEM_KEY = "fragment";
+
+@Component({
+    selector: 'core-contentFragment-v1',
+    host: {
+        '[class]': 'hostClasses',
+        '[attr.data-cq-data-path]':'cqPath'
+    },
+    templateUrl: './contentfragment.v1.component.html'
+})
+export class ContentFragmentV1Component extends AbstractContainerComponent implements ContentFragmentV1Properties{
+
+    @Input() description: string;
+    @Input() elements: { [p: string]: ContentFragmentV1Element };
+    @Input() elementsOrder: string[];
+    @Input() model: string;
+    @Input() title: string;
+
+    showFragment(){
+        return !ContentFragmentV1IsEmptyFn(this);
+    }
+
+    showPlaceHolder(){
+        return ContentFragmentV1IsEmptyFn(this) && this.isInEditMode;
+    }
+
+    getItemSelf(){
+        return this;
+    }
+
+    getPathSelf(){
+        return this.cqPath;
+    }
+
+    getItemKey(){
+        return ITEM_KEY;
+    }
+}
+
+export function ContentFragmentV1IsEmptyFn(props:ContentFragmentV1Properties) {
+    return (props.elementsOrder == null || props.elementsOrder.length === 0) && (props.cqItemsOrder == null || props.cqItemsOrder.length === 0);
+}

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src/contentfragment.v1.directive.ts

@@ -0,0 +1,36 @@
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you 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 REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import {Directive, Type} from '@angular/core';
+import {AEMComponentDirective, ComponentMappingProvider} from "@adobe/aem-angular-editable-components";
+import {ContentfragmentV1Registry} from "./contentfragment.v1.registry";
+import {ContentFragmentV1DefaultRenderer} from "./defaultrenderer/contentfragment.v1.defaultrenderer";
+
+@Directive({
+  selector: '[aemContentFragment]'
+})
+
+export class ContentFragmentV1Directive extends AEMComponentDirective {
+
+    getFallbackComponent():Type<unknown> | null{
+        return ContentFragmentV1DefaultRenderer;
+    }
+
+    getComponentMappingProvider():ComponentMappingProvider  {
+        return ContentfragmentV1Registry;
+    }
+
+    getType(): string | undefined {
+        return this.cqItem && this.cqItem["model"];
+    }
+
+}

projects/aem-angular-core-spa-wcm-components/containers/contentfragment/v1/src/contentfragment.v1.module.ts

@@ -0,0 +1,43 @@
+/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+ ~ Copyright 2020 Adobe Systems Incorporated
+ ~
+ ~ 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 {NgModule} from '@angular/core';
+import {CommonModule} from "@angular/common";
+import {BrowserModule} from "@angular/platform-browser";
+import {RouterModule} from "@angular/router";
+import {ContentFragmentV1Component} from "./contentfragment.v1.component";
+import {SpaAngularEditableComponentsModule} from "@adobe/aem-angular-editable-components";
+import {AemAngularCoreSpaWcmComponentsCore} from "@adobe/aem-core-components-angular-spa/core";
+import {ContentFragmentV1Directive} from "./contentfragment.v1.directive";
+import {ContentFragmentV1DefaultRenderer} from "./defaultrenderer/contentfragment.v1.defaultrenderer";
+
+@NgModule({
+    imports: [CommonModule, BrowserModule, RouterModule,SpaAngularEditableComponentsModule,AemAngularCoreSpaWcmComponentsCore],
+    declarations: [
+        ContentFragmentV1DefaultRenderer,
+        ContentFragmentV1Component,
+        ContentFragmentV1Directive
+    ],
+    exports: [
+        ContentFragmentV1DefaultRenderer,
+        ContentFragmentV1Component
+    ],
+    entryComponents: [
+        ContentFragmentV1DefaultRenderer,
+        ContentFragmentV1Component,
+    ],
+})
+export class AemAngularCoreWcmComponentsContentFragmentV1 {}