@adobe/cq-angular-editable-components
Version:
* [API](#api) * [Documentation](#documentation) * [Changelog](#changelog)
878 lines (862 loc) • 36.7 kB
JavaScript
import { __decorate, __metadata, __extends } from 'tslib';
import { Renderer2, ViewContainerRef, ComponentFactoryResolver, ChangeDetectorRef, Input, Directive, Component, ViewChild, NgModule, Injectable } from '@angular/core';
import { ComponentMapping } from '@adobe/cq-spa-component-mapping';
import { Constants as Constants$1, ModelManager } from '@adobe/cq-spa-page-model-manager';
import { CommonModule } from '@angular/common';
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
/**
* The current class extends the @adobe/cq-spa-component-mapping#Mapto library and features with Angular specifics such as
*
* - Storing the editing configurations for each resource type
*/
var ComponentMappingWithConfig = /** @class */ (function () {
function ComponentMappingWithConfig(spaMapping) {
this.spaMapping = spaMapping;
/**
* Store of EditConfig structures
*/
this.editConfigMap = {};
}
/**
* Stores a component class for the given resource types and also allows to provide an EditConfig object
* @param resourceTypes - List of resource types
* @param clazz - Component class to be stored
* @param [editConfig] - Edit configuration to be stored for the given resource types
*/
ComponentMappingWithConfig.prototype.map = function (resourceTypes, clazz, editConfig) {
if (editConfig === void 0) { editConfig = null; }
var innerClass = clazz;
if (editConfig) {
this.editConfigMap[resourceTypes] = editConfig;
}
this.spaMapping.map(resourceTypes, innerClass);
};
;
/**
* Returns the component class for the given resourceType
* @param resourceType - Resource type for which the component class has been stored
*/
ComponentMappingWithConfig.prototype.get = function (resourceType) {
return this.spaMapping.get(resourceType);
};
/**
* Returns the EditConfig structure for the given type
* @param resourceType - Resource type for which the configuration has been stored
*/
ComponentMappingWithConfig.prototype.getEditConfig = function (resourceType) {
return this.editConfigMap[resourceType];
};
return ComponentMappingWithConfig;
}());
var componentMapping = new ComponentMappingWithConfig(ComponentMapping);
function MapTo(resourceTypes) {
return function (clazz, editConfig) {
if (editConfig === void 0) { editConfig = null; }
return componentMapping.map(resourceTypes, clazz, editConfig);
};
}
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var Constants = {
/**
* Class names associated with a new section component
*
*/
NEW_SECTION_CLASS_NAMES: 'new section',
TYPE_PROP: Constants$1.TYPE_PROP,
/**
* List of child items of an item
*
*/
ITEMS_PROP: Constants$1.ITEMS_PROP,
/**
* Order in which the items should be listed
*
*/
ITEMS_ORDER_PROP: Constants$1.ITEMS_ORDER_PROP,
/**
* Path of the item
*
*/
PATH_PROP: Constants$1.PATH_PROP,
/**
* Children of an item
*
*/
CHILDREN_PROP: Constants$1.CHILDREN_PROP,
/**
* Path of the resource in the model
*
*/
DATA_PATH_PROP: ':dataPath',
/**
* Hierarchical type of the item
*/
HIERARCHY_TYPE_PROP: Constants$1.HIERARCHY_TYPE_PROP
};
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
/**
* Selector that identifies the node that contains the WCM mode state
*/
var WCM_MODE_META_SELECTOR = 'meta[property="cq:wcmmode"]';
/**
* The editor is in one of the edition modes
*/
var EDIT_MODE = 'edit';
/**
* The editor is in preview mode
*/
var PREVIEW_MODE = 'preview';
/**
* Returns if we are in the browser context or not by checking for the
* existence of the window object
*/
function isBrowser() {
try {
return typeof window !== 'undefined';
}
catch (e) {
return false;
}
}
/**
* Returns the current WCM mode
*
* <p>Note that the value isn't, as of the date of this writing, updated by the editor</p>
*/
function getWCMMode() {
if (isBrowser()) {
var wcmModeMeta = document.head.querySelector(WCM_MODE_META_SELECTOR);
return wcmModeMeta && wcmModeMeta.content;
}
}
/**
* Helper functions for interacting with the AEM environment
*/
var Utils = {
/**
* Is the app used in the context of the AEM Page editor
*/
isInEditor: function () {
var wcmMode = getWCMMode();
return wcmMode && (EDIT_MODE === wcmMode || PREVIEW_MODE === wcmMode);
}
};
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var PLACEHOLDER_CLASS_NAME = 'cq-placeholder';
var AEMComponentDirective = /** @class */ (function () {
function AEMComponentDirective(renderer, viewContainer, factoryResolver, _changeDetectorRef) {
this.renderer = renderer;
this.viewContainer = viewContainer;
this.factoryResolver = factoryResolver;
this._changeDetectorRef = _changeDetectorRef;
}
Object.defineProperty(AEMComponentDirective.prototype, "cqItem", {
get: function () {
return this._cqItem;
},
set: function (value) {
this._cqItem = value;
},
enumerable: true,
configurable: true
});
Object.defineProperty(AEMComponentDirective.prototype, "changeDetectorRef", {
get: function () {
return this._changeDetectorRef;
},
enumerable: true,
configurable: true
});
AEMComponentDirective.prototype.ngOnInit = function () {
this.renderComponent(componentMapping.get(this.type));
};
AEMComponentDirective.prototype.ngOnChanges = function (changes) {
this.updateComponentData();
};
Object.defineProperty(AEMComponentDirective.prototype, "type", {
/**
* Returns the type of the cqItem if exists.
*/
get: function () {
return this.cqItem && this.cqItem[Constants.TYPE_PROP];
},
enumerable: true,
configurable: true
});
/**
* Renders a component dynamically based on the component definition
*
* @param componentDefinition The component definition to render
*/
AEMComponentDirective.prototype.renderComponent = function (componentDefinition) {
if (componentDefinition) {
var factory = this.factoryResolver.resolveComponentFactory(componentDefinition);
this.viewContainer.clear();
this._component = this.viewContainer.createComponent(factory);
this.updateComponentData();
}
};
/**
* Updates the data of the component based the data of the directive
*/
AEMComponentDirective.prototype.updateComponentData = function () {
var _this = this;
if (!this._component || !this._component.instance) {
return;
}
var keys = Object.getOwnPropertyNames(this.cqItem);
keys.forEach(function (key) {
var propKey = key;
if (propKey.startsWith(':')) {
// Transformation of internal properties namespaced with [:] to [cq]
// :myProperty => cqMyProperty
var tempKey = propKey.substr(1);
propKey = 'cq' + tempKey.substr(0, 1).toUpperCase() + tempKey.substr(1);
}
_this._component.instance[propKey] = _this.cqItem[key];
});
this._component.instance.cqPath = this.cqPath;
this._component.instance.itemName = this.itemName;
var editConfig = componentMapping.getEditConfig(this.type);
if (editConfig && Utils.isInEditor) {
this.setupPlaceholder(editConfig);
}
this._changeDetectorRef.detectChanges();
};
/**
* Adds the specified item attributes to the element
*/
AEMComponentDirective.prototype.setupItemAttrs = function () {
var _this = this;
if (this.itemAttrs) {
var keys = Object.getOwnPropertyNames(this.itemAttrs);
keys.forEach(function (key) {
if (key === 'class') {
var classes = _this.itemAttrs[key].split(' ');
classes.forEach(function (itemClass) {
_this.renderer.addClass(_this._component.location.nativeElement, itemClass);
});
}
else {
_this.renderer.setAttribute(_this._component.location.nativeElement, key, _this.itemAttrs[key]);
}
});
}
};
/**
* Determines if the placeholder should e displayed.
*
* @param editConfig - the edit config of the directive
*/
AEMComponentDirective.prototype.usePlaceholder = function (editConfig) {
return editConfig.isEmpty && typeof editConfig.isEmpty === 'function' && editConfig.isEmpty(this.cqItem);
};
/**
* Setups the placeholder of needed for the AEM editor
*
* @param editConfig - the editConfig, which will dictate the classes to be added on.
*/
AEMComponentDirective.prototype.setupPlaceholder = function (editConfig) {
if (this.usePlaceholder(editConfig)) {
this.renderer.addClass(this._component.location.nativeElement, PLACEHOLDER_CLASS_NAME);
this.renderer.setAttribute(this._component.location.nativeElement, 'data-emptytext', editConfig.emptyLabel);
}
else {
this.renderer.removeClass(this._component.location.nativeElement, PLACEHOLDER_CLASS_NAME);
this.renderer.removeAttribute(this._component.location.nativeElement, 'data-emptytext');
}
};
AEMComponentDirective.prototype.ngAfterViewInit = function () {
this.setupItemAttrs();
};
AEMComponentDirective.prototype.ngOnDestroy = function () {
this._component && this._component.destroy();
};
AEMComponentDirective.ctorParameters = function () { return [
{ type: Renderer2 },
{ type: ViewContainerRef },
{ type: ComponentFactoryResolver },
{ type: ChangeDetectorRef }
]; };
__decorate([
Input(),
__metadata("design:type", Object),
__metadata("design:paramtypes", [Object])
], AEMComponentDirective.prototype, "cqItem", null);
__decorate([
Input(),
__metadata("design:type", String)
], AEMComponentDirective.prototype, "cqPath", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMComponentDirective.prototype, "itemName", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMComponentDirective.prototype, "itemAttrs", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMComponentDirective.prototype, "aemComponent", void 0);
AEMComponentDirective = __decorate([
Directive({
selector: '[aemComponent]'
})
/**
* The current directive provides advanced capabilities among which are
*
* - The management of the component placeholder in the Page Editor
* - The dynamic instantiation of components based on a component definition
* - The conversion from model fields to properties and injection in the component instance
* - The management of HTMLElement attributes and class names on the native element
*/
,
__metadata("design:paramtypes", [Renderer2,
ViewContainerRef,
ComponentFactoryResolver,
ChangeDetectorRef])
], AEMComponentDirective);
return AEMComponentDirective;
}());
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var PLACEHOLDER_CLASS_NAMES = Constants.NEW_SECTION_CLASS_NAMES;
var PLACEHOLDER_ITEM_NAME = '*';
var CONTAINER_CLASS_NAMES = 'aem-container';
var AEMContainerComponent = /** @class */ (function () {
/**
* The current component provides the base presentational logic common to containers such as a grid or a page.
* Container have in common the notion of item holders. Items are represented in the model by the fields _:items_ and _:itemsOrder_
*/
function AEMContainerComponent() {
/**
* Path to the model associated with the current instance of the component
*/
this.cqPath = '';
/**
* Key of the model structure
*/
this.modelName = '';
}
Object.defineProperty(AEMContainerComponent.prototype, "isInEditMode", {
/**
* Returns weather of not we are in the editor
*/
get: function () {
return Utils.isInEditor();
},
enumerable: true,
configurable: true
});
/**
* Returns the aggregated path of this container path and the provided path
*
* @param path - the provided path to aggregate with the container path
*/
AEMContainerComponent.prototype.getDataPath = function (path) {
return this.cqPath ? this.cqPath + '/' + path : path;
};
/**
* Returns the item data from the cqModel
*
* @param itemKey - the itemKey to look for in the items.
*/
AEMContainerComponent.prototype.getItem = function (itemKey) {
return this.cqItems && this.cqItems[itemKey];
};
/**
* Returns the class names of the container based on the data from the cqModel
*/
AEMContainerComponent.prototype.getHostClassNames = function () {
return CONTAINER_CLASS_NAMES;
};
Object.defineProperty(AEMContainerComponent.prototype, "hostClasses", {
get: function () {
return this.getHostClassNames();
},
enumerable: true,
configurable: true
});
/**
* Returns the placeholder classes
*/
AEMContainerComponent.prototype.getPlaceholderClassNames = function () {
return PLACEHOLDER_CLASS_NAMES;
};
Object.defineProperty(AEMContainerComponent.prototype, "placeholderPath", {
/**
* Returns the placeholder path
*/
get: function () {
return this.cqPath && this.cqPath + '/' + PLACEHOLDER_ITEM_NAME;
},
enumerable: true,
configurable: true
});
__decorate([
Input(),
__metadata("design:type", Object)
], AEMContainerComponent.prototype, "cqItems", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMContainerComponent.prototype, "cqItemsOrder", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMContainerComponent.prototype, "cqPath", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMContainerComponent.prototype, "modelName", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMContainerComponent.prototype, "classNames", void 0);
AEMContainerComponent = __decorate([
Component({
selector: 'aem-container',
host: {
'[class]': 'hostClasses',
'[attr.data-cq-data-path]': 'cqPath'
},
template: "<ng-container *ngFor=\"let itemKey of cqItemsOrder\">\n <aem-model-provider [cqItem]=\"getItem(itemKey)\"\n [cqPath]=\"getDataPath(itemKey)\"\n [itemName]=\"itemKey\"></aem-model-provider>\n</ng-container>\n<div *ngIf=\"isInEditMode\"\n [attr.data-cq-data-path]=\"placeholderPath\"\n [class]=\"getPlaceholderClassNames()\"></div>\n"
})
/**
* The current component provides the base presentational logic common to containers such as a grid or a page.
* Container have in common the notion of item holders. Items are represented in the model by the fields _:items_ and _:itemsOrder_
*/
], AEMContainerComponent);
return AEMContainerComponent;
}());
var ALLOWED_PLACEHOLDER_CLASS_NAMES = 'aem-AllowedComponent--list';
var ALLOWED_COMPONENT_TITLE_CLASS_NAMES = 'aem-AllowedComponent--title';
var ALLOWED_COMPONENT_PLACEHOLDER_CLASS_NAMES = 'aem-AllowedComponent--component cq-placeholder placeholder';
var AEMAllowedComponentsContainerComponent = /** @class */ (function (_super) {
__extends(AEMAllowedComponentsContainerComponent, _super);
function AEMAllowedComponentsContainerComponent() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this.emptyLabel = 'No allowed components';
return _this;
}
AEMAllowedComponentsContainerComponent.prototype.isAllowedComponentsApplicable = function () {
return this.isInEditMode && this.allowedComponents && this.allowedComponents.applicable;
};
AEMAllowedComponentsContainerComponent.prototype.getAllowedComponentListPlaceholderClassNames = function () {
return _super.prototype.getPlaceholderClassNames.call(this) + ' ' + ALLOWED_PLACEHOLDER_CLASS_NAMES;
};
AEMAllowedComponentsContainerComponent.prototype.getAllowedComponentListLabel = function () {
var hasComponents = this.allowedComponents && this.allowedComponents.components && this.allowedComponents.components.length > 0;
return hasComponents ? this.title : this.emptyLabel;
};
AEMAllowedComponentsContainerComponent.prototype.getAllowedComponents = function () {
return this.allowedComponents && this.allowedComponents.components || [];
};
Object.defineProperty(AEMAllowedComponentsContainerComponent.prototype, "allowedComponentListTitleClassNames", {
get: function () {
return ALLOWED_COMPONENT_TITLE_CLASS_NAMES;
},
enumerable: true,
configurable: true
});
Object.defineProperty(AEMAllowedComponentsContainerComponent.prototype, "allowedComponentClassNames", {
get: function () {
return ALLOWED_COMPONENT_PLACEHOLDER_CLASS_NAMES;
},
enumerable: true,
configurable: true
});
__decorate([
Input(),
__metadata("design:type", String)
], AEMAllowedComponentsContainerComponent.prototype, "title", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMAllowedComponentsContainerComponent.prototype, "emptyLabel", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMAllowedComponentsContainerComponent.prototype, "allowedComponents", void 0);
AEMAllowedComponentsContainerComponent = __decorate([
Component({
selector: 'aem-allowed-components-container',
template: "<div [class]=\"getAllowedComponentListPlaceholderClassNames()\">\n <div [attr.data-text]=\"getAllowedComponentListLabel()\" [class]=\"allowedComponentListTitleClassNames\"></div>\n <ng-container *ngFor=\"let allowedComponent of getAllowedComponents()\">\n <div [attr.data-cq-data-path]=\"allowedComponent.path\"\n [attr.data-emptytext]=\"allowedComponent.title\"\n [class]=\"allowedComponentClassNames\"></div>\n </ng-container>\n</div>\n",
styles: [""]
})
], AEMAllowedComponentsContainerComponent);
return AEMAllowedComponentsContainerComponent;
}(AEMContainerComponent));
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var PLACEHOLDER_CLASS_NAMES$1 = 'aem-Grid-newComponent';
var RESPONSIVE_GRID_TYPE = 'wcm/foundation/components/responsivegrid';
var AEMResponsiveGridComponent = /** @class */ (function (_super) {
__extends(AEMResponsiveGridComponent, _super);
/**
* The current class carries the base presentational logic of the AEM Layout Container (aka. Responsive grid)
*/
function AEMResponsiveGridComponent() {
return _super !== null && _super.apply(this, arguments) || this;
}
/**
* Returns the column class names for a given column
* @param itemKey - The key of the column item
*/
AEMResponsiveGridComponent.prototype.getColumnClassNames = function (itemKey) {
return this.columnClassNames && this.columnClassNames[itemKey];
};
/**
* Returns the placeholder classes
*/
AEMResponsiveGridComponent.prototype.getPlaceholderClassNames = function () {
return _super.prototype.getPlaceholderClassNames.call(this) + ' ' + PLACEHOLDER_CLASS_NAMES$1;
};
/**
* Returns the class names of the responsive grid based on the data from the cqModel
*/
AEMResponsiveGridComponent.prototype.getHostClassNames = function () {
var classNames = _super.prototype.getHostClassNames.call(this);
if (this.classNames) {
classNames += ' ' + (this.classNames || '');
}
return classNames + ' ' + this.gridClassNames;
};
/**
* Returns the aggregated path of this container path and the provided path
*
* @param path - the provided path to aggregate with the container path
*/
AEMResponsiveGridComponent.prototype.getAttrDataPath = function (path) {
var item = this.getItem(path);
if (item && item[Constants.TYPE_PROP] === RESPONSIVE_GRID_TYPE) {
// We don't want to add the path for the wrapper for a reponsivegrid
// The reponsivegrid adds the path on it's own
return null;
}
return this.getDataPath(path);
};
__decorate([
Input(),
__metadata("design:type", String)
], AEMResponsiveGridComponent.prototype, "gridClassNames", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMResponsiveGridComponent.prototype, "columnClassNames", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], AEMResponsiveGridComponent.prototype, "classNames", void 0);
__decorate([
Input(),
__metadata("design:type", Number)
], AEMResponsiveGridComponent.prototype, "columnCount", void 0);
AEMResponsiveGridComponent = __decorate([
Component({
selector: 'aem-responsivegrid',
host: {
'[class]': 'hostClasses',
'[attr.data-cq-data-path]': 'cqPath'
},
template: "<ng-container *ngIf=\"isAllowedComponentsApplicable(); else container\">\n <div [class]=\"getAllowedComponentListPlaceholderClassNames()\">\n <div [attr.data-text]=\"getAllowedComponentListLabel()\" [class]=\"allowedComponentListTitleClassNames\"></div>\n <ng-container *ngFor=\"let allowedComponent of getAllowedComponents()\">\n <div [attr.data-cq-data-path]=\"allowedComponent.path\"\n [attr.data-emptytext]=\"allowedComponent.title\"\n [class]=\"allowedComponentClassNames\"></div>\n </ng-container>\n </div>\n</ng-container>\n<ng-template #container>\n <ng-container *ngFor=\"let itemKey of cqItemsOrder\">\n <div [aemModelProvider]\n [cqItem]=\"getItem(itemKey)\"\n [cqPath]=\"getDataPath(itemKey)\"\n [itemName]=\"itemKey\"\n [class]=\"getColumnClassNames(itemKey)\"\n [attr.data-cq-data-path]=\"getAttrDataPath(itemKey)\"></div>\n </ng-container>\n <div *ngIf=\"isInEditMode\"\n [attr.data-cq-data-path]=\"placeholderPath\"\n [class]=\"getPlaceholderClassNames()\"></div>\n</ng-template>\n\n\n"
})
/**
* The current class carries the base presentational logic of the AEM Layout Container (aka. Responsive grid)
*/
], AEMResponsiveGridComponent);
return AEMResponsiveGridComponent;
}(AEMAllowedComponentsContainerComponent));
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var AEMModelProviderComponent = /** @class */ (function () {
function AEMModelProviderComponent() {
}
/**
* Updates the item data
*/
AEMModelProviderComponent.prototype.updateItem = function () {
var _this = this;
ModelManager.getData({ path: this.cqPath }).then(function (model) {
_this.cqItem = model;
_this.aemComponent.changeDetectorRef.markForCheck();
});
};
AEMModelProviderComponent.prototype.ngOnInit = function () {
ModelManager.addListener(this.cqPath, this.updateItem.bind(this));
};
AEMModelProviderComponent.prototype.ngDestroy = function () {
ModelManager.removeListener(this.cqPath, this.updateItem.bind(this));
};
__decorate([
Input(),
__metadata("design:type", Object)
], AEMModelProviderComponent.prototype, "cqPath", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMModelProviderComponent.prototype, "cqItem", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMModelProviderComponent.prototype, "itemName", void 0);
__decorate([
Input(),
__metadata("design:type", Object)
], AEMModelProviderComponent.prototype, "aemModelProvider", void 0);
__decorate([
ViewChild(AEMComponentDirective),
__metadata("design:type", AEMComponentDirective)
], AEMModelProviderComponent.prototype, "aemComponent", void 0);
AEMModelProviderComponent = __decorate([
Component({
selector: 'aem-model-provider,[aemModelProvider]',
template: "<ng-container aemComponent [cqItem]='cqItem' [cqPath]='cqPath' [itemName]='itemName'></ng-container>"
})
/**
* The current component is responsible for providing access to the ModelManager and the model of a component
*/
,
__metadata("design:paramtypes", [])
], AEMModelProviderComponent);
return AEMModelProviderComponent;
}());
/*
* ADOBE CONFIDENTIAL
*
* Copyright 2018 Adobe Systems Incorporated
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Adobe Systems Incorporated and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Adobe Systems Incorporated and its
* suppliers and may be covered by U.S. and Foreign Patents,
* patents in process, and are protected by trade secret or copyright law.
* Dissemination of this information or reproduction of this material
* is strictly forbidden unless prior written permission is obtained
* from Adobe Systems Incorporated.
*/
var PAGE_MODEL_SEPARATOR = '/jcr:content/';
var AEMPageComponent = /** @class */ (function (_super) {
__extends(AEMPageComponent, _super);
/**
* The current component carries the base presentational logic of page component
*/
function AEMPageComponent() {
return _super !== null && _super.apply(this, arguments) || this;
}
/**
* Returns the aggregated path of this container path and the provided path
*
* @param path - the provided path to aggregate with the container path
*/
AEMPageComponent.prototype.getDataPath = function (path) {
return this.cqPath ? this.cqPath + PAGE_MODEL_SEPARATOR + path : path;
};
AEMPageComponent = __decorate([
Component({
selector: 'aem-page',
host: {
'[class]': 'hostClasses',
'[attr.data-cq-data-path]': 'cqPath'
},
template: "<ng-container *ngFor=\"let itemKey of cqItemsOrder\">\n <aem-model-provider [cqItem]=\"getItem(itemKey)\"\n [cqPath]=\"getDataPath(itemKey)\"\n [itemName]=\"itemKey\"></aem-model-provider>\n</ng-container>\n<div *ngIf=\"isInEditMode\"\n [attr.data-cq-data-path]=\"placeholderPath\"\n [class]=\"getPlaceholderClassNames()\"></div>\n"
})
/**
* The current component carries the base presentational logic of page component
*/
], AEMPageComponent);
return AEMPageComponent;
}(AEMContainerComponent));
/*
* Copyright 2018 Adobe Systems Incorporated. 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.
*
*/
var SpaAngularEditableComponentsModule = /** @class */ (function () {
function SpaAngularEditableComponentsModule() {
}
SpaAngularEditableComponentsModule = __decorate([
NgModule({
imports: [CommonModule],
declarations: [AEMContainerComponent, AEMAllowedComponentsContainerComponent, AEMResponsiveGridComponent, AEMComponentDirective, AEMModelProviderComponent, AEMPageComponent],
exports: [AEMContainerComponent, AEMAllowedComponentsContainerComponent, AEMResponsiveGridComponent, AEMComponentDirective, AEMModelProviderComponent, AEMPageComponent],
entryComponents: [AEMContainerComponent, AEMAllowedComponentsContainerComponent, AEMResponsiveGridComponent, AEMPageComponent]
})
], SpaAngularEditableComponentsModule);
return SpaAngularEditableComponentsModule;
}());
var AemPageDataResolver = /** @class */ (function () {
function AemPageDataResolver() {
}
/**
* Returns the absolute resource path without extension.
* @example
* // returns: '/content/aa/bb' for route.url [ 'content', 'aa', 'bb.html' ]
* resolve(route)
* @param route - route
* @returns absolute resource path without extension
*/
AemPageDataResolver.prototype.resolve = function (route) {
return '/' + route.url.join('/').replace(/\.[^/.]+$/, '');
};
AemPageDataResolver = __decorate([
Injectable(),
__metadata("design:paramtypes", [])
], AemPageDataResolver);
return AemPageDataResolver;
}());
/**
* Implements RouteReuseStrategy to customize route reuse.
*/
var AemPageRouteReuseStrategy = /** @class */ (function () {
function AemPageRouteReuseStrategy() {
}
/** Determines if this route (and its subtree) should be detached to be reused later. */
AemPageRouteReuseStrategy.prototype.shouldDetach = function (route) {
return false;
};
/** Not storing deteached route. */
AemPageRouteReuseStrategy.prototype.store = function (route, detachedTree) { };
/** Determines if this route (and its subtree) should be reattached. */
AemPageRouteReuseStrategy.prototype.shouldAttach = function (route) {
return false;
};
/** Retrieves the previously stored route. */
AemPageRouteReuseStrategy.prototype.retrieve = function (route) {
return null;
};
/** Determines if a route should be reused */
AemPageRouteReuseStrategy.prototype.shouldReuseRoute = function (future, curr) {
return false;
};
return AemPageRouteReuseStrategy;
}());
/*
* Copyright 2018 Adobe Systems Incorporated. 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.
*
*/
/**
* Generated bundle index. Do not edit.
*/
export { AEMAllowedComponentsContainerComponent, AEMComponentDirective, AEMContainerComponent, AEMModelProviderComponent, AEMPageComponent, AEMResponsiveGridComponent, ALLOWED_COMPONENT_PLACEHOLDER_CLASS_NAMES, ALLOWED_COMPONENT_TITLE_CLASS_NAMES, ALLOWED_PLACEHOLDER_CLASS_NAMES, AemPageDataResolver, AemPageRouteReuseStrategy, componentMapping as ComponentMapping, ComponentMappingWithConfig, Constants, MapTo, SpaAngularEditableComponentsModule, Utils };
//# sourceMappingURL=adobe-cq-angular-editable-components.js.map