| (function (global, factory) { |
| typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/material/tooltip'), require('@angular/material/icon'), require('@angular/cdk/bidi'), require('@covalent/core/common')) : |
| typeof define === 'function' && define.amd ? define('@covalent/core/json-formatter', ['exports', '@angular/core', '@angular/common', '@angular/material/tooltip', '@angular/material/icon', '@angular/cdk/bidi', '@covalent/core/common'], factory) : |
| (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.covalent = global.covalent || {}, global.covalent.core = global.covalent.core || {}, global.covalent.core['json-formatter'] = {}), global.ng.core, global.ng.common, global.ng.material.tooltip, global.ng.material.icon, global.ng.cdk.bidi, global.covalent.core.common)); |
| }(this, (function (exports, core, common$1, tooltip, icon, bidi, common) { 'use strict'; |
| |
| /** |
| * @fileoverview added by tsickle |
| * Generated from: json-formatter.component.ts |
| * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| var TdJsonFormatterComponent = /** @class */ (function () { |
| /** |
| * @param {?} _changeDetectorRef |
| * @param {?} _dir |
| */ |
| function TdJsonFormatterComponent(_changeDetectorRef, _dir) { |
| this._changeDetectorRef = _changeDetectorRef; |
| this._dir = _dir; |
| this._open = false; |
| this._levelsOpen = 0; |
| } |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "levelsOpen", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| return this._levelsOpen; |
| }, |
| /** |
| * levelsOpen?: number |
| * Levels opened by default when JS object is formatted and rendered. |
| * @param {?} levelsOpen |
| * @return {?} |
| */ |
| set: function (levelsOpen) { |
| if (!Number.isInteger(levelsOpen)) { |
| throw new Error('[levelsOpen] needs to be an integer.'); |
| } |
| this._levelsOpen = levelsOpen; |
| this._open = levelsOpen > 0; |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "open", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| return this._open; |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "key", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| /** @type {?} */ |
| var elipsis = this._key && this._key.length > TdJsonFormatterComponent.KEY_MAX_LENGTH ? '…' : ''; |
| return this._key ? this._key.substring(0, TdJsonFormatterComponent.KEY_MAX_LENGTH) + elipsis : this._key; |
| }, |
| /** |
| * key?: string |
| * Tag to be displayed next to formatted object. |
| * @param {?} key |
| * @return {?} |
| */ |
| set: function (key) { |
| this._key = key; |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "data", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| return this._data; |
| }, |
| /** |
| * data: any |
| * JS object to be formatted. |
| * @param {?} data |
| * @return {?} |
| */ |
| set: function (data) { |
| this._data = data; |
| this.parseChildren(); |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "children", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| return this._children; |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| Object.defineProperty(TdJsonFormatterComponent.prototype, "isRTL", { |
| /** |
| * @return {?} |
| */ |
| get: function () { |
| if (this._dir) { |
| return this._dir.dir === 'rtl'; |
| } |
| return false; |
| }, |
| enumerable: false, |
| configurable: true |
| }); |
| /** |
| * Refreshes json-formatter and rerenders [data] |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.refresh = function () { |
| this._changeDetectorRef.markForCheck(); |
| }; |
| /** |
| * Toggles collapse/expanded state of component. |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.toggle = function () { |
| this._open = !this._open; |
| }; |
| /** |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.isObject = function () { |
| return this.getType(this._data) === 'object'; |
| }; |
| /** |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.isArray = function () { |
| return Array.isArray(this._data); |
| }; |
| /** |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.hasChildren = function () { |
| return this._children && this._children.length > 0; |
| }; |
| /** |
| * Gets parsed value depending on value type. |
| * @param {?} value |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.getValue = function (value) { |
| /** @type {?} */ |
| var type = this.getType(value); |
| if (type === 'undefined' || type === 'null') { |
| return type; |
| } |
| else if (type === 'date') { |
| value = new Date(value).toString(); |
| } |
| else if (type === 'string') { |
| value = '"' + value + '"'; |
| } |
| else if (type === 'function') { |
| // Remove content of the function |
| return (value |
| .toString() |
| .replace(/[\r\n]/g, '') |
| .replace(/\{.*\}/, '') + '{…}'); |
| } |
| else if (Array.isArray(value)) { |
| return this.getObjectName() + ' [' + value.length + ']'; |
| } |
| return value; |
| }; |
| /** |
| * Gets type of object. |
| * returns 'null' if object is null and 'date' if value is object and can be parsed to a date. |
| * @param {?} object |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.getType = function (object) { |
| if (typeof object === 'object') { |
| if (!object) { |
| return 'null'; |
| } |
| if (Array.isArray(object)) { |
| return 'object'; |
| } |
| /** @type {?} */ |
| var date = new Date(object); |
| if (Object.prototype.toString.call(date) === '[object Date]' && !Number.isNaN(date.getTime())) { |
| return 'date'; |
| } |
| } |
| return typeof object; |
| }; |
| /** |
| * Generates string representation depending if its an object or function. |
| * see: http://stackoverflow.com/a/332429 |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.getObjectName = function () { |
| /** @type {?} */ |
| var object = this._data; |
| if (this.isObject() && !object.constructor) { |
| return 'Object'; |
| } |
| /** @type {?} */ |
| var funcNameRegex = /function (.{1,})\(/; |
| /** @type {?} */ |
| var results = funcNameRegex.exec(object.constructor.toString()); |
| if (results && results.length > 1) { |
| return results[1]; |
| } |
| else { |
| return ''; |
| } |
| }; |
| /** |
| * Creates preview of nodes children to render in tooltip depending if its an array or an object. |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.getPreview = function () { |
| var _this = this; |
| /** @type {?} */ |
| var previewData; |
| /** @type {?} */ |
| var startChar = '{ '; |
| /** @type {?} */ |
| var endChar = ' }'; |
| if (this.isArray()) { |
| /** @type {?} */ |
| var previewArray = this._data.slice(0, TdJsonFormatterComponent.PREVIEW_LIMIT); |
| previewData = previewArray.map(( /** |
| * @param {?} obj |
| * @return {?} |
| */function (obj) { |
| return _this.getValue(obj); |
| })); |
| startChar = '['; |
| endChar = ']'; |
| } |
| else { |
| /** @type {?} */ |
| var previewKeys = this._children.slice(0, TdJsonFormatterComponent.PREVIEW_LIMIT); |
| previewData = previewKeys.map(( /** |
| * @param {?} key |
| * @return {?} |
| */function (key) { |
| return key + ': ' + _this.getValue(_this._data[key]); |
| })); |
| } |
| /** @type {?} */ |
| var previewString = previewData.join(', '); |
| /** @type {?} */ |
| var ellipsis = previewData.length >= TdJsonFormatterComponent.PREVIEW_LIMIT || |
| previewString.length > TdJsonFormatterComponent.PREVIEW_STRING_MAX_LENGTH |
| ? '…' |
| : ''; |
| return (startChar + previewString.substring(0, TdJsonFormatterComponent.PREVIEW_STRING_MAX_LENGTH) + ellipsis + endChar); |
| }; |
| /** |
| * @private |
| * @return {?} |
| */ |
| TdJsonFormatterComponent.prototype.parseChildren = function () { |
| if (this.isObject()) { |
| this._children = Object.keys(this._data); |
| } |
| }; |
| return TdJsonFormatterComponent; |
| }()); |
| /** |
| * Max length for property names. Any names bigger than this get trunctated. |
| */ |
| TdJsonFormatterComponent.KEY_MAX_LENGTH = 30; |
| /** |
| * Max length for preview string. Any names bigger than this get trunctated. |
| */ |
| TdJsonFormatterComponent.PREVIEW_STRING_MAX_LENGTH = 80; |
| /** |
| * Max tooltip preview elements. |
| */ |
| TdJsonFormatterComponent.PREVIEW_LIMIT = 5; |
| TdJsonFormatterComponent.decorators = [ |
| { type: core.Component, args: [{ |
| changeDetection: core.ChangeDetectionStrategy.OnPush, |
| selector: 'td-json-formatter', |
| template: "<div class=\"td-json-formatter-wrapper\">\n <a\n class=\"td-key\"\n [class.td-key-node]=\"hasChildren()\"\n [class.td-key-leaf]=\"!hasChildren()\"\n [tabIndex]=\"isObject() ? 0 : -1\"\n (keydown.enter)=\"toggle()\"\n (click)=\"toggle()\"\n >\n <mat-icon class=\"td-node-icon\" *ngIf=\"hasChildren()\">\n {{ open ? 'keyboard_arrow_down' : isRTL ? 'keyboard_arrow_left' : 'keyboard_arrow_right' }}\n </mat-icon>\n <span *ngIf=\"key\" class=\"key\">{{ key }}:</span>\n <span class=\"value\">\n <span [class.td-empty]=\"!hasChildren()\" *ngIf=\"isObject()\" [matTooltip]=\"getPreview()\" matTooltipPosition=\"after\">\n <span class=\"td-object-name\">{{ getObjectName() }}</span>\n <span class=\"td-array-length\" *ngIf=\"isArray()\">[{{ data.length }}]</span>\n </span>\n <span *ngIf=\"!isObject()\" [class]=\"getType(data)\">{{ getValue(data) }}</span>\n </span>\n </a>\n <div class=\"td-object-children\" [@tdCollapse]=\"!(hasChildren() && open)\">\n <ng-template let-key ngFor [ngForOf]=\"children\">\n <td-json-formatter [key]=\"key\" [data]=\"data[key]\" [levelsOpen]=\"levelsOpen - 1\"></td-json-formatter>\n </ng-template>\n </div>\n</div>\n", |
| animations: [common.tdCollapseAnimation], |
| styles: [":host{display:block}.td-json-formatter-wrapper{padding-bottom:2px;padding-top:2px}.td-json-formatter-wrapper .td-key{-ms-flex-align:start;-ms-flex-direction:row;-ms-flex-line-pack:center;-ms-flex-pack:start;align-content:center;align-items:flex-start;box-sizing:border-box;display:-ms-flexbox;display:flex;flex-direction:row;justify-content:flex-start;max-width:100%}.td-json-formatter-wrapper .td-key.td-key-node:hover{cursor:pointer}.td-json-formatter-wrapper .td-object-children.ng-animating{overflow:hidden}.td-json-formatter-wrapper .td-object-children .td-key,.td-json-formatter-wrapper .td-object-children .td-object-children{padding-left:24px}::ng-deep [dir=rtl] .td-json-formatter-wrapper .td-object-children .td-key,::ng-deep [dir=rtl] .td-json-formatter-wrapper .td-object-children .td-object-children{padding-left:0;padding-right:24px}.td-json-formatter-wrapper .td-object-children .td-key.td-key-leaf,.td-json-formatter-wrapper .td-object-children .td-object-children.td-key-leaf{padding-left:48px}::ng-deep [dir=rtl] .td-json-formatter-wrapper .td-object-children .td-key.td-key-leaf,::ng-deep [dir=rtl] .td-json-formatter-wrapper .td-object-children .td-object-children.td-key-leaf{padding-left:0;padding-right:48px}.td-json-formatter-wrapper .value{margin-left:5px}::ng-deep [dir=rtl] .td-json-formatter-wrapper .value{padding-left:0;padding-right:5px}.td-json-formatter-wrapper .value .td-empty{opacity:.5;text-decoration:line-through}.td-json-formatter-wrapper .value .date,.td-json-formatter-wrapper .value .string{word-break:break-word}"] |
| }] } |
| ]; |
| /** @nocollapse */ |
| TdJsonFormatterComponent.ctorParameters = function () { return [ |
| { type: core.ChangeDetectorRef }, |
| { type: bidi.Dir, decorators: [{ type: core.Optional }] } |
| ]; }; |
| TdJsonFormatterComponent.propDecorators = { |
| levelsOpen: [{ type: core.Input, args: ['levelsOpen',] }], |
| key: [{ type: core.Input, args: ['key',] }], |
| data: [{ type: core.Input, args: ['data',] }] |
| }; |
| if (false) { |
| /** |
| * Max length for property names. Any names bigger than this get trunctated. |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.KEY_MAX_LENGTH; |
| /** |
| * Max length for preview string. Any names bigger than this get trunctated. |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.PREVIEW_STRING_MAX_LENGTH; |
| /** |
| * Max tooltip preview elements. |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.PREVIEW_LIMIT; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._key; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._data; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._children; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._open; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._levelsOpen; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._changeDetectorRef; |
| /** |
| * @type {?} |
| * @private |
| */ |
| TdJsonFormatterComponent.prototype._dir; |
| } |
| |
| /** |
| * @fileoverview added by tsickle |
| * Generated from: json-formatter.module.ts |
| * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| var CovalentJsonFormatterModule = /** @class */ (function () { |
| function CovalentJsonFormatterModule() { |
| } |
| return CovalentJsonFormatterModule; |
| }()); |
| CovalentJsonFormatterModule.decorators = [ |
| { type: core.NgModule, args: [{ |
| imports: [common$1.CommonModule, tooltip.MatTooltipModule, icon.MatIconModule], |
| declarations: [TdJsonFormatterComponent], |
| exports: [TdJsonFormatterComponent], |
| },] } |
| ]; |
| |
| /** |
| * @fileoverview added by tsickle |
| * Generated from: public-api.ts |
| * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * @fileoverview added by tsickle |
| * Generated from: index.ts |
| * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| /** |
| * @fileoverview added by tsickle |
| * Generated from: covalent-core-json-formatter.ts |
| * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc |
| */ |
| |
| exports.CovalentJsonFormatterModule = CovalentJsonFormatterModule; |
| exports.TdJsonFormatterComponent = TdJsonFormatterComponent; |
| |
| Object.defineProperty(exports, '__esModule', { value: true }); |
| |
| }))); |
| //# sourceMappingURL=covalent-core-json-formatter.umd.js.map |