<!-- #region Counter [C:2] [TYPE Component] [SEMANTICS counter, demo, example, interactive] -->
<!-- @BRIEF Component component: lib/Counter.svelte -->
<!-- @LAYER UI -->
<!--
@PURPOSE: Simple counter demo component
@LAYER UI

@UX_STATE: Idle -> Counter renders the current value and increment action.
@UX_STATE: Incremented -> Count increases immediately after button activation.
-->
<script lang="ts">
  let count = $state(0);
  const increment = () => {
    count += 1;
  };
</script>

<button onclick={increment}>
  count is {count}
</button>
<!-- #endregion Counter -->
