@kit-data-manager/pid-component
Advanced tools
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.
The pid-component is an easily extensible web component that can be used to display PIDs, ORCiDs, and possibly other
identifiers in a user-friendly way.
It is easily extensible to support other identifier types.
The pid-component dynamically renders a component based on the value of the value property.
Depending on the value, it decides which component to render, what priority to give it, and what props to pass to it.
It also renders itself recursively for all its children when unfolded.
You can set the maximum depth of recursion with the level-of-subcomponents property.
By default, it is set to 1, which means that it will only render the first level of children, but not their children.
You can prohibit unfolding of the component by setting the current-level-of-subcomponents to the same value as
the level-of-subcomponents property.
To use the component, import the npm-package via unpkg:
<head>
<script type='module' src='https://unpkg.com/@kit-data-manager/pid-component'></script>
</head>
Alternatively, you can install the package via npm:
npm install @kit-data-manager/pid-component
Then, you can use this component like this:
<pid-component value='21.T11981/be908bd1-e049-4d35-975e-8e27d40117e6'></pid-component>
You can try this web component in the demo.
Only use the pid-component component! All the others are just for prototyping...
There are detailed docs for the pid-component component
available in the Storybook and in
the source code.
Please notice that you must use the hyphenated version of an attribute when using the component directly in HTML (
e.g. currentLevelOfSubcomponents -> current-level-of-subcomponents).
When using inside Stencil or with JSX/TSX syntax, you must use the camelCase version.
npm installFor running storybook in dev mode, run these commands in separate terminals:
npm run buildWatchnpm run storybookAttention: Do NOT run npm run start. It will cause the storybook to not work properly.
If you did run npm run start, delete the following folders and run npm install again:
node_moduleswwwdistloader.stencilFAQs
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.
The npm package @kit-data-manager/pid-component receives a total of 44 weekly downloads. As such, @kit-data-manager/pid-component popularity was classified as not popular.
We found that @kit-data-manager/pid-component demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Deno 2.2 enhances Node.js compatibility, improves dependency management, adds OpenTelemetry support, and expands linting and task automation for developers.
Security News
React's CRA deprecation announcement sparked community criticism over framework recommendations, leading to quick updates acknowledging build tools like Vite as valid alternatives.
Security News
Ransomware payment rates hit an all-time low in 2024 as law enforcement crackdowns, stronger defenses, and shifting policies make attacks riskier and less profitable.