leptos_ui 0.2.1

# Leptos UI

Macros to build UI components easily with Leptos and Tailwind CSS. Built on top of [tw_merge](https://crates.io/crates/tw_merge).


## Features

- `clx!` macro for creating components with merged Tailwind classes
- `a!` macro for creating anchor elements with merged Tailwind classes
- `div!` macro for creating components without children
- `input!` macro for creating input elements with merged Tailwind classes
- `transition!` macro for creating components with "view-transition-name:*"


## Example in Production

This crate is used in  [rust-ui.com](https://www.rust-ui.com) — check it out to see Leptos UI and Tailwind CSS in action :)



## Usage

### Basic Component with `clx!`

```rust
// components/ui/card.rs
use leptos::prelude::*;
use leptos_ui::clx;

mod components {
    use super::*;
    clx! {Card, div, "rounded-lg p-4", "bg-sky-500"} // 🩵
}

pub use components::*;

// components/demos/demo_card.rs
#[component]
pub fn DemoCard() -> impl IntoView {
    view! {
        <Card>"Card bg-sky-500 🩵"</Card>
        <Card class="bg-orange-500">"Card bg-orange-500 🧡"</Card>
        // └──> 🤯 NO CONFLICT CLASS!!
    }
}
```


## Installation

Add this to your `Cargo.toml`:

```toml
[dependencies]
leptos_ui = "0.1"
```

P.S.: Don't forget to regularly run `cargo update` (frequent updates)!




## Changelog

### September 2025 - leptos_ui v0.2 Breaking Changes

We refactored the `leptos_ui` crate with breaking changes.

**New macro system:**
- `clx!`: Elements with children
- `void!`: Self-closing elements (no children)

> See [MDN Docs](https://developer.mozilla.org/en-US/docs/Glossary/Void_element) for reference about void elements.

**Attribute changes:** Removed direct props from macros. Use `attr:*` and `prop:*` pattern instead:
```rust
// Define component
void! {MyInput, input, "border border-input"}

// Before
<MyInput value=move || url().to_string() readonly=true class="flex-1" />

// After
<MyInput prop:value=move || url().to_string() attr:readonly=true class="flex-1" />
```




## License

This project is licensed under the MIT License. See the [LICENSE](./LICENSE) file for details.