InputFieldComponent

inputField(value = dataStore /* inject a store so all user inputs are automatically reflected! */) {
     placeholder("Placeholder") // render a placeholder text for empty field
 }

 // all state management can also be done manually if needed:
 val someStore = storeOf("")
 inputField {
     placeholder("Enter text")
     value(someStore.data) // connect a flow to the component for setting its value
     events {
         changes.values() handledBy someStore.update // connect an handler for emitting the user input made
     }
     element {
         // exposes the underlying HTML input element for direct access. Use with caution!
     }
 }

 // apply predefined size and variant
 inputField(value = dataStore) {
      size { small } // render a smaller input
      variant { filled } // fill the background with ``light`` color
      placeholder("Placeholder") // render a placeholder text for empty field
 }

 // Of course you can apply custom styling as well
 inputField({ // just use the ``styling`` parameter!
      background {
          color { dark }
      }
      radius { "1rem" }
 },
 value = dataStore) {
      size { small } // render a smaller input
      placeholder("Placeholder") // render a placeholder text for empty field
 }