@kit-data-manager/pid-component
Version:
The PID-Component is a web component that can be used to evaluate and display FAIR Digital Objects, PIDs, ORCiDs, and possibly other identifiers in a user-friendly way. It is easily extensible to support other identifier types.
99 lines (98 loc) • 4.39 kB
JavaScript
/*!
*
* Copyright 2024-2026 Karlsruhe Institute of Technology.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
*/
import { h } from "@stencil/core";
import { GenericIdentifierType } from "../../utils/GenericIdentifierType";
import "../../components/json-viewer/json-viewer";
export class JSONType extends GenericIdentifierType {
constructor() {
super(...arguments);
this._parsedJsonResult = undefined;
}
getSettingsKey() {
return 'JSONType';
}
quickCheck() {
try {
const trimmed = this.value.trim();
if (trimmed === '')
return false;
const parsed = JSON.parse(trimmed);
return typeof parsed === 'object' && parsed !== null;
}
catch (_a) {
return false;
}
}
async hasMeaningfulInformation() {
return Promise.resolve(true);
}
init() {
this._parsedJsonResult = undefined;
return Promise.resolve();
}
isResolvable() {
return false;
}
renderPreview() {
const { data: jsonObj, error } = this.getParsedJson();
if (error) {
return h("span", { class: 'text-red-500' }, "Invalid JSON");
}
const isComplexObjectOrArray = typeof jsonObj === 'object' && jsonObj !== null;
const isArray = Array.isArray(jsonObj);
if (isComplexObjectOrArray) {
const entryCount = Object.keys(jsonObj).length;
return (h("div", { class: "w-full" }, h("div", { class: `flex rounded-md font-mono text-xs` }, h("span", { class: `mr-1 font-medium` }, isArray ? 'Array' : 'Object'), h("span", { class: 'text-gray-500' }, isArray ? '[' : '{'), h("span", { class: `text-xs text-gray-500` }, entryCount, " ", entryCount === 1 ? 'item' : 'items'), h("span", { class: 'text-gray-500' }, isArray ? ']' : '}'))));
}
return (h("div", { class: "w-full" }, h("pre", { class: `max-w-full overflow-x-auto rounded-md font-mono text-xs whitespace-pre-wrap` }, JSON.stringify(jsonObj, null, 2))));
}
renderBody() {
var _a, _b;
const { data: parsedData, error } = this.getParsedJson();
const darkModeValue = ((_b = (_a = this.settings) === null || _a === void 0 ? void 0 : _a.find(setting => setting.name === 'darkMode')) === null || _b === void 0 ? void 0 : _b.value) || 'system';
if (error) {
return (h("div", { class: "w-full overflow-y-auto" }, h("span", { class: 'text-red-500' }, "Invalid JSON data: ", error.message)));
}
return (h("div", { class: "w-full overflow-y-auto" }, h("json-viewer", { data: parsedData, "expand-all": false, "show-line-numbers": true, theme: darkModeValue }, h("span", { class: 'text-red-500' }, "Could not display JSON data."))));
}
getParsedJson() {
if (this._parsedJsonResult === undefined) {
try {
if (typeof this.value === 'object' && this.value !== null) {
this._parsedJsonResult = { data: this.value };
return this._parsedJsonResult;
}
if (typeof this.value !== 'string') {
throw new Error('Input value is not a string or object');
}
const trimmedValue = this.value.trim();
if (trimmedValue === '') {
this._parsedJsonResult = { error: new Error('Empty JSON string') };
return this._parsedJsonResult;
}
const parsed = JSON.parse(trimmedValue);
this._parsedJsonResult = { data: parsed };
}
catch (e) {
this._parsedJsonResult = { error: e instanceof Error ? e : new Error(String(e)) };
}
}
return this._parsedJsonResult;
}
}
//# sourceMappingURL=JSONType.js.map