Design token support

.github/workflows/pages.yml

@@ -49,13 +49,12 @@ jobs:
           # Rust toolchain name.
           toolchain: stable
           target: wasm32-unknown-unknown
-      - uses: jetli/trunk-action@v0.5.0
+      - uses: actions/setup-node@v4
         with:
-          # Optional version of trunk to install(eg. 'v0.19.1', 'latest')
-          version: 'latest'
+          node-version: '24.x'
       - name: Install and Build 🔧
         working-directory: examples/webpage
-        run: trunk build --release --public-url="/dwind/examples"
+        run: npm ci && npm run build
       - name: Docs
         run: cargo doc --no-deps
       - name: Populate docs

Cargo.toml

@@ -4,7 +4,7 @@ resolver = "2"
 members = [
     "crates/dominator-css-bindgen",
     "crates/dwind",
-    "crates/dwind-base", "crates/dwind-build",
+    "crates/dwind-base", "crates/dwind-build", "crates/dwind-design-tokens",
     "crates/dwind-macros",
     "crates/dwui",
     "crates/example-html-macro",

LLM.txt

@@ -0,0 +1,113 @@
+# DWIND - Type-Safe CSS Utilities for DOMINATOR
+
+DWIND brings Tailwind-like utilities to DOMINATOR web apps with compile-time validation.
+
+## Quick Start
+
+```rust
+use dwind::prelude::*;
+use dwind_macros::dwclass;
+use dwui::prelude::*;
+
+// Initialize CSS (once at app start)
+dwind::stylesheet();
+
+// Use utilities
+html!("div", {
+    .dwclass!("flex justify-center p-4 bg-apple-500 @md:bg-charm-700")
+})
+```
+
+## Discovery Guide for LLMs
+
+### 1. Find Available Styles
+```bash
+# List all CSS utility modules
+ls crates/dwind/src/modules/
+
+# Search for specific utilities (e.g., flexbox)
+grep -r "flex" crates/dwind/resources/css/
+
+# View generated docs
+# https://jedimemo.github.io/dwind/doc/dwind/index.html
+```
+
+### 2. Component Library (dwui)
+```bash
+# List available components
+ls crates/dwui/src/components/
+
+# Components include: button, card, text_input, select, toggle, dropdown
+```
+
+### 3. Key Patterns
+
+**Responsive Design**: `@xs:`, `@sm:`, `@md:`, `@lg:`, `@xl:` prefixes
+```rust
+.dwclass!("text-sm @md:text-lg @xl:text-2xl")
+```
+
+**Pseudo-classes**: `hover:`, `focus:`, `disabled:` prefixes
+```rust
+.dwclass!("bg-gray-200 hover:bg-gray-300 disabled:opacity-50")
+```
+
+**Theming**: Use `is(.light *)` or `is(.dark *)` selectors
+```rust
+.dwclass!("is(.light *):bg-white is(.dark *):bg-black")
+```
+
+**Reactive Classes**: Apply classes conditionally based on signals
+```rust
+.dwclass_signal!("bg-blue-500", is_active.signal())
+.dwclass_signal!("text-xl", size.signal().eq(TextSize::ExtraLarge))
+```
+
+## Architecture
+
+- **dwind**: Core utilities (spacing, colors, typography, layout)
+- **dwind-macros**: `dwclass!` and `dwclass_signal!` macros
+- **dwui**: Pre-built components using dwind utilities
+- **dominator-css-bindgen**: CSS-to-Rust code generator (build-time)
+
+## Component Usage (dwui)
+
+Components use macro syntax generated by `futures-signals-component-macro`:
+
+```rust
+use dwui::prelude::*;
+
+// Button component
+button!({
+    .content(Some(text("Click me")))
+    .button_type(ButtonType::Flat)
+    .disabled(false)
+    .on_click(|_| println!("Clicked!"))
+})
+
+// Card with nested components
+card!({
+    .scheme(ColorScheme::Void)
+    .apply(|b| {
+        dwclass!(b, "p-4 w-64 flex flex-col gap-4")
+        .children([
+            text_input!({
+                .value(some_mutable)
+                .label("Enter name".to_string())
+            }),
+            button!({
+                .content(Some(text("Submit")))
+                .button_type_signal(button_type.signal())
+            })
+        ])
+    })
+})
+```
+
+## Signal-based Properties
+
+Component properties with `#[signal]` attribute support both static and dynamic values:
+- `.property(value)` - static value
+- `.property_signal(signal)` - dynamic signal value
+
+All CSS classes are validated at compile-time. Invalid classes cause compilation errors.

crates/dwind-build/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "dwind-build"
-version = "0.1.0"
+version = "0.2.0"
 edition = "2021"
 description = "utility crate for building DWIND color swatches etc."
 homepage = "https://github.com/JedimEmO/dwind"
@@ -9,6 +9,6 @@ license = "MIT"
 keywords = ["web", "wasm", "css", "style"]
 
 [dependencies]
-
+dwind-design-tokens = { path = "../dwind-design-tokens" }
 serde.workspace = true
 serde_json.workspace = true