kit

One-time code

Built revision v17.10.0

CSS core
Topics

Human support

Bring a missing role, layout, or state, or a rendering against the standard, to the session working on kit. Name the package and the entry.

One-time code

Sent by text message.

You can send again in 24 seconds.

Sent by text message.
Sent by text message. That code does not match. Check the message and try again.
Codes are not accepted while the studio is closed.
Source
<div data-kit-role="form-group" data-kit-holds="help" id="code-empty">
  <label for="code-empty-control" id="code-empty-label">Code</label>
  <div data-kit-role="one-time-code" id="code-empty-control-one-time-code">
    <input aria-describedby="code-empty-help" autocomplete="one-time-code" id="code-empty-control" inputmode="numeric" maxlength="6" name="code" spellcheck="false" type="text">
    <button type="button" data-kit-role="subtle-action" data-kit-region="send-again" id="code-empty-control-send-again"><span data-kit-region="label">Send again</span></button>
  </div>
  <span data-kit-region="help" id="code-empty-help">Sent by text message.</span>
</div>
<div data-kit-role="form-group" data-kit-holds="help" id="code-filled">
  <label for="code-filled-control" id="code-filled-label">Code</label>
  <div data-kit-role="one-time-code" id="code-filled-control-one-time-code">
    <input aria-describedby="code-filled-help" autocomplete="one-time-code" id="code-filled-control" inputmode="numeric" maxlength="6" name="code" spellcheck="false" type="text" value="428193">
    <button type="button" data-kit-role="subtle-action" data-kit-region="send-again" data-kit-state="inert" id="code-filled-control-send-again" disabled aria-describedby="code-filled-control-send-again-words"><span data-kit-region="label">Send again</span></button><p data-kit-region="words" id="code-filled-control-send-again-words">You can send again in 24 seconds.</p>
  </div>
  <span data-kit-region="help" id="code-filled-help">Sent by text message.</span>
</div>
<div data-kit-role="form-group" data-kit-holds="help" data-kit-state="error" id="code-refused">
  <label for="code-refused-control" id="code-refused-label">Code</label>
  <div data-kit-role="one-time-code" id="code-refused-control-one-time-code">
    <input aria-describedby="code-refused-help code-refused-error" aria-invalid="true" autocomplete="one-time-code" id="code-refused-control" inputmode="numeric" maxlength="6" name="code" spellcheck="false" type="text" value="428139">
    <button type="button" data-kit-role="subtle-action" data-kit-region="send-again" id="code-refused-control-send-again"><span data-kit-region="label">Send again</span></button>
  </div>
  <span data-kit-region="help" id="code-refused-help">Sent by text message.</span>
  <span data-kit-region="error" id="code-refused-error">That code does not match. Check the message and try again.</span>
</div>
<div data-kit-role="form-group" data-kit-holds="help" id="code-unavailable">
  <label for="code-unavailable-control" id="code-unavailable-label">Code</label>
  <div data-kit-role="one-time-code" id="code-unavailable-control-one-time-code">
    <input aria-describedby="code-unavailable-help" autocomplete="one-time-code" disabled id="code-unavailable-control" inputmode="numeric" maxlength="6" name="code" spellcheck="false" type="text">
    <button type="button" data-kit-role="subtle-action" data-kit-region="send-again" disabled id="code-unavailable-control-send-again" aria-describedby="code-unavailable-help"><span data-kit-region="label">Send again</span></button>
  </div>
  <span data-kit-region="help" id="code-unavailable-help">Codes are not accepted while the studio is closed.</span>
</div>