Helium Prism

imputnet
11

Shared UI components of Helium web interfaces for Svelte

Helium Prism

Shared UI components of Helium web interfaces for Svelte.

Prism UI library contains the shared building blocks used by web-based Helium applications and websites, such as: typography, buttons, inputs, loading states, icons, and the brand gradient shimmer effect.

This library isn't built for use outside of Helium web apps, so it may feel clunky for anything else.

Demo: prism.helium.computer
npm: @imput/helium-prism

Installation

deno:

deno add npm:@imput/helium-prism

pnpm:

pnpm add @imput/helium-prism

npm:

npm i @imput/helium-prism

Basic usage

Import the stylesheet once near the root of your app:

<script>
    import "@imput/helium-prism/styles.css";
</script>

Then import components from the package root:

<script>
    import { Button } from "@imput/helium-prism";
</script>

<Button primary>Button</Button>
<Button>Button 2</Button>

You can also import all components at once if you're a madman or have an actual reason to do so (such as for demo purposes):

<script>
    import * as Prism from "@imput/helium-prism";
</script>

<Prism.Button primary>Button</Prism.Button>
<Prism.Button>Button 2</Prism.Button>

API docs

Sample usage of components is documented in docs/api.md.

License

Helium Prism is licensed under GPL-3.0, just like the rest of Helium. See LICENSE.

Top categories