kit

conflict

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.

conflict

Maya Patel changed the billing email while you were editing

It is now billing@oak.example. Your entry is kept below and has not been saved.

aisha@oakmereprimary.org

Source
<form data-kit-layout="form">
  <div data-kit-region="notices" aria-live="polite"></div>
  <div data-kit-region="form-groups">
    <div data-kit-region="notices" aria-live="polite">
      <div data-kit-role="notice" data-kit-state="attention">
        <svg data-kit-icon="warning" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor" aria-hidden="true"><path d="M236.8,188.09,149.35,36.22h0a24.76,24.76,0,0,0-42.7,0L19.2,188.09a23.51,23.51,0,0,0,0,23.72A24.35,24.35,0,0,0,40.55,224h174.9a24.35,24.35,0,0,0,21.33-12.19A23.51,23.51,0,0,0,236.8,188.09ZM222.93,203.8a8.5,8.5,0,0,1-7.48,4.2H40.55a8.5,8.5,0,0,1-7.48-4.2,7.59,7.59,0,0,1,0-7.72L120.52,44.21a8.75,8.75,0,0,1,15,0l87.45,151.87A7.59,7.59,0,0,1,222.93,203.8ZM120,144V104a8,8,0,0,1,16,0v40a8,8,0,0,1-16,0Zm20,36a12,12,0,1,1-12-12A12,12,0,0,1,140,180Z"/></svg>
        <p data-kit-region="standing">Maya Patel changed the billing email while you were editing</p>
        <p data-kit-region="sentence">It is now billing@oak.example. Your entry is kept below and has not been saved.</p>
        <div data-kit-region="action"><button type="button" data-kit-role="secondary-action"><span data-kit-region="label">Reload current email</span></button></div>
      </div>
    </div>
    <div data-kit-role="form-group">
      <label for="conflict-email">Oakmere Primary School billing email</label>
      <input id="conflict-email" type="email" value="aisha@oakmereprimary.org">
      <output for="conflict-email">aisha@oakmereprimary.org</output>
    </div>
  </div>
  <div data-kit-role="action-group" data-kit-region="submit-return">
    <button type="button" data-kit-role="primary-action"><span data-kit-region="label">Save email</span></button>
  <p data-kit-role="status-line" role="status" aria-live="polite"></p></div>
</form>