<.dm_compact_input
  id="compact-input-single-default"
  label="Username"
  name="name"
  type="text"
  value={nil}
 />

<.dm_compact_input
  id="compact-input-single-password"
  label="Password"
  name="password"
  type="password"
  value={nil}
 />

<.dm_compact_input
  id="compact-input-single-email"
  label="Email"
  name="email"
  type="email"
  value={nil}
  class="input-sm"
>
  <span class="badge badge-soft badge-info">@gsmlg.dev</span>
</.dm_compact_input>

<.dm_compact_input
  id="compact-input-single-input-error"
  label="Search"
  name="search"
  type="search"
  value={nil}
  errors={["Search is required"]}
 />

<.dm_compact_input
  id="compact-input-single-select"
  label="Location"
  name="location"
  type="select"
  value={nil}
  options={[{"New York", "new_york"}, {"California", [{"San Diego", "san_diego"}, {"San Francisco", "san_francisco"}, {"Los Angeles", "los_angeles"}]}]}
 />

<.dm_compact_input
  id="compact-input-single-with-helper"
  label="API Key"
  name="api_key"
  type="text"
  value={nil}
  helper="Find your API key in Settings > Developer."
 />

<.dm_compact_input
  id="compact-input-single-horizontal"
  label="Display Name"
  name="display_name"
  type="text"
  value={nil}
  horizontal
 />

<.dm_compact_input
  id="compact-input-validation-states-success-state"
  label="Username"
  name="ci_vs_success"
  type="text"
  value={nil}
  state="success"
 />
<.dm_compact_input
  id="compact-input-validation-states-warning-state"
  label="Password"
  name="ci_vs_warning"
  type="text"
  value={nil}
  state="warning"
 />