https://github.com/konj-org/ui

Collection of elegant components
https://github.com/konj-org/ui

preact react tailwindcss

Last synced: about 1 month ago
JSON representation

Collection of elegant components

• Host: GitHub
• URL: https://github.com/konj-org/ui
• Owner: konj-org
• License: mit
• Created: 2023-09-17T12:11:49.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-05-13T15:05:34.000Z (6 months ago)
• Last Synced: 2024-09-30T08:05:18.290Z (about 2 months ago)
• Topics: preact, react, tailwindcss
• Language: TypeScript
• Homepage: https://ui.konj.org
• Size: 932 KB
• Stars: 1
• Watchers: 0
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
![gh-banner](./assets/gh-banner.jpg)

# Konj UI

Collection of elegant components

## Acknowledgments

This project is inspired by the [shadcn/ui](https://github.com/shadcn/ui) and makes heavy use of the following libraries:

- [Tailwind by @tailwindlabs](https://github.com/tailwindlabs/tailwindcss)

- [CVA by @joe-bell](https://github.com/joe-bell/cva)

- [Tailwind Merge by @dcastil](https://github.com/dcastil/tailwind-merge)

## Supported Frameworks / Libraries

### Frameworks

- [NextJS \*](./examples/next)

  > **Notice**, Keep in mind at this point there is no built-in support for server components. You can copy and paste the components code inside your project, as a temporary solution.

- [Astro](./apps/docs)

### Libraries

- [ReactJS + Vite](./examples/vite-react)

- [PreactJS + Vite](./examples/vite-preact)

## Component List

### Primitive

| Component          | React              | Preact             | Category      |

| ------------------ | ------------------ | ------------------ | ------------- |

| Default Components | -                  | :heavy_check_mark: | Miscellaneous |

| Dialog             | :heavy_check_mark: | :heavy_check_mark: | Dialog        |

### Styled

| Component         | React              | Preact             | Category      |

| ----------------- | ------------------ | ------------------ | ------------- |

| Loading           | :heavy_check_mark: | :heavy_check_mark: | Miscellaneous |

| Button            | :heavy_check_mark: | :heavy_check_mark: | Button        |

| Alert Dialog      | :heavy_check_mark: | :heavy_check_mark: | Modal         |

| Anchored Dialog   | :heavy_check_mark: | :heavy_check_mark: | Modal         |

| Action Sheet      | :heavy_check_mark: | :heavy_check_mark: | Modal         |

| Floating Sheet    | :heavy_check_mark: | :heavy_check_mark: | Modal         |

| Stacking Cards    | :heavy_check_mark: | :heavy_check_mark: | Display       |

| Segmented Control | :heavy_check_mark: | :heavy_check_mark: | Display       |

| Tab               | :heavy_check_mark: | :heavy_check_mark: | Display       |

| Dropdown Menu     | :heavy_check_mark: | :heavy_check_mark: | Input         |

| Select            | :heavy_check_mark: | :heavy_check_mark: | Input         |

| File Input        | :heavy_check_mark: | :heavy_check_mark: | Input         |

### Hooks

| Component             | React              | Preact             |

| --------------------- | ------------------ | ------------------ |

| use-touch-dialog-drag | :heavy_check_mark: | :heavy_check_mark: |

| use-popover           | :heavy_check_mark: | :heavy_check_mark: |

## License

This project is licensed under [MIT](./LICENSE) license.