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>