UNPKG

novo-elements

Version:

752 lines (745 loc) 39.3 kB
import * as i0 from '@angular/core'; import { Pipe, Injectable, Input, ChangeDetectionStrategy, Component, HostBinding, NgModule } from '@angular/core'; import { findByCountryId, Helpers, BooleanInput } from 'novo-elements/utils'; import * as i1$1 from '@angular/common'; import { CommonModule } from '@angular/common'; import * as i1 from '@angular/platform-browser'; import * as i2 from 'novo-elements/services'; import * as i2$1 from 'novo-elements/elements/common'; import { NovoCommonModule } from 'novo-elements/elements/common'; import * as i3 from 'novo-elements/elements/icon'; import { NovoIconModule } from 'novo-elements/elements/icon'; // NG2 /** * @classdesc * Renders data appropriately based on the data type found in Meta * All data types defined by bullhorn should be supported: * * - **String**: trims value and returns * - **Integer**: return value * - **Double**: return value fixed to 2 decimals * - **BigDecimal**: return value fixed to 2 decimals * - **Address**: only city and/or state returned * - **Address1**: only city and/or state returned * - **AddressWithoutCountry**: only city and/or state returned * - **Currency**: put a $ in front * - **Percentage**: divide by 100 fix to 2 decimals place and return * - **Options**: returns the appropriate 'label' for the 'value' from 'options' * - **Array**: returns list comma separated * - **DateTime**: formats the date * - **TimeStamp**: formats the date * - **ToOne**: return the entity specific name (ie. name, firstName lastName, title, ...) * - **ToMany**: return an array of the entity specific names (ie. name, firstName lastName, title, ...) * * @example * ``` * {{ expression | render:field }} * ``` */ class RenderPipe { constructor(changeDetector, sanitizationService, labels) { this.changeDetector = changeDetector; this.sanitizationService = sanitizationService; this.labels = labels; } equals(objectOne, objectTwo) { if (objectOne === objectTwo) { return true; } if (objectOne === null || objectTwo === null) { return false; } if (objectOne !== objectOne && objectTwo !== objectTwo) { return true; } const t1 = typeof objectOne; const t2 = typeof objectTwo; let length; let key; let keySet; if (t1 === t2 && t1 === 'object') { if (Array.isArray(objectOne)) { if (!Array.isArray(objectTwo)) { return false; } length = objectOne.length; if (length === objectTwo.length) { for (key = 0; key < length; key++) { if (!this.equals(objectOne[key], objectTwo[key])) { return false; } } return true; } } else { if (Array.isArray(objectTwo)) { return false; } keySet = Object.create(null); for (key in objectOne) { if (objectOne[key]) { if (!this.equals(objectOne[key], objectTwo[key])) { return false; } keySet[key] = true; } } for (key in objectTwo) { if (!(key in keySet) && typeof objectTwo[key] !== 'undefined') { return false; } } return true; } } return false; } getEntityLabel(item, entity) { switch (entity) { case 'CorporateUser': case 'ClientContact': case 'ClientContact1': case 'ClientContact2': case 'ClientContact3': case 'ClientContact4': case 'ClientContact5': case 'Lead': case 'Candidate': case 'Person': return `${item.firstName || ''} ${item.lastName || ''}`.trim(); case 'ClientCorporation': case 'ClientCorporation1': case 'ClientCorporation2': case 'ClientCorporation3': case 'ClientCorporation4': case 'ClientCorporation5': return `${item.name || ''}`.trim(); case 'JobOrder': case 'JobOrder1': case 'JobOrder2': case 'JobOrder3': case 'JobOrder4': case 'JobOrder5': case 'Opportunity': return `${item.title || ''}`.trim(); case 'Placement': let label = ''; if (item.candidate) { label = `${item.candidate.firstName} ${item.candidate.lastName}`.trim(); } if (item.jobOrder) { label = `${label} - ${item.jobOrder.title}`.trim(); } return label; default: return ''; } } /** * Define the fields to set or retrieve for the given entity. Getter and Setter methods will automagically * be set up on the entity once the fields are defined. * @param args - fields can either be sent as a list of arguments or as an Array * @return text */ render(value, args) { let type = null; let text = value; // Handle when we don't have meta, but passing an entity if (value && value._subtype && !args) { return this.getEntityLabel(value, value._subtype); } // Stop logic for nulls if (value === undefined || value === null || !args) { return text; } if (args.formatter && typeof args.formatter === 'function') { return args.formatter(value, args); } // TODO move this to a service // Determine TYPE because its not just 1 value that determines this. if (args.type === 'TO_MANY') { type = 'ToMany'; } else if (args.type === 'TO_ONE') { type = args.associatedEntity.entity; } else if (args.dataSpecialization === 'DATETIME') { type = 'DateTime'; } else if (args.dataSpecialization === 'YEAR') { type = 'Year'; } else if (args.dataSpecialization === 'TIME') { type = 'Time'; } else if (args.dataSpecialization === 'DATE' && args.dataType === 'Date') { type = 'Date'; } else if (args.dataType === 'Timestamp') { type = 'Timestamp'; } else if (['mobile', 'phone', 'phone1', 'phone2', 'phone3', 'workPhone'].indexOf(args.name) > -1) { type = 'Phone'; } else if (args.name && args.name.substring(0, 5) === 'email') { type = 'Email'; } else if ((args.name && args.name === 'address.countryID') || args.optionsType === 'Country') { type = 'Country'; } else if (args.optionsType === 'SkillText') { type = 'SkillText'; } else if (args.options || args.inputType === 'SELECT' || args.inputType === 'CHECKBOX') { type = 'Options'; } else if (['MONEY', 'PERCENTAGE', 'HTML', 'SSN'].indexOf(args.dataSpecialization) > -1) { type = this.capitalize(args.dataSpecialization.toLowerCase()); } else { type = args.dataType || 'default'; } // Transform data here try { switch (type) { case 'Address': case 'Address1': case 'AddressWithoutCountry': case 'SecondaryAddress': case 'BillingAddress': const country = findByCountryId(Number(value.countryName)); text = ''; if (value.address1 || value.address2) { text += `${value.address1 || ''} ${value.address2 || ''}<br />\n`; } text += `${value.city || ''} ${value.state || ''} ${value.zip || ''}${value.city || value.state || value.zip ? '<br />\n' : ''}`; text += `${country ? country.name : value.countryName || ''}${country || value.countryName ? '<br />\n' : ''}`; text = this.sanitizationService.bypassSecurityTrustHtml(text.trim()); break; case 'DateTime': case 'Timestamp': text = this.labels.formatDateShort(value); break; case 'Date': text = this.labels.formatDate(new Date(value)); break; case 'Year': text = new Date(value).getFullYear(); break; case 'Time': text = this.labels.formatTimeWithFormat(value, { hour: 'numeric', minute: 'numeric' }); break; case 'Phone': case 'Email': text = value; break; case 'Money': text = this.labels.formatCurrency(value); break; case 'Percentage': text = this.labels.formatNumber(parseFloat(value).toString(), { style: 'percent', minimumFractionDigits: 2 }); break; case 'Double': case 'BigDecimal': text = this.labels.formatNumber(value, { minimumFractionDigits: this.getNumberDecimalPlaces(value) }); break; case 'Integer': text = value; break; case 'BusinessSector': case 'Category': case 'Certification': case 'ClientCorporation': case 'CorporationDepartment': case 'DistributionList': case 'Skill': case 'Tearsheet': case 'Specialty': text = value.label || value.name || ''; break; case 'SkillText': text = Array.isArray(value) ? value.join(', ') : value; break; case 'Lead': case 'Candidate': case 'ClientContact': case 'CorporateUser': case 'Person': text = value.label || `${value.firstName || ''} ${value.lastName || ''}`; break; case 'Opportunity': case 'JobOrder': text = value.label || value.title || ''; break; case 'Placement': if (value.candidate) { text = `${value.candidate.firstName || ''} ${value.candidate.lastName || ''}`; } if (value.jobOrder) { text = value.candidate ? `${text} - ${value.jobOrder.title || ''}` : `${value.jobOrder.title || ''}`; } break; case 'JobSubmission': text = value.label || `${value.jobOrder ? `${value.jobOrder.title} - ` : ''} ${value.candidate ? value.candidate.firstName : ''} ${value.candidate ? value.candidate.lastName : ''}`; break; case 'WorkersCompensationRate': text = `${value.compensation ? `${value.compensation.code} - ` : ''} ${value.compensation ? value.compensation.name : ''}`; break; case 'Options': text = this.options(value, args.options, args); break; case 'ToMany': if (['Candidate', 'CorporateUser', 'Person'].indexOf(args.associatedEntity.entity) > -1) { text = this.concat(value.data, 'firstName', 'lastName'); if (value.data.length < value.total) { text = text + ', ' + this.labels.getToManyPlusMore({ quantity: value.total - value.data.length }); } } else if (['Category', 'BusinessSector', 'Skill', 'Specialty', 'ClientCorporation', 'CorporationDepartment'].indexOf(args.associatedEntity.entity) > -1) { text = this.concat(value.data, 'name'); if (value.data.length < value.total) { text = text + ', ' + this.labels.getToManyPlusMore({ quantity: value.total - value.data.length }); } } else if (args.associatedEntity.entity === 'MailListPushHistoryDetail') { text = this.concat(value.data, 'externalListName'); } else { text = `${value.total || ''}`; } break; case 'Country': const countryObj = findByCountryId(Number(value)); text = countryObj ? countryObj.name : value; break; case 'Html': if (Array.isArray(value)) { value = value.join(' '); } if (typeof text === 'string') { text = this.sanitizationService.bypassSecurityTrustHtml(value.replace(/\<a/gi, '<a target="_blank"')); } break; case 'CandidateComment': text = value.comments ? `${this.labels.formatDateShort(value.dateLastModified)} (${value.name}) - ${value.comments}` : ''; break; default: text = value.trim ? value.trim() : value; break; } return text; } catch (e) { console.error(`WARNING: There was a problem rendering the value of the field: ${args.label}. Please check the configuration`); console.error(e); return text; } } updateValue(value, args) { this.value = this.render(value, args); this.changeDetector.markForCheck(); } transform(value, args) { if (value === undefined || value === null) { return ''; } if (this.equals(value, this.lastValue) && this.equals(args, this.lastArgs)) { return this.value; } this.lastValue = value; this.lastArgs = args; this.updateValue(this.lastValue, this.lastArgs); return this.value; } /** * Simple function concat a list of fields from a list of objects * @param list - the list of values to use * @param fields - list of fields to extract */ concat(list, ...fields) { const data = []; for (const item of list) { const label = []; for (const field of fields) { label.push(`${item[field]}`); } data.push(label.join(' ')); } return data.join(', '); } /** * Simple function to look up the **label** to display from options * @param value - the value to find * @param list - list of options (label/value pairs) */ options(value, list, args) { if (!Array.isArray(value)) { value = [value]; } try { return value.map((item) => { for (const option of list) { if (option.value === item) { return option.label; } } return item; }); } catch (e) { if (!args.optionsType) { throw Error(e); } return value; } } getNumberDecimalPlaces(value) { let decimalPlaces; if (value) { const numberString = parseFloat(value).toString(); const decimalPlace = (numberString || '').split('.')[1] || ''; decimalPlaces = decimalPlace.length; } return decimalPlaces || 1; } /** * Capitalizes the first letter */ capitalize(value) { return value.charAt(0).toUpperCase() + value.slice(1); } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RenderPipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.DomSanitizer }, { token: i2.NovoLabelService }], target: i0.ɵɵFactoryTarget.Pipe }); } static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: RenderPipe, isStandalone: false, name: "render", pure: false }); } static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RenderPipe }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: RenderPipe, decorators: [{ type: Pipe, args: [{ name: 'render', pure: false, standalone: false, }] }, { type: Injectable }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.DomSanitizer }, { type: i2.NovoLabelService }] }); // NG2 class EntityList { constructor() { this.baseEntity = ''; this.ENTITY_SHORT_NAMES = { Lead: 'lead', ClientContact: 'contact', ClientContact1: 'contact', ClientContact2: 'contact', ClientContact3: 'contact', ClientContact4: 'contact', ClientContact5: 'contact', ClientCorporation: 'company', ClientCorporation1: 'company', ClientCorporation2: 'company', ClientCorporation3: 'company', ClientCorporation4: 'company', ClientCorporation5: 'company', Opportunity: 'opportunity', Task: 'task', Note: 'note', CorporateUser: 'user', Candidate: 'candidate', JobOrder: 'job', JobOrder1: 'job', JobOrder2: 'job', JobOrder3: 'job', JobOrder4: 'job', JobOrder5: 'job', Placement: 'placement', JobSubmission: 'submission', CandidateReference: 'references', DistributionList: 'distributionList', Appointment: 'appointment', }; } ngOnInit() { // use a local copy of the meta to set the type to TO_ONE for proper display // without changing the input object this.metaDisplay = Helpers.deepClone(this.meta); this.metaDisplay.type = 'TO_ONE'; this.baseEntity = this.meta.associatedEntity.entity; for (const entity of this.data.data) { entity.isLinkable = this.isLinkable(entity); entity.class = this.getClass(entity); } } getClass(entity) { return this.ENTITY_SHORT_NAMES[entity.personSubtype]; } openLink(entity) { entity.openLink(entity); } isLinkable(entity) { return entity.openLink; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityList, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: EntityList, isStandalone: false, selector: "novo-entity-list", inputs: { data: "data", meta: "meta" }, ngImport: i0, template: ` <div *ngFor="let entity of data.data" class="entity"> <a *ngIf="entity.isLinkable" (click)="openLink(entity)"> <i class="bhi-circle {{ entity.class }}"></i>{{ entity | render: metaDisplay }} </a> <span *ngIf="!entity.isLinkable && entity.personSubtype"> <i class="bhi-circle {{ entity.class }}"></i>{{ entity | render: metaDisplay }} </span> <span *ngIf="!entity.isLinkable && !entity.personSubtype"> {{ entity | render: metaDisplay }} </span> </div> `, isInline: true, dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: RenderPipe, name: "render" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: EntityList, decorators: [{ type: Component, args: [{ selector: 'novo-entity-list', changeDetection: ChangeDetectionStrategy.OnPush, template: ` <div *ngFor="let entity of data.data" class="entity"> <a *ngIf="entity.isLinkable" (click)="openLink(entity)"> <i class="bhi-circle {{ entity.class }}"></i>{{ entity | render: metaDisplay }} </a> <span *ngIf="!entity.isLinkable && entity.personSubtype"> <i class="bhi-circle {{ entity.class }}"></i>{{ entity | render: metaDisplay }} </span> <span *ngIf="!entity.isLinkable && !entity.personSubtype"> {{ entity | render: metaDisplay }} </span> </div> `, standalone: false, }] }], ctorParameters: () => [], propDecorators: { data: [{ type: Input }], meta: [{ type: Input }] } }); var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; }; var __metadata = (this && this.__metadata) || function (k, v) { if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v); }; // APP var NOVO_VALUE_TYPE; (function (NOVO_VALUE_TYPE) { NOVO_VALUE_TYPE[NOVO_VALUE_TYPE["DEFAULT"] = 0] = "DEFAULT"; NOVO_VALUE_TYPE[NOVO_VALUE_TYPE["ENTITY_LIST"] = 1] = "ENTITY_LIST"; NOVO_VALUE_TYPE[NOVO_VALUE_TYPE["LINK"] = 2] = "LINK"; NOVO_VALUE_TYPE[NOVO_VALUE_TYPE["INTERNAL_LINK"] = 3] = "INTERNAL_LINK"; })(NOVO_VALUE_TYPE || (NOVO_VALUE_TYPE = {})); var NOVO_VALUE_THEME; (function (NOVO_VALUE_THEME) { NOVO_VALUE_THEME[NOVO_VALUE_THEME["DEFAULT"] = 0] = "DEFAULT"; NOVO_VALUE_THEME[NOVO_VALUE_THEME["MOBILE"] = 1] = "MOBILE"; })(NOVO_VALUE_THEME || (NOVO_VALUE_THEME = {})); class NovoValueElement { constructor() { this.meta = { type: 'SCALAR', label: '' }; // TODO use interface this.theme = NOVO_VALUE_THEME.DEFAULT; this.row = false; this.NOVO_VALUE_TYPE = NOVO_VALUE_TYPE; this.NOVO_VALUE_THEME = NOVO_VALUE_THEME; this.customClass = ''; } set label(lbl) { this.meta.label = lbl; } get label() { return this.meta.label; } set type(typ) { this.meta.type = typ; } get type() { return this.meta.type; } set icon(value) { this.meta.icon = value; } get icon() { return this.meta.icon; } ngOnInit() { if (Helpers.isEmpty(this.meta)) { this.meta = { label: '', }; } } get isMobile() { return this.theme === NOVO_VALUE_THEME.MOBILE; } iconClass(icon) { let iconClass = ''; if (icon && icon.iconCls) { iconClass = `bhi-${icon.iconCls} actions`; if (icon.onIconClick) { iconClass = `${iconClass} clickable`; } return iconClass; } return iconClass; } get isDefault() { return true; } get showLabel() { return (this._type === NOVO_VALUE_TYPE.INTERNAL_LINK || this._type === NOVO_VALUE_TYPE.LINK || this._type === NOVO_VALUE_TYPE.ENTITY_LIST); } get showIcon() { return this.meta && this.meta.icons && this.meta.icons.length && !Helpers.isEmpty(this.data); } onValueClick(icon) { if (icon.onIconClick && typeof icon.onIconClick === 'function') { icon.onIconClick(this.data, this.meta); } } openLink() { if (this.meta && this.meta.openLink && typeof this.meta.openLink === 'function') { this.meta.openLink(this.data, this.meta); } } ngOnChanges(changes) { if (this.meta && this.isLinkField(this.meta, this.data)) { this._type = NOVO_VALUE_TYPE.LINK; // Make sure the value has a protocol, otherwise the URL will be relative const hasProtocol = new RegExp('^(http|https)://', 'i'); if (!hasProtocol.test(this.data)) { this.url = `http://${this.data}`; } else { this.url = this.data; } } else if (this.isEntityList(this.meta.type)) { this._type = NOVO_VALUE_TYPE.ENTITY_LIST; } else if (this.isHTMLField(this.meta)) { this.customClass = this.meta.customClass ? this.meta.customClass : ''; if (this.meta.stripHTML && this.data && this.data.replace) { this.data = this.data.replace(/<(?!style|\/style).+?>/gi, '').trim(); } } else if (this.meta && this.meta.associatedEntity) { switch (this.meta.associatedEntity.entity) { case 'ClientCorporation': case 'ClientContact': case 'Candidate': case 'Opportunity': case 'JobOrder': case 'Placement': case 'Lead': this._type = NOVO_VALUE_TYPE.INTERNAL_LINK; break; default: break; } } } isLinkField(field, data) { const linkFields = ['companyURL', 'clientCorporationCompanyURL']; const regex = new RegExp('^(https?://(?:www.|(?!www))[^s.]+.[^s]{2,}|www.[^s]+.[^s]{2,})$', 'gi'); const isURL = Helpers.isString(data) && regex.exec(data.trim()); return linkFields.indexOf(field.name) > -1 || !!isURL || field.type === NOVO_VALUE_TYPE.LINK; } isEntityList(type) { return type === 'TO_MANY'; } isHTMLField(meta) { return meta.dataSpecialization === 'HTML' || meta.inputType === 'TEXTAREA'; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NovoValueElement, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: NovoValueElement, isStandalone: false, selector: "novo-value", inputs: { data: "data", meta: "meta", theme: "theme", row: "row", label: "label", type: "type", icon: "icon" }, host: { properties: { "class.horizontal": "this.row", "class.mobile": "this.isMobile" } }, usesOnChanges: true, ngImport: i0, template: ` <div class="value-outer" [ngClass]="customClass"> <novo-label>{{ meta.label }}</novo-label> <span class="value"> <i *ngIf="meta.showEntityIcon" class="bhi-circle {{ meta.entityIconClass }}"></i> <novo-icon *ngIf="meta?.icon">{{ meta.icon }}</novo-icon> <ng-container [ngSwitch]="_type"> <a *ngSwitchCase="NOVO_VALUE_TYPE.INTERNAL_LINK" (click)="openLink()" [innerHTML]="data | render: meta"></a> <a *ngSwitchCase="NOVO_VALUE_TYPE.LINK" class="value" [href]="url" target="_blank" [innerHTML]="data | render: meta"></a> <novo-entity-list *ngSwitchCase="NOVO_VALUE_TYPE.ENTITY_LIST" [data]="data" [meta]="meta"></novo-entity-list> <novo-text *ngSwitchDefault [innerHTML]="data | render: meta"></novo-text> </ng-container> </span> </div> <div class="actions" *ngIf="showIcon"> <i *ngFor="let icon of meta.icons" [class]="iconClass(icon)" (click)="onValueClick(icon)"></i> </div> `, isInline: true, styles: [":host{display:flex;flex-direction:row;max-width:500px;justify-content:space-between;align-items:flex-start;width:max-content;padding:8px}:host i.star{color:#0b344f}:host i.person{color:#fa4}:host i.company{color:#39d}:host i.candidate{color:#4b7}:host i.navigation{color:#202945}:host i.lead{color:#a69}:host i.contact{color:#fa4}:host i.clientcontact{color:#fa4}:host i.opportunity{color:#625}:host i.job{color:#b56}:host i.joborder{color:#b56}:host i.submission{color:#a9adbb}:host i.sendout{color:#747884}:host i.placement{color:#0b344f}:host i.note{color:#747884}:host i.task{color:#4f5361}:host i.distributionList{color:#4f5361}:host i.credential{color:#4f5361}:host i.user{color:#4f5361}:host i.corporateuser{color:#4f5361}:host i.contract{color:#454ea0}:host i.jobCode{color:#696d79}:host i.earnCode{color:#696d79}:host i.billableCharge{color:#696d79}:host i.payableCharge{color:#696d79}:host i.invoiceStatement{color:#696d79}:host.horizontal{width:100%;max-width:100%}:host.horizontal .value-outer{display:grid;width:100%;grid-template-columns:minmax(120px,30%) 1fr}:host .value-outer{display:flex;flex-direction:column;gap:.4rem}:host .actions i{cursor:default;color:#9e9e9e;margin-left:15px;margin-top:7px}:host .actions i.clickable{cursor:pointer;color:#4a89dc}:host .actions.clickable{cursor:pointer;color:#4a89dc}:host ::ng-deep novo-entity-list{display:block}:host ::ng-deep novo-entity-list i.star{color:#0b344f}:host ::ng-deep novo-entity-list i.person{color:#fa4}:host ::ng-deep novo-entity-list i.company{color:#39d}:host ::ng-deep novo-entity-list i.candidate{color:#4b7}:host ::ng-deep novo-entity-list i.navigation{color:#202945}:host ::ng-deep novo-entity-list i.lead{color:#a69}:host ::ng-deep novo-entity-list i.contact{color:#fa4}:host ::ng-deep novo-entity-list i.clientcontact{color:#fa4}:host ::ng-deep novo-entity-list i.opportunity{color:#625}:host ::ng-deep novo-entity-list i.job{color:#b56}:host ::ng-deep novo-entity-list i.joborder{color:#b56}:host ::ng-deep novo-entity-list i.submission{color:#a9adbb}:host ::ng-deep novo-entity-list i.sendout{color:#747884}:host ::ng-deep novo-entity-list i.placement{color:#0b344f}:host ::ng-deep novo-entity-list i.note{color:#747884}:host ::ng-deep novo-entity-list i.task{color:#4f5361}:host ::ng-deep novo-entity-list i.distributionList{color:#4f5361}:host ::ng-deep novo-entity-list i.credential{color:#4f5361}:host ::ng-deep novo-entity-list i.user{color:#4f5361}:host ::ng-deep novo-entity-list i.corporateuser{color:#4f5361}:host ::ng-deep novo-entity-list i.contract{color:#454ea0}:host ::ng-deep novo-entity-list i.jobCode{color:#696d79}:host ::ng-deep novo-entity-list i.earnCode{color:#696d79}:host ::ng-deep novo-entity-list i.billableCharge{color:#696d79}:host ::ng-deep novo-entity-list i.payableCharge{color:#696d79}:host ::ng-deep novo-entity-list i.invoiceStatement{color:#696d79}:host ::ng-deep novo-entity-list .entity{padding-top:6px;padding-bottom:6px}:host ::ng-deep novo-entity-list i{margin-right:6px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "component", type: i2$1.NovoText, selector: "novo-text,[novo-text]", inputs: ["block"] }, { kind: "component", type: i2$1.NovoLabel, selector: "novo-label,[novo-label]", inputs: ["id"] }, { kind: "component", type: i3.NovoIconComponent, selector: "novo-icon", inputs: ["raised", "theme", "shape", "color", "size", "smaller", "larger", "alt", "name"] }, { kind: "component", type: EntityList, selector: "novo-entity-list", inputs: ["data", "meta"] }, { kind: "pipe", type: RenderPipe, name: "render" }] }); } } __decorate([ BooleanInput(), __metadata("design:type", Boolean) ], NovoValueElement.prototype, "row", void 0); i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NovoValueElement, decorators: [{ type: Component, args: [{ selector: 'novo-value', template: ` <div class="value-outer" [ngClass]="customClass"> <novo-label>{{ meta.label }}</novo-label> <span class="value"> <i *ngIf="meta.showEntityIcon" class="bhi-circle {{ meta.entityIconClass }}"></i> <novo-icon *ngIf="meta?.icon">{{ meta.icon }}</novo-icon> <ng-container [ngSwitch]="_type"> <a *ngSwitchCase="NOVO_VALUE_TYPE.INTERNAL_LINK" (click)="openLink()" [innerHTML]="data | render: meta"></a> <a *ngSwitchCase="NOVO_VALUE_TYPE.LINK" class="value" [href]="url" target="_blank" [innerHTML]="data | render: meta"></a> <novo-entity-list *ngSwitchCase="NOVO_VALUE_TYPE.ENTITY_LIST" [data]="data" [meta]="meta"></novo-entity-list> <novo-text *ngSwitchDefault [innerHTML]="data | render: meta"></novo-text> </ng-container> </span> </div> <div class="actions" *ngIf="showIcon"> <i *ngFor="let icon of meta.icons" [class]="iconClass(icon)" (click)="onValueClick(icon)"></i> </div> `, standalone: false, styles: [":host{display:flex;flex-direction:row;max-width:500px;justify-content:space-between;align-items:flex-start;width:max-content;padding:8px}:host i.star{color:#0b344f}:host i.person{color:#fa4}:host i.company{color:#39d}:host i.candidate{color:#4b7}:host i.navigation{color:#202945}:host i.lead{color:#a69}:host i.contact{color:#fa4}:host i.clientcontact{color:#fa4}:host i.opportunity{color:#625}:host i.job{color:#b56}:host i.joborder{color:#b56}:host i.submission{color:#a9adbb}:host i.sendout{color:#747884}:host i.placement{color:#0b344f}:host i.note{color:#747884}:host i.task{color:#4f5361}:host i.distributionList{color:#4f5361}:host i.credential{color:#4f5361}:host i.user{color:#4f5361}:host i.corporateuser{color:#4f5361}:host i.contract{color:#454ea0}:host i.jobCode{color:#696d79}:host i.earnCode{color:#696d79}:host i.billableCharge{color:#696d79}:host i.payableCharge{color:#696d79}:host i.invoiceStatement{color:#696d79}:host.horizontal{width:100%;max-width:100%}:host.horizontal .value-outer{display:grid;width:100%;grid-template-columns:minmax(120px,30%) 1fr}:host .value-outer{display:flex;flex-direction:column;gap:.4rem}:host .actions i{cursor:default;color:#9e9e9e;margin-left:15px;margin-top:7px}:host .actions i.clickable{cursor:pointer;color:#4a89dc}:host .actions.clickable{cursor:pointer;color:#4a89dc}:host ::ng-deep novo-entity-list{display:block}:host ::ng-deep novo-entity-list i.star{color:#0b344f}:host ::ng-deep novo-entity-list i.person{color:#fa4}:host ::ng-deep novo-entity-list i.company{color:#39d}:host ::ng-deep novo-entity-list i.candidate{color:#4b7}:host ::ng-deep novo-entity-list i.navigation{color:#202945}:host ::ng-deep novo-entity-list i.lead{color:#a69}:host ::ng-deep novo-entity-list i.contact{color:#fa4}:host ::ng-deep novo-entity-list i.clientcontact{color:#fa4}:host ::ng-deep novo-entity-list i.opportunity{color:#625}:host ::ng-deep novo-entity-list i.job{color:#b56}:host ::ng-deep novo-entity-list i.joborder{color:#b56}:host ::ng-deep novo-entity-list i.submission{color:#a9adbb}:host ::ng-deep novo-entity-list i.sendout{color:#747884}:host ::ng-deep novo-entity-list i.placement{color:#0b344f}:host ::ng-deep novo-entity-list i.note{color:#747884}:host ::ng-deep novo-entity-list i.task{color:#4f5361}:host ::ng-deep novo-entity-list i.distributionList{color:#4f5361}:host ::ng-deep novo-entity-list i.credential{color:#4f5361}:host ::ng-deep novo-entity-list i.user{color:#4f5361}:host ::ng-deep novo-entity-list i.corporateuser{color:#4f5361}:host ::ng-deep novo-entity-list i.contract{color:#454ea0}:host ::ng-deep novo-entity-list i.jobCode{color:#696d79}:host ::ng-deep novo-entity-list i.earnCode{color:#696d79}:host ::ng-deep novo-entity-list i.billableCharge{color:#696d79}:host ::ng-deep novo-entity-list i.payableCharge{color:#696d79}:host ::ng-deep novo-entity-list i.invoiceStatement{color:#696d79}:host ::ng-deep novo-entity-list .entity{padding-top:6px;padding-bottom:6px}:host ::ng-deep novo-entity-list i{margin-right:6px}\n"] }] }], propDecorators: { data: [{ type: Input }], meta: [{ type: Input }], theme: [{ type: Input }], row: [{ type: HostBinding, args: ['class.horizontal'] }, { type: Input }], label: [{ type: Input }], type: [{ type: Input }], icon: [{ type: Input }], isMobile: [{ type: HostBinding, args: ['class.mobile'] }] } }); // NG2 class NovoValueModule { static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NovoValueModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); } static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.19", ngImport: i0, type: NovoValueModule, declarations: [NovoValueElement, RenderPipe, EntityList], imports: [CommonModule, NovoCommonModule, NovoIconModule], exports: [NovoValueElement, RenderPipe, EntityList] }); } static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NovoValueModule, imports: [CommonModule, NovoCommonModule, NovoIconModule] }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: NovoValueModule, decorators: [{ type: NgModule, args: [{ imports: [CommonModule, NovoCommonModule, NovoIconModule], declarations: [NovoValueElement, RenderPipe, EntityList], exports: [NovoValueElement, RenderPipe, EntityList], }] }] }); /** * Generated bundle index. Do not edit. */ export { EntityList, NOVO_VALUE_THEME, NOVO_VALUE_TYPE, NovoValueElement, NovoValueModule, RenderPipe }; //# sourceMappingURL=novo-elements-elements-value.mjs.map