<sendText value={({state}) => `Current count: ${state.count}`} />

<sendText>
  Hello, welcome to the application!
</sendText>

<sendText>
  {({state}) => `
    User: ${state.user.name}
    Status: ${state.status}
    Last Updated: ${state.lastUpdate}
  `}
</sendText>

<sendText>
  {({state}) => {
    if (state.error) {
      return `Error: ${state.error.message}`;
    }
    if (state.loading) {
      return 'Loading...';
    }
    return `Data loaded: ${state.data.summary}`;
  }}
</sendText>

<sendText>
  {({state}) => {
    const status = state.status;
    const progress = state.progress;
    
    return `
      Status: ${status}
      Progress: ${progress}%
      ${progress === 100 ? 'Complete!' : 'Processing...'}
    `;
  }}
</sendText>

<sendText>
  {({state}) => {
    const { errors, touched, isValid } = state.validation;
    
    if (!touched) {
      return 'Please fill out the form.';
    }
    
    if (!isValid) {
      return `Please correct the following errors:
        ${Object.entries(errors)
          .map(([field, error]) => `${field}: ${error}`)
          .join('\n')}`;
    }
    
    return 'Form is valid!';
  }}
</sendText>

<sendText>
  {({state}) => {
    const { items, total, currency } = state.cart;
    
    return `
      Cart Summary:
      ${items.map(item => 
        `- ${item.name}: ${currency}${item.price}`
      ).join('\n')}
      
      Total: ${currency}${total}
    `;
  }}
</sendText>

<sendText>
  {({state}) => {
    const data = state.report;
    return `
      Monthly Report
      ${'-'.repeat(20)}
      
      Revenue: ${formatCurrency(data.revenue)}
      Expenses: ${formatCurrency(data.expenses)}
      Profit: ${formatCurrency(data.profit)}
      
      Growth: ${formatPercentage(data.growth)}
      Status: ${formatStatus(data.status)}
      
      Generated: ${formatDate(new Date())}
    `;
  }}
</sendText>

<sendText>
  {({state}) => {
    const { user, options } = state;
    return `
      Hi ${user.name}!
      
      Available commands:
      ${options.map((opt, i) => 
        `${i + 1}. ${opt.label}`
      ).join('\n')}
      
      Type a number to select an option.
    `;
  }}
</sendText>

<state id="messageSequence">
  <sendText>
    {({state}) => state.intro}
  </sendText>
  
  <transition event="continue">
    <sendText>
      {({state}) => state.details}
    </sendText>
  </transition>
  
  <transition event="complete">
    <sendText>
      {({state}) => state.summary}
    </sendText>
  </transition>
</state>