// Test fixture matching the native-hello App.el patterns.
// This is what a developer would write in component syntax;
// the codegen should produce code equivalent to what's in
// examples/native-hello/src/App.el.

component App {
  state {
    greeting: String = "Waiting for name..."
    counter: Int = 0
  }

  fn on_greet_click(widget: Int, data: String) -> Void {
    let name: String = widget_get_text(g_input)
    let greeting: String = if str_len(name) > 0 {
      str_concat(str_concat("Hello, ", name), "!")
    } else {
      "Hello, World!"
    }
    widget_set_text(g_label, greeting)
  }

  fn on_counter_click(widget: Int, data: String) -> Void {
    state.counter = state.counter + 1
    widget_set_text(g_counter_lbl, str_concat("Clicks: ", int_to_str(g_counter)))
  }

  fn on_name_change(widget: Int, data: String) -> Void {
    let has_text: Bool = str_len(data) > 0
    widget_set_disabled(g_button, !has_text)
  }

  template {
    <vstack spacing=0 padding=24 bg="#0f172a" flex=1>
      <label text="el-native — native widget demo" style="heading" />
      <label text="" height=16 />
      <label text="AppKit controls from el code, no ObjC in the app layer." style="muted" />
      <label text="" height=24 />
      <hstack spacing=8>
        <label text="Name:" style="body" width=60 />
        <text_field placeholder="Enter your name…" on_change=on_name_change flex=1 />
        <button label="Greet" on_click=on_greet_click style="button_primary" />
      </hstack>
      <label text="" height=12 />
      <label text="Waiting for name…" style="body" color="#60a5fa" font_bold=16 />
      <label text="" height=24 />
      <hstack spacing=12>
        <label text="Clicks: 0" style="body" />
        <button label="Click me" on_click=on_counter_click />
      </hstack>
    </vstack>
  }
}