/*************************************************************************
*
* VLOCITY, INC. CONFIDENTIAL
* __________________
*
* [2014] - [2020] Vlocity, Inc.
* All Rights Reserved.
*
* NOTICE: All information contained herein is, and remains
* the property of Vlocity, Inc. and its suppliers,
* if any. The intellectual and technical concepts contained
* herein are proprietary to Vlocity, Inc. 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 and reproduction, modification or reverse-engineering
* of this material, is prohibited unless prior written permission
* is obtained from Vlocity, Inc.
*
*/
import { LitElement, html } from "lit-element";
import assetAttributesTemplate from "./vlocity-dc-asset-attributes.template";
import VlocityDCBaseComponent from "../vlocity-dc-base-component/vlocity-dc-base-component";
/**
* @class VlocityAssetAttributes
* @extends {LitElement} Extend the LitElement base class
*
* @classdesc
* vlocity-dc-asset-attributes is the component for rendering asset attributes.
* @property {Array} attributes - an array containing list of attributes.
*
* @example
* Sample Usage -
*
* Include the component in your template by adding vlocity-dc-asset-attributes custom tag
*
* <vlocity-dc-asset-attributes .attributes="${attributes}></vlocity-dc-asset-attributes>
*
* | Attribute Name | Type Expected | Required |
* |-------------------|---------------------------------------------------------------------------------|----------|
* | attributes | It expects an object which contains current child asset | Yes |
*
* KEY INFO -
*
* events fired : "none"
*
* events registered : "none"
*
* Dependency - vlocity-dc-asset-attributes is a child level component which is commonly used inside the vlocity-dc-asset-details
* component to display the asset attributes.
*
*
* | Parent Component | Expected Children Components |
* |---------------------------|------------------------------|
* | vlocity-dc-asset-details | none |
*
*
* Sample with slots -
*
* <vlocity-dc-asset-attributes>
* <span slot="{slot_name}">
* Custom HTML elements goes here
* </span>
* </vlocity-dc-asset-attributes>
*
* List of available slots -
*
* | Slot names | Dynamic | Description | Impact |
* |-------------------------- |-------------|------------------------------------|----------------------------------------|
* | dc-asset-attributes | - | Wrapper for asset attributes | Replaces asset attributes |
*
*/
export default class VlocityAssetAttributes extends VlocityDCBaseComponent {
constructor() {
super(); // always call super() first in the ctor.
this.root = this;
this.template = assetAttributesTemplate;
}
/**
* Properties that will be available in the template binding
* @readonly
* @memberof VlocityAssetAttributes
* @static
*/
static get properties() {
return {
attributes: Array
};
}
connectedCallback() {
super.connectedCallback();
}
render() {
return this.template(this);
}
/**
* Method to get color label value
* @memberof VlocityAssetAttributes
*/
getColorValue(attribute) {
const userValue = attribute.userValues;
const value = attribute.values.filter(value => {
return userValue === value.value;
});
return value[0] && value[0].label;
}
}
customElements.define("vlocity-dc-asset-attributes", VlocityAssetAttributes);