The Universal UI Library

$3

🥯Papanasi _(pronunced pɑpənæʃ or papanash)_ is a UI library to use cross Frameworks. A set of components to use in Angular, Preact, Qwik, React, Solid, Svelte, Vue and Web Components. Is based on the Mitosis library and documented using Storybook.

$3

Angular	Preact	Qwik	React
Solid	Svelte	Vue	Web Comps.

$3

Nextjs

Nuxt 3

Svelte Kit

Solid Start

Qwik City

$3

This library born as a pet project to create universal components, easy to extend in any project and easy to use with any framework, is based on the next principles:

#### A Component...
* ...should be cross-libraries but the code should be written once.
* ...should have a minimum style but easy to extend it via CSS by any dev.
* ...should provide some optional themes to make it easy to use.
* ...should be accessible (FUTURE RELEASES).
* ...should be made for developers not for non-coders, they will decide how to style most of the things.
* ...should be tree-shakable.
* ...should be compatible with StoryBook.
* ...should be inspired by other UI Libraries and don't reinvent the wheel.
* ...should be easy to create new variants.

$3

Layout
Container	Row	Column	Grid
Components
Avatar	Button	Code	Pill
Spinner
Enterprise
Itchio
Extensions
Tooltip

$3

With npm:

``
$ npm install @papanasi/solid
`
With yarn:

`
$ yarn add @papanasi/solid
`

$3

To debug elements you can use setDebugLevel function from @papanasi/solid

``js
window.addEventListener('load', () => {
setDebugLevel(DebugLevel.Log);
});
`

$3

To learn more about Papanasi, check the documentation.

$3

MIT

$3

Contributing Guidelines

To build the project run:

`
> yarn compile
`

You can choose which frameworks to build by passing the --platforms:

`
> yarn compile --platforms react vue
`

It is also possible to specify which components to build --elements:

`
> yarn compile --elements avatar pill
`

If you want to disable the linting use --no-lint:

`
> yarn compile --no-lint
`

To contribute and watch the changes in local environment just use:

`
> yarn dev
`

Finally, to launch storybook use:

`
> yarn start
``

$3

Sponsor the project

HelpDev

$3


And special thanks to @samijaber @mhevery and Builder project