<fieldset class="fr-fieldset" id="firstname-disabled-1458" aria-labelledby="firstname-disabled-1458-legend firstname-disabled-1458-messages">
    <legend class="fr-sr-only" id="firstname-disabled-1458-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1460">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1460-messages" name="family-name" autocomplete="family-name" id="family-name-1460" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1460-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="given-1465">
                Prénom
            </label>
            <input class="fr-input" aria-describedby="given-1465-messages" name="given-name" autocomplete="given-name" id="given-1465" spellcheck="false" type="text">
            <div class="fr-messages-group" id="given-1465-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="firstname-disabled-1458-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="firstname-disabled-1477" aria-labelledby="firstname-disabled-1477-legend firstname-disabled-1477-messages">
    <legend class="fr-sr-only" id="firstname-disabled-1477-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1479">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1479-messages" name="family-name" autocomplete="family-name" id="family-name-1479" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1479-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1485" disabled aria-labelledby="firstname-fieldset-1485-legend firstname-fieldset-1485-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1485-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1484">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1484-messages" name="given-name" autocomplete="given-name" id="given-1484" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1484-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1485-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1485');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" checked name="firstname-disabled" id="disabler-1486" type="checkbox" aria-describedby="disabler-1486-messages">
            <label class="fr-label" for="disabler-1486">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1486-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="firstname-disabled-1477-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="married-name-1496" aria-labelledby="married-name-1496-legend married-name-1496-messages">
    <legend class="fr-sr-only" id="married-name-1496-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1498">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1498-messages" name="family-name" autocomplete="family-name" id="family-name-1498" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1498-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="married-1501">
                Nom d'usage
                <span class="fr-hint-text">Ancien nom…</span>
            </label>
            <input class="fr-input" aria-describedby="married-1501-messages" name="married-name" autocomplete="family-name" id="married-1501" spellcheck="false" type="text">
            <div class="fr-messages-group" id="married-1501-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="given-1503">
                Prénom
            </label>
            <input class="fr-input" aria-describedby="given-1503-messages" name="given-name" autocomplete="given-name" id="given-1503" spellcheck="false" type="text">
            <div class="fr-messages-group" id="given-1503-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="married-name-1496-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="married-and-firstname-disabled-1515" aria-labelledby="married-and-firstname-disabled-1515-legend married-and-firstname-disabled-1515-messages">
    <legend class="fr-sr-only" id="married-and-firstname-disabled-1515-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1517">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1517-messages" name="family-name" autocomplete="family-name" id="family-name-1517" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1517-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="married-1520">
                Nom d'usage
                <span class="fr-hint-text">Ancien nom…</span>
            </label>
            <input class="fr-input" aria-describedby="married-1520-messages" name="married-name" autocomplete="family-name" id="married-1520" spellcheck="false" type="text">
            <div class="fr-messages-group" id="married-1520-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1523" disabled aria-labelledby="firstname-fieldset-1523-legend firstname-fieldset-1523-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1523-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1522">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1522-messages" name="given-name" autocomplete="given-name" id="given-1522" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1522-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1523-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1523');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" checked name="firstname-disabled" id="disabler-1524" type="checkbox" aria-describedby="disabler-1524-messages">
            <label class="fr-label" for="disabler-1524">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1524-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="married-and-firstname-disabled-1515-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="button-1536" aria-labelledby="button-1536-legend button-1536-messages">
    <legend class="fr-sr-only" id="button-1536-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1538">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1538-messages" name="family-name" autocomplete="family-name" id="family-name-1538" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1538-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1544" aria-labelledby="firstname-fieldset-1544-legend firstname-fieldset-1544-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1544-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1543">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1543-messages" name="given-name" autocomplete="given-name" id="given-1543" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1543-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-fieldset__element">
                <button class="fr-btn fr-btn--sm fr-icon-add-line fr-btn--icon-left fr-btn--tertiary" onclick="if (this.firstnamesCount === undefined) this.firstnamesCount = 1;
else this.firstnamesCount++;

const getFieldsetElement = (node) => {
  const parent = node.parentNode;
  if (parent.className.indexOf('fr-fieldset__element') > -1) return parent;
  return getFieldsetElement(parent);
};

const firstname = getFieldsetElement(document.getElementById('given-1543'));

const reference = getFieldsetElement(this);

const copy = firstname.cloneNode(true);
copy.innerHTML = copy.innerHTML.replace(/given-1543/g, `given-1543-added-${this.firstnamesCount}`).replace('name=&quot;given-name&quot;', `name=&quot;additional-name-${this.firstnamesCount}&quot;`).replace('autocomplete=&quot;given-name&quot;', 'autocomplete=&quot;additional-name&quot;');
const container = reference.parentNode;
container.insertBefore(copy, reference);
" type="button">
                    Ajouter un prénom
                </button>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1544-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1544');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" name="firstname-disabled" id="disabler-1545" type="checkbox" aria-describedby="disabler-1545-messages">
            <label class="fr-label" for="disabler-1545">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1545-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="button-1536-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="button-and-firstname-disabled-1557" aria-labelledby="button-and-firstname-disabled-1557-legend button-and-firstname-disabled-1557-messages">
    <legend class="fr-sr-only" id="button-and-firstname-disabled-1557-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1559">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1559-messages" name="family-name" autocomplete="family-name" id="family-name-1559" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1559-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1565" disabled aria-labelledby="firstname-fieldset-1565-legend firstname-fieldset-1565-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1565-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1564">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1564-messages" name="given-name" autocomplete="given-name" id="given-1564" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1564-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-fieldset__element">
                <button class="fr-btn fr-btn--sm fr-icon-add-line fr-btn--icon-left fr-btn--tertiary" onclick="if (this.firstnamesCount === undefined) this.firstnamesCount = 1;
else this.firstnamesCount++;

const getFieldsetElement = (node) => {
  const parent = node.parentNode;
  if (parent.className.indexOf('fr-fieldset__element') > -1) return parent;
  return getFieldsetElement(parent);
};

const firstname = getFieldsetElement(document.getElementById('given-1564'));

const reference = getFieldsetElement(this);

const copy = firstname.cloneNode(true);
copy.innerHTML = copy.innerHTML.replace(/given-1564/g, `given-1564-added-${this.firstnamesCount}`).replace('name=&quot;given-name&quot;', `name=&quot;additional-name-${this.firstnamesCount}&quot;`).replace('autocomplete=&quot;given-name&quot;', 'autocomplete=&quot;additional-name&quot;');
const container = reference.parentNode;
container.insertBefore(copy, reference);
" type="button">
                    Ajouter un prénom
                </button>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1565-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1565');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" checked name="firstname-disabled" id="disabler-1566" type="checkbox" aria-describedby="disabler-1566-messages">
            <label class="fr-label" for="disabler-1566">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1566-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="button-and-firstname-disabled-1557-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="name-international-1578" aria-labelledby="name-international-1578-legend name-international-1578-messages">
    <legend class="fr-sr-only" id="name-international-1578-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-select-group">
            <label class="fr-label" for="country-1579">
                Pays
            </label>
            <select class="fr-select" aria-describedby="country-1579-messages" id="country-1579" name="country">
                <option value="" selected disabled hidden>Sélectionner une option</option>
                <option value="FR">France</option>
                <option value="DE">Allemagne</option>
                <option value="IT">Italie</option>
                <option value="ES">Espagne</option>
                <option value="GB">Royaume-Uni</option>
            </select>
            <div class="fr-messages-group" id="country-1579-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1580">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1580-messages" name="family-name" autocomplete="family-name" id="family-name-1580" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1580-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1586" aria-labelledby="firstname-fieldset-1586-legend firstname-fieldset-1586-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1586-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1585">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1585-messages" name="given-name" autocomplete="given-name" id="given-1585" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1585-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1586-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1586');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" name="firstname-disabled" id="disabler-1587" type="checkbox" aria-describedby="disabler-1587-messages">
            <label class="fr-label" for="disabler-1587">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1587-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="name-international-1578-messages" aria-live="assertive">
    </div>
</fieldset>

<fieldset class="fr-fieldset" id="name-international-1599" aria-labelledby="name-international-1599-legend name-international-1599-messages">
    <legend class="fr-sr-only" id="name-international-1599-legend">
        Nom
    </legend>
    <div class="fr-fieldset__element">
        <div class="fr-select-group">
            <label class="fr-label" for="country-1600">
                Pays
            </label>
            <select class="fr-select" aria-describedby="country-1600-messages" id="country-1600" name="country">
                <option value="" selected disabled hidden>Sélectionner une option</option>
                <option value="FR">France</option>
                <option value="DE">Allemagne</option>
                <option value="IT">Italie</option>
                <option value="ES">Espagne</option>
                <option value="GB">Royaume-Uni</option>
            </select>
            <div class="fr-messages-group" id="country-1600-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-input-group">
            <label class="fr-label" for="family-name-1601">
                Nom
            </label>
            <input class="fr-input" aria-describedby="family-name-1601-messages" name="family-name" autocomplete="family-name" id="family-name-1601" spellcheck="false" type="text">
            <div class="fr-messages-group" id="family-name-1601-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-fieldset__element">
        <fieldset class="fr-mb-n4v fr-fieldset" id="firstname-fieldset-1607" disabled aria-labelledby="firstname-fieldset-1607-legend firstname-fieldset-1607-messages">
            <legend class="fr-sr-only" id="firstname-fieldset-1607-legend">
                Prénom(s)
            </legend>
            <div class="fr-fieldset__element">
                <div class="fr-input-group">
                    <label class="fr-label" for="given-1606">
                        Prénom
                    </label>
                    <input class="fr-input" aria-describedby="given-1606-messages" name="given-name" autocomplete="given-name" id="given-1606" spellcheck="false" type="text">
                    <div class="fr-messages-group" id="given-1606-messages" aria-live="assertive">
                    </div>
                </div>
            </div>
            <div class="fr-messages-group" id="firstname-fieldset-1607-messages" aria-live="assertive">
            </div>
        </fieldset>
    </div>
    <div class="fr-fieldset__element">
        <div class="fr-checkbox-group fr-checkbox-group--sm">
            <input onclick="const fieldset = document.getElementById('firstname-fieldset-1607');
if (this.checked) fieldset.setAttribute('disabled', '');
else fieldset.removeAttribute('disabled');
" checked name="firstname-disabled" id="disabler-1608" type="checkbox" aria-describedby="disabler-1608-messages">
            <label class="fr-label" for="disabler-1608">
                Je n'ai pas de prénom
            </label>
            <div class="fr-messages-group" id="disabler-1608-messages" aria-live="assertive">
            </div>
        </div>
    </div>
    <div class="fr-messages-group" id="name-international-1599-messages" aria-live="assertive">
    </div>
</fieldset>