Show HN: FormTS – Define forms with TypeScript instead of drag-and-drop

1 comments

• dkrychowski 9 hours ago

  I built a form builder where you define forms in TypeScript instead of using a visual editor.

  Try it now (no signup): https://formts.com/editor

  You write a function that receives a `form` object with methods like `addRow()`, `addTextbox()`, `addMoney()`. It compiles into a working form with reactive calculations, conditional logic, and multi-page support.

      export function myForm(form: FormTs) {
          form.addRow(row => {
              row.addTextPanel('greeting', {
                  computedValue: () => {
                      const name = form.textbox('name')?.value();
                      const surname = form.textbox('surname')?.value();
                      
                      if (name || surname)
                          return `Hello ${name ?? ''} ${surname ?? ''}`;
                      
                      return 'Hello stranger!';
                  }
              })
          })
  
          form.addRow(row => {
              row.addTextbox('name', { label: 'Name' });
              row.addTextbox('surname', { label: 'Surname' });
          })
      }
  

  Why TypeScript? AI models know it really well. You can paste the type definitions into Claude/GPT, describe what you need, and get working code back.

  Type definitions for LLM prompting: https://formts.com/types

  Would love feedback on the idea!