-- DreamStack Slot Composition Demo
-- Demonstrates component children/slot rendering

import { Card } from "../registry/components/card"
import { Button } from "../registry/components/button"
import { Badge } from "../registry/components/badge"

let count = 0

view main = column [
  text "🧩 Slot Composition" { variant: "title" }
  text "Components can now accept children!" { variant: "subtitle" }

  Card { title: "Counter Card", subtitle: "with interactive children" } [
    text "Count: {count}"
    button "+1" { click: count += 1, variant: "primary" }
    button "-1" { click: count -= 1, variant: "secondary" }
  ]

  Card { title: "Nested Components", subtitle: "badge inside card" } [
    Badge { label: "nested", variant: "success" }
    text "Badge rendered inside Card slot"
  ]
]