@acorex/components 18.12.30 → 18.12.33
Sign up to get free protection for your applications and to get access to all the features.
|
@@ -11,14 +11,11 @@ export class JsonViewerComponent {
|
|
|
11
11
|
}, { allowSignalWrites: true });
|
|
12
12
|
}
|
|
13
13
|
#effect;
|
|
14
|
-
isDate(value) {
|
|
15
|
-
return value instanceof Date;
|
|
16
|
-
}
|
|
17
14
|
convertNestedToArray(obj) {
|
|
18
15
|
return Object.keys(obj).map((key) => ({
|
|
19
16
|
key: key,
|
|
20
17
|
value: this.isDate(obj[key])
|
|
21
|
-
? obj[key]
|
|
18
|
+
? obj[key].toISOString()
|
|
22
19
|
: typeof obj[key] === 'object'
|
|
23
20
|
? this.convertNestedToArray(obj[key])
|
|
24
21
|
: obj[key],
|
|
@@ -30,11 +27,17 @@ export class JsonViewerComponent {
|
|
|
30
27
|
isNumber(i) {
|
|
31
28
|
return typeof i === 'number';
|
|
32
29
|
}
|
|
30
|
+
isDate(value) {
|
|
31
|
+
return value instanceof Date;
|
|
32
|
+
}
|
|
33
|
+
isBoolean(value) {
|
|
34
|
+
return typeof value === 'boolean';
|
|
35
|
+
}
|
|
33
36
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: JsonViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
34
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: JsonViewerComponent, selector: "ax-json-viewer", inputs: { json: { classPropertyName: "json", publicName: "json", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary
|
|
37
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: JsonViewerComponent, selector: "ax-json-viewer", inputs: { json: { classPropertyName: "json", publicName: "json", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary>\"{{ item.key }}\"</summary>\n <div class=\"ax-indent-details\">\n <ng-container *ngTemplateOutlet=\"Recursion; context: { list: item.value }\"></ng-container>\n </div>\n </details>\n } @else {\n <div class=\"ax-flex-container\">\n <p class=\"ax-nowrap\">\"{{ item.key }}\"<span>:</span></p>\n\n <p\n class=\"ax-nowrap ax-indent {{\n isNumber(item.value) || isBoolean(item.value) ? 'ax-number-color' : 'ax-string-color'\n }}\"\n >\n @if (isNumber(item.value) || isBoolean(item.value)) {\n {{ item.value }}\n } @else {\n ''{{ item.value }}''\n }\n </p>\n </div>\n }\n }\n</ng-template>\n", styles: ["ax-json-viewer{padding:1rem;overflow-x:scroll;display:block}ax-json-viewer .ax-number-color{color:rgb(var(--ax-color-neutral-800))}ax-json-viewer .ax-number-color input::-webkit-outer-spin-button,ax-json-viewer .ax-number-color input::-webkit-inner-spin-button{-webkit-appearance:none}ax-json-viewer .ax-string-color{color:#d9393e}ax-json-viewer .ax-indent{margin:0;padding:0;height:fit-content}ax-json-viewer .ax-indent-details{margin:0 2rem;height:fit-content}ax-json-viewer .ax-flex-container{display:flex;justify-content:flex-start;align-items:center;gap:.25rem}ax-json-viewer summary,ax-json-viewer p{color:rgb(var(--ax-color-neutral-500))}ax-json-viewer summary::marker,ax-json-viewer span{color:rgb(var(--ax-color-text-default))}ax-json-viewer details{margin-inline-start:-1rem}ax-json-viewer .ax-nowrap{white-space:nowrap}.ax-dark ax-json-viewer summary,.ax-dark ax-json-viewer p{color:#7cacf8}.ax-dark ax-json-viewer .ax-string-color{color:#5cd5fb}.ax-dark ax-json-viewer .ax-number-color{color:#9980ff}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
35
38
|
}
|
|
36
39
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: JsonViewerComponent, decorators: [{
|
|
37
40
|
type: Component,
|
|
38
|
-
args: [{ selector: 'ax-json-viewer', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary
|
|
41
|
+
args: [{ selector: 'ax-json-viewer', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary>\"{{ item.key }}\"</summary>\n <div class=\"ax-indent-details\">\n <ng-container *ngTemplateOutlet=\"Recursion; context: { list: item.value }\"></ng-container>\n </div>\n </details>\n } @else {\n <div class=\"ax-flex-container\">\n <p class=\"ax-nowrap\">\"{{ item.key }}\"<span>:</span></p>\n\n <p\n class=\"ax-nowrap ax-indent {{\n isNumber(item.value) || isBoolean(item.value) ? 'ax-number-color' : 'ax-string-color'\n }}\"\n >\n @if (isNumber(item.value) || isBoolean(item.value)) {\n {{ item.value }}\n } @else {\n ''{{ item.value }}''\n }\n </p>\n </div>\n }\n }\n</ng-template>\n", styles: ["ax-json-viewer{padding:1rem;overflow-x:scroll;display:block}ax-json-viewer .ax-number-color{color:rgb(var(--ax-color-neutral-800))}ax-json-viewer .ax-number-color input::-webkit-outer-spin-button,ax-json-viewer .ax-number-color input::-webkit-inner-spin-button{-webkit-appearance:none}ax-json-viewer .ax-string-color{color:#d9393e}ax-json-viewer .ax-indent{margin:0;padding:0;height:fit-content}ax-json-viewer .ax-indent-details{margin:0 2rem;height:fit-content}ax-json-viewer .ax-flex-container{display:flex;justify-content:flex-start;align-items:center;gap:.25rem}ax-json-viewer summary,ax-json-viewer p{color:rgb(var(--ax-color-neutral-500))}ax-json-viewer summary::marker,ax-json-viewer span{color:rgb(var(--ax-color-text-default))}ax-json-viewer details{margin-inline-start:-1rem}ax-json-viewer .ax-nowrap{white-space:nowrap}.ax-dark ax-json-viewer summary,.ax-dark ax-json-viewer p{color:#7cacf8}.ax-dark ax-json-viewer .ax-string-color{color:#5cd5fb}.ax-dark ax-json-viewer .ax-number-color{color:#9980ff}\n"] }]
|
|
39
42
|
}] });
|
|
40
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
43
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoianNvbi12aWV3ZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2pzb24tdmlld2VyL3NyYy9saWIvanNvbi12aWV3ZXIvanNvbi12aWV3ZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2pzb24tdmlld2VyL3NyYy9saWIvanNvbi12aWV3ZXIvanNvbi12aWV3ZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBUXBGLE1BQU0sT0FBTyxtQkFBbUI7SUFOaEM7UUFPRSxTQUFJLEdBQUcsS0FBSyxFQUFPLENBQUM7UUFFcEIsa0JBQWEsR0FBRyxNQUFNLENBQUMsSUFBSSxDQUFDLENBQUM7UUFFN0IsWUFBTyxHQUFHLE1BQU0sQ0FDZCxHQUFHLEVBQUU7WUFDSCxNQUFNLGlCQUFpQixHQUFHLElBQUksQ0FBQyxvQkFBb0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLENBQUMsQ0FBQztZQUNqRSxJQUFJLENBQUMsYUFBYSxDQUFDLEdBQUcsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQzVDLENBQUMsRUFDRCxFQUFFLGlCQUFpQixFQUFFLElBQUksRUFBRSxDQUM1QixDQUFDO0tBNEJIO0lBbENDLE9BQU8sQ0FNTDtJQUVRLG9CQUFvQixDQUFDLEdBQUc7UUFDaEMsT0FBTyxNQUFNLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxDQUFDLEdBQUcsRUFBRSxFQUFFLENBQUMsQ0FBQztZQUNwQyxHQUFHLEVBQUUsR0FBRztZQUNSLEtBQUssRUFBRSxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsQ0FBQztnQkFDMUIsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsQ0FBQyxXQUFXLEVBQUU7Z0JBQ3hCLENBQUMsQ0FBQyxPQUFPLEdBQUcsQ0FBQyxHQUFHLENBQUMsS0FBSyxRQUFRO29CQUM1QixDQUFDLENBQUMsSUFBSSxDQUFDLG9CQUFvQixDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUMsQ0FBQztvQkFDckMsQ0FBQyxDQUFDLEdBQUcsQ0FBQyxHQUFHLENBQUM7U0FDZixDQUFDLENBQUMsQ0FBQztJQUNOLENBQUM7SUFFUyxPQUFPLENBQUMsSUFBUztRQUN6QixPQUFPLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUVTLFFBQVEsQ0FBQyxDQUFNO1FBQ3ZCLE9BQU8sT0FBTyxDQUFDLEtBQUssUUFBUSxDQUFDO0lBQy9CLENBQUM7SUFFUyxNQUFNLENBQUMsS0FBVTtRQUN6QixPQUFPLEtBQUssWUFBWSxJQUFJLENBQUM7SUFDL0IsQ0FBQztJQUVTLFNBQVMsQ0FBQyxLQUFVO1FBQzVCLE9BQU8sT0FBTyxLQUFLLEtBQUssU0FBUyxDQUFDO0lBQ3BDLENBQUM7OEdBdENVLG1CQUFtQjtrR0FBbkIsbUJBQW1CLHVMQ1JoQyw4OUJBOEJBOzsyRkR0QmEsbUJBQW1CO2tCQU4vQixTQUFTOytCQUNFLGdCQUFnQixpQkFHWCxpQkFBaUIsQ0FBQyxJQUFJIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBlZmZlY3QsIGlucHV0LCBzaWduYWwsIFZpZXdFbmNhcHN1bGF0aW9uIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2F4LWpzb24tdmlld2VyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2pzb24tdmlld2VyLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmw6ICcuL2pzb24tdmlld2VyLmNvbXBvbmVudC5zY3NzJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgSnNvblZpZXdlckNvbXBvbmVudCB7XG4gIGpzb24gPSBpbnB1dDxhbnk+KCk7XG5cbiAgY29udmVydGVkRGF0YSA9IHNpZ25hbChudWxsKTtcblxuICAjZWZmZWN0ID0gZWZmZWN0KFxuICAgICgpID0+IHtcbiAgICAgIGNvbnN0IGRlZXBseU5lc3RlZEFycmF5ID0gdGhpcy5jb252ZXJ0TmVzdGVkVG9BcnJheSh0aGlzLmpzb24oKSk7XG4gICAgICB0aGlzLmNvbnZlcnRlZERhdGEuc2V0KGRlZXBseU5lc3RlZEFycmF5KTtcbiAgICB9LFxuICAgIHsgYWxsb3dTaWduYWxXcml0ZXM6IHRydWUgfSxcbiAgKTtcblxuICBwcm90ZWN0ZWQgY29udmVydE5lc3RlZFRvQXJyYXkob2JqKSB7XG4gICAgcmV0dXJuIE9iamVjdC5rZXlzKG9iaikubWFwKChrZXkpID0+ICh7XG4gICAgICBrZXk6IGtleSxcbiAgICAgIHZhbHVlOiB0aGlzLmlzRGF0ZShvYmpba2V5XSlcbiAgICAgICAgPyBvYmpba2V5XS50b0lTT1N0cmluZygpXG4gICAgICAgIDogdHlwZW9mIG9ialtrZXldID09PSAnb2JqZWN0J1xuICAgICAgICAgID8gdGhpcy5jb252ZXJ0TmVzdGVkVG9BcnJheShvYmpba2V5XSlcbiAgICAgICAgICA6IG9ialtrZXldLFxuICAgIH0pKTtcbiAgfVxuXG4gIHByb3RlY3RlZCBpc0FycmF5KGFycnk6IGFueSkge1xuICAgIHJldHVybiBBcnJheS5pc0FycmF5KGFycnkpO1xuICB9XG5cbiAgcHJvdGVjdGVkIGlzTnVtYmVyKGk6IGFueSkge1xuICAgIHJldHVybiB0eXBlb2YgaSA9PT0gJ251bWJlcic7XG4gIH1cblxuICBwcm90ZWN0ZWQgaXNEYXRlKHZhbHVlOiBhbnkpIHtcbiAgICByZXR1cm4gdmFsdWUgaW5zdGFuY2VvZiBEYXRlO1xuICB9XG5cbiAgcHJvdGVjdGVkIGlzQm9vbGVhbih2YWx1ZTogYW55KSB7XG4gICAgcmV0dXJuIHR5cGVvZiB2YWx1ZSA9PT0gJ2Jvb2xlYW4nO1xuICB9XG59XG4iLCI8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiUmVjdXJzaW9uOyBjb250ZXh0OiB7IGxpc3Q6IGNvbnZlcnRlZERhdGEoKSB9XCI+PC9uZy1jb250YWluZXI+XG5cbjxuZy10ZW1wbGF0ZSAjUmVjdXJzaW9uIGxldC1saXN0PVwibGlzdFwiPlxuICBAZm9yIChpdGVtIG9mIGxpc3Q7IHRyYWNrICRpbmRleCkge1xuICAgIEBpZiAoaXNBcnJheShpdGVtLnZhbHVlKSkge1xuICAgICAgPGRldGFpbHM+XG4gICAgICAgIDxzdW1tYXJ5Plwie3sgaXRlbS5rZXkgfX1cIjwvc3VtbWFyeT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImF4LWluZGVudC1kZXRhaWxzXCI+XG4gICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdUZW1wbGF0ZU91dGxldD1cIlJlY3Vyc2lvbjsgY29udGV4dDogeyBsaXN0OiBpdGVtLnZhbHVlIH1cIj48L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2RldGFpbHM+XG4gICAgfSBAZWxzZSB7XG4gICAgICA8ZGl2IGNsYXNzPVwiYXgtZmxleC1jb250YWluZXJcIj5cbiAgICAgICAgPHAgY2xhc3M9XCJheC1ub3dyYXBcIj5cInt7IGl0ZW0ua2V5IH19XCI8c3Bhbj46PC9zcGFuPjwvcD5cblxuICAgICAgICA8cFxuICAgICAgICAgIGNsYXNzPVwiYXgtbm93cmFwIGF4LWluZGVudCB7e1xuICAgICAgICAgICAgaXNOdW1iZXIoaXRlbS52YWx1ZSkgfHwgaXNCb29sZWFuKGl0ZW0udmFsdWUpID8gJ2F4LW51bWJlci1jb2xvcicgOiAnYXgtc3RyaW5nLWNvbG9yJ1xuICAgICAgICAgIH19XCJcbiAgICAgICAgPlxuICAgICAgICAgIEBpZiAoaXNOdW1iZXIoaXRlbS52YWx1ZSkgfHwgaXNCb29sZWFuKGl0ZW0udmFsdWUpKSB7XG4gICAgICAgICAgICB7eyBpdGVtLnZhbHVlIH19XG4gICAgICAgICAgfSBAZWxzZSB7XG4gICAgICAgICAgICAnJ3t7IGl0ZW0udmFsdWUgfX0nJ1xuICAgICAgICAgIH1cbiAgICAgICAgPC9wPlxuICAgICAgPC9kaXY+XG4gICAgfVxuICB9XG48L25nLXRlbXBsYXRlPlxuIl19
|
|
@@ -15,14 +15,11 @@ class JsonViewerComponent {
|
|
|
15
15
|
}, { allowSignalWrites: true });
|
|
16
16
|
}
|
|
17
17
|
#effect;
|
|
18
|
-
isDate(value) {
|
|
19
|
-
return value instanceof Date;
|
|
20
|
-
}
|
|
21
18
|
convertNestedToArray(obj) {
|
|
22
19
|
return Object.keys(obj).map((key) => ({
|
|
23
20
|
key: key,
|
|
24
21
|
value: this.isDate(obj[key])
|
|
25
|
-
? obj[key]
|
|
22
|
+
? obj[key].toISOString()
|
|
26
23
|
: typeof obj[key] === 'object'
|
|
27
24
|
? this.convertNestedToArray(obj[key])
|
|
28
25
|
: obj[key],
|
|
@@ -34,12 +31,18 @@ class JsonViewerComponent {
|
|
|
34
31
|
isNumber(i) {
|
|
35
32
|
return typeof i === 'number';
|
|
36
33
|
}
|
|
34
|
+
isDate(value) {
|
|
35
|
+
return value instanceof Date;
|
|
36
|
+
}
|
|
37
|
+
isBoolean(value) {
|
|
38
|
+
return typeof value === 'boolean';
|
|
39
|
+
}
|
|
37
40
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: JsonViewerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: JsonViewerComponent, selector: "ax-json-viewer", inputs: { json: { classPropertyName: "json", publicName: "json", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary
|
|
41
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.0", type: JsonViewerComponent, selector: "ax-json-viewer", inputs: { json: { classPropertyName: "json", publicName: "json", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary>\"{{ item.key }}\"</summary>\n <div class=\"ax-indent-details\">\n <ng-container *ngTemplateOutlet=\"Recursion; context: { list: item.value }\"></ng-container>\n </div>\n </details>\n } @else {\n <div class=\"ax-flex-container\">\n <p class=\"ax-nowrap\">\"{{ item.key }}\"<span>:</span></p>\n\n <p\n class=\"ax-nowrap ax-indent {{\n isNumber(item.value) || isBoolean(item.value) ? 'ax-number-color' : 'ax-string-color'\n }}\"\n >\n @if (isNumber(item.value) || isBoolean(item.value)) {\n {{ item.value }}\n } @else {\n ''{{ item.value }}''\n }\n </p>\n </div>\n }\n }\n</ng-template>\n", styles: ["ax-json-viewer{padding:1rem;overflow-x:scroll;display:block}ax-json-viewer .ax-number-color{color:rgb(var(--ax-color-neutral-800))}ax-json-viewer .ax-number-color input::-webkit-outer-spin-button,ax-json-viewer .ax-number-color input::-webkit-inner-spin-button{-webkit-appearance:none}ax-json-viewer .ax-string-color{color:#d9393e}ax-json-viewer .ax-indent{margin:0;padding:0;height:fit-content}ax-json-viewer .ax-indent-details{margin:0 2rem;height:fit-content}ax-json-viewer .ax-flex-container{display:flex;justify-content:flex-start;align-items:center;gap:.25rem}ax-json-viewer summary,ax-json-viewer p{color:rgb(var(--ax-color-neutral-500))}ax-json-viewer summary::marker,ax-json-viewer span{color:rgb(var(--ax-color-text-default))}ax-json-viewer details{margin-inline-start:-1rem}ax-json-viewer .ax-nowrap{white-space:nowrap}.ax-dark ax-json-viewer summary,.ax-dark ax-json-viewer p{color:#7cacf8}.ax-dark ax-json-viewer .ax-string-color{color:#5cd5fb}.ax-dark ax-json-viewer .ax-number-color{color:#9980ff}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
39
42
|
}
|
|
40
43
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0", ngImport: i0, type: JsonViewerComponent, decorators: [{
|
|
41
44
|
type: Component,
|
|
42
|
-
args: [{ selector: 'ax-json-viewer', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary
|
|
45
|
+
args: [{ selector: 'ax-json-viewer', encapsulation: ViewEncapsulation.None, template: "<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary>\"{{ item.key }}\"</summary>\n <div class=\"ax-indent-details\">\n <ng-container *ngTemplateOutlet=\"Recursion; context: { list: item.value }\"></ng-container>\n </div>\n </details>\n } @else {\n <div class=\"ax-flex-container\">\n <p class=\"ax-nowrap\">\"{{ item.key }}\"<span>:</span></p>\n\n <p\n class=\"ax-nowrap ax-indent {{\n isNumber(item.value) || isBoolean(item.value) ? 'ax-number-color' : 'ax-string-color'\n }}\"\n >\n @if (isNumber(item.value) || isBoolean(item.value)) {\n {{ item.value }}\n } @else {\n ''{{ item.value }}''\n }\n </p>\n </div>\n }\n }\n</ng-template>\n", styles: ["ax-json-viewer{padding:1rem;overflow-x:scroll;display:block}ax-json-viewer .ax-number-color{color:rgb(var(--ax-color-neutral-800))}ax-json-viewer .ax-number-color input::-webkit-outer-spin-button,ax-json-viewer .ax-number-color input::-webkit-inner-spin-button{-webkit-appearance:none}ax-json-viewer .ax-string-color{color:#d9393e}ax-json-viewer .ax-indent{margin:0;padding:0;height:fit-content}ax-json-viewer .ax-indent-details{margin:0 2rem;height:fit-content}ax-json-viewer .ax-flex-container{display:flex;justify-content:flex-start;align-items:center;gap:.25rem}ax-json-viewer summary,ax-json-viewer p{color:rgb(var(--ax-color-neutral-500))}ax-json-viewer summary::marker,ax-json-viewer span{color:rgb(var(--ax-color-text-default))}ax-json-viewer details{margin-inline-start:-1rem}ax-json-viewer .ax-nowrap{white-space:nowrap}.ax-dark ax-json-viewer summary,.ax-dark ax-json-viewer p{color:#7cacf8}.ax-dark ax-json-viewer .ax-string-color{color:#5cd5fb}.ax-dark ax-json-viewer .ax-number-color{color:#9980ff}\n"] }]
|
|
43
46
|
}] });
|
|
44
47
|
|
|
45
48
|
const COMPONENT = [JsonViewerComponent];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"acorex-components-json-viewer.mjs","sources":["../../../../libs/components/json-viewer/src/lib/json-viewer/json-viewer.component.ts","../../../../libs/components/json-viewer/src/lib/json-viewer/json-viewer.component.html","../../../../libs/components/json-viewer/src/lib/json-viewer.module.ts","../../../../libs/components/json-viewer/src/acorex-components-json-viewer.ts"],"sourcesContent":["import { Component, effect, input, signal, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-json-viewer',\n templateUrl: './json-viewer.component.html',\n styleUrl: './json-viewer.component.scss',\n encapsulation: ViewEncapsulation.None,\n})\nexport class JsonViewerComponent {\n json = input<any>();\n\n convertedData = signal(null);\n\n #effect = effect(\n () => {\n const deeplyNestedArray = this.convertNestedToArray(this.json());\n this.convertedData.set(deeplyNestedArray);\n },\n { allowSignalWrites: true },\n );\n\n protected
|
|
1
|
+
{"version":3,"file":"acorex-components-json-viewer.mjs","sources":["../../../../libs/components/json-viewer/src/lib/json-viewer/json-viewer.component.ts","../../../../libs/components/json-viewer/src/lib/json-viewer/json-viewer.component.html","../../../../libs/components/json-viewer/src/lib/json-viewer.module.ts","../../../../libs/components/json-viewer/src/acorex-components-json-viewer.ts"],"sourcesContent":["import { Component, effect, input, signal, ViewEncapsulation } from '@angular/core';\n\n@Component({\n selector: 'ax-json-viewer',\n templateUrl: './json-viewer.component.html',\n styleUrl: './json-viewer.component.scss',\n encapsulation: ViewEncapsulation.None,\n})\nexport class JsonViewerComponent {\n json = input<any>();\n\n convertedData = signal(null);\n\n #effect = effect(\n () => {\n const deeplyNestedArray = this.convertNestedToArray(this.json());\n this.convertedData.set(deeplyNestedArray);\n },\n { allowSignalWrites: true },\n );\n\n protected convertNestedToArray(obj) {\n return Object.keys(obj).map((key) => ({\n key: key,\n value: this.isDate(obj[key])\n ? obj[key].toISOString()\n : typeof obj[key] === 'object'\n ? this.convertNestedToArray(obj[key])\n : obj[key],\n }));\n }\n\n protected isArray(arry: any) {\n return Array.isArray(arry);\n }\n\n protected isNumber(i: any) {\n return typeof i === 'number';\n }\n\n protected isDate(value: any) {\n return value instanceof Date;\n }\n\n protected isBoolean(value: any) {\n return typeof value === 'boolean';\n }\n}\n","<ng-container *ngTemplateOutlet=\"Recursion; context: { list: convertedData() }\"></ng-container>\n\n<ng-template #Recursion let-list=\"list\">\n @for (item of list; track $index) {\n @if (isArray(item.value)) {\n <details>\n <summary>\"{{ item.key }}\"</summary>\n <div class=\"ax-indent-details\">\n <ng-container *ngTemplateOutlet=\"Recursion; context: { list: item.value }\"></ng-container>\n </div>\n </details>\n } @else {\n <div class=\"ax-flex-container\">\n <p class=\"ax-nowrap\">\"{{ item.key }}\"<span>:</span></p>\n\n <p\n class=\"ax-nowrap ax-indent {{\n isNumber(item.value) || isBoolean(item.value) ? 'ax-number-color' : 'ax-string-color'\n }}\"\n >\n @if (isNumber(item.value) || isBoolean(item.value)) {\n {{ item.value }}\n } @else {\n ''{{ item.value }}''\n }\n </p>\n </div>\n }\n }\n</ng-template>\n","import { AXTextBoxModule } from '@acorex/components/text-box';\nimport { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { FormsModule } from '@angular/forms';\nimport { JsonViewerComponent } from './json-viewer/json-viewer.component';\n\nconst COMPONENT = [JsonViewerComponent];\n\nconst MODULES = [AXTextBoxModule, FormsModule, CommonModule];\n\n@NgModule({\n declarations: [...COMPONENT],\n imports: [...MODULES],\n exports: [...COMPONENT],\n providers: [],\n})\nexport class AXJsonViewerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -3,10 +3,11 @@ export declare class JsonViewerComponent {
|
|
|
3
3
|
#private;
|
|
4
4
|
json: import("@angular/core").InputSignal<any>;
|
|
5
5
|
convertedData: import("@angular/core").WritableSignal<any>;
|
|
6
|
-
protected isDate(value: any): value is Date;
|
|
7
6
|
protected convertNestedToArray(obj: any): any;
|
|
8
7
|
protected isArray(arry: any): arry is any[];
|
|
9
8
|
protected isNumber(i: any): i is number;
|
|
9
|
+
protected isDate(value: any): value is Date;
|
|
10
|
+
protected isBoolean(value: any): value is boolean;
|
|
10
11
|
static ɵfac: i0.ɵɵFactoryDeclaration<JsonViewerComponent, never>;
|
|
11
12
|
static ɵcmp: i0.ɵɵComponentDeclaration<JsonViewerComponent, "ax-json-viewer", never, { "json": { "alias": "json"; "required": false; "isSignal": true; }; }, {}, never, never, false, never>;
|
|
12
13
|
}
|