Announcing the First Release of Mishka Chelekom UI Kit & Phoenix Components

After three and a half months of full-time work, we have released the first version of our UI kit and components for Phoenix and LiveView .

This release is built around the idea of providing foundational components for the Phoenix framework without requiring any production dependencies or using JavaScript.

Version 0.0.1 of the Mishka Chelekom library, powered by the Igniter project, allows developers to access over 80 components across 43 different categories through CLI.

This means you can easily generate a module for a specific component (e.g., an alert) in your Phoenix project by running a simple command. Each component also comes with various parameters, allowing you to avoid bloating your project with unused styles.

For instance, if you don’t need a black color in your project, you don't need to include it. If you decide you need it later, the CLI will assist you by showing a diff compared to the previous version and updating the project after your approval.

In this initial version, our goal is to lay down the foundation for all the essentials needed for an admin panel. That's why we haven't yet focused on JavaScript or CSS animations — although we definitely have long-term plans for these as well.

Why Did We Create Mishka Chelekom?

As a team, we are big fans of projects like Live Svelte and LiveVue, but we felt strongly that we shouldn't simply follow the same path as the JavaScript community. Instead, we wanted to solve the initial problems first and only add complexity if truly needed — offering these tools to developers as an option, not a requirement. With that in mind, we decided to build all foundational features using native LiveView.

Will we use these projects in the future? Absolutely, but as optional extras. Our primary goal will always be to continue building powerful native Phoenix components.

We aim to take a hybrid approach, utilizing both client-side functionality through LiveView and pure JavaScript in phx-hook. This gives developers the option to fully customize their applications or use it with minimal knowledge as simply as possible.

You can start using this project by visiting our documentation page. The entire project has been developed using Tailwind CSS, without the use of other tools. The latest version of LiveView, currently in RC, has also been targeted.

Important Notes about our entry goal:

• Due to our focus on foundational functionality, some components may have limitations in this version. Once we integrate JavaScript into the project, we will offer more component versions for you to choose from. It's all about software trade-offs, and soon you’ll have more options to pick the best one for your needs.
• All components in this release are light mode only. Dark mode will be available in the next version. You can also check out our roadmap for upcoming features.
• After a few more updates, we will begin creating short videos on converting graphic templates, such as admin panels, to heex. These tutorial videos will help you get the best out of this library much more quickly.