An open API service indexing awesome lists of open source software.

https://github.com/rdkcentral/solid-ui

A suite of UI components for the SolidJS Lightning framework
https://github.com/rdkcentral/solid-ui

Last synced: 6 months ago
JSON representation

A suite of UI components for the SolidJS Lightning framework

Awesome Lists containing this project

README

          

# Solid UI

⚠️ This repo is no longer actively maintained. These components are not being updated to work with the latest versions of `@lightningtv/solid`, though feel free to use them as a reference. ⚠️

This library contains a suite of [themeable](THEMING.md) UI components written for the [SolidJS Lightning](https://github.com/lightning-tv/solid) Framework. check them out in our [storybook docs](https://rdkcentral.github.io/solid-ui/).

[![npm version](https://img.shields.io/npm/v/@lightningtv%2Fsolid-ui.svg?style=flat)](https://www.npmjs.com/package/@lightningtv/solid-ui)

## Getting Started

If you haven't already, follow the steps found [here](https://github.com/lightning-tv/solid) to bootstrap your SolidJS Lightning app. Then:

1. install this package and the base theme with your package manager of choice

```sh
pnpm add @lightningtv/solid-ui @lightningtv/l3-ui-theme-base # or npm/yarn
```

2. add the theme package as an alias in your vite config(see the [theming docs](THEMING.md) for more information on this)

```js
// vite.config.js
resolve: {
alias: {
theme: '@lightningtv/l3-ui-theme-base',
}
},
```

3. and finally, use a component

```jsx
// App.jsx
import { Button } from '@lightningtv/solid-ui';

a button!
;
```

## Reporting a Bug

If you come across a bug in this library, please open an [issue](https://github.com/rdkcentral/solid-ui/issues) with a detailed description of what you've encountered

## Development

If you don't have pnpm

```sh
npm install -g pnpm
```

Run the solid storybook dev environment:

```sh
pnpm i
pnpm dev
```

## Theming

Theming in the context of solid-ui is a system for providing a set of values to control the look and feel of the components. Head over to our [theming documentation](THEMING.md) for more information