UNPKG

@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.

74 lines (68 loc) 2.78 kB
/*! * * 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. * */ 'use strict'; var index = require('./index-SLWnk0w6.js'); class HSLColor { constructor(hue, sat, lum) { this.hue = hue; this.sat = sat; this.lum = lum; } static async generateColor(text) { if (window.crypto && window.crypto.subtle) { const hashBuffer = await window.crypto.subtle.digest('SHA-256', new TextEncoder().encode(text)); const hashArray = Array.from(new Uint8Array(hashBuffer)); const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join(''); const hue = (parseInt(hashHex, 16) % 36000) / 100; const lum = (parseInt(hashHex, 16) % 450) / 10; const sat = (parseInt(hashHex, 16) % 250) / 10; return new HSLColor(hue, 50 + sat, 30 + lum); } else { const hexText = text .split('') .map(c => c.charCodeAt(0).toString(16)) .join(''); const hue = (parseInt(hexText, 36) % 36000) / 100; const lum = (parseInt(hexText, 36) % 450) / 10; const sat = (parseInt(hexText, 36) % 250) / 10; return new HSLColor(hue, 50 + sat, 30 + lum); } } toString() { return `hsl(${this.hue}, ${this.sat}%, ${this.lum}%)`; } } const colorHighlightCss = () => ``; const ColorHighlight = class { constructor(hostRef) { index.registerInstance(this, hostRef); } async componentWillLoad() { this.color = await HSLColor.generateColor(this.text); } render() { return (index.h(index.Host, { key: '50b6e91f4e98be29cfa37552eb799883aeb49c9e' }, index.h("span", { key: '72295507c6bdc176bb0bb66e2fcd59a20cc567d0', style: { color: 'hsl(' + this.color.hue + ',' + this.color.sat + '%,' + this.color.lum + '%)', }, class: `m-0 inline p-0 align-baseline font-mono leading-none font-bold` }, this.text))); } }; ColorHighlight.style = colorHighlightCss(); exports.color_highlight = ColorHighlight; //# sourceMappingURL=color-highlight.entry.cjs.js.map //# sourceMappingURL=color-highlight.cjs.entry.js.map