UNPKG

@adobe/cq-angular-editable-components

Version:

* [API](#api) * [Documentation](#documentation) * [Changelog](#changelog)

119 lines 10.4 kB
/* * 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. */ import { __decorate, __metadata } from "tslib"; import { Component, Input } from '@angular/core'; import { Constants } from '../constants'; import { Utils } from '../utils'; const PLACEHOLDER_CLASS_NAMES = Constants.NEW_SECTION_CLASS_NAMES; const PLACEHOLDER_ITEM_NAME = '*'; const CONTAINER_CLASS_NAMES = 'aem-container'; let AEMContainerComponent = /** * 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_ */ class AEMContainerComponent { constructor() { /** * Path to the model associated with the current instance of the component */ this.cqPath = ''; /** * Key of the model structure */ this.modelName = ''; } /** * Returns weather of not we are in the editor */ get isInEditMode() { return Utils.isInEditor(); } /** * Returns the aggregated path of this container path and the provided path * * @param path - the provided path to aggregate with the container path */ getDataPath(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. */ getItem(itemKey) { return this.cqItems && this.cqItems[itemKey]; } /** * Returns the class names of the container based on the data from the cqModel */ getHostClassNames() { return CONTAINER_CLASS_NAMES; } get hostClasses() { return this.getHostClassNames(); } /** * Returns the placeholder classes */ getPlaceholderClassNames() { return PLACEHOLDER_CLASS_NAMES; } /** * Returns the placeholder path */ get placeholderPath() { return this.cqPath && this.cqPath + '/' + PLACEHOLDER_ITEM_NAME; } }; __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); export { AEMContainerComponent }; //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWVtLWNvbnRhaW5lci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYWRvYmUvY3EtYW5ndWxhci1lZGl0YWJsZS1jb21wb25lbnRzLyIsInNvdXJjZXMiOlsibGliL2xheW91dC9hZW0tY29udGFpbmVyL2FlbS1jb250YWluZXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7Ozs7R0FlRzs7QUFFSCxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sY0FBYyxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxVQUFVLENBQUM7QUFFakMsTUFBTSx1QkFBdUIsR0FBRyxTQUFTLENBQUMsdUJBQXVCLENBQUM7QUFDbEUsTUFBTSxxQkFBcUIsR0FBRyxHQUFHLENBQUM7QUFDbEMsTUFBTSxxQkFBcUIsR0FBRyxlQUFlLENBQUM7QUFjOUMsSUFBYSxxQkFBcUI7QUFKbEM7OztHQUdHO0FBQ0gsTUFBYSxxQkFBcUI7SUFBbEM7UUFTRTs7V0FFRztRQUNNLFdBQU0sR0FBVyxFQUFFLENBQUM7UUFDN0I7O1dBRUc7UUFDTSxjQUFTLEdBQVcsRUFBRSxDQUFDO0lBdURsQyxDQUFDO0lBakRDOztPQUVHO0lBQ0gsSUFBSSxZQUFZO1FBQ2QsT0FBTyxLQUFLLENBQUMsVUFBVSxFQUFFLENBQUM7SUFDNUIsQ0FBQztJQUVEOzs7O09BSUc7SUFDSCxXQUFXLENBQUMsSUFBSTtRQUNkLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLE1BQU0sR0FBRyxHQUFHLEdBQUcsSUFBSSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7SUFDdkQsQ0FBQztJQUVEOzs7O09BSUc7SUFDSCxPQUFPLENBQUMsT0FBTztRQUNiLE9BQU8sSUFBSSxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQy9DLENBQUM7SUFFRDs7T0FFRztJQUNILGlCQUFpQjtRQUNmLE9BQU8scUJBQXFCLENBQUM7SUFDL0IsQ0FBQztJQUVELElBQUksV0FBVztRQUNiLE9BQU8sSUFBSSxDQUFDLGlCQUFpQixFQUFFLENBQUM7SUFDbEMsQ0FBQztJQUVEOztPQUVHO0lBQ0gsd0JBQXdCO1FBQ3RCLE9BQU8sdUJBQXVCLENBQUM7SUFDakMsQ0FBQztJQUVEOztPQUVHO0lBQ0gsSUFBSSxlQUFlO1FBQ2pCLE9BQU8sSUFBSSxDQUFDLE1BQU0sSUFBSSxJQUFJLENBQUMsTUFBTSxHQUFHLEdBQUcsR0FBRyxxQkFBcUIsQ0FBQztJQUNsRSxDQUFDO0NBQ0YsQ0FBQTtBQW5FVTtJQUFSLEtBQUssRUFBRTs7c0RBQVM7QUFJUjtJQUFSLEtBQUssRUFBRTs7MkRBQWM7QUFJYjtJQUFSLEtBQUssRUFBRTs7cURBQXFCO0FBSXBCO0lBQVIsS0FBSyxFQUFFOzt3REFBd0I7QUFJdkI7SUFBUixLQUFLLEVBQUU7O3lEQUFvQjtBQXBCakIscUJBQXFCO0lBWmpDLFNBQVMsQ0FBQztRQUNULFFBQVEsRUFBRSxlQUFlO1FBQ3pCLElBQUksRUFBRTtZQUNGLFNBQVMsRUFBRSxhQUFhO1lBQ3hCLDBCQUEwQixFQUFDLFFBQVE7U0FDdEM7UUFDRCwwWUFBNkM7S0FDOUMsQ0FBQztJQUNGOzs7T0FHRztHQUNVLHFCQUFxQixDQXVFakM7U0F2RVkscUJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIEFET0JFIENPTkZJREVOVElBTFxuICpcbiAqIENvcHlyaWdodCAyMDE4IEFkb2JlIFN5c3RlbXMgSW5jb3Jwb3JhdGVkXG4gKiBBbGwgUmlnaHRzIFJlc2VydmVkLlxuICpcbiAqIE5PVElDRTogIEFsbCBpbmZvcm1hdGlvbiBjb250YWluZWQgaGVyZWluIGlzLCBhbmQgcmVtYWluc1xuICogdGhlIHByb3BlcnR5IG9mIEFkb2JlIFN5c3RlbXMgSW5jb3Jwb3JhdGVkIGFuZCBpdHMgc3VwcGxpZXJzLFxuICogaWYgYW55LiAgVGhlIGludGVsbGVjdHVhbCBhbmQgdGVjaG5pY2FsIGNvbmNlcHRzIGNvbnRhaW5lZFxuICogaGVyZWluIGFyZSBwcm9wcmlldGFyeSB0byBBZG9iZSBTeXN0ZW1zIEluY29ycG9yYXRlZCBhbmQgaXRzXG4gKiBzdXBwbGllcnMgYW5kIG1heSBiZSBjb3ZlcmVkIGJ5IFUuUy4gYW5kIEZvcmVpZ24gUGF0ZW50cyxcbiAqIHBhdGVudHMgaW4gcHJvY2VzcywgYW5kIGFyZSBwcm90ZWN0ZWQgYnkgdHJhZGUgc2VjcmV0IG9yIGNvcHlyaWdodCBsYXcuXG4gKiBEaXNzZW1pbmF0aW9uIG9mIHRoaXMgaW5mb3JtYXRpb24gb3IgcmVwcm9kdWN0aW9uIG9mIHRoaXMgbWF0ZXJpYWxcbiAqIGlzIHN0cmljdGx5IGZvcmJpZGRlbiB1bmxlc3MgcHJpb3Igd3JpdHRlbiBwZXJtaXNzaW9uIGlzIG9idGFpbmVkXG4gKiBmcm9tIEFkb2JlIFN5c3RlbXMgSW5jb3Jwb3JhdGVkLlxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbnN0YW50cyB9IGZyb20gJy4uL2NvbnN0YW50cyc7XG5pbXBvcnQgeyBVdGlscyB9IGZyb20gJy4uL3V0aWxzJztcblxuY29uc3QgUExBQ0VIT0xERVJfQ0xBU1NfTkFNRVMgPSBDb25zdGFudHMuTkVXX1NFQ1RJT05fQ0xBU1NfTkFNRVM7XG5jb25zdCBQTEFDRUhPTERFUl9JVEVNX05BTUUgPSAnKic7XG5jb25zdCBDT05UQUlORVJfQ0xBU1NfTkFNRVMgPSAnYWVtLWNvbnRhaW5lcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FlbS1jb250YWluZXInLFxuICBob3N0OiB7XG4gICAgICAnW2NsYXNzXSc6ICdob3N0Q2xhc3NlcycsXG4gICAgICAnW2F0dHIuZGF0YS1jcS1kYXRhLXBhdGhdJzonY3FQYXRoJ1xuICB9LFxuICB0ZW1wbGF0ZVVybDogJy4vYWVtLWNvbnRhaW5lci5jb21wb25lbnQuaHRtbCdcbn0pXG4vKipcbiAqIFRoZSBjdXJyZW50IGNvbXBvbmVudCBwcm92aWRlcyB0aGUgYmFzZSBwcmVzZW50YXRpb25hbCBsb2dpYyBjb21tb24gdG8gY29udGFpbmVycyBzdWNoIGFzIGEgZ3JpZCBvciBhIHBhZ2UuXG4gKiBDb250YWluZXIgaGF2ZSBpbiBjb21tb24gdGhlIG5vdGlvbiBvZiBpdGVtIGhvbGRlcnMuIEl0ZW1zIGFyZSByZXByZXNlbnRlZCBpbiB0aGUgbW9kZWwgYnkgdGhlIGZpZWxkcyBfOml0ZW1zXyBhbmQgXzppdGVtc09yZGVyX1xuICovXG5leHBvcnQgY2xhc3MgQUVNQ29udGFpbmVyQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIE1hcCBvZiBtb2RlbCBpdGVtcyBpbmNsdWRlZCBpbiB0aGUgY3VycmVudCBjb250YWluZXJcbiAgICovXG4gIEBJbnB1dCgpIGNxSXRlbXM7XG4gIC8qKlxuICAgKiBBcnJheSBvZiBtb2RlbCBpdGVtIGtleXNcbiAgICovXG4gIEBJbnB1dCgpIGNxSXRlbXNPcmRlcjtcbiAgLyoqXG4gICAqIFBhdGggdG8gdGhlIG1vZGVsIGFzc29jaWF0ZWQgd2l0aCB0aGUgY3VycmVudCBpbnN0YW5jZSBvZiB0aGUgY29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBjcVBhdGg6IHN0cmluZyA9ICcnO1xuICAvKipcbiAgICogS2V5IG9mIHRoZSBtb2RlbCBzdHJ1Y3R1cmVcbiAgICovXG4gIEBJbnB1dCgpIG1vZGVsTmFtZTogc3RyaW5nID0gJyc7XG4gIC8qKlxuICAgKiBDbGFzcyBuYW1lcyBvZiB0aGUgY3VycmVudCBjb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGNsYXNzTmFtZXM6IHN0cmluZztcblxuICAvKipcbiAgICogUmV0dXJucyB3ZWF0aGVyIG9mIG5vdCB3ZSBhcmUgaW4gdGhlIGVkaXRvclxuICAgKi9cbiAgZ2V0IGlzSW5FZGl0TW9kZSgpIHtcbiAgICByZXR1cm4gVXRpbHMuaXNJbkVkaXRvcigpO1xuICB9XG5cbiAgLyoqXG4gICAqIFJldHVybnMgdGhlIGFnZ3JlZ2F0ZWQgcGF0aCBvZiB0aGlzIGNvbnRhaW5lciBwYXRoIGFuZCB0aGUgcHJvdmlkZWQgcGF0aFxuICAgKlxuICAgKiBAcGFyYW0gcGF0aCAtIHRoZSBwcm92aWRlZCBwYXRoIHRvIGFnZ3JlZ2F0ZSB3aXRoIHRoZSBjb250YWluZXIgcGF0aFxuICAgKi9cbiAgZ2V0RGF0YVBhdGgocGF0aCkge1xuICAgIHJldHVybiB0aGlzLmNxUGF0aCA/IHRoaXMuY3FQYXRoICsgJy8nICsgcGF0aCA6IHBhdGg7XG4gIH1cblxuICAvKipcbiAgICogUmV0dXJucyB0aGUgaXRlbSBkYXRhIGZyb20gdGhlIGNxTW9kZWxcbiAgICpcbiAgICogQHBhcmFtIGl0ZW1LZXkgLSB0aGUgaXRlbUtleSB0byBsb29rIGZvciBpbiB0aGUgaXRlbXMuXG4gICAqL1xuICBnZXRJdGVtKGl0ZW1LZXkpIHtcbiAgICByZXR1cm4gdGhpcy5jcUl0ZW1zICYmIHRoaXMuY3FJdGVtc1tpdGVtS2V5XTtcbiAgfVxuXG4gIC8qKlxuICAgKiBSZXR1cm5zIHRoZSBjbGFzcyBuYW1lcyBvZiB0aGUgY29udGFpbmVyIGJhc2VkIG9uIHRoZSBkYXRhIGZyb20gdGhlIGNxTW9kZWxcbiAgICovXG4gIGdldEhvc3RDbGFzc05hbWVzKCkge1xuICAgIHJldHVybiBDT05UQUlORVJfQ0xBU1NfTkFNRVM7XG4gIH1cblxuICBnZXQgaG9zdENsYXNzZXMgKCkge1xuICAgIHJldHVybiB0aGlzLmdldEhvc3RDbGFzc05hbWVzKCk7XG4gIH1cblxuICAvKipcbiAgICogUmV0dXJucyB0aGUgcGxhY2Vob2xkZXIgY2xhc3Nlc1xuICAgKi9cbiAgZ2V0UGxhY2Vob2xkZXJDbGFzc05hbWVzKCkge1xuICAgIHJldHVybiBQTEFDRUhPTERFUl9DTEFTU19OQU1FUztcbiAgfVxuXG4gIC8qKlxuICAgKiBSZXR1cm5zIHRoZSBwbGFjZWhvbGRlciBwYXRoXG4gICAqL1xuICBnZXQgcGxhY2Vob2xkZXJQYXRoKCkge1xuICAgIHJldHVybiB0aGlzLmNxUGF0aCAmJiB0aGlzLmNxUGF0aCArICcvJyArIFBMQUNFSE9MREVSX0lURU1fTkFNRTtcbiAgfVxufVxuXG4iXX0=