Introducing Mishka Chelekom v0.0.9 - MCP & AI-Ready Phoenix Components, 35+ Headless Components, and the Kit
The release that teaches AI agents to build with your Phoenix UI - a native MCP server, an accessible headless layer ported from Base UI, and one DSL to reuse and restyle every component
We're excited to announce Mishka Chelekom v0.0.9 - the release where our Phoenix and LiveView component library becomes AI-native. This version ships a built-in MCP server so AI agents can generate and use your components correctly, a brand-new headless component layer ported from Base UI with full accessibility, and the Kit - one DSL to reuse and restyle any component without ever touching its source.
In short: the last few versions made Mishka Chelekom powerful for humans. v0.0.9 makes it just as usable for the AI agents your team already codes with every day - while adding real components, real accessibility, and a cleaner CLI on top.
As you know, Mishka Chelekom brings 100+ styled components, 35+ headless components, and JsHooks for the Phoenix and Phoenix LiveView frameworks in Elixir, installed straight into your project via CLI - no runtime library, no hidden dependencies, just code you own. It remains completely free and open source, with the largest component set of any library in the ecosystem.
And it still runs almost entirely on community goodwill - and lately, that goodwill has thinned out. Monthly donations have slipped below $40 after several months of decline, which sadly doesn't cover the project's running costs - and every cent we do receive goes straight back into the project. Now that Mishka Chelekom has passed 55,000+ downloads, we're genuinely hoping more of the community will step in. Even the price of a coffee a month through GitHub Sponsors keeps the lights on and the releases coming, and if you work somewhere that could sponsor or invest in the project, the Mishka team would love to talk.
Support Our Work
98% of Mishka's products are open source, and we need your support to keep growing stronger.
Every contribution makes a difference and is deeply appreciated! ❤️
Getting Started with Mishka Chelekom v0.0.9
Adding Mishka Chelekom to a Phoenix or Phoenix LiveView project takes a single line. The quickest path is the Igniter-powered installer,
mix mishka_chelekom.install
- but you can just as easily add the dependency to your mix.exs by hand. It's a dev-only dependency with no runtime: every component is generated straight into your own app, so nothing from Mishka ships in production.
# Add it to your deps in mix.exs {:mishka_chelekom, "~> 0.0.9", only: :dev, runtime: false}
Want the newest features before they're stable? The next release is published on the alpha channel - pin it explicitly in your mix.exs:
# Or pin the next alpha pre-release {:mishka_chelekom, "~> 0.0.10-alpha.1", only: :dev, runtime: false}
Then run
mix deps.get
and start generating components. For the full installation guide, the complete component list, and every configuration option, read the
Mishka Chelekom documentation
.
What's New in Mishka Chelekom v0.0.9:
1. AI-Native: A Built-in MCP Server for Your Components, Docs, and CLIs
This is the headline of the release. Mishka Chelekom now ships an entry-level MCP (Model Context Protocol) server that exposes the whole library - every component, its documentation, and all the mix tasks - directly to AI agents and editors. Instead of an agent guessing attribute names or hallucinating an API, it can now ask Mishka and get the real answer.
Setting it up is a single command, and it supports both HTTP and a stdio transport for local editors and CLI-based agents:
mix mishka.mcp.setup
mix mishka.mcp.setup --stdio
To make this bulletproof, we also wrote comprehensive usage rules for every single component and every JavaScript hook - the exact, verified contract an agent needs (attributes, slots, allowed values, gotchas). No more "the AI generated something that looks right but doesn't compile." These rules ship with the library and plug into the usage_rules workflow, so your agent reads them automatically.
-----Video coming soon!---
2. 35+ Headless Components - Unstyled, Accessible UI Ported from Base UI
Sometimes you don't want our styling at all - you want the behavior and accessibility, and your own design on top. So v0.0.9 introduces an entire headless component layer: 35+ headless components, every single one ported from Base UI into idiomatic Phoenix. They ship only semantic markup, complete WAI-ARIA wiring, named part slots, data-* state, and the JavaScript behavior hooks - and zero colors or spacing of our own.
Because they carry no styling at all, you can dress them in whatever design system you like - bring the Tailwind classes from Base UI, shadcn, Radix, or daisyUI, reuse your own design tokens, or hand-write the CSS yourself, and the accessibility, focus management, and keyboard behavior keep working underneath. You can browse, restyle, and test every headless component live in the development app inside the Mishka Chelekom repo .
Styled and headless components live side by side, so you can mix both in the same project. Generating them is exactly as easy as the styled ones:
mix mishka.ui.gen.headless dialog
mix mishka.ui.gen.headless.components
Under the hood these components carry chelekom-* structural classes and paired-presence state (data-open / data-closed, data-highlighted, and friends), so you style them entirely from your own CSS - no fighting our opinions, and full keyboard and screen-reader support out of the box.
Here's the full headless set shipping in v0.0.9, grouped by what they do:
Forms and inputs
Overlays
Navigation
Disclosure
Feedback
Media
-----Video coming soon!---
3. The Kit - One DSL to Reuse and Restyle Any Component
The Kit (MishkaChelekom.Kit) is a new, opt-in Spark DSL that lets you reuse and restyle the components you already generated - without editing their files. You declare a customize block, add a color, a variant, or restyle a headless part, and the Kit generates a thin wrapper that delegates to the real component. Your design system in one readable module.
Because every class you write lives right there in your own module, Tailwind picks them up automatically - no safelist, no extra configuration. And when you're ready to ship, a single command vendors the Kit engine into your app so it works in production with zero runtime dependency on Mishka Chelekom:
mix mishka.ui.gen.kit
That keeps the whole philosophy of Mishka intact - the code is yours, it lives in your repo, and there's nothing hidden at runtime. The Kit simply gives you a clean, declarative place to keep every customization instead of scattering overrides across your components.
-----Video coming soon!---
4. New Components: Dock, Shape, and Stat
Three new Phoenix components join the library in this release:
Each one follows the same conventions as the rest of the library, so they drop straight into your project with the colors, sizes, and variants you already use.
-----Video coming soon!---
5. Smarter, More Interactive Components
We spent a large part of this cycle making existing components do more. Highlights:
-----Video coming soon!---
6. A More Powerful CLI: Uninstall, Prefixes, and Cleaner Output
Generating components has always been the easy part - this version makes managing them just as easy. The big addition is a proper uninstall task, so you can cleanly remove what you no longer need:
mix mishka.ui.uninstall
It understands both layers via a --headless flag, and --all removes styled and headless components together. On top of that, you can now set component and module name prefixes right from the CLI (or your config.exs), with a --no-save flag when you want a one-off prefix that isn't persisted - handy for teams that namespace their UI. Every mix task also got its own titled banner and a live progress spinner, so long runs finally tell you what's happening.
This release also lets you ship your whole component library as data. The mix mishka.ui.export task walks a component directory and serializes every component - its markup, attributes, variants, JavaScript hooks, and theme CSS - into one portable JSON file, and the new --cms flag turns that into a complete CMS-ready UI-kit bundle you can drop straight into a runtime like MishkaCMS:
# Export the whole styled set as a CMS-ready bundle mix mishka.ui.export priv/components --cms --name chelekom --bundle-name chelekom --bundle-version 0.0.9 # And the headless set, exactly the same way mix mishka.ui.export priv/headless --cms --name chelekom_headless --bundle-name chelekom_headless --bundle-version 0.0.9
One command exports the entire styled set, another the entire headless set. On the receiving end every component in that bundle is compiled and loaded dynamically at runtime straight from the JSON - no Mishka Chelekom source in the consumer, no recompile step - so a CMS can render your whole Phoenix and LiveView UI kit from a single file. The exporter even harvests real, ready-to-render examples from each component's own demo pages and stores them right inside the bundle.
For quick reference, here's the full CLI surface in v0.0.9, grouped by what you reach for:
Install and AI setup
Generate
Manage and share
-----Video coming soon!---
7. Under the Hood: Elixir 1.18, Refactors, and Bug Fixes
Beyond the features, v0.0.9 raised the minimum Elixir version to 1.18 (with a compile-time JSON/Jason fallback), refactored the generator and asset pipeline for the headless CLI with unified per-command banners and cleaner CSS imports, and fixed a batch of real, user-reported bugs - floating-element event bubbling, menu and sidebar edge-case crashes, native date-picker icons, dropdown positioning with min-width content, and several missing-label conditions in forms.
We also added a demo-driven test harness, and it leans on that same export. It takes the exported bundle, dynamically compiles every component from its JSON, and renders each one through the exact runtime dispatcher a consumer would use - driven by the real invocations pulled from our demo pages, not hand-written mocks. Because it renders the whole library end to end the way it actually ships, it catches genuine rendering bugs - broken slots, bad defaults, mis-wired hooks - before they reach a release, and it does all of that without a downstream app installed. In practice it already caught a number of issues before they ever shipped.
This post walks through the headline features, but plenty more landed in this cycle - smaller fixes, refinements, and internal changes. For the complete, itemised breakdown of everything in this release, read the full v0.0.9 changelog on GitHub .
Future Roadmap:
Our goal is unchanged: keep stabilizing toward v0.1.0. With the AI, headless, and Kit foundations now in place, the next steps are hardening these three pillars, expanding the headless set to match the styled one, and continuing to solve the problems you report on GitHub. The commitment to a rock-solid first 100 components is still firmly on track.
Custom Support and Services
Some companies have needs that fall outside our public roadmap or need to happen faster. For that, we offer a custom support and services option.
Through this service, you can:
For more details, feel free to explore our custom services section.
Special Thanks - Built on Igniter
None of this CLI would exist without
Zach Daniel
and his brilliant
Igniter
library. Igniter is the core of the entire project - every generator and every safe patch it makes to your codebase, the whole mix mishka.ui.* experience, is written on top of it. It's the engine that lets Mishka Chelekom write real, formatted Elixir straight into your app instead of dumping copy-paste snippets on you.
And it keeps getting better. The latest versions of Igniter made component generation dramatically faster - the difference is genuinely amazing, and you feel it on every mix mishka.ui.gen run. Thank you, Zach, for building the foundation so much of the Elixir code-generation ecosystem now stands on.
It's also worth saying plainly: every Mishka library is built, optimized, and integrated specifically for the Ash ecosystem. That alignment is deliberate, not accidental - and we'll be publishing proper content about how it all fits together very soon.
Final Words
Thank you to everyone who tested, reported issues, contributed, and financially supported Mishka Chelekom over the past months. This is a young project with a very large surface area, and it moves forward because of the Elixir community, not despite it.
The best ways to help:
And anything else you think would move the project forward.
Special thanks to our financial supporters in recent months ♥️
@SteffenDE | @zachdaniel | @alisinabh | @miguelcoba | @pcharbon70 | @srinivasganti | @drlogout | @douglasmanzelmann | @queencitytech | @WurmPeter | @maxmannen | @aldrin-ronco | @anibal | @dev-guy | @damir | @axelson | @lamaarmy84 | @snewcomer | @Dak425 | @bburgy | @minidfx | @RicoMoorman | @chaz_watkins | @codylandry | Russell Gunther | ghostwritermax | John Nyukuri | Aaron Stewart
Thank you, Mishka Team
Support Our Work
98% of Mishka's products are open source, and we need your support to keep growing stronger.
Every contribution makes a difference and is deeply appreciated! ❤️